01
Start here
Use the quickstart for a first installation, then move to the guide for your rendering stack.
QuickstartInstall the bootstrap, gate one purpose, and verify the result.Managed UIUse Pact’s accessible consent interface.Web ComponentsUse native elements in any browser framework.React and headlessUse context and hooks, or own the entire interface.iOS SDKUse managed SwiftUI or the headless Swift client.Android SDKUse managed Compose or the headless Kotlin client.
02
Install the browser client
Purpose-bound content stays absent until the shared state allows it.
pnpm add @pact/web @pact/runtimetypescript
import { definePactElements } from '@pact/web'
definePactElements()
<pact-gate purpose="analytics">
<analytics-dashboard></analytics-dashboard>
</pact-gate>
<pact-preferences-button>
Privacy choices
</pact-preferences-button>03
Framework guides
Each adapter consumes the same browser contract; there is no second consent engine inside a framework package.