nebari-design

House recipe for adding a new component to the nebari-design shadcn registry. Use when adding, creating, or scaffolding a registry component — e.g. "add a Button component to the registry", "create a new nebari component", "scaffold <X> in registry/nebari/ui", or "animate / add motion to a component". Covers the component file pattern (cva variants, data-slot/data-variant/data-size attributes, cn() merging, Base UI render-prop composition), the registry.json entry shape (dependencies vs registryDependencies), motion and animation (interaction states, overlay enter/exit, motion-safe gating, token usage), story and test templates, and the verification gate.

Add and use components from the Nebari design system (the @nebari shadcn registry) in this app. Use when asked to "add a nebari component", "use the nebari button/badge/alert/spinner", "install the nebari theme", "animate, add a transition, make it feel polished, or add an entrance animation with nebari", or "build <something> with nebari components". Covers registry setup (the @nebari namespace in components.json + the shadcn add command), the component catalog (variants, sizes, props), the Base UI render-prop composition convention, theming (the @nebari/theme tokens, CSS variables, and light/dark), and motion (duration/easing tokens, entrance animations, overlay transitions, accessibility guardrails).