npm i --save @oneschema/react

import React, { useState } from "react"
import OneSchemaImporter from "@oneschema/react"

function OneSchemaExample() {
  const [isOpen, setIsOpen] = useState(false)

  const handleData = (data) => {
    console.log(data)
  }

  return (
    <div>
      <button onClick={() => setIsOpen(true)}>Import</button>

      <OneSchemaImporter
        /* managing state from your application */
        isOpen={isOpen}
        onRequestClose={() => setIsOpen(false)}
        /* required config values */
        clientId={clientId}
        userJwt={token}
        templateKey={templateKey}
        /* optional config values */
        importConfig={{ type: "local", metadataOnly: false, }}
        devMode={process.env.NODE_ENV !== "production"}
        className="oneschema-importer"
        style={{
          position: "fixed",
          top: 0,
          left: 0,
          width: "100vw",
          height: "100vh",
          zIndex: 1000,
        }}
        /* handling results */
        onSuccess={handleData}
        onCancel={() => console.log("cancelled")}
        onError={(error) => console.log(error)}
      />
    </div>
  )
}

 <OneSchemaImporter
  /* managing state from your application */
  isOpen={isOpen}
  onRequestClose={() => setIsOpen(false)}
  /* required config values */
  clientId={clientId}
  sessionToken={token}
  devMode={process.env.NODE_ENV !== "production"}
  className="oneschema-importer"
  style={{
     position: "fixed",
     top: 0,
     left: 0,
     width: "100vw",
     height: "100vh",
  }}
  /* handling results */
  onSuccess={handleData}
  onCancel={() => console.log("cancelled")}
  onError={(error) => console.log(error)}
/>