Assay FAQ
A disclosure-semantic FAQ accordion: measured height animation via motion, a hairline amber heat-line down the open item's left edge, and a plus indicator that rotates with a brief ember-glow on toggle. Arrow-key/Home/End focus movement between questions, one open at a time by default with an allowMultiple knob, instant open/close with no glow under reduced motion.
motionpro
Pro
The preview is live. The source is Pro.
One purchase, lifetime access: every pro component's source, CLI install with your own registry token, and all future drops.
Installation
CLI
npx shadcn@latest add @crucible/assay-faqManual — install dependencies, then copy the source
npm install motionProps
| Prop | Type | Default | Description |
|---|---|---|---|
| heading | string | "FAQ" | Section heading rendered as an h2. |
| items | AssayFaqItem[] | the six Forgewright FAQs | Question/answer pairs, rendered in order. |
| allowMultiple | boolean | Allow several items open at once. When false (default), opening an item closes the previous one. | |
| defaultOpenIndex | number | 0 | Index of the item open on mount. Pass -1 to start fully closed. |
Also accepts all props of React.ComponentPropsWithoutRef<"section"> — they pass through to the underlying element. | |||
Honors prefers-reduced-motion with a designed static fallback, and passes className through.