@tempoxyz/auth 0.0.0-pr-7.sha-59fc900 → 0.0.0-pr-9.sha-9005488

package/README.md

@@ -43,9 +43,10 @@ pnpm add @tempoxyz/auth viem
 
 ## Before you start
 
-- **Register the app.** Add it to Tempo Auth's `apps.config.ts`, with every redirect URI it uses, and mark it `headless` if it calls Tempo Auth from its own page. Merging creates its WorkOS Connect app, whose `client_id` is the `clientId` you pass to `Auth.create`. An app with a backend also needs a client secret from the WorkOS dashboard.
+- **Register the app.** Create a WorkOS Connect app in the Tempo Issuer environment, and register every redirect URI it uses. Its `client_id` is the `clientId` you pass to `Auth.create`. An app with a backend also gets a client secret.
+- **Allow the app's origin.** Apps that call Tempo Auth from their own page need their origin in Tempo Auth's `INTERNAL_ORIGINS`. A mobile app has no origin, and registers its custom scheme as its redirect URI instead.
 
-The CLI device grant needs no registration. It signs in as Tempo Auth's own `tempo-cli` app.
+The CLI device grant needs neither. It signs in as Tempo Auth's own `tempo-cli` app.
 
 ## Access keys
 
@@ -100,6 +101,37 @@ const authorization = await Actions.handleRedirect(auth)
 
 `redirect` keeps its state in session storage until the browser returns. Pass `storage` to `Auth.create` to keep it elsewhere.
 
+### A mobile app
+
+For a React Native or Expo app. It calls the same actions as a browser app, with no `Origin`, and opens Tempo Auth's pages in the system browser, which returns to the app's custom scheme. Import `react-native-get-random-values` first, since keys need `crypto.getRandomValues`.
+
+```ts
+import * as WebBrowser from 'expo-web-browser'
+
+const auth = Auth.create({
+  clientId: 'client_…',
+  redirectUri: 'my-app://callback',
+  url: 'https://auth.tempo.xyz',
+})
+
+// Your own sign-in UI, as in a browser.
+await Actions.sendCode(auth, { email })
+const result = await Actions.verifyCode(auth, { accessKey, code, email })
+
+// Or Tempo Auth's pages, which also offer Google and SSO.
+const { pending, url } = await Actions.createAuthorizationUrl(auth, {
+  accessKey,
+})
+const session = await WebBrowser.openAuthSessionAsync(url, auth.redirectUri)
+if (session.type === 'success')
+  authorization = await Actions.handleCallback(auth, {
+    pending,
+    url: session.url,
+  })
+```
+
+Keep the authorization in the device's secure store, as [Keep a sign-in](#keep-a-sign-in) describes.
+
 ### A backend
 
 For an app whose server holds a client secret. The server builds the URL, keeps the pending state until the callback, and redeems the code itself.

package/dist/Actions.js

@@ -108,7 +108,8 @@ export async function createAuthorizationUrl(auth, options) {
     const pending = {
         privateKey: Secp256k1.randomPrivateKey(),
         redirectUri,
-        state: crypto.randomUUID(),
+        // `Bytes.random` needs only `crypto.getRandomValues`, which React Native polyfills.
+        state: Base64.fromBytes(Bytes.random(16), base64url),
         verifier: Base64.fromBytes(Bytes.random(32), base64url),
     };
     const { client_id, keyAuthorization, scope } = request(auth, {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tempoxyz/auth",
-  "version": "0.0.0-pr-7.sha-59fc900",
+  "version": "0.0.0-pr-9.sha-9005488",
   "description": "Signs users in to Tempo through Tempo Auth, and returns viem access key accounts on their Tempo Accounts.",
   "type": "module",
   "exports": {