skills.rest
daangn
daangnOFFICIAL
Explore all skills by this author →
Website𝕏@daangnteamGitHub

seed-api-parity

Compares React and Lynx public APIs of SEED Design components to detect parity gaps.

1.1k|89|Updated Mar 11, 2021
Search Tags:#static analysis#lynx#Design system#api parity#reAct#Cross-Platform#component comparison
One-click install
npx skills add https://github.com/daangn/seed-design --skill seed-api-parity
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: seed-api-parity
Source: https://github.com/daangn/seed-design/tree/main/skills/seed-api-parity
Command: npx skills add https://github.com/daangn/seed-design --skill seed-api-parity

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) components.

What problem does it solve?

When maintaining a design system that ships components to both React (browser DOM) and Lynx (native renderer), it is hard to know whether both platforms expose the same exports, props, slots, variants, states, events, and accessibility surface. This Skill statically compares the two public surfaces of a single component in the current checkout and separates genuine implementation gaps from expected platform constraints.

Core Features & Use Cases

  • Cross-platform API comparison: Reads the component's real implementation, public API, Recipe, Registry, and documentation paths for both React and Lynx, then reports common values, reactOnly, and lynxOnly per dimension with confidence levels (confirmed, partial, unknown).
  • Platform difference classification: Distinguishes documented Lynx platform constraints (no asChild/Slot composition, native accessibility-* properties instead of ARIA, accessibility-heading instead of heading levels, no keyboard focus model, no CSS media queries) from differences that still need manual review.
  • Conservative confidence handling: When props use extends, Omit, or inherited external types, it downgrades affected dimensions to unknown instead of falsely declaring gaps.
  • Use Case: Before adding a new prop to ProgressCircle, run the parity check to confirm whether React and Lynx currently expose the same props and whether any existing difference is an intentional platform constraint.

Quick Start

Ask the AI to run the seed-api-parity comparison for a component such as ProgressCircle and summarize which differences are expected platform constraints versus ones needing review.

Frequently Asked Questions about seed-api-parity

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I compare React and Lynx component APIs in SEED Design?▼

Run the api-parity script from the repository root with a component name, for example: bun skills/seed-api-parity/scripts/api-parity.ts ProgressCircle. The JSON result lists per-dimension common values, reactOnly, lynxOnly, and platform difference classifications.

What does the seed-api-parity script actually compare?▼

It compares exports, props, variants, slots, state, events, accessibility attributes, Registry registration, and documentation presence between the React and Lynx implementations of one component. Each dimension includes evidence file paths and a confidence level.

Does a missing Lynx prop always mean an unimplemented feature?▼

No. Differences like asChild, ARIA attributes, headingLevel, keyboard focus, and CSS media queries can be expected Lynx platform constraints when documented in source or docs. The expected list records these, while needsReview keeps one-sided observations for manual judgment.

Why does the report show confidence unknown for props?▼

Props confidence becomes unknown when the Props type uses extends, Omit, or inherited external types, or when one platform's public API source is missing. The script avoids declaring differences it cannot fully observe, so unknown values must be checked manually.

Does the parity check modify any repository files?▼

No. The script is strictly read-only: it only reads implementation, public API, Recipe, Registry, and documentation files inside the repository and refuses to read paths outside the repository root.

Related Skills

Explore More Software Engineering Skills→
bitsocialnetbitsocialnet
1

inspect-elements

Resolve DOM nodes to React source files and ownership stacks.

Official
Intermediate
adobeadobe
1.5k

migration-api

Migrate properties, methods, and types from 1st-gen to 2nd-gen components.

Official
Advanced
HDeiblerHDeibler
6

ockhams-equivalent-designs

Compare design alternatives for functional equivalence across user goals and edge cases.

Community
Intermediate
bkinsey808bkinsey808

react-conventions

Enforce React Compiler-friendly patterns with TypeScript prop typing and Zustand references.

Community
Advanced