{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "aurora-ai-shimmer",
  "title": "Aurora AI Shimmer",
  "author": "jmagar <https://github.com/jmagar>",
  "description": "Aurora-native shimmer parity surface from AI Elements.",
  "dependencies": [
    "lucide-react@^0.487.0"
  ],
  "registryDependencies": [
    "@aurora/aurora-tokens",
    "@aurora/aurora-ai-elements",
    "@aurora/aurora-components"
  ],
  "files": [
    {
      "path": "registry/aurora/blocks/ai/elements/shimmer.tsx",
      "content": "\"use client\"\n\nimport * as React from \"react\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\nimport { cn } from \"@/lib/utils\"\n\n// Styles: registry/aurora/styles/aurora-components.css (@layer aurora-components).\n\n// ---------------------------------------------------------------------------\n// CVA variants\n// ---------------------------------------------------------------------------\n\nconst shimmerVariants = cva(\"aurora-ai-shimmer-bar shrink-0 overflow-hidden\", {\n  variants: {\n    variant: {\n      // Single skeleton line.\n      line: \"h-3 w-full rounded-full\",\n      // Stack of skeleton lines (rendered as a flex column wrapper).\n      lines: \"\",\n      // Solid block / media placeholder.\n      block: \"h-24 w-full rounded-[var(--aurora-radius-1)]\",\n      // Circular avatar placeholder.\n      avatar: \"size-10 rounded-full\",\n      // Card composition (avatar + text rows in an elevated panel).\n      card: \"\",\n    },\n  },\n  defaultVariants: {\n    variant: \"line\",\n  },\n})\n\ntype ShimmerBaseProps = Omit<React.HTMLAttributes<HTMLDivElement>, \"color\"> &\n  VariantProps<typeof shimmerVariants> & {\n    /** Number of lines to render when `variant=\"lines\"`. */\n    lines?: number\n  }\n\nexport type ShimmerProps = ShimmerBaseProps\n\nfunction ShimmerBar({\n  className,\n  style,\n}: {\n  className?: string\n  style?: React.CSSProperties\n}) {\n  return (\n    <div\n      aria-hidden=\"true\"\n      className={cn(\"aurora-ai-shimmer-bar shrink-0 overflow-hidden\", className)}\n      style={style}\n    />\n  )\n}\n\nconst Shimmer = ({ ref, className, style, variant = \"line\", lines = 3, role, ...props }: ShimmerProps & { ref?: React.Ref<HTMLDivElement> }) => {\n    const a11y = {\n      role: role ?? \"status\",\n      \"aria-busy\": true as const,\n      \"aria-live\": \"polite\" as const,\n      \"aria-label\": props[\"aria-label\"] ?? \"Loading content\",\n    }\n\n    // Multiple stacked lines; the final line is shortened to read as a paragraph.\n    if (variant === \"lines\") {\n      return (\n        <div\n          ref={ref}\n          className={cn(\"flex w-full flex-col gap-2.5\", className)}\n          style={style}\n          {...a11y}\n          {...props}\n        >\n          {Array.from({ length: Math.max(1, lines) }).map((_, i) => (\n            <ShimmerBar\n              key={i}\n              className=\"h-3 rounded-full\"\n              style={{ width: i === lines - 1 ? \"62%\" : \"100%\" }}\n            />\n          ))}\n        </div>\n      )\n    }\n\n    // Card: elevated panel with an avatar and three text rows.\n    if (variant === \"card\") {\n      return (\n        <div\n          ref={ref}\n          className={cn(\"flex w-full items-start gap-4\", className)}\n          style={{\n            padding: \"16px 18px\",\n            borderRadius: \"var(--aurora-radius-2)\",\n            border: \"1px solid var(--aurora-border-default)\",\n            background: \"var(--aurora-panel-medium)\",\n            boxShadow: \"var(--aurora-shadow-strong), var(--aurora-highlight-strong)\",\n            ...style,\n          }}\n          {...a11y}\n          {...props}\n        >\n          <ShimmerBar className=\"aurora-ai-shimmer-bar size-12 rounded-full\" />\n          <div className=\"flex min-w-0 flex-1 flex-col gap-2.5 pt-1\">\n            <ShimmerBar className=\"h-3 rounded-full\" style={{ width: \"52%\" }} />\n            <ShimmerBar className=\"h-3 rounded-full\" style={{ width: \"100%\" }} />\n            <ShimmerBar className=\"h-3 rounded-full\" style={{ width: \"76%\" }} />\n          </div>\n        </div>\n      )\n    }\n\n    // Single line / block / avatar primitives.\n    return (\n      <div\n        ref={ref}\n        className={cn(shimmerVariants({ variant }), className)}\n        style={style}\n        {...a11y}\n        {...props}\n      />\n    )\n  }\nShimmer.displayName = \"Shimmer\"\n\nexport { Shimmer, shimmerVariants }\n",
      "type": "registry:component",
      "target": "@components/aurora/ai/shimmer.tsx"
    }
  ],
  "meta": {
    "namespace": "@aurora",
    "style": "aurora",
    "family": "block",
    "requiresTokens": true,
    "sourcePath": "registry/aurora/blocks/ai/elements/shimmer.tsx",
    "installTarget": "@components/aurora/ai/shimmer.tsx",
    "taxonomy": "ai"
  },
  "docs": "Aurora block that installs Aurora AI Shimmer.\n\nInstall `aurora-tokens`, `aurora-ai-elements`, and `aurora-components` first; the shadcn CLI resolves these automatically through the @aurora registry namespace.\n\nDefault install target: `@components/aurora/ai/shimmer.tsx`.\n\nRegistry dependencies: `aurora-tokens`, `aurora-ai-elements`, `aurora-components`.",
  "categories": [
    "aurora",
    "block",
    "ai"
  ],
  "type": "registry:block"
}