{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "spinner",
  "title": "Spinner",
  "description": "Something is happening, with no known end.",
  "registryDependencies": [
    "https://creance.pages.dev/r/creance-base.json"
  ],
  "files": [
    {
      "path": "spinner/Spinner.css",
      "content": ".cr-spinner {\n  display: inline-flex;\n  width: 16px;\n  height: 16px;\n  color: var(--cr-color-text-default);\n}\n\n.cr-spinner[data-size='sm'] {\n  width: 12px;\n  height: 12px;\n}\n\n.cr-spinner__svg {\n  width: 100%;\n  height: 100%;\n  animation: cr-spin 0.8s linear infinite;\n}\n\n.cr-spinner__track { stroke: var(--cr-color-border-default); }\n.cr-spinner__arc { stroke: currentColor; }\n\n@keyframes cr-spin {\n  to { transform: rotate(360deg); }\n}\n\n/* Reduced motion: a static ring. The label (if any) still says what is happening. */\n@media (prefers-reduced-motion: reduce) {\n  .cr-spinner__svg { animation: none; }\n}\n",
      "type": "registry:file",
      "target": "@components/creance/spinner/Spinner.css"
    },
    {
      "path": "spinner/Spinner.tsx",
      "content": "import { cx } from '@/lib/creance/cx';\nimport './Spinner.css';\n\nexport interface SpinnerProps {\n  /** When set, the spinner is announced as a status. Leave unset when visible text already says what is loading. */\n  label?: string;\n  size?: 'sm' | 'md';\n  className?: string;\n}\n\nexport function Spinner({ label, size = 'md', className }: SpinnerProps) {\n  const svg = (\n    <svg className=\"cr-spinner__svg\" viewBox=\"0 0 16 16\" aria-hidden=\"true\" focusable=\"false\">\n      <circle cx=\"8\" cy=\"8\" r=\"6\" fill=\"none\" strokeWidth=\"2\" className=\"cr-spinner__track\" />\n      <path d=\"M8 2a6 6 0 0 1 6 6\" fill=\"none\" strokeWidth=\"2\" strokeLinecap=\"round\" className=\"cr-spinner__arc\" />\n    </svg>\n  );\n  return label ? (\n    <span role=\"status\" className={cx('cr-spinner', className)} data-size={size}>\n      {svg}\n      <span className=\"cr-visually-hidden\">{label}</span>\n    </span>\n  ) : (\n    <span className={cx('cr-spinner', className)} data-size={size} aria-hidden=\"true\">\n      {svg}\n    </span>\n  );\n}\n",
      "type": "registry:ui",
      "target": "@components/creance/spinner/Spinner.tsx"
    }
  ],
  "categories": [
    "atom",
    "feedback"
  ],
  "type": "registry:ui"
}