mirror of https://github.com/Kong/insomnia.git synced 2026-07-30 17:26:28 -04:00

Files

Curry Yang 02ddedb538 Feat/basic components m0 (#10230 )

* refactor: components infra

* fix

* fix: data-* class

* rename cn to cls

2026-07-15 09:30:21 +00:00

1.5 KiB

Raw Permalink Blame History

AGENTS.md — Component Docs Site (Docusaurus + MDX)

Docs for Insomnia's shared component library. Prefer the component-docs skill for authoring — it carries the template and full procedure. This file is the quick reference for direct edits.

Structure

One MDX file per component: docs/Components/<name>.mdx (kebab-case).
Sidebar is autogenerated from the folder — do NOT edit sidebars.ts. Order via sidebar_position in frontmatter.
Reference doc for format/tone: docs/Components/button.mdx.

Doc format (per file)

Frontmatter: id, sidebar_label, sidebar_position.
# Title + one-line description.
## Props table (prop / type / default / description) + link to the underlying React Aria props page.
## Usage Examples — ```tsx live blocks (live-editable). Wrap multiple elements in a function.
## Styling → ### CSS Variables (color vars consumed) + any theme--* scope class note.

⚠️ Live examples need ReactLiveScope registration

```tsx live blocks resolve component names from src/theme/ReactLiveScope/index.ts, NOT from MDX imports. Any component used in a live block must be imported there and added to the ReactLiveScope object. Library components import from the barrel as insomnia/src/basic-components.

Commands

cd packages/insomnia-component-docs
npm run start   # local preview while writing
npm run build   # verify (catches broken live blocks / bad imports)

1.5 KiB Raw Permalink Blame History