{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "skeleton",
  "title": "Skeleton",
  "description": "A placeholder while content loads.",
  "registryDependencies": [
    "https://creance.pages.dev/r/creance-base.json"
  ],
  "files": [
    {
      "path": "skeleton/Skeleton.css",
      "content": ".cr-skeleton {\n  display: block;\n  height: 12px;\n  border-radius: var(--cr-radius-full);\n  background: linear-gradient(90deg, var(--cr-color-bg-subtle) 30%, var(--cr-color-ink-subtle) 50%, var(--cr-color-bg-subtle) 70%);\n  background-size: 300% 100%;\n  animation: cr-skeleton-shimmer 1.6s ease-in-out infinite;\n}\n\n.cr-skeleton[data-shape='block'] {\n  height: 64px;\n  border-radius: var(--cr-radius-md);\n}\n\n.cr-skeleton[data-shape='circle'] {\n  width: 32px;\n  height: 32px;\n  border-radius: 10px;\n}\n\n@keyframes cr-skeleton-shimmer {\n  from { background-position: 100% 0; }\n  to { background-position: 0 0; }\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .cr-skeleton { animation: none; }\n}\n",
      "type": "registry:file",
      "target": "@components/creance/skeleton/Skeleton.css"
    },
    {
      "path": "skeleton/Skeleton.tsx",
      "content": "import type { CSSProperties, HTMLAttributes } from 'react';\nimport { cx } from '@/lib/creance/cx';\nimport './Skeleton.css';\n\nexport interface SkeletonProps extends HTMLAttributes<HTMLSpanElement> {\n  width?: CSSProperties['width'];\n  height?: CSSProperties['height'];\n  shape?: 'line' | 'block' | 'circle';\n}\n\n/**\n * A placeholder while content loads. Hidden from screen readers: mark the loading region with\n * `aria-busy` and announce the result instead.\n */\nexport function Skeleton({ width, height, shape = 'line', className, style, ...props }: SkeletonProps) {\n  return (\n    <span\n      aria-hidden\n      className={cx('cr-skeleton', className)}\n      data-shape={shape}\n      style={{ width, height, ...style }}\n      {...props}\n    />\n  );\n}\n",
      "type": "registry:ui",
      "target": "@components/creance/skeleton/Skeleton.tsx"
    }
  ],
  "categories": [
    "atom",
    "feedback"
  ],
  "type": "registry:ui"
}