Files
orca/examples/plugins/components-gallery
Neil ce8ea081c0 Plugin check shows what drew; responsive Table columns; quieter Table and Stack (#37062)
* plugins: check shows what drew; responsive Table columns; quieter Table and Stack

- orca plugin check: each scenario result carries a summary (headings,
  callouts, empty states, table and tree sizes, the selected tab, loading
  placeholders, danger/warning text), printed under its line, and --json
  adds the drawn tree. dev watch's check event keeps only the summary.
  orca/testing gains panel.summary().
- Table columns take minWidth (floor for an auto column) and hideBelow
  ('sm' 360px, 'md' 480px), measured on the table itself; at least one
  column stays. Cut-off cells and headers show their text on hover. The
  kit's columnsOf(table, { width }) answers which columns fit.
- The active-row ring shows only while the grid has keyboard focus.
- A Stack with no align keeps buttons at their own width while fields,
  tables and cards still fill it; align='stretch' stretches everything.
- Typings, docs, the skill's workflow reference, regenerated references;
  the gallery's Kind column drops out in a narrow sidebar.

* plugins: check can render one scenario and return its drawn tree

For orca plugin shot --scenario (tree replay): checkPluginPanels takes
{ panel, scenario, drawnTree }, and with drawnTree returns each render's
validated tree exactly as Orca draws it (handlers as { $callback }),
re-validated on the CLI side. An unknown scenario is reported as an issue.
readPluginCheckScenarioNames(dir, entry) lists a panel's scenarios by
loading its .check file without mounting anything.
2026-11-01 09:07:14 -08:00
..

Components Gallery

One build-less TSX panel that uses every component in the components catalog: form controls (Textarea, Checkbox, RadioGroup, Slider, Field), layout (Tabs, Collapsible, Toolbar, Grid, tooltips), a paged and sortable Table, a lazily loaded Tree, Markdown, CodeView, a plugin Image, KeyValue, Callout and Skeleton. It needs Orca 1.4.247 or newer.

orca plugin dev load .   # also writes .orca/types, the typings tsconfig.json extends
orca plugin test .       # runs src/panel.test.tsx in Node with orca/testing
orca plugin check .      # renders the panel once and reports errors with file:line

src/files.ts stands in for a data source: the Table asks for the next page with onLoadMore when the person scrolls near the end, and the Tree reads a folder's children on first expand.