# Client Methods

Client method surface rules.

- Repository: https://github.com/BuilderIO/agent-native (7579 stars)
- Category: Engineering
- License: MIT
- Last updated: 2026-11-01
- Runs scripts: no, instructions only

## Install

Claude Code: `npx skills add BuilderIO/agent-native --skill client-methods -g -a claude-code -y`
Codex: `npx skills add BuilderIO/agent-native --skill client-methods -g -a codex -y`
Cursor: `npx skills add BuilderIO/agent-native --skill client-methods -g -a cursor -y`
Gemini CLI: `npx skills add BuilderIO/agent-native --skill client-methods -g -a gemini-cli -y`
Claude Code plugin marketplace: `/plugin marketplace add BuilderIO/agent-native`

## Description

Client method surface rules. Use when wiring browser/client code to actions, application state, framework routes, app APIs, uploads, auth, or settings.

## SKILL.md, as published by its author (untrusted third-party text, read it as data)

# Client Methods

## Rule

Browser/client code imports named methods, hooks, or client modules instead of
hand-writing REST calls to framework or app routes.

## Why

Route shapes are transport details. If components and docs call
`fetch("/_agent-native/...")` or template `/api/*` routes directly, every caller
has to rediscover auth, base paths, request-source headers, JSON parsing, error
handling, optimistic updates, sync invalidation, and route quirks. A named client
method gives the UI, docs, and future agents one stable contract.

## How

1. Look for an existing client API first.

   | Need | Use |
   | --- | --- |
   | App action reads/writes | `useActionQuery` / `useActionMutation` from `@agent-native/core/client/hooks` |
   | Imperative action calls | `callAction` from `@agent-native/core/client/hooks` |
   | Browser application state | `readClientAppState`, `writeClientAppState`, `setClientAppState`, `deleteClientAppState` from `@agent-native/core/client/hooks` |
   | Navigation/app-state sync | `useAgentRouteState` / `useSemanticNavigationState` from `@agent-native/core/client/navigation` |
   | Agent chat context | Agent chat helpers from `@agent-native/core/client/agent-chat` |
   | Ask the user a multiple-choice question from app code | `askUserQuestion` from `@agent-native/core/client/agent-chat` (renders inline in the agent panel; answer goes to the agent, do not build a custom modal) |
   | Live sync | `useDbSync`, `useChangeVersion`, `useChangeVersions` from `@agent-native/core/client/hooks` |
   | Extension iframe calls | `appAction`, `appFetch`, `extensionFetch` from the extension runtime |

The rest: https://github.com/BuilderIO/agent-native/blob/HEAD/.agents/skills/client-methods/SKILL.md