{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "skeleton",
  "title": "Skeleton",
  "registryDependencies": [
    "https://ui.hotfix.jobs/r/tokens.json",
    "https://ui.hotfix.jobs/r/utils.json"
  ],
  "files": [
    {
      "path": "registry/components/ui/skeleton.tsx",
      "content": "import type * as React from \"react\";\nimport { cn } from \"@/lib/utils\";\n\nexport interface SkeletonProps\n  extends Omit<React.HTMLAttributes<HTMLDivElement>, \"children\"> {\n  /** Number → px; string passed through. */\n  width?: number | string;\n  /** Number → px; string passed through. */\n  height?: number | string;\n  shape?: \"rounded\" | \"pill\" | \"squared\";\n  animated?: boolean;\n  /** When false, render `children` instead of the skeleton. */\n  show?: boolean;\n  children?: React.ReactNode;\n}\n\n/** Placeholder for async content. */\nexport function Skeleton({\n  className,\n  width,\n  height,\n  shape = \"rounded\",\n  animated = true,\n  show = true,\n  children,\n  style,\n  ...props\n}: SkeletonProps): React.ReactElement {\n  if (!show) return <>{children}</> as unknown as React.ReactElement;\n\n  const dimStyle: React.CSSProperties = {\n    ...(width != null && { width: typeof width === \"number\" ? `${width}px` : width }),\n    ...(height != null && { height: typeof height === \"number\" ? `${height}px` : height }),\n    ...style,\n  };\n\n  return (\n    <div\n      aria-hidden=\"true\"\n      data-slot=\"skeleton\"\n      className={cn(\n        \"bg-fill-2\",\n        shape === \"rounded\" && \"rounded-[var(--radius-6)]\",\n        shape === \"squared\" && \"rounded-none\",\n        shape === \"pill\" && \"rounded-full\",\n        animated &&\n          \"animate-[patch-skeleton-pulse_1.8s_ease-in-out_infinite] motion-reduce:animate-none\",\n        className,\n      )}\n      style={dimStyle}\n      {...props}\n    />\n  );\n}\n",
      "type": "registry:ui",
      "target": "components/ui/skeleton.tsx"
    }
  ],
  "type": "registry:ui"
}