npm install @permissionless-technologies/upc-sdk

import { ASPProvider } from '@permissionless-technologies/upc-sdk/react'
import { RESTProvider } from '@permissionless-technologies/upc-sdk/providers'

function App() {
  return (
    <ASPProvider
      registryAddress="0x..."
      provider={new RESTProvider({ url: 'https://my-asp.example.com/api' })}
    >
      <YourApp />
    </ASPProvider>
  )
}

import { useASP } from '@permissionless-technologies/upc-sdk/react'

function ComplianceGate({ aspId }: { aspId: bigint }) {
  const {
    isChecking,        // boolean — loading
    isMember,          // boolean | undefined — undefined while loading
    proof,             // Proof | null
    generateProof,     // () => Promise<Proof>
    error,             // Error | null
  } = useASP({ aspId })

  if (isChecking) return <div>Checking compliance status...</div>

  if (!isMember) {
    return (
      <div>
        <p>You are not approved for this ASP.</p>
        <p>Contact the ASP operator to request approval.</p>
      </div>
    )
  }

  if (!proof) {
    return (
      <button onClick={generateProof}>
        Generate Compliance Proof
      </button>
    )
  }

  return (
    <div>
      <p>Compliance proof ready.</p>
      <CompliantAction proof={proof} />
    </div>
  )
}

import { useASPRegistry } from '@permissionless-technologies/upc-sdk/react'

function ASPList() {
  const { asps, isLoading } = useASPRegistry()

  if (isLoading) return <div>Loading ASPs...</div>

  return (
    <ul>
      {asps.map(asp => (
        <li key={asp.id.toString()}>
          {asp.name} — {asp.description}
        </li>
      ))}
    </ul>
  )
}