{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "spinner",
  "title": "Spinner",
  "dependencies": [
    "class-variance-authority"
  ],
  "registryDependencies": [
    "https://ui.hotfix.jobs/r/tokens.json",
    "https://ui.hotfix.jobs/r/utils.json"
  ],
  "files": [
    {
      "path": "registry/components/ui/spinner.tsx",
      "content": "\"use client\";\n\nimport { cva, type VariantProps } from \"class-variance-authority\";\nimport type * as React from \"react\";\nimport { cn } from \"@/lib/utils\";\n\nconst spinnerVariants = cva(\n  \"relative inline-flex shrink-0 items-center justify-center\",\n  {\n    defaultVariants: { size: \"md\" },\n    variants: {\n      size: {\n        sm: \"size-4\",\n        md: \"size-5\",\n        lg: \"size-6\",\n      },\n    },\n  },\n);\n\ntype SpinnerSize = NonNullable<VariantProps<typeof spinnerVariants>[\"size\"]>;\n\nconst strokePx: Record<SpinnerSize, number> = {\n  sm: 2.5,\n  md: 2.75,\n  lg: 3,\n};\n\nexport interface SpinnerProps\n  extends React.ComponentProps<\"span\">,\n    VariantProps<typeof spinnerVariants> {\n  /** Accessible label. */\n  label?: string;\n}\n\nexport function Spinner({\n  className,\n  size = \"md\",\n  label = \"Loading\",\n  ...props\n}: SpinnerProps): React.ReactElement {\n  const resolvedSize: SpinnerSize = size ?? \"md\";\n  const stroke = strokePx[resolvedSize];\n  const radius = (24 - stroke) / 2;\n  const circumference = 2 * Math.PI * radius;\n  const arc = circumference * 0.28;\n\n  return (\n    <span\n      role=\"status\"\n      aria-label={label}\n      data-slot=\"spinner\"\n      className={cn(spinnerVariants({ size }), className)}\n      {...props}\n    >\n      <svg\n        aria-hidden=\"true\"\n        viewBox=\"0 0 24 24\"\n        className={cn(\n          \"size-full animate-spin motion-reduce:animate-none\",\n        )}\n      >\n        <circle\n          cx=\"12\"\n          cy=\"12\"\n          r={radius}\n          fill=\"none\"\n          stroke=\"currentColor\"\n          strokeWidth={stroke}\n          className=\"opacity-20\"\n        />\n        <circle\n          cx=\"12\"\n          cy=\"12\"\n          r={radius}\n          fill=\"none\"\n          stroke=\"currentColor\"\n          strokeWidth={stroke}\n          strokeLinecap=\"round\"\n          strokeDasharray={`${arc} ${circumference}`}\n        />\n      </svg>\n      <span className=\"sr-only\">{label}</span>\n    </span>\n  );\n}\n",
      "type": "registry:ui",
      "target": "components/ui/spinner.tsx"
    }
  ],
  "type": "registry:ui"
}