sparkdesign 0.4.8 → 0.4.10

package/dist/src/components/basic/Accordion/index.d.ts

@@ -0,0 +1,13 @@
+/**
+ * [WHO]: Accordion and sub-parts re-export from registry.
+ * [FROM]: registry/basic/accordion.
+ * [TO]: sparkdesign package consumers; src/components barrel.
+ * [HERE]: src/components/basic/Accordion/index.tsx — published Accordion wrapper.
+ *
+ * [PROTOCOL]:
+ * 1. Keep this P3 header in sync when the public contract changes.
+ * 2. Update module AGENTS.md (P2) and root AGENTS.md (P1) when boundaries change.
+ * 3. Follow design tokens and explicit type exports.
+ */
+export { Accordion, AccordionItem, AccordionTrigger, AccordionContent, } from '../../../../registry/basic/accordion';
+export type { AccordionProps, AccordionItemProps, AccordionTriggerProps, AccordionContentProps, } from '../../../../registry/basic/accordion';

package/dist/src/components/basic/Badge/index.d.ts

@@ -0,0 +1,13 @@
+/**
+ * [WHO]: Badge re-export from registry.
+ * [FROM]: registry/basic/badge.
+ * [TO]: sparkdesign package consumers; src/components barrel.
+ * [HERE]: src/components/basic/Badge/index.tsx — published Badge wrapper.
+ *
+ * [PROTOCOL]:
+ * 1. Keep this P3 header in sync when the public contract changes.
+ * 2. Update module AGENTS.md (P2) and root AGENTS.md (P1) when boundaries change.
+ * 3. Follow design tokens and explicit type exports.
+ */
+export { Badge, badgeVariants } from '../../../../registry/basic/badge';
+export type { BadgeProps } from '../../../../registry/basic/badge';

package/dist/src/components/basic/EllipsisText/index.d.ts

@@ -1,45 +1,13 @@
 /**
  * [WHO]: Public exports from this file (see implementation below).
- * [FROM]: See the import block immediately after this header.
+ * [FROM]: registry/basic/ellipsis-text.
  * [TO]: sparkdesign package consumers; output of CLI `add` when applicable.
- * [HERE]: src/components/basic/EllipsisText/index.tsx — Spark Design source; keep aligned with the main library.
+ * [HERE]: src/components/basic/EllipsisText/index.tsx — packaged wrapper for EllipsisText.
  *
  * [PROTOCOL]:
  * 1. Keep this P3 header in sync when the public contract changes.
  * 2. Update module AGENTS.md (P2) and root AGENTS.md (P1) when boundaries change.
  * 3. Follow design tokens and explicit type exports.
  */
-import { type ReactNode, type CSSProperties } from 'react';
-export interface EllipsisTextProps {
-    /** 要显示的文本内容 */
-    children: ReactNode;
-    /**
-     * 最大显示行数，超出会显示省略号
-     * @default 1
-     */
-    lines?: number;
-    /** 容器额外类名 */
-    className?: string;
-    /**
-     * Tooltip 弹出方向
-     * @default 'top'
-     */
-    placement?: 'top' | 'bottom' | 'left' | 'right';
-    /** Tooltip 内容额外类名 */
-    tooltipClassName?: string;
-    /** 自定义 tooltip 内容，默认使用 children */
-    tooltipContent?: ReactNode;
-    /**
-     * 是否禁用 tooltip
-     * @default false
-     */
-    disabled?: boolean;
-    /** 容器行内样式 */
-    style?: CSSProperties;
-    /**
-     * 文本元素的标签类型
-     * @default 'span'
-     */
-    as?: 'span' | 'div' | 'p';
-}
-export declare const EllipsisText: import("react").ForwardRefExoticComponent<EllipsisTextProps & import("react").RefAttributes<HTMLElement>>;
+export { EllipsisText } from '../../../../registry/basic/ellipsis-text';
+export type { EllipsisTextProps } from '../../../../registry/basic/ellipsis-text';

package/dist/src/components/basic/Form/index.d.ts

@@ -0,0 +1,12 @@
+/**
+ * [WHO]: Form helpers re-export from registry.
+ * [FROM]: registry/basic/form.
+ * [TO]: sparkdesign package consumers; src/components barrel.
+ * [HERE]: src/components/basic/Form/index.tsx — published React Hook Form helper wrapper.
+ *
+ * [PROTOCOL]:
+ * 1. Keep this P3 header in sync when the public contract changes.
+ * 2. Update module AGENTS.md (P2) and root AGENTS.md (P1) when boundaries change.
+ * 3. Follow design tokens and explicit type exports.
+ */
+export { useFormField, Form, FormItem, FormLabel, FormControl, FormDescription, FormMessage, FormField, } from '../../../../registry/basic/form';

package/dist/src/components/basic/Rating/index.d.ts

@@ -0,0 +1,13 @@
+/**
+ * [WHO]: Public Rating re-export.
+ * [FROM]: registry/basic/rating.
+ * [TO]: sparkdesign package consumers; src/components/index.ts barrel.
+ * [HERE]: src/components/basic/Rating/index.tsx — package-facing Rating entrypoint.
+ *
+ * [PROTOCOL]:
+ * 1. Keep this P3 header in sync when the public contract changes.
+ * 2. Update module AGENTS.md (P2) and root AGENTS.md (P1) when boundaries change.
+ * 3. Follow design tokens and explicit type exports.
+ */
+export { Rating, ratingVariants } from '../../../../registry/basic/rating';
+export type { RatingProps, RatingPrecision } from '../../../../registry/basic/rating';

package/dist/src/components/basic/Sidebar/index.d.ts

@@ -0,0 +1,13 @@
+/**
+ * [WHO]: Sidebar primitives re-export from registry.
+ * [FROM]: registry/basic/sidebar.
+ * [TO]: sparkdesign package consumers; src/components barrel.
+ * [HERE]: src/components/basic/Sidebar/index.tsx — published Sidebar wrapper.
+ *
+ * [PROTOCOL]:
+ * 1. Keep this P3 header in sync when the public contract changes.
+ * 2. Update module AGENTS.md (P2) and root AGENTS.md (P1) when boundaries change.
+ * 3. Follow design tokens and explicit type exports.
+ */
+export { Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, sidebarMenuButtonVariants, useSidebar, } from '../../../../registry/basic/sidebar';
+export { SidebarMenu as SidebarNavMenu, SidebarMenuItem as SidebarNavMenuItem, } from '../../../../registry/basic/sidebar';

package/dist/src/components/basic/Stepper/index.d.ts

@@ -0,0 +1,13 @@
+/**
+ * [WHO]: Public Stepper re-export.
+ * [FROM]: registry/basic/stepper.
+ * [TO]: sparkdesign package consumers; src/components/index.ts barrel.
+ * [HERE]: src/components/basic/Stepper/index.tsx — package-facing Stepper entrypoint.
+ *
+ * [PROTOCOL]:
+ * 1. Keep this P3 header in sync when the public contract changes.
+ * 2. Update module AGENTS.md (P2) and root AGENTS.md (P1) when boundaries change.
+ * 3. Follow design tokens and explicit type exports.
+ */
+export { Stepper, StepperItem, StepperIndicator, StepperContent, StepperTitle, StepperDescription, StepperSeparator, } from '../../../../registry/basic/stepper';
+export type { StepperProps, StepperItemProps, StepperIndicatorProps, StepperContentProps, StepperTitleProps, StepperDescriptionProps, StepperSeparatorProps, StepStatus, } from '../../../../registry/basic/stepper';

package/dist/src/components/basic/Timeline/index.d.ts

@@ -0,0 +1,13 @@
+/**
+ * [WHO]: Public Timeline re-export.
+ * [FROM]: registry/basic/timeline.
+ * [TO]: sparkdesign package consumers; src/components/index.ts barrel.
+ * [HERE]: src/components/basic/Timeline/index.tsx — package-facing Timeline entrypoint.
+ *
+ * [PROTOCOL]:
+ * 1. Keep this P3 header in sync when the public contract changes.
+ * 2. Update module AGENTS.md (P2) and root AGENTS.md (P1) when boundaries change.
+ * 3. Follow design tokens and explicit type exports.
+ */
+export { Timeline, TimelineItem, TimelineMarker, TimelineConnector, TimelineContent, TimelineTitle, TimelineDescription, TimelineTime, timelineMarkerVariants, } from '../../../../registry/basic/timeline';
+export type { TimelineProps, TimelineItemProps, TimelineMarkerProps, TimelineConnectorProps, TimelineContentProps, TimelineTitleProps, TimelineDescriptionProps, TimelineTimeProps, } from '../../../../registry/basic/timeline';

package/dist/src/components/index.d.ts

@@ -13,6 +13,8 @@ export { Button } from './basic/Button';
 export type { ButtonProps } from './basic/Button';
 export { ButtonGroup, ButtonGroupText, ButtonGroupSeparator, buttonGroupVariants, } from './basic/ButtonGroup';
 export type { ButtonGroupProps, ButtonGroupTextProps, ButtonGroupSeparatorProps, } from './basic/ButtonGroup';
+export { Badge, badgeVariants } from './basic/Badge';
+export type { BadgeProps } from './basic/Badge';
 export { IconButton } from './basic/IconButton';
 export type { IconButtonProps } from './basic/IconButton';
 export { Tooltip } from './basic/Tooltip';
@@ -33,8 +35,6 @@ export { Toggle, ToggleGroup, ToggleGroupItem } from './basic/Toggle';
 export type { ToggleProps, ToggleGroupProps, ToggleGroupItemProps } from './basic/Toggle';
 export { RadioGroup, RadioGroupItem } from './basic/RadioGroup';
 export type { RadioGroupProps, RadioGroupItemProps } from './basic/RadioGroup';
-export { CollapsibleSection } from './basic/CollapsibleSection';
-export type { CollapsibleSectionProps } from './basic/CollapsibleSection';
 export { Collapsible, CollapsibleTrigger, CollapsibleContent } from './basic/Collapsible';
 export { ResizablePanelGroup, ResizablePanel, ResizableHandle, } from './basic/Resizable';
 export type { ResizablePanelGroupProps, ResizablePanelProps, ResizableHandleProps, } from './basic/Resizable';
@@ -56,6 +56,8 @@ export { Select, SelectTrigger, SelectValue, SelectContent, SelectLabel, SelectS
 export type { SelectProps, SelectTriggerProps, SelectValueProps, SelectContentProps, SelectLabelProps, SelectSeparatorProps, SelectGroupProps, SelectItemProps, } from './basic/Select';
 export { Tabs, TabsList, TabsTrigger, TabsContent, } from './basic/Tabs';
 export type { TabsProps, TabsListProps, TabsTriggerProps, TabsContentProps, } from './basic/Tabs';
+export { Accordion, AccordionItem, AccordionTrigger, AccordionContent, } from './basic/Accordion';
+export type { AccordionProps, AccordionItemProps, AccordionTriggerProps, AccordionContentProps, } from './basic/Accordion';
 export { Collapse, CollapseItem, CollapseTrigger, CollapseContent, } from './basic/Collapse';
 export type { CollapseProps, CollapseItemProps, CollapseTriggerProps, CollapseContentProps, } from './basic/Collapse';
 export { TypographyH1, TypographyH2, TypographyH3, TypographyH4, TypographyP, TypographyBlockquote, TypographyTable, TypographyList, TypographyInlineCode, TypographyLead, TypographyLarge, TypographySmall, TypographyMuted, } from './basic/Typography';
@@ -68,10 +70,17 @@ export { Tag, tagVariants } from './basic/Tag';
 export type { TagProps } from './basic/Tag';
 export { Progress } from './basic/Progress';
 export type { ProgressProps } from './basic/Progress';
+export { Rating, ratingVariants } from './basic/Rating';
+export type { RatingProps, RatingPrecision } from './basic/Rating';
+export { Stepper, StepperItem, StepperIndicator, StepperContent, StepperTitle, StepperDescription, StepperSeparator, } from './basic/Stepper';
+export type { StepperProps, StepperItemProps, StepperIndicatorProps, StepperContentProps, StepperTitleProps, StepperDescriptionProps, StepperSeparatorProps, StepStatus, } from './basic/Stepper';
+export { Timeline, TimelineItem, TimelineMarker, TimelineConnector, TimelineContent, TimelineTitle, TimelineDescription, TimelineTime, timelineMarkerVariants, } from './basic/Timeline';
+export type { TimelineProps, TimelineItemProps, TimelineMarkerProps, TimelineConnectorProps, TimelineContentProps, TimelineTitleProps, TimelineDescriptionProps, TimelineTimeProps, } from './basic/Timeline';
 export { CollapsibleCard } from './basic/CollapsibleCard';
 export type { CollapsibleCardProps } from './basic/CollapsibleCard';
 export { SidebarMenu } from './basic/SidebarMenu';
 export type { SidebarMenuProps, SidebarMenuItem, SidebarMenuItemAction } from './basic/SidebarMenu';
+export { Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, SidebarNavMenu, SidebarNavMenuItem, sidebarMenuButtonVariants, useSidebar, } from './basic/Sidebar';
 export { Input } from './basic/Input';
 export type { InputProps } from './basic/Input';
 export { InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupTextarea, InputGroupText, } from './basic/InputGroup';
@@ -79,6 +88,7 @@ export { InputOTP, InputOTPGroup, InputOTPSlot, InputOTPSeparator, } from './bas
 export { Textarea } from './basic/Textarea';
 export type { TextareaProps } from './basic/Textarea';
 export { Field, FieldLabel, FieldDescription, FieldError, FieldContent, FieldTitle, FieldSeparator, FieldSet, FieldLegend, FieldGroup, } from './basic/Field';
+export { useFormField, Form, FormItem, FormLabel, FormControl, FormDescription, FormMessage, FormField, } from './basic/Form';
 export { Label } from './basic/Label';
 export type { LabelProps } from './basic/Label';
 export { Checkbox, checkboxVariants } from './basic/Checkbox';
@@ -98,8 +108,6 @@ export { Dialog, DialogTrigger, DialogPortal, DialogOverlay, DialogClose, Dialog
 export type { DialogContentProps, DialogHeaderProps, DialogFooterProps, } from './basic/Dialog';
 export { Drawer, DrawerTrigger, DrawerClose, DrawerPortal, DrawerOverlay, DrawerContent, DrawerHeader, DrawerFooter, DrawerTitle, DrawerDescription, } from './basic/Drawer';
 export type { DrawerContentProps, DrawerHeaderProps, DrawerFooterProps, } from './basic/Drawer';
-export { Sheet, SheetTrigger, SheetClose, SheetPortal, SheetOverlay, SheetContent, SheetHeader, SheetFooter, SheetTitle, SheetDescription, sheetVariants, } from './basic/Sheet';
-export type { SheetContentProps, SheetHeaderProps, SheetFooterProps, } from './basic/Sheet';
 export { Popover, PopoverTrigger, PopoverAnchor, PopoverContent, } from './basic/Popover';
 export type { PopoverContentProps } from './basic/Popover';
 export { HoverCard, HoverCardTrigger, HoverCardContent } from './basic/HoverCard';

package/docs/agent/component-selection.md

@@ -8,7 +8,10 @@ details are needed.
 
 - `sparkdesign/agent-manifest.json` — package export for agent-facing component semantics.
 - `registry/agent-manifest.json` — source of truth in this repository.
+- Showcase route `#/agent-component-selection` — visible companion page for the same decision model.
 - `npm run check:agent-manifest` — validates required semantic fields and recipe references.
+- `npm run report:agent-coverage` — reports manifest coverage against `registry/meta.json`.
+- `npm run check:agent-coverage` — fails if manifest coverage drops below 100%.
 
 ## Decision Order
 
@@ -18,28 +21,123 @@ details are needed.
 4. Use `cliAdd` when the target app should own copied component source.
 5. Use `packageImport` only when the app already consumes `sparkdesign` as a package.
 
+## Common Name Boundaries
+
+- `sidebar` is the full app-shell primitive set: provider state, trigger, responsive collapse, mobile sheet, and inset content. Package imports expose its menu list as `SidebarNavMenu` / `SidebarNavMenuItem`.
+- `sidebar-menu` is the lightweight data-driven list component exported as `SidebarMenu`; use it when a full app shell would be overkill.
+- `form` is for React Hook Form validation wiring; `field` is for layout-only form rows.
+
 ## Current High-Confidence Coverage
 
-The first manifest version covers the components most likely to be selected by
-design/coding agents:
+The manifest covers the components most likely to be selected by design/coding
+agents. Use `npm run report:agent-coverage` for the current full coverage
+snapshot.
 
 - `button`
 - `alert`
+- `alert-dialog`
+- `accordion`
+- `aspect-ratio`
+- `avatar`
+- `badge`
+- `breadcrumb`
+- `button-group`
+- `calendar`
 - `card`
+- `carousel`
+- `chart`
+- `checkbox`
+- `collapse`
+- `collapsible`
+- `collapsible-card`
+- `combobox`
+- `command`
+- `context-menu`
+- `data-table`
+- `date-picker`
 - `dialog`
+- `direction`
+- `dropdown-menu`
 - `drawer`
-- `file-review-part`
+- `ellipsis-text`
+- `empty`
+- `field`
+- `form`
+- `hover-card`
+- `icon-button`
+- `input`
+- `input-group`
+- `input-otp`
+- `item`
+- `kbd`
+- `label`
+- `menubar`
+- `native-select`
+- `navigation-menu`
+- `option-list`
+- `pagination`
+- `popover`
+- `progress`
+- `radio-group`
+- `resizable`
+- `scroll-area`
+- `scrollbar`
+- `select`
+- `separator`
+- `sidebar`
+- `sidebar-menu`
+- `shimmering-text`
+- `slider`
+- `skeleton`
+- `spinner`
+- `switch`
+- `table`
+- `tag`
+- `tabs`
+- `textarea`
+- `toast`
+- `tooltip`
+- `toggle`
+- `toggle-group`
+- `typography`
+- `ask-user-part`
+- `browser-action-part`
 - `chat-input`
-- `response`
+- `code-block-part`
+- `conversation-anchor-nav`
+- `file-attachment`
+- `file-card`
+- `file-review-part`
+- `folder-button`
+- `generation-status-bar`
+- `generated-images-grid`
+- `hint-banner`
+- `image-attachment`
+- `image-generating`
 - `markdown`
+- `mermaid-part`
 - `permission-card`
+- `plan-part`
+- `queue-indicator`
+- `reasoning-step`
+- `related-prompts`
+- `response`
+- `send-button`
+- `streaming-markdown-block`
+- `task-part`
+- `terminal-code-block-part`
+- `thinking-indicator`
 - `tool-invocation-card`
+- `user-message`
+- `user-question-answer`
+- `user-question-part`
 
 ## Recipe Usage
 
 Recipes are intended to prevent agents from flattening rich AI interfaces into
 generic cards and Markdown.
 
+- `structured-form` — deterministic forms/settings with labels, controls, validation, and actions.
 - `assistant-composer` — prompt entry, attachments, send, and permissions.
 - `assistant-response-stream` — generated answer, tools, Markdown, and errors.
 - `focused-task-modal` — compact blocking task or confirmation flow.
@@ -58,3 +156,5 @@ When adding a component to the manifest:
 4. Ensure `cliAdd` installs the same component id as the manifest key.
 5. Add or update recipes if the component changes how agents should compose screens.
 6. Run `npm run check:agent-manifest`.
+7. Run `npm run check:agent-coverage` so new registry components cannot ship without agent semantics.
+8. Run `npm run report:agent-coverage` when planning broader semantic coverage or reviewing drift.

package/docs/agent/prompt-recipes.md

@@ -0,0 +1,167 @@
+# Spark Design Prompt Recipes
+
+These prompts are for AI coding agents that need to build with Spark Design
+without flattening the system into generic UI. They assume the agent can inspect
+files, run commands, and edit code.
+
+Showcase companion: `#/agent-prompt-recipes`.
+
+## How To Use
+
+1. Pick the recipe closest to the task.
+2. Paste it into the agent with the product-specific requirements.
+3. Keep the hard rules intact.
+4. Ask the agent to report which Spark surfaces it verified.
+
+## Universal Spark Contract
+
+Add this block to any prompt when quality matters:
+
+```text
+Use Spark Design as a system, not as loose components.
+
+Before implementation:
+- Read registry/agent-manifest.json and choose components by intent, states,
+  accessibility, composition, and antiPatterns.
+- Read registry/tokens/ontology.json before writing styles.
+- Prefer npx sparkdesign@latest add <component> for business apps that should
+  own copied source.
+- Use package imports only if the app already consumes sparkdesign as a runtime.
+
+Hard rules:
+- Do not invent duplicate components when Spark already covers the intent.
+- Do not hard-code hex colors, raw rgba overlays, arbitrary radii, or one-off
+  spacing in published UI.
+- Preserve data-theme for color and data-style for layout density/radius/rhythm.
+- Keep portal UI consistent with the active theme/style.
+- For AI workflows, prefer chat components such as ChatInput, Response,
+  ToolInvocationCard, PermissionCard, ReasoningStep, TaskPart, PlanPart,
+  FileReviewPart, and RelatedPrompts instead of plain cards and Markdown.
+
+Before handoff:
+- Run the narrow checks that prove the changed surfaces.
+- Report changed files, validation commands, and any remaining risk.
+```
+
+## Recipe 1: Install Spark In A New App
+
+```text
+Set up Spark Design in this React app.
+
+Requirements:
+- Determine whether this project should use CLI copied source or package imports.
+- Prefer CLI copied source unless the project already uses sparkdesign as a
+  runtime dependency or I explicitly ask for package mode.
+- If using CLI mode, run npx sparkdesign@latest init and add only the components
+  needed for the screen.
+- Configure Tailwind CSS 4 correctly, including @tailwindcss/vite and @source
+  for copied Spark components.
+- Set data-theme and data-style on the root or document element.
+- Verify dark mode and at least one portal component if the screen uses overlays.
+
+Do not mix CLI copied-source imports with package imports.
+Do not leave Vite starter CSS fighting Spark tokens.
+```
+
+## Recipe 2: Select Components For A Product Screen
+
+```text
+Design and implement this product screen using Spark Design.
+
+Task:
+[Describe the screen, users, data density, and primary workflow.]
+
+Process:
+1. Read registry/agent-manifest.json.
+2. List the Spark components selected by intent and explain why each one fits.
+3. Check antiPatterns for every selected component before composing the screen.
+4. Read registry/tokens/ontology.json and choose token families before styling.
+5. Implement the screen with tokenized classes and existing Spark primitives.
+6. Keep workflows efficient: use icons for tools, segmented controls for modes,
+   toggles for binary settings, and menus for option sets.
+
+Verification:
+- No duplicate local component that Spark already provides.
+- No hard-coded hex/rgb, arbitrary radii, or arbitrary spacing unless explained.
+- Text fits on desktop and mobile.
+- Keyboard/focus behavior remains intact for controls and overlays.
+```
+
+## Recipe 3: Build An AI Workflow
+
+```text
+Build this AI workflow with Spark Design chat components.
+
+Workflow:
+[Describe prompt entry, tool calls, files, approvals, reasoning, generated
+content, error handling, and follow-up prompts.]
+
+Use Spark chat components where they match intent:
+- ChatInput for prompt composition and attachments.
+- Response or Markdown for generated answers.
+- ToolInvocationCard for tool execution visibility.
+- PermissionCard or AskUserPart for approval/confirmation.
+- ReasoningStep, PlanPart, TaskPart, or BrowserActionPart for structured agent
+  progress.
+- FileCard, FileAttachment, FileReviewPart, and GeneratedImagesGrid for files.
+- RelatedPrompts for next actions.
+
+Do not flatten tool calls, approvals, or reasoning into plain Markdown.
+Expose state clearly: pending, streaming, success, blocked, skipped, failed.
+```
+
+## Recipe 4: Add Or Change A Component
+
+```text
+Add or change this Spark component while keeping the system isomorphic.
+
+Component intent:
+[Describe what user problem the component solves and what it should not solve.]
+
+Required sequence:
+1. Search existing registry/basic, registry/chat, and registry/agent-manifest.json
+   to confirm this component is not a duplicate.
+2. Implement source of truth in registry/.
+3. Keep dependencies public and copy-safe for CLI users.
+4. Export component and prop types through src/components/.
+5. Regenerate or validate registry/meta.json and sync cli/registry if needed.
+6. Add showcase demo blocks with production-like examples and matching snippets.
+7. Add props metadata and localized labels.
+8. Update registry/agent-manifest.json with intent, slots, states, a11y,
+   composition, antiPatterns, and agentHints.
+9. Update P3 headers and P2 AGENTS.md maps.
+10. Run component, registry, showcase, token, and manifest checks.
+
+Do not call the component complete until registry, CLI, package exports,
+showcase, docs, and agent manifest agree.
+```
+
+## Recipe 5: Audit A Spark Change
+
+```text
+Review this Spark Design change as a maintainer.
+
+Prioritize:
+- Behavioral bugs and regressions.
+- Drift between registry, CLI, package exports, showcase, docs, and manifest.
+- Token misuse: hard-coded colors, raw rgba, arbitrary spacing/radius, theme
+  inheritance failures, and one-off visual language.
+- Accessibility gaps: labels, roles, focus states, keyboard behavior, status
+  text, and color-only meaning.
+- Showcase quality: examples should teach real usage and snippets should compile.
+- AI friendliness: manifest intent and antiPatterns should prevent bad agent
+  choices.
+
+Return findings first with file/line references, then open questions, then a
+short verification summary.
+```
+
+## Maintainer Checklist
+
+- Prompt picked the correct consumption path: CLI copied source or package import.
+- Prompt forced manifest and ontology reads before implementation.
+- Prompt preserved theme/style axes and portal inheritance.
+- Prompt required showcase and docs updates when public behavior changed.
+- Prompt required agent manifest updates for new or changed components.
+- Prompt kept AI-facing docs package-visible when guidance changed.
+- Prompt included concrete verification commands and evidence.