npm - @marcoschwartz/lite-ui - Versions diffs - 0.26.4 → 0.27.3 - Mend

@marcoschwartz/lite-ui 0.26.4 → 0.27.3

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.

Files changed (8) hide show

package/dist/index.js CHANGED Viewed

@@ -123,6 +123,7 @@ __export(index_exports, {
   SaveIcon: () => SaveIcon,
   ScatterChart: () => ScatterChart,
   SearchIcon: () => SearchIcon,
+  SegmentedControl: () => SegmentedControl,
   Select: () => Select,
   SettingsIcon: () => SettingsIcon,
   ShieldIcon: () => ShieldIcon,
@@ -3687,8 +3688,221 @@ var Radio = ({
   }) });
 };
-// src/components/ProgressBar.tsx
+// src/components/SegmentedControl.tsx
+var import_react20 = require("react");
 var import_jsx_runtime99 = require("react/jsx-runtime");
+function normalizeData(data) {
+  return data.map(
+    (item) => typeof item === "string" ? { value: item, label: item } : item
+  );
+}
+var sizeConfig = {
+  xs: {
+    padding: "px-2 py-0.5",
+    text: "text-xs",
+    height: "h-6",
+    minWidth: "min-w-[2rem]"
+  },
+  sm: {
+    padding: "px-2.5 py-1",
+    text: "text-sm",
+    height: "h-8",
+    minWidth: "min-w-[2.5rem]"
+  },
+  md: {
+    padding: "px-3 py-1.5",
+    text: "text-sm",
+    height: "h-9",
+    minWidth: "min-w-[3rem]"
+  },
+  lg: {
+    padding: "px-4 py-2",
+    text: "text-base",
+    height: "h-11",
+    minWidth: "min-w-[3.5rem]"
+  }
+};
+var radiusConfig = {
+  none: "rounded-none",
+  sm: "rounded-sm",
+  md: "rounded-md",
+  lg: "rounded-lg",
+  full: "rounded-full"
+};
+var colorConfig = {
+  primary: "bg-[hsl(var(--primary))]",
+  secondary: "bg-[hsl(var(--secondary))]",
+  neutral: "bg-[hsl(var(--muted))]"
+};
+var activeTextConfig = {
+  primary: "text-[hsl(var(--primary-foreground))]",
+  secondary: "text-[hsl(var(--secondary-foreground))]",
+  neutral: "text-[hsl(var(--foreground))]"
+};
+var SegmentedControl = ({
+  data,
+  value: controlledValue,
+  defaultValue,
+  onChange,
+  size = "md",
+  radius = "md",
+  color = "primary",
+  fullWidth = false,
+  disabled = false,
+  orientation = "horizontal",
+  className = "",
+  transitionDuration = 200,
+  name,
+  ariaLabel
+}) => {
+  const groupId = (0, import_react20.useId)();
+  const groupName = name || `segmented-control-${groupId}`;
+  const options = (0, import_react20.useMemo)(() => normalizeData(data), [data]);
+  const [internalValue, setInternalValue] = (0, import_react20.useState)(
+    defaultValue || options[0]?.value || ""
+  );
+  const isControlled = controlledValue !== void 0;
+  const currentValue = isControlled ? controlledValue : internalValue;
+  const [hasInteracted, setHasInteracted] = (0, import_react20.useState)(false);
+  const activeIndex = options.findIndex((opt) => opt.value === currentValue);
+  const handleChange = (0, import_react20.useCallback)((newValue) => {
+    if (disabled) return;
+    setHasInteracted(true);
+    if (!isControlled) {
+      setInternalValue(newValue);
+    }
+    onChange?.(newValue);
+  }, [disabled, isControlled, onChange]);
+  const handleKeyDown = (0, import_react20.useCallback)((e) => {
+    const enabledOptions = options.filter((opt) => !opt.disabled);
+    const currentEnabledIndex = enabledOptions.findIndex((opt) => opt.value === currentValue);
+    let nextIndex = -1;
+    if (orientation === "horizontal") {
+      if (e.key === "ArrowRight") {
+        nextIndex = (currentEnabledIndex + 1) % enabledOptions.length;
+      } else if (e.key === "ArrowLeft") {
+        nextIndex = (currentEnabledIndex - 1 + enabledOptions.length) % enabledOptions.length;
+      }
+    } else {
+      if (e.key === "ArrowDown") {
+        nextIndex = (currentEnabledIndex + 1) % enabledOptions.length;
+      } else if (e.key === "ArrowUp") {
+        nextIndex = (currentEnabledIndex - 1 + enabledOptions.length) % enabledOptions.length;
+      }
+    }
+    if (e.key === "Home") {
+      nextIndex = 0;
+    } else if (e.key === "End") {
+      nextIndex = enabledOptions.length - 1;
+    }
+    if (nextIndex !== -1) {
+      e.preventDefault();
+      const nextOption = enabledOptions[nextIndex];
+      handleChange(nextOption.value);
+    }
+  }, [options, currentValue, orientation, handleChange]);
+  const sizeStyles2 = sizeConfig[size];
+  const radiusStyle = radiusConfig[radius];
+  const totalOptions = options.length;
+  const indicatorStyle = activeIndex >= 0 ? orientation === "horizontal" ? {
+    width: `calc(${100 / totalOptions}% - ${totalOptions > 1 ? 0 : 0}px)`,
+    height: "calc(100% - 8px)",
+    left: `calc(${activeIndex / totalOptions * 100}% + 4px)`,
+    top: "4px",
+    transition: hasInteracted ? `left ${transitionDuration}ms ease, width ${transitionDuration}ms ease` : "none"
+  } : {
+    width: "calc(100% - 8px)",
+    height: `calc(${100 / totalOptions}% - ${totalOptions > 1 ? 0 : 0}px)`,
+    left: "4px",
+    top: `calc(${activeIndex / totalOptions * 100}% + 4px)`,
+    transition: hasInteracted ? `top ${transitionDuration}ms ease, height ${transitionDuration}ms ease` : "none"
+  } : { display: "none" };
+  const containerClasses = [
+    "relative inline-flex p-1",
+    "bg-[hsl(var(--muted))]",
+    radiusStyle,
+    orientation === "vertical" ? "flex-col" : "flex-row",
+    fullWidth ? "w-full" : "",
+    disabled ? "opacity-50 cursor-not-allowed" : "",
+    className
+  ].filter(Boolean).join(" ");
+  return /* @__PURE__ */ (0, import_jsx_runtime99.jsxs)(
+    "div",
+    {
+      role: "radiogroup",
+      "aria-label": ariaLabel || "Segmented control",
+      className: containerClasses,
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(
+          "div",
+          {
+            className: [
+              "absolute z-0",
+              radiusStyle,
+              colorConfig[color],
+              "shadow-sm"
+            ].join(" "),
+            style: indicatorStyle,
+            "aria-hidden": "true"
+          }
+        ),
+        options.map((option, index) => {
+          const isActive = option.value === currentValue;
+          const isDisabled = disabled || option.disabled;
+          const buttonClasses = [
+            "relative z-10 flex items-center justify-center",
+            "font-medium select-none",
+            "transition-colors duration-150",
+            sizeStyles2.padding,
+            sizeStyles2.text,
+            sizeStyles2.minWidth,
+            radiusStyle,
+            fullWidth ? "flex-1" : "",
+            isActive ? activeTextConfig[color] : "text-[hsl(var(--muted-foreground))]",
+            isDisabled ? "cursor-not-allowed opacity-50" : "cursor-pointer hover:text-[hsl(var(--foreground))]",
+            "focus:outline-none focus-visible:ring-2 focus-visible:ring-[hsl(var(--ring))] focus-visible:ring-offset-1"
+          ].filter(Boolean).join(" ");
+          return /* @__PURE__ */ (0, import_jsx_runtime99.jsxs)(
+            "button",
+            {
+              type: "button",
+              role: "radio",
+              "aria-checked": isActive,
+              "data-segment-button": true,
+              "data-value": option.value,
+              disabled: isDisabled,
+              tabIndex: isActive ? 0 : -1,
+              className: buttonClasses,
+              onClick: () => !isDisabled && handleChange(option.value),
+              onKeyDown: handleKeyDown,
+              children: [
+                option.label,
+                /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(
+                  "input",
+                  {
+                    type: "radio",
+                    name: groupName,
+                    value: option.value,
+                    checked: isActive,
+                    disabled: isDisabled,
+                    onChange: () => {
+                    },
+                    className: "sr-only",
+                    "aria-hidden": "true"
+                  }
+                )
+              ]
+            },
+            option.value
+          );
+        })
+      ]
+    }
+  );
+};
+// src/components/ProgressBar.tsx
+var import_jsx_runtime100 = require("react/jsx-runtime");
 var ProgressBar = ({
   value,
   max = 100,
@@ -3710,15 +3924,15 @@ var ProgressBar = ({
     warning: "bg-[hsl(var(--warning))]",
     danger: "bg-[hsl(var(--destructive))]"
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime99.jsxs)("div", { className: `w-full ${className}`, children: [
-    (showLabel || label) && /* @__PURE__ */ (0, import_jsx_runtime99.jsxs)("div", { className: "flex justify-between items-center mb-1", children: [
-      label && /* @__PURE__ */ (0, import_jsx_runtime99.jsx)("span", { className: "text-sm font-medium text-[hsl(var(--foreground))]", children: label }),
-      showLabel && /* @__PURE__ */ (0, import_jsx_runtime99.jsxs)("span", { className: "text-sm font-medium text-[hsl(var(--muted-foreground))]", children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime100.jsxs)("div", { className: `w-full ${className}`, children: [
+    (showLabel || label) && /* @__PURE__ */ (0, import_jsx_runtime100.jsxs)("div", { className: "flex justify-between items-center mb-1", children: [
+      label && /* @__PURE__ */ (0, import_jsx_runtime100.jsx)("span", { className: "text-sm font-medium text-[hsl(var(--foreground))]", children: label }),
+      showLabel && /* @__PURE__ */ (0, import_jsx_runtime100.jsxs)("span", { className: "text-sm font-medium text-[hsl(var(--muted-foreground))]", children: [
         Math.round(percentage),
         "%"
       ] })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(
       "div",
       {
         className: `w-full bg-[hsl(var(--muted))] rounded-full overflow-hidden ${sizeClasses7[size]}`,
@@ -3726,7 +3940,7 @@ var ProgressBar = ({
         "aria-valuenow": value,
         "aria-valuemin": 0,
         "aria-valuemax": max,
-        children: /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(
           "div",
           {
             className: `${sizeClasses7[size]} ${variantClasses[variant]} rounded-full transition-all duration-300 ease-out`,
@@ -3739,8 +3953,8 @@ var ProgressBar = ({
 };
 // src/components/Slider.tsx
-var import_react20 = __toESM(require("react"));
-var import_jsx_runtime100 = require("react/jsx-runtime");
+var import_react21 = __toESM(require("react"));
+var import_jsx_runtime101 = require("react/jsx-runtime");
 var Slider = ({
   value: controlledValue,
   defaultValue = 50,
@@ -3757,10 +3971,10 @@ var Slider = ({
   defaultRangeValue = [25, 75],
   onRangeChange
 }) => {
-  const [internalValue, setInternalValue] = import_react20.default.useState(defaultValue);
-  const [internalRangeValue, setInternalRangeValue] = import_react20.default.useState(defaultRangeValue);
-  const trackRef = (0, import_react20.useRef)(null);
-  const [isDragging, setIsDragging] = import_react20.default.useState(null);
+  const [internalValue, setInternalValue] = import_react21.default.useState(defaultValue);
+  const [internalRangeValue, setInternalRangeValue] = import_react21.default.useState(defaultRangeValue);
+  const trackRef = (0, import_react21.useRef)(null);
+  const [isDragging, setIsDragging] = import_react21.default.useState(null);
   const value = controlledValue !== void 0 ? controlledValue : internalValue;
   const rangeValue = controlledRangeValue !== void 0 ? controlledRangeValue : internalRangeValue;
   const handleChange = (e) => {
@@ -3808,7 +4022,7 @@ var Slider = ({
   const handleRangeEnd = () => {
     setIsDragging(null);
   };
-  import_react20.default.useEffect(() => {
+  import_react21.default.useEffect(() => {
     if (isDragging) {
       document.addEventListener("mousemove", handleRangeMouseMove);
       document.addEventListener("mouseup", handleRangeEnd);
@@ -3826,18 +4040,18 @@ var Slider = ({
   const minPercentage = (rangeValue[0] - min) / (max - min) * 100;
   const maxPercentage = (rangeValue[1] - min) / (max - min) * 100;
   if (range) {
-    return /* @__PURE__ */ (0, import_jsx_runtime100.jsxs)("div", { className: `w-full ${className}`, children: [
-      (label || showValue) && /* @__PURE__ */ (0, import_jsx_runtime100.jsxs)("div", { className: "flex justify-between items-center mb-2", children: [
-        label && /* @__PURE__ */ (0, import_jsx_runtime100.jsx)("label", { className: "text-sm font-medium text-[hsl(var(--foreground))]", children: label }),
-        showValue && /* @__PURE__ */ (0, import_jsx_runtime100.jsxs)("span", { className: "text-sm font-medium text-[hsl(var(--muted-foreground))]", children: [
+    return /* @__PURE__ */ (0, import_jsx_runtime101.jsxs)("div", { className: `w-full ${className}`, children: [
+      (label || showValue) && /* @__PURE__ */ (0, import_jsx_runtime101.jsxs)("div", { className: "flex justify-between items-center mb-2", children: [
+        label && /* @__PURE__ */ (0, import_jsx_runtime101.jsx)("label", { className: "text-sm font-medium text-[hsl(var(--foreground))]", children: label }),
+        showValue && /* @__PURE__ */ (0, import_jsx_runtime101.jsxs)("span", { className: "text-sm font-medium text-[hsl(var(--muted-foreground))]", children: [
           rangeValue[0],
           " - ",
           rangeValue[1]
         ] })
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime100.jsxs)("div", { className: "relative h-10 flex items-center", ref: trackRef, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime100.jsx)("div", { className: "absolute w-full h-2 bg-[hsl(var(--muted))] rounded-full" }),
-        /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime101.jsxs)("div", { className: "relative h-10 flex items-center", ref: trackRef, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime101.jsx)("div", { className: "absolute w-full h-2 bg-[hsl(var(--muted))] rounded-full" }),
+        /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(
           "div",
           {
             className: "absolute h-2 bg-[hsl(var(--primary))] rounded-full pointer-events-none",
@@ -3847,7 +4061,7 @@ var Slider = ({
             }
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(
           "div",
           {
             className: `absolute w-4 h-4 -ml-2 rounded-full bg-[hsl(var(--background))] border-2 border-[hsl(var(--primary))] shadow-md cursor-pointer z-10
@@ -3864,7 +4078,7 @@ var Slider = ({
             tabIndex: disabled ? -1 : 0
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(
           "div",
           {
             className: `absolute w-4 h-4 -ml-2 rounded-full bg-[hsl(var(--background))] border-2 border-[hsl(var(--primary))] shadow-md cursor-pointer z-10
@@ -3884,21 +4098,21 @@ var Slider = ({
       ] })
     ] });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime100.jsxs)("div", { className: `w-full ${className}`, children: [
-    (label || showValue) && /* @__PURE__ */ (0, import_jsx_runtime100.jsxs)("div", { className: "flex justify-between items-center mb-2", children: [
-      label && /* @__PURE__ */ (0, import_jsx_runtime100.jsx)("label", { className: "text-sm font-medium text-[hsl(var(--foreground))]", children: label }),
-      showValue && /* @__PURE__ */ (0, import_jsx_runtime100.jsx)("span", { className: "text-sm font-medium text-[hsl(var(--muted-foreground))]", children: value })
+  return /* @__PURE__ */ (0, import_jsx_runtime101.jsxs)("div", { className: `w-full ${className}`, children: [
+    (label || showValue) && /* @__PURE__ */ (0, import_jsx_runtime101.jsxs)("div", { className: "flex justify-between items-center mb-2", children: [
+      label && /* @__PURE__ */ (0, import_jsx_runtime101.jsx)("label", { className: "text-sm font-medium text-[hsl(var(--foreground))]", children: label }),
+      showValue && /* @__PURE__ */ (0, import_jsx_runtime101.jsx)("span", { className: "text-sm font-medium text-[hsl(var(--muted-foreground))]", children: value })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime100.jsxs)("div", { className: "relative h-10 flex items-center", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime100.jsx)("div", { className: "absolute w-full h-2 bg-[hsl(var(--muted))] rounded-full" }),
-      /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime101.jsxs)("div", { className: "relative h-10 flex items-center", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime101.jsx)("div", { className: "absolute w-full h-2 bg-[hsl(var(--muted))] rounded-full" }),
+      /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(
         "div",
         {
           className: "absolute h-2 bg-[hsl(var(--primary))] rounded-full pointer-events-none",
           style: { width: `${percentage}%` }
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(
         "div",
         {
           className: `absolute w-4 h-4 -ml-2 rounded-full bg-[hsl(var(--background))] border-2 border-[hsl(var(--primary))] shadow-md pointer-events-none z-10
@@ -3907,7 +4121,7 @@ var Slider = ({
           style: { left: `${percentage}%` }
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(
         "input",
         {
           type: "range",
@@ -3929,8 +4143,8 @@ var Slider = ({
 };
 // src/components/Avatar.tsx
-var import_react21 = __toESM(require("react"));
-var import_jsx_runtime101 = require("react/jsx-runtime");
+var import_react22 = __toESM(require("react"));
+var import_jsx_runtime102 = require("react/jsx-runtime");
 var Avatar = ({
   src,
   alt,
@@ -3940,7 +4154,7 @@ var Avatar = ({
   className = "",
   fallbackColor = "bg-[hsl(var(--primary))]"
 }) => {
-  const [imageError, setImageError] = import_react21.default.useState(false);
+  const [imageError, setImageError] = import_react22.default.useState(false);
   const sizeClasses7 = {
     xs: "w-6 h-6 text-xs",
     sm: "w-8 h-8 text-sm",
@@ -3958,11 +4172,11 @@ var Avatar = ({
   };
   const showImage = src && !imageError;
   const showInitials = !showImage && name;
-  return /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime102.jsx)(
     "div",
     {
       className: `${sizeClasses7[size]} ${shapeClass} flex items-center justify-center overflow-hidden ${showImage ? "bg-[hsl(var(--muted))]" : `${fallbackColor} text-white`} ${className}`,
-      children: showImage ? /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(
+      children: showImage ? /* @__PURE__ */ (0, import_jsx_runtime102.jsx)(
         "img",
         {
           src,
@@ -3970,13 +4184,13 @@ var Avatar = ({
           className: "w-full h-full object-cover",
           onError: () => setImageError(true)
         }
-      ) : showInitials ? /* @__PURE__ */ (0, import_jsx_runtime101.jsx)("span", { className: "font-semibold select-none", children: getInitials(name) }) : /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(
+      ) : showInitials ? /* @__PURE__ */ (0, import_jsx_runtime102.jsx)("span", { className: "font-semibold select-none", children: getInitials(name) }) : /* @__PURE__ */ (0, import_jsx_runtime102.jsx)(
         "svg",
         {
           className: "w-full h-full text-[hsl(var(--muted-foreground))]",
           fill: "currentColor",
           viewBox: "0 0 24 24",
-          children: /* @__PURE__ */ (0, import_jsx_runtime101.jsx)("path", { d: "M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z" })
+          children: /* @__PURE__ */ (0, import_jsx_runtime102.jsx)("path", { d: "M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z" })
         }
       )
     }
@@ -3984,7 +4198,7 @@ var Avatar = ({
 };
 // src/components/Textarea.tsx
-var import_jsx_runtime102 = require("react/jsx-runtime");
+var import_jsx_runtime103 = require("react/jsx-runtime");
 var Textarea = ({
   label,
   error,
@@ -4011,9 +4225,9 @@ var Textarea = ({
     bg-transparent text-[hsl(var(--foreground))]
     placeholder:text-[hsl(var(--muted-foreground))]
     disabled:opacity-50 disabled:cursor-not-allowed disabled:bg-[hsl(var(--muted))]`;
-  return /* @__PURE__ */ (0, import_jsx_runtime102.jsxs)("div", { className: `w-full ${className}`, children: [
-    label && /* @__PURE__ */ (0, import_jsx_runtime102.jsx)("label", { className: "block text-sm font-medium text-[hsl(var(--foreground))] mb-1.5", children: label }),
-    /* @__PURE__ */ (0, import_jsx_runtime102.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime103.jsxs)("div", { className: `w-full ${className}`, children: [
+    label && /* @__PURE__ */ (0, import_jsx_runtime103.jsx)("label", { className: "block text-sm font-medium text-[hsl(var(--foreground))] mb-1.5", children: label }),
+    /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(
       "textarea",
       {
         className: `${baseClasses} ${sizeClasses7[size]} ${resizeClasses[resize]}`,
@@ -4021,14 +4235,14 @@ var Textarea = ({
         ...props
       }
     ),
-    error && /* @__PURE__ */ (0, import_jsx_runtime102.jsx)("p", { className: "mt-1.5 text-sm text-[hsl(var(--destructive))]", children: error }),
-    helperText && !error && /* @__PURE__ */ (0, import_jsx_runtime102.jsx)("p", { className: "mt-1.5 text-sm text-[hsl(var(--muted-foreground))]", children: helperText })
+    error && /* @__PURE__ */ (0, import_jsx_runtime103.jsx)("p", { className: "mt-1.5 text-sm text-[hsl(var(--destructive))]", children: error }),
+    helperText && !error && /* @__PURE__ */ (0, import_jsx_runtime103.jsx)("p", { className: "mt-1.5 text-sm text-[hsl(var(--muted-foreground))]", children: helperText })
   ] });
 };
 // src/components/RichTextEditor.tsx
-var import_react22 = require("react");
-var import_jsx_runtime103 = require("react/jsx-runtime");
+var import_react23 = require("react");
+var import_jsx_runtime104 = require("react/jsx-runtime");
 var RichTextEditor = ({
   value = "",
   onChange,
@@ -4042,16 +4256,16 @@ var RichTextEditor = ({
   helperText
 }) => {
   const { themeName } = useTheme();
-  const editorRef = (0, import_react22.useRef)(null);
-  const [isFocused, setIsFocused] = (0, import_react22.useState)(false);
-  const [activeFormats, setActiveFormats] = (0, import_react22.useState)(/* @__PURE__ */ new Set());
-  const [showLinkModal, setShowLinkModal] = (0, import_react22.useState)(false);
-  const [linkUrl, setLinkUrl] = (0, import_react22.useState)("");
-  const [showImageModal, setShowImageModal] = (0, import_react22.useState)(false);
-  const [imageUrl, setImageUrl] = (0, import_react22.useState)("");
-  const [imageAlt, setImageAlt] = (0, import_react22.useState)("");
-  const savedSelection = (0, import_react22.useRef)(null);
-  (0, import_react22.useLayoutEffect)(() => {
+  const editorRef = (0, import_react23.useRef)(null);
+  const [isFocused, setIsFocused] = (0, import_react23.useState)(false);
+  const [activeFormats, setActiveFormats] = (0, import_react23.useState)(/* @__PURE__ */ new Set());
+  const [showLinkModal, setShowLinkModal] = (0, import_react23.useState)(false);
+  const [linkUrl, setLinkUrl] = (0, import_react23.useState)("");
+  const [showImageModal, setShowImageModal] = (0, import_react23.useState)(false);
+  const [imageUrl, setImageUrl] = (0, import_react23.useState)("");
+  const [imageAlt, setImageAlt] = (0, import_react23.useState)("");
+  const savedSelection = (0, import_react23.useRef)(null);
+  (0, import_react23.useLayoutEffect)(() => {
     const styleId = "rich-text-editor-styles";
     if (!document.getElementById(styleId)) {
       const style = document.createElement("style");
@@ -4113,9 +4327,9 @@ var RichTextEditor = ({
       document.head.appendChild(style);
     }
   }, []);
-  const isInitialRender = (0, import_react22.useRef)(true);
-  const isInternalUpdate = (0, import_react22.useRef)(false);
-  (0, import_react22.useEffect)(() => {
+  const isInitialRender = (0, import_react23.useRef)(true);
+  const isInternalUpdate = (0, import_react23.useRef)(false);
+  (0, import_react23.useEffect)(() => {
     if (isInitialRender.current && editorRef.current) {
       editorRef.current.innerHTML = value;
       isInitialRender.current = false;
@@ -4126,7 +4340,7 @@ var RichTextEditor = ({
       }
     }
   }, []);
-  (0, import_react22.useEffect)(() => {
+  (0, import_react23.useEffect)(() => {
     if (!isInitialRender.current && !isInternalUpdate.current && editorRef.current) {
       const currentHtml = editorRef.current.innerHTML;
       if (currentHtml !== value) {
@@ -4169,7 +4383,7 @@ var RichTextEditor = ({
     }
     isInternalUpdate.current = false;
   }, [value]);
-  const updateActiveFormats = (0, import_react22.useCallback)(() => {
+  const updateActiveFormats = (0, import_react23.useCallback)(() => {
     const formats = /* @__PURE__ */ new Set();
     if (document.queryCommandState("bold")) formats.add("bold");
     if (document.queryCommandState("italic")) formats.add("italic");
@@ -4186,14 +4400,14 @@ var RichTextEditor = ({
     }
     setActiveFormats(formats);
   }, []);
-  const handleInput = (0, import_react22.useCallback)(() => {
+  const handleInput = (0, import_react23.useCallback)(() => {
     if (editorRef.current && onChange) {
       isInternalUpdate.current = true;
       onChange(editorRef.current.innerHTML);
     }
     updateActiveFormats();
   }, [onChange, updateActiveFormats]);
-  const handleFocus = (0, import_react22.useCallback)(() => {
+  const handleFocus = (0, import_react23.useCallback)(() => {
     setIsFocused(true);
     if (editorRef.current && (!editorRef.current.innerHTML || editorRef.current.innerHTML === "")) {
       editorRef.current.innerHTML = "<p><br></p>";
@@ -4207,28 +4421,28 @@ var RichTextEditor = ({
       }
     }
   }, []);
-  const handleFormat = (0, import_react22.useCallback)((command) => {
+  const handleFormat = (0, import_react23.useCallback)((command) => {
     if (disabled) return;
     document.execCommand(command, false);
     editorRef.current?.focus();
     updateActiveFormats();
     handleInput();
   }, [disabled, updateActiveFormats, handleInput]);
-  const handleList = (0, import_react22.useCallback)((command) => {
+  const handleList = (0, import_react23.useCallback)((command) => {
     if (disabled) return;
     document.execCommand(command, false);
     editorRef.current?.focus();
     updateActiveFormats();
     handleInput();
   }, [disabled, updateActiveFormats, handleInput]);
-  const handleHeading = (0, import_react22.useCallback)((level) => {
+  const handleHeading = (0, import_react23.useCallback)((level) => {
     if (disabled) return;
     document.execCommand("formatBlock", false, level);
     editorRef.current?.focus();
     updateActiveFormats();
     handleInput();
   }, [disabled, updateActiveFormats, handleInput]);
-  const handleLink = (0, import_react22.useCallback)(() => {
+  const handleLink = (0, import_react23.useCallback)(() => {
     if (disabled) return;
     const selection = window.getSelection();
     if (selection && selection.rangeCount > 0) {
@@ -4236,7 +4450,7 @@ var RichTextEditor = ({
     }
     setShowLinkModal(true);
   }, [disabled]);
-  const insertLink = (0, import_react22.useCallback)(() => {
+  const insertLink = (0, import_react23.useCallback)(() => {
     if (!linkUrl || !editorRef.current) return;
     const selection = window.getSelection();
     if (savedSelection.current && selection) {
@@ -4254,7 +4468,7 @@ var RichTextEditor = ({
     editorRef.current?.focus();
     handleInput();
   }, [linkUrl, handleInput]);
-  const handleCode = (0, import_react22.useCallback)(() => {
+  const handleCode = (0, import_react23.useCallback)(() => {
     if (disabled) return;
     const selection = window.getSelection();
     if (selection && selection.rangeCount > 0) {
@@ -4270,7 +4484,7 @@ var RichTextEditor = ({
     }
     editorRef.current?.focus();
   }, [disabled, handleInput]);
-  const handleImage = (0, import_react22.useCallback)(() => {
+  const handleImage = (0, import_react23.useCallback)(() => {
     if (disabled) return;
     const selection = window.getSelection();
     if (selection && selection.rangeCount > 0) {
@@ -4278,7 +4492,7 @@ var RichTextEditor = ({
     }
     setShowImageModal(true);
   }, [disabled]);
-  const insertImage = (0, import_react22.useCallback)(() => {
+  const insertImage = (0, import_react23.useCallback)(() => {
     if (!imageUrl || !editorRef.current) return;
     editorRef.current.focus();
     const img = document.createElement("img");
@@ -4358,11 +4572,11 @@ var RichTextEditor = ({
   const editorBaseClass = themeName === "minimalistic" ? "bg-transparent border-2 border-white text-white placeholder:text-[hsl(var(--muted-foreground))]" : "bg-[hsl(var(--card))] border border-[hsl(var(--input))] text-[hsl(var(--foreground))]";
   const focusClass = isFocused && !disabled ? themeName === "minimalistic" ? "border-white" : "border-[hsl(var(--primary))] ring-1 ring-[hsl(var(--ring))]/50" : "";
   const errorClass = error ? "border-red-500 dark:border-red-400" : "";
-  return /* @__PURE__ */ (0, import_jsx_runtime103.jsxs)("div", { className: `w-full ${className}`, children: [
-    label && /* @__PURE__ */ (0, import_jsx_runtime103.jsx)("label", { className: "block text-sm font-medium text-[hsl(var(--foreground))] mb-2", children: label }),
-    /* @__PURE__ */ (0, import_jsx_runtime103.jsxs)("div", { className: `rounded-t-lg border-b ${editorBaseClass} p-2 flex flex-wrap gap-1`, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime103.jsxs)("div", { className: "flex gap-1", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime104.jsxs)("div", { className: `w-full ${className}`, children: [
+    label && /* @__PURE__ */ (0, import_jsx_runtime104.jsx)("label", { className: "block text-sm font-medium text-[hsl(var(--foreground))] mb-2", children: label }),
+    /* @__PURE__ */ (0, import_jsx_runtime104.jsxs)("div", { className: `rounded-t-lg border-b ${editorBaseClass} p-2 flex flex-wrap gap-1`, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime104.jsxs)("div", { className: "flex gap-1", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
           "button",
           {
             type: "button",
@@ -4370,10 +4584,10 @@ var RichTextEditor = ({
             className: getButtonClass(activeFormats.has("bold")),
             disabled,
             title: "Bold (Ctrl+B)",
-            children: /* @__PURE__ */ (0, import_jsx_runtime103.jsx)("svg", { className: "w-4 h-4", fill: "currentColor", viewBox: "0 0 20 20", children: /* @__PURE__ */ (0, import_jsx_runtime103.jsx)("path", { d: "M12.78 4c1.09 0 2.04.38 2.84 1.14.8.76 1.2 1.74 1.2 2.94 0 .9-.25 1.68-.76 2.36-.51.68-1.2 1.14-2.04 1.38v.08c1.06.22 1.89.7 2.48 1.44.59.74.88 1.64.88 2.7 0 1.34-.47 2.43-1.41 3.27C14.96 19.77 13.74 20 12.24 20H4V4h8.78zm-.66 7.14c.62 0 1.12-.18 1.5-.54.38-.36.57-.84.57-1.44 0-.6-.19-1.08-.57-1.44-.38-.36-.88-.54-1.5-.54H7.5v3.96h4.62zm.24 6.86c.68 0 1.24-.19 1.68-.57.44-.38.66-.9.66-1.56 0-.66-.22-1.18-.66-1.56-.44-.38-1-.57-1.68-.57H7.5v4.26h4.86z" }) })
+            children: /* @__PURE__ */ (0, import_jsx_runtime104.jsx)("svg", { className: "w-4 h-4", fill: "currentColor", viewBox: "0 0 20 20", children: /* @__PURE__ */ (0, import_jsx_runtime104.jsx)("path", { d: "M12.78 4c1.09 0 2.04.38 2.84 1.14.8.76 1.2 1.74 1.2 2.94 0 .9-.25 1.68-.76 2.36-.51.68-1.2 1.14-2.04 1.38v.08c1.06.22 1.89.7 2.48 1.44.59.74.88 1.64.88 2.7 0 1.34-.47 2.43-1.41 3.27C14.96 19.77 13.74 20 12.24 20H4V4h8.78zm-.66 7.14c.62 0 1.12-.18 1.5-.54.38-.36.57-.84.57-1.44 0-.6-.19-1.08-.57-1.44-.38-.36-.88-.54-1.5-.54H7.5v3.96h4.62zm.24 6.86c.68 0 1.24-.19 1.68-.57.44-.38.66-.9.66-1.56 0-.66-.22-1.18-.66-1.56-.44-.38-1-.57-1.68-.57H7.5v4.26h4.86z" }) })
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
           "button",
           {
             type: "button",
@@ -4381,10 +4595,10 @@ var RichTextEditor = ({
             className: getButtonClass(activeFormats.has("italic")),
             disabled,
             title: "Italic (Ctrl+I)",
-            children: /* @__PURE__ */ (0, import_jsx_runtime103.jsx)("svg", { className: "w-4 h-4", fill: "currentColor", viewBox: "0 0 20 20", children: /* @__PURE__ */ (0, import_jsx_runtime103.jsx)("path", { d: "M11.59 4H16v2h-1.71l-3.58 8H13v2H8v-2h1.71l3.58-8H11.59V4z" }) })
+            children: /* @__PURE__ */ (0, import_jsx_runtime104.jsx)("svg", { className: "w-4 h-4", fill: "currentColor", viewBox: "0 0 20 20", children: /* @__PURE__ */ (0, import_jsx_runtime104.jsx)("path", { d: "M11.59 4H16v2h-1.71l-3.58 8H13v2H8v-2h1.71l3.58-8H11.59V4z" }) })
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
           "button",
           {
             type: "button",
@@ -4392,10 +4606,10 @@ var RichTextEditor = ({
             className: getButtonClass(activeFormats.has("underline")),
             disabled,
             title: "Underline (Ctrl+U)",
-            children: /* @__PURE__ */ (0, import_jsx_runtime103.jsx)("svg", { className: "w-4 h-4", fill: "currentColor", viewBox: "0 0 20 20", children: /* @__PURE__ */ (0, import_jsx_runtime103.jsx)("path", { d: "M10 16c-2.21 0-4-1.79-4-4V4h2v8c0 1.1.9 2 2 2s2-.9 2-2V4h2v8c0 2.21-1.79 4-4 4zM4 18h12v2H4v-2z" }) })
+            children: /* @__PURE__ */ (0, import_jsx_runtime104.jsx)("svg", { className: "w-4 h-4", fill: "currentColor", viewBox: "0 0 20 20", children: /* @__PURE__ */ (0, import_jsx_runtime104.jsx)("path", { d: "M10 16c-2.21 0-4-1.79-4-4V4h2v8c0 1.1.9 2 2 2s2-.9 2-2V4h2v8c0 2.21-1.79 4-4 4zM4 18h12v2H4v-2z" }) })
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
           "button",
           {
             type: "button",
@@ -4403,13 +4617,13 @@ var RichTextEditor = ({
             className: getButtonClass(activeFormats.has("strikeThrough")),
             disabled,
             title: "Strikethrough",
-            children: /* @__PURE__ */ (0, import_jsx_runtime103.jsx)("svg", { className: "w-4 h-4", fill: "currentColor", viewBox: "0 0 20 20", children: /* @__PURE__ */ (0, import_jsx_runtime103.jsx)("path", { d: "M10 4c-2 0-3.5.5-4.5 1.5S4 7.5 4 9h2c0-.7.2-1.2.6-1.6.4-.4 1-.6 1.9-.6.8 0 1.4.2 1.8.5.4.3.7.8.7 1.4 0 .5-.2.9-.5 1.2-.3.3-.9.6-1.8.9l-.7.2c-1.2.3-2.1.7-2.7 1.2C4.2 12.7 4 13.5 4 14.5c0 1.1.4 2 1.1 2.6.7.6 1.7.9 3 .9 2.1 0 3.6-.5 4.6-1.5.9-1 1.3-2.3 1.3-3.8h-2c0 .9-.2 1.6-.7 2.1-.5.5-1.2.7-2.2.7-.8 0-1.4-.2-1.8-.5-.4-.3-.6-.8-.6-1.4 0-.5.2-.9.5-1.2.3-.3.9-.6 1.8-.9l.7-.2c1.2-.3 2.1-.7 2.7-1.2.6-.5.9-1.3.9-2.3 0-1.2-.4-2.1-1.2-2.8-.8-.7-1.9-1-3.3-1zM2 10h16v1H2v-1z" }) })
+            children: /* @__PURE__ */ (0, import_jsx_runtime104.jsx)("svg", { className: "w-4 h-4", fill: "currentColor", viewBox: "0 0 20 20", children: /* @__PURE__ */ (0, import_jsx_runtime104.jsx)("path", { d: "M10 4c-2 0-3.5.5-4.5 1.5S4 7.5 4 9h2c0-.7.2-1.2.6-1.6.4-.4 1-.6 1.9-.6.8 0 1.4.2 1.8.5.4.3.7.8.7 1.4 0 .5-.2.9-.5 1.2-.3.3-.9.6-1.8.9l-.7.2c-1.2.3-2.1.7-2.7 1.2C4.2 12.7 4 13.5 4 14.5c0 1.1.4 2 1.1 2.6.7.6 1.7.9 3 .9 2.1 0 3.6-.5 4.6-1.5.9-1 1.3-2.3 1.3-3.8h-2c0 .9-.2 1.6-.7 2.1-.5.5-1.2.7-2.2.7-.8 0-1.4-.2-1.8-.5-.4-.3-.6-.8-.6-1.4 0-.5.2-.9.5-1.2.3-.3.9-.6 1.8-.9l.7-.2c1.2-.3 2.1-.7 2.7-1.2.6-.5.9-1.3.9-2.3 0-1.2-.4-2.1-1.2-2.8-.8-.7-1.9-1-3.3-1zM2 10h16v1H2v-1z" }) })
           }
         )
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime103.jsx)("div", { className: "w-px bg-[hsl(var(--border))] mx-1" }),
-      /* @__PURE__ */ (0, import_jsx_runtime103.jsxs)("div", { className: "flex gap-1", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime104.jsx)("div", { className: "w-px bg-[hsl(var(--border))] mx-1" }),
+      /* @__PURE__ */ (0, import_jsx_runtime104.jsxs)("div", { className: "flex gap-1", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
           "button",
           {
             type: "button",
@@ -4417,10 +4631,10 @@ var RichTextEditor = ({
             className: getButtonClass(activeFormats.has("h1")),
             disabled,
             title: "Heading 1",
-            children: /* @__PURE__ */ (0, import_jsx_runtime103.jsx)("svg", { className: "w-4 h-4", fill: "currentColor", viewBox: "0 0 20 20", children: /* @__PURE__ */ (0, import_jsx_runtime103.jsx)("text", { x: "2", y: "16", fontSize: "14", fontWeight: "bold", children: "H1" }) })
+            children: /* @__PURE__ */ (0, import_jsx_runtime104.jsx)("svg", { className: "w-4 h-4", fill: "currentColor", viewBox: "0 0 20 20", children: /* @__PURE__ */ (0, import_jsx_runtime104.jsx)("text", { x: "2", y: "16", fontSize: "14", fontWeight: "bold", children: "H1" }) })
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
           "button",
           {
             type: "button",
@@ -4428,10 +4642,10 @@ var RichTextEditor = ({
             className: getButtonClass(activeFormats.has("h2")),
             disabled,
             title: "Heading 2",
-            children: /* @__PURE__ */ (0, import_jsx_runtime103.jsx)("svg", { className: "w-4 h-4", fill: "currentColor", viewBox: "0 0 20 20", children: /* @__PURE__ */ (0, import_jsx_runtime103.jsx)("text", { x: "2", y: "16", fontSize: "14", fontWeight: "bold", children: "H2" }) })
+            children: /* @__PURE__ */ (0, import_jsx_runtime104.jsx)("svg", { className: "w-4 h-4", fill: "currentColor", viewBox: "0 0 20 20", children: /* @__PURE__ */ (0, import_jsx_runtime104.jsx)("text", { x: "2", y: "16", fontSize: "14", fontWeight: "bold", children: "H2" }) })
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
           "button",
           {
             type: "button",
@@ -4439,13 +4653,13 @@ var RichTextEditor = ({
             className: getButtonClass(activeFormats.has("h3")),
             disabled,
             title: "Heading 3",
-            children: /* @__PURE__ */ (0, import_jsx_runtime103.jsx)("svg", { className: "w-4 h-4", fill: "currentColor", viewBox: "0 0 20 20", children: /* @__PURE__ */ (0, import_jsx_runtime103.jsx)("text", { x: "2", y: "16", fontSize: "14", fontWeight: "bold", children: "H3" }) })
+            children: /* @__PURE__ */ (0, import_jsx_runtime104.jsx)("svg", { className: "w-4 h-4", fill: "currentColor", viewBox: "0 0 20 20", children: /* @__PURE__ */ (0, import_jsx_runtime104.jsx)("text", { x: "2", y: "16", fontSize: "14", fontWeight: "bold", children: "H3" }) })
           }
         )
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime103.jsx)("div", { className: "w-px bg-[hsl(var(--border))] mx-1" }),
-      /* @__PURE__ */ (0, import_jsx_runtime103.jsxs)("div", { className: "flex gap-1", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime104.jsx)("div", { className: "w-px bg-[hsl(var(--border))] mx-1" }),
+      /* @__PURE__ */ (0, import_jsx_runtime104.jsxs)("div", { className: "flex gap-1", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
           "button",
           {
             type: "button",
@@ -4453,10 +4667,10 @@ var RichTextEditor = ({
             className: getButtonClass(activeFormats.has("ul")),
             disabled,
             title: "Bullet List",
-            children: /* @__PURE__ */ (0, import_jsx_runtime103.jsx)("svg", { className: "w-4 h-4", fill: "currentColor", viewBox: "0 0 20 20", children: /* @__PURE__ */ (0, import_jsx_runtime103.jsx)("path", { d: "M4 4h2v2H4V4zm4 0h8v2H8V4zM4 8h2v2H4V8zm4 0h8v2H8V8zm-4 4h2v2H4v-2zm4 0h8v2H8v-2zm-4 4h2v2H4v-2zm4 0h8v2H8v-2z" }) })
+            children: /* @__PURE__ */ (0, import_jsx_runtime104.jsx)("svg", { className: "w-4 h-4", fill: "currentColor", viewBox: "0 0 20 20", children: /* @__PURE__ */ (0, import_jsx_runtime104.jsx)("path", { d: "M4 4h2v2H4V4zm4 0h8v2H8V4zM4 8h2v2H4V8zm4 0h8v2H8V8zm-4 4h2v2H4v-2zm4 0h8v2H8v-2zm-4 4h2v2H4v-2zm4 0h8v2H8v-2z" }) })
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
           "button",
           {
             type: "button",
@@ -4464,13 +4678,13 @@ var RichTextEditor = ({
             className: getButtonClass(activeFormats.has("ol")),
             disabled,
             title: "Numbered List",
-            children: /* @__PURE__ */ (0, import_jsx_runtime103.jsx)("svg", { className: "w-4 h-4", fill: "currentColor", viewBox: "0 0 20 20", children: /* @__PURE__ */ (0, import_jsx_runtime103.jsx)("path", { d: "M4 4h1v3H4V4zm0 4h1v1H3V8h2v1H4zm1 2H3v1h2v1H3v1h2v-3zM8 4h8v2H8V4zm0 4h8v2H8V8zm0 4h8v2H8v-2zm0 4h8v2H8v-2z" }) })
+            children: /* @__PURE__ */ (0, import_jsx_runtime104.jsx)("svg", { className: "w-4 h-4", fill: "currentColor", viewBox: "0 0 20 20", children: /* @__PURE__ */ (0, import_jsx_runtime104.jsx)("path", { d: "M4 4h1v3H4V4zm0 4h1v1H3V8h2v1H4zm1 2H3v1h2v1H3v1h2v-3zM8 4h8v2H8V4zm0 4h8v2H8V8zm0 4h8v2H8v-2zm0 4h8v2H8v-2z" }) })
           }
         )
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime103.jsx)("div", { className: "w-px bg-[hsl(var(--border))] mx-1" }),
-      /* @__PURE__ */ (0, import_jsx_runtime103.jsxs)("div", { className: "flex gap-1", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime104.jsx)("div", { className: "w-px bg-[hsl(var(--border))] mx-1" }),
+      /* @__PURE__ */ (0, import_jsx_runtime104.jsxs)("div", { className: "flex gap-1", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
           "button",
           {
             type: "button",
@@ -4478,10 +4692,10 @@ var RichTextEditor = ({
             className: getButtonClass(false),
             disabled,
             title: "Insert Link",
-            children: /* @__PURE__ */ (0, import_jsx_runtime103.jsx)("svg", { className: "w-4 h-4", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime103.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M13.828 10.172a4 4 0 00-5.656 0l-4 4a4 4 0 105.656 5.656l1.102-1.101m-.758-4.899a4 4 0 005.656 0l4-4a4 4 0 00-5.656-5.656l-1.1 1.1" }) })
+            children: /* @__PURE__ */ (0, import_jsx_runtime104.jsx)("svg", { className: "w-4 h-4", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime104.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M13.828 10.172a4 4 0 00-5.656 0l-4 4a4 4 0 105.656 5.656l1.102-1.101m-.758-4.899a4 4 0 005.656 0l4-4a4 4 0 00-5.656-5.656l-1.1 1.1" }) })
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
           "button",
           {
             type: "button",
@@ -4489,10 +4703,10 @@ var RichTextEditor = ({
             className: getButtonClass(false),
             disabled,
             title: "Insert Image/Video",
-            children: /* @__PURE__ */ (0, import_jsx_runtime103.jsx)("svg", { className: "w-4 h-4", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime103.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M4 16l4.586-4.586a2 2 0 012.828 0L16 16m-2-2l1.586-1.586a2 2 0 012.828 0L20 14m-6-6h.01M6 20h12a2 2 0 002-2V6a2 2 0 00-2-2H6a2 2 0 00-2 2v12a2 2 0 002 2z" }) })
+            children: /* @__PURE__ */ (0, import_jsx_runtime104.jsx)("svg", { className: "w-4 h-4", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime104.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M4 16l4.586-4.586a2 2 0 012.828 0L16 16m-2-2l1.586-1.586a2 2 0 012.828 0L20 14m-6-6h.01M6 20h12a2 2 0 002-2V6a2 2 0 00-2-2H6a2 2 0 00-2 2v12a2 2 0 002 2z" }) })
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
           "button",
           {
             type: "button",
@@ -4500,12 +4714,12 @@ var RichTextEditor = ({
             className: getButtonClass(false),
             disabled,
             title: "Code",
-            children: /* @__PURE__ */ (0, import_jsx_runtime103.jsx)("svg", { className: "w-4 h-4", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime103.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M10 20l4-16m4 4l4 4-4 4M6 16l-4-4 4-4" }) })
+            children: /* @__PURE__ */ (0, import_jsx_runtime104.jsx)("svg", { className: "w-4 h-4", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime104.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M10 20l4-16m4 4l4 4-4 4M6 16l-4-4 4-4" }) })
           }
         )
       ] })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
       "div",
       {
         ref: editorRef,
@@ -4529,9 +4743,9 @@ var RichTextEditor = ({
         suppressContentEditableWarning: true
       }
     ),
-    error && /* @__PURE__ */ (0, import_jsx_runtime103.jsx)("p", { className: "mt-1 text-sm text-red-600 dark:text-red-400", children: error }),
-    helperText && !error && /* @__PURE__ */ (0, import_jsx_runtime103.jsx)("p", { className: "mt-1 text-sm text-[hsl(var(--muted-foreground))]", children: helperText }),
-    /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(
+    error && /* @__PURE__ */ (0, import_jsx_runtime104.jsx)("p", { className: "mt-1 text-sm text-red-600 dark:text-red-400", children: error }),
+    helperText && !error && /* @__PURE__ */ (0, import_jsx_runtime104.jsx)("p", { className: "mt-1 text-sm text-[hsl(var(--muted-foreground))]", children: helperText }),
+    /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
       Modal,
       {
         isOpen: showLinkModal,
@@ -4541,8 +4755,8 @@ var RichTextEditor = ({
         },
         title: "Insert Link",
         size: "sm",
-        children: /* @__PURE__ */ (0, import_jsx_runtime103.jsxs)("div", { className: "space-y-4", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime104.jsxs)("div", { className: "space-y-4", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
             TextInput,
             {
               label: "URL",
@@ -4558,8 +4772,8 @@ var RichTextEditor = ({
               }
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime103.jsxs)("div", { className: "flex gap-2 justify-end", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime104.jsxs)("div", { className: "flex gap-2 justify-end", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
               Button,
               {
                 variant: "secondary",
@@ -4570,7 +4784,7 @@ var RichTextEditor = ({
                 children: "Cancel"
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
               Button,
               {
                 variant: "primary",
@@ -4583,7 +4797,7 @@ var RichTextEditor = ({
         ] })
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
       Modal,
       {
         isOpen: showImageModal,
@@ -4594,8 +4808,8 @@ var RichTextEditor = ({
         },
         title: "Insert Image",
         size: "sm",
-        children: /* @__PURE__ */ (0, import_jsx_runtime103.jsxs)("div", { className: "space-y-4", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime104.jsxs)("div", { className: "space-y-4", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
             TextInput,
             {
               label: "Image URL",
@@ -4611,7 +4825,7 @@ var RichTextEditor = ({
               }
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
             TextInput,
             {
               label: "Alt Text (optional)",
@@ -4620,8 +4834,8 @@ var RichTextEditor = ({
               placeholder: "Describe the image"
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime103.jsxs)("div", { className: "flex gap-2 justify-end", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime104.jsxs)("div", { className: "flex gap-2 justify-end", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
               Button,
               {
                 variant: "secondary",
@@ -4633,7 +4847,7 @@ var RichTextEditor = ({
                 children: "Cancel"
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
               Button,
               {
                 variant: "primary",
@@ -4650,19 +4864,19 @@ var RichTextEditor = ({
 };
 // src/components/Toast.tsx
-var import_react23 = require("react");
-var import_jsx_runtime104 = require("react/jsx-runtime");
-var ToastContext = (0, import_react23.createContext)(void 0);
+var import_react24 = require("react");
+var import_jsx_runtime105 = require("react/jsx-runtime");
+var ToastContext = (0, import_react24.createContext)(void 0);
 var useToast = () => {
-  const context = (0, import_react23.useContext)(ToastContext);
+  const context = (0, import_react24.useContext)(ToastContext);
   if (!context) {
     throw new Error("useToast must be used within a ToastProvider");
   }
   return context;
 };
 var ToastProvider = ({ children, position = "top-right" }) => {
-  const [toasts, setToasts] = (0, import_react23.useState)([]);
-  const addToast = (0, import_react23.useCallback)((toast2) => {
+  const [toasts, setToasts] = (0, import_react24.useState)([]);
+  const addToast = (0, import_react24.useCallback)((toast2) => {
     const id = Math.random().toString(36).substring(7);
     const newToast = { ...toast2, id };
     setToasts((prev) => [...prev, newToast]);
@@ -4671,7 +4885,7 @@ var ToastProvider = ({ children, position = "top-right" }) => {
       removeToast(id);
     }, duration);
   }, []);
-  const removeToast = (0, import_react23.useCallback)((id) => {
+  const removeToast = (0, import_react24.useCallback)((id) => {
     setToasts((prev) => prev.filter((toast2) => toast2.id !== id));
   }, []);
   const positionClasses2 = {
@@ -4682,9 +4896,9 @@ var ToastProvider = ({ children, position = "top-right" }) => {
     "top-center": "top-4 left-1/2 -translate-x-1/2",
     "bottom-center": "bottom-4 left-1/2 -translate-x-1/2"
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime104.jsxs)(ToastContext.Provider, { value: { toasts, addToast, removeToast }, children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime105.jsxs)(ToastContext.Provider, { value: { toasts, addToast, removeToast }, children: [
     children,
-    /* @__PURE__ */ (0, import_jsx_runtime104.jsx)("div", { className: `fixed ${positionClasses2[position]} z-50 flex flex-col gap-2 max-w-md`, children: toasts.map((toast2) => /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(ToastItem, { toast: toast2, onClose: () => removeToast(toast2.id) }, toast2.id)) })
+    /* @__PURE__ */ (0, import_jsx_runtime105.jsx)("div", { className: `fixed ${positionClasses2[position]} z-50 flex flex-col gap-2 max-w-md`, children: toasts.map((toast2) => /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(ToastItem, { toast: toast2, onClose: () => removeToast(toast2.id) }, toast2.id)) })
   ] });
 };
 var ToastItem = ({ toast: toast2, onClose }) => {
@@ -4695,27 +4909,27 @@ var ToastItem = ({ toast: toast2, onClose }) => {
     info: "bg-[hsl(var(--info))]/10 border-[hsl(var(--info))] text-[hsl(var(--info))]"
   };
   const typeIcons = {
-    success: /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(CheckIcon, { size: "sm", className: "text-[hsl(var(--success))]" }),
-    error: /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(CloseIcon, { size: "sm", className: "text-[hsl(var(--destructive))]" }),
-    warning: /* @__PURE__ */ (0, import_jsx_runtime104.jsx)("svg", { className: "w-4 h-4 text-[hsl(var(--warning))]", fill: "currentColor", viewBox: "0 0 20 20", children: /* @__PURE__ */ (0, import_jsx_runtime104.jsx)("path", { fillRule: "evenodd", d: "M8.257 3.099c.765-1.36 2.722-1.36 3.486 0l5.58 9.92c.75 1.334-.213 2.98-1.742 2.98H4.42c-1.53 0-2.493-1.646-1.743-2.98l5.58-9.92zM11 13a1 1 0 11-2 0 1 1 0 012 0zm-1-8a1 1 0 00-1 1v3a1 1 0 002 0V6a1 1 0 00-1-1z", clipRule: "evenodd" }) }),
-    info: /* @__PURE__ */ (0, import_jsx_runtime104.jsx)("svg", { className: "w-4 h-4 text-[hsl(var(--info))]", fill: "currentColor", viewBox: "0 0 20 20", children: /* @__PURE__ */ (0, import_jsx_runtime104.jsx)("path", { fillRule: "evenodd", d: "M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7-4a1 1 0 11-2 0 1 1 0 012 0zM9 9a1 1 0 000 2v3a1 1 0 001 1h1a1 1 0 100-2v-3a1 1 0 00-1-1H9z", clipRule: "evenodd" }) })
+    success: /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(CheckIcon, { size: "sm", className: "text-[hsl(var(--success))]" }),
+    error: /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(CloseIcon, { size: "sm", className: "text-[hsl(var(--destructive))]" }),
+    warning: /* @__PURE__ */ (0, import_jsx_runtime105.jsx)("svg", { className: "w-4 h-4 text-[hsl(var(--warning))]", fill: "currentColor", viewBox: "0 0 20 20", children: /* @__PURE__ */ (0, import_jsx_runtime105.jsx)("path", { fillRule: "evenodd", d: "M8.257 3.099c.765-1.36 2.722-1.36 3.486 0l5.58 9.92c.75 1.334-.213 2.98-1.742 2.98H4.42c-1.53 0-2.493-1.646-1.743-2.98l5.58-9.92zM11 13a1 1 0 11-2 0 1 1 0 012 0zm-1-8a1 1 0 00-1 1v3a1 1 0 002 0V6a1 1 0 00-1-1z", clipRule: "evenodd" }) }),
+    info: /* @__PURE__ */ (0, import_jsx_runtime105.jsx)("svg", { className: "w-4 h-4 text-[hsl(var(--info))]", fill: "currentColor", viewBox: "0 0 20 20", children: /* @__PURE__ */ (0, import_jsx_runtime105.jsx)("path", { fillRule: "evenodd", d: "M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7-4a1 1 0 11-2 0 1 1 0 012 0zM9 9a1 1 0 000 2v3a1 1 0 001 1h1a1 1 0 100-2v-3a1 1 0 00-1-1H9z", clipRule: "evenodd" }) })
   };
   const type = toast2.type || "info";
-  return /* @__PURE__ */ (0, import_jsx_runtime104.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime105.jsxs)(
     "div",
     {
       className: `flex items-start gap-3 p-4 rounded-md border-l-4 shadow-lg bg-[hsl(var(--card))] ${typeStyles[type]} animate-slide-in`,
       role: "alert",
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime104.jsx)("div", { className: "flex-shrink-0 mt-0.5", children: typeIcons[type] }),
-        /* @__PURE__ */ (0, import_jsx_runtime104.jsx)("p", { className: "flex-1 text-sm font-medium text-[hsl(var(--foreground))]", children: toast2.message }),
-        /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime105.jsx)("div", { className: "flex-shrink-0 mt-0.5", children: typeIcons[type] }),
+        /* @__PURE__ */ (0, import_jsx_runtime105.jsx)("p", { className: "flex-1 text-sm font-medium text-[hsl(var(--foreground))]", children: toast2.message }),
+        /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(
           "button",
           {
             onClick: onClose,
             className: "flex-shrink-0 text-[hsl(var(--muted-foreground))] hover:text-[hsl(var(--foreground))] transition-colors",
             "aria-label": "Close",
-            children: /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(CloseIcon, { size: "sm" })
+            children: /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(CloseIcon, { size: "sm" })
           }
         )
       ]
@@ -4746,8 +4960,8 @@ var toast = {
 };
 // src/components/Stepper.tsx
-var import_react24 = __toESM(require("react"));
-var import_jsx_runtime105 = require("react/jsx-runtime");
+var import_react25 = __toESM(require("react"));
+var import_jsx_runtime106 = require("react/jsx-runtime");
 var Stepper = ({
   steps,
   currentStep,
@@ -4767,8 +4981,8 @@ var Stepper = ({
     return { mobile: mobileVisible, desktop: desktopVisible };
   };
   const shouldShowCounter = isHorizontal && steps.length > 3;
-  return /* @__PURE__ */ (0, import_jsx_runtime105.jsxs)("div", { className: `${isHorizontal ? "flex items-start w-full" : "flex flex-col"} ${className}`, children: [
-    shouldShowCounter && /* @__PURE__ */ (0, import_jsx_runtime105.jsx)("div", { className: "md:hidden flex items-center mr-4 flex-shrink-0", children: /* @__PURE__ */ (0, import_jsx_runtime105.jsxs)("span", { className: "text-sm font-medium text-[hsl(var(--muted-foreground))]", children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime106.jsxs)("div", { className: `${isHorizontal ? "flex items-start w-full" : "flex flex-col"} ${className}`, children: [
+    shouldShowCounter && /* @__PURE__ */ (0, import_jsx_runtime106.jsx)("div", { className: "md:hidden flex items-center mr-4 flex-shrink-0", children: /* @__PURE__ */ (0, import_jsx_runtime106.jsxs)("span", { className: "text-sm font-medium text-[hsl(var(--muted-foreground))]", children: [
       currentStep,
       "/",
       steps.length
@@ -4781,19 +4995,19 @@ var Stepper = ({
       const visibility = getStepVisibility(index);
       const visibleMobileSteps = steps.filter((_, i) => getStepVisibility(i).mobile);
       const isLastVisibleMobile = index === steps.map((_, i) => i).filter((i) => getStepVisibility(i).mobile).slice(-1)[0];
-      return /* @__PURE__ */ (0, import_jsx_runtime105.jsxs)(import_react24.default.Fragment, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime105.jsxs)("div", { className: `
+      return /* @__PURE__ */ (0, import_jsx_runtime106.jsxs)(import_react25.default.Fragment, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime106.jsxs)("div", { className: `
               flex ${isHorizontal ? "flex-col items-center flex-shrink-0" : "flex-row items-start"}
               ${isHorizontal ? "" : isLast ? "" : "mb-6"}
               ${!visibility.mobile ? "hidden md:flex" : ""}
               ${!visibility.desktop && visibility.mobile ? "md:hidden" : ""}
             `, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime105.jsxs)("div", { className: `flex ${isHorizontal ? "flex-col items-center" : "flex-col items-center flex-shrink-0"}`, children: [
-            /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime106.jsxs)("div", { className: `flex ${isHorizontal ? "flex-col items-center" : "flex-col items-center flex-shrink-0"}`, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime106.jsx)(
               "div",
               {
                 className: `flex items-center justify-center w-10 h-10 rounded-full border-2 transition-all ${isCompleted ? "bg-[hsl(var(--primary))] border-[hsl(var(--primary))]" : isActive ? "border-[hsl(var(--primary))] bg-[hsl(var(--background))]" : "border-[hsl(var(--border))] bg-[hsl(var(--background))]"}`,
-                children: isCompleted ? /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(CheckIcon, { size: "sm", className: "text-[hsl(var(--primary-foreground))]" }) : /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(
+                children: isCompleted ? /* @__PURE__ */ (0, import_jsx_runtime106.jsx)(CheckIcon, { size: "sm", className: "text-[hsl(var(--primary-foreground))]" }) : /* @__PURE__ */ (0, import_jsx_runtime106.jsx)(
                   "span",
                   {
                     className: `text-sm font-semibold ${isActive ? "text-[hsl(var(--primary))]" : "text-[hsl(var(--muted-foreground))]"}`,
@@ -4802,29 +5016,29 @@ var Stepper = ({
                 )
               }
             ),
-            !isLast && !isHorizontal && /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(
+            !isLast && !isHorizontal && /* @__PURE__ */ (0, import_jsx_runtime106.jsx)(
               "div",
               {
                 className: `w-0.5 flex-1 min-h-[24px] ${isCompleted ? "bg-[hsl(var(--primary))]" : "bg-[hsl(var(--border))]"}`
               }
             )
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime105.jsxs)("div", { className: `${isHorizontal ? "mt-3 text-center" : "ml-4 flex-1 min-h-[40px] flex flex-col justify-center"}`, children: [
-            /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime106.jsxs)("div", { className: `${isHorizontal ? "mt-3 text-center" : "ml-4 flex-1 min-h-[40px] flex flex-col justify-center"}`, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime106.jsx)(
               "p",
               {
                 className: `text-sm font-medium whitespace-nowrap ${isActive || isCompleted ? "text-[hsl(var(--foreground))]" : "text-[hsl(var(--muted-foreground))]"}`,
                 children: step.label
               }
             ),
-            step.description && /* @__PURE__ */ (0, import_jsx_runtime105.jsx)("p", { className: "text-xs text-[hsl(var(--muted-foreground))] mt-1 whitespace-nowrap", children: step.description })
+            step.description && /* @__PURE__ */ (0, import_jsx_runtime106.jsx)("p", { className: "text-xs text-[hsl(var(--muted-foreground))] mt-1 whitespace-nowrap", children: step.description })
           ] })
         ] }),
-        !isLast && isHorizontal && /* @__PURE__ */ (0, import_jsx_runtime105.jsx)("div", { className: `
+        !isLast && isHorizontal && /* @__PURE__ */ (0, import_jsx_runtime106.jsx)("div", { className: `
                 flex items-start pt-5 mx-4 min-w-[80px] max-w-[200px] flex-1
                 ${!visibility.mobile || isLastVisibleMobile ? "hidden md:flex" : ""}
                 ${!visibility.desktop && visibility.mobile ? "md:hidden" : ""}
-              `, children: /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(
+              `, children: /* @__PURE__ */ (0, import_jsx_runtime106.jsx)(
           "div",
           {
             className: `h-0.5 w-full ${isCompleted ? "bg-[hsl(var(--primary))]" : "bg-[hsl(var(--border))]"}`
@@ -4836,7 +5050,7 @@ var Stepper = ({
 };
 // src/components/Divider.tsx
-var import_jsx_runtime106 = require("react/jsx-runtime");
+var import_jsx_runtime107 = require("react/jsx-runtime");
 var Divider = ({
   orientation = "horizontal",
   variant = "solid",
@@ -4855,14 +5069,14 @@ var Divider = ({
       center: "justify-center",
       right: "justify-end"
     };
-    return /* @__PURE__ */ (0, import_jsx_runtime106.jsxs)("div", { className: `flex items-center ${alignmentClasses[labelPosition]} ${className}`, role: "separator", children: [
-      labelPosition !== "left" && /* @__PURE__ */ (0, import_jsx_runtime106.jsx)("div", { className: `flex-1 border-t ${variantClasses[variant]} border-[hsl(var(--input))]` }),
-      /* @__PURE__ */ (0, import_jsx_runtime106.jsx)("span", { className: "px-4 text-sm text-[hsl(var(--muted-foreground))]", children: label }),
-      labelPosition !== "right" && /* @__PURE__ */ (0, import_jsx_runtime106.jsx)("div", { className: `flex-1 border-t ${variantClasses[variant]} border-[hsl(var(--input))]` })
+    return /* @__PURE__ */ (0, import_jsx_runtime107.jsxs)("div", { className: `flex items-center ${alignmentClasses[labelPosition]} ${className}`, role: "separator", children: [
+      labelPosition !== "left" && /* @__PURE__ */ (0, import_jsx_runtime107.jsx)("div", { className: `flex-1 border-t ${variantClasses[variant]} border-[hsl(var(--input))]` }),
+      /* @__PURE__ */ (0, import_jsx_runtime107.jsx)("span", { className: "px-4 text-sm text-[hsl(var(--muted-foreground))]", children: label }),
+      labelPosition !== "right" && /* @__PURE__ */ (0, import_jsx_runtime107.jsx)("div", { className: `flex-1 border-t ${variantClasses[variant]} border-[hsl(var(--input))]` })
     ] });
   }
   if (orientation === "vertical") {
-    return /* @__PURE__ */ (0, import_jsx_runtime106.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(
       "div",
       {
         className: `inline-block h-full border-l ${variantClasses[variant]} border-[hsl(var(--input))] ${className}`,
@@ -4871,7 +5085,7 @@ var Divider = ({
       }
     );
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime106.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(
     "hr",
     {
       className: `border-t ${variantClasses[variant]} border-[hsl(var(--input))] ${className}`,
@@ -4881,8 +5095,8 @@ var Divider = ({
 };
 // src/components/FileUpload.tsx
-var import_react25 = require("react");
-var import_jsx_runtime107 = require("react/jsx-runtime");
+var import_react26 = require("react");
+var import_jsx_runtime108 = require("react/jsx-runtime");
 var FileUpload = ({
   accept,
   multiple = false,
@@ -4895,9 +5109,9 @@ var FileUpload = ({
   label,
   helperText
 }) => {
-  const [files, setFiles] = (0, import_react25.useState)([]);
-  const [isDragging, setIsDragging] = (0, import_react25.useState)(false);
-  const fileInputRef = (0, import_react25.useRef)(null);
+  const [files, setFiles] = (0, import_react26.useState)([]);
+  const [isDragging, setIsDragging] = (0, import_react26.useState)(false);
+  const fileInputRef = (0, import_react26.useRef)(null);
   const formatFileSize = (bytes) => {
     if (bytes === 0) return "0 Bytes";
     const k = 1024;
@@ -4955,9 +5169,9 @@ var FileUpload = ({
     setFiles(newFiles);
     onChange?.(newFiles);
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime107.jsxs)("div", { className: `w-full ${className}`, children: [
-    label && /* @__PURE__ */ (0, import_jsx_runtime107.jsx)("label", { className: "block text-sm font-medium text-[hsl(var(--foreground))] mb-2", children: label }),
-    /* @__PURE__ */ (0, import_jsx_runtime107.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)("div", { className: `w-full ${className}`, children: [
+    label && /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("label", { className: "block text-sm font-medium text-[hsl(var(--foreground))] mb-2", children: label }),
+    /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)(
       "div",
       {
         onDrop: handleDrop,
@@ -4966,7 +5180,7 @@ var FileUpload = ({
         onClick: handleClick,
         className: `relative border-2 border-dashed rounded-lg p-8 text-center cursor-pointer transition-all ${isDragging ? "border-[hsl(var(--primary))] bg-[hsl(var(--primary))]/10" : "border-[hsl(var(--input))] hover:border-[hsl(var(--muted-foreground))]"} ${disabled ? "opacity-50 cursor-not-allowed" : ""}`,
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(
             "input",
             {
               ref: fileInputRef,
@@ -4978,14 +5192,14 @@ var FileUpload = ({
               className: "hidden"
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime107.jsxs)("div", { className: "flex flex-col items-center gap-2", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime107.jsx)("div", { className: "w-12 h-12 rounded-full bg-[hsl(var(--muted))] flex items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(UploadIcon, { size: "lg", className: "text-[hsl(var(--muted-foreground))]" }) }),
-            /* @__PURE__ */ (0, import_jsx_runtime107.jsxs)("div", { children: [
-              /* @__PURE__ */ (0, import_jsx_runtime107.jsxs)("p", { className: "text-sm font-medium text-[hsl(var(--foreground))]", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime107.jsx)("span", { className: "text-[hsl(var(--primary))]", children: "Click to upload" }),
+          /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)("div", { className: "flex flex-col items-center gap-2", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("div", { className: "w-12 h-12 rounded-full bg-[hsl(var(--muted))] flex items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(UploadIcon, { size: "lg", className: "text-[hsl(var(--muted-foreground))]" }) }),
+            /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)("div", { children: [
+              /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)("p", { className: "text-sm font-medium text-[hsl(var(--foreground))]", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("span", { className: "text-[hsl(var(--primary))]", children: "Click to upload" }),
                 " or drag and drop"
               ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime107.jsxs)("p", { className: "text-xs text-[hsl(var(--muted-foreground))] mt-1", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)("p", { className: "text-xs text-[hsl(var(--muted-foreground))] mt-1", children: [
                 accept ? `Accepted: ${accept}` : "Any file type",
                 maxSize && ` \u2022 Max size: ${formatFileSize(maxSize)}`
               ] })
@@ -4994,17 +5208,17 @@ var FileUpload = ({
         ]
       }
     ),
-    helperText && /* @__PURE__ */ (0, import_jsx_runtime107.jsx)("p", { className: "mt-2 text-sm text-[hsl(var(--muted-foreground))]", children: helperText }),
-    files.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime107.jsx)("div", { className: "mt-4 space-y-2", children: files.map((file, index) => /* @__PURE__ */ (0, import_jsx_runtime107.jsxs)(
+    helperText && /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("p", { className: "mt-2 text-sm text-[hsl(var(--muted-foreground))]", children: helperText }),
+    files.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("div", { className: "mt-4 space-y-2", children: files.map((file, index) => /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)(
       "div",
       {
         className: "flex items-center justify-between p-3 bg-[hsl(var(--muted))] rounded-lg border border-[hsl(var(--border))]",
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime107.jsxs)("div", { className: "flex-1 min-w-0", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime107.jsx)("p", { className: "text-sm font-medium text-[hsl(var(--foreground))] truncate", children: file.name }),
-            /* @__PURE__ */ (0, import_jsx_runtime107.jsx)("p", { className: "text-xs text-[hsl(var(--muted-foreground))]", children: formatFileSize(file.size) })
+          /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)("div", { className: "flex-1 min-w-0", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("p", { className: "text-sm font-medium text-[hsl(var(--foreground))] truncate", children: file.name }),
+            /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("p", { className: "text-xs text-[hsl(var(--muted-foreground))]", children: formatFileSize(file.size) })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(
             "button",
             {
               onClick: (e) => {
@@ -5013,7 +5227,7 @@ var FileUpload = ({
               },
               className: "ml-4 text-[hsl(var(--muted-foreground))] hover:text-[hsl(var(--destructive))] transition-colors",
               "aria-label": "Remove file",
-              children: /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(CloseIcon, { size: "sm" })
+              children: /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(CloseIcon, { size: "sm" })
             }
           )
         ]
@@ -5024,8 +5238,8 @@ var FileUpload = ({
 };
 // src/components/AudioPlayer.tsx
-var import_react26 = require("react");
-var import_jsx_runtime108 = require("react/jsx-runtime");
+var import_react27 = require("react");
+var import_jsx_runtime109 = require("react/jsx-runtime");
 var AudioPlayer = ({
   src,
   title,
@@ -5048,18 +5262,18 @@ var AudioPlayer = ({
   showChapters = true,
   onChapterChange
 }) => {
-  const audioRef = (0, import_react26.useRef)(null);
-  const [isPlaying, setIsPlaying] = (0, import_react26.useState)(false);
-  const [currentTime, setCurrentTime] = (0, import_react26.useState)(0);
-  const [duration, setDuration] = (0, import_react26.useState)(0);
-  const [volume, setVolume] = (0, import_react26.useState)(1);
-  const [isMuted, setIsMuted] = (0, import_react26.useState)(false);
-  const [isLoading, setIsLoading] = (0, import_react26.useState)(true);
-  const [currentChapter, setCurrentChapter] = (0, import_react26.useState)(null);
-  const [showChapterList, setShowChapterList] = (0, import_react26.useState)(false);
-  const [hoveredChapter, setHoveredChapter] = (0, import_react26.useState)(null);
-  const [hoverPosition, setHoverPosition] = (0, import_react26.useState)({ x: 0, y: 0 });
-  (0, import_react26.useEffect)(() => {
+  const audioRef = (0, import_react27.useRef)(null);
+  const [isPlaying, setIsPlaying] = (0, import_react27.useState)(false);
+  const [currentTime, setCurrentTime] = (0, import_react27.useState)(0);
+  const [duration, setDuration] = (0, import_react27.useState)(0);
+  const [volume, setVolume] = (0, import_react27.useState)(1);
+  const [isMuted, setIsMuted] = (0, import_react27.useState)(false);
+  const [isLoading, setIsLoading] = (0, import_react27.useState)(true);
+  const [currentChapter, setCurrentChapter] = (0, import_react27.useState)(null);
+  const [showChapterList, setShowChapterList] = (0, import_react27.useState)(false);
+  const [hoveredChapter, setHoveredChapter] = (0, import_react27.useState)(null);
+  const [hoverPosition, setHoverPosition] = (0, import_react27.useState)({ x: 0, y: 0 });
+  (0, import_react27.useEffect)(() => {
     const audio = audioRef.current;
     if (!audio) return;
     const handleLoadedMetadata = () => {
@@ -5123,7 +5337,7 @@ var AudioPlayer = ({
       audio.removeEventListener("error", handleError);
     };
   }, [onPlay, onPause, onEnded, onTimeUpdate]);
-  (0, import_react26.useEffect)(() => {
+  (0, import_react27.useEffect)(() => {
     const audio = audioRef.current;
     if (!audio) return;
     audio.load();
@@ -5210,9 +5424,9 @@ var AudioPlayer = ({
   };
   const progress = duration > 0 ? currentTime / duration * 100 : 0;
   if (variant === "mini") {
-    return /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)("div", { className: `flex items-center gap-2 p-2 bg-[hsl(var(--card))] rounded-lg border border-[hsl(var(--border))] ${className}`, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("audio", { ref: audioRef, src, preload, loop, autoPlay }),
-      /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)("div", { className: `flex items-center gap-2 p-2 bg-[hsl(var(--card))] rounded-lg border border-[hsl(var(--border))] ${className}`, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("audio", { ref: audioRef, src, preload, loop, autoPlay }),
+      /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
         Button,
         {
           iconOnly: true,
@@ -5221,16 +5435,16 @@ var AudioPlayer = ({
           onClick: togglePlayPause,
           disabled: isLoading,
           "aria-label": isPlaying ? "Pause" : "Play",
-          children: isPlaying ? /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(PauseIcon, { size: "sm" }) : /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(PlayIcon, { size: "sm" })
+          children: isPlaying ? /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(PauseIcon, { size: "sm" }) : /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(PlayIcon, { size: "sm" })
         }
       ),
-      title && /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("span", { className: "text-sm font-medium text-[hsl(var(--foreground))] truncate", children: title })
+      title && /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("span", { className: "text-sm font-medium text-[hsl(var(--foreground))] truncate", children: title })
     ] });
   }
   if (variant === "compact") {
-    return /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)("div", { className: `flex items-center gap-3 p-3 bg-[hsl(var(--card))] rounded-lg border border-[hsl(var(--border))] shadow-sm ${className}`, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("audio", { ref: audioRef, src, preload, loop, autoPlay }),
-      /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)("div", { className: `flex items-center gap-3 p-3 bg-[hsl(var(--card))] rounded-lg border border-[hsl(var(--border))] shadow-sm ${className}`, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("audio", { ref: audioRef, src, preload, loop, autoPlay }),
+      /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
         Button,
         {
           iconOnly: true,
@@ -5239,17 +5453,17 @@ var AudioPlayer = ({
           onClick: togglePlayPause,
           disabled: isLoading,
           "aria-label": isPlaying ? "Pause" : "Play",
-          children: isPlaying ? /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(PauseIcon, { size: "md" }) : /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(PlayIcon, { size: "md" })
+          children: isPlaying ? /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(PauseIcon, { size: "md" }) : /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(PlayIcon, { size: "md" })
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)("div", { className: "flex-1 min-w-0", children: [
-        title && /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("div", { className: "text-sm font-medium text-[hsl(var(--foreground))] truncate", children: title }),
-        artist && /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("div", { className: "text-xs text-[hsl(var(--muted-foreground))] truncate", children: artist })
+      /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)("div", { className: "flex-1 min-w-0", children: [
+        title && /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("div", { className: "text-sm font-medium text-[hsl(var(--foreground))] truncate", children: title }),
+        artist && /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("div", { className: "text-xs text-[hsl(var(--muted-foreground))] truncate", children: artist })
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)("div", { className: "flex items-center gap-2 flex-1", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("span", { className: "text-xs text-[hsl(var(--muted-foreground))] tabular-nums", children: formatTime(currentTime) }),
-        /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)("div", { className: "relative flex-1 h-1.5 bg-[hsl(var(--muted))] rounded-full overflow-visible", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)("div", { className: "flex items-center gap-2 flex-1", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("span", { className: "text-xs text-[hsl(var(--muted-foreground))] tabular-nums", children: formatTime(currentTime) }),
+        /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)("div", { className: "relative flex-1 h-1.5 bg-[hsl(var(--muted))] rounded-full overflow-visible", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
             "div",
             {
               className: "absolute h-full bg-[hsl(var(--primary))] rounded-full transition-all",
@@ -5258,7 +5472,7 @@ var AudioPlayer = ({
           ),
           showChapters && chapters.length > 0 && chapters.map((chapter, index) => {
             const markerPosition = duration > 0 ? chapter.startTime / duration * 100 : 0;
-            return /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(
+            return /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
               "div",
               {
                 className: "absolute top-0 bottom-0 w-1 -ml-0.5 bg-[hsl(var(--background))] opacity-70 hover:opacity-100 hover:w-1.5 hover:-ml-0.5 cursor-pointer z-10 transition-all",
@@ -5274,7 +5488,7 @@ var AudioPlayer = ({
               index
             );
           }),
-          /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
             "input",
             {
               type: "range",
@@ -5288,23 +5502,23 @@ var AudioPlayer = ({
             }
           )
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("span", { className: "text-xs text-[hsl(var(--muted-foreground))] tabular-nums", children: formatTime(duration) }),
-        currentChapter && showChapters && /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)("span", { className: "text-xs text-[hsl(var(--primary))] font-medium truncate max-w-[120px]", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("span", { className: "text-xs text-[hsl(var(--muted-foreground))] tabular-nums", children: formatTime(duration) }),
+        currentChapter && showChapters && /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)("span", { className: "text-xs text-[hsl(var(--primary))] font-medium truncate max-w-[120px]", children: [
           "\u2022 ",
           currentChapter.title
         ] })
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)("div", { className: "flex items-center gap-2", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
           "button",
           {
             onClick: toggleMute,
             className: "text-[hsl(var(--muted-foreground))] hover:text-[hsl(var(--foreground))]",
             "aria-label": isMuted ? "Unmute" : "Mute",
-            children: isMuted ? /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(VolumeOffIcon, { size: "sm" }) : /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(VolumeUpIcon, { size: "sm" })
+            children: isMuted ? /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(VolumeOffIcon, { size: "sm" }) : /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(VolumeUpIcon, { size: "sm" })
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
           "input",
           {
             type: "range",
@@ -5318,24 +5532,24 @@ var AudioPlayer = ({
           }
         )
       ] }),
-      hoveredChapter && showChapters && /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)(
+      hoveredChapter && showChapters && /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)(
         "div",
         {
           className: "fixed z-50 px-3 py-2 bg-[hsl(var(--popover))] text-white text-xs font-medium rounded shadow-lg pointer-events-none transform -translate-x-1/2 -translate-y-full",
           style: { left: hoverPosition.x, top: hoverPosition.y - 8 },
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("div", { className: "whitespace-nowrap", children: hoveredChapter.title }),
-            /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("div", { className: "text-[hsl(var(--muted-foreground))] text-[10px] mt-0.5", children: formatTime(hoveredChapter.startTime) }),
-            /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("div", { className: "absolute left-1/2 -bottom-1 w-2 h-2 bg-[hsl(var(--popover))] transform -translate-x-1/2 rotate-45" })
+            /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("div", { className: "whitespace-nowrap", children: hoveredChapter.title }),
+            /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("div", { className: "text-[hsl(var(--muted-foreground))] text-[10px] mt-0.5", children: formatTime(hoveredChapter.startTime) }),
+            /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("div", { className: "absolute left-1/2 -bottom-1 w-2 h-2 bg-[hsl(var(--popover))] transform -translate-x-1/2 rotate-45" })
           ]
         }
       )
     ] });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)("div", { className: `bg-[hsl(var(--card))] rounded-lg border border-[hsl(var(--border))] shadow-md overflow-hidden ${className}`, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("audio", { ref: audioRef, src, preload, loop, autoPlay }),
-    /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)("div", { className: "flex items-center gap-4 p-4 border-b border-[hsl(var(--border))]", children: [
-      coverArt && /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("div", { className: "w-16 h-16 flex-shrink-0 rounded-md overflow-hidden bg-[hsl(var(--muted))]", children: /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)("div", { className: `bg-[hsl(var(--card))] rounded-lg border border-[hsl(var(--border))] shadow-md overflow-hidden ${className}`, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("audio", { ref: audioRef, src, preload, loop, autoPlay }),
+    /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)("div", { className: "flex items-center gap-4 p-4 border-b border-[hsl(var(--border))]", children: [
+      coverArt && /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("div", { className: "w-16 h-16 flex-shrink-0 rounded-md overflow-hidden bg-[hsl(var(--muted))]", children: /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
         "img",
         {
           src: coverArt,
@@ -5343,15 +5557,15 @@ var AudioPlayer = ({
           className: "w-full h-full object-cover"
         }
       ) }),
-      /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)("div", { className: "flex-1 min-w-0", children: [
-        title && /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("h3", { className: "text-base font-semibold text-[hsl(var(--foreground))] truncate", children: title }),
-        artist && /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("p", { className: "text-sm text-[hsl(var(--muted-foreground))] truncate", children: artist }),
-        album && /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("p", { className: "text-xs text-[hsl(var(--muted-foreground))] truncate", children: album })
+      /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)("div", { className: "flex-1 min-w-0", children: [
+        title && /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("h3", { className: "text-base font-semibold text-[hsl(var(--foreground))] truncate", children: title }),
+        artist && /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("p", { className: "text-sm text-[hsl(var(--muted-foreground))] truncate", children: artist }),
+        album && /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("p", { className: "text-xs text-[hsl(var(--muted-foreground))] truncate", children: album })
       ] })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)("div", { className: "px-4 pt-4", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)("div", { className: "relative h-2 bg-[hsl(var(--muted))] rounded-full overflow-visible", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)("div", { className: "px-4 pt-4", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)("div", { className: "relative h-2 bg-[hsl(var(--muted))] rounded-full overflow-visible", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
           "div",
           {
             className: "absolute h-full bg-[hsl(var(--primary))] rounded-full transition-all",
@@ -5360,7 +5574,7 @@ var AudioPlayer = ({
         ),
         showChapters && chapters.length > 0 && chapters.map((chapter, index) => {
           const markerPosition = duration > 0 ? chapter.startTime / duration * 100 : 0;
-          return /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(
+          return /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
             "div",
             {
               className: "absolute top-0 bottom-0 w-1 -ml-0.5 bg-[hsl(var(--background))] opacity-70 hover:opacity-100 hover:w-1.5 hover:-ml-0.5 cursor-pointer z-10 transition-all",
@@ -5376,19 +5590,19 @@ var AudioPlayer = ({
             index
           );
         }),
-        hoveredChapter && showChapters && /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)(
+        hoveredChapter && showChapters && /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)(
           "div",
           {
             className: "fixed z-50 px-3 py-2 bg-[hsl(var(--popover))] text-white text-xs font-medium rounded shadow-lg pointer-events-none transform -translate-x-1/2 -translate-y-full",
             style: { left: hoverPosition.x, top: hoverPosition.y - 8 },
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("div", { className: "whitespace-nowrap", children: hoveredChapter.title }),
-              /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("div", { className: "text-[hsl(var(--muted-foreground))] text-[10px] mt-0.5", children: formatTime(hoveredChapter.startTime) }),
-              /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("div", { className: "absolute left-1/2 -bottom-1 w-2 h-2 bg-[hsl(var(--popover))] transform -translate-x-1/2 rotate-45" })
+              /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("div", { className: "whitespace-nowrap", children: hoveredChapter.title }),
+              /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("div", { className: "text-[hsl(var(--muted-foreground))] text-[10px] mt-0.5", children: formatTime(hoveredChapter.startTime) }),
+              /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("div", { className: "absolute left-1/2 -bottom-1 w-2 h-2 bg-[hsl(var(--popover))] transform -translate-x-1/2 rotate-45" })
             ]
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
           "input",
           {
             type: "range",
@@ -5402,24 +5616,24 @@ var AudioPlayer = ({
           }
         )
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)("div", { className: "flex justify-between items-center mt-1 text-xs text-[hsl(var(--muted-foreground))] tabular-nums", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("span", { children: formatTime(currentTime) }),
-        currentChapter && showChapters && /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("span", { className: "text-[hsl(var(--primary))] font-medium truncate max-w-[200px]", children: currentChapter.title }),
-        /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("span", { children: formatTime(duration) })
+      /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)("div", { className: "flex justify-between items-center mt-1 text-xs text-[hsl(var(--muted-foreground))] tabular-nums", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("span", { children: formatTime(currentTime) }),
+        currentChapter && showChapters && /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("span", { className: "text-[hsl(var(--primary))] font-medium truncate max-w-[200px]", children: currentChapter.title }),
+        /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("span", { children: formatTime(duration) })
       ] })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)("div", { className: "flex items-center justify-between px-4 py-4", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)("div", { className: "flex items-center gap-2 flex-1", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)("div", { className: "flex items-center justify-between px-4 py-4", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)("div", { className: "flex items-center gap-2 flex-1", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
           "button",
           {
             onClick: toggleMute,
             className: "text-[hsl(var(--muted-foreground))] hover:text-[hsl(var(--foreground))] transition-colors",
             "aria-label": isMuted ? "Unmute" : "Mute",
-            children: isMuted ? /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(VolumeOffIcon, { size: "md" }) : /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(VolumeUpIcon, { size: "md" })
+            children: isMuted ? /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(VolumeOffIcon, { size: "md" }) : /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(VolumeUpIcon, { size: "md" })
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
           "input",
           {
             type: "range",
@@ -5433,8 +5647,8 @@ var AudioPlayer = ({
           }
         )
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)("div", { className: "flex items-center gap-2", children: [
-        showSkipButtons && /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)("div", { className: "flex items-center gap-2", children: [
+        showSkipButtons && /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
           Button,
           {
             iconOnly: true,
@@ -5443,10 +5657,10 @@ var AudioPlayer = ({
             onClick: handleSkipBack,
             disabled: isLoading,
             "aria-label": "Skip back 10 seconds",
-            children: /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(SkipBackIcon, { size: "md" })
+            children: /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(SkipBackIcon, { size: "md" })
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
           Button,
           {
             iconOnly: true,
@@ -5455,10 +5669,10 @@ var AudioPlayer = ({
             onClick: togglePlayPause,
             disabled: isLoading,
             "aria-label": isPlaying ? "Pause" : "Play",
-            children: isPlaying ? /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(PauseIcon, { size: "lg" }) : /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(PlayIcon, { size: "lg" })
+            children: isPlaying ? /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(PauseIcon, { size: "lg" }) : /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(PlayIcon, { size: "lg" })
           }
         ),
-        showSkipButtons && /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(
+        showSkipButtons && /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
           Button,
           {
             iconOnly: true,
@@ -5467,11 +5681,11 @@ var AudioPlayer = ({
             onClick: handleSkipForward,
             disabled: isLoading,
             "aria-label": "Skip forward 10 seconds",
-            children: /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(SkipForwardIcon, { size: "md" })
+            children: /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(SkipForwardIcon, { size: "md" })
           }
         )
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("div", { className: "flex-1 flex justify-end", children: showChapters && chapters.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)(
+      /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("div", { className: "flex-1 flex justify-end", children: showChapters && chapters.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)(
         "button",
         {
           onClick: () => setShowChapterList(!showChapterList),
@@ -5485,16 +5699,16 @@ var AudioPlayer = ({
         }
       ) })
     ] }),
-    showChapters && showChapterList && chapters.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("div", { className: "border-t border-[hsl(var(--border))] bg-[hsl(var(--muted))]/50 max-h-48 overflow-y-auto", children: chapters.map((chapter, index) => {
+    showChapters && showChapterList && chapters.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("div", { className: "border-t border-[hsl(var(--border))] bg-[hsl(var(--muted))]/50 max-h-48 overflow-y-auto", children: chapters.map((chapter, index) => {
       const isCurrentChapter = currentChapter?.startTime === chapter.startTime;
-      return /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(
+      return /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
         "button",
         {
           onClick: () => jumpToChapter(chapter),
           className: `w-full text-left px-4 py-2 hover:bg-[hsl(var(--accent))] transition-colors ${isCurrentChapter ? "bg-[hsl(var(--primary))]/10 border-l-2 border-[hsl(var(--primary))]" : ""}`,
-          children: /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)("div", { className: "flex items-center justify-between gap-2", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("span", { className: `text-sm font-medium ${isCurrentChapter ? "text-[hsl(var(--primary))]" : "text-[hsl(var(--foreground))]"}`, children: chapter.title }),
-            /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("span", { className: "text-xs text-[hsl(var(--muted-foreground))] tabular-nums", children: formatTime(chapter.startTime) })
+          children: /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)("div", { className: "flex items-center justify-between gap-2", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("span", { className: `text-sm font-medium ${isCurrentChapter ? "text-[hsl(var(--primary))]" : "text-[hsl(var(--foreground))]"}`, children: chapter.title }),
+            /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("span", { className: "text-xs text-[hsl(var(--muted-foreground))] tabular-nums", children: formatTime(chapter.startTime) })
           ] })
         },
         index
@@ -5504,8 +5718,8 @@ var AudioPlayer = ({
 };
 // src/components/VideoPlayer.tsx
-var import_react27 = require("react");
-var import_jsx_runtime109 = require("react/jsx-runtime");
+var import_react28 = require("react");
+var import_jsx_runtime110 = require("react/jsx-runtime");
 var VideoPlayer = ({
   src,
   poster,
@@ -5529,21 +5743,21 @@ var VideoPlayer = ({
   showChapters = true,
   onChapterChange
 }) => {
-  const videoRef = (0, import_react27.useRef)(null);
-  const containerRef = (0, import_react27.useRef)(null);
-  const [isPlaying, setIsPlaying] = (0, import_react27.useState)(false);
-  const [currentTime, setCurrentTime] = (0, import_react27.useState)(0);
-  const [duration, setDuration] = (0, import_react27.useState)(0);
-  const [volume, setVolume] = (0, import_react27.useState)(muted ? 0 : 1);
-  const [isMuted, setIsMuted] = (0, import_react27.useState)(muted);
-  const [isLoading, setIsLoading] = (0, import_react27.useState)(true);
-  const [isFullscreen, setIsFullscreen] = (0, import_react27.useState)(false);
-  const [showControlsOverlay, setShowControlsOverlay] = (0, import_react27.useState)(true);
-  const hideControlsTimeout = (0, import_react27.useRef)(null);
-  const [currentChapter, setCurrentChapter] = (0, import_react27.useState)(null);
-  const [hoveredChapter, setHoveredChapter] = (0, import_react27.useState)(null);
-  const [hoverPosition, setHoverPosition] = (0, import_react27.useState)({ x: 0, y: 0 });
-  (0, import_react27.useEffect)(() => {
+  const videoRef = (0, import_react28.useRef)(null);
+  const containerRef = (0, import_react28.useRef)(null);
+  const [isPlaying, setIsPlaying] = (0, import_react28.useState)(false);
+  const [currentTime, setCurrentTime] = (0, import_react28.useState)(0);
+  const [duration, setDuration] = (0, import_react28.useState)(0);
+  const [volume, setVolume] = (0, import_react28.useState)(muted ? 0 : 1);
+  const [isMuted, setIsMuted] = (0, import_react28.useState)(muted);
+  const [isLoading, setIsLoading] = (0, import_react28.useState)(true);
+  const [isFullscreen, setIsFullscreen] = (0, import_react28.useState)(false);
+  const [showControlsOverlay, setShowControlsOverlay] = (0, import_react28.useState)(true);
+  const hideControlsTimeout = (0, import_react28.useRef)(null);
+  const [currentChapter, setCurrentChapter] = (0, import_react28.useState)(null);
+  const [hoveredChapter, setHoveredChapter] = (0, import_react28.useState)(null);
+  const [hoverPosition, setHoverPosition] = (0, import_react28.useState)({ x: 0, y: 0 });
+  (0, import_react28.useEffect)(() => {
     const video = videoRef.current;
     if (!video) return;
     const handleLoadedMetadata = () => {
@@ -5612,12 +5826,12 @@ var VideoPlayer = ({
       document.removeEventListener("fullscreenchange", handleFullscreenChange);
     };
   }, [onPlay, onPause, onEnded, onTimeUpdate]);
-  (0, import_react27.useEffect)(() => {
+  (0, import_react28.useEffect)(() => {
     const video = videoRef.current;
     if (!video) return;
     video.load();
   }, [src]);
-  (0, import_react27.useEffect)(() => {
+  (0, import_react28.useEffect)(() => {
     if (!isPlaying) {
       setShowControlsOverlay(true);
       return;
@@ -5733,7 +5947,7 @@ var VideoPlayer = ({
     }
   };
   if (variant === "compact") {
-    return /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime110.jsxs)(
       "div",
       {
         ref: containerRef,
@@ -5741,7 +5955,7 @@ var VideoPlayer = ({
         style: { width, height },
         onMouseMove: handleMouseMove,
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(
             "video",
             {
               ref: videoRef,
@@ -5755,8 +5969,8 @@ var VideoPlayer = ({
               onClick: togglePlayPause
             }
           ),
-          showControls && /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)("div", { className: `absolute inset-0 bg-gradient-to-t from-black/70 via-transparent to-transparent transition-opacity duration-300 ${showControlsOverlay || !isPlaying ? "opacity-100" : "opacity-0 pointer-events-none"}`, children: [
-            /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("div", { className: "absolute inset-0 flex items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
+          showControls && /* @__PURE__ */ (0, import_jsx_runtime110.jsxs)("div", { className: `absolute inset-0 bg-gradient-to-t from-black/70 via-transparent to-transparent transition-opacity duration-300 ${showControlsOverlay || !isPlaying ? "opacity-100" : "opacity-0 pointer-events-none"}`, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime110.jsx)("div", { className: "absolute inset-0 flex items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(
               "button",
               {
                 onClick: togglePlayPause,
@@ -5764,12 +5978,12 @@ var VideoPlayer = ({
                 className: "flex items-center justify-center w-16 h-16 rounded-full bg-white/20 hover:bg-white/30 backdrop-blur-sm text-white transition-all disabled:opacity-50 disabled:cursor-not-allowed",
                 style: { width: 64, height: 64, borderRadius: "50%" },
                 "aria-label": isPlaying ? "Pause" : "Play",
-                children: isPlaying ? /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(PauseIcon, { size: "xl" }) : /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(PlayIcon, { size: "xl" })
+                children: isPlaying ? /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(PauseIcon, { size: "xl" }) : /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(PlayIcon, { size: "xl" })
               }
             ) }),
-            /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)("div", { className: "absolute bottom-0 left-0 right-0 p-3 space-y-2", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)("div", { className: "relative h-1 bg-white/30 rounded-full overflow-visible", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime110.jsxs)("div", { className: "absolute bottom-0 left-0 right-0 p-3 space-y-2", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime110.jsxs)("div", { className: "relative h-1 bg-white/30 rounded-full overflow-visible", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(
                   "div",
                   {
                     className: "absolute h-full bg-[hsl(var(--primary))] rounded-full transition-all",
@@ -5778,7 +5992,7 @@ var VideoPlayer = ({
                 ),
                 showChapters && chapters.length > 0 && chapters.map((chapter, index) => {
                   const markerPosition = duration > 0 ? chapter.startTime / duration * 100 : 0;
-                  return /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
+                  return /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(
                     "div",
                     {
                       className: "absolute top-0 bottom-0 w-1 -ml-0.5 bg-white opacity-70 hover:opacity-100 hover:w-1.5 hover:-ml-0.5 cursor-pointer z-10 transition-all",
@@ -5794,7 +6008,7 @@ var VideoPlayer = ({
                     index
                   );
                 }),
-                /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
+                /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(
                   "input",
                   {
                     type: "range",
@@ -5808,50 +6022,50 @@ var VideoPlayer = ({
                   }
                 )
               ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)("div", { className: "flex items-center justify-between gap-2", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)("div", { className: "flex items-center gap-2", children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)("span", { className: "text-xs text-white tabular-nums", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime110.jsxs)("div", { className: "flex items-center justify-between gap-2", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime110.jsxs)("div", { className: "flex items-center gap-2", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime110.jsxs)("span", { className: "text-xs text-white tabular-nums", children: [
                     formatTime(currentTime),
                     " / ",
                     formatTime(duration)
                   ] }),
-                  currentChapter && showChapters && /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)("span", { className: "text-xs text-white/90 font-medium truncate max-w-[150px]", children: [
+                  currentChapter && showChapters && /* @__PURE__ */ (0, import_jsx_runtime110.jsxs)("span", { className: "text-xs text-white/90 font-medium truncate max-w-[150px]", children: [
                     "\u2022 ",
                     currentChapter.title
                   ] })
                 ] }),
-                /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)("div", { className: "flex items-center gap-2", children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
+                /* @__PURE__ */ (0, import_jsx_runtime110.jsxs)("div", { className: "flex items-center gap-2", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(
                     "button",
                     {
                       onClick: toggleMute,
                       className: "text-white/80 hover:text-white transition-colors",
                       "aria-label": isMuted ? "Unmute" : "Mute",
-                      children: isMuted ? /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(VolumeOffIcon, { size: "sm" }) : /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(VolumeUpIcon, { size: "sm" })
+                      children: isMuted ? /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(VolumeOffIcon, { size: "sm" }) : /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(VolumeUpIcon, { size: "sm" })
                     }
                   ),
-                  /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
+                  /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(
                     "button",
                     {
                       onClick: toggleFullscreen,
                       className: "text-white/80 hover:text-white transition-colors",
                       "aria-label": isFullscreen ? "Exit fullscreen" : "Enter fullscreen",
-                      children: isFullscreen ? /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(FullscreenExitIcon, { size: "sm" }) : /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(FullscreenIcon, { size: "sm" })
+                      children: isFullscreen ? /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(FullscreenExitIcon, { size: "sm" }) : /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(FullscreenIcon, { size: "sm" })
                     }
                   )
                 ] })
               ] })
             ] })
           ] }),
-          hoveredChapter && showChapters && /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)(
+          hoveredChapter && showChapters && /* @__PURE__ */ (0, import_jsx_runtime110.jsxs)(
             "div",
             {
               className: "fixed z-50 px-3 py-2 bg-[hsl(var(--popover))] text-white text-xs font-medium rounded shadow-lg pointer-events-none transform -translate-x-1/2 -translate-y-full",
               style: { left: hoverPosition.x, top: hoverPosition.y - 8 },
               children: [
-                /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("div", { className: "whitespace-nowrap", children: hoveredChapter.title }),
-                /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("div", { className: "text-[hsl(var(--muted-foreground))] text-[10px] mt-0.5", children: formatTime(hoveredChapter.startTime) }),
-                /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("div", { className: "absolute left-1/2 -bottom-1 w-2 h-2 bg-[hsl(var(--popover))] transform -translate-x-1/2 rotate-45" })
+                /* @__PURE__ */ (0, import_jsx_runtime110.jsx)("div", { className: "whitespace-nowrap", children: hoveredChapter.title }),
+                /* @__PURE__ */ (0, import_jsx_runtime110.jsx)("div", { className: "text-[hsl(var(--muted-foreground))] text-[10px] mt-0.5", children: formatTime(hoveredChapter.startTime) }),
+                /* @__PURE__ */ (0, import_jsx_runtime110.jsx)("div", { className: "absolute left-1/2 -bottom-1 w-2 h-2 bg-[hsl(var(--popover))] transform -translate-x-1/2 rotate-45" })
               ]
             }
           )
@@ -5859,9 +6073,9 @@ var VideoPlayer = ({
       }
     );
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)("div", { className: `bg-[hsl(var(--card))] rounded-lg border border-[hsl(var(--border))] shadow-md overflow-hidden ${className}`, children: [
-    title && /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("div", { className: "px-4 py-3 border-b border-[hsl(var(--border))]", children: /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("h3", { className: "text-base font-semibold text-[hsl(var(--foreground))] truncate", children: title }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime110.jsxs)("div", { className: `bg-[hsl(var(--card))] rounded-lg border border-[hsl(var(--border))] shadow-md overflow-hidden ${className}`, children: [
+    title && /* @__PURE__ */ (0, import_jsx_runtime110.jsx)("div", { className: "px-4 py-3 border-b border-[hsl(var(--border))]", children: /* @__PURE__ */ (0, import_jsx_runtime110.jsx)("h3", { className: "text-base font-semibold text-[hsl(var(--foreground))] truncate", children: title }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime110.jsxs)(
       "div",
       {
         ref: containerRef,
@@ -5869,7 +6083,7 @@ var VideoPlayer = ({
         style: { width, height },
         onMouseMove: handleMouseMove,
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(
             "video",
             {
               ref: videoRef,
@@ -5884,8 +6098,8 @@ var VideoPlayer = ({
               onClick: togglePlayPause
             }
           ),
-          showControls && !controls && /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)("div", { className: `absolute inset-0 bg-gradient-to-t from-black/70 via-transparent to-transparent transition-opacity duration-300 ${showControlsOverlay || !isPlaying ? "opacity-100" : "opacity-0 pointer-events-none"}`, children: [
-            /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("div", { className: "absolute inset-0 flex items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
+          showControls && !controls && /* @__PURE__ */ (0, import_jsx_runtime110.jsxs)("div", { className: `absolute inset-0 bg-gradient-to-t from-black/70 via-transparent to-transparent transition-opacity duration-300 ${showControlsOverlay || !isPlaying ? "opacity-100" : "opacity-0 pointer-events-none"}`, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime110.jsx)("div", { className: "absolute inset-0 flex items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(
               "button",
               {
                 onClick: togglePlayPause,
@@ -5893,12 +6107,12 @@ var VideoPlayer = ({
                 className: "flex items-center justify-center w-20 h-20 rounded-full bg-white/20 hover:bg-white/30 backdrop-blur-sm text-white transition-all disabled:opacity-50 disabled:cursor-not-allowed",
                 style: { width: 80, height: 80, borderRadius: "50%" },
                 "aria-label": isPlaying ? "Pause" : "Play",
-                children: isPlaying ? /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(PauseIcon, { size: "xl" }) : /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(PlayIcon, { size: "xl" })
+                children: isPlaying ? /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(PauseIcon, { size: "xl" }) : /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(PlayIcon, { size: "xl" })
               }
             ) }),
-            /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)("div", { className: "absolute bottom-0 left-0 right-0 p-4 space-y-3", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)("div", { className: "relative h-1.5 bg-white/30 rounded-full overflow-visible", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime110.jsxs)("div", { className: "absolute bottom-0 left-0 right-0 p-4 space-y-3", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime110.jsxs)("div", { className: "relative h-1.5 bg-white/30 rounded-full overflow-visible", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(
                   "div",
                   {
                     className: "absolute h-full bg-[hsl(var(--primary))] rounded-full transition-all",
@@ -5907,7 +6121,7 @@ var VideoPlayer = ({
                 ),
                 showChapters && chapters.length > 0 && chapters.map((chapter, index) => {
                   const markerPosition = duration > 0 ? chapter.startTime / duration * 100 : 0;
-                  return /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
+                  return /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(
                     "div",
                     {
                       className: "absolute top-0 bottom-0 w-1 -ml-0.5 bg-white opacity-70 hover:opacity-100 hover:w-1.5 hover:-ml-0.5 cursor-pointer z-10 transition-all",
@@ -5923,7 +6137,7 @@ var VideoPlayer = ({
                     index
                   );
                 }),
-                /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
+                /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(
                   "input",
                   {
                     type: "range",
@@ -5937,42 +6151,42 @@ var VideoPlayer = ({
                   }
                 )
               ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)("div", { className: "flex items-center justify-between gap-4", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)("div", { className: "flex items-center gap-3", children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime110.jsxs)("div", { className: "flex items-center justify-between gap-4", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime110.jsxs)("div", { className: "flex items-center gap-3", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(
                     "button",
                     {
                       onClick: togglePlayPause,
                       disabled: isLoading,
                       className: "flex items-center justify-center w-10 h-10 rounded-lg bg-white/20 hover:bg-white/30 backdrop-blur-sm text-white transition-all disabled:opacity-50 disabled:cursor-not-allowed",
                       "aria-label": isPlaying ? "Pause" : "Play",
-                      children: isPlaying ? /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(PauseIcon, { size: "md" }) : /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(PlayIcon, { size: "md" })
+                      children: isPlaying ? /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(PauseIcon, { size: "md" }) : /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(PlayIcon, { size: "md" })
                     }
                   ),
-                  /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)("div", { className: "flex items-center gap-2", children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)("span", { className: "text-sm text-white tabular-nums", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime110.jsxs)("div", { className: "flex items-center gap-2", children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime110.jsxs)("span", { className: "text-sm text-white tabular-nums", children: [
                       formatTime(currentTime),
                       " / ",
                       formatTime(duration)
                     ] }),
-                    currentChapter && showChapters && /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)("span", { className: "text-sm text-white/90 font-medium truncate max-w-[200px]", children: [
+                    currentChapter && showChapters && /* @__PURE__ */ (0, import_jsx_runtime110.jsxs)("span", { className: "text-sm text-white/90 font-medium truncate max-w-[200px]", children: [
                       "\u2022 ",
                       currentChapter.title
                     ] })
                   ] })
                 ] }),
-                /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)("div", { className: "flex items-center gap-3", children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)("div", { className: "flex items-center gap-2", children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
+                /* @__PURE__ */ (0, import_jsx_runtime110.jsxs)("div", { className: "flex items-center gap-3", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime110.jsxs)("div", { className: "flex items-center gap-2", children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(
                       "button",
                       {
                         onClick: toggleMute,
                         className: "text-white/80 hover:text-white transition-colors",
                         "aria-label": isMuted ? "Unmute" : "Mute",
-                        children: isMuted ? /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(VolumeOffIcon, { size: "md" }) : /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(VolumeUpIcon, { size: "md" })
+                        children: isMuted ? /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(VolumeOffIcon, { size: "md" }) : /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(VolumeUpIcon, { size: "md" })
                       }
                     ),
-                    /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
+                    /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(
                       "input",
                       {
                         type: "range",
@@ -5986,28 +6200,28 @@ var VideoPlayer = ({
                       }
                     )
                   ] }),
-                  /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
+                  /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(
                     "button",
                     {
                       onClick: toggleFullscreen,
                       className: "text-white/80 hover:text-white transition-colors",
                       "aria-label": isFullscreen ? "Exit fullscreen" : "Enter fullscreen",
-                      children: isFullscreen ? /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(FullscreenExitIcon, { size: "md" }) : /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(FullscreenIcon, { size: "md" })
+                      children: isFullscreen ? /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(FullscreenExitIcon, { size: "md" }) : /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(FullscreenIcon, { size: "md" })
                     }
                   )
                 ] })
               ] })
             ] })
           ] }),
-          hoveredChapter && showChapters && /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)(
+          hoveredChapter && showChapters && /* @__PURE__ */ (0, import_jsx_runtime110.jsxs)(
             "div",
             {
               className: "fixed z-50 px-3 py-2 bg-[hsl(var(--popover))] text-white text-xs font-medium rounded shadow-lg pointer-events-none transform -translate-x-1/2 -translate-y-full",
               style: { left: hoverPosition.x, top: hoverPosition.y - 8 },
               children: [
-                /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("div", { className: "whitespace-nowrap", children: hoveredChapter.title }),
-                /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("div", { className: "text-[hsl(var(--muted-foreground))] text-[10px] mt-0.5", children: formatTime(hoveredChapter.startTime) }),
-                /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("div", { className: "absolute left-1/2 -bottom-1 w-2 h-2 bg-[hsl(var(--popover))] transform -translate-x-1/2 rotate-45" })
+                /* @__PURE__ */ (0, import_jsx_runtime110.jsx)("div", { className: "whitespace-nowrap", children: hoveredChapter.title }),
+                /* @__PURE__ */ (0, import_jsx_runtime110.jsx)("div", { className: "text-[hsl(var(--muted-foreground))] text-[10px] mt-0.5", children: formatTime(hoveredChapter.startTime) }),
+                /* @__PURE__ */ (0, import_jsx_runtime110.jsx)("div", { className: "absolute left-1/2 -bottom-1 w-2 h-2 bg-[hsl(var(--popover))] transform -translate-x-1/2 rotate-45" })
               ]
             }
           )
@@ -6018,7 +6232,7 @@ var VideoPlayer = ({
 };
 // src/charts/LineChart.tsx
-var import_react31 = __toESM(require("react"));
+var import_react32 = __toESM(require("react"));
 // src/charts/constants.ts
 var CHART_DEFAULTS = {
@@ -6085,7 +6299,7 @@ var CHART_DEFAULTS = {
 };
 // src/charts/hooks/useResponsiveChart.ts
-var import_react28 = require("react");
+var import_react29 = require("react");
 var BREAKPOINTS = {
   mobile: 640,
   // < 640px
@@ -6104,8 +6318,8 @@ var DEFAULT_ASPECT_RATIOS = {
   desktop: 2
 };
 function useBreakpoint() {
-  const [breakpoint, setBreakpoint] = (0, import_react28.useState)("desktop");
-  (0, import_react28.useEffect)(() => {
+  const [breakpoint, setBreakpoint] = (0, import_react29.useState)("desktop");
+  (0, import_react29.useEffect)(() => {
     const update = () => {
       const width = window.innerWidth;
       if (width < BREAKPOINTS.mobile) {
@@ -6402,8 +6616,8 @@ function createTickFormatter(domain) {
 }
 // src/charts/components/ChartTooltip.tsx
-var import_react29 = __toESM(require("react"));
-var import_jsx_runtime110 = require("react/jsx-runtime");
+var import_react30 = __toESM(require("react"));
+var import_jsx_runtime111 = require("react/jsx-runtime");
 var DefaultTooltipContent = ({
   active,
   label,
@@ -6415,22 +6629,22 @@ var DefaultTooltipContent = ({
     return null;
   }
   const formattedLabel = labelFormatter ? labelFormatter(label ?? "") : String(label ?? "");
-  return /* @__PURE__ */ (0, import_jsx_runtime110.jsxs)("div", { className: "bg-[hsl(var(--popover))] text-white rounded-lg shadow-xl border border-[hsl(var(--border))] overflow-hidden min-w-[120px]", children: [
-    formattedLabel && /* @__PURE__ */ (0, import_jsx_runtime110.jsx)("div", { className: "px-3 py-2 bg-[hsl(var(--popover))] border-b border-[hsl(var(--border))]", children: /* @__PURE__ */ (0, import_jsx_runtime110.jsx)("span", { className: "text-sm font-medium text-[hsl(var(--muted-foreground))]", children: formattedLabel }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime110.jsx)("div", { className: "px-3 py-2 space-y-1", children: payload.map((item, index) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime111.jsxs)("div", { className: "bg-[hsl(var(--popover))] text-white rounded-lg shadow-xl border border-[hsl(var(--border))] overflow-hidden min-w-[120px]", children: [
+    formattedLabel && /* @__PURE__ */ (0, import_jsx_runtime111.jsx)("div", { className: "px-3 py-2 bg-[hsl(var(--popover))] border-b border-[hsl(var(--border))]", children: /* @__PURE__ */ (0, import_jsx_runtime111.jsx)("span", { className: "text-sm font-medium text-[hsl(var(--muted-foreground))]", children: formattedLabel }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime111.jsx)("div", { className: "px-3 py-2 space-y-1", children: payload.map((item, index) => {
       const formattedValue = formatter ? formatter(item.value, item.name, item) : String(item.value);
-      return /* @__PURE__ */ (0, import_jsx_runtime110.jsxs)("div", { className: "flex items-center justify-between gap-4", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime110.jsxs)("div", { className: "flex items-center gap-2", children: [
-          item.color && /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(
+      return /* @__PURE__ */ (0, import_jsx_runtime111.jsxs)("div", { className: "flex items-center justify-between gap-4", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime111.jsxs)("div", { className: "flex items-center gap-2", children: [
+          item.color && /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(
             "span",
             {
               className: "w-2.5 h-2.5 rounded-full flex-shrink-0",
               style: { backgroundColor: item.color }
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime110.jsx)("span", { className: "text-xs text-[hsl(var(--muted-foreground))]", children: item.name })
+          /* @__PURE__ */ (0, import_jsx_runtime111.jsx)("span", { className: "text-xs text-[hsl(var(--muted-foreground))]", children: item.name })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime110.jsx)("span", { className: "text-sm font-semibold text-white", children: formattedValue })
+        /* @__PURE__ */ (0, import_jsx_runtime111.jsx)("span", { className: "text-sm font-semibold text-white", children: formattedValue })
       ] }, `${item.name}-${index}`);
     }) })
   ] });
@@ -6449,10 +6663,10 @@ var ChartTooltip = ({
   containerBounds,
   animationDuration = 150
 }) => {
-  const tooltipRef = (0, import_react29.useRef)(null);
-  const [position, setPosition] = (0, import_react29.useState)({ x: 0, y: 0 });
-  const [isVisible, setIsVisible] = (0, import_react29.useState)(false);
-  (0, import_react29.useEffect)(() => {
+  const tooltipRef = (0, import_react30.useRef)(null);
+  const [position, setPosition] = (0, import_react30.useState)({ x: 0, y: 0 });
+  const [isVisible, setIsVisible] = (0, import_react30.useState)(false);
+  (0, import_react30.useEffect)(() => {
     if (!active || !tooltipRef.current) {
       setIsVisible(false);
       return;
@@ -6481,19 +6695,19 @@ var ChartTooltip = ({
   if (!active) {
     return null;
   }
-  const tooltipContent = content ? import_react29.default.isValidElement(content) ? import_react29.default.cloneElement(content, {
+  const tooltipContent = content ? import_react30.default.isValidElement(content) ? import_react30.default.cloneElement(content, {
     active,
     label,
     payload,
     formatter,
     labelFormatter
-  }) : import_react29.default.createElement(content, {
+  }) : import_react30.default.createElement(content, {
     active,
     label,
     payload,
     formatter,
     labelFormatter
-  }) : /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(
+  }) : /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(
     DefaultTooltipContent,
     {
       active,
@@ -6503,7 +6717,7 @@ var ChartTooltip = ({
       labelFormatter
     }
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(
     "div",
     {
       ref: tooltipRef,
@@ -6520,26 +6734,26 @@ var ChartTooltip = ({
   );
 };
 function useTooltip() {
-  const [tooltipData, setTooltipData] = (0, import_react29.useState)({
+  const [tooltipData, setTooltipData] = (0, import_react30.useState)({
     active: false,
     x: 0,
     y: 0,
     label: void 0,
     payload: void 0
   });
-  const showTooltip = import_react29.default.useCallback((data) => {
+  const showTooltip = import_react30.default.useCallback((data) => {
     setTooltipData({
       active: true,
       ...data
     });
   }, []);
-  const hideTooltip = import_react29.default.useCallback(() => {
+  const hideTooltip = import_react30.default.useCallback(() => {
     setTooltipData((prev) => ({
       ...prev,
       active: false
     }));
   }, []);
-  const updatePosition = import_react29.default.useCallback((x, y) => {
+  const updatePosition = import_react30.default.useCallback((x, y) => {
     setTooltipData((prev) => ({
       ...prev,
       x,
@@ -6555,7 +6769,7 @@ function useTooltip() {
 }
 // src/charts/components/Legend.tsx
-var import_jsx_runtime111 = require("react/jsx-runtime");
+var import_jsx_runtime112 = require("react/jsx-runtime");
 var Legend = ({
   items = [],
   layout = "horizontal",
@@ -6579,7 +6793,7 @@ var Legend = ({
     const style = { backgroundColor: item.color };
     switch (item.type) {
       case "line":
-        return /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(
+        return /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(
           "div",
           {
             className: "flex-shrink-0",
@@ -6591,7 +6805,7 @@ var Legend = ({
           }
         );
       case "circle":
-        return /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(
+        return /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(
           "div",
           {
             className: "rounded-full flex-shrink-0",
@@ -6605,7 +6819,7 @@ var Legend = ({
       case "rect":
       case "square":
       default:
-        return /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(
+        return /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(
           "div",
           {
             className: "rounded-sm flex-shrink-0",
@@ -6618,12 +6832,12 @@ var Legend = ({
         );
     }
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(
     "div",
     {
       className: `flex gap-4 px-4 py-2 ${layoutClass} ${alignClass} ${className}`,
       style: wrapperStyle,
-      children: items.map((item, index) => /* @__PURE__ */ (0, import_jsx_runtime111.jsxs)(
+      children: items.map((item, index) => /* @__PURE__ */ (0, import_jsx_runtime112.jsxs)(
         "button",
         {
           type: "button",
@@ -6637,7 +6851,7 @@ var Legend = ({
           onMouseLeave,
           children: [
             renderIcon(item),
-            /* @__PURE__ */ (0, import_jsx_runtime111.jsx)("span", { className: "text-[hsl(var(--foreground))]", children: formatter ? formatter(item.name, item, index) : item.name })
+            /* @__PURE__ */ (0, import_jsx_runtime112.jsx)("span", { className: "text-[hsl(var(--foreground))]", children: formatter ? formatter(item.name, item, index) : item.name })
           ]
         },
         `${item.name}-${index}`
@@ -6647,7 +6861,7 @@ var Legend = ({
 };
 // src/charts/components/ReferenceLine.tsx
-var import_jsx_runtime112 = require("react/jsx-runtime");
+var import_jsx_runtime113 = require("react/jsx-runtime");
 var ReferenceLine = ({
   x,
   y,
@@ -6759,8 +6973,8 @@ var ReferenceLine = ({
   } else {
     return null;
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime112.jsxs)("g", { className: `reference-line ${className}`, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime113.jsxs)("g", { className: `reference-line ${className}`, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(
       "line",
       {
         x1,
@@ -6772,7 +6986,7 @@ var ReferenceLine = ({
         strokeDasharray
       }
     ),
-    label && (typeof label === "string" ? /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(
+    label && (typeof label === "string" ? /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(
       "text",
       {
         x: labelX,
@@ -6784,7 +6998,7 @@ var ReferenceLine = ({
         className: "fill-[hsl(var(--muted-foreground))]",
         children: label
       }
-    ) : /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(
+    ) : /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(
       "foreignObject",
       {
         x: labelX - 50,
@@ -6798,7 +7012,7 @@ var ReferenceLine = ({
 };
 // src/charts/components/ReferenceArea.tsx
-var import_jsx_runtime113 = require("react/jsx-runtime");
+var import_jsx_runtime114 = require("react/jsx-runtime");
 var ReferenceArea = ({
   x1,
   x2,
@@ -6906,8 +7120,8 @@ var ReferenceArea = ({
       labelX = rectX + rectWidth / 2;
       labelY = rectY + rectHeight / 2;
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime113.jsxs)("g", { className: `reference-area ${className}`, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime114.jsxs)("g", { className: `reference-area ${className}`, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(
       "rect",
       {
         x: rectX,
@@ -6920,7 +7134,7 @@ var ReferenceArea = ({
         strokeWidth
       }
     ),
-    label && (typeof label === "string" ? /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(
+    label && (typeof label === "string" ? /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(
       "text",
       {
         x: labelX,
@@ -6932,7 +7146,7 @@ var ReferenceArea = ({
         className: "fill-[hsl(var(--muted-foreground))]",
         children: label
       }
-    ) : /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(
+    ) : /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(
       "foreignObject",
       {
         x: labelX - 50,
@@ -6946,8 +7160,8 @@ var ReferenceArea = ({
 };
 // src/charts/components/CartesianGrid.tsx
-var import_react30 = require("react");
-var import_jsx_runtime114 = require("react/jsx-runtime");
+var import_react31 = require("react");
+var import_jsx_runtime115 = require("react/jsx-runtime");
 var CartesianGrid = ({
   horizontal = true,
   vertical = true,
@@ -6964,18 +7178,18 @@ var CartesianGrid = ({
     return null;
   }
   const { width, height } = _chartDimensions;
-  const hPoints = (0, import_react30.useMemo)(() => {
+  const hPoints = (0, import_react31.useMemo)(() => {
     if (horizontalPoints) return horizontalPoints;
     const count = 5;
     return Array.from({ length: count + 1 }, (_, i) => height / count * i);
   }, [horizontalPoints, height]);
-  const vPoints = (0, import_react30.useMemo)(() => {
+  const vPoints = (0, import_react31.useMemo)(() => {
     if (verticalPoints) return verticalPoints;
     const count = 6;
     return Array.from({ length: count + 1 }, (_, i) => width / count * i);
   }, [verticalPoints, width]);
-  return /* @__PURE__ */ (0, import_jsx_runtime114.jsxs)("g", { className: `cartesian-grid ${className}`, children: [
-    horizontal && hPoints.map((y, i) => /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime115.jsxs)("g", { className: `cartesian-grid ${className}`, children: [
+    horizontal && hPoints.map((y, i) => /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(
       "line",
       {
         x1: 0,
@@ -6990,7 +7204,7 @@ var CartesianGrid = ({
       },
       `h-${i}`
     )),
-    vertical && vPoints.map((x, i) => /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(
+    vertical && vPoints.map((x, i) => /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(
       "line",
       {
         x1: x,
@@ -7009,7 +7223,7 @@ var CartesianGrid = ({
 };
 // src/charts/LineChart.tsx
-var import_jsx_runtime115 = require("react/jsx-runtime");
+var import_jsx_runtime116 = require("react/jsx-runtime");
 var LineChart = ({
   data,
   width: providedWidth,
@@ -7045,10 +7259,10 @@ var LineChart = ({
   colors = CHART_DEFAULTS.colors,
   ariaLabel
 }) => {
-  const containerRef = (0, import_react31.useRef)(null);
-  const svgRef = (0, import_react31.useRef)(null);
-  const [hoveredPoint, setHoveredPoint] = (0, import_react31.useState)(null);
-  const [crosshairX, setCrosshairX] = (0, import_react31.useState)(null);
+  const containerRef = (0, import_react32.useRef)(null);
+  const svgRef = (0, import_react32.useRef)(null);
+  const [hoveredPoint, setHoveredPoint] = (0, import_react32.useState)(null);
+  const [crosshairX, setCrosshairX] = (0, import_react32.useState)(null);
   const { tooltipData, showTooltip: showTooltipFn, hideTooltip } = useTooltip();
   const {
     width,
@@ -7066,7 +7280,7 @@ var LineChart = ({
     providedHeight
   });
   const animate = animateProp && !_isResizing;
-  const padding = (0, import_react31.useMemo)(() => ({
+  const padding = (0, import_react32.useMemo)(() => ({
     top: customPadding?.top ?? CHART_DEFAULTS.padding.top,
     right: customPadding?.right ?? (showValueLabels ? 80 : CHART_DEFAULTS.padding.right),
     bottom: customPadding?.bottom ?? (showXAxis ? 60 : CHART_DEFAULTS.padding.bottom),
@@ -7074,17 +7288,17 @@ var LineChart = ({
   }), [customPadding, showXAxis, showYAxis, showValueLabels]);
   const chartWidth = width - padding.left - padding.right;
   const chartHeight = height - padding.top - padding.bottom;
-  const allPoints = (0, import_react31.useMemo)(
+  const allPoints = (0, import_react32.useMemo)(
     () => data.flatMap((series) => series.data),
     [data]
   );
-  const xValueType = (0, import_react31.useMemo)(() => {
+  const xValueType = (0, import_react32.useMemo)(() => {
     const firstX = data[0]?.data[0]?.x;
     if (firstX instanceof Date) return "date";
     if (typeof firstX === "number") return "number";
     return "string";
   }, [data]);
-  const xDomainCalc = (0, import_react31.useMemo)(() => {
+  const xDomainCalc = (0, import_react32.useMemo)(() => {
     if (xValueType === "date") {
       const dates = allPoints.map((p) => p.x.getTime());
       return [Math.min(...dates), Math.max(...dates)];
@@ -7096,12 +7310,12 @@ var LineChart = ({
     const maxLen = Math.max(...data.map((s) => s.data.length));
     return [0, maxLen - 1];
   }, [allPoints, xValueType, data]);
-  const yDomainCalc = (0, import_react31.useMemo)(() => {
+  const yDomainCalc = (0, import_react32.useMemo)(() => {
     if (yDomain) return yDomain;
     const yValues = allPoints.map((p) => p.y);
     return calculateDomain(yValues, { includeZero: true, padding: 0.1 });
   }, [allPoints, yDomain]);
-  const xScale = (0, import_react31.useMemo)(() => {
+  const xScale = (0, import_react32.useMemo)(() => {
     if (xValueType === "date") {
       return (value) => {
         const time = value instanceof Date ? value.getTime() : Number(value);
@@ -7124,18 +7338,18 @@ var LineChart = ({
       return index / maxLen * chartWidth;
     };
   }, [xValueType, xDomainCalc, chartWidth, data]);
-  const yScale = (0, import_react31.useMemo)(
+  const yScale = (0, import_react32.useMemo)(
     () => scaleLinear({
       domain: yDomainCalc,
       range: [chartHeight, 0]
     }),
     [yDomainCalc, chartHeight]
   );
-  const yTicks = (0, import_react31.useMemo)(
+  const yTicks = (0, import_react32.useMemo)(
     () => getTicks(yDomainCalc, yAxisTickCount),
     [yDomainCalc, yAxisTickCount]
   );
-  const xTicks = (0, import_react31.useMemo)(() => {
+  const xTicks = (0, import_react32.useMemo)(() => {
     if (xValueType === "string") {
       return data[0]?.data.map((p, i) => ({ value: p.x, index: i })) || [];
     }
@@ -7143,7 +7357,7 @@ var LineChart = ({
     const ticks = getTicks(xDomainCalc, tickCount);
     return ticks.map((t) => ({ value: t, index: 0 }));
   }, [xValueType, xDomainCalc, data]);
-  const xFormatter = (0, import_react31.useCallback)((value) => {
+  const xFormatter = (0, import_react32.useCallback)((value) => {
     if (formatXValue) return formatXValue(value);
     if (value instanceof Date) {
       const range = xDomainCalc[1] - xDomainCalc[0];
@@ -7151,11 +7365,11 @@ var LineChart = ({
     }
     return String(value);
   }, [formatXValue, xDomainCalc]);
-  const yFormatter = (0, import_react31.useMemo)(() => {
+  const yFormatter = (0, import_react32.useMemo)(() => {
     if (formatYValue) return formatYValue;
     return createTickFormatter(yDomainCalc);
   }, [formatYValue, yDomainCalc]);
-  const seriesPaths = (0, import_react31.useMemo)(() => {
+  const seriesPaths = (0, import_react32.useMemo)(() => {
     return data.map((series) => {
       const points = series.data.map((point, i) => ({
         x: xScale(point.x, i),
@@ -7180,7 +7394,7 @@ var LineChart = ({
       return { points, path };
     });
   }, [data, xScale, yScale]);
-  const handlePointEnter = (0, import_react31.useCallback)((e, seriesIndex, pointIndex) => {
+  const handlePointEnter = (0, import_react32.useCallback)((e, seriesIndex, pointIndex) => {
     const series = data[seriesIndex];
     const point = series.data[pointIndex];
     const scaledPoint = seriesPaths[seriesIndex].points[pointIndex];
@@ -7207,17 +7421,17 @@ var LineChart = ({
     }
     onPointHover?.(point, seriesIndex, pointIndex);
   }, [data, seriesPaths, showCrosshair, showTooltip, colors, xFormatter, showTooltipFn, onPointHover]);
-  const handlePointLeave = (0, import_react31.useCallback)(() => {
+  const handlePointLeave = (0, import_react32.useCallback)(() => {
     setHoveredPoint(null);
     setCrosshairX(null);
     hideTooltip();
     onPointHover?.(null, -1, -1);
   }, [hideTooltip, onPointHover]);
-  const handlePointClick = (0, import_react31.useCallback)((seriesIndex, pointIndex) => {
+  const handlePointClick = (0, import_react32.useCallback)((seriesIndex, pointIndex) => {
     const point = data[seriesIndex].data[pointIndex];
     onPointClick?.(point, seriesIndex, pointIndex);
   }, [data, onPointClick]);
-  const legendItems = (0, import_react31.useMemo)(
+  const legendItems = (0, import_react32.useMemo)(
     () => data.map((series, i) => ({
       name: series.name,
       color: series.color || colors[i % colors.length],
@@ -7225,7 +7439,7 @@ var LineChart = ({
     })),
     [data, colors]
   );
-  const referenceElements = (0, import_react31.useMemo)(() => {
+  const referenceElements = (0, import_react32.useMemo)(() => {
     if (!children) return null;
     const chartDimensions = {
       width: chartWidth,
@@ -7242,10 +7456,10 @@ var LineChart = ({
       },
       yScale
     };
-    return import_react31.default.Children.map(children, (child) => {
-      if (!import_react31.default.isValidElement(child)) return child;
+    return import_react32.default.Children.map(children, (child) => {
+      if (!import_react32.default.isValidElement(child)) return child;
       if (child.type === ReferenceLine || child.type === ReferenceArea || child.type === CartesianGrid) {
-        return import_react31.default.cloneElement(child, {
+        return import_react32.default.cloneElement(child, {
           _chartDimensions: chartDimensions,
           _scales: scales
         });
@@ -7253,19 +7467,19 @@ var LineChart = ({
       return child;
     });
   }, [children, chartWidth, chartHeight, padding, xScale, yScale, xValueType, data]);
-  const accessibleDescription = (0, import_react31.useMemo)(() => {
+  const accessibleDescription = (0, import_react32.useMemo)(() => {
     if (ariaLabel) return ariaLabel;
     const seriesNames = data.map((s) => s.name).join(", ");
     return `Line chart with ${data.length} series: ${seriesNames}`;
   }, [data, ariaLabel]);
-  return /* @__PURE__ */ (0, import_jsx_runtime115.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime116.jsxs)(
     "div",
     {
       ref: containerRef,
       className: `relative ${className}`,
       style: containerStyle,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime115.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime116.jsxs)(
           "svg",
           {
             ref: svgRef,
@@ -7278,14 +7492,14 @@ var LineChart = ({
             className: "bg-[hsl(var(--card))]",
             style: svgStyle,
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime115.jsx)("defs", { children: animate && data.map((series, i) => /* @__PURE__ */ (0, import_jsx_runtime115.jsx)("style", { children: `
+              /* @__PURE__ */ (0, import_jsx_runtime116.jsx)("defs", { children: animate && data.map((series, i) => /* @__PURE__ */ (0, import_jsx_runtime116.jsx)("style", { children: `
               @keyframes drawLine${i} {
                 from { stroke-dashoffset: 2000; }
                 to { stroke-dashoffset: 0; }
               }
             ` }, `anim-${i}`)) }),
-              /* @__PURE__ */ (0, import_jsx_runtime115.jsxs)("g", { transform: `translate(${padding.left}, ${padding.top})`, children: [
-                showGrid && /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime116.jsxs)("g", { transform: `translate(${padding.left}, ${padding.top})`, children: [
+                showGrid && /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(
                   CartesianGrid,
                   {
                     _chartDimensions: { width: chartWidth, height: chartHeight },
@@ -7293,7 +7507,7 @@ var LineChart = ({
                   }
                 ),
                 referenceElements,
-                showCrosshair && crosshairX !== null && /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(
+                showCrosshair && crosshairX !== null && /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(
                   "line",
                   {
                     x1: crosshairX,
@@ -7311,7 +7525,7 @@ var LineChart = ({
                   const { path } = seriesPaths[seriesIndex];
                   const color = series.color || colors[seriesIndex % colors.length];
                   const strokeWidth = series.strokeWidth || CHART_DEFAULTS.line.strokeWidth;
-                  return /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(
+                  return /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(
                     "path",
                     {
                       d: path,
@@ -7336,7 +7550,7 @@ var LineChart = ({
                   return points.map((point, pointIndex) => {
                     const isHovered = hoveredPoint?.seriesIndex === seriesIndex && hoveredPoint?.pointIndex === pointIndex;
                     const animateDots = animate && !isResponsive;
-                    return /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(
+                    return /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(
                       "circle",
                       {
                         cx: point.x,
@@ -7364,8 +7578,8 @@ var LineChart = ({
                   const lastScaled = points[points.length - 1];
                   const color = series.color || colors[seriesIndex % colors.length];
                   if (!lastPoint || !lastScaled) return null;
-                  return /* @__PURE__ */ (0, import_jsx_runtime115.jsxs)("g", { children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(
+                  return /* @__PURE__ */ (0, import_jsx_runtime116.jsxs)("g", { children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(
                       "circle",
                       {
                         cx: chartWidth + 12,
@@ -7374,7 +7588,7 @@ var LineChart = ({
                         fill: color
                       }
                     ),
-                    /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(
+                    /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(
                       "text",
                       {
                         x: chartWidth + 22,
@@ -7388,8 +7602,8 @@ var LineChart = ({
                     )
                   ] }, `label-${seriesIndex}`);
                 }),
-                showXAxis && /* @__PURE__ */ (0, import_jsx_runtime115.jsxs)("g", { transform: `translate(0, ${chartHeight})`, children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(
+                showXAxis && /* @__PURE__ */ (0, import_jsx_runtime116.jsxs)("g", { transform: `translate(0, ${chartHeight})`, children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(
                     "line",
                     {
                       x1: 0,
@@ -7402,9 +7616,9 @@ var LineChart = ({
                   ),
                   xTicks.map((tick, i) => {
                     const x = xValueType === "string" ? xScale(tick.value, tick.index) : xScale(xValueType === "date" ? new Date(tick.value) : tick.value, 0);
-                    return /* @__PURE__ */ (0, import_jsx_runtime115.jsxs)("g", { transform: `translate(${x}, 0)`, children: [
-                      /* @__PURE__ */ (0, import_jsx_runtime115.jsx)("line", { y2: 6, className: "stroke-[hsl(var(--border))]" }),
-                      /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(
+                    return /* @__PURE__ */ (0, import_jsx_runtime116.jsxs)("g", { transform: `translate(${x}, 0)`, children: [
+                      /* @__PURE__ */ (0, import_jsx_runtime116.jsx)("line", { y2: 6, className: "stroke-[hsl(var(--border))]" }),
+                      /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(
                         "text",
                         {
                           y: 20,
@@ -7416,7 +7630,7 @@ var LineChart = ({
                       )
                     ] }, `x-tick-${i}`);
                   }),
-                  xAxisLabel && /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(
+                  xAxisLabel && /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(
                     "text",
                     {
                       x: chartWidth / 2,
@@ -7429,8 +7643,8 @@ var LineChart = ({
                     }
                   )
                 ] }),
-                showYAxis && /* @__PURE__ */ (0, import_jsx_runtime115.jsxs)("g", { children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(
+                showYAxis && /* @__PURE__ */ (0, import_jsx_runtime116.jsxs)("g", { children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(
                     "line",
                     {
                       x1: 0,
@@ -7441,9 +7655,9 @@ var LineChart = ({
                       strokeWidth: 1
                     }
                   ),
-                  yTicks.map((tick, i) => /* @__PURE__ */ (0, import_jsx_runtime115.jsxs)("g", { transform: `translate(0, ${yScale(tick)})`, children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime115.jsx)("line", { x2: -6, className: "stroke-[hsl(var(--border))]" }),
-                    /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(
+                  yTicks.map((tick, i) => /* @__PURE__ */ (0, import_jsx_runtime116.jsxs)("g", { transform: `translate(0, ${yScale(tick)})`, children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime116.jsx)("line", { x2: -6, className: "stroke-[hsl(var(--border))]" }),
+                    /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(
                       "text",
                       {
                         x: -12,
@@ -7455,7 +7669,7 @@ var LineChart = ({
                       }
                     )
                   ] }, `y-tick-${i}`)),
-                  yAxisLabel && /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(
+                  yAxisLabel && /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(
                     "text",
                     {
                       x: -chartHeight / 2,
@@ -7470,7 +7684,7 @@ var LineChart = ({
                   )
                 ] })
               ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime115.jsx)("style", { children: `
+              /* @__PURE__ */ (0, import_jsx_runtime116.jsx)("style", { children: `
           @keyframes fadeIn {
             from { opacity: 0; }
             to { opacity: 1; }
@@ -7479,7 +7693,7 @@ var LineChart = ({
             ]
           }
         ),
-        showLegend && /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(
+        showLegend && /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(
           Legend,
           {
             items: legendItems,
@@ -7487,7 +7701,7 @@ var LineChart = ({
             align: "center"
           }
         ),
-        showTooltip && /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(
+        showTooltip && /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(
           ChartTooltip,
           {
             ...tooltipData,
@@ -7503,8 +7717,8 @@ var LineChart = ({
 };
 // src/charts/BarChart.tsx
-var import_react32 = __toESM(require("react"));
-var import_jsx_runtime116 = require("react/jsx-runtime");
+var import_react33 = __toESM(require("react"));
+var import_jsx_runtime117 = require("react/jsx-runtime");
 var BarChart = ({
   data,
   width: providedWidth,
@@ -7540,8 +7754,8 @@ var BarChart = ({
   colors = CHART_DEFAULTS.colors,
   ariaLabel
 }) => {
-  const containerRef = (0, import_react32.useRef)(null);
-  const [hoveredBar, setHoveredBar] = (0, import_react32.useState)(null);
+  const containerRef = (0, import_react33.useRef)(null);
+  const [hoveredBar, setHoveredBar] = (0, import_react33.useState)(null);
   const { tooltipData, showTooltip: showTooltipFn, hideTooltip } = useTooltip();
   const {
     width,
@@ -7559,7 +7773,7 @@ var BarChart = ({
     providedHeight
   });
   const animate = animateProp && !_isResizing && !isResponsive;
-  const padding = (0, import_react32.useMemo)(() => ({
+  const padding = (0, import_react33.useMemo)(() => ({
     top: customPadding?.top ?? CHART_DEFAULTS.padding.top,
     right: customPadding?.right ?? CHART_DEFAULTS.padding.right,
     bottom: customPadding?.bottom ?? (showXAxis ? 70 : CHART_DEFAULTS.padding.bottom),
@@ -7567,11 +7781,11 @@ var BarChart = ({
   }), [customPadding, showXAxis, showYAxis]);
   const chartWidth = width - padding.left - padding.right;
   const chartHeight = height - padding.top - padding.bottom;
-  const categories = (0, import_react32.useMemo)(() => {
+  const categories = (0, import_react33.useMemo)(() => {
     const cats = data[0]?.data.map((d) => String(d.x)) || [];
     return [...new Set(cats)];
   }, [data]);
-  const yDomainCalc = (0, import_react32.useMemo)(() => {
+  const yDomainCalc = (0, import_react33.useMemo)(() => {
     if (yDomain) return yDomain;
     if (stacked) {
       const maxStacked = categories.map((_, catIndex) => {
@@ -7584,7 +7798,7 @@ var BarChart = ({
     const allY = data.flatMap((s) => s.data.map((d) => d.y));
     return calculateDomain(allY, { includeZero: true, padding: 0.1 });
   }, [data, categories, stacked, yDomain]);
-  const xBandScale = (0, import_react32.useMemo)(
+  const xBandScale = (0, import_react33.useMemo)(
     () => scaleBand({
       domain: categories,
       range: horizontal ? [chartHeight, 0] : [0, chartWidth],
@@ -7592,25 +7806,25 @@ var BarChart = ({
     }),
     [categories, chartWidth, chartHeight, horizontal, barCategoryGap]
   );
-  const yScale = (0, import_react32.useMemo)(
+  const yScale = (0, import_react33.useMemo)(
     () => scaleLinear({
       domain: yDomainCalc,
       range: horizontal ? [0, chartWidth] : [chartHeight, 0]
     }),
     [yDomainCalc, chartWidth, chartHeight, horizontal]
   );
-  const yTicks = (0, import_react32.useMemo)(
+  const yTicks = (0, import_react33.useMemo)(
     () => getTicks(yDomainCalc, yAxisTickCount),
     [yDomainCalc, yAxisTickCount]
   );
-  const yFormatter = (0, import_react32.useMemo)(() => {
+  const yFormatter = (0, import_react33.useMemo)(() => {
     if (formatYValue) return formatYValue;
     return createTickFormatter(yDomainCalc);
   }, [formatYValue, yDomainCalc]);
   const numSeries = data.length;
   const bandwidth = xBandScale.bandwidth();
   const barWidth = stacked ? bandwidth : (bandwidth - bandwidth * barGap * (numSeries - 1)) / numSeries;
-  const handleBarEnter = (0, import_react32.useCallback)((e, seriesIndex, barIndex) => {
+  const handleBarEnter = (0, import_react33.useCallback)((e, seriesIndex, barIndex) => {
     const series = data[seriesIndex];
     const point = series.data[barIndex];
     setHoveredBar({ seriesIndex, barIndex });
@@ -7633,16 +7847,16 @@ var BarChart = ({
     }
     onBarHover?.(point, seriesIndex, barIndex);
   }, [data, showTooltip, colors, showTooltipFn, onBarHover]);
-  const handleBarLeave = (0, import_react32.useCallback)(() => {
+  const handleBarLeave = (0, import_react33.useCallback)(() => {
     setHoveredBar(null);
     hideTooltip();
     onBarHover?.(null, -1, -1);
   }, [hideTooltip, onBarHover]);
-  const handleBarClick = (0, import_react32.useCallback)((seriesIndex, barIndex) => {
+  const handleBarClick = (0, import_react33.useCallback)((seriesIndex, barIndex) => {
     const point = data[seriesIndex].data[barIndex];
     onBarClick?.(point, seriesIndex, barIndex);
   }, [data, onBarClick]);
-  const legendItems = (0, import_react32.useMemo)(
+  const legendItems = (0, import_react33.useMemo)(
     () => data.map((series, i) => ({
       name: series.name,
       color: series.color || colors[i % colors.length],
@@ -7650,7 +7864,7 @@ var BarChart = ({
     })),
     [data, colors]
   );
-  const bars = (0, import_react32.useMemo)(() => {
+  const bars = (0, import_react33.useMemo)(() => {
     const result = [];
     const cumulativeValues = {};
     data.forEach((series, seriesIndex) => {
@@ -7690,7 +7904,7 @@ var BarChart = ({
         }
         const isHovered = hoveredBar?.seriesIndex === seriesIndex && hoveredBar?.barIndex === barIndex;
         result.push(
-          /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(
             "rect",
             {
               x: barX,
@@ -7718,7 +7932,7 @@ var BarChart = ({
           const labelX = horizontal ? barX + barW + 8 : barX + barW / 2;
           const labelY = horizontal ? barY + barH / 2 : barY - 8;
           result.push(
-            /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(
               "text",
               {
                 x: labelX,
@@ -7762,17 +7976,17 @@ var BarChart = ({
     handleBarLeave,
     handleBarClick
   ]);
-  const referenceElements = (0, import_react32.useMemo)(() => {
+  const referenceElements = (0, import_react33.useMemo)(() => {
     if (!children) return null;
     const chartDimensions = { width: chartWidth, height: chartHeight, padding };
     const scales = {
       xScale: (value) => xBandScale.scale(String(value)) + bandwidth / 2,
       yScale
     };
-    return import_react32.default.Children.map(children, (child) => {
-      if (!import_react32.default.isValidElement(child)) return child;
+    return import_react33.default.Children.map(children, (child) => {
+      if (!import_react33.default.isValidElement(child)) return child;
       if (child.type === ReferenceLine || child.type === ReferenceArea || child.type === CartesianGrid) {
-        return import_react32.default.cloneElement(child, {
+        return import_react33.default.cloneElement(child, {
           _chartDimensions: chartDimensions,
           _scales: scales
         });
@@ -7780,19 +7994,19 @@ var BarChart = ({
       return child;
     });
   }, [children, chartWidth, chartHeight, padding, xBandScale, bandwidth, yScale]);
-  const accessibleDescription = (0, import_react32.useMemo)(() => {
+  const accessibleDescription = (0, import_react33.useMemo)(() => {
     if (ariaLabel) return ariaLabel;
     const seriesNames = data.map((s) => s.name).join(", ");
     return `Bar chart with ${data.length} series: ${seriesNames}`;
   }, [data, ariaLabel]);
-  return /* @__PURE__ */ (0, import_jsx_runtime116.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime117.jsxs)(
     "div",
     {
       ref: containerRef,
       className: `relative ${className}`,
       style: containerStyle,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime116.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime117.jsxs)(
           "svg",
           {
             width: svgWidth,
@@ -7804,7 +8018,7 @@ var BarChart = ({
             className: "bg-[hsl(var(--card))]",
             style: svgStyle,
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime116.jsx)("defs", { children: /* @__PURE__ */ (0, import_jsx_runtime116.jsx)("style", { children: `
+              /* @__PURE__ */ (0, import_jsx_runtime117.jsx)("defs", { children: /* @__PURE__ */ (0, import_jsx_runtime117.jsx)("style", { children: `
             @keyframes growY {
               from { transform: scaleY(0); }
               to { transform: scaleY(1); }
@@ -7818,8 +8032,8 @@ var BarChart = ({
               to { opacity: 1; }
             }
           ` }) }),
-              /* @__PURE__ */ (0, import_jsx_runtime116.jsxs)("g", { transform: `translate(${padding.left}, ${padding.top})`, children: [
-                showGrid && /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime117.jsxs)("g", { transform: `translate(${padding.left}, ${padding.top})`, children: [
+                showGrid && /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(
                   CartesianGrid,
                   {
                     _chartDimensions: { width: chartWidth, height: chartHeight },
@@ -7831,8 +8045,8 @@ var BarChart = ({
                 ),
                 referenceElements,
                 bars,
-                showXAxis && /* @__PURE__ */ (0, import_jsx_runtime116.jsxs)("g", { transform: `translate(0, ${chartHeight})`, children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(
+                showXAxis && /* @__PURE__ */ (0, import_jsx_runtime117.jsxs)("g", { transform: `translate(0, ${chartHeight})`, children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(
                     "line",
                     {
                       x1: 0,
@@ -7844,9 +8058,9 @@ var BarChart = ({
                   ),
                   categories.map((cat, i) => {
                     const x = xBandScale.scale(cat) + bandwidth / 2;
-                    return /* @__PURE__ */ (0, import_jsx_runtime116.jsxs)("g", { transform: `translate(${x}, 0)`, children: [
-                      /* @__PURE__ */ (0, import_jsx_runtime116.jsx)("line", { y2: 6, className: "stroke-[hsl(var(--border))]" }),
-                      /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(
+                    return /* @__PURE__ */ (0, import_jsx_runtime117.jsxs)("g", { transform: `translate(${x}, 0)`, children: [
+                      /* @__PURE__ */ (0, import_jsx_runtime117.jsx)("line", { y2: 6, className: "stroke-[hsl(var(--border))]" }),
+                      /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(
                         "text",
                         {
                           y: 20,
@@ -7858,7 +8072,7 @@ var BarChart = ({
                       )
                     ] }, `x-tick-${i}`);
                   }),
-                  xAxisLabel && /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(
+                  xAxisLabel && /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(
                     "text",
                     {
                       x: chartWidth / 2,
@@ -7871,8 +8085,8 @@ var BarChart = ({
                     }
                   )
                 ] }),
-                showYAxis && /* @__PURE__ */ (0, import_jsx_runtime116.jsxs)("g", { children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(
+                showYAxis && /* @__PURE__ */ (0, import_jsx_runtime117.jsxs)("g", { children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(
                     "line",
                     {
                       x1: 0,
@@ -7882,9 +8096,9 @@ var BarChart = ({
                       className: "stroke-[hsl(var(--border))]"
                     }
                   ),
-                  yTicks.map((tick, i) => /* @__PURE__ */ (0, import_jsx_runtime116.jsxs)("g", { transform: `translate(0, ${yScale(tick)})`, children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime116.jsx)("line", { x2: -6, className: "stroke-[hsl(var(--border))]" }),
-                    /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(
+                  yTicks.map((tick, i) => /* @__PURE__ */ (0, import_jsx_runtime117.jsxs)("g", { transform: `translate(0, ${yScale(tick)})`, children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime117.jsx)("line", { x2: -6, className: "stroke-[hsl(var(--border))]" }),
+                    /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(
                       "text",
                       {
                         x: -12,
@@ -7896,7 +8110,7 @@ var BarChart = ({
                       }
                     )
                   ] }, `y-tick-${i}`)),
-                  yAxisLabel && /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(
+                  yAxisLabel && /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(
                     "text",
                     {
                       x: -chartHeight / 2,
@@ -7914,8 +8128,8 @@ var BarChart = ({
             ]
           }
         ),
-        showLegend && /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(Legend, { items: legendItems, layout: "horizontal", align: "center" }),
-        showTooltip && /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(
+        showLegend && /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(Legend, { items: legendItems, layout: "horizontal", align: "center" }),
+        showTooltip && /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(
           ChartTooltip,
           {
             ...tooltipData,
@@ -7929,8 +8143,8 @@ var BarChart = ({
 };
 // src/charts/AreaChart.tsx
-var import_react33 = __toESM(require("react"));
-var import_jsx_runtime117 = require("react/jsx-runtime");
+var import_react34 = __toESM(require("react"));
+var import_jsx_runtime118 = require("react/jsx-runtime");
 var AreaChart = ({
   data,
   width: providedWidth,
@@ -7965,9 +8179,9 @@ var AreaChart = ({
   colors = CHART_DEFAULTS.colors,
   ariaLabel
 }) => {
-  const containerRef = (0, import_react33.useRef)(null);
-  const chartId = (0, import_react33.useId)();
-  const [hoveredPoint, setHoveredPoint] = (0, import_react33.useState)(null);
+  const containerRef = (0, import_react34.useRef)(null);
+  const chartId = (0, import_react34.useId)();
+  const [hoveredPoint, setHoveredPoint] = (0, import_react34.useState)(null);
   const { tooltipData, showTooltip: showTooltipFn, hideTooltip } = useTooltip();
   const {
     width,
@@ -7985,7 +8199,7 @@ var AreaChart = ({
     providedHeight
   });
   const animate = animateProp && !_isResizing && !isResponsive;
-  const padding = (0, import_react33.useMemo)(() => ({
+  const padding = (0, import_react34.useMemo)(() => ({
     top: customPadding?.top ?? CHART_DEFAULTS.padding.top,
     right: customPadding?.right ?? CHART_DEFAULTS.padding.right,
     bottom: customPadding?.bottom ?? (showXAxis ? 60 : CHART_DEFAULTS.padding.bottom),
@@ -7993,17 +8207,17 @@ var AreaChart = ({
   }), [customPadding, showXAxis, showYAxis]);
   const chartWidth = width - padding.left - padding.right;
   const chartHeight = height - padding.top - padding.bottom;
-  const allPoints = (0, import_react33.useMemo)(
+  const allPoints = (0, import_react34.useMemo)(
     () => data.flatMap((series) => series.data),
     [data]
   );
-  const xValueType = (0, import_react33.useMemo)(() => {
+  const xValueType = (0, import_react34.useMemo)(() => {
     const firstX = data[0]?.data[0]?.x;
     if (firstX instanceof Date) return "date";
     if (typeof firstX === "number") return "number";
     return "string";
   }, [data]);
-  const xDomainCalc = (0, import_react33.useMemo)(() => {
+  const xDomainCalc = (0, import_react34.useMemo)(() => {
     if (xValueType === "date") {
       const dates = allPoints.map((p) => p.x.getTime());
       return [Math.min(...dates), Math.max(...dates)];
@@ -8015,7 +8229,7 @@ var AreaChart = ({
     const maxLen = Math.max(...data.map((s) => s.data.length));
     return [0, maxLen - 1];
   }, [allPoints, xValueType, data]);
-  const yDomainCalc = (0, import_react33.useMemo)(() => {
+  const yDomainCalc = (0, import_react34.useMemo)(() => {
     if (yDomain) return yDomain;
     if (stacked) {
       const maxPoints = Math.max(...data.map((s) => s.data.length));
@@ -8027,7 +8241,7 @@ var AreaChart = ({
     const yValues = allPoints.map((p) => p.y);
     return calculateDomain(yValues, { includeZero: true, padding: 0.1 });
   }, [allPoints, stacked, data, yDomain]);
-  const xScale = (0, import_react33.useMemo)(() => {
+  const xScale = (0, import_react34.useMemo)(() => {
     if (xValueType === "date") {
       return (value) => {
         const time = value instanceof Date ? value.getTime() : Number(value);
@@ -8050,18 +8264,18 @@ var AreaChart = ({
       return index / maxLen * chartWidth;
     };
   }, [xValueType, xDomainCalc, chartWidth, data]);
-  const yScale = (0, import_react33.useMemo)(
+  const yScale = (0, import_react34.useMemo)(
     () => scaleLinear({
       domain: yDomainCalc,
       range: [chartHeight, 0]
     }),
     [yDomainCalc, chartHeight]
   );
-  const yTicks = (0, import_react33.useMemo)(
+  const yTicks = (0, import_react34.useMemo)(
     () => getTicks(yDomainCalc, yAxisTickCount),
     [yDomainCalc, yAxisTickCount]
   );
-  const xTicks = (0, import_react33.useMemo)(() => {
+  const xTicks = (0, import_react34.useMemo)(() => {
     if (xValueType === "string") {
       return data[0]?.data.map((p, i) => ({ value: p.x, index: i })) || [];
     }
@@ -8069,7 +8283,7 @@ var AreaChart = ({
     const ticks = getTicks(xDomainCalc, tickCount);
     return ticks.map((t) => ({ value: t, index: 0 }));
   }, [xValueType, xDomainCalc, data]);
-  const xFormatter = (0, import_react33.useCallback)((value) => {
+  const xFormatter = (0, import_react34.useCallback)((value) => {
     if (formatXValue) return formatXValue(value);
     if (value instanceof Date) {
       const range = xDomainCalc[1] - xDomainCalc[0];
@@ -8077,11 +8291,11 @@ var AreaChart = ({
     }
     return String(value);
   }, [formatXValue, xDomainCalc]);
-  const yFormatter = (0, import_react33.useMemo)(() => {
+  const yFormatter = (0, import_react34.useMemo)(() => {
     if (formatYValue) return formatYValue;
     return createTickFormatter(yDomainCalc);
   }, [formatYValue, yDomainCalc]);
-  const areaPaths = (0, import_react33.useMemo)(() => {
+  const areaPaths = (0, import_react34.useMemo)(() => {
     const paths = [];
     const cumulativeY = Array(data[0]?.data.length || 0).fill(0);
     data.forEach((series) => {
@@ -8115,7 +8329,7 @@ var AreaChart = ({
     });
     return paths;
   }, [data, xScale, yScale, stacked, curved]);
-  const handlePointEnter = (0, import_react33.useCallback)((e, seriesIndex, pointIndex) => {
+  const handlePointEnter = (0, import_react34.useCallback)((e, seriesIndex, pointIndex) => {
     const series = data[seriesIndex];
     const point = series.data[pointIndex];
     setHoveredPoint({ seriesIndex, pointIndex });
@@ -8138,16 +8352,16 @@ var AreaChart = ({
     }
     onPointHover?.(point, seriesIndex, pointIndex);
   }, [data, showTooltip, colors, xFormatter, showTooltipFn, onPointHover]);
-  const handlePointLeave = (0, import_react33.useCallback)(() => {
+  const handlePointLeave = (0, import_react34.useCallback)(() => {
     setHoveredPoint(null);
     hideTooltip();
     onPointHover?.(null, -1, -1);
   }, [hideTooltip, onPointHover]);
-  const handlePointClick = (0, import_react33.useCallback)((seriesIndex, pointIndex) => {
+  const handlePointClick = (0, import_react34.useCallback)((seriesIndex, pointIndex) => {
     const point = data[seriesIndex].data[pointIndex];
     onPointClick?.(point, seriesIndex, pointIndex);
   }, [data, onPointClick]);
-  const legendItems = (0, import_react33.useMemo)(
+  const legendItems = (0, import_react34.useMemo)(
     () => data.map((series, i) => ({
       name: series.name,
       color: series.color || colors[i % colors.length],
@@ -8155,7 +8369,7 @@ var AreaChart = ({
     })),
     [data, colors]
   );
-  const referenceElements = (0, import_react33.useMemo)(() => {
+  const referenceElements = (0, import_react34.useMemo)(() => {
     if (!children) return null;
     const chartDimensions = { width: chartWidth, height: chartHeight, padding };
     const scales = {
@@ -8168,10 +8382,10 @@ var AreaChart = ({
       },
       yScale
     };
-    return import_react33.default.Children.map(children, (child) => {
-      if (!import_react33.default.isValidElement(child)) return child;
+    return import_react34.default.Children.map(children, (child) => {
+      if (!import_react34.default.isValidElement(child)) return child;
       if (child.type === ReferenceLine || child.type === ReferenceArea || child.type === CartesianGrid) {
-        return import_react33.default.cloneElement(child, {
+        return import_react34.default.cloneElement(child, {
           _chartDimensions: chartDimensions,
           _scales: scales
         });
@@ -8179,19 +8393,19 @@ var AreaChart = ({
       return child;
     });
   }, [children, chartWidth, chartHeight, padding, xScale, yScale, xValueType, data]);
-  const accessibleDescription = (0, import_react33.useMemo)(() => {
+  const accessibleDescription = (0, import_react34.useMemo)(() => {
     if (ariaLabel) return ariaLabel;
     const seriesNames = data.map((s) => s.name).join(", ");
     return `Area chart with ${data.length} series: ${seriesNames}`;
   }, [data, ariaLabel]);
-  return /* @__PURE__ */ (0, import_jsx_runtime117.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime118.jsxs)(
     "div",
     {
       ref: containerRef,
       className: `relative ${className}`,
       style: containerStyle,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime117.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime118.jsxs)(
           "svg",
           {
             width: svgWidth,
@@ -8203,10 +8417,10 @@ var AreaChart = ({
             className: "bg-[hsl(var(--card))]",
             style: svgStyle,
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime117.jsxs)("defs", { children: [
+              /* @__PURE__ */ (0, import_jsx_runtime118.jsxs)("defs", { children: [
                 data.map((series, i) => {
                   const color = series.color || colors[i % colors.length];
-                  return /* @__PURE__ */ (0, import_jsx_runtime117.jsxs)(
+                  return /* @__PURE__ */ (0, import_jsx_runtime118.jsxs)(
                     "linearGradient",
                     {
                       id: `area-gradient-${chartId}-${i}`,
@@ -8215,14 +8429,14 @@ var AreaChart = ({
                       x2: "0",
                       y2: "1",
                       children: [
-                        /* @__PURE__ */ (0, import_jsx_runtime117.jsx)("stop", { offset: "0%", stopColor: color, stopOpacity: series.fillOpacity ?? fillOpacity }),
-                        /* @__PURE__ */ (0, import_jsx_runtime117.jsx)("stop", { offset: "100%", stopColor: color, stopOpacity: 0.05 })
+                        /* @__PURE__ */ (0, import_jsx_runtime118.jsx)("stop", { offset: "0%", stopColor: color, stopOpacity: series.fillOpacity ?? fillOpacity }),
+                        /* @__PURE__ */ (0, import_jsx_runtime118.jsx)("stop", { offset: "100%", stopColor: color, stopOpacity: 0.05 })
                       ]
                     },
                     `gradient-${i}`
                   );
                 }),
-                /* @__PURE__ */ (0, import_jsx_runtime117.jsx)("style", { children: `
+                /* @__PURE__ */ (0, import_jsx_runtime118.jsx)("style", { children: `
             @keyframes fadeIn {
               from { opacity: 0; }
               to { opacity: 1; }
@@ -8233,8 +8447,8 @@ var AreaChart = ({
             }
           ` })
               ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime117.jsxs)("g", { transform: `translate(${padding.left}, ${padding.top})`, children: [
-                showGrid && /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime118.jsxs)("g", { transform: `translate(${padding.left}, ${padding.top})`, children: [
+                showGrid && /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(
                   CartesianGrid,
                   {
                     _chartDimensions: { width: chartWidth, height: chartHeight },
@@ -8247,8 +8461,8 @@ var AreaChart = ({
                   const { areaPath, linePath } = areaPaths[seriesIndex];
                   const color = series.color || colors[seriesIndex % colors.length];
                   const strokeWidth = series.strokeWidth || CHART_DEFAULTS.line.strokeWidth;
-                  return /* @__PURE__ */ (0, import_jsx_runtime117.jsxs)("g", { children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(
+                  return /* @__PURE__ */ (0, import_jsx_runtime118.jsxs)("g", { children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(
                       "path",
                       {
                         d: areaPath,
@@ -8259,7 +8473,7 @@ var AreaChart = ({
                         } : void 0
                       }
                     ),
-                    /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(
+                    /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(
                       "path",
                       {
                         d: linePath,
@@ -8283,7 +8497,7 @@ var AreaChart = ({
                   if (!showSeriesDots) return null;
                   return points.map((point, pointIndex) => {
                     const isHovered = hoveredPoint?.seriesIndex === seriesIndex && hoveredPoint?.pointIndex === pointIndex;
-                    return /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(
+                    return /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(
                       "circle",
                       {
                         cx: point.x,
@@ -8305,8 +8519,8 @@ var AreaChart = ({
                     );
                   });
                 }),
-                showXAxis && /* @__PURE__ */ (0, import_jsx_runtime117.jsxs)("g", { transform: `translate(0, ${chartHeight})`, children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(
+                showXAxis && /* @__PURE__ */ (0, import_jsx_runtime118.jsxs)("g", { transform: `translate(0, ${chartHeight})`, children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(
                     "line",
                     {
                       x1: 0,
@@ -8318,9 +8532,9 @@ var AreaChart = ({
                   ),
                   xTicks.map((tick, i) => {
                     const x = xValueType === "string" ? xScale(tick.value, tick.index) : xScale(xValueType === "date" ? new Date(tick.value) : tick.value, 0);
-                    return /* @__PURE__ */ (0, import_jsx_runtime117.jsxs)("g", { transform: `translate(${x}, 0)`, children: [
-                      /* @__PURE__ */ (0, import_jsx_runtime117.jsx)("line", { y2: 6, className: "stroke-[hsl(var(--border))]" }),
-                      /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(
+                    return /* @__PURE__ */ (0, import_jsx_runtime118.jsxs)("g", { transform: `translate(${x}, 0)`, children: [
+                      /* @__PURE__ */ (0, import_jsx_runtime118.jsx)("line", { y2: 6, className: "stroke-[hsl(var(--border))]" }),
+                      /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(
                         "text",
                         {
                           y: 20,
@@ -8332,7 +8546,7 @@ var AreaChart = ({
                       )
                     ] }, `x-tick-${i}`);
                   }),
-                  xAxisLabel && /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(
+                  xAxisLabel && /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(
                     "text",
                     {
                       x: chartWidth / 2,
@@ -8345,8 +8559,8 @@ var AreaChart = ({
                     }
                   )
                 ] }),
-                showYAxis && /* @__PURE__ */ (0, import_jsx_runtime117.jsxs)("g", { children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(
+                showYAxis && /* @__PURE__ */ (0, import_jsx_runtime118.jsxs)("g", { children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(
                     "line",
                     {
                       x1: 0,
@@ -8356,9 +8570,9 @@ var AreaChart = ({
                       className: "stroke-[hsl(var(--border))]"
                     }
                   ),
-                  yTicks.map((tick, i) => /* @__PURE__ */ (0, import_jsx_runtime117.jsxs)("g", { transform: `translate(0, ${yScale(tick)})`, children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime117.jsx)("line", { x2: -6, className: "stroke-[hsl(var(--border))]" }),
-                    /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(
+                  yTicks.map((tick, i) => /* @__PURE__ */ (0, import_jsx_runtime118.jsxs)("g", { transform: `translate(0, ${yScale(tick)})`, children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime118.jsx)("line", { x2: -6, className: "stroke-[hsl(var(--border))]" }),
+                    /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(
                       "text",
                       {
                         x: -12,
@@ -8370,7 +8584,7 @@ var AreaChart = ({
                       }
                     )
                   ] }, `y-tick-${i}`)),
-                  yAxisLabel && /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(
+                  yAxisLabel && /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(
                     "text",
                     {
                       x: -chartHeight / 2,
@@ -8388,8 +8602,8 @@ var AreaChart = ({
             ]
           }
         ),
-        showLegend && /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(Legend, { items: legendItems, layout: "horizontal", align: "center" }),
-        showTooltip && /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(
+        showLegend && /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(Legend, { items: legendItems, layout: "horizontal", align: "center" }),
+        showTooltip && /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(
           ChartTooltip,
           {
             ...tooltipData,
@@ -8403,8 +8617,8 @@ var AreaChart = ({
 };
 // src/charts/PieChart.tsx
-var import_react34 = require("react");
-var import_jsx_runtime118 = require("react/jsx-runtime");
+var import_react35 = require("react");
+var import_jsx_runtime119 = require("react/jsx-runtime");
 var PieChart = ({
   data,
   width: providedWidth,
@@ -8437,9 +8651,9 @@ var PieChart = ({
   colors = CHART_DEFAULTS.colors,
   ariaLabel
 }) => {
-  const containerRef = (0, import_react34.useRef)(null);
-  const [hoveredSlice, setHoveredSlice] = (0, import_react34.useState)(null);
-  const [activeSlice, setActiveSlice] = (0, import_react34.useState)(null);
+  const containerRef = (0, import_react35.useRef)(null);
+  const [hoveredSlice, setHoveredSlice] = (0, import_react35.useState)(null);
+  const [activeSlice, setActiveSlice] = (0, import_react35.useState)(null);
   const { tooltipData, showTooltip: showTooltipFn, hideTooltip } = useTooltip();
   const {
     width,
@@ -8466,11 +8680,11 @@ var PieChart = ({
   const outerRadius = providedOuterRadius || maxRadius;
   const innerRadius = providedInnerRadius ?? (donut ? outerRadius * 0.6 : 0);
   const isDonut = innerRadius > 0;
-  const total = (0, import_react34.useMemo)(
+  const total = (0, import_react35.useMemo)(
     () => data.reduce((sum, d) => sum + d.value, 0),
     [data]
   );
-  const slices = (0, import_react34.useMemo)(() => {
+  const slices = (0, import_react35.useMemo)(() => {
     const angleRange = endAngle - startAngle;
     let currentAngle = startAngle;
     return data.map((item, index) => {
@@ -8506,7 +8720,7 @@ var PieChart = ({
       };
     });
   }, [data, total, startAngle, endAngle, paddingAngle, centerX, centerY, outerRadius, innerRadius, isDonut, colors]);
-  const handleSliceEnter = (0, import_react34.useCallback)((e, index) => {
+  const handleSliceEnter = (0, import_react35.useCallback)((e, index) => {
     const slice = slices[index];
     setHoveredSlice(index);
     if (showTooltip && containerRef.current) {
@@ -8528,16 +8742,16 @@ var PieChart = ({
     }
     onSliceHover?.(data[index], index);
   }, [slices, data, showTooltip, showTooltipFn, onSliceHover]);
-  const handleSliceLeave = (0, import_react34.useCallback)(() => {
+  const handleSliceLeave = (0, import_react35.useCallback)(() => {
     setHoveredSlice(null);
     hideTooltip();
     onSliceHover?.(null, -1);
   }, [hideTooltip, onSliceHover]);
-  const handleSliceClick = (0, import_react34.useCallback)((index) => {
+  const handleSliceClick = (0, import_react35.useCallback)((index) => {
     setActiveSlice((prev) => prev === index ? null : index);
     onSliceClick?.(data[index], index);
   }, [data, onSliceClick]);
-  const getLabelText = (0, import_react34.useCallback)((slice) => {
+  const getLabelText = (0, import_react35.useCallback)((slice) => {
     if (labelFormatter) {
       return labelFormatter(data[slice.index], slice.percent);
     }
@@ -8552,7 +8766,7 @@ var PieChart = ({
         return `${slice.percent.toFixed(1)}%`;
     }
   }, [labelType, labelFormatter, data]);
-  const legendItems = (0, import_react34.useMemo)(
+  const legendItems = (0, import_react35.useMemo)(
     () => data.map((item, i) => ({
       name: `${item.label}${showPercentages ? ` (${(item.value / total * 100).toFixed(1)}%)` : ""}`,
       color: item.color || colors[i % colors.length],
@@ -8560,19 +8774,19 @@ var PieChart = ({
     })),
     [data, colors, total, showPercentages]
   );
-  const accessibleDescription = (0, import_react34.useMemo)(() => {
+  const accessibleDescription = (0, import_react35.useMemo)(() => {
     if (ariaLabel) return ariaLabel;
     const sliceNames = data.map((d) => `${d.label}: ${d.value}`).join(", ");
     return `${isDonut ? "Donut" : "Pie"} chart with ${data.length} slices: ${sliceNames}`;
   }, [data, isDonut, ariaLabel]);
-  return /* @__PURE__ */ (0, import_jsx_runtime118.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime119.jsxs)(
     "div",
     {
       ref: containerRef,
       className: `relative inline-flex flex-col items-center ${className}`,
       style: containerStyle,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime118.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime119.jsxs)(
           "svg",
           {
             width: svgWidth,
@@ -8584,7 +8798,7 @@ var PieChart = ({
             className: "bg-[hsl(var(--card))]",
             style: svgStyle,
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime118.jsx)("defs", { children: /* @__PURE__ */ (0, import_jsx_runtime118.jsx)("style", { children: `
+              /* @__PURE__ */ (0, import_jsx_runtime119.jsx)("defs", { children: /* @__PURE__ */ (0, import_jsx_runtime119.jsx)("style", { children: `
             @keyframes rotateIn {
               from {
                 transform: rotate(-90deg);
@@ -8600,7 +8814,7 @@ var PieChart = ({
               to { opacity: 1; }
             }
           ` }) }),
-              /* @__PURE__ */ (0, import_jsx_runtime118.jsx)("g", { style: animate ? {
+              /* @__PURE__ */ (0, import_jsx_runtime119.jsx)("g", { style: animate ? {
                 transformOrigin: `${centerX}px ${centerY}px`,
                 animation: `rotateIn ${animationDuration}ms ease-out forwards`
               } : void 0, children: slices.map((slice) => {
@@ -8608,8 +8822,8 @@ var PieChart = ({
                 const isActive = activeSlice === slice.index;
                 const scale = isHovered || isActive ? 1.03 : 1;
                 const transform = `translate(${centerX}px, ${centerY}px) scale(${scale}) translate(${-centerX}px, ${-centerY}px)`;
-                return /* @__PURE__ */ (0, import_jsx_runtime118.jsxs)("g", { children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(
+                return /* @__PURE__ */ (0, import_jsx_runtime119.jsxs)("g", { children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(
                     "path",
                     {
                       d: slice.path,
@@ -8623,7 +8837,7 @@ var PieChart = ({
                       onClick: () => handleSliceClick(slice.index)
                     }
                   ),
-                  showLabels && slice.percent >= minLabelPercent && /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(
+                  showLabels && slice.percent >= minLabelPercent && /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(
                     "text",
                     {
                       x: slice.labelX,
@@ -8642,8 +8856,8 @@ var PieChart = ({
                   )
                 ] }, slice.index);
               }) }),
-              isDonut && (centerLabel || centerValue !== void 0) && /* @__PURE__ */ (0, import_jsx_runtime118.jsxs)("g", { children: [
-                centerValue !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(
+              isDonut && (centerLabel || centerValue !== void 0) && /* @__PURE__ */ (0, import_jsx_runtime119.jsxs)("g", { children: [
+                centerValue !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(
                   "text",
                   {
                     x: centerX,
@@ -8656,7 +8870,7 @@ var PieChart = ({
                     children: typeof centerValue === "number" ? formatNumber(centerValue) : centerValue
                   }
                 ),
-                centerLabel && (typeof centerLabel === "string" ? /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(
+                centerLabel && (typeof centerLabel === "string" ? /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(
                   "text",
                   {
                     x: centerX,
@@ -8667,7 +8881,7 @@ var PieChart = ({
                     className: "fill-[hsl(var(--muted-foreground))]",
                     children: centerLabel
                   }
-                ) : /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(
+                ) : /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(
                   "foreignObject",
                   {
                     x: centerX - innerRadius * 0.7,
@@ -8681,7 +8895,7 @@ var PieChart = ({
             ]
           }
         ),
-        showLegend && /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(
+        showLegend && /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(
           Legend,
           {
             items: legendItems,
@@ -8692,7 +8906,7 @@ var PieChart = ({
             onMouseLeave: () => setHoveredSlice(null)
           }
         ),
-        showTooltip && /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(
+        showTooltip && /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(
           ChartTooltip,
           {
             ...tooltipData,
@@ -8706,8 +8920,8 @@ var PieChart = ({
 };
 // src/charts/ScatterChart.tsx
-var import_react35 = __toESM(require("react"));
-var import_jsx_runtime119 = require("react/jsx-runtime");
+var import_react36 = __toESM(require("react"));
+var import_jsx_runtime120 = require("react/jsx-runtime");
 function linearRegression(points) {
   const n = points.length;
   if (n === 0) return { slope: 0, intercept: 0 };
@@ -8728,7 +8942,7 @@ var renderShape = (shape, x, y, size, color, commonProps) => {
   const { className, stroke, strokeWidth, onMouseEnter, onMouseLeave, onClick } = commonProps;
   switch (shape) {
     case "square":
-      return /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(
+      return /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(
         "rect",
         {
           x: x - size / 2,
@@ -8747,7 +8961,7 @@ var renderShape = (shape, x, y, size, color, commonProps) => {
     case "triangle": {
       const h = size * 0.866;
       const points = `${x},${y - h / 2} ${x - size / 2},${y + h / 2} ${x + size / 2},${y + h / 2}`;
-      return /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(
+      return /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(
         "polygon",
         {
           points,
@@ -8764,7 +8978,7 @@ var renderShape = (shape, x, y, size, color, commonProps) => {
     case "diamond": {
       const d = size / 1.414;
       const diamondPoints = `${x},${y - d} ${x + d},${y} ${x},${y + d} ${x - d},${y}`;
-      return /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(
+      return /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(
         "polygon",
         {
           points: diamondPoints,
@@ -8780,7 +8994,7 @@ var renderShape = (shape, x, y, size, color, commonProps) => {
     }
     case "circle":
     default:
-      return /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(
+      return /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(
         "circle",
         {
           cx: x,
@@ -8834,8 +9048,8 @@ var ScatterChart = ({
   colors = CHART_DEFAULTS.colors,
   ariaLabel
 }) => {
-  const containerRef = (0, import_react35.useRef)(null);
-  const [hoveredPoint, setHoveredPoint] = (0, import_react35.useState)(null);
+  const containerRef = (0, import_react36.useRef)(null);
+  const [hoveredPoint, setHoveredPoint] = (0, import_react36.useState)(null);
   const { tooltipData, showTooltip: showTooltipFn, hideTooltip } = useTooltip();
   const {
     width,
@@ -8853,7 +9067,7 @@ var ScatterChart = ({
     providedHeight
   });
   const animate = animateProp && !_isResizing && !isResponsive;
-  const padding = (0, import_react35.useMemo)(() => ({
+  const padding = (0, import_react36.useMemo)(() => ({
     top: customPadding?.top ?? CHART_DEFAULTS.padding.top,
     right: customPadding?.right ?? CHART_DEFAULTS.padding.right,
     bottom: customPadding?.bottom ?? (showXAxis ? 60 : CHART_DEFAULTS.padding.bottom),
@@ -8861,52 +9075,52 @@ var ScatterChart = ({
   }), [customPadding, showXAxis, showYAxis]);
   const chartWidth = width - padding.left - padding.right;
   const chartHeight = height - padding.top - padding.bottom;
-  const allPoints = (0, import_react35.useMemo)(
+  const allPoints = (0, import_react36.useMemo)(
     () => data.flatMap((series) => series.data),
     [data]
   );
-  const xDomainCalc = (0, import_react35.useMemo)(() => {
+  const xDomainCalc = (0, import_react36.useMemo)(() => {
     if (xDomain) return xDomain;
     const xValues = allPoints.map((p) => p.x);
     return calculateDomain(xValues, { includeZero: false, padding: 0.1 });
   }, [allPoints, xDomain]);
-  const yDomainCalc = (0, import_react35.useMemo)(() => {
+  const yDomainCalc = (0, import_react36.useMemo)(() => {
     if (yDomain) return yDomain;
     const yValues = allPoints.map((p) => p.y);
     return calculateDomain(yValues, { includeZero: false, padding: 0.1 });
   }, [allPoints, yDomain]);
-  const zDomain = (0, import_react35.useMemo)(() => {
+  const zDomain = (0, import_react36.useMemo)(() => {
     if (!bubble) return [0, 1];
     const zValues = allPoints.map((p) => p.z || 0).filter((z) => z > 0);
     if (zValues.length === 0) return [0, 1];
     return [Math.min(...zValues), Math.max(...zValues)];
   }, [allPoints, bubble]);
-  const xScale = (0, import_react35.useMemo)(
+  const xScale = (0, import_react36.useMemo)(
     () => scaleLinear({
       domain: xDomainCalc,
       range: [0, chartWidth]
     }),
     [xDomainCalc, chartWidth]
   );
-  const yScale = (0, import_react35.useMemo)(
+  const yScale = (0, import_react36.useMemo)(
     () => scaleLinear({
       domain: yDomainCalc,
       range: [chartHeight, 0]
     }),
     [yDomainCalc, chartHeight]
   );
-  const sizeScale = (0, import_react35.useMemo)(() => {
+  const sizeScale = (0, import_react36.useMemo)(() => {
     if (!bubble) return () => pointSize;
     return scaleLinear({
       domain: zDomain,
       range: [minBubbleSize, maxBubbleSize]
     });
   }, [bubble, zDomain, minBubbleSize, maxBubbleSize, pointSize]);
-  const xTicks = (0, import_react35.useMemo)(() => getTicks(xDomainCalc, xAxisTickCount), [xDomainCalc, xAxisTickCount]);
-  const yTicks = (0, import_react35.useMemo)(() => getTicks(yDomainCalc, yAxisTickCount), [yDomainCalc, yAxisTickCount]);
-  const xFormatter = (0, import_react35.useMemo)(() => formatXValue || createTickFormatter(xDomainCalc), [formatXValue, xDomainCalc]);
-  const yFormatter = (0, import_react35.useMemo)(() => formatYValue || createTickFormatter(yDomainCalc), [formatYValue, yDomainCalc]);
-  const trendLines = (0, import_react35.useMemo)(() => {
+  const xTicks = (0, import_react36.useMemo)(() => getTicks(xDomainCalc, xAxisTickCount), [xDomainCalc, xAxisTickCount]);
+  const yTicks = (0, import_react36.useMemo)(() => getTicks(yDomainCalc, yAxisTickCount), [yDomainCalc, yAxisTickCount]);
+  const xFormatter = (0, import_react36.useMemo)(() => formatXValue || createTickFormatter(xDomainCalc), [formatXValue, xDomainCalc]);
+  const yFormatter = (0, import_react36.useMemo)(() => formatYValue || createTickFormatter(yDomainCalc), [formatYValue, yDomainCalc]);
+  const trendLines = (0, import_react36.useMemo)(() => {
     if (!showTrendLine) return [];
     return data.map((series) => {
       const regression = linearRegression(series.data);
@@ -8922,7 +9136,7 @@ var ScatterChart = ({
       };
     });
   }, [data, showTrendLine, xDomainCalc, xScale, yScale]);
-  const handlePointEnter = (0, import_react35.useCallback)((e, seriesIndex, pointIndex) => {
+  const handlePointEnter = (0, import_react36.useCallback)((e, seriesIndex, pointIndex) => {
     const series = data[seriesIndex];
     const point = series.data[pointIndex];
     setHoveredPoint({ seriesIndex, pointIndex });
@@ -8946,16 +9160,16 @@ var ScatterChart = ({
     }
     onPointHover?.(point, seriesIndex, pointIndex);
   }, [data, showTooltip, colors, bubble, showTooltipFn, onPointHover]);
-  const handlePointLeave = (0, import_react35.useCallback)(() => {
+  const handlePointLeave = (0, import_react36.useCallback)(() => {
     setHoveredPoint(null);
     hideTooltip();
     onPointHover?.(null, -1, -1);
   }, [hideTooltip, onPointHover]);
-  const handlePointClick = (0, import_react35.useCallback)((seriesIndex, pointIndex) => {
+  const handlePointClick = (0, import_react36.useCallback)((seriesIndex, pointIndex) => {
     const point = data[seriesIndex].data[pointIndex];
     onPointClick?.(point, seriesIndex, pointIndex);
   }, [data, onPointClick]);
-  const legendItems = (0, import_react35.useMemo)(
+  const legendItems = (0, import_react36.useMemo)(
     () => data.map((series, i) => ({
       name: series.name,
       color: series.color || colors[i % colors.length],
@@ -8963,14 +9177,14 @@ var ScatterChart = ({
     })),
     [data, colors]
   );
-  const referenceElements = (0, import_react35.useMemo)(() => {
+  const referenceElements = (0, import_react36.useMemo)(() => {
     if (!children) return null;
     const chartDimensions = { width: chartWidth, height: chartHeight, padding };
     const scales = { xScale, yScale };
-    return import_react35.default.Children.map(children, (child) => {
-      if (!import_react35.default.isValidElement(child)) return child;
+    return import_react36.default.Children.map(children, (child) => {
+      if (!import_react36.default.isValidElement(child)) return child;
       if (child.type === ReferenceLine || child.type === ReferenceArea || child.type === CartesianGrid) {
-        return import_react35.default.cloneElement(child, {
+        return import_react36.default.cloneElement(child, {
           _chartDimensions: chartDimensions,
           _scales: scales
         });
@@ -8978,19 +9192,19 @@ var ScatterChart = ({
       return child;
     });
   }, [children, chartWidth, chartHeight, padding, xScale, yScale]);
-  const accessibleDescription = (0, import_react35.useMemo)(() => {
+  const accessibleDescription = (0, import_react36.useMemo)(() => {
     if (ariaLabel) return ariaLabel;
     const totalPoints = data.reduce((sum, s) => sum + s.data.length, 0);
     return `Scatter chart with ${data.length} series and ${totalPoints} data points`;
   }, [data, ariaLabel]);
-  return /* @__PURE__ */ (0, import_jsx_runtime119.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime120.jsxs)(
     "div",
     {
       ref: containerRef,
       className: `relative ${className}`,
       style: containerStyle,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime119.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime120.jsxs)(
           "svg",
           {
             width: svgWidth,
@@ -9002,7 +9216,7 @@ var ScatterChart = ({
             className: "bg-[hsl(var(--card))]",
             style: svgStyle,
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime119.jsx)("defs", { children: /* @__PURE__ */ (0, import_jsx_runtime119.jsx)("style", { children: `
+              /* @__PURE__ */ (0, import_jsx_runtime120.jsx)("defs", { children: /* @__PURE__ */ (0, import_jsx_runtime120.jsx)("style", { children: `
             @keyframes popIn {
               from {
                 transform: scale(0);
@@ -9014,8 +9228,8 @@ var ScatterChart = ({
               }
             }
           ` }) }),
-              /* @__PURE__ */ (0, import_jsx_runtime119.jsxs)("g", { transform: `translate(${padding.left}, ${padding.top})`, children: [
-                showGrid && /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime120.jsxs)("g", { transform: `translate(${padding.left}, ${padding.top})`, children: [
+                showGrid && /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(
                   CartesianGrid,
                   {
                     _chartDimensions: { width: chartWidth, height: chartHeight },
@@ -9024,7 +9238,7 @@ var ScatterChart = ({
                   }
                 ),
                 referenceElements,
-                showTrendLine && trendLines.map((line, i) => /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(
+                showTrendLine && trendLines.map((line, i) => /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(
                   "line",
                   {
                     x1: line.x1,
@@ -9048,7 +9262,7 @@ var ScatterChart = ({
                     const size = bubble && point.z !== void 0 ? sizeScale(point.z) : baseSize;
                     const isHovered = hoveredPoint?.seriesIndex === seriesIndex && hoveredPoint?.pointIndex === pointIndex;
                     const displaySize = isHovered ? size * 1.3 : size;
-                    return /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(
+                    return /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(
                       "g",
                       {
                         style: animate ? {
@@ -9069,8 +9283,8 @@ var ScatterChart = ({
                     );
                   });
                 }),
-                showXAxis && /* @__PURE__ */ (0, import_jsx_runtime119.jsxs)("g", { transform: `translate(0, ${chartHeight})`, children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(
+                showXAxis && /* @__PURE__ */ (0, import_jsx_runtime120.jsxs)("g", { transform: `translate(0, ${chartHeight})`, children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(
                     "line",
                     {
                       x1: 0,
@@ -9080,9 +9294,9 @@ var ScatterChart = ({
                       className: "stroke-[hsl(var(--border))]"
                     }
                   ),
-                  xTicks.map((tick, i) => /* @__PURE__ */ (0, import_jsx_runtime119.jsxs)("g", { transform: `translate(${xScale(tick)}, 0)`, children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime119.jsx)("line", { y2: 6, className: "stroke-[hsl(var(--border))]" }),
-                    /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(
+                  xTicks.map((tick, i) => /* @__PURE__ */ (0, import_jsx_runtime120.jsxs)("g", { transform: `translate(${xScale(tick)}, 0)`, children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime120.jsx)("line", { y2: 6, className: "stroke-[hsl(var(--border))]" }),
+                    /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(
                       "text",
                       {
                         y: 20,
@@ -9093,7 +9307,7 @@ var ScatterChart = ({
                       }
                     )
                   ] }, `x-tick-${i}`)),
-                  xAxisLabel && /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(
+                  xAxisLabel && /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(
                     "text",
                     {
                       x: chartWidth / 2,
@@ -9106,8 +9320,8 @@ var ScatterChart = ({
                     }
                   )
                 ] }),
-                showYAxis && /* @__PURE__ */ (0, import_jsx_runtime119.jsxs)("g", { children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(
+                showYAxis && /* @__PURE__ */ (0, import_jsx_runtime120.jsxs)("g", { children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(
                     "line",
                     {
                       x1: 0,
@@ -9117,9 +9331,9 @@ var ScatterChart = ({
                       className: "stroke-[hsl(var(--border))]"
                     }
                   ),
-                  yTicks.map((tick, i) => /* @__PURE__ */ (0, import_jsx_runtime119.jsxs)("g", { transform: `translate(0, ${yScale(tick)})`, children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime119.jsx)("line", { x2: -6, className: "stroke-[hsl(var(--border))]" }),
-                    /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(
+                  yTicks.map((tick, i) => /* @__PURE__ */ (0, import_jsx_runtime120.jsxs)("g", { transform: `translate(0, ${yScale(tick)})`, children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime120.jsx)("line", { x2: -6, className: "stroke-[hsl(var(--border))]" }),
+                    /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(
                       "text",
                       {
                         x: -12,
@@ -9131,7 +9345,7 @@ var ScatterChart = ({
                       }
                     )
                   ] }, `y-tick-${i}`)),
-                  yAxisLabel && /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(
+                  yAxisLabel && /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(
                     "text",
                     {
                       x: -chartHeight / 2,
@@ -9149,8 +9363,8 @@ var ScatterChart = ({
             ]
           }
         ),
-        showLegend && /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(Legend, { items: legendItems, layout: "horizontal", align: "center" }),
-        showTooltip && /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(
+        showLegend && /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(Legend, { items: legendItems, layout: "horizontal", align: "center" }),
+        showTooltip && /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(
           ChartTooltip,
           {
             ...tooltipData,
@@ -9164,8 +9378,8 @@ var ScatterChart = ({
 };
 // src/charts/components/ResponsiveContainer.tsx
-var import_react36 = __toESM(require("react"));
-var import_jsx_runtime120 = require("react/jsx-runtime");
+var import_react37 = __toESM(require("react"));
+var import_jsx_runtime121 = require("react/jsx-runtime");
 var ResponsiveContainer = ({
   width = "100%",
   height,
@@ -9179,13 +9393,13 @@ var ResponsiveContainer = ({
   children,
   onResize
 }) => {
-  const containerRef = (0, import_react36.useRef)(null);
-  const [dimensions, setDimensions] = (0, import_react36.useState)({
+  const containerRef = (0, import_react37.useRef)(null);
+  const [dimensions, setDimensions] = (0, import_react37.useState)({
     width: 0,
     height: 0
   });
-  const debounceTimerRef = (0, import_react36.useRef)(null);
-  const calculateDimensions = (0, import_react36.useCallback)((containerWidth, containerHeight) => {
+  const debounceTimerRef = (0, import_react37.useRef)(null);
+  const calculateDimensions = (0, import_react37.useCallback)((containerWidth, containerHeight) => {
     let finalWidth = containerWidth;
     let finalHeight = containerHeight;
     if (aspect && !height) {
@@ -9201,7 +9415,7 @@ var ResponsiveContainer = ({
     }
     return { width: finalWidth, height: finalHeight };
   }, [aspect, height, minWidth, minHeight, maxWidth, maxHeight]);
-  const handleResize = (0, import_react36.useCallback)((entries) => {
+  const handleResize = (0, import_react37.useCallback)((entries) => {
     const entry = entries[0];
     if (!entry) return;
     const { width: containerWidth, height: containerHeight } = entry.contentRect;
@@ -9219,7 +9433,7 @@ var ResponsiveContainer = ({
       updateDimensions();
     }
   }, [calculateDimensions, debounce, onResize]);
-  (0, import_react36.useEffect)(() => {
+  (0, import_react37.useEffect)(() => {
     const container = containerRef.current;
     if (!container) return;
     const observer = new ResizeObserver(handleResize);
@@ -9243,7 +9457,7 @@ var ResponsiveContainer = ({
     maxHeight: maxHeight ? `${maxHeight}px` : void 0
   };
   if (dimensions.width === 0 || dimensions.height === 0) {
-    return /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
       "div",
       {
         ref: containerRef,
@@ -9252,14 +9466,14 @@ var ResponsiveContainer = ({
       }
     );
   }
-  const chartElement = import_react36.default.cloneElement(
+  const chartElement = import_react37.default.cloneElement(
     children,
     {
       width: dimensions.width,
       height: dimensions.height
     }
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
     "div",
     {
       ref: containerRef,
@@ -9271,8 +9485,8 @@ var ResponsiveContainer = ({
 };
 // src/components/Heatmap.tsx
-var import_react37 = __toESM(require("react"));
-var import_jsx_runtime121 = require("react/jsx-runtime");
+var import_react38 = __toESM(require("react"));
+var import_jsx_runtime122 = require("react/jsx-runtime");
 var COLOR_SCALES = {
   blue: {
     light: ["#eff6ff", "#dbeafe", "#bfdbfe", "#93c5fd", "#60a5fa", "#3b82f6", "#2563eb", "#1d4ed8", "#1e40af"],
@@ -9315,9 +9529,9 @@ var Heatmap = ({
   formatValue = (v) => v.toFixed(0),
   formatTooltip
 }) => {
-  const [hoveredCell, setHoveredCell] = (0, import_react37.useState)(null);
-  const [isDarkMode, setIsDarkMode] = (0, import_react37.useState)(false);
-  import_react37.default.useEffect(() => {
+  const [hoveredCell, setHoveredCell] = (0, import_react38.useState)(null);
+  const [isDarkMode, setIsDarkMode] = (0, import_react38.useState)(false);
+  import_react38.default.useEffect(() => {
     const checkDarkMode = () => {
       setIsDarkMode(document.documentElement.classList.contains("dark"));
     };
@@ -9326,7 +9540,7 @@ var Heatmap = ({
     observer.observe(document.documentElement, { attributes: true, attributeFilter: ["class"] });
     return () => observer.disconnect();
   }, []);
-  const { uniqueX, uniqueY, dataMap, minValue, maxValue } = (0, import_react37.useMemo)(() => {
+  const { uniqueX, uniqueY, dataMap, minValue, maxValue } = (0, import_react38.useMemo)(() => {
     const xSet = /* @__PURE__ */ new Set();
     const ySet = /* @__PURE__ */ new Set();
     const map = /* @__PURE__ */ new Map();
@@ -9377,15 +9591,15 @@ var Heatmap = ({
   const labelHeight = 30;
   const width = labelWidth + uniqueX.length * (cellSize + cellGap);
   const height = labelHeight + uniqueY.length * (cellSize + cellGap);
-  return /* @__PURE__ */ (0, import_jsx_runtime121.jsxs)("div", { className: `relative inline-block ${className}`, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime121.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime122.jsxs)("div", { className: `relative inline-block ${className}`, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime122.jsxs)(
       "svg",
       {
         width,
         height,
         className: "select-none",
         children: [
-          uniqueX.map((label, i) => /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
+          uniqueX.map((label, i) => /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
             "text",
             {
               x: labelWidth + i * (cellSize + cellGap) + cellSize / 2,
@@ -9397,7 +9611,7 @@ var Heatmap = ({
             },
             `x-${label}`
           )),
-          uniqueY.map((label, j) => /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
+          uniqueY.map((label, j) => /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
             "text",
             {
               x: labelWidth - 8,
@@ -9415,8 +9629,8 @@ var Heatmap = ({
               const point = data.find((d) => String(d.x) === xLabel && String(d.y) === yLabel);
               const x = labelWidth + i * (cellSize + cellGap);
               const y = labelHeight + j * (cellSize + cellGap);
-              return /* @__PURE__ */ (0, import_jsx_runtime121.jsxs)("g", { children: [
-                /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
+              return /* @__PURE__ */ (0, import_jsx_runtime122.jsxs)("g", { children: [
+                /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
                   "rect",
                   {
                     x,
@@ -9439,7 +9653,7 @@ var Heatmap = ({
                     }
                   }
                 ),
-                showValues && value !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
+                showValues && value !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
                   "text",
                   {
                     x: x + cellSize / 2,
@@ -9456,7 +9670,7 @@ var Heatmap = ({
         ]
       }
     ),
-    showTooltip && hoveredCell && /* @__PURE__ */ (0, import_jsx_runtime121.jsxs)(
+    showTooltip && hoveredCell && /* @__PURE__ */ (0, import_jsx_runtime122.jsxs)(
       "div",
       {
         className: "absolute z-50 px-3 py-2 text-sm bg-[hsl(var(--popover))] text-[hsl(var(--popover-foreground))] border border-[hsl(var(--border))] rounded-lg shadow-lg pointer-events-none whitespace-nowrap",
@@ -9467,7 +9681,7 @@ var Heatmap = ({
         },
         children: [
           getTooltipContent(hoveredCell.point),
-          /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
             "div",
             {
               className: "absolute w-2 h-2 bg-[hsl(var(--popover))] rotate-45",
@@ -9498,9 +9712,9 @@ var CalendarHeatmap = ({
   onCellClick,
   formatTooltip
 }) => {
-  const [hoveredCell, setHoveredCell] = (0, import_react37.useState)(null);
-  const [isDarkMode, setIsDarkMode] = (0, import_react37.useState)(false);
-  import_react37.default.useEffect(() => {
+  const [hoveredCell, setHoveredCell] = (0, import_react38.useState)(null);
+  const [isDarkMode, setIsDarkMode] = (0, import_react38.useState)(false);
+  import_react38.default.useEffect(() => {
     const checkDarkMode = () => {
       setIsDarkMode(document.documentElement.classList.contains("dark"));
     };
@@ -9509,7 +9723,7 @@ var CalendarHeatmap = ({
     observer.observe(document.documentElement, { attributes: true, attributeFilter: ["class"] });
     return () => observer.disconnect();
   }, []);
-  const { weeks, minValue, maxValue, dataMap, monthLabels } = (0, import_react37.useMemo)(() => {
+  const { weeks, minValue, maxValue, dataMap, monthLabels } = (0, import_react38.useMemo)(() => {
     const map = /* @__PURE__ */ new Map();
     let min = Infinity;
     let max = -Infinity;
@@ -9569,9 +9783,9 @@ var CalendarHeatmap = ({
   const monthLabelHeight = showMonthLabels ? 20 : 0;
   const width = dayLabelWidth + weeks.length * (cellSize + cellGap);
   const height = monthLabelHeight + 7 * (cellSize + cellGap);
-  return /* @__PURE__ */ (0, import_jsx_runtime121.jsxs)("div", { className: `relative inline-block ${className}`, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime121.jsxs)("svg", { width, height, className: "select-none", children: [
-      showMonthLabels && monthLabels.map(({ label, weekIndex }, i) => /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime122.jsxs)("div", { className: `relative inline-block ${className}`, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime122.jsxs)("svg", { width, height, className: "select-none", children: [
+      showMonthLabels && monthLabels.map(({ label, weekIndex }, i) => /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
         "text",
         {
           x: dayLabelWidth + weekIndex * (cellSize + cellGap),
@@ -9582,7 +9796,7 @@ var CalendarHeatmap = ({
         },
         `month-${i}`
       )),
-      showDayLabels && [1, 3, 5].map((dayIndex) => /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
+      showDayLabels && [1, 3, 5].map((dayIndex) => /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
         "text",
         {
           x: dayLabelWidth - 6,
@@ -9600,7 +9814,7 @@ var CalendarHeatmap = ({
           const value = dataMap.get(key);
           const x = dayLabelWidth + weekIndex * (cellSize + cellGap);
           const y = monthLabelHeight + dayIndex * (cellSize + cellGap);
-          return /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
+          return /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
             "rect",
             {
               x,
@@ -9625,7 +9839,7 @@ var CalendarHeatmap = ({
         })
       )
     ] }),
-    hoveredCell && /* @__PURE__ */ (0, import_jsx_runtime121.jsxs)(
+    hoveredCell && /* @__PURE__ */ (0, import_jsx_runtime122.jsxs)(
       "div",
       {
         className: "absolute z-50 px-3 py-2 text-sm bg-[hsl(var(--popover))] text-[hsl(var(--popover-foreground))] border border-[hsl(var(--border))] rounded-lg shadow-lg pointer-events-none whitespace-nowrap",
@@ -9636,7 +9850,7 @@ var CalendarHeatmap = ({
         },
         children: [
           getTooltipContent(hoveredCell.date, hoveredCell.value),
-          /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
             "div",
             {
               className: "absolute w-2 h-2 bg-[hsl(var(--popover))] rotate-45",
@@ -9654,7 +9868,7 @@ var CalendarHeatmap = ({
 };
 // src/theme/ColorSchemeScript.tsx
-var import_jsx_runtime122 = require("react/jsx-runtime");
+var import_jsx_runtime123 = require("react/jsx-runtime");
 function getColorSchemeScript(defaultColorMode, localStorageKey) {
   return `(function(){try{var d=document.documentElement,s=d.style,c=localStorage.getItem('${localStorageKey}')||'${defaultColorMode}',r=c;if(c==='system'||!c)r=matchMedia('(prefers-color-scheme:dark)').matches?'dark':'light';d.setAttribute('data-color-mode',r);s.colorScheme=r;if(r==='dark'){d.classList.add('dark');s.setProperty('--background','0 0% 3.9%');s.setProperty('--foreground','0 0% 98%');s.setProperty('--card','0 0% 5.9%');s.setProperty('--card-foreground','0 0% 98%');s.setProperty('--popover','0 0% 5.9%');s.setProperty('--popover-foreground','0 0% 98%');s.setProperty('--muted','0 0% 14.9%');s.setProperty('--muted-foreground','0 0% 63.9%');s.setProperty('--border','0 0% 25%');s.setProperty('--input','0 0% 25%');s.setProperty('--primary','217 91% 60%');s.setProperty('--secondary','0 0% 14.9%');s.setProperty('--accent','0 0% 14.9%');s.backgroundColor='hsl(0,0%,3.9%)';s.color='hsl(0,0%,98%)'}else{d.classList.remove('dark');s.backgroundColor='hsl(0,0%,100%)';s.color='hsl(0,0%,3.9%)'}d.setAttribute('data-theme-initialized','true')}catch(e){}})()`;
 }
@@ -9664,7 +9878,7 @@ function ColorSchemeScript({
   nonce
 } = {}) {
   const scriptContent = getColorSchemeScript(defaultColorMode, localStorageKey);
-  return /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(
     "script",
     {
       nonce,
@@ -9776,6 +9990,7 @@ function getThemeScript() {
   SaveIcon,
   ScatterChart,
   SearchIcon,
+  SegmentedControl,
   Select,
   SettingsIcon,
   ShieldIcon,