{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "shimmer-text",
  "type": "registry:ui",
  "title": "Shimmer Text",
  "description": "Animated gradient sweep across text — the canonical “Thinking…” / “Searching…” label for in-progress AI work.",
  "dependencies": [],
  "registryDependencies": [
    "https://kuro.abstergo.fyi/r/kura-theme.json",
    "utils"
  ],
  "files": [
    {
      "path": "registry/kura/shimmer-text/index.ts",
      "type": "registry:ui",
      "target": "components/kura/shimmer-text/index.ts",
      "content": "export { ShimmerText, type ShimmerTextProps } from \"./shimmer-text\";\n"
    },
    {
      "path": "registry/kura/shimmer-text/shimmer-text.tsx",
      "type": "registry:ui",
      "target": "components/kura/shimmer-text/shimmer-text.tsx",
      "content": "import type * as React from \"react\";\nimport { cn } from \"@/lib/utils\";\n\nexport interface ShimmerTextProps extends React.HTMLAttributes<HTMLElement> {\n  ref?: React.Ref<HTMLElement>;\n  /** The text to shimmer, e.g. \"Thinking…\". Plain text reads best; inline elements are allowed. */\n  children: React.ReactNode;\n  /** Animate the sweep. Set false when the work is done to settle into plain text. Default true. */\n  active?: boolean;\n  /** Seconds for one full sweep. Default 2. Shorter feels urgent; keep it between 1.5 and 3. */\n  duration?: number;\n  /** Width of the bright band as a percentage of the text width. Default 30. */\n  spread?: number;\n  /** Render as another element, e.g. \"p\" or \"div\". Default \"span\". */\n  as?: \"span\" | \"p\" | \"div\" | \"strong\" | \"em\";\n}\n\n/**\n * Animated gradient sweep across text — the canonical \"Thinking…\" / \"Searching the web…\"\n * affordance. Pure CSS (no JS animation loop), server-component safe, and static under\n * prefers-reduced-motion.\n */\nexport function ShimmerText({\n  children,\n  active = true,\n  duration = 2,\n  spread = 30,\n  as = \"span\",\n  className,\n  style,\n  ...props\n}: ShimmerTextProps) {\n  const band = Math.min(80, Math.max(5, spread)) / 2;\n  const Comp = as as \"span\";\n  return (\n    <Comp\n      data-slot=\"shimmer-text\"\n      data-active={active}\n      className={cn(\n        \"inline-block\",\n        active &&\n          \"animate-kura-shimmer bg-clip-text text-transparent [background-size:250%_100%] motion-reduce:animate-none motion-reduce:bg-none motion-reduce:text-kura-fg-muted\",\n        !active && \"text-kura-fg-muted transition-colors duration-(--kura-duration-slow)\",\n        className,\n      )}\n      style={\n        active\n          ? {\n              ...style,\n              [\"--kura-shimmer-duration\" as string]: `${duration}s`,\n              backgroundImage: `linear-gradient(90deg, var(--kura-fg-subtle) calc(50% - ${band}%), var(--kura-fg) 50%, var(--kura-fg-subtle) calc(50% + ${band}%))`,\n            }\n          : style\n      }\n      {...props}\n    >\n      {children}\n    </Comp>\n  );\n}\n"
    }
  ],
  "categories": [
    "feedback",
    "loading",
    "thinking",
    "status",
    "text"
  ],
  "docs": "Docs: https://kuro.abstergo.fyi/components/shimmer-text · Markdown for agents: https://kuro.abstergo.fyi/components/shimmer-text.md",
  "meta": {
    "kura": {
      "status": "beta",
      "whenToUse": [
        "Show that a model or agent is working: “Thinking…”, “Searching the web…”, “Reading 12 files…”.",
        "Label the current step of a running tool call or reasoning trace.",
        "A lightweight inline loading label where a spinner would be too mechanical."
      ],
      "whenNotToUse": [
        "Long paragraphs or body text — the sweep hurts legibility beyond a short phrase.",
        "Determinate progress (uploads, token budgets) — use a progress bar or context-meter.",
        "Streaming the model's answer itself — use streaming-text.",
        "A standalone animated dot/orb indicator — use thinking-indicator or agent-orb."
      ]
    }
  }
}