Skip to content
Mobile
Skill

/api-design

Design and review predictable public APIs for TypeScript, JavaScript, React, and React Native libraries. Use when shaping exported functions, classes, hooks, options objects, event and listener APIs, error behavior, naming, cross-platform abstractions, or JS-only packages. Pair

BOOST
From plugin
react-native-skills
1789 skills
Install
$ npx -y skills add margelo/react-native-skills --skill api-design --agent claude-code

How it fires

How this skill gets triggered: by you, by Claude, or both.

  • Fires itselfAuto-invocation. Claude auto-loads it when your prompt matches the work.Auto-invocation is when the right skill fires by itself at the right moment, driven by a FLOW.md router and a hook, instead of you invoking it by name. It is the difference between a skill being installed and a skill actually getting used.Read the full definition →
  • You can call itInvoke it directly when you want it.
  • Slash command/api-design

Context preview

The summary Claude sees to decide when to auto-load this skill.

Design and review predictable public APIs for TypeScript, JavaScript, React, and React Native libraries. Use when shaping exported functions, classes, hooks, options objects, event and listener APIs, error behavior, naming, cross-platform abstractions, or JS-only packages. Pair

SKILL.md

api-design.SKILL.md
name: api-design
description: Design and review predictable public APIs for TypeScript, JavaScript, React, and React Native libraries. Use when shaping exported functions, classes, hooks, options objects, event and listener APIs, error behavior, naming, cross-platform abstractions, or JS-only packages. Pair with build-nitro-modules when the library is backed by Nitro.

API Design

Use this skill before implementation or when reviewing a public API surface. Target explicit types, stable semantics, and no irrelevant internals in the public contract.

If the library is a Nitro Module, use this skill for the public TypeScript and React API shape first, then use `build-nitro-modules` for Nitro-specific spec, native-state, and binding constraints. If the library is JS-only, React-only, or React Native JS-only, stay in this skill.

Workflow

1. Sketch the user-facing TypeScript API before implementing internals. 2. Write 2-3 realistic call-site examples, including error and cleanup paths. 3. Check the surface against the rules below. 4. Verify the exported TypeScript with the repo's typecheck/lint/docs tooling before treating the API as done. 5. Implement only after the public shape is coherent and verified.

API Freshness

Before choosing public API shape, dependency APIs, platform capabilities, or implementation strategy, verify current official sources instead of relying on trained memory. Library, React, React Native, platform, and tooling APIs evolve quickly.

  • Prefer official docs, source repositories, release notes, changelogs, package READMEs, and current package metadata.
  • Look for `llms.txt` or `llms-full.txt` on official docs sites when available, and use those as compact current context.
  • Treat remembered API details as a starting hypothesis only. If current docs or source disagree, follow the current docs/source and mention the change when relevant.
  • Avoid designing against stale blog posts, old snippets, or outdated trained assumptions when an official current source is available.

API Shape Rules

  • Prefer a single source of truth. Do not split related state across booleans and dependent values when one typed value can express the state. Prefer `timeoutMs?: number` over `enableTimeout: boolean` plus `timeoutMs?: number`.
  • Use option objects or named structs once a function has 3 or more parameters, parameters of the same primitive type, or values that are likely to grow.
  • Keep APIs specific instead of accepting every possible input shape. A millisecond timeout should be a `number`, not `number | string | bigint | object | null`.
  • Avoid giant "does everything" objects. Split by domain or lifecycle when responsibilities differ.
  • Before simplifying or redesigning an API, inventory the workflows the feature is supposed to support. Do not silently drop a workflow, such as a live session API, because a one-shot path is easier to implement. Split workflows into separate APIs when needed.
  • Prefer literal unions, discriminated unions, interfaces, and typed option groups when the valid states are known. In TypeScript libraries, prefer string literal unions over runtime `enum`s unless consumers need a runtime value.
  • Avoid untyped dictionaries, boolean clusters, stringly typed commands, and loosely shaped events when the valid states are known.
  • Do not model a binary option as an optional two-case string union such as `'enabled' | 'disabled'`. If omitted means "use the default" and provided means true/false, use an optional boolean and document the default.
  • Do not represent multiple object states as one interface full of optional fields. Use a discriminated union, inheritance, or separate variant interfaces so impossible field combinations are unrepresentable.
  • Keep related fields together on the variant where they are required. If `barcode` and `barcodeType` only make sense together, both should be nonoptional on `ScannedBarcode`, not optional on a generic `ScannedData`.
  • If you create variant interfaces, use them in the actual public type. Do not define `RecognizedTextDataType` and `RecognizedBarcodeDataType` but keep `recognizedDataTypes: RecognizedDataType[]` where `RecognizedDataType` still contains every variant field as optional.
  • Use `undefined` or optional fields for absence. Use `null` only when "explicit none" means something different from "not provided".
  • Prefer discriminated unions for state machines, loading states, and result variants.
  • Model user intent separately from resolved state when negotiation is involved. For example, an ordered array of constraint objects can express priorities, while a resolved config object reports what the platform actually selected.
  • For complex negotiation, prefer ranked constraints or preference objects over exposing a combinatorial support matrix. Let callers describe intent, resolve the closest working configuration internally, and expose the resolved configuration through a return value, callback, or explicit resolver method.
  • Expose common presets as `as const satisfies Record<string, Type>` objects. Keep the accepted type structural so users can provide their own values.
  • Do not expose ambient facts the caller already knows, such as a `platform` field that only repeats `Platform.OS`, unless the API can return data produced by a different platform than the current runtime.
  • Do not freeze today's platform support matrix into the type shape. Prefer runtime capability fields such as `availableTextTypes: []` or `supportedFormats: []` over separate platform-specific types or static exclusions. This lets newer native capabilities become available without redesigning the JS API.
  • Prefer one unified options object. Avoid `ios`/`android` option bags and platform-prefixed methods unless the concepts are genuinely platform-only and cannot be described as a cross-platform capability or no-op.
  • Classify configuration fields as either requirements or preferences. Throw when a requirement cannot be met. Treat p
Read more
Ships withreact-native-skills

The best react-native Agent Skills. Forget 10x, this is 100x.

Get the whole plugin

Other skills on react-native-skills.