@loworbitstudio/visor 1.26.1 → 1.27.0

package/dist/CHANGELOG.json

@@ -1,6 +1,6 @@
 {
   "version": "0.4.0",
-  "generated_at": "2026-09-19T02:57:14.099Z",
+  "generated_at": "2026-09-23T03:16:40.735Z",
   "components": {
     "accessibility-specimen": {
       "changeType": "current",

package/dist/registry.json

@@ -535,10 +535,11 @@
     {
       "name": "spinner",
       "type": "registry:ui",
-      "description": "Inline loading spinner — a rotating border ring with a subtle track and tone-colored leading edge. Three sizes (xs/sm/md), two tones (default/primary), accessible label contract, and full reduced-motion support.",
+      "description": "Loading spinner — an inline rotating ring, or a dotted thinking-orb (nine animations) for waits over larger surfaces. Three sizes (xs/sm/md), two tones (default/primary), accessible label contract, and full reduced-motion support.",
       "category": "data-display",
       "dependencies": [
         "class-variance-authority",
+        "thinking-orbs",
         "@loworbitstudio/visor-core"
       ],
       "registryDependencies": [
@@ -548,12 +549,17 @@
         {
           "path": "components/ui/spinner/spinner.tsx",
           "type": "registry:ui",
-          "content": "import * as React from \"react\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\nimport { cn } from \"../../../lib/utils\"\nimport styles from \"./spinner.module.css\"\n\nconst spinnerVariants = cva(styles.root, {\n  variants: {\n    size: {\n      xs: styles.sizeXs,\n      sm: styles.sizeSm,\n      md: styles.sizeMd,\n    },\n    tone: {\n      default: styles.toneDefault,\n      primary: styles.tonePrimary,\n    },\n  },\n  defaultVariants: {\n    size: \"md\",\n    tone: \"default\",\n  },\n})\n\nexport interface SpinnerProps\n  extends Omit<React.HTMLAttributes<HTMLSpanElement>, \"children\">,\n    VariantProps<typeof spinnerVariants> {\n  /** Visual size of the spinner ring. @default \"md\" */\n  size?: \"xs\" | \"sm\" | \"md\"\n  /** Color tone for the leading edge. @default \"default\" */\n  tone?: \"default\" | \"primary\"\n  /** Accessible label. When provided, renders role=\"status\" with visually-hidden text. When omitted, aria-hidden=\"true\". */\n  label?: string\n}\n\nconst Spinner = React.forwardRef<HTMLSpanElement, SpinnerProps>(\n  ({ className, size = \"md\", tone = \"default\", label, ...props }, ref) => {\n    return (\n      <span\n        ref={ref}\n        data-slot=\"spinner\"\n        data-size={size}\n        data-tone={tone}\n        className={cn(spinnerVariants({ size, tone }), className)}\n        {...(label\n          ? { role: \"status\", \"aria-label\": label }\n          : { \"aria-hidden\": \"true\" })}\n        {...props}\n      >\n        {label ? (\n          <span className={styles.srOnly}>{label}</span>\n        ) : null}\n      </span>\n    )\n  }\n)\nSpinner.displayName = \"Spinner\"\n\nexport { Spinner, spinnerVariants }\n"
+          "content": "import * as React from \"react\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\nimport { cn } from \"../../../lib/utils\"\nimport styles from \"./spinner.module.css\"\nimport { SpinnerOrb, type SpinnerOrbState } from \"./spinner-orb\"\n\nconst spinnerVariants = cva(styles.root, {\n  variants: {\n    size: {\n      xs: styles.sizeXs,\n      sm: styles.sizeSm,\n      md: styles.sizeMd,\n    },\n    tone: {\n      default: styles.toneDefault,\n      primary: styles.tonePrimary,\n    },\n  },\n  defaultVariants: {\n    size: \"md\",\n    tone: \"default\",\n  },\n})\n\nexport interface SpinnerProps\n  extends Omit<React.HTMLAttributes<HTMLSpanElement>, \"children\">,\n    VariantProps<typeof spinnerVariants> {\n  /** Visual size. Ring: xs 12px, sm 16px, md 24px. Orb: xs 20px, sm 32px, md 64px. @default \"md\" */\n  size?: \"xs\" | \"sm\" | \"md\"\n  /** Color tone — the ring's leading edge, or the orb's ink. @default \"default\" */\n  tone?: \"default\" | \"primary\"\n  /** `ring` is the inline rotating border; `orb` is a dotted thinking-orb for waits over larger surfaces. @default \"ring\" */\n  variant?: \"ring\" | \"orb\"\n  /** Which orb animation to show. Read only when `variant=\"orb\"`. @default \"working\" */\n  orb?: SpinnerOrbState\n  /** Accessible label. When provided, renders role=\"status\" with visually-hidden text. When omitted, aria-hidden=\"true\". */\n  label?: string\n}\n\nconst Spinner = React.forwardRef<HTMLSpanElement, SpinnerProps>(\n  (\n    {\n      className,\n      size = \"md\",\n      tone = \"default\",\n      label,\n      variant = \"ring\",\n      orb = \"working\",\n      ...props\n    },\n    ref\n  ) => {\n    if (variant === \"orb\") {\n      return (\n        <SpinnerOrb\n          ref={ref}\n          state={orb}\n          size={size}\n          tone={tone}\n          className={className}\n          {...(label\n            ? { role: \"status\", \"aria-label\": label }\n            : { \"aria-hidden\": \"true\" })}\n          {...props}\n        >\n          {label ? <span className={styles.srOnly}>{label}</span> : null}\n        </SpinnerOrb>\n      )\n    }\n\n    return (\n      <span\n        ref={ref}\n        data-slot=\"spinner\"\n        data-size={size}\n        data-tone={tone}\n        className={cn(spinnerVariants({ size, tone }), className)}\n        {...(label\n          ? { role: \"status\", \"aria-label\": label }\n          : { \"aria-hidden\": \"true\" })}\n        {...props}\n      >\n        {label ? (\n          <span className={styles.srOnly}>{label}</span>\n        ) : null}\n      </span>\n    )\n  }\n)\nSpinner.displayName = \"Spinner\"\n\nexport { Spinner, spinnerVariants }\nexport type { SpinnerOrbState }\n"
+        },
+        {
+          "path": "components/ui/spinner/spinner-orb.tsx",
+          "type": "registry:ui",
+          "content": "\"use client\"\n\nimport * as React from \"react\"\nimport { ThinkingOrb, type OrbState } from \"thinking-orbs\"\nimport { cn } from \"../../../lib/utils\"\nimport styles from \"./spinner.module.css\"\n\n/** The nine thinking-orbs animations. */\nexport type SpinnerOrbState = OrbState\n\n/**\n * Spinner size → orb preset. thinking-orbs ships 20 and 64 as hand-tuned\n * designs (not a scale factor); 32 is interpolated between them upstream.\n */\nconst ORB_PX = { xs: 20, sm: 32, md: 64 } as const\n\ninterface OrbInk {\n  /** rgb() tint for the dots — the orb keeps its depth ramp on it. */\n  color?: string\n  /** True when the surrounding text is light, i.e. the orb sits on a dark substrate. */\n  dark: boolean\n}\n\nlet probeCtx: CanvasRenderingContext2D | null | undefined\n\n/**\n * Normalise any computed CSS colour (oklch, color-mix, hex, …) to the\n * `rgb()` form thinking-orbs accepts, by painting one pixel.\n */\nfunction toRgb(value: string): [number, number, number] | null {\n  if (probeCtx === undefined) {\n    const canvas = document.createElement(\"canvas\")\n    canvas.width = canvas.height = 1\n    probeCtx = canvas.getContext(\"2d\", { willReadFrequently: true })\n  }\n  if (!probeCtx || !value) return null\n  probeCtx.clearRect(0, 0, 1, 1)\n  probeCtx.fillStyle = value\n  probeCtx.fillRect(0, 0, 1, 1)\n  const [r, g, b] = probeCtx.getImageData(0, 0, 1, 1).data\n  return [r, g, b]\n}\n\nfunction readInk(host: HTMLElement, probe: HTMLElement): OrbInk | null {\n  const text = toRgb(getComputedStyle(host).color)\n  const tint = toRgb(getComputedStyle(probe).color)\n  if (!text || !tint) return null\n  const [r, g, b] = text\n  return {\n    color: `rgb(${tint.join(\", \")})`,\n    dark: (0.2126 * r + 0.7152 * g + 0.0722 * b) / 255 > 0.5,\n  }\n}\n\n/**\n * Resolve the orb's ink from Visor's tokens rather than thinking-orbs' own\n * `auto` detection, which only knows a `.dark`/`.light` class or the OS\n * preference and so misreads Visor's `html:not(.dark)` light mode. Re-reads\n * when the root theme or the OS scheme changes.\n */\nfunction useOrbInk(\n  hostRef: React.RefObject<HTMLSpanElement | null>,\n  probeRef: React.RefObject<HTMLSpanElement | null>,\n  tone: string\n): OrbInk | null {\n  const [ink, setInk] = React.useState<OrbInk | null>(null)\n\n  React.useLayoutEffect(() => {\n    const host = hostRef.current\n    const probe = probeRef.current\n    if (!host || !probe) return\n    const read = () => {\n      const next = readInk(host, probe)\n      setInk((prev) =>\n        prev?.color === next?.color && prev?.dark === next?.dark ? prev : next\n      )\n    }\n    read()\n    const observer = new MutationObserver(read)\n    for (const el of [document.documentElement, document.body]) {\n      observer.observe(el, {\n        attributes: true,\n        attributeFilter: [\"class\", \"style\", \"data-theme\"],\n      })\n    }\n    const scheme =\n      typeof matchMedia === \"undefined\"\n        ? null\n        : matchMedia(\"(prefers-color-scheme: dark)\")\n    scheme?.addEventListener(\"change\", read)\n    return () => {\n      observer.disconnect()\n      scheme?.removeEventListener(\"change\", read)\n    }\n  }, [hostRef, probeRef, tone])\n\n  return ink\n}\n\nexport interface SpinnerOrbProps\n  extends Omit<React.HTMLAttributes<HTMLSpanElement>, \"color\"> {\n  state: SpinnerOrbState\n  size: \"xs\" | \"sm\" | \"md\"\n  tone: \"default\" | \"primary\"\n}\n\nconst SpinnerOrb = React.forwardRef<HTMLSpanElement, SpinnerOrbProps>(\n  ({ className, style, state, size, tone, children, ...props }, ref) => {\n    const hostRef = React.useRef<HTMLSpanElement | null>(null)\n    const probeRef = React.useRef<HTMLSpanElement | null>(null)\n    const ink = useOrbInk(hostRef, probeRef, tone)\n    const px = ORB_PX[size]\n\n    const setRef = React.useCallback(\n      (node: HTMLSpanElement | null) => {\n        hostRef.current = node\n        if (typeof ref === \"function\") ref(node)\n        else if (ref) ref.current = node\n      },\n      [ref]\n    )\n\n    return (\n      <span\n        ref={setRef}\n        data-slot=\"spinner\"\n        data-variant=\"orb\"\n        data-orb={state}\n        data-size={size}\n        data-tone={tone}\n        className={cn(styles.orb, className)}\n        style={{ width: px, height: px, ...style }}\n        {...props}\n      >\n        <span\n          ref={probeRef}\n          className={cn(\n            styles.orbInk,\n            tone === \"primary\" && styles.orbInkPrimary\n          )}\n        />\n        {/* Server and first client render share this fixed-size canvas, so\n            the box holds still on hydrate; it paints once ink resolves. */}\n        <ThinkingOrb\n          state={state}\n          size={px}\n          theme={ink ? (ink.dark ? \"dark\" : \"light\") : \"auto\"}\n          color={ink?.color}\n          role=\"presentation\"\n          aria-hidden=\"true\"\n        />\n        {children}\n      </span>\n    )\n  }\n)\nSpinnerOrb.displayName = \"SpinnerOrb\"\n\nexport { SpinnerOrb }\n"
         },
         {
           "path": "components/ui/spinner/spinner.module.css",
           "type": "registry:ui",
-          "content": "/* Spinner\n *\n * Inline loading spinner — a border-based rotating ring with a subtle track\n * and a tone-colored leading edge. Sizes: xs (12px), sm (16px), md (24px).\n *\n * All colors flow through CSS custom properties so themes can override the\n * track and edge colors without forking the component. Stroke widths are\n * sourced from the --stroke-width-* token set (thin/regular/medium/thick).\n */\n\n@keyframes spin {\n  from {\n    transform: rotate(0deg);\n  }\n  to {\n    transform: rotate(360deg);\n  }\n}\n\n/* VI-625: the hooks used to be *declared* on .root, which meant an element-level\n   declaration shadowed anything a theme emitted on :root — the \"themes can\n   override the track and edge colors\" promise in the header never actually\n   held. Reading them with the same expression as the inline fallback is\n   value-preserving and makes them genuinely theme-bindable. */\n.root {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n  border-radius: var(--spinner-radius, var(--radius-full, 9999px));\n  border-style: solid;\n  border-color: var(--spinner-track-color, var(--border-default, #e5e7eb));\n  border-top-color: var(--spinner-edge-color, var(--text-tertiary, #6b7280));\n  animation: spin var(--spinner-duration, var(--motion-duration-1500, 1500ms)) var(--motion-easing-linear, linear) infinite;\n  box-sizing: border-box;\n}\n\n/* Visually-hidden label text — accessible to screen readers, not visible */\n.srOnly {\n  position: absolute;\n  width: 1px;\n  height: 1px;\n  padding: 0;\n  margin: -1px;\n  overflow: hidden;\n  clip: rect(0, 0, 0, 0);\n  white-space: nowrap;\n  border-width: 0;\n}\n\n/* Size xs — 12px ring, stroke-width-thin (1px) */\n.root.sizeXs {\n  width: var(--spinner-xs-size, 12px);\n  height: var(--spinner-xs-size, 12px);\n  border-width: var(--spinner-xs-border-width, var(--stroke-width-thin, 1px));\n}\n\n/* Size sm — 16px ring, stroke-width-regular (1.5px) */\n.root.sizeSm {\n  width: var(--spinner-sm-size, 16px);\n  height: var(--spinner-sm-size, 16px);\n  border-width: var(--spinner-sm-border-width, var(--stroke-width-regular, 1.5px));\n}\n\n/* Size md — 24px ring, stroke-width-medium (2px) */\n.root.sizeMd {\n  width: var(--spinner-md-size, 24px);\n  height: var(--spinner-md-size, 24px);\n  border-width: var(--spinner-md-border-width, var(--stroke-width-medium, 2px));\n}\n\n/* Tone: default — tertiary text for leading edge */\n.root.toneDefault {\n  border-top-color: var(--spinner-edge-color, var(--text-tertiary, #6b7280));\n}\n\n/* Tone: primary — primary brand color for leading edge */\n.root.tonePrimary {\n  border-top-color: var(--spinner-primary-edge-color, var(--primary, #111827));\n}\n\n/* Respect reduced motion — stop rotation */\n@media (prefers-reduced-motion: reduce) {\n  .root {\n    animation-play-state: paused;\n  }\n}\n"
+          "content": "/* Spinner\n *\n * Inline loading spinner — a border-based rotating ring with a subtle track\n * and a tone-colored leading edge. Sizes: xs (12px), sm (16px), md (24px).\n *\n * All colors flow through CSS custom properties so themes can override the\n * track and edge colors without forking the component. Stroke widths are\n * sourced from the --stroke-width-* token set (thin/regular/medium/thick).\n */\n\n@keyframes spin {\n  from {\n    transform: rotate(0deg);\n  }\n  to {\n    transform: rotate(360deg);\n  }\n}\n\n/* VI-625: the hooks used to be *declared* on .root, which meant an element-level\n   declaration shadowed anything a theme emitted on :root — the \"themes can\n   override the track and edge colors\" promise in the header never actually\n   held. Reading them with the same expression as the inline fallback is\n   value-preserving and makes them genuinely theme-bindable. */\n.root {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n  border-radius: var(--spinner-radius, var(--radius-full, 9999px));\n  border-style: solid;\n  border-color: var(--spinner-track-color, var(--border-default, #e5e7eb));\n  border-top-color: var(--spinner-edge-color, var(--text-tertiary, #6b7280));\n  animation: spin var(--spinner-duration, var(--motion-duration-1500, 1500ms)) var(--motion-easing-linear, linear) infinite;\n  box-sizing: border-box;\n}\n\n/* Visually-hidden label text — accessible to screen readers, not visible */\n.srOnly {\n  position: absolute;\n  width: 1px;\n  height: 1px;\n  padding: 0;\n  margin: -1px;\n  overflow: hidden;\n  clip: rect(0, 0, 0, 0);\n  white-space: nowrap;\n  border-width: 0;\n}\n\n/* Size xs — 12px ring, stroke-width-thin (1px) */\n.root.sizeXs {\n  width: var(--spinner-xs-size, 12px);\n  height: var(--spinner-xs-size, 12px);\n  border-width: var(--spinner-xs-border-width, var(--stroke-width-thin, 1px));\n}\n\n/* Size sm — 16px ring, stroke-width-regular (1.5px) */\n.root.sizeSm {\n  width: var(--spinner-sm-size, 16px);\n  height: var(--spinner-sm-size, 16px);\n  border-width: var(--spinner-sm-border-width, var(--stroke-width-regular, 1.5px));\n}\n\n/* Size md — 24px ring, stroke-width-medium (2px) */\n.root.sizeMd {\n  width: var(--spinner-md-size, 24px);\n  height: var(--spinner-md-size, 24px);\n  border-width: var(--spinner-md-border-width, var(--stroke-width-medium, 2px));\n}\n\n/* Tone: default — tertiary text for leading edge */\n.root.toneDefault {\n  border-top-color: var(--spinner-edge-color, var(--text-tertiary, #6b7280));\n}\n\n/* Tone: primary — primary brand color for leading edge */\n.root.tonePrimary {\n  border-top-color: var(--spinner-primary-edge-color, var(--primary, #111827));\n}\n\n/* Respect reduced motion — stop rotation */\n@media (prefers-reduced-motion: reduce) {\n  .root {\n    animation-play-state: paused;\n  }\n}\n\n/* Orb variant (VI-653) — a dotted thinking-orb drawn on a canvas by\n   thinking-orbs. The wrapper is sized inline to the canvas preset (20/32/64)\n   so server and client boxes match. The ink is read at runtime from the\n   hidden probe below: default tone follows the surrounding text colour,\n   primary tone the same hook the ring's primary edge reads. */\n.orb {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n  line-height: 0;\n}\n\n.orbInk {\n  display: none;\n  color: currentColor;\n}\n\n.orbInkPrimary {\n  color: var(--spinner-primary-edge-color, var(--primary, #111827));\n}\n"
         }
       ]
     },
@@ -5170,7 +5176,7 @@
         {
           "path": "components/devtools/source-inspector/visor-component-names.generated.ts",
           "type": "registry:devtool",
-          "content": "// THIS FILE IS GENERATED BY scripts/generate-visor-component-names.ts.\n// Do not edit by hand. Re-run `npm run generate:component-names` after\n// adding, removing, or renaming a Visor component.\n//\n// Source of truth: registry/registry-{ui,blocks,deck,visual,devtools}.ts\n// Used by: components/devtools/source-inspector/* (VI-311)\n\nexport const VISOR_COMPONENT_NAMES: ReadonlySet<string> = new Set([\n  \"AccessibilitySection\",\n  \"AccessibilitySlide\",\n  \"AccessibilitySpecimen\",\n  \"Accordion\",\n  \"AccordionContent\",\n  \"AccordionItem\",\n  \"AccordionTrigger\",\n  \"ActivityFeed\",\n  \"ActivityFeedContext\",\n  \"ActivityFeedItem\",\n  \"ActivityFeedRoot\",\n  \"AdminDashboard\",\n  \"AdminDetail\",\n  \"AdminDetailDrawer\",\n  \"AdminListPage\",\n  \"AdminListPageInner\",\n  \"AdminSettingsPage\",\n  \"AdminShell\",\n  \"AdminTabbedEditor\",\n  \"AdminWizard\",\n  \"Alert\",\n  \"AlertActions\",\n  \"AlertDescription\",\n  \"AlertTitle\",\n  \"AmbientGlow\",\n  \"Avatar\",\n  \"AvatarFallback\",\n  \"AvatarImage\",\n  \"AvatarStack\",\n  \"Badge\",\n  \"Banner\",\n  \"BannerAction\",\n  \"BannerDescription\",\n  \"BannerTitle\",\n  \"BentoGrid\",\n  \"BentoTile\",\n  \"BentoTileBody\",\n  \"BentoTileDescription\",\n  \"BentoTileFigure\",\n  \"BentoTileHeadline\",\n  \"BentoTileMedia\",\n  \"BentoTileMeta\",\n  \"BentoTileTitle\",\n  \"Box\",\n  \"Breadcrumb\",\n  \"BreadcrumbEllipsis\",\n  \"BreadcrumbItem\",\n  \"BreadcrumbLink\",\n  \"BreadcrumbList\",\n  \"BreadcrumbPage\",\n  \"BreadcrumbSeparator\",\n  \"BrowserFrame\",\n  \"BulkActionBar\",\n  \"Button\",\n  \"ButtonSpecimenSection\",\n  \"ButtonSpecimenSlide\",\n  \"Calendar\",\n  \"Capture\",\n  \"Card\",\n  \"CardContent\",\n  \"CardDescription\",\n  \"CardFooter\",\n  \"CardGrid\",\n  \"CardHeader\",\n  \"CardLift\",\n  \"CardTitle\",\n  \"Carousel\",\n  \"CarouselContent\",\n  \"CarouselContext\",\n  \"CarouselGallery\",\n  \"CarouselItem\",\n  \"CarouselNext\",\n  \"CarouselPrevious\",\n  \"ChallengeCard\",\n  \"ChallengeCardAction\",\n  \"ChallengeCardActions\",\n  \"ChallengeCardBody\",\n  \"ChallengeCardGate\",\n  \"ChallengeCardHeader\",\n  \"ChartContainer\",\n  \"ChartContext\",\n  \"ChartLegend\",\n  \"ChartLegendContent\",\n  \"ChartStyle\",\n  \"ChartTooltip\",\n  \"ChartTooltipContent\",\n  \"Checkbox\",\n  \"CheckGroup\",\n  \"CheckRow\",\n  \"Chip\",\n  \"ChipGroup\",\n  \"ChipGroupContext\",\n  \"ChipGroupItem\",\n  \"ChoiceChip\",\n  \"ChromeButton\",\n  \"ClosingSlide\",\n  \"CodeBlock\",\n  \"Collapsible\",\n  \"CollapsibleContent\",\n  \"CollapsibleTrigger\",\n  \"ColorBar\",\n  \"ColorPaletteSection\",\n  \"ColorPicker\",\n  \"ColorPickerSurface\",\n  \"ColorSwatch\",\n  \"ColorSwatchGrid\",\n  \"Combobox\",\n  \"ComboboxContent\",\n  \"ComboboxContext\",\n  \"ComboboxEmpty\",\n  \"ComboboxGroup\",\n  \"ComboboxInput\",\n  \"ComboboxItem\",\n  \"ComboboxSeparator\",\n  \"Command\",\n  \"CommandDialog\",\n  \"CommandEmpty\",\n  \"CommandGroup\",\n  \"CommandInput\",\n  \"CommandItem\",\n  \"CommandList\",\n  \"CommandLoading\",\n  \"CommandSeparator\",\n  \"CommandShortcut\",\n  \"ComponentShowcaseContent\",\n  \"ComponentShowcaseSection\",\n  \"ComponentShowcaseSlide\",\n  \"Composer\",\n  \"ComposerContext\",\n  \"ComposerField\",\n  \"ComposerSend\",\n  \"ComposerSpacer\",\n  \"ComposerToolbar\",\n  \"ComposerToolButton\",\n  \"ConceptSlide\",\n  \"ConfigurationPanel\",\n  \"ConfirmDialog\",\n  \"ConflictBanner\",\n  \"Container\",\n  \"ContextMenu\",\n  \"ContextMenuCheckboxItem\",\n  \"ContextMenuContent\",\n  \"ContextMenuGroup\",\n  \"ContextMenuItem\",\n  \"ContextMenuLabel\",\n  \"ContextMenuPortal\",\n  \"ContextMenuRadioGroup\",\n  \"ContextMenuRadioItem\",\n  \"ContextMenuSeparator\",\n  \"ContextMenuShortcut\",\n  \"ContextMenuSub\",\n  \"ContextMenuSubContent\",\n  \"ContextMenuSubTrigger\",\n  \"ContextMenuTrigger\",\n  \"Controls\",\n  \"CtaSection\",\n  \"DataTable\",\n  \"DataTableInner\",\n  \"DatePicker\",\n  \"DateRangePicker\",\n  \"DeckContext\",\n  \"DeckFooter\",\n  \"DeckLayout\",\n  \"DeckProvider\",\n  \"DeckRenderer\",\n  \"DesignSystemDeck\",\n  \"DesignSystemSpecimen\",\n  \"Dialog\",\n  \"DialogClose\",\n  \"DialogContent\",\n  \"DialogDescription\",\n  \"DialogField\",\n  \"DialogFieldControl\",\n  \"DialogFieldLabel\",\n  \"DialogFooter\",\n  \"DialogForm\",\n  \"DialogFormBody\",\n  \"DialogFormClose\",\n  \"DialogFormContent\",\n  \"DialogFormDescription\",\n  \"DialogFormFooter\",\n  \"DialogFormHeader\",\n  \"DialogFormTitle\",\n  \"DialogFormTrigger\",\n  \"DialogHeader\",\n  \"DialogOverlay\",\n  \"DialogPortal\",\n  \"DialogTitle\",\n  \"DialogTrigger\",\n  \"DocFrame\",\n  \"DocFrameBrand\",\n  \"DocNav\",\n  \"DocNavGroup\",\n  \"DocNavPill\",\n  \"DotNav\",\n  \"DropdownMenu\",\n  \"DropdownMenuCheckboxItem\",\n  \"DropdownMenuContent\",\n  \"DropdownMenuGroup\",\n  \"DropdownMenuItem\",\n  \"DropdownMenuLabel\",\n  \"DropdownMenuPortal\",\n  \"DropdownMenuRadioGroup\",\n  \"DropdownMenuRadioItem\",\n  \"DropdownMenuSeparator\",\n  \"DropdownMenuShortcut\",\n  \"DropdownMenuSub\",\n  \"DropdownMenuSubContent\",\n  \"DropdownMenuSubTrigger\",\n  \"DropdownMenuTrigger\",\n  \"EditableBlock\",\n  \"ElevationCard\",\n  \"ElevationSlide\",\n  \"EmptyState\",\n  \"ErrorPlacard\",\n  \"ExportMenu\",\n  \"FeaturesGrid\",\n  \"FidelityMirror\",\n  \"Field\",\n  \"FieldDescription\",\n  \"FieldError\",\n  \"FieldLabel\",\n  \"Fieldset\",\n  \"FieldsetLegend\",\n  \"FileUpload\",\n  \"FilterBar\",\n  \"FilterChip\",\n  \"FontShowcase\",\n  \"FontShowcaseGrid\",\n  \"Footer\",\n  \"FooterSection\",\n  \"Form\",\n  \"FormError\",\n  \"FormErrorDescription\",\n  \"FormErrorTitle\",\n  \"FormField\",\n  \"FormSpecimenSection\",\n  \"FormSpecimenSlide\",\n  \"FullscreenOverlay\",\n  \"FullscreenOverlayContent\",\n  \"FullscreenOverlayTrigger\",\n  \"GrainOverlay\",\n  \"Grid\",\n  \"Header\",\n  \"Heading\",\n  \"HeroGlow\",\n  \"HeroSection\",\n  \"HeroSlide\",\n  \"HoverCard\",\n  \"HoverCardContent\",\n  \"HoverCardTrigger\",\n  \"IconGrid\",\n  \"IconGridSection\",\n  \"IconSizeRow\",\n  \"IconsSlide\",\n  \"Image\",\n  \"InfographicBar\",\n  \"Inline\",\n  \"Input\",\n  \"Kbd\",\n  \"KeyValueList\",\n  \"Label\",\n  \"Landing\",\n  \"Lightbox\",\n  \"LightboxContent\",\n  \"LightboxContext\",\n  \"LightboxTrigger\",\n  \"LoginForm\",\n  \"Marquee\",\n  \"MarqueeBandRenderer\",\n  \"MatrixCell\",\n  \"MatrixTable\",\n  \"MatrixTableInner\",\n  \"Menubar\",\n  \"MenubarCheckboxItem\",\n  \"MenubarContent\",\n  \"MenubarGroup\",\n  \"MenubarItem\",\n  \"MenubarLabel\",\n  \"MenubarMenu\",\n  \"MenubarRadioGroup\",\n  \"MenubarRadioItem\",\n  \"MenubarSeparator\",\n  \"MenubarShortcut\",\n  \"MenubarSub\",\n  \"MenubarSubContent\",\n  \"MenubarSubTrigger\",\n  \"MenubarTrigger\",\n  \"MonthCalendar\",\n  \"MotionDuration\",\n  \"MotionDurationSection\",\n  \"MotionEasing\",\n  \"MotionEasingSection\",\n  \"MotionSlide\",\n  \"NameRoster\",\n  \"NameRosterItem\",\n  \"Navbar\",\n  \"NavbarBrand\",\n  \"NavbarContent\",\n  \"NavbarItem\",\n  \"NavbarLink\",\n  \"NavbarToggle\",\n  \"NumberInput\",\n  \"OfflineBanner\",\n  \"OpacityBar\",\n  \"OpacitySlide\",\n  \"OTPInput\",\n  \"PageHeader\",\n  \"Pagination\",\n  \"PaginationContent\",\n  \"PaginationEllipsis\",\n  \"PaginationItem\",\n  \"PaginationLink\",\n  \"PaginationNext\",\n  \"PaginationPrevious\",\n  \"PasswordInput\",\n  \"PhoneInput\",\n  \"PlatformChip\",\n  \"Popover\",\n  \"PopoverAnchor\",\n  \"PopoverContent\",\n  \"PopoverFooter\",\n  \"PopoverSelectionItem\",\n  \"PopoverSelectionLabel\",\n  \"PopoverSelectionList\",\n  \"PopoverTrigger\",\n  \"PricingSection\",\n  \"ProfileMenu\",\n  \"Progress\",\n  \"PrototypeReview\",\n  \"QuickActions\",\n  \"RadioGroup\",\n  \"RadioGroupItem\",\n  \"RadiusScale\",\n  \"RadiusSection\",\n  \"RadiusSlide\",\n  \"RecordSection\",\n  \"RightRailList\",\n  \"ScoreIndicator\",\n  \"ScrollArea\",\n  \"ScrollBar\",\n  \"SearchInput\",\n  \"SectionHeader\",\n  \"SectionIntro\",\n  \"SectionNav\",\n  \"SectionNavItem\",\n  \"SegmentedProgress\",\n  \"Select\",\n  \"SelectContent\",\n  \"SelectGroup\",\n  \"SelectionListContext\",\n  \"SelectItem\",\n  \"SelectLabel\",\n  \"SelectScrollDownButton\",\n  \"SelectScrollUpButton\",\n  \"SelectSeparator\",\n  \"SelectTrigger\",\n  \"SelectValue\",\n  \"SemanticColorGrid\",\n  \"SemanticColorItem\",\n  \"SemanticTokensSlide\",\n  \"SensitivePanel\",\n  \"Separator\",\n  \"SessionTimeout\",\n  \"ShadowSection\",\n  \"Sheet\",\n  \"SheetClose\",\n  \"SheetContent\",\n  \"SheetDescription\",\n  \"SheetFooter\",\n  \"SheetHeader\",\n  \"SheetOverlay\",\n  \"SheetPortal\",\n  \"SheetTitle\",\n  \"SheetTrigger\",\n  \"Sidebar\",\n  \"SidebarContent\",\n  \"SidebarContext\",\n  \"SidebarFooter\",\n  \"SidebarGroup\",\n  \"SidebarGroupAction\",\n  \"SidebarGroupContent\",\n  \"SidebarGroupLabel\",\n  \"SidebarHeader\",\n  \"SidebarInset\",\n  \"SidebarMenu\",\n  \"SidebarMenuAction\",\n  \"SidebarMenuBadge\",\n  \"SidebarMenuButton\",\n  \"SidebarMenuItem\",\n  \"SidebarMenuSub\",\n  \"SidebarMenuSubButton\",\n  \"SidebarMenuSubItem\",\n  \"SidebarProvider\",\n  \"SidebarRail\",\n  \"SidebarSeparator\",\n  \"SidebarTrigger\",\n  \"Skeleton\",\n  \"SkeletonDetail\",\n  \"SkeletonList\",\n  \"SkeletonTable\",\n  \"Slide\",\n  \"SlideHeader\",\n  \"Slider\",\n  \"SliderControl\",\n  \"SlideThemeContext\",\n  \"SlideThemeProvider\",\n  \"SlowNetworkBar\",\n  \"SourceInspector\",\n  \"SourceInspectorContext\",\n  \"SourceInspectorDevImpl\",\n  \"SourceInspectorProvider\",\n  \"SourceInspectorRunner\",\n  \"SourceInspectorToggle\",\n  \"SpacingScale\",\n  \"SpacingSection\",\n  \"SpacingSlide\",\n  \"Sparkline\",\n  \"SpecimenCard\",\n  \"SpecimenCardFooter\",\n  \"Sphere\",\n  \"SpherePlayground\",\n  \"Spinner\",\n  \"Stack\",\n  \"Stage\",\n  \"StatCard\",\n  \"StatHero\",\n  \"StationSpectrum\",\n  \"StatusBadge\",\n  \"StatusColorsSlide\",\n  \"StatusDot\",\n  \"Stepper\",\n  \"StepperContext\",\n  \"StepperDescription\",\n  \"StepperItem\",\n  \"StepperSeparator\",\n  \"StepperTitle\",\n  \"StepperTrigger\",\n  \"StepsSection\",\n  \"StructuredPrompt\",\n  \"StructuredPromptBody\",\n  \"StructuredPromptHeader\",\n  \"StructuredPromptHint\",\n  \"StructuredPromptSlot\",\n  \"SuccessLiveRegion\",\n  \"SurfaceRow\",\n  \"SurfaceScaleStack\",\n  \"SurfaceSection\",\n  \"Switch\",\n  \"Table\",\n  \"TableBody\",\n  \"TableCaption\",\n  \"TableCell\",\n  \"TableFooter\",\n  \"TableHead\",\n  \"TableHeader\",\n  \"TableRow\",\n  \"Tabs\",\n  \"TabsContent\",\n  \"TabsList\",\n  \"TabsTrigger\",\n  \"TagInput\",\n  \"TestimonialAttribution\",\n  \"TestimonialSection\",\n  \"Text\",\n  \"Textarea\",\n  \"ThemeArchitectureSlide\",\n  \"ThemeColorsSlide\",\n  \"ThemeSwitcher\",\n  \"Timeline\",\n  \"TimelineContent\",\n  \"TimelineDescription\",\n  \"TimelineIcon\",\n  \"TimelineItem\",\n  \"TimelineTimestamp\",\n  \"TimelineTitle\",\n  \"TitleSlide\",\n  \"ToastCard\",\n  \"ToastCardStack\",\n  \"Toaster\",\n  \"TOCSlide\",\n  \"ToggleButton\",\n  \"ToggleDevImpl\",\n  \"ToggleGroup\",\n  \"ToggleGroupContext\",\n  \"ToggleGroupItem\",\n  \"Tooltip\",\n  \"TooltipContent\",\n  \"TooltipProvider\",\n  \"TooltipTrigger\",\n  \"TypeBodySlide\",\n  \"TypeDisplaySlide\",\n  \"TypeScaleStack\",\n  \"TypeSpecimen\",\n  \"TypographySection\",\n  \"Vignette\",\n  \"WorkspaceSwitcher\",\n])\n"
+          "content": "// THIS FILE IS GENERATED BY scripts/generate-visor-component-names.ts.\n// Do not edit by hand. Re-run `npm run generate:component-names` after\n// adding, removing, or renaming a Visor component.\n//\n// Source of truth: registry/registry-{ui,blocks,deck,visual,devtools}.ts\n// Used by: components/devtools/source-inspector/* (VI-311)\n\nexport const VISOR_COMPONENT_NAMES: ReadonlySet<string> = new Set([\n  \"AccessibilitySection\",\n  \"AccessibilitySlide\",\n  \"AccessibilitySpecimen\",\n  \"Accordion\",\n  \"AccordionContent\",\n  \"AccordionItem\",\n  \"AccordionTrigger\",\n  \"ActivityFeed\",\n  \"ActivityFeedContext\",\n  \"ActivityFeedItem\",\n  \"ActivityFeedRoot\",\n  \"AdminDashboard\",\n  \"AdminDetail\",\n  \"AdminDetailDrawer\",\n  \"AdminListPage\",\n  \"AdminListPageInner\",\n  \"AdminSettingsPage\",\n  \"AdminShell\",\n  \"AdminTabbedEditor\",\n  \"AdminWizard\",\n  \"Alert\",\n  \"AlertActions\",\n  \"AlertDescription\",\n  \"AlertTitle\",\n  \"AmbientGlow\",\n  \"Avatar\",\n  \"AvatarFallback\",\n  \"AvatarImage\",\n  \"AvatarStack\",\n  \"Badge\",\n  \"Banner\",\n  \"BannerAction\",\n  \"BannerDescription\",\n  \"BannerTitle\",\n  \"BentoGrid\",\n  \"BentoTile\",\n  \"BentoTileBody\",\n  \"BentoTileDescription\",\n  \"BentoTileFigure\",\n  \"BentoTileHeadline\",\n  \"BentoTileMedia\",\n  \"BentoTileMeta\",\n  \"BentoTileTitle\",\n  \"Box\",\n  \"Breadcrumb\",\n  \"BreadcrumbEllipsis\",\n  \"BreadcrumbItem\",\n  \"BreadcrumbLink\",\n  \"BreadcrumbList\",\n  \"BreadcrumbPage\",\n  \"BreadcrumbSeparator\",\n  \"BrowserFrame\",\n  \"BulkActionBar\",\n  \"Button\",\n  \"ButtonSpecimenSection\",\n  \"ButtonSpecimenSlide\",\n  \"Calendar\",\n  \"Capture\",\n  \"Card\",\n  \"CardContent\",\n  \"CardDescription\",\n  \"CardFooter\",\n  \"CardGrid\",\n  \"CardHeader\",\n  \"CardLift\",\n  \"CardTitle\",\n  \"Carousel\",\n  \"CarouselContent\",\n  \"CarouselContext\",\n  \"CarouselGallery\",\n  \"CarouselItem\",\n  \"CarouselNext\",\n  \"CarouselPrevious\",\n  \"ChallengeCard\",\n  \"ChallengeCardAction\",\n  \"ChallengeCardActions\",\n  \"ChallengeCardBody\",\n  \"ChallengeCardGate\",\n  \"ChallengeCardHeader\",\n  \"ChartContainer\",\n  \"ChartContext\",\n  \"ChartLegend\",\n  \"ChartLegendContent\",\n  \"ChartStyle\",\n  \"ChartTooltip\",\n  \"ChartTooltipContent\",\n  \"Checkbox\",\n  \"CheckGroup\",\n  \"CheckRow\",\n  \"Chip\",\n  \"ChipGroup\",\n  \"ChipGroupContext\",\n  \"ChipGroupItem\",\n  \"ChoiceChip\",\n  \"ChromeButton\",\n  \"ClosingSlide\",\n  \"CodeBlock\",\n  \"Collapsible\",\n  \"CollapsibleContent\",\n  \"CollapsibleTrigger\",\n  \"ColorBar\",\n  \"ColorPaletteSection\",\n  \"ColorPicker\",\n  \"ColorPickerSurface\",\n  \"ColorSwatch\",\n  \"ColorSwatchGrid\",\n  \"Combobox\",\n  \"ComboboxContent\",\n  \"ComboboxContext\",\n  \"ComboboxEmpty\",\n  \"ComboboxGroup\",\n  \"ComboboxInput\",\n  \"ComboboxItem\",\n  \"ComboboxSeparator\",\n  \"Command\",\n  \"CommandDialog\",\n  \"CommandEmpty\",\n  \"CommandGroup\",\n  \"CommandInput\",\n  \"CommandItem\",\n  \"CommandList\",\n  \"CommandLoading\",\n  \"CommandSeparator\",\n  \"CommandShortcut\",\n  \"ComponentShowcaseContent\",\n  \"ComponentShowcaseSection\",\n  \"ComponentShowcaseSlide\",\n  \"Composer\",\n  \"ComposerContext\",\n  \"ComposerField\",\n  \"ComposerSend\",\n  \"ComposerSpacer\",\n  \"ComposerToolbar\",\n  \"ComposerToolButton\",\n  \"ConceptSlide\",\n  \"ConfigurationPanel\",\n  \"ConfirmDialog\",\n  \"ConflictBanner\",\n  \"Container\",\n  \"ContextMenu\",\n  \"ContextMenuCheckboxItem\",\n  \"ContextMenuContent\",\n  \"ContextMenuGroup\",\n  \"ContextMenuItem\",\n  \"ContextMenuLabel\",\n  \"ContextMenuPortal\",\n  \"ContextMenuRadioGroup\",\n  \"ContextMenuRadioItem\",\n  \"ContextMenuSeparator\",\n  \"ContextMenuShortcut\",\n  \"ContextMenuSub\",\n  \"ContextMenuSubContent\",\n  \"ContextMenuSubTrigger\",\n  \"ContextMenuTrigger\",\n  \"Controls\",\n  \"CtaSection\",\n  \"DataTable\",\n  \"DataTableInner\",\n  \"DatePicker\",\n  \"DateRangePicker\",\n  \"DeckContext\",\n  \"DeckFooter\",\n  \"DeckLayout\",\n  \"DeckProvider\",\n  \"DeckRenderer\",\n  \"DesignSystemDeck\",\n  \"DesignSystemSpecimen\",\n  \"Dialog\",\n  \"DialogClose\",\n  \"DialogContent\",\n  \"DialogDescription\",\n  \"DialogField\",\n  \"DialogFieldControl\",\n  \"DialogFieldLabel\",\n  \"DialogFooter\",\n  \"DialogForm\",\n  \"DialogFormBody\",\n  \"DialogFormClose\",\n  \"DialogFormContent\",\n  \"DialogFormDescription\",\n  \"DialogFormFooter\",\n  \"DialogFormHeader\",\n  \"DialogFormTitle\",\n  \"DialogFormTrigger\",\n  \"DialogHeader\",\n  \"DialogOverlay\",\n  \"DialogPortal\",\n  \"DialogTitle\",\n  \"DialogTrigger\",\n  \"DocFrame\",\n  \"DocFrameBrand\",\n  \"DocNav\",\n  \"DocNavGroup\",\n  \"DocNavPill\",\n  \"DotNav\",\n  \"DropdownMenu\",\n  \"DropdownMenuCheckboxItem\",\n  \"DropdownMenuContent\",\n  \"DropdownMenuGroup\",\n  \"DropdownMenuItem\",\n  \"DropdownMenuLabel\",\n  \"DropdownMenuPortal\",\n  \"DropdownMenuRadioGroup\",\n  \"DropdownMenuRadioItem\",\n  \"DropdownMenuSeparator\",\n  \"DropdownMenuShortcut\",\n  \"DropdownMenuSub\",\n  \"DropdownMenuSubContent\",\n  \"DropdownMenuSubTrigger\",\n  \"DropdownMenuTrigger\",\n  \"EditableBlock\",\n  \"ElevationCard\",\n  \"ElevationSlide\",\n  \"EmptyState\",\n  \"ErrorPlacard\",\n  \"ExportMenu\",\n  \"FeaturesGrid\",\n  \"FidelityMirror\",\n  \"Field\",\n  \"FieldDescription\",\n  \"FieldError\",\n  \"FieldLabel\",\n  \"Fieldset\",\n  \"FieldsetLegend\",\n  \"FileUpload\",\n  \"FilterBar\",\n  \"FilterChip\",\n  \"FontShowcase\",\n  \"FontShowcaseGrid\",\n  \"Footer\",\n  \"FooterSection\",\n  \"Form\",\n  \"FormError\",\n  \"FormErrorDescription\",\n  \"FormErrorTitle\",\n  \"FormField\",\n  \"FormSpecimenSection\",\n  \"FormSpecimenSlide\",\n  \"FullscreenOverlay\",\n  \"FullscreenOverlayContent\",\n  \"FullscreenOverlayTrigger\",\n  \"GrainOverlay\",\n  \"Grid\",\n  \"Header\",\n  \"Heading\",\n  \"HeroGlow\",\n  \"HeroSection\",\n  \"HeroSlide\",\n  \"HoverCard\",\n  \"HoverCardContent\",\n  \"HoverCardTrigger\",\n  \"IconGrid\",\n  \"IconGridSection\",\n  \"IconSizeRow\",\n  \"IconsSlide\",\n  \"Image\",\n  \"InfographicBar\",\n  \"Inline\",\n  \"Input\",\n  \"Kbd\",\n  \"KeyValueList\",\n  \"Label\",\n  \"Landing\",\n  \"Lightbox\",\n  \"LightboxContent\",\n  \"LightboxContext\",\n  \"LightboxTrigger\",\n  \"LoginForm\",\n  \"Marquee\",\n  \"MarqueeBandRenderer\",\n  \"MatrixCell\",\n  \"MatrixTable\",\n  \"MatrixTableInner\",\n  \"Menubar\",\n  \"MenubarCheckboxItem\",\n  \"MenubarContent\",\n  \"MenubarGroup\",\n  \"MenubarItem\",\n  \"MenubarLabel\",\n  \"MenubarMenu\",\n  \"MenubarRadioGroup\",\n  \"MenubarRadioItem\",\n  \"MenubarSeparator\",\n  \"MenubarShortcut\",\n  \"MenubarSub\",\n  \"MenubarSubContent\",\n  \"MenubarSubTrigger\",\n  \"MenubarTrigger\",\n  \"MonthCalendar\",\n  \"MotionDuration\",\n  \"MotionDurationSection\",\n  \"MotionEasing\",\n  \"MotionEasingSection\",\n  \"MotionSlide\",\n  \"NameRoster\",\n  \"NameRosterItem\",\n  \"Navbar\",\n  \"NavbarBrand\",\n  \"NavbarContent\",\n  \"NavbarItem\",\n  \"NavbarLink\",\n  \"NavbarToggle\",\n  \"NumberInput\",\n  \"OfflineBanner\",\n  \"OpacityBar\",\n  \"OpacitySlide\",\n  \"OTPInput\",\n  \"PageHeader\",\n  \"Pagination\",\n  \"PaginationContent\",\n  \"PaginationEllipsis\",\n  \"PaginationItem\",\n  \"PaginationLink\",\n  \"PaginationNext\",\n  \"PaginationPrevious\",\n  \"PasswordInput\",\n  \"PhoneInput\",\n  \"PlatformChip\",\n  \"Popover\",\n  \"PopoverAnchor\",\n  \"PopoverContent\",\n  \"PopoverFooter\",\n  \"PopoverSelectionItem\",\n  \"PopoverSelectionLabel\",\n  \"PopoverSelectionList\",\n  \"PopoverTrigger\",\n  \"PricingSection\",\n  \"ProfileMenu\",\n  \"Progress\",\n  \"PrototypeReview\",\n  \"QuickActions\",\n  \"RadioGroup\",\n  \"RadioGroupItem\",\n  \"RadiusScale\",\n  \"RadiusSection\",\n  \"RadiusSlide\",\n  \"RecordSection\",\n  \"RightRailList\",\n  \"ScoreIndicator\",\n  \"ScrollArea\",\n  \"ScrollBar\",\n  \"SearchInput\",\n  \"SectionHeader\",\n  \"SectionIntro\",\n  \"SectionNav\",\n  \"SectionNavItem\",\n  \"SegmentedProgress\",\n  \"Select\",\n  \"SelectContent\",\n  \"SelectGroup\",\n  \"SelectionListContext\",\n  \"SelectItem\",\n  \"SelectLabel\",\n  \"SelectScrollDownButton\",\n  \"SelectScrollUpButton\",\n  \"SelectSeparator\",\n  \"SelectTrigger\",\n  \"SelectValue\",\n  \"SemanticColorGrid\",\n  \"SemanticColorItem\",\n  \"SemanticTokensSlide\",\n  \"SensitivePanel\",\n  \"Separator\",\n  \"SessionTimeout\",\n  \"ShadowSection\",\n  \"Sheet\",\n  \"SheetClose\",\n  \"SheetContent\",\n  \"SheetDescription\",\n  \"SheetFooter\",\n  \"SheetHeader\",\n  \"SheetOverlay\",\n  \"SheetPortal\",\n  \"SheetTitle\",\n  \"SheetTrigger\",\n  \"Sidebar\",\n  \"SidebarContent\",\n  \"SidebarContext\",\n  \"SidebarFooter\",\n  \"SidebarGroup\",\n  \"SidebarGroupAction\",\n  \"SidebarGroupContent\",\n  \"SidebarGroupLabel\",\n  \"SidebarHeader\",\n  \"SidebarInset\",\n  \"SidebarMenu\",\n  \"SidebarMenuAction\",\n  \"SidebarMenuBadge\",\n  \"SidebarMenuButton\",\n  \"SidebarMenuItem\",\n  \"SidebarMenuSub\",\n  \"SidebarMenuSubButton\",\n  \"SidebarMenuSubItem\",\n  \"SidebarProvider\",\n  \"SidebarRail\",\n  \"SidebarSeparator\",\n  \"SidebarTrigger\",\n  \"Skeleton\",\n  \"SkeletonDetail\",\n  \"SkeletonList\",\n  \"SkeletonTable\",\n  \"Slide\",\n  \"SlideHeader\",\n  \"Slider\",\n  \"SliderControl\",\n  \"SlideThemeContext\",\n  \"SlideThemeProvider\",\n  \"SlowNetworkBar\",\n  \"SourceInspector\",\n  \"SourceInspectorContext\",\n  \"SourceInspectorDevImpl\",\n  \"SourceInspectorProvider\",\n  \"SourceInspectorRunner\",\n  \"SourceInspectorToggle\",\n  \"SpacingScale\",\n  \"SpacingSection\",\n  \"SpacingSlide\",\n  \"Sparkline\",\n  \"SpecimenCard\",\n  \"SpecimenCardFooter\",\n  \"Sphere\",\n  \"SpherePlayground\",\n  \"Spinner\",\n  \"SpinnerOrb\",\n  \"Stack\",\n  \"Stage\",\n  \"StatCard\",\n  \"StatHero\",\n  \"StationSpectrum\",\n  \"StatusBadge\",\n  \"StatusColorsSlide\",\n  \"StatusDot\",\n  \"Stepper\",\n  \"StepperContext\",\n  \"StepperDescription\",\n  \"StepperItem\",\n  \"StepperSeparator\",\n  \"StepperTitle\",\n  \"StepperTrigger\",\n  \"StepsSection\",\n  \"StructuredPrompt\",\n  \"StructuredPromptBody\",\n  \"StructuredPromptHeader\",\n  \"StructuredPromptHint\",\n  \"StructuredPromptSlot\",\n  \"SuccessLiveRegion\",\n  \"SurfaceRow\",\n  \"SurfaceScaleStack\",\n  \"SurfaceSection\",\n  \"Switch\",\n  \"Table\",\n  \"TableBody\",\n  \"TableCaption\",\n  \"TableCell\",\n  \"TableFooter\",\n  \"TableHead\",\n  \"TableHeader\",\n  \"TableRow\",\n  \"Tabs\",\n  \"TabsContent\",\n  \"TabsList\",\n  \"TabsTrigger\",\n  \"TagInput\",\n  \"TestimonialAttribution\",\n  \"TestimonialSection\",\n  \"Text\",\n  \"Textarea\",\n  \"ThemeArchitectureSlide\",\n  \"ThemeColorsSlide\",\n  \"ThemeSwitcher\",\n  \"Timeline\",\n  \"TimelineContent\",\n  \"TimelineDescription\",\n  \"TimelineIcon\",\n  \"TimelineItem\",\n  \"TimelineTimestamp\",\n  \"TimelineTitle\",\n  \"TitleSlide\",\n  \"ToastCard\",\n  \"ToastCardStack\",\n  \"Toaster\",\n  \"TOCSlide\",\n  \"ToggleButton\",\n  \"ToggleDevImpl\",\n  \"ToggleGroup\",\n  \"ToggleGroupContext\",\n  \"ToggleGroupItem\",\n  \"Tooltip\",\n  \"TooltipContent\",\n  \"TooltipProvider\",\n  \"TooltipTrigger\",\n  \"TypeBodySlide\",\n  \"TypeDisplaySlide\",\n  \"TypeScaleStack\",\n  \"TypeSpecimen\",\n  \"TypographySection\",\n  \"Vignette\",\n  \"WorkspaceSwitcher\",\n])\n"
         }
       ]
     },

package/dist/visor-manifest.json

@@ -1,6 +1,6 @@
 {
   "version": "0.4.0",
-  "generated_at": "2026-09-19T02:57:14.093Z",
+  "generated_at": "2026-09-23T03:16:40.729Z",
   "components": {
     "accessibility-specimen": {
       "category": "specimen",
@@ -8445,11 +8445,12 @@
     },
     "spinner": {
       "category": "data-display",
-      "description": "Inline loading spinner — a rotating border ring with a subtle track and a tone-colored leading edge. Three sizes (xs/sm/md), two tones (default/primary), and full reduced-motion support.",
+      "description": "Loading spinner — an inline rotating border ring, or a dotted thinking-orb (nine animations) for waits over larger surfaces. Three sizes (xs/sm/md), two tones (default/primary), and full reduced-motion support.",
       "when_to_use": [
         "Indicating an async operation is in progress within a button, form field, or inline context",
         "Replacing text or an icon while content is loading (inline, non-blocking)",
-        "Decorative loading affordance inside a card or panel where a full-page skeleton would be too heavy"
+        "Decorative loading affordance inside a card or panel where a full-page skeleton would be too heavy",
+        "A wait over a large visual (a card re-rendering under a scrim, an agent thinking) — use variant=\"orb\" at md (64px)"
       ],
       "when_not_to_use": [
         "Full-page or full-section loading states (use Skeleton instead)",
@@ -8457,6 +8458,10 @@
         "Indicating indeterminate progress for a long-running task visible to the user (use a labeled progress bar)"
       ],
       "variants": {
+        "variant": [
+          "ring",
+          "orb"
+        ],
         "size": [
           "xs",
           "sm",
@@ -8472,13 +8477,25 @@
           "name": "size",
           "type": "\"xs\" | \"sm\" | \"md\"",
           "default": "\"md\"",
-          "description": "Ring size. xs=12px, sm=16px, md=24px."
+          "description": "Size. Ring — xs=12px, sm=16px, md=24px. Orb — xs=20px, sm=32px, md=64px (20 and 64 are hand-tuned designs; 32 is interpolated)."
         },
         {
           "name": "tone",
           "type": "\"default\" | \"primary\"",
           "default": "\"default\"",
-          "description": "Color treatment for the leading edge. default=text-tertiary, primary=primary brand token."
+          "description": "Color treatment. Ring leading edge — default=text-tertiary, primary=primary brand token. Orb ink — default=the surrounding text colour, primary=primary brand token."
+        },
+        {
+          "name": "variant",
+          "type": "\"ring\" | \"orb\"",
+          "default": "\"ring\"",
+          "description": "ring is the inline rotating border. orb is a dotted thinking-orb canvas (thinking-orbs) for waits over larger surfaces."
+        },
+        {
+          "name": "orb",
+          "type": "\"working\" | \"searching\" | \"solving\" | \"listening\" | \"connecting\" | \"weaving\" | \"composing\" | \"breathing\" | \"shaping\"",
+          "default": "\"working\"",
+          "description": "Which orb animation to show. Read only when variant=\"orb\"."
         },
         {
           "name": "label",
@@ -8488,6 +8505,7 @@
       ],
       "dependencies": [
         "class-variance-authority",
+        "thinking-orbs",
         "@loworbitstudio/visor-core"
       ],
       "tokens_used": [
@@ -8512,7 +8530,7 @@
         "--stroke-width-thin",
         "--text-tertiary"
       ],
-      "example": "<Spinner />\n<Spinner size=\"xs\" tone=\"primary\" />\n<Spinner size=\"sm\" label=\"Loading results…\" />\n"
+      "example": "<Spinner />\n<Spinner size=\"xs\" tone=\"primary\" />\n<Spinner size=\"sm\" label=\"Loading results…\" />\n<Spinner variant=\"orb\" orb=\"working\" label=\"Rendering preview…\" />\n"
     },
     "stack": {
       "category": "layout",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@loworbitstudio/visor",
-  "version": "1.26.1",
+  "version": "1.27.0",
   "description": "CLI for the Visor design system — add components, hooks, and utilities to your project.",
   "type": "module",
   "bin": {
@@ -46,7 +46,7 @@
   "dependencies": {
     "@aws-sdk/client-s3": "^3.1021.0",
     "@babel/parser": "^7.26.0",
-    "@loworbitstudio/visor-theme-engine": "^0.20.0",
+    "@loworbitstudio/visor-theme-engine": "^0.21.0",
     "commander": "^13.1.0",
     "diff": "^8.0.4",
     "picocolors": "^1.1.1",