@mdigital_ui/ui 0.4.2 → 0.4.4

package/dist/{chunk-2TLOWZE4.js → chunk-NTCAZ2LF.js}

@@ -1,4 +1,5 @@
-import { cn } from './chunk-NGYLRX6F.js';
+import { colorVars } from './chunk-G6QIIWKU.js';
+import { cn } from './chunk-RAS6HUEI.js';
 import React from 'react';
 import { cva } from 'class-variance-authority';
 import { jsx, jsxs } from 'react/jsx-runtime';
@@ -38,173 +39,24 @@ var progressBarVariants = cva(
     }
   }
 );
-var backgroundColorStyles = {
-  default: {
-    default: "bg-surface",
-    solid: "bg-surface",
-    soft: "bg-surface/50"
-  },
-  primary: {
-    default: "bg-primary/10",
-    solid: "bg-primary/20",
-    soft: "bg-primary/10"
-  },
-  secondary: {
-    default: "bg-secondary/10",
-    solid: "bg-secondary/20",
-    soft: "bg-secondary/10"
-  },
-  accent: {
-    default: "bg-accent/10",
-    solid: "bg-accent/20",
-    soft: "bg-accent/10"
-  },
-  success: {
-    default: "bg-success/10",
-    solid: "bg-success/20",
-    soft: "bg-success/10"
-  },
-  error: {
-    default: "bg-error/10",
-    solid: "bg-error/20",
-    soft: "bg-error/10"
-  },
-  warning: {
-    default: "bg-warning/10",
-    solid: "bg-warning/20",
-    soft: "bg-warning/10"
-  },
-  info: {
-    default: "bg-info/10",
-    solid: "bg-info/20",
-    soft: "bg-info/10"
-  }
+var getBackgroundColorClasses = (variant) => {
+  if (variant === "soft") return "bg-slot-10";
+  if (variant === "solid") return "bg-slot-20";
+  return "bg-slot-10";
 };
-var barColorStyles = {
-  default: {
-    default: "bg-surface border border-border",
-    solid: "bg-surface",
-    soft: "bg-surface/80"
-  },
-  primary: {
-    default: "bg-primary/20 border border-primary",
-    solid: "bg-primary",
-    soft: "bg-primary/60"
-  },
-  secondary: {
-    default: "bg-secondary/20 border border-secondary",
-    solid: "bg-secondary",
-    soft: "bg-secondary/60"
-  },
-  accent: {
-    default: "bg-accent/20 border border-accent",
-    solid: "bg-accent",
-    soft: "bg-accent/60"
-  },
-  success: {
-    default: "bg-success/20 border border-success",
-    solid: "bg-success",
-    soft: "bg-success/60"
-  },
-  error: {
-    default: "bg-error/20 border border-error",
-    solid: "bg-error",
-    soft: "bg-error/60"
-  },
-  warning: {
-    default: "bg-warning/20 border border-warning",
-    solid: "bg-warning",
-    soft: "bg-warning/60"
-  },
-  info: {
-    default: "bg-info/20 border border-info",
-    solid: "bg-info",
-    soft: "bg-info/60"
-  }
+var getBarColorClasses = (variant) => {
+  if (variant === "default") return "bg-slot-20 border border-slot";
+  if (variant === "solid") return "bg-slot";
+  return "bg-slot-50";
 };
-var circleStrokeColors = {
-  default: {
-    default: "stroke-surface",
-    solid: "stroke-surface",
-    soft: "stroke-surface/80"
-  },
-  primary: {
-    default: "stroke-primary",
-    solid: "stroke-primary",
-    soft: "stroke-primary/60"
-  },
-  secondary: {
-    default: "stroke-secondary",
-    solid: "stroke-secondary",
-    soft: "stroke-secondary/60"
-  },
-  accent: {
-    default: "stroke-accent",
-    solid: "stroke-accent",
-    soft: "stroke-accent/60"
-  },
-  success: {
-    default: "stroke-success",
-    solid: "stroke-success",
-    soft: "stroke-success/60"
-  },
-  error: {
-    default: "stroke-error",
-    solid: "stroke-error",
-    soft: "stroke-error/60"
-  },
-  warning: {
-    default: "stroke-warning",
-    solid: "stroke-warning",
-    soft: "stroke-warning/60"
-  },
-  info: {
-    default: "stroke-info",
-    solid: "stroke-info",
-    soft: "stroke-info/60"
-  }
+var getCircleStrokeClasses = (variant) => {
+  if (variant === "soft") return "stroke-slot-50";
+  return "stroke-slot";
 };
-var circleTrailColors = {
-  default: {
-    default: "stroke-surface",
-    solid: "stroke-surface",
-    soft: "stroke-surface/50"
-  },
-  primary: {
-    default: "stroke-primary/10",
-    solid: "stroke-primary/20",
-    soft: "stroke-primary/10"
-  },
-  secondary: {
-    default: "stroke-secondary/10",
-    solid: "stroke-secondary/20",
-    soft: "stroke-secondary/10"
-  },
-  accent: {
-    default: "stroke-accent/10",
-    solid: "stroke-accent/20",
-    soft: "stroke-accent/10"
-  },
-  success: {
-    default: "stroke-success/10",
-    solid: "stroke-success/20",
-    soft: "stroke-success/10"
-  },
-  error: {
-    default: "stroke-error/10",
-    solid: "stroke-error/20",
-    soft: "stroke-error/10"
-  },
-  warning: {
-    default: "stroke-warning/10",
-    solid: "stroke-warning/20",
-    soft: "stroke-warning/10"
-  },
-  info: {
-    default: "stroke-info/10",
-    solid: "stroke-info/20",
-    soft: "stroke-info/10"
-  }
+var getCircleTrailClasses = (variant) => {
+  if (variant === "soft") return "stroke-slot-10";
+  if (variant === "solid") return "stroke-slot-20";
+  return "stroke-slot-10";
 };
 function getVerticalWidthClass(size) {
   switch (size) {
@@ -236,10 +88,16 @@ var ProgressLabel = ({
   if (!label) return null;
   return /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between mb-2 text-sm text-text-primary", children: [
     /* @__PURE__ */ jsx("span", { className: cn("progress_label", classNames?.label), children: label }),
-    showProgress && /* @__PURE__ */ jsxs("span", { className: cn("font-medium", "progress_value", classNames?.value), children: [
-      clampedValue,
-      "%"
-    ] })
+    showProgress && /* @__PURE__ */ jsxs(
+      "span",
+      {
+        className: cn("font-medium", "progress_value", classNames?.value),
+        children: [
+          clampedValue,
+          "%"
+        ]
+      }
+    )
   ] });
 };
 var CircleProgress = ({
@@ -265,6 +123,7 @@ var CircleProgress = ({
     {
       className: cn(
         "inline-flex flex-col items-center",
+        colorVars[color],
         "progress_root",
         className,
         classNames?.root
@@ -279,6 +138,7 @@ var CircleProgress = ({
           "aria-valuemin": 0,
           "aria-valuemax": 100,
           "aria-label": progressLabel,
+          "aria-live": "polite",
           children: [
             /* @__PURE__ */ jsxs(
               "svg",
@@ -297,7 +157,7 @@ var CircleProgress = ({
                       fill: "none",
                       strokeWidth,
                       className: cn(
-                        circleTrailColors[color][variant],
+                        getCircleTrailClasses(variant),
                         "progress_track",
                         classNames?.track
                       )
@@ -315,8 +175,8 @@ var CircleProgress = ({
                       strokeDashoffset: offset,
                       strokeLinecap: "round",
                       className: cn(
-                        circleStrokeColors[color][variant],
-                        "transition-[width,height] duration-300 ease-in-out",
+                        getCircleStrokeClasses(variant),
+                        "transition-[stroke-dashoffset] duration-300 ease-in-out",
                         "progress_fill",
                         classNames?.fill
                       )
@@ -333,7 +193,9 @@ var CircleProgress = ({
                   "progress_label",
                   classNames?.label
                 ),
-                style: { fontSize: `${circleSize / Math.floor(label.length * 1.5)}px` },
+                style: {
+                  fontSize: `${Math.floor(circleSize / Math.floor(label.length * 1.5))}px`
+                },
                 children: label
               }
             ) : /* @__PURE__ */ jsxs(
@@ -379,6 +241,7 @@ var StepProgress = ({
       {
         className: cn(
           "h-full flex flex-col",
+          colorVars[color],
           "progress_root",
           className,
           classNames?.root
@@ -388,6 +251,7 @@ var StepProgress = ({
         "aria-valuemin": 0,
         "aria-valuemax": 100,
         "aria-label": progressLabel,
+        "aria-live": "polite",
         children: [
           /* @__PURE__ */ jsx(
             ProgressLabel,
@@ -415,7 +279,7 @@ var StepProgress = ({
                   {
                     className: cn(
                       "w-full rounded-full transition-[width,height] flex-1",
-                      isCompleted ? barColorStyles[color][variant] : backgroundColorStyles[color][variant],
+                      isCompleted ? getBarColorClasses(variant) : getBackgroundColorClasses(variant),
                       animated && striped && "progress-shimmer",
                       "progress_fill",
                       classNames?.fill
@@ -434,12 +298,20 @@ var StepProgress = ({
   return /* @__PURE__ */ jsxs(
     "div",
     {
-      className: cn("w-full", "progress_root", className, classNames?.root),
+      "data-slot": "root",
+      className: cn(
+        "w-full",
+        colorVars[color],
+        "progress_root",
+        className,
+        classNames?.root
+      ),
       role: "progressbar",
       "aria-valuenow": clampedValue,
       "aria-valuemin": 0,
       "aria-valuemax": 100,
       "aria-label": progressLabel,
+      "aria-live": "polite",
       children: [
         /* @__PURE__ */ jsx(
           ProgressLabel,
@@ -467,7 +339,7 @@ var StepProgress = ({
                 {
                   className: cn(
                     "h-full rounded-full transition-[width,height] flex-1",
-                    isCompleted ? barColorStyles[color][variant] : backgroundColorStyles[color][variant],
+                    isCompleted ? getBarColorClasses(variant) : getBackgroundColorClasses(variant),
                     animated && striped && "progress-shimmer",
                     "progress_fill",
                     classNames?.fill
@@ -503,6 +375,7 @@ var LineProgress = ({
       {
         className: cn(
           "h-full flex flex-col",
+          colorVars[color],
           "progress_root",
           className,
           classNames?.root
@@ -512,6 +385,7 @@ var LineProgress = ({
         "aria-valuemin": 0,
         "aria-valuemax": 100,
         "aria-label": progressLabel,
+        "aria-live": "polite",
         children: [
           /* @__PURE__ */ jsx(
             ProgressLabel,
@@ -528,7 +402,7 @@ var LineProgress = ({
               className: cn(
                 "flex-1 rounded-full overflow-hidden flex flex-col justify-end",
                 getVerticalWidthClass(size),
-                backgroundColorStyles[color][variant],
+                getBackgroundColorClasses(variant),
                 "progress_track",
                 classNames?.track
               ),
@@ -537,7 +411,7 @@ var LineProgress = ({
                 {
                   className: cn(
                     "w-full transition-[width,height] duration-300 ease-in-out rounded-full",
-                    barColorStyles[color][variant],
+                    getBarColorClasses(variant),
                     animated && striped && "progress-shimmer",
                     "progress_fill",
                     classNames?.fill
@@ -557,12 +431,19 @@ var LineProgress = ({
   return /* @__PURE__ */ jsxs(
     "div",
     {
-      className: cn("w-full", "progress_root", className, classNames?.root),
+      className: cn(
+        "w-full",
+        colorVars[color],
+        "progress_root",
+        className,
+        classNames?.root
+      ),
       role: "progressbar",
       "aria-valuenow": clampedValue,
       "aria-valuemin": 0,
       "aria-valuemax": 100,
       "aria-label": progressLabel,
+      "aria-live": "polite",
       children: [
         /* @__PURE__ */ jsx(
           ProgressLabel,
@@ -578,7 +459,7 @@ var LineProgress = ({
           {
             className: cn(
               progressContainerVariants({ size }),
-              backgroundColorStyles[color][variant],
+              getBackgroundColorClasses(variant),
               "progress_track",
               classNames?.track
             ),
@@ -587,7 +468,7 @@ var LineProgress = ({
               {
                 className: cn(
                   progressBarVariants({ size }),
-                  barColorStyles[color][variant],
+                  getBarColorClasses(variant),
                   animated && striped && "progress-shimmer",
                   "progress_fill",
                   classNames?.fill
@@ -685,5 +566,5 @@ Progress.displayName = "Progress";
 var progress_default = Progress;
 
 export { progress_default };
-//# sourceMappingURL=chunk-2TLOWZE4.js.map
-//# sourceMappingURL=chunk-2TLOWZE4.js.map
+//# sourceMappingURL=chunk-NTCAZ2LF.js.map
+//# sourceMappingURL=chunk-NTCAZ2LF.js.map

package/dist/chunk-NTCAZ2LF.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/progress/styles.ts","../src/progress/index.tsx"],"names":[],"mappings":"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","file":"chunk-NTCAZ2LF.js","sourcesContent":["import { cva } from \"class-variance-authority\";\nimport type { ProgressVariant, ProgressSize } from \"./types\";\n\nexport const circleSizes = {\n  xs: { size: 60, strokeWidth: 4 },\n  sm: { size: 80, strokeWidth: 6 },\n  md: { size: 120, strokeWidth: 8 },\n  lg: { size: 160, strokeWidth: 10 },\n};\n\nexport const progressContainerVariants = cva(\"w-full rounded-full overflow-hidden\", {\n  variants: {\n    size: {\n      xs: \"h-1\",\n      sm: \"h-2\",\n      md: \"h-3\",\n      lg: \"h-4\",\n    },\n  },\n  defaultVariants: {\n    size: \"md\",\n  },\n});\n\nexport const progressBarVariants = cva(\n  \"h-full transition-[width,height] duration-300 ease-in-out rounded-full\",\n  {\n    variants: {\n      size: {\n        xs: \"\",\n        sm: \"\",\n        md: \"\",\n        lg: \"\",\n      },\n    },\n    defaultVariants: {\n      size: \"md\",\n    },\n  },\n);\n\nexport const getBackgroundColorClasses = (variant: ProgressVariant): string => {\n  if (variant === 'soft') return 'bg-slot-10'\n  if (variant === 'solid') return 'bg-slot-20'\n  return 'bg-slot-10' // default variant\n};\n\nexport const getBarColorClasses = (variant: ProgressVariant): string => {\n  if (variant === 'default') return 'bg-slot-20 border border-slot'\n  if (variant === 'solid') return 'bg-slot'\n  return 'bg-slot-50' // soft variant\n};\n\nexport const getCircleStrokeClasses = (variant: ProgressVariant): string => {\n  if (variant === 'soft') return 'stroke-slot-50'\n  return 'stroke-slot' // default and solid\n};\n\nexport const getCircleTrailClasses = (variant: ProgressVariant): string => {\n  if (variant === 'soft') return 'stroke-slot-10'\n  if (variant === 'solid') return 'stroke-slot-20'\n  return 'stroke-slot-10' // default variant\n};\n\nexport function getVerticalWidthClass(size: ProgressSize): string {\n  switch (size) {\n    case \"xs\":\n      return \"w-1\";\n    case \"sm\":\n      return \"w-2\";\n    case \"md\":\n      return \"w-3\";\n    case \"lg\":\n      return \"w-4\";\n    default:\n      return \"w-3\";\n  }\n}\n\nexport function getStripedStyle(striped: boolean, isCompleted: boolean = true) {\n  if (!striped || !isCompleted) return {};\n  return {\n    backgroundImage:\n      \"linear-gradient(45deg, var(--overlay-stripe) 25%, transparent 25%, transparent 50%, var(--overlay-stripe) 50%, var(--overlay-stripe) 75%, transparent 75%, transparent)\",\n    backgroundSize: \"1rem 1rem\",\n  };\n}\n","\"use client\";\n\nimport React from \"react\";\n\nimport { cn } from \"../utils\";\nimport { colorVars } from \"../variants\";\nimport type { ProgressProps } from \"./types\";\nimport {\n  circleSizes,\n  progressContainerVariants,\n  progressBarVariants,\n  getBackgroundColorClasses,\n  getBarColorClasses,\n  getCircleStrokeClasses,\n  getCircleTrailClasses,\n  getVerticalWidthClass,\n  getStripedStyle,\n} from \"./styles\";\n\n// Shared label and progress percentage component\ninterface ProgressLabelProps {\n  label?: string;\n  showProgress: boolean;\n  clampedValue: number;\n  classNames?: ProgressProps[\"classNames\"];\n}\n\nconst ProgressLabel: React.FC<ProgressLabelProps> = ({\n  label,\n  showProgress,\n  clampedValue,\n  classNames,\n}) => {\n  if (!label) return null;\n\n  return (\n    <div className=\"flex items-center justify-between mb-2 text-sm text-text-primary\">\n      <span className={cn(\"progress_label\", classNames?.label)}>{label}</span>\n      {showProgress && (\n        <span\n          className={cn(\"font-medium\", \"progress_value\", classNames?.value)}\n        >\n          {clampedValue}%\n        </span>\n      )}\n    </div>\n  );\n};\n\n// Circle progress component\ninterface CircleProgressProps\n  extends Pick<\n    ProgressProps,\n    | \"size\"\n    | \"circleSize\"\n    | \"strokeWidth\"\n    | \"color\"\n    | \"variant\"\n    | \"label\"\n    | \"className\"\n    | \"classNames\"\n  > {\n  clampedValue: number;\n  progressLabel: string;\n}\n\nconst CircleProgress: React.FC<CircleProgressProps> = ({\n  size = \"md\",\n  circleSize: customCircleSize,\n  strokeWidth: customStrokeWidth,\n  color = \"primary\",\n  variant = \"default\",\n  label,\n  className,\n  classNames,\n  clampedValue,\n  progressLabel,\n}) => {\n  const preset = circleSizes[size];\n  const circleSize = customCircleSize ?? preset.size;\n  const strokeWidth = customStrokeWidth ?? preset.strokeWidth;\n  const radius = (circleSize - strokeWidth) / 2;\n  const circumference = 2 * Math.PI * radius;\n  const offset = circumference - (clampedValue / 100) * circumference;\n\n  return (\n    <div\n      className={cn(\n        \"inline-flex flex-col items-center\",\n        colorVars[color],\n        \"progress_root\",\n        className,\n        classNames?.root,\n      )}\n    >\n      <div\n        className=\"relative\"\n        style={{ width: circleSize, height: circleSize }}\n        role=\"progressbar\"\n        aria-valuenow={clampedValue}\n        aria-valuemin={0}\n        aria-valuemax={100}\n        aria-label={progressLabel}\n        aria-live=\"polite\"\n      >\n        <svg\n          width={circleSize}\n          height={circleSize}\n          className=\"transform -rotate-90\"\n          aria-hidden=\"true\"\n        >\n          {/* Background circle */}\n          <circle\n            cx={circleSize / 2}\n            cy={circleSize / 2}\n            r={radius}\n            fill=\"none\"\n            strokeWidth={strokeWidth}\n            className={cn(\n              getCircleTrailClasses(variant),\n              \"progress_track\",\n              classNames?.track,\n            )}\n          />\n          <circle\n            cx={circleSize / 2}\n            cy={circleSize / 2}\n            r={radius}\n            fill=\"none\"\n            strokeWidth={strokeWidth}\n            strokeDasharray={circumference}\n            strokeDashoffset={offset}\n            strokeLinecap=\"round\"\n            className={cn(\n              getCircleStrokeClasses(variant),\n              \"transition-[stroke-dashoffset] duration-300 ease-in-out\",\n              \"progress_fill\",\n              classNames?.fill,\n            )}\n          />\n        </svg>\n        {/* Center text */}\n        <div className=\"absolute inset-0 flex flex-col items-center justify-center\">\n          {label ? (\n            <div\n              className={cn(\n                \"p-2 text-text-secondary\",\n                \"progress_label\",\n                classNames?.label,\n              )}\n              style={{\n                fontSize: `${Math.floor(circleSize / Math.floor(label.length * 1.5))}px`,\n              }}\n            >\n              {label}\n            </div>\n          ) : (\n            <span\n              className={cn(\n                \"text-text-primary font-semibold\",\n                \"progress_value\",\n                classNames?.value,\n              )}\n              style={{ fontSize: circleSize / 5 }}\n            >\n              {clampedValue}%\n            </span>\n          )}\n        </div>\n      </div>\n    </div>\n  );\n};\n\n// Step progress component\ninterface StepProgressProps\n  extends Pick<\n    ProgressProps,\n    | \"orientation\"\n    | \"size\"\n    | \"color\"\n    | \"variant\"\n    | \"label\"\n    | \"showProgress\"\n    | \"striped\"\n    | \"animated\"\n    | \"className\"\n    | \"classNames\"\n    | \"totalSteps\"\n  > {\n  clampedValue: number;\n  progressLabel: string;\n}\n\nconst StepProgress: React.FC<StepProgressProps> = ({\n  orientation = \"horizontal\",\n  size = \"md\",\n  color = \"primary\",\n  variant = \"default\",\n  label,\n  showProgress = false,\n  striped = false,\n  animated = false,\n  className,\n  classNames,\n  totalSteps = 5,\n  clampedValue,\n  progressLabel,\n}) => {\n  const currentStep = Math.ceil((clampedValue / 100) * totalSteps);\n\n  if (orientation === \"vertical\") {\n    return (\n      <div\n        className={cn(\n          \"h-full flex flex-col\",\n          colorVars[color],\n          \"progress_root\",\n          className,\n          classNames?.root,\n        )}\n        role=\"progressbar\"\n        aria-valuenow={clampedValue}\n        aria-valuemin={0}\n        aria-valuemax={100}\n        aria-label={progressLabel}\n        aria-live=\"polite\"\n      >\n        <ProgressLabel\n          label={label}\n          showProgress={showProgress}\n          clampedValue={clampedValue}\n          classNames={classNames}\n        />\n        <div\n          className={cn(\n            \"flex-1 rounded-full overflow-hidden flex flex-col-reverse gap-1\",\n            getVerticalWidthClass(size),\n            \"progress_track\",\n            classNames?.track,\n          )}\n        >\n          {Array.from({ length: totalSteps }, (_, index) => {\n            const stepNumber = index + 1;\n            const isCompleted = stepNumber <= currentStep;\n\n            return (\n              <div\n                key={index}\n                className={cn(\n                  \"w-full rounded-full transition-[width,height] flex-1\",\n                  isCompleted\n                    ? getBarColorClasses(variant)\n                    : getBackgroundColorClasses(variant),\n                  animated && striped && \"progress-shimmer\",\n                  \"progress_fill\",\n                  classNames?.fill,\n                )}\n                style={getStripedStyle(striped, isCompleted)}\n              />\n            );\n          })}\n        </div>\n      </div>\n    );\n  }\n\n  // Horizontal step progress\n  return (\n    <div\n      data-slot=\"root\"\n      className={cn(\n        \"w-full\",\n        colorVars[color],\n        \"progress_root\",\n        className,\n        classNames?.root,\n      )}\n      role=\"progressbar\"\n      aria-valuenow={clampedValue}\n      aria-valuemin={0}\n      aria-valuemax={100}\n      aria-label={progressLabel}\n      aria-live=\"polite\"\n    >\n      <ProgressLabel\n        label={label}\n        showProgress={showProgress}\n        clampedValue={clampedValue}\n        classNames={classNames}\n      />\n      <div\n        className={cn(\n          \"w-full rounded-full overflow-hidden flex gap-1\",\n          progressContainerVariants({ size }),\n          \"progress_track\",\n          classNames?.track,\n        )}\n      >\n        {Array.from({ length: totalSteps }, (_, index) => {\n          const stepNumber = index + 1;\n          const isCompleted = stepNumber <= currentStep;\n\n          return (\n            <div\n              key={index}\n              className={cn(\n                \"h-full rounded-full transition-[width,height] flex-1\",\n                isCompleted\n                  ? getBarColorClasses(variant)\n                  : getBackgroundColorClasses(variant),\n                animated && striped && \"progress-shimmer\",\n                \"progress_fill\",\n                classNames?.fill,\n              )}\n              style={getStripedStyle(striped, isCompleted)}\n            />\n          );\n        })}\n      </div>\n    </div>\n  );\n};\n\n// Line progress component\ninterface LineProgressProps\n  extends Pick<\n    ProgressProps,\n    | \"orientation\"\n    | \"size\"\n    | \"color\"\n    | \"variant\"\n    | \"label\"\n    | \"showProgress\"\n    | \"striped\"\n    | \"animated\"\n    | \"className\"\n    | \"classNames\"\n  > {\n  clampedValue: number;\n  progressLabel: string;\n}\n\nconst LineProgress: React.FC<LineProgressProps> = ({\n  orientation = \"horizontal\",\n  size = \"md\",\n  color = \"primary\",\n  variant = \"default\",\n  label,\n  showProgress = false,\n  striped = false,\n  animated = false,\n  className,\n  classNames,\n  clampedValue,\n  progressLabel,\n}) => {\n  if (orientation === \"vertical\") {\n    return (\n      <div\n        className={cn(\n          \"h-full flex flex-col\",\n          colorVars[color],\n          \"progress_root\",\n          className,\n          classNames?.root,\n        )}\n        role=\"progressbar\"\n        aria-valuenow={clampedValue}\n        aria-valuemin={0}\n        aria-valuemax={100}\n        aria-label={progressLabel}\n        aria-live=\"polite\"\n      >\n        <ProgressLabel\n          label={label}\n          showProgress={showProgress}\n          clampedValue={clampedValue}\n          classNames={classNames}\n        />\n        <div\n          className={cn(\n            \"flex-1 rounded-full overflow-hidden flex flex-col justify-end\",\n            getVerticalWidthClass(size),\n            getBackgroundColorClasses(variant),\n            \"progress_track\",\n            classNames?.track,\n          )}\n        >\n          <div\n            className={cn(\n              \"w-full transition-[width,height] duration-300 ease-in-out rounded-full\",\n              getBarColorClasses(variant),\n              animated && striped && \"progress-shimmer\",\n              \"progress_fill\",\n              classNames?.fill,\n            )}\n            style={{\n              height: `${clampedValue}%`,\n              ...getStripedStyle(striped),\n            }}\n          />\n        </div>\n      </div>\n    );\n  }\n\n  return (\n    <div\n      className={cn(\n        \"w-full\",\n        colorVars[color],\n        \"progress_root\",\n        className,\n        classNames?.root,\n      )}\n      role=\"progressbar\"\n      aria-valuenow={clampedValue}\n      aria-valuemin={0}\n      aria-valuemax={100}\n      aria-label={progressLabel}\n      aria-live=\"polite\"\n    >\n      <ProgressLabel\n        label={label}\n        showProgress={showProgress}\n        clampedValue={clampedValue}\n        classNames={classNames}\n      />\n      <div\n        className={cn(\n          progressContainerVariants({ size }),\n          getBackgroundColorClasses(variant),\n          \"progress_track\",\n          classNames?.track,\n        )}\n      >\n        <div\n          className={cn(\n            progressBarVariants({ size }),\n            getBarColorClasses(variant),\n            animated && striped && \"progress-shimmer\",\n            \"progress_fill\",\n            classNames?.fill,\n          )}\n          style={{\n            width: `${clampedValue}%`,\n            ...getStripedStyle(striped),\n          }}\n        />\n      </div>\n    </div>\n  );\n};\n\n// Main Progress component - thin wrapper that delegates to sub-components\nconst Progress = React.memo<ProgressProps>(\n  ({\n    value,\n    color = \"primary\",\n    size = \"md\",\n    circleSize: customCircleSize,\n    strokeWidth: customStrokeWidth,\n    variant = \"default\",\n    type = \"line\",\n    orientation = \"horizontal\",\n    showProgress = false,\n    label,\n    striped = false,\n    animated = false,\n    className,\n    classNames,\n    totalSteps = 5,\n    \"aria-label\": ariaLabel,\n  }) => {\n    const clampedValue = Math.min(Math.max(value, 0), 100);\n    const progressLabel = ariaLabel || label || \"Progress\";\n\n    if (type === \"circle\") {\n      return (\n        <CircleProgress\n          size={size}\n          circleSize={customCircleSize}\n          strokeWidth={customStrokeWidth}\n          color={color}\n          variant={variant}\n          label={label}\n          className={className}\n          classNames={classNames}\n          clampedValue={clampedValue}\n          progressLabel={progressLabel}\n        />\n      );\n    }\n\n    if (type === \"step\") {\n      return (\n        <StepProgress\n          orientation={orientation}\n          size={size}\n          color={color}\n          variant={variant}\n          label={label}\n          showProgress={showProgress}\n          striped={striped}\n          animated={animated}\n          className={className}\n          classNames={classNames}\n          totalSteps={totalSteps}\n          clampedValue={clampedValue}\n          progressLabel={progressLabel}\n        />\n      );\n    }\n\n    return (\n      <LineProgress\n        orientation={orientation}\n        size={size}\n        color={color}\n        variant={variant}\n        label={label}\n        showProgress={showProgress}\n        striped={striped}\n        animated={animated}\n        className={className}\n        classNames={classNames}\n        clampedValue={clampedValue}\n        progressLabel={progressLabel}\n      />\n    );\n  },\n);\n\nProgress.displayName = \"Progress\";\n\nexport type * from \"./types\";\nexport default Progress;\n"]}

package/dist/chunk-NZHKNUGE.js

@@ -0,0 +1,96 @@
+import { useState, useRef, useEffect, useCallback } from 'react';
+
+// src/hooks/useMenuNavigation.ts
+function useMenuNavigation({
+  enabledIndices,
+  isOpen,
+  onClose,
+  onSelect,
+  onOpen,
+  loop = true
+}) {
+  const [highlightedIndex, setHighlightedIndex] = useState(-1);
+  const ref = useRef({ enabledIndices, highlightedIndex, onClose, onSelect, onOpen, isOpen });
+  ref.current = { enabledIndices, highlightedIndex, onClose, onSelect, onOpen, isOpen };
+  useEffect(() => {
+    if (!isOpen) setHighlightedIndex(-1);
+  }, [isOpen]);
+  const move = useCallback(
+    (direction) => {
+      setHighlightedIndex((prev) => {
+        const indices = ref.current.enabledIndices;
+        if (indices.length === 0) return -1;
+        const pos = indices.indexOf(prev);
+        if (pos === -1) {
+          return (direction === 1 ? indices[0] : indices[indices.length - 1]) ?? -1;
+        }
+        const next = pos + direction;
+        if (next >= 0 && next < indices.length) return indices[next] ?? -1;
+        return loop ? (direction === 1 ? indices[0] : indices[indices.length - 1]) ?? -1 : prev;
+      });
+    },
+    [loop]
+  );
+  const highlightFirst = useCallback(() => {
+    setHighlightedIndex(ref.current.enabledIndices[0] ?? -1);
+  }, []);
+  const highlightLast = useCallback(() => {
+    const indices = ref.current.enabledIndices;
+    setHighlightedIndex(indices[indices.length - 1] ?? -1);
+  }, []);
+  const handleKeyDown = useCallback(
+    (e) => {
+      const { onOpen: open, isOpen: currentIsOpen } = ref.current;
+      switch (e.key) {
+        case "ArrowDown":
+          e.preventDefault();
+          if (!currentIsOpen && open) {
+            open();
+            highlightFirst();
+          } else move(1);
+          break;
+        case "ArrowUp":
+          e.preventDefault();
+          if (!currentIsOpen && open) {
+            open();
+            highlightLast();
+          } else move(-1);
+          break;
+        case "Home":
+          if (currentIsOpen) {
+            e.preventDefault();
+            highlightFirst();
+          }
+          break;
+        case "End":
+          if (currentIsOpen) {
+            e.preventDefault();
+            highlightLast();
+          }
+          break;
+        case "Enter":
+        case " ":
+          e.preventDefault();
+          if (currentIsOpen && ref.current.highlightedIndex >= 0) {
+            ref.current.onSelect(ref.current.highlightedIndex);
+          } else if (!currentIsOpen && open) {
+            open();
+          }
+          break;
+        case "Escape":
+          e.preventDefault();
+          ref.current.onClose();
+          break;
+        case "Tab":
+          ref.current.onClose();
+          break;
+      }
+    },
+    [move, highlightFirst, highlightLast]
+  );
+  return { highlightedIndex, setHighlightedIndex, handleKeyDown, highlightFirst };
+}
+
+export { useMenuNavigation };
+//# sourceMappingURL=chunk-NZHKNUGE.js.map
+//# sourceMappingURL=chunk-NZHKNUGE.js.map

package/dist/chunk-NZHKNUGE.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/hooks/useMenuNavigation.ts"],"names":[],"mappings":"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","file":"chunk-NZHKNUGE.js","sourcesContent":["import { useState, useCallback, useEffect, useRef } from 'react'\n\nexport interface UseMenuNavigationOptions {\n  enabledIndices: number[]\n  isOpen: boolean\n  onClose: () => void\n  onSelect: (index: number) => void\n  onOpen?: () => void\n  loop?: boolean\n}\n\nexport function useMenuNavigation({\n  enabledIndices,\n  isOpen,\n  onClose,\n  onSelect,\n  onOpen,\n  loop = true,\n}: UseMenuNavigationOptions) {\n  const [highlightedIndex, setHighlightedIndex] = useState(-1)\n\n  const ref = useRef({ enabledIndices, highlightedIndex, onClose, onSelect, onOpen, isOpen })\n  ref.current = { enabledIndices, highlightedIndex, onClose, onSelect, onOpen, isOpen }\n\n  useEffect(() => {\n    if (!isOpen) setHighlightedIndex(-1)\n  }, [isOpen])\n\n  const move = useCallback(\n    (direction: 1 | -1) => {\n      setHighlightedIndex((prev) => {\n        const indices = ref.current.enabledIndices\n        if (indices.length === 0) return -1\n        const pos = indices.indexOf(prev)\n        if (pos === -1) {\n          return (direction === 1 ? indices[0] : indices[indices.length - 1]) ?? -1\n        }\n        const next = pos + direction\n        if (next >= 0 && next < indices.length) return indices[next] ?? -1\n        return loop ? ((direction === 1 ? indices[0] : indices[indices.length - 1]) ?? -1) : prev\n      })\n    },\n    [loop],\n  )\n\n  const highlightFirst = useCallback(() => {\n    setHighlightedIndex(ref.current.enabledIndices[0] ?? -1)\n  }, [])\n\n  const highlightLast = useCallback(() => {\n    const indices = ref.current.enabledIndices\n    setHighlightedIndex(indices[indices.length - 1] ?? -1)\n  }, [])\n\n  const handleKeyDown = useCallback(\n    (e: { key: string; preventDefault: () => void }) => {\n      const { onOpen: open, isOpen: currentIsOpen } = ref.current\n\n      switch (e.key) {\n        case 'ArrowDown':\n          e.preventDefault()\n          if (!currentIsOpen && open) { open(); highlightFirst() }\n          else move(1)\n          break\n        case 'ArrowUp':\n          e.preventDefault()\n          if (!currentIsOpen && open) { open(); highlightLast() }\n          else move(-1)\n          break\n        case 'Home':\n          if (currentIsOpen) { e.preventDefault(); highlightFirst() }\n          break\n        case 'End':\n          if (currentIsOpen) { e.preventDefault(); highlightLast() }\n          break\n        case 'Enter':\n        case ' ':\n          e.preventDefault()\n          if (currentIsOpen && ref.current.highlightedIndex >= 0) {\n            ref.current.onSelect(ref.current.highlightedIndex)\n          } else if (!currentIsOpen && open) {\n            open()\n          }\n          break\n        case 'Escape':\n          e.preventDefault()\n          ref.current.onClose()\n          break\n        case 'Tab':\n          ref.current.onClose()\n          break\n      }\n    },\n    [move, highlightFirst, highlightLast],\n  )\n\n  return { highlightedIndex, setHighlightedIndex, handleKeyDown, highlightFirst }\n}\n"]}