accounts 0.7.2 → 0.8.1

package/src/core/adapters/local.ts

@@ -119,7 +119,7 @@ export function local(options: local.Options): Adapter.Adapter {
               message: '`createAccount` not configured on adapter.',
             })
           const { authorizeAccessKey: grantOptions, ...rest } = parameters
-          const { accounts, signature } = await createAccount(rest)
+          const { accounts, email, signature, username } = await createAccount(rest)
 
           // Hydrate the first account for signing. Must be done here (not via
           // the store) because accounts aren't merged into the store until
@@ -137,7 +137,7 @@ export function local(options: local.Options): Adapter.Adapter {
             return await signKeyAuthorization(account, prepared)
           })()
 
-          return { accounts, keyAuthorization, signature: signature_ }
+          return { accounts, email, keyAuthorization, signature: signature_, username }
         },
         async authorizeAccessKey(parameters) {
           const prepared = await prepareKeyAuthorization(parameters)
@@ -164,7 +164,7 @@ export function local(options: local.Options): Adapter.Adapter {
 
           // Pass the prepared digest (or the caller's) into loadAccounts so
           // the ceremony can sign it in a single biometric prompt.
-          const { accounts, signature } = await loadAccounts({ ...rest, digest })
+          const { accounts, email, signature, username } = await loadAccounts({ ...rest, digest })
 
           // Hydrate here (not from the store) — same reason as createAccount.
           // Guard against empty accounts (e.g. user cancelled the ceremony).
@@ -181,7 +181,7 @@ export function local(options: local.Options): Adapter.Adapter {
                 })
               : undefined
 
-          return { accounts, keyAuthorization, signature: signature_ }
+          return { accounts, email, keyAuthorization, signature: signature_, username }
         },
         async revokeAccessKey(parameters) {
           AccessKey.revoke({

package/src/core/adapters/webAuthn.ts

@@ -39,7 +39,7 @@ export function webAuthn(options: webAuthn.Options = {}): Adapter.Adapter {
         const rpId = options.publicKey?.rp.id
         if (!rpId) throw new Error('rpId is required')
         const credential = await Registration.create({ options })
-        const { publicKey } = await ceremony.verifyRegistration(credential, {
+        const { publicKey, email, username } = await ceremony.verifyRegistration(credential, {
           name: parameters.name,
         })
         await storage.setItem('lastCredentialId', credential.id)
@@ -48,10 +48,13 @@ export function webAuthn(options: webAuthn.Options = {}): Adapter.Adapter {
           accounts: [
             {
               address: account.address,
+              label: parameters.name,
               keyType: 'webAuthn',
               credential: { id: credential.id, publicKey, rpId },
             },
           ],
+          email,
+          username,
         }
       },
       async loadAccounts(parameters = {}) {
@@ -73,7 +76,7 @@ export function webAuthn(options: webAuthn.Options = {}): Adapter.Adapter {
         if (!rpId) throw new Error('rpId is required')
 
         const response = await Authentication.sign({ options })
-        const { publicKey } = await ceremony.verifyAuthentication(response)
+        const { publicKey, email, username } = await ceremony.verifyAuthentication(response)
 
         await storage.setItem('lastCredentialId', response.id)
 
@@ -99,7 +102,9 @@ export function webAuthn(options: webAuthn.Options = {}): Adapter.Adapter {
               credential: { id: response.id, publicKey, rpId },
             },
           ],
+          email,
           signature,
+          username,
         }
       },
     })(parameters)

package/src/core/zod/rpc.ts

@@ -73,6 +73,7 @@ export const transactionRequest = z.object({
   chainId: z.optional(u.number()),
   data: z.optional(u.hex()),
   feePayer: z.optional(z.union([z.boolean(), z.string()])),
+  feePayerSignature: z.optional(z.record(z.string(), z.unknown())),
   feeToken: z.optional(u.address()),
   from: z.optional(u.address()),
   gas: z.optional(u.bigint()),
@@ -345,7 +346,7 @@ export namespace wallet_getCapabilities {
 export namespace wallet_authorizeAccessKey {
   export const parameters = z.object({
     address: z.optional(u.address()),
-    chainId: z.optional(u.number()),
+    chainId: z.optional(u.bigint()),
     expiry: z.number(),
     keyType: z.optional(keyType),
     limits: z.optional(
@@ -441,8 +442,10 @@ export namespace wallet_connect {
       ]),
     ),
     result: z.object({
+      email: z.optional(z.nullable(z.string())),
       keyAuthorization: z.optional(keyAuthorization),
       signature: z.optional(u.hex()),
+      username: z.optional(z.nullable(z.string())),
     }),
   }
 
@@ -546,6 +549,7 @@ export namespace wallet_deposit {
         z.object({
           address: z.optional(u.address()),
           chainId: z.optional(u.number()),
+          displayName: z.optional(z.string()),
           token: z.optional(u.address()),
           value: z.optional(z.string()),
         }),

package/src/react/Remote.ts

@@ -40,6 +40,7 @@ export function useEnsureVisibility(
 
     const observer = new IntersectionObserver(
       (entries) => {
+        if (document.visibilityState === 'hidden') return
         const entry = entries[0]
         if (!entry) return
         const isVisible =
@@ -78,6 +79,81 @@ export function useState(
   return useStore(remote.store, selector as never)
 }
 
+const bundledFonts = new Set(['Pilat', 'TT Norms', 'iA Writer Quattro'])
+
+/** Applies theme overrides from URL search params and live messenger updates. */
+export function useTheme(remote?: CoreRemote.Remote | undefined) {
+  useEffect(() => {
+    if (typeof window === 'undefined') return
+
+    const params = new URLSearchParams(window.location.search)
+    applyTheme({
+      accent: params.get('accent') ?? undefined,
+      radius: params.get('radius') ?? undefined,
+      font: params.get('font') ?? undefined,
+      scheme: params.get('scheme') ?? undefined,
+    })
+
+    return () => clearTheme()
+  }, [])
+
+  useEffect(() => {
+    if (!remote) return
+    return remote.messenger.on('theme', (payload) => {
+      clearTheme()
+      applyTheme(payload)
+    })
+  }, [remote])
+}
+
+/** Applies theme values to the document root. */
+function applyTheme(theme: {
+  accent?: string | undefined
+  radius?: string | undefined
+  font?: string | undefined
+  scheme?: string | undefined
+}) {
+  const root = document.documentElement
+  const { accent, radius, font, scheme } = theme
+
+  if (accent) {
+    const isHex = accent.startsWith('#')
+    root.setAttribute('data-accent', isHex ? 'custom' : accent)
+    if (isHex) root.style.setProperty('--accent-base', accent)
+  }
+  if (scheme) root.style.colorScheme = scheme
+  if (radius) root.setAttribute('data-radius', radius)
+  if (font) {
+    root.setAttribute('data-font', font === 'System' ? 'system' : font)
+    if (font === 'System') {
+      root.style.setProperty('--font-body', 'ui-sans-serif, system-ui, sans-serif')
+      return
+    }
+    if (!bundledFonts.has(font)) {
+      const id = `gf-${font.replace(/\s/g, '-')}`
+      if (!document.getElementById(id)) {
+        const link = document.createElement('link')
+        link.id = id
+        link.rel = 'stylesheet'
+        link.href = `https://fonts.googleapis.com/css2?family=${encodeURIComponent(font)}:wght@400;500;600&display=swap`
+        document.head.appendChild(link)
+      }
+    }
+    root.style.setProperty('--font-body', `'${font}', sans-serif`)
+  }
+}
+
+/** Removes all theme overrides from the document root. */
+function clearTheme() {
+  const root = document.documentElement
+  root.removeAttribute('data-accent')
+  root.removeAttribute('data-radius')
+  root.removeAttribute('data-font')
+  root.style.removeProperty('color-scheme')
+  root.style.removeProperty('--accent-base')
+  root.style.removeProperty('--font-body')
+}
+
 export declare namespace useEnsureVisibility {
   type Options = {
     /** Whether visibility monitoring is enabled. @default true */

package/src/react-native/Provider.test.ts

@@ -91,7 +91,7 @@ describe('create', () => {
         expiry: Math.floor(Date.now() / 1000) + 3600,
       }),
       chains: [chain],
-      host: 'https://wallet.tempo.xyz',
+      host: 'https://wallet-next.tempo.xyz',
       open: browser.open,
       redirectUri: 'accounts-playground://auth',
       secureStorage,

package/src/react-native/Provider.ts

@@ -3,7 +3,15 @@ import { reactNative } from './adapter.js'
 
 /** Creates a provider for React Native apps using system browser authentication. */
 export function create(options: create.Options): create.ReturnType {
-  const { host = 'https://wallet.tempo.xyz', redirectUri, open, secureStorage, ...rest } = options
+  const {
+    // TODO: use the new host
+    // host = 'https://wallet-next.tempo.xyz',
+    host = 'https://wallet.tempo.xyz',
+    redirectUri,
+    open,
+    secureStorage,
+    ...rest
+  } = options
 
   return CoreProvider.create({
     ...rest,

package/src/react-native/adapter.ts

@@ -408,7 +408,7 @@ export function reactNative(options: reactNative.Options): Adapter.Adapter {
 
 export declare namespace reactNative {
   export type Options = {
-    /** Host URL for the mobile auth page. @default "https://wallet.tempo.xyz" */
+    /** Host URL for the mobile auth page. @default "https://wallet-next.tempo.xyz" */
     host: string
     /** Provider display name. @default "Tempo Mobile" */
     name?: string | undefined
@@ -491,6 +491,8 @@ function buildAuthUrl(
     state: string
   },
 ): string {
+  // TODO: use the new host
+  // const url = new URL('/remote/auth/mobile', host)
   const url = new URL('/mobile-auth', host)
   url.searchParams.set('pubKey', params.pubKey)
   if (params.keyType) url.searchParams.set('keyType', params.keyType)

package/src/server/CliAuth.ts

@@ -361,6 +361,10 @@ export const Policy = {
 /**
  * Instantiates a CLI auth helper with shared defaults and cached clients.
  *
+ *
+ * @param {from.Options} options - Shared CLI auth defaults.
+ * @returns {CliAuth} CLI auth helper.
+ *
  * @example
  * ```ts
  * import { CliAuth } from 'accounts/server'
@@ -370,10 +374,10 @@ export const Policy = {
  * })
  *
  * const created = await cli.createDeviceCode({ request })
+ * const authorized = await cli.authorize({ request })
+ * const polled = await cli.poll({ request })
+ * const pending = await cli.pending({ code })
  * ```
- *
- * @param options - Shared CLI auth defaults.
- * @returns CLI auth helper.
  */
 export function from(options: from.Options = {}): CliAuth {
   const cache = createClientCache(options)
@@ -556,8 +560,25 @@ export declare namespace from {
 /**
  * Creates and stores a new device code.
  *
- * @param options - Shared defaults plus the incoming request.
- * @returns Created device code.
+ * @param {createDeviceCode.Options} options - Shared defaults plus the incoming request.
+ * @returns {Promise<createDeviceCode.ReturnType>} Created device code.
+ *
+ * @example
+ * ```ts
+ * import { Hono } from 'hono'
+ * import { CliAuth } from 'accounts/server'
+ * import { zValidator } from '@hono/zod-validator'
+ *
+ * export default new Hono<{ Bindings: Cloudflare.Env }>()
+ *   // ... other routes (`/authorize`, `/poll:code`, `/pending:code`)
+ *   .post('/code',
+ *    zValidator('json', CliAuth.createRequest),
+ *    async (c) => {
+ *      const request = c.req.valid('json')
+ *      const result = await CliAuth.createDeviceCode({ request })
+ *      return c.json(z.encode(CliAuth.createResponse, result))
+ *    })
+ * ```
  */
 export async function createDeviceCode(
   options: createDeviceCode.Options,
@@ -583,8 +604,24 @@ export declare namespace createDeviceCode {
 /**
  * Looks up a pending device code for browser approval UIs.
  *
- * @param options - Shared defaults plus the pending lookup parameters.
- * @returns Pending device-code payload.
+ * @param {pending.Options} options - Shared defaults plus the pending lookup parameters.
+ * @returns {Promise<pending.ReturnType>} Pending device-code payload.
+ *
+ * @example
+ * ```ts
+ * import { Hono } from 'hono'
+ * import { CliAuth } from 'accounts/server'
+ * import { zValidator } from '@hono/zod-validator'
+ *
+ * export default new Hono<{ Bindings: Cloudflare.Env }>()
+ *   // ... other routes (`/code`, `/authorize`, `/poll:code`)
+ *   .get('/pending:code',
+ *    zValidator('param', z.object({ code: z.string() })),
+ *    async (c) => {
+ *      const code = c.req.param('code')
+ *      const result = await CliAuth.pending({ code })
+ *      return c.json(z.encode(CliAuth.pendingResponse, result))
+ *    })
  */
 export async function pending(options: pending.Options): Promise<pending.ReturnType> {
   const { code, ...rest } = options
@@ -608,8 +645,25 @@ export declare namespace pending {
 /**
  * Polls a device code with PKCE verification.
  *
- * @param options - Shared defaults plus the poll parameters.
- * @returns Pending, authorized, or expired poll response.
+ * @param {poll.Options} options - Shared defaults plus the poll parameters.
+ * @returns {Promise<poll.ReturnType>} Pending, authorized, or expired poll response.
+ *
+ * @example
+ * ```ts
+ * import { Hono } from 'hono'
+ * import { CliAuth } from 'accounts/server'
+ * import { zValidator } from '@hono/zod-validator'
+ *
+ * export default new Hono<{ Bindings: Cloudflare.Env }>()
+ *   // ... other routes (`/code`, `/authorize`, `/pending:code`)
+ *   .post('/poll:code',
+ *    zValidator('json', CliAuth.pollRequest),
+ *    async (c) => {
+ *      const request = c.req.valid('json')
+ *      const result = await CliAuth.poll({ request })
+ *      return c.json(z.encode(CliAuth.pollResponse, result))
+ *    })
+ * ```
  */
 export async function poll(options: poll.Options): Promise<poll.ReturnType> {
   const { code, request, ...rest } = options
@@ -635,8 +689,25 @@ export declare namespace poll {
 /**
  * Authorizes a pending device code after validating the signed key authorization.
  *
- * @param options - Shared defaults plus the authorization request.
- * @returns Authorized response body.
+ * @param {authorize.Options} options - Shared defaults plus the authorization request.
+ * @returns {Promise<authorize.ReturnType>} Authorized response body.
+ *
+ * @example
+ * ```ts
+ * import { Hono } from 'hono'
+ * import { CliAuth } from 'accounts/server'
+ * import { zValidator } from '@hono/zod-validator'
+ *
+ * export default new Hono<{ Bindings: Cloudflare.Env }>()
+ *   // ... other routes (`/code`, `/poll:code`, `/pending:code`)
+ *   .post('/authorize',
+ *    zValidator('json', CliAuth.authorizeRequest),
+ *    async (c) => {
+ *      const request = c.req.valid('json')
+ *      const result = await CliAuth.authorize({ request })
+ *      return c.json(z.encode(CliAuth.authorizeResponse, result))
+ *    })
+ * ```
  */
 export async function authorize(options: authorize.Options): Promise<authorize.ReturnType> {
   const { client, request, ...rest } = options

package/src/server/internal/handlers/codeAuth.ts

@@ -15,8 +15,8 @@ import { type Handler, from } from '../../Handler.js'
  * - `POST /auth/pkce/poll/:code`
  * - `POST /auth/pkce`
  *
- * @param options - Options.
- * @returns Request handler.
+ * @param {codeAuth.Options} options - Options.
+ * @returns {Handler} Request handler.
  */
 export function codeAuth(options: codeAuth.Options = {}): Handler {
   const {