{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "skeleton",
  "title": "Skeleton",
  "description": "A placeholder the shape of what is coming, so the page does not jump when it arrives.",
  "registryDependencies": [
    "utils"
  ],
  "files": [
    {
      "path": "registry/default/skeleton/skeleton.tsx",
      "content": "import * as React from \"react\"\n\nimport { cn } from \"@/lib/utils\"\n\nexport type SkeletonProps = Omit<\n  React.HTMLAttributes<HTMLDivElement>,\n  \"children\"\n> & {\n  /** Render this many bars, the last one short, as a block of text would be. */\n  lines?: number\n}\n\n/**\n * A placeholder the shape of what is coming, so a page does not jump when it\n * arrives. Spinner says work is under way; this says the content is not here\n * yet, and holds its place.\n */\nexport function Skeleton({ lines, className, ...rootProps }: SkeletonProps) {\n  const bar =\n    \"bg-muted animate-pulse rounded-[calc(var(--radius)-0.35rem)] motion-reduce:animate-none\"\n\n  if (lines === undefined) {\n    return (\n      <div\n        aria-hidden=\"true\"\n        data-slot=\"skeleton\"\n        className={cn(bar, \"h-4 w-full\", className)}\n        {...rootProps}\n      />\n    )\n  }\n\n  return (\n    <div\n      aria-hidden=\"true\"\n      data-slot=\"skeleton\"\n      className={cn(\"grid gap-2\", className)}\n      {...rootProps}\n    >\n      {Array.from({ length: lines }, (_, index) => (\n        <div\n          key={index}\n          className={cn(bar, \"h-4\", index === lines - 1 && \"w-3/5\")}\n        />\n      ))}\n    </div>\n  )\n}\n",
      "type": "registry:ui"
    }
  ],
  "categories": [
    "feedback",
    "loading",
    "layout"
  ],
  "type": "registry:ui"
}