{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "progress",
  "type": "registry:ui",
  "title": "Progress، Spinner",
  "description": "نوار پیشرفت",
  "dependencies": [
    "@kashi-ui/persian@^1.8.0"
  ],
  "registryDependencies": [
    "https://kashi.sepantapouya.com/r/cx.json",
    "https://kashi.sepantapouya.com/r/kashi-provider.json"
  ],
  "files": [
    {
      "path": "registry/kashi/Progress.tsx",
      "type": "registry:ui",
      "target": "components/kashi/Progress.tsx",
      "content": "\"use client\";\n\nimport type { CSSProperties, HTMLAttributes, ReactNode } from \"react\";\nimport { toFaDigits } from \"@kashi-ui/persian\";\nimport { cx } from \"./cx\";\nimport { useKashi } from \"./KashiProvider\";\n\nexport interface ProgressProps extends HTMLAttributes<HTMLDivElement> {\n  /** مقدار؛ بدون آن نوار «نامعین» است */\n  value?: number;\n  /** @default 100 */\n  max?: number;\n  /** برچسب بالای نوار؛ اگر نمی‌دهید aria-label بدهید */\n  label?: ReactNode;\n  /** نمایش درصد کنار برچسب */\n  showValue?: boolean;\n  /** @default \"md\" */\n  size?: \"sm\" | \"md\" | \"lg\";\n  tone?: \"brand\" | \"success\" | \"warning\" | \"error\";\n  /** «circular»: حلقهٔ پیشرفت با درصد در وسط @default \"linear\" */\n  variant?: \"linear\" | \"circular\";\n}\n\nexport function Progress({ value, max = 100, label, showValue, size = \"md\", tone = \"brand\", variant = \"linear\", className, \"aria-label\": ariaLabel, ...rest }: ProgressProps) {\n  const { messages: M, n } = useKashi();\n  const pct = value === undefined ? undefined : Math.max(0, Math.min(100, (value / max) * 100));\n  const text = pct === undefined ? undefined : M.common.percent(n(Math.round(pct)));\n  if (variant === \"circular\") {\n    const r = 16;\n    const c = 2 * Math.PI * r;\n    return (\n      <div\n        role=\"progressbar\"\n        aria-valuemin={0}\n        aria-valuemax={max}\n        aria-valuenow={value}\n        aria-valuetext={text}\n        aria-label={ariaLabel ?? (typeof label === \"string\" ? label : undefined)}\n        className={cx(\"k-progress-ring\", size !== \"md\" && `k-progress-ring--${size}`, tone !== \"brand\" && `k-progress--${tone}`, pct === undefined && \"k-progress-ring--indeterminate\", className)}\n        {...rest}\n      >\n        <svg viewBox=\"0 0 40 40\" aria-hidden=\"true\">\n          <circle className=\"k-progress-ring__track\" cx=\"20\" cy=\"20\" r={r} />\n          <circle className=\"k-progress-ring__bar\" cx=\"20\" cy=\"20\" r={r} strokeDasharray={c} strokeDashoffset={pct === undefined ? c * 0.7 : c * (1 - pct / 100)} />\n        </svg>\n        {showValue && text && <span className=\"k-progress-ring__value\" aria-hidden=\"true\">{text}</span>}\n      </div>\n    );\n  }\n  const bar = (\n    <div\n      role=\"progressbar\"\n      aria-valuemin={0}\n      aria-valuemax={max}\n      aria-valuenow={value}\n      aria-valuetext={text}\n      aria-label={ariaLabel ?? (typeof label === \"string\" ? label : undefined)}\n      className={cx(\"k-progress\", size !== \"md\" && `k-progress--${size}`, tone !== \"brand\" && `k-progress--${tone}`, !label && className)}\n      {...rest}\n    >\n      <div className=\"k-progress__bar\" style={pct === undefined ? undefined : ({ \"--k-value\": `${pct}%` } as CSSProperties)} />\n    </div>\n  );\n  if (!label) return bar;\n  return (\n    <div className={cx(\"k-progress-field\", className)}>\n      <div className=\"k-progress-field__head\" aria-hidden=\"true\">\n        <span className=\"k-progress-field__label\">{label}</span>\n        {showValue && text && <span className=\"k-progress-field__value\">{text}</span>}\n      </div>\n      {bar}\n    </div>\n  );\n}\n\nexport interface SpinnerProps extends HTMLAttributes<HTMLSpanElement> {\n  /** @default \"در حال بارگذاری\" */\n  label?: string;\n  size?: \"sm\" | \"md\" | \"lg\";\n}\n\n/** اسپینر با متن صفحه‌خوان */\nexport function Spinner({ label, size = \"md\", className, ...rest }: SpinnerProps) {\n  const { messages: M } = useKashi();\n  label ??= M.common.loading;\n  return (\n    <span role=\"status\" className={className} {...rest}>\n      <span className={cx(\"k-spinner\", size !== \"md\" && `k-spinner--${size}`)} aria-hidden=\"true\" />\n      <span className=\"k-sr-only\">{label}</span>\n    </span>\n  );\n}\n"
    }
  ]
}