@particle-academy/react-fancy 5.23.1 → 5.24.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -103,7 +103,10 @@ var Progress = react.forwardRef(
103
103
  color = "blue",
104
104
  indeterminate = false,
105
105
  showValue = false,
106
- className
106
+ className,
107
+ trackClassName,
108
+ fillClassName,
109
+ ...rest
107
110
  }, ref) => {
108
111
  const named = typeof size === "number" ? "md" : size;
109
112
  const percentage = Math.min(100, Math.max(0, value / max * 100));
@@ -118,6 +121,7 @@ var Progress = react.forwardRef(
118
121
  "div",
119
122
  {
120
123
  ref,
124
+ ...rest,
121
125
  role: "progressbar",
122
126
  "aria-valuenow": indeterminate ? void 0 : value,
123
127
  "aria-valuemin": 0,
@@ -146,7 +150,7 @@ var Progress = react.forwardRef(
146
150
  r: radius,
147
151
  fill: "none",
148
152
  strokeWidth,
149
- className: "stroke-zinc-200 dark:stroke-zinc-700"
153
+ className: chunkZU5Q77OT_cjs.cn("stroke-zinc-200 dark:stroke-zinc-700", trackClassName)
150
154
  }
151
155
  ),
152
156
  /* @__PURE__ */ jsxRuntime.jsx(
@@ -160,7 +164,11 @@ var Progress = react.forwardRef(
160
164
  strokeLinecap: "round",
161
165
  strokeDasharray: circumference,
162
166
  strokeDashoffset: offset,
163
- className: chunkZU5Q77OT_cjs.cn(progressStroke[color], "transition-[stroke-dashoffset] duration-300"),
167
+ className: chunkZU5Q77OT_cjs.cn(
168
+ progressStroke[color],
169
+ "transition-[stroke-dashoffset] duration-300",
170
+ fillClassName
171
+ ),
164
172
  style: { transform: "rotate(-90deg)", transformOrigin: "center" }
165
173
  }
166
174
  )
@@ -189,6 +197,7 @@ var Progress = react.forwardRef(
189
197
  "div",
190
198
  {
191
199
  ref,
200
+ ...rest,
192
201
  role: "progressbar",
193
202
  "aria-valuenow": indeterminate ? void 0 : value,
194
203
  "aria-valuemin": 0,
@@ -201,7 +210,8 @@ var Progress = react.forwardRef(
201
210
  {
202
211
  className: chunkZU5Q77OT_cjs.cn(
203
212
  "w-full overflow-hidden rounded-full bg-zinc-200 dark:bg-zinc-700",
204
- barHeightClasses[named]
213
+ barHeightClasses[named],
214
+ trackClassName
205
215
  ),
206
216
  children: /* @__PURE__ */ jsxRuntime.jsx(
207
217
  "div",
@@ -209,7 +219,8 @@ var Progress = react.forwardRef(
209
219
  className: chunkZU5Q77OT_cjs.cn(
210
220
  "h-full rounded-full transition-[width] duration-300",
211
221
  progressFill[color],
212
- indeterminate && "animate-pulse w-full"
222
+ indeterminate && "animate-pulse w-full",
223
+ fillClassName
213
224
  ),
214
225
  style: indeterminate ? void 0 : { width: `${percentage}%` }
215
226
  }
@@ -237,5 +248,5 @@ var Progress = react.forwardRef(
237
248
  Progress.displayName = "Progress";
238
249
 
239
250
  exports.Progress = Progress;
240
- //# sourceMappingURL=chunk-VW6WUXFR.cjs.map
241
- //# sourceMappingURL=chunk-VW6WUXFR.cjs.map
251
+ //# sourceMappingURL=chunk-6QVJY3RM.cjs.map
252
+ //# sourceMappingURL=chunk-6QVJY3RM.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/components/Progress/Progress.colors.ts","../src/components/Progress/Progress.tsx"],"names":["forwardRef","jsxs","cn","jsx"],"mappings":"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","file":"chunk-6QVJY3RM.cjs","sourcesContent":["// AUTO-GENERATED by scripts/gen-progress-colors — do not edit by hand.\n// Literal Tailwind class strings for every color in the v4 palette so the\n// scanner can detect them in the published dist (template-built names are\n// invisible to Tailwind's JIT). Regenerate after changing the palette.\nimport type { Color } from \"../../utils/types\";\n\nexport const progressFill: Record<Color, string> = {\n slate: \"bg-slate-500 dark:bg-slate-400\",\n gray: \"bg-gray-500 dark:bg-gray-400\",\n zinc: \"bg-zinc-500 dark:bg-zinc-400\",\n neutral: \"bg-neutral-500 dark:bg-neutral-400\",\n stone: \"bg-stone-500 dark:bg-stone-400\",\n red: \"bg-red-500 dark:bg-red-400\",\n orange: \"bg-orange-500 dark:bg-orange-400\",\n amber: \"bg-amber-500 dark:bg-amber-400\",\n yellow: \"bg-yellow-500 dark:bg-yellow-400\",\n lime: \"bg-lime-500 dark:bg-lime-400\",\n green: \"bg-green-500 dark:bg-green-400\",\n emerald: \"bg-emerald-500 dark:bg-emerald-400\",\n teal: \"bg-teal-500 dark:bg-teal-400\",\n cyan: \"bg-cyan-500 dark:bg-cyan-400\",\n sky: \"bg-sky-500 dark:bg-sky-400\",\n blue: \"bg-blue-500 dark:bg-blue-400\",\n indigo: \"bg-indigo-500 dark:bg-indigo-400\",\n violet: \"bg-violet-500 dark:bg-violet-400\",\n purple: \"bg-purple-500 dark:bg-purple-400\",\n fuchsia: \"bg-fuchsia-500 dark:bg-fuchsia-400\",\n pink: \"bg-pink-500 dark:bg-pink-400\",\n rose: \"bg-rose-500 dark:bg-rose-400\",\n};\n\nexport const progressStroke: Record<Color, string> = {\n slate: \"stroke-slate-500 dark:stroke-slate-400\",\n gray: \"stroke-gray-500 dark:stroke-gray-400\",\n zinc: \"stroke-zinc-500 dark:stroke-zinc-400\",\n neutral: \"stroke-neutral-500 dark:stroke-neutral-400\",\n stone: \"stroke-stone-500 dark:stroke-stone-400\",\n red: \"stroke-red-500 dark:stroke-red-400\",\n orange: \"stroke-orange-500 dark:stroke-orange-400\",\n amber: \"stroke-amber-500 dark:stroke-amber-400\",\n yellow: \"stroke-yellow-500 dark:stroke-yellow-400\",\n lime: \"stroke-lime-500 dark:stroke-lime-400\",\n green: \"stroke-green-500 dark:stroke-green-400\",\n emerald: \"stroke-emerald-500 dark:stroke-emerald-400\",\n teal: \"stroke-teal-500 dark:stroke-teal-400\",\n cyan: \"stroke-cyan-500 dark:stroke-cyan-400\",\n sky: \"stroke-sky-500 dark:stroke-sky-400\",\n blue: \"stroke-blue-500 dark:stroke-blue-400\",\n indigo: \"stroke-indigo-500 dark:stroke-indigo-400\",\n violet: \"stroke-violet-500 dark:stroke-violet-400\",\n purple: \"stroke-purple-500 dark:stroke-purple-400\",\n fuchsia: \"stroke-fuchsia-500 dark:stroke-fuchsia-400\",\n pink: \"stroke-pink-500 dark:stroke-pink-400\",\n rose: \"stroke-rose-500 dark:stroke-rose-400\",\n};\n\nexport const progressText: Record<Color, string> = {\n slate: \"text-slate-600 dark:text-slate-400\",\n gray: \"text-gray-600 dark:text-gray-400\",\n zinc: \"text-zinc-600 dark:text-zinc-400\",\n neutral: \"text-neutral-600 dark:text-neutral-400\",\n stone: \"text-stone-600 dark:text-stone-400\",\n red: \"text-red-600 dark:text-red-400\",\n orange: \"text-orange-600 dark:text-orange-400\",\n amber: \"text-amber-600 dark:text-amber-400\",\n yellow: \"text-yellow-600 dark:text-yellow-400\",\n lime: \"text-lime-600 dark:text-lime-400\",\n green: \"text-green-600 dark:text-green-400\",\n emerald: \"text-emerald-600 dark:text-emerald-400\",\n teal: \"text-teal-600 dark:text-teal-400\",\n cyan: \"text-cyan-600 dark:text-cyan-400\",\n sky: \"text-sky-600 dark:text-sky-400\",\n blue: \"text-blue-600 dark:text-blue-400\",\n indigo: \"text-indigo-600 dark:text-indigo-400\",\n violet: \"text-violet-600 dark:text-violet-400\",\n purple: \"text-purple-600 dark:text-purple-400\",\n fuchsia: \"text-fuchsia-600 dark:text-fuchsia-400\",\n pink: \"text-pink-600 dark:text-pink-400\",\n rose: \"text-rose-600 dark:text-rose-400\",\n};\n","import { forwardRef } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport type { ProgressProps } from \"./Progress.types\";\nimport { progressFill, progressStroke, progressText } from \"./Progress.colors\";\n\ntype NamedSize = \"sm\" | \"md\" | \"lg\";\n\nconst barHeightClasses: Record<NamedSize, string> = {\n sm: \"h-1.5\",\n md: \"h-2.5\",\n lg: \"h-4\",\n};\n\nconst circularSizeMap: Record<NamedSize, number> = {\n sm: 32,\n md: 48,\n lg: 64,\n};\n\nconst namedStrokeWidth: Record<NamedSize, number> = { sm: 3, md: 4, lg: 5 };\n\nconst textSizeClasses: Record<NamedSize, string> = {\n sm: \"text-[8px]\",\n md: \"text-[10px]\",\n lg: \"text-xs\",\n};\n\nexport const Progress = forwardRef<HTMLDivElement, ProgressProps>(\n (\n {\n value = 0,\n max = 100,\n variant = \"bar\",\n size = \"md\",\n strokeWidth: strokeWidthProp,\n color = \"blue\",\n indeterminate = false,\n showValue = false,\n className,\n trackClassName,\n fillClassName,\n ...rest\n },\n ref,\n ) => {\n // Class lookups need a named key; a pixel size sizes the ring itself and\n // leaves the type/bar scales on their default.\n const named: NamedSize = typeof size === \"number\" ? \"md\" : size;\n\n const percentage = Math.min(100, Math.max(0, (value / max) * 100));\n\n if (variant === \"circular\") {\n const pixelSize = typeof size === \"number\" ? size : null;\n const diameter = pixelSize ?? circularSizeMap[named];\n // Scale with the circle when not told otherwise: a 5px stroke on a 152px\n // ring reads as a hairline, so a fixed default makes large sizes look\n // broken out of the box. The named scale keeps its exact old values.\n const strokeWidth =\n strokeWidthProp ??\n (pixelSize === null ? namedStrokeWidth[named] : Math.max(3, Math.round(diameter * 0.075)));\n const radius = (diameter - strokeWidth) / 2;\n const circumference = 2 * Math.PI * radius;\n const offset = indeterminate ? circumference * 0.75 : circumference - (percentage / 100) * circumference;\n\n return (\n <div\n ref={ref}\n {...rest}\n role=\"progressbar\"\n aria-valuenow={indeterminate ? undefined : value}\n aria-valuemin={0}\n aria-valuemax={max}\n data-react-fancy-progress=\"\"\n // The named diameters live in styles.css keyed off this, so they work\n // without the consumer's Tailwind generating anything — and, being\n // layered, a className utility still beats them.\n data-size={pixelSize === null ? named : undefined}\n className={cn(\n \"relative inline-flex items-center justify-center\",\n className,\n )}\n style={pixelSize === null ? undefined : { width: pixelSize, height: pixelSize }}\n >\n <svg\n // viewBox + 100% so the geometry follows the box instead of being\n // baked in: the ring now scales with whatever sizes the wrapper,\n // including a `className` override of the named scale.\n viewBox={`0 0 ${diameter} ${diameter}`}\n width=\"100%\"\n height=\"100%\"\n className={cn(indeterminate && \"animate-spin\")}\n >\n <circle\n cx={diameter / 2}\n cy={diameter / 2}\n r={radius}\n fill=\"none\"\n strokeWidth={strokeWidth}\n className={cn(\"stroke-zinc-200 dark:stroke-zinc-700\", trackClassName)}\n />\n <circle\n cx={diameter / 2}\n cy={diameter / 2}\n r={radius}\n fill=\"none\"\n strokeWidth={strokeWidth}\n strokeLinecap=\"round\"\n strokeDasharray={circumference}\n strokeDashoffset={offset}\n className={cn(\n progressStroke[color],\n \"transition-[stroke-dashoffset] duration-300\",\n fillClassName,\n )}\n style={{ transform: \"rotate(-90deg)\", transformOrigin: \"center\" }}\n />\n </svg>\n {showValue && !indeterminate && (\n <span\n className={cn(\n \"absolute font-medium\",\n progressText[color],\n textSizeClasses[named],\n )}\n >\n {Math.round(percentage)}%\n </span>\n )}\n </div>\n );\n }\n\n return (\n <div\n ref={ref}\n {...rest}\n role=\"progressbar\"\n aria-valuenow={indeterminate ? undefined : value}\n aria-valuemin={0}\n aria-valuemax={max}\n data-react-fancy-progress=\"\"\n className={cn(\"relative w-full\", className)}\n >\n <div\n className={cn(\n \"w-full overflow-hidden rounded-full bg-zinc-200 dark:bg-zinc-700\",\n barHeightClasses[named],\n trackClassName,\n )}\n >\n <div\n className={cn(\n \"h-full rounded-full transition-[width] duration-300\",\n progressFill[color],\n indeterminate && \"animate-pulse w-full\",\n fillClassName,\n )}\n style={indeterminate ? undefined : { width: `${percentage}%` }}\n />\n </div>\n {showValue && !indeterminate && (\n <span\n className={cn(\n \"mt-1 block text-right text-xs font-medium\",\n progressText[color],\n )}\n >\n {Math.round(percentage)}%\n </span>\n )}\n </div>\n );\n },\n);\n\nProgress.displayName = \"Progress\";\n"]}
@@ -101,7 +101,10 @@ var Progress = forwardRef(
101
101
  color = "blue",
102
102
  indeterminate = false,
103
103
  showValue = false,
104
- className
104
+ className,
105
+ trackClassName,
106
+ fillClassName,
107
+ ...rest
105
108
  }, ref) => {
106
109
  const named = typeof size === "number" ? "md" : size;
107
110
  const percentage = Math.min(100, Math.max(0, value / max * 100));
@@ -116,6 +119,7 @@ var Progress = forwardRef(
116
119
  "div",
117
120
  {
118
121
  ref,
122
+ ...rest,
119
123
  role: "progressbar",
120
124
  "aria-valuenow": indeterminate ? void 0 : value,
121
125
  "aria-valuemin": 0,
@@ -144,7 +148,7 @@ var Progress = forwardRef(
144
148
  r: radius,
145
149
  fill: "none",
146
150
  strokeWidth,
147
- className: "stroke-zinc-200 dark:stroke-zinc-700"
151
+ className: cn("stroke-zinc-200 dark:stroke-zinc-700", trackClassName)
148
152
  }
149
153
  ),
150
154
  /* @__PURE__ */ jsx(
@@ -158,7 +162,11 @@ var Progress = forwardRef(
158
162
  strokeLinecap: "round",
159
163
  strokeDasharray: circumference,
160
164
  strokeDashoffset: offset,
161
- className: cn(progressStroke[color], "transition-[stroke-dashoffset] duration-300"),
165
+ className: cn(
166
+ progressStroke[color],
167
+ "transition-[stroke-dashoffset] duration-300",
168
+ fillClassName
169
+ ),
162
170
  style: { transform: "rotate(-90deg)", transformOrigin: "center" }
163
171
  }
164
172
  )
@@ -187,6 +195,7 @@ var Progress = forwardRef(
187
195
  "div",
188
196
  {
189
197
  ref,
198
+ ...rest,
190
199
  role: "progressbar",
191
200
  "aria-valuenow": indeterminate ? void 0 : value,
192
201
  "aria-valuemin": 0,
@@ -199,7 +208,8 @@ var Progress = forwardRef(
199
208
  {
200
209
  className: cn(
201
210
  "w-full overflow-hidden rounded-full bg-zinc-200 dark:bg-zinc-700",
202
- barHeightClasses[named]
211
+ barHeightClasses[named],
212
+ trackClassName
203
213
  ),
204
214
  children: /* @__PURE__ */ jsx(
205
215
  "div",
@@ -207,7 +217,8 @@ var Progress = forwardRef(
207
217
  className: cn(
208
218
  "h-full rounded-full transition-[width] duration-300",
209
219
  progressFill[color],
210
- indeterminate && "animate-pulse w-full"
220
+ indeterminate && "animate-pulse w-full",
221
+ fillClassName
211
222
  ),
212
223
  style: indeterminate ? void 0 : { width: `${percentage}%` }
213
224
  }
@@ -235,5 +246,5 @@ var Progress = forwardRef(
235
246
  Progress.displayName = "Progress";
236
247
 
237
248
  export { Progress };
238
- //# sourceMappingURL=chunk-FFWAY7F5.js.map
239
- //# sourceMappingURL=chunk-FFWAY7F5.js.map
249
+ //# sourceMappingURL=chunk-YM6F2JIT.js.map
250
+ //# sourceMappingURL=chunk-YM6F2JIT.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/components/Progress/Progress.colors.ts","../src/components/Progress/Progress.tsx"],"names":[],"mappings":"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","file":"chunk-YM6F2JIT.js","sourcesContent":["// AUTO-GENERATED by scripts/gen-progress-colors — do not edit by hand.\n// Literal Tailwind class strings for every color in the v4 palette so the\n// scanner can detect them in the published dist (template-built names are\n// invisible to Tailwind's JIT). Regenerate after changing the palette.\nimport type { Color } from \"../../utils/types\";\n\nexport const progressFill: Record<Color, string> = {\n slate: \"bg-slate-500 dark:bg-slate-400\",\n gray: \"bg-gray-500 dark:bg-gray-400\",\n zinc: \"bg-zinc-500 dark:bg-zinc-400\",\n neutral: \"bg-neutral-500 dark:bg-neutral-400\",\n stone: \"bg-stone-500 dark:bg-stone-400\",\n red: \"bg-red-500 dark:bg-red-400\",\n orange: \"bg-orange-500 dark:bg-orange-400\",\n amber: \"bg-amber-500 dark:bg-amber-400\",\n yellow: \"bg-yellow-500 dark:bg-yellow-400\",\n lime: \"bg-lime-500 dark:bg-lime-400\",\n green: \"bg-green-500 dark:bg-green-400\",\n emerald: \"bg-emerald-500 dark:bg-emerald-400\",\n teal: \"bg-teal-500 dark:bg-teal-400\",\n cyan: \"bg-cyan-500 dark:bg-cyan-400\",\n sky: \"bg-sky-500 dark:bg-sky-400\",\n blue: \"bg-blue-500 dark:bg-blue-400\",\n indigo: \"bg-indigo-500 dark:bg-indigo-400\",\n violet: \"bg-violet-500 dark:bg-violet-400\",\n purple: \"bg-purple-500 dark:bg-purple-400\",\n fuchsia: \"bg-fuchsia-500 dark:bg-fuchsia-400\",\n pink: \"bg-pink-500 dark:bg-pink-400\",\n rose: \"bg-rose-500 dark:bg-rose-400\",\n};\n\nexport const progressStroke: Record<Color, string> = {\n slate: \"stroke-slate-500 dark:stroke-slate-400\",\n gray: \"stroke-gray-500 dark:stroke-gray-400\",\n zinc: \"stroke-zinc-500 dark:stroke-zinc-400\",\n neutral: \"stroke-neutral-500 dark:stroke-neutral-400\",\n stone: \"stroke-stone-500 dark:stroke-stone-400\",\n red: \"stroke-red-500 dark:stroke-red-400\",\n orange: \"stroke-orange-500 dark:stroke-orange-400\",\n amber: \"stroke-amber-500 dark:stroke-amber-400\",\n yellow: \"stroke-yellow-500 dark:stroke-yellow-400\",\n lime: \"stroke-lime-500 dark:stroke-lime-400\",\n green: \"stroke-green-500 dark:stroke-green-400\",\n emerald: \"stroke-emerald-500 dark:stroke-emerald-400\",\n teal: \"stroke-teal-500 dark:stroke-teal-400\",\n cyan: \"stroke-cyan-500 dark:stroke-cyan-400\",\n sky: \"stroke-sky-500 dark:stroke-sky-400\",\n blue: \"stroke-blue-500 dark:stroke-blue-400\",\n indigo: \"stroke-indigo-500 dark:stroke-indigo-400\",\n violet: \"stroke-violet-500 dark:stroke-violet-400\",\n purple: \"stroke-purple-500 dark:stroke-purple-400\",\n fuchsia: \"stroke-fuchsia-500 dark:stroke-fuchsia-400\",\n pink: \"stroke-pink-500 dark:stroke-pink-400\",\n rose: \"stroke-rose-500 dark:stroke-rose-400\",\n};\n\nexport const progressText: Record<Color, string> = {\n slate: \"text-slate-600 dark:text-slate-400\",\n gray: \"text-gray-600 dark:text-gray-400\",\n zinc: \"text-zinc-600 dark:text-zinc-400\",\n neutral: \"text-neutral-600 dark:text-neutral-400\",\n stone: \"text-stone-600 dark:text-stone-400\",\n red: \"text-red-600 dark:text-red-400\",\n orange: \"text-orange-600 dark:text-orange-400\",\n amber: \"text-amber-600 dark:text-amber-400\",\n yellow: \"text-yellow-600 dark:text-yellow-400\",\n lime: \"text-lime-600 dark:text-lime-400\",\n green: \"text-green-600 dark:text-green-400\",\n emerald: \"text-emerald-600 dark:text-emerald-400\",\n teal: \"text-teal-600 dark:text-teal-400\",\n cyan: \"text-cyan-600 dark:text-cyan-400\",\n sky: \"text-sky-600 dark:text-sky-400\",\n blue: \"text-blue-600 dark:text-blue-400\",\n indigo: \"text-indigo-600 dark:text-indigo-400\",\n violet: \"text-violet-600 dark:text-violet-400\",\n purple: \"text-purple-600 dark:text-purple-400\",\n fuchsia: \"text-fuchsia-600 dark:text-fuchsia-400\",\n pink: \"text-pink-600 dark:text-pink-400\",\n rose: \"text-rose-600 dark:text-rose-400\",\n};\n","import { forwardRef } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport type { ProgressProps } from \"./Progress.types\";\nimport { progressFill, progressStroke, progressText } from \"./Progress.colors\";\n\ntype NamedSize = \"sm\" | \"md\" | \"lg\";\n\nconst barHeightClasses: Record<NamedSize, string> = {\n sm: \"h-1.5\",\n md: \"h-2.5\",\n lg: \"h-4\",\n};\n\nconst circularSizeMap: Record<NamedSize, number> = {\n sm: 32,\n md: 48,\n lg: 64,\n};\n\nconst namedStrokeWidth: Record<NamedSize, number> = { sm: 3, md: 4, lg: 5 };\n\nconst textSizeClasses: Record<NamedSize, string> = {\n sm: \"text-[8px]\",\n md: \"text-[10px]\",\n lg: \"text-xs\",\n};\n\nexport const Progress = forwardRef<HTMLDivElement, ProgressProps>(\n (\n {\n value = 0,\n max = 100,\n variant = \"bar\",\n size = \"md\",\n strokeWidth: strokeWidthProp,\n color = \"blue\",\n indeterminate = false,\n showValue = false,\n className,\n trackClassName,\n fillClassName,\n ...rest\n },\n ref,\n ) => {\n // Class lookups need a named key; a pixel size sizes the ring itself and\n // leaves the type/bar scales on their default.\n const named: NamedSize = typeof size === \"number\" ? \"md\" : size;\n\n const percentage = Math.min(100, Math.max(0, (value / max) * 100));\n\n if (variant === \"circular\") {\n const pixelSize = typeof size === \"number\" ? size : null;\n const diameter = pixelSize ?? circularSizeMap[named];\n // Scale with the circle when not told otherwise: a 5px stroke on a 152px\n // ring reads as a hairline, so a fixed default makes large sizes look\n // broken out of the box. The named scale keeps its exact old values.\n const strokeWidth =\n strokeWidthProp ??\n (pixelSize === null ? namedStrokeWidth[named] : Math.max(3, Math.round(diameter * 0.075)));\n const radius = (diameter - strokeWidth) / 2;\n const circumference = 2 * Math.PI * radius;\n const offset = indeterminate ? circumference * 0.75 : circumference - (percentage / 100) * circumference;\n\n return (\n <div\n ref={ref}\n {...rest}\n role=\"progressbar\"\n aria-valuenow={indeterminate ? undefined : value}\n aria-valuemin={0}\n aria-valuemax={max}\n data-react-fancy-progress=\"\"\n // The named diameters live in styles.css keyed off this, so they work\n // without the consumer's Tailwind generating anything — and, being\n // layered, a className utility still beats them.\n data-size={pixelSize === null ? named : undefined}\n className={cn(\n \"relative inline-flex items-center justify-center\",\n className,\n )}\n style={pixelSize === null ? undefined : { width: pixelSize, height: pixelSize }}\n >\n <svg\n // viewBox + 100% so the geometry follows the box instead of being\n // baked in: the ring now scales with whatever sizes the wrapper,\n // including a `className` override of the named scale.\n viewBox={`0 0 ${diameter} ${diameter}`}\n width=\"100%\"\n height=\"100%\"\n className={cn(indeterminate && \"animate-spin\")}\n >\n <circle\n cx={diameter / 2}\n cy={diameter / 2}\n r={radius}\n fill=\"none\"\n strokeWidth={strokeWidth}\n className={cn(\"stroke-zinc-200 dark:stroke-zinc-700\", trackClassName)}\n />\n <circle\n cx={diameter / 2}\n cy={diameter / 2}\n r={radius}\n fill=\"none\"\n strokeWidth={strokeWidth}\n strokeLinecap=\"round\"\n strokeDasharray={circumference}\n strokeDashoffset={offset}\n className={cn(\n progressStroke[color],\n \"transition-[stroke-dashoffset] duration-300\",\n fillClassName,\n )}\n style={{ transform: \"rotate(-90deg)\", transformOrigin: \"center\" }}\n />\n </svg>\n {showValue && !indeterminate && (\n <span\n className={cn(\n \"absolute font-medium\",\n progressText[color],\n textSizeClasses[named],\n )}\n >\n {Math.round(percentage)}%\n </span>\n )}\n </div>\n );\n }\n\n return (\n <div\n ref={ref}\n {...rest}\n role=\"progressbar\"\n aria-valuenow={indeterminate ? undefined : value}\n aria-valuemin={0}\n aria-valuemax={max}\n data-react-fancy-progress=\"\"\n className={cn(\"relative w-full\", className)}\n >\n <div\n className={cn(\n \"w-full overflow-hidden rounded-full bg-zinc-200 dark:bg-zinc-700\",\n barHeightClasses[named],\n trackClassName,\n )}\n >\n <div\n className={cn(\n \"h-full rounded-full transition-[width] duration-300\",\n progressFill[color],\n indeterminate && \"animate-pulse w-full\",\n fillClassName,\n )}\n style={indeterminate ? undefined : { width: `${percentage}%` }}\n />\n </div>\n {showValue && !indeterminate && (\n <span\n className={cn(\n \"mt-1 block text-right text-xs font-medium\",\n progressText[color],\n )}\n >\n {Math.round(percentage)}%\n </span>\n )}\n </div>\n );\n },\n);\n\nProgress.displayName = \"Progress\";\n"]}
package/dist/index.cjs CHANGED
@@ -26,7 +26,7 @@ var chunkPWLBHNOA_cjs = require('./chunk-PWLBHNOA.cjs');
26
26
  var chunk3EIB7RPD_cjs = require('./chunk-3EIB7RPD.cjs');
27
27
  require('./chunk-XURQVDCN.cjs');
28
28
  var chunkPFEFKLUV_cjs = require('./chunk-PFEFKLUV.cjs');
29
- var chunkVW6WUXFR_cjs = require('./chunk-VW6WUXFR.cjs');
29
+ var chunk6QVJY3RM_cjs = require('./chunk-6QVJY3RM.cjs');
30
30
  var chunkSO4NNG26_cjs = require('./chunk-SO4NNG26.cjs');
31
31
  var chunkISPCXIJZ_cjs = require('./chunk-ISPCXIJZ.cjs');
32
32
  var chunkWKAEAGMT_cjs = require('./chunk-WKAEAGMT.cjs');
@@ -222,7 +222,7 @@ Object.defineProperty(exports, "Profile", {
222
222
  });
223
223
  Object.defineProperty(exports, "Progress", {
224
224
  enumerable: true,
225
- get: function () { return chunkVW6WUXFR_cjs.Progress; }
225
+ get: function () { return chunk6QVJY3RM_cjs.Progress; }
226
226
  });
227
227
  Object.defineProperty(exports, "PromptInput", {
228
228
  enumerable: true,
package/dist/index.js CHANGED
@@ -24,7 +24,7 @@ export { Table } from './chunk-XXBW4EUO.js';
24
24
  export { Tabs, useTabs } from './chunk-VME5743O.js';
25
25
  import './chunk-TMR56BBE.js';
26
26
  export { Profile } from './chunk-KQQA7JBC.js';
27
- export { Progress } from './chunk-FFWAY7F5.js';
27
+ export { Progress } from './chunk-YM6F2JIT.js';
28
28
  export { PromptInput } from './chunk-3LM47BME.js';
29
29
  export { Tooltip } from './chunk-35EN5AYE.js';
30
30
  export { PullQuote } from './chunk-NDUEPDNS.js';
package/dist/progress.cjs CHANGED
@@ -1,13 +1,13 @@
1
1
  'use strict';
2
2
 
3
- var chunkVW6WUXFR_cjs = require('./chunk-VW6WUXFR.cjs');
3
+ var chunk6QVJY3RM_cjs = require('./chunk-6QVJY3RM.cjs');
4
4
  require('./chunk-ZU5Q77OT.cjs');
5
5
 
6
6
 
7
7
 
8
8
  Object.defineProperty(exports, "Progress", {
9
9
  enumerable: true,
10
- get: function () { return chunkVW6WUXFR_cjs.Progress; }
10
+ get: function () { return chunk6QVJY3RM_cjs.Progress; }
11
11
  });
12
12
  //# sourceMappingURL=progress.cjs.map
13
13
  //# sourceMappingURL=progress.cjs.map
@@ -1,7 +1,17 @@
1
1
  import * as react from 'react';
2
+ import { HTMLAttributes } from 'react';
2
3
  import { C as Color } from './types-8Sv0rCjw.cjs';
3
4
 
4
- interface ProgressProps {
5
+ /**
6
+ * `Progress` renders three nested elements and used to be a CLOSED interface
7
+ * over all of them: no rest spread, and `className` reaching only the outer
8
+ * wrapper. So the bar could not be named (it announced as "progress bar, 42%",
9
+ * with 42% OF WHAT unrecoverable) and the track and fill could not be styled.
10
+ *
11
+ * `color` is omitted from the DOM attributes because this component's `color` is
12
+ * a palette name, not the legacy HTML `color` attribute.
13
+ */
14
+ interface ProgressProps extends Omit<HTMLAttributes<HTMLDivElement>, "color"> {
5
15
  value?: number;
6
16
  max?: number;
7
17
  variant?: "bar" | "circular";
@@ -18,6 +28,18 @@ interface ProgressProps {
18
28
  indeterminate?: boolean;
19
29
  showValue?: boolean;
20
30
  className?: string;
31
+ /**
32
+ * The unfilled groove — the bar's track, or the ring's background circle.
33
+ *
34
+ * Named for the ROLE rather than the element so one vocabulary covers both
35
+ * variants. The alternative a caller reaches for otherwise is an
36
+ * arbitrary-variant selector like `[&>div>div]:…`, which hard-codes this
37
+ * component's DOM shape into their app and breaks silently — still
38
+ * rendering, just unstyled — the first time it gains a wrapper.
39
+ */
40
+ trackClassName?: string;
41
+ /** The filled portion — the bar's fill, or the ring's value circle. */
42
+ fillClassName?: string;
21
43
  }
22
44
 
23
45
  declare const Progress: react.ForwardRefExoticComponent<ProgressProps & react.RefAttributes<HTMLDivElement>>;
@@ -1,7 +1,17 @@
1
1
  import * as react from 'react';
2
+ import { HTMLAttributes } from 'react';
2
3
  import { C as Color } from './types-8Sv0rCjw.js';
3
4
 
4
- interface ProgressProps {
5
+ /**
6
+ * `Progress` renders three nested elements and used to be a CLOSED interface
7
+ * over all of them: no rest spread, and `className` reaching only the outer
8
+ * wrapper. So the bar could not be named (it announced as "progress bar, 42%",
9
+ * with 42% OF WHAT unrecoverable) and the track and fill could not be styled.
10
+ *
11
+ * `color` is omitted from the DOM attributes because this component's `color` is
12
+ * a palette name, not the legacy HTML `color` attribute.
13
+ */
14
+ interface ProgressProps extends Omit<HTMLAttributes<HTMLDivElement>, "color"> {
5
15
  value?: number;
6
16
  max?: number;
7
17
  variant?: "bar" | "circular";
@@ -18,6 +28,18 @@ interface ProgressProps {
18
28
  indeterminate?: boolean;
19
29
  showValue?: boolean;
20
30
  className?: string;
31
+ /**
32
+ * The unfilled groove — the bar's track, or the ring's background circle.
33
+ *
34
+ * Named for the ROLE rather than the element so one vocabulary covers both
35
+ * variants. The alternative a caller reaches for otherwise is an
36
+ * arbitrary-variant selector like `[&>div>div]:…`, which hard-codes this
37
+ * component's DOM shape into their app and breaks silently — still
38
+ * rendering, just unstyled — the first time it gains a wrapper.
39
+ */
40
+ trackClassName?: string;
41
+ /** The filled portion — the bar's fill, or the ring's value circle. */
42
+ fillClassName?: string;
21
43
  }
22
44
 
23
45
  declare const Progress: react.ForwardRefExoticComponent<ProgressProps & react.RefAttributes<HTMLDivElement>>;
package/dist/progress.js CHANGED
@@ -1,4 +1,4 @@
1
- export { Progress } from './chunk-FFWAY7F5.js';
1
+ export { Progress } from './chunk-YM6F2JIT.js';
2
2
  import './chunk-MMW2JGKZ.js';
3
3
  //# sourceMappingURL=progress.js.map
4
4
  //# sourceMappingURL=progress.js.map
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@particle-academy/react-fancy",
3
- "version": "5.23.1",
3
+ "version": "5.24.0",
4
4
  "description": "React UI component library for Human+ UX — controlled, agent-bridgeable primitives",
5
5
  "repository": {
6
6
  "type": "git",
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/components/Progress/Progress.colors.ts","../src/components/Progress/Progress.tsx"],"names":[],"mappings":"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","file":"chunk-FFWAY7F5.js","sourcesContent":["// AUTO-GENERATED by scripts/gen-progress-colors — do not edit by hand.\n// Literal Tailwind class strings for every color in the v4 palette so the\n// scanner can detect them in the published dist (template-built names are\n// invisible to Tailwind's JIT). Regenerate after changing the palette.\nimport type { Color } from \"../../utils/types\";\n\nexport const progressFill: Record<Color, string> = {\n slate: \"bg-slate-500 dark:bg-slate-400\",\n gray: \"bg-gray-500 dark:bg-gray-400\",\n zinc: \"bg-zinc-500 dark:bg-zinc-400\",\n neutral: \"bg-neutral-500 dark:bg-neutral-400\",\n stone: \"bg-stone-500 dark:bg-stone-400\",\n red: \"bg-red-500 dark:bg-red-400\",\n orange: \"bg-orange-500 dark:bg-orange-400\",\n amber: \"bg-amber-500 dark:bg-amber-400\",\n yellow: \"bg-yellow-500 dark:bg-yellow-400\",\n lime: \"bg-lime-500 dark:bg-lime-400\",\n green: \"bg-green-500 dark:bg-green-400\",\n emerald: \"bg-emerald-500 dark:bg-emerald-400\",\n teal: \"bg-teal-500 dark:bg-teal-400\",\n cyan: \"bg-cyan-500 dark:bg-cyan-400\",\n sky: \"bg-sky-500 dark:bg-sky-400\",\n blue: \"bg-blue-500 dark:bg-blue-400\",\n indigo: \"bg-indigo-500 dark:bg-indigo-400\",\n violet: \"bg-violet-500 dark:bg-violet-400\",\n purple: \"bg-purple-500 dark:bg-purple-400\",\n fuchsia: \"bg-fuchsia-500 dark:bg-fuchsia-400\",\n pink: \"bg-pink-500 dark:bg-pink-400\",\n rose: \"bg-rose-500 dark:bg-rose-400\",\n};\n\nexport const progressStroke: Record<Color, string> = {\n slate: \"stroke-slate-500 dark:stroke-slate-400\",\n gray: \"stroke-gray-500 dark:stroke-gray-400\",\n zinc: \"stroke-zinc-500 dark:stroke-zinc-400\",\n neutral: \"stroke-neutral-500 dark:stroke-neutral-400\",\n stone: \"stroke-stone-500 dark:stroke-stone-400\",\n red: \"stroke-red-500 dark:stroke-red-400\",\n orange: \"stroke-orange-500 dark:stroke-orange-400\",\n amber: \"stroke-amber-500 dark:stroke-amber-400\",\n yellow: \"stroke-yellow-500 dark:stroke-yellow-400\",\n lime: \"stroke-lime-500 dark:stroke-lime-400\",\n green: \"stroke-green-500 dark:stroke-green-400\",\n emerald: \"stroke-emerald-500 dark:stroke-emerald-400\",\n teal: \"stroke-teal-500 dark:stroke-teal-400\",\n cyan: \"stroke-cyan-500 dark:stroke-cyan-400\",\n sky: \"stroke-sky-500 dark:stroke-sky-400\",\n blue: \"stroke-blue-500 dark:stroke-blue-400\",\n indigo: \"stroke-indigo-500 dark:stroke-indigo-400\",\n violet: \"stroke-violet-500 dark:stroke-violet-400\",\n purple: \"stroke-purple-500 dark:stroke-purple-400\",\n fuchsia: \"stroke-fuchsia-500 dark:stroke-fuchsia-400\",\n pink: \"stroke-pink-500 dark:stroke-pink-400\",\n rose: \"stroke-rose-500 dark:stroke-rose-400\",\n};\n\nexport const progressText: Record<Color, string> = {\n slate: \"text-slate-600 dark:text-slate-400\",\n gray: \"text-gray-600 dark:text-gray-400\",\n zinc: \"text-zinc-600 dark:text-zinc-400\",\n neutral: \"text-neutral-600 dark:text-neutral-400\",\n stone: \"text-stone-600 dark:text-stone-400\",\n red: \"text-red-600 dark:text-red-400\",\n orange: \"text-orange-600 dark:text-orange-400\",\n amber: \"text-amber-600 dark:text-amber-400\",\n yellow: \"text-yellow-600 dark:text-yellow-400\",\n lime: \"text-lime-600 dark:text-lime-400\",\n green: \"text-green-600 dark:text-green-400\",\n emerald: \"text-emerald-600 dark:text-emerald-400\",\n teal: \"text-teal-600 dark:text-teal-400\",\n cyan: \"text-cyan-600 dark:text-cyan-400\",\n sky: \"text-sky-600 dark:text-sky-400\",\n blue: \"text-blue-600 dark:text-blue-400\",\n indigo: \"text-indigo-600 dark:text-indigo-400\",\n violet: \"text-violet-600 dark:text-violet-400\",\n purple: \"text-purple-600 dark:text-purple-400\",\n fuchsia: \"text-fuchsia-600 dark:text-fuchsia-400\",\n pink: \"text-pink-600 dark:text-pink-400\",\n rose: \"text-rose-600 dark:text-rose-400\",\n};\n","import { forwardRef } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport type { ProgressProps } from \"./Progress.types\";\nimport { progressFill, progressStroke, progressText } from \"./Progress.colors\";\n\ntype NamedSize = \"sm\" | \"md\" | \"lg\";\n\nconst barHeightClasses: Record<NamedSize, string> = {\n sm: \"h-1.5\",\n md: \"h-2.5\",\n lg: \"h-4\",\n};\n\nconst circularSizeMap: Record<NamedSize, number> = {\n sm: 32,\n md: 48,\n lg: 64,\n};\n\nconst namedStrokeWidth: Record<NamedSize, number> = { sm: 3, md: 4, lg: 5 };\n\nconst textSizeClasses: Record<NamedSize, string> = {\n sm: \"text-[8px]\",\n md: \"text-[10px]\",\n lg: \"text-xs\",\n};\n\nexport const Progress = forwardRef<HTMLDivElement, ProgressProps>(\n (\n {\n value = 0,\n max = 100,\n variant = \"bar\",\n size = \"md\",\n strokeWidth: strokeWidthProp,\n color = \"blue\",\n indeterminate = false,\n showValue = false,\n className,\n },\n ref,\n ) => {\n // Class lookups need a named key; a pixel size sizes the ring itself and\n // leaves the type/bar scales on their default.\n const named: NamedSize = typeof size === \"number\" ? \"md\" : size;\n\n const percentage = Math.min(100, Math.max(0, (value / max) * 100));\n\n if (variant === \"circular\") {\n const pixelSize = typeof size === \"number\" ? size : null;\n const diameter = pixelSize ?? circularSizeMap[named];\n // Scale with the circle when not told otherwise: a 5px stroke on a 152px\n // ring reads as a hairline, so a fixed default makes large sizes look\n // broken out of the box. The named scale keeps its exact old values.\n const strokeWidth =\n strokeWidthProp ??\n (pixelSize === null ? namedStrokeWidth[named] : Math.max(3, Math.round(diameter * 0.075)));\n const radius = (diameter - strokeWidth) / 2;\n const circumference = 2 * Math.PI * radius;\n const offset = indeterminate ? circumference * 0.75 : circumference - (percentage / 100) * circumference;\n\n return (\n <div\n ref={ref}\n role=\"progressbar\"\n aria-valuenow={indeterminate ? undefined : value}\n aria-valuemin={0}\n aria-valuemax={max}\n data-react-fancy-progress=\"\"\n // The named diameters live in styles.css keyed off this, so they work\n // without the consumer's Tailwind generating anything — and, being\n // layered, a className utility still beats them.\n data-size={pixelSize === null ? named : undefined}\n className={cn(\n \"relative inline-flex items-center justify-center\",\n className,\n )}\n style={pixelSize === null ? undefined : { width: pixelSize, height: pixelSize }}\n >\n <svg\n // viewBox + 100% so the geometry follows the box instead of being\n // baked in: the ring now scales with whatever sizes the wrapper,\n // including a `className` override of the named scale.\n viewBox={`0 0 ${diameter} ${diameter}`}\n width=\"100%\"\n height=\"100%\"\n className={cn(indeterminate && \"animate-spin\")}\n >\n <circle\n cx={diameter / 2}\n cy={diameter / 2}\n r={radius}\n fill=\"none\"\n strokeWidth={strokeWidth}\n className=\"stroke-zinc-200 dark:stroke-zinc-700\"\n />\n <circle\n cx={diameter / 2}\n cy={diameter / 2}\n r={radius}\n fill=\"none\"\n strokeWidth={strokeWidth}\n strokeLinecap=\"round\"\n strokeDasharray={circumference}\n strokeDashoffset={offset}\n className={cn(progressStroke[color], \"transition-[stroke-dashoffset] duration-300\")}\n style={{ transform: \"rotate(-90deg)\", transformOrigin: \"center\" }}\n />\n </svg>\n {showValue && !indeterminate && (\n <span\n className={cn(\n \"absolute font-medium\",\n progressText[color],\n textSizeClasses[named],\n )}\n >\n {Math.round(percentage)}%\n </span>\n )}\n </div>\n );\n }\n\n return (\n <div\n ref={ref}\n role=\"progressbar\"\n aria-valuenow={indeterminate ? undefined : value}\n aria-valuemin={0}\n aria-valuemax={max}\n data-react-fancy-progress=\"\"\n className={cn(\"relative w-full\", className)}\n >\n <div\n className={cn(\n \"w-full overflow-hidden rounded-full bg-zinc-200 dark:bg-zinc-700\",\n barHeightClasses[named],\n )}\n >\n <div\n className={cn(\n \"h-full rounded-full transition-[width] duration-300\",\n progressFill[color],\n indeterminate && \"animate-pulse w-full\",\n )}\n style={indeterminate ? undefined : { width: `${percentage}%` }}\n />\n </div>\n {showValue && !indeterminate && (\n <span\n className={cn(\n \"mt-1 block text-right text-xs font-medium\",\n progressText[color],\n )}\n >\n {Math.round(percentage)}%\n </span>\n )}\n </div>\n );\n },\n);\n\nProgress.displayName = \"Progress\";\n"]}
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/components/Progress/Progress.colors.ts","../src/components/Progress/Progress.tsx"],"names":["forwardRef","jsxs","cn","jsx"],"mappings":"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","file":"chunk-VW6WUXFR.cjs","sourcesContent":["// AUTO-GENERATED by scripts/gen-progress-colors — do not edit by hand.\n// Literal Tailwind class strings for every color in the v4 palette so the\n// scanner can detect them in the published dist (template-built names are\n// invisible to Tailwind's JIT). Regenerate after changing the palette.\nimport type { Color } from \"../../utils/types\";\n\nexport const progressFill: Record<Color, string> = {\n slate: \"bg-slate-500 dark:bg-slate-400\",\n gray: \"bg-gray-500 dark:bg-gray-400\",\n zinc: \"bg-zinc-500 dark:bg-zinc-400\",\n neutral: \"bg-neutral-500 dark:bg-neutral-400\",\n stone: \"bg-stone-500 dark:bg-stone-400\",\n red: \"bg-red-500 dark:bg-red-400\",\n orange: \"bg-orange-500 dark:bg-orange-400\",\n amber: \"bg-amber-500 dark:bg-amber-400\",\n yellow: \"bg-yellow-500 dark:bg-yellow-400\",\n lime: \"bg-lime-500 dark:bg-lime-400\",\n green: \"bg-green-500 dark:bg-green-400\",\n emerald: \"bg-emerald-500 dark:bg-emerald-400\",\n teal: \"bg-teal-500 dark:bg-teal-400\",\n cyan: \"bg-cyan-500 dark:bg-cyan-400\",\n sky: \"bg-sky-500 dark:bg-sky-400\",\n blue: \"bg-blue-500 dark:bg-blue-400\",\n indigo: \"bg-indigo-500 dark:bg-indigo-400\",\n violet: \"bg-violet-500 dark:bg-violet-400\",\n purple: \"bg-purple-500 dark:bg-purple-400\",\n fuchsia: \"bg-fuchsia-500 dark:bg-fuchsia-400\",\n pink: \"bg-pink-500 dark:bg-pink-400\",\n rose: \"bg-rose-500 dark:bg-rose-400\",\n};\n\nexport const progressStroke: Record<Color, string> = {\n slate: \"stroke-slate-500 dark:stroke-slate-400\",\n gray: \"stroke-gray-500 dark:stroke-gray-400\",\n zinc: \"stroke-zinc-500 dark:stroke-zinc-400\",\n neutral: \"stroke-neutral-500 dark:stroke-neutral-400\",\n stone: \"stroke-stone-500 dark:stroke-stone-400\",\n red: \"stroke-red-500 dark:stroke-red-400\",\n orange: \"stroke-orange-500 dark:stroke-orange-400\",\n amber: \"stroke-amber-500 dark:stroke-amber-400\",\n yellow: \"stroke-yellow-500 dark:stroke-yellow-400\",\n lime: \"stroke-lime-500 dark:stroke-lime-400\",\n green: \"stroke-green-500 dark:stroke-green-400\",\n emerald: \"stroke-emerald-500 dark:stroke-emerald-400\",\n teal: \"stroke-teal-500 dark:stroke-teal-400\",\n cyan: \"stroke-cyan-500 dark:stroke-cyan-400\",\n sky: \"stroke-sky-500 dark:stroke-sky-400\",\n blue: \"stroke-blue-500 dark:stroke-blue-400\",\n indigo: \"stroke-indigo-500 dark:stroke-indigo-400\",\n violet: \"stroke-violet-500 dark:stroke-violet-400\",\n purple: \"stroke-purple-500 dark:stroke-purple-400\",\n fuchsia: \"stroke-fuchsia-500 dark:stroke-fuchsia-400\",\n pink: \"stroke-pink-500 dark:stroke-pink-400\",\n rose: \"stroke-rose-500 dark:stroke-rose-400\",\n};\n\nexport const progressText: Record<Color, string> = {\n slate: \"text-slate-600 dark:text-slate-400\",\n gray: \"text-gray-600 dark:text-gray-400\",\n zinc: \"text-zinc-600 dark:text-zinc-400\",\n neutral: \"text-neutral-600 dark:text-neutral-400\",\n stone: \"text-stone-600 dark:text-stone-400\",\n red: \"text-red-600 dark:text-red-400\",\n orange: \"text-orange-600 dark:text-orange-400\",\n amber: \"text-amber-600 dark:text-amber-400\",\n yellow: \"text-yellow-600 dark:text-yellow-400\",\n lime: \"text-lime-600 dark:text-lime-400\",\n green: \"text-green-600 dark:text-green-400\",\n emerald: \"text-emerald-600 dark:text-emerald-400\",\n teal: \"text-teal-600 dark:text-teal-400\",\n cyan: \"text-cyan-600 dark:text-cyan-400\",\n sky: \"text-sky-600 dark:text-sky-400\",\n blue: \"text-blue-600 dark:text-blue-400\",\n indigo: \"text-indigo-600 dark:text-indigo-400\",\n violet: \"text-violet-600 dark:text-violet-400\",\n purple: \"text-purple-600 dark:text-purple-400\",\n fuchsia: \"text-fuchsia-600 dark:text-fuchsia-400\",\n pink: \"text-pink-600 dark:text-pink-400\",\n rose: \"text-rose-600 dark:text-rose-400\",\n};\n","import { forwardRef } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport type { ProgressProps } from \"./Progress.types\";\nimport { progressFill, progressStroke, progressText } from \"./Progress.colors\";\n\ntype NamedSize = \"sm\" | \"md\" | \"lg\";\n\nconst barHeightClasses: Record<NamedSize, string> = {\n sm: \"h-1.5\",\n md: \"h-2.5\",\n lg: \"h-4\",\n};\n\nconst circularSizeMap: Record<NamedSize, number> = {\n sm: 32,\n md: 48,\n lg: 64,\n};\n\nconst namedStrokeWidth: Record<NamedSize, number> = { sm: 3, md: 4, lg: 5 };\n\nconst textSizeClasses: Record<NamedSize, string> = {\n sm: \"text-[8px]\",\n md: \"text-[10px]\",\n lg: \"text-xs\",\n};\n\nexport const Progress = forwardRef<HTMLDivElement, ProgressProps>(\n (\n {\n value = 0,\n max = 100,\n variant = \"bar\",\n size = \"md\",\n strokeWidth: strokeWidthProp,\n color = \"blue\",\n indeterminate = false,\n showValue = false,\n className,\n },\n ref,\n ) => {\n // Class lookups need a named key; a pixel size sizes the ring itself and\n // leaves the type/bar scales on their default.\n const named: NamedSize = typeof size === \"number\" ? \"md\" : size;\n\n const percentage = Math.min(100, Math.max(0, (value / max) * 100));\n\n if (variant === \"circular\") {\n const pixelSize = typeof size === \"number\" ? size : null;\n const diameter = pixelSize ?? circularSizeMap[named];\n // Scale with the circle when not told otherwise: a 5px stroke on a 152px\n // ring reads as a hairline, so a fixed default makes large sizes look\n // broken out of the box. The named scale keeps its exact old values.\n const strokeWidth =\n strokeWidthProp ??\n (pixelSize === null ? namedStrokeWidth[named] : Math.max(3, Math.round(diameter * 0.075)));\n const radius = (diameter - strokeWidth) / 2;\n const circumference = 2 * Math.PI * radius;\n const offset = indeterminate ? circumference * 0.75 : circumference - (percentage / 100) * circumference;\n\n return (\n <div\n ref={ref}\n role=\"progressbar\"\n aria-valuenow={indeterminate ? undefined : value}\n aria-valuemin={0}\n aria-valuemax={max}\n data-react-fancy-progress=\"\"\n // The named diameters live in styles.css keyed off this, so they work\n // without the consumer's Tailwind generating anything — and, being\n // layered, a className utility still beats them.\n data-size={pixelSize === null ? named : undefined}\n className={cn(\n \"relative inline-flex items-center justify-center\",\n className,\n )}\n style={pixelSize === null ? undefined : { width: pixelSize, height: pixelSize }}\n >\n <svg\n // viewBox + 100% so the geometry follows the box instead of being\n // baked in: the ring now scales with whatever sizes the wrapper,\n // including a `className` override of the named scale.\n viewBox={`0 0 ${diameter} ${diameter}`}\n width=\"100%\"\n height=\"100%\"\n className={cn(indeterminate && \"animate-spin\")}\n >\n <circle\n cx={diameter / 2}\n cy={diameter / 2}\n r={radius}\n fill=\"none\"\n strokeWidth={strokeWidth}\n className=\"stroke-zinc-200 dark:stroke-zinc-700\"\n />\n <circle\n cx={diameter / 2}\n cy={diameter / 2}\n r={radius}\n fill=\"none\"\n strokeWidth={strokeWidth}\n strokeLinecap=\"round\"\n strokeDasharray={circumference}\n strokeDashoffset={offset}\n className={cn(progressStroke[color], \"transition-[stroke-dashoffset] duration-300\")}\n style={{ transform: \"rotate(-90deg)\", transformOrigin: \"center\" }}\n />\n </svg>\n {showValue && !indeterminate && (\n <span\n className={cn(\n \"absolute font-medium\",\n progressText[color],\n textSizeClasses[named],\n )}\n >\n {Math.round(percentage)}%\n </span>\n )}\n </div>\n );\n }\n\n return (\n <div\n ref={ref}\n role=\"progressbar\"\n aria-valuenow={indeterminate ? undefined : value}\n aria-valuemin={0}\n aria-valuemax={max}\n data-react-fancy-progress=\"\"\n className={cn(\"relative w-full\", className)}\n >\n <div\n className={cn(\n \"w-full overflow-hidden rounded-full bg-zinc-200 dark:bg-zinc-700\",\n barHeightClasses[named],\n )}\n >\n <div\n className={cn(\n \"h-full rounded-full transition-[width] duration-300\",\n progressFill[color],\n indeterminate && \"animate-pulse w-full\",\n )}\n style={indeterminate ? undefined : { width: `${percentage}%` }}\n />\n </div>\n {showValue && !indeterminate && (\n <span\n className={cn(\n \"mt-1 block text-right text-xs font-medium\",\n progressText[color],\n )}\n >\n {Math.round(percentage)}%\n </span>\n )}\n </div>\n );\n },\n);\n\nProgress.displayName = \"Progress\";\n"]}