@hyddenlabs/hydn-ui 0.3.0-alpha.99 → 0.3.1

package/dist/index.cjs

@@ -1,4425 +0,0 @@
-'use strict';
-
-var jsxRuntime = require('react/jsx-runtime');
-var React5 = require('react');
-var iconsReact = require('@tabler/icons-react');
-var reactRouterDom = require('react-router-dom');
-var reactDom = require('react-dom');
-
-function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
-
-var React5__default = /*#__PURE__*/_interopDefault(React5);
-
-// src/components/forms/button/button.tsx
-function Button({
-  children,
-  onClick,
-  ariaLabel,
-  disabled = false,
-  type = "button",
-  className = "",
-  icon,
-  iconPosition = "left",
-  variant = "neutral",
-  style = "solid",
-  size = "md",
-  rounded = "default",
-  loading = false,
-  fullWidth = false,
-  wide = false,
-  active = false
-}) {
-  const isIconOnly = icon && !children;
-  if (isIconOnly && !ariaLabel) {
-    console.warn("Button: Icon-only buttons require an ariaLabel for accessibility");
-  }
-  const solidVariantClasses = {
-    neutral: "bg-neutral text-neutral-foreground hover:bg-neutral/90 active:bg-neutral/80",
-    primary: "bg-primary text-primary-foreground hover:bg-primary/90 active:bg-primary/80",
-    secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/90 active:bg-secondary/80",
-    accent: "bg-accent text-accent-foreground hover:bg-accent/90 active:bg-accent/80",
-    info: "bg-info text-info-foreground hover:bg-info/90 active:bg-info/80",
-    success: "bg-success text-success-foreground hover:bg-success/90 active:bg-success/80",
-    warning: "bg-warning text-warning-foreground hover:bg-warning/90 active:bg-warning/80",
-    error: "bg-destructive text-destructive-foreground hover:bg-destructive/90 active:bg-destructive/80"
-  };
-  const outlineVariantClasses = {
-    neutral: "border-2 border-neutral text-neutral bg-transparent hover:bg-neutral hover:text-neutral-foreground",
-    primary: "border-2 border-primary text-primary bg-transparent hover:bg-primary hover:text-primary-foreground",
-    secondary: "border-2 border-secondary text-secondary bg-transparent hover:bg-secondary hover:text-secondary-foreground",
-    accent: "border-2 border-accent text-accent bg-transparent hover:bg-accent hover:text-accent-foreground",
-    info: "border-2 border-info text-info bg-transparent hover:bg-info hover:text-info-foreground",
-    success: "border-2 border-success text-success bg-transparent hover:bg-success hover:text-success-foreground",
-    warning: "border-2 border-warning text-warning bg-transparent hover:bg-warning hover:text-warning-foreground",
-    error: "border-2 border-destructive text-destructive bg-transparent hover:bg-destructive hover:text-destructive-foreground"
-  };
-  const ghostVariantClasses = {
-    neutral: "bg-transparent text-foreground hover:bg-neutral/10 active:bg-neutral/20",
-    primary: "bg-transparent text-primary hover:bg-primary/10 active:bg-primary/20",
-    secondary: "bg-transparent text-secondary hover:bg-secondary/10 active:bg-secondary/20",
-    accent: "bg-transparent text-accent hover:bg-accent/10 active:bg-accent/20",
-    info: "bg-transparent text-info hover:bg-info/10 active:bg-info/20",
-    success: "bg-transparent text-success hover:bg-success/10 active:bg-success/20",
-    warning: "bg-transparent text-warning hover:bg-warning/10 active:bg-warning/20",
-    error: "bg-transparent text-destructive hover:bg-destructive/10 active:bg-destructive/20"
-  };
-  const softVariantClasses = {
-    neutral: "bg-neutral/20 text-foreground hover:bg-neutral/30 active:bg-neutral/40",
-    primary: "bg-primary/20 text-primary hover:bg-primary/30 active:bg-primary/40",
-    secondary: "bg-secondary/20 text-secondary hover:bg-secondary/30 active:bg-secondary/40",
-    accent: "bg-accent/20 text-accent hover:bg-accent/30 active:bg-accent/40",
-    info: "bg-info/20 text-info hover:bg-info/30 active:bg-info/40",
-    success: "bg-success/20 text-success hover:bg-success/30 active:bg-success/40",
-    warning: "bg-warning/20 text-warning hover:bg-warning/30 active:bg-warning/40",
-    error: "bg-destructive/20 text-destructive hover:bg-destructive/30 active:bg-destructive/40"
-  };
-  const linkVariantClasses = {
-    neutral: "bg-transparent text-foreground underline-offset-4 hover:underline",
-    primary: "bg-transparent text-primary underline-offset-4 hover:underline",
-    secondary: "bg-transparent text-secondary underline-offset-4 hover:underline",
-    accent: "bg-transparent text-accent underline-offset-4 hover:underline",
-    info: "bg-transparent text-info underline-offset-4 hover:underline",
-    success: "bg-transparent text-success underline-offset-4 hover:underline",
-    warning: "bg-transparent text-warning underline-offset-4 hover:underline",
-    error: "bg-transparent text-destructive underline-offset-4 hover:underline"
-  };
-  const getStyleClasses = () => {
-    const variantKey = variant;
-    switch (style) {
-      case "outline":
-        return `${outlineVariantClasses[variantKey]} active:scale-95`;
-      case "ghost":
-        return ghostVariantClasses[variantKey];
-      case "link":
-        return linkVariantClasses[variantKey];
-      case "soft":
-        return softVariantClasses[variantKey];
-      case "solid":
-      default:
-        return `${solidVariantClasses[variantKey]} shadow-sm hover:shadow-md`;
-    }
-  };
-  const sizeClasses = {
-    xs: "h-6 px-2 text-xs min-h-6",
-    sm: "h-8 px-3 text-sm min-h-8",
-    md: "h-10 px-4 text-base min-h-10",
-    lg: "h-12 px-6 text-lg min-h-12",
-    xl: "h-14 px-8 text-xl min-h-14"
-  };
-  const roundedClasses = {
-    default: "rounded-md",
-    pill: "rounded-full",
-    square: "rounded-none aspect-square",
-    circle: "rounded-full aspect-square"
-  };
-  const displayIcon = loading ? /* @__PURE__ */ jsxRuntime.jsxs("svg", { className: "animate-spin h-4 w-4", xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", children: [
-    /* @__PURE__ */ jsxRuntime.jsx("circle", { className: "opacity-25", cx: "12", cy: "12", r: "10", stroke: "currentColor", strokeWidth: "4" }),
-    /* @__PURE__ */ jsxRuntime.jsx(
-      "path",
-      {
-        className: "opacity-75",
-        fill: "currentColor",
-        d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
-      }
-    )
-  ] }) : icon;
-  const styleClasses = getStyleClasses();
-  const widthClasses = fullWidth ? "w-full" : wide ? "px-8" : "";
-  const activeClasses = active ? "active:scale-95" : "";
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    "button",
-    {
-      type,
-      onClick,
-      "aria-label": ariaLabel,
-      disabled: disabled || loading,
-      className: `inline-flex items-center justify-center ${roundedClasses[rounded]} font-medium transition-all duration-200 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 cursor-pointer disabled:cursor-not-allowed disabled:opacity-50 ${styleClasses} ${sizeClasses[size]} ${isIconOnly ? "p-0" : ""} ${widthClasses} ${activeClasses} ${className}`,
-      children: [
-        displayIcon && iconPosition === "left" && /* @__PURE__ */ jsxRuntime.jsx("span", { className: `inline-flex ${children ? "mr-2" : ""}`, children: displayIcon }),
-        children,
-        displayIcon && iconPosition === "right" && /* @__PURE__ */ jsxRuntime.jsx("span", { className: `inline-flex ${children ? "ml-2" : ""}`, children: displayIcon })
-      ]
-    }
-  );
-}
-Button.displayName = "Button";
-var button_default = Button;
-function Input({
-  value,
-  onChange,
-  placeholder,
-  disabled = false,
-  type = "text",
-  className = "",
-  ariaLabel,
-  id,
-  name,
-  required = false,
-  size = "md",
-  validationState = "default"
-}) {
-  const sizeClasses = {
-    sm: "h-8 px-3 py-1.5 text-sm",
-    md: "h-10 px-3 py-2 text-sm",
-    lg: "h-12 px-4 py-3 text-base"
-  };
-  const validationClasses = {
-    default: "border-input focus:border-ring",
-    error: "border-destructive focus:border-destructive",
-    success: "border-success focus:border-success",
-    warning: "border-warning focus:border-warning"
-  };
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    "input",
-    {
-      type,
-      value,
-      onChange,
-      placeholder,
-      disabled,
-      "aria-label": ariaLabel,
-      id,
-      name,
-      required,
-      "aria-invalid": validationState === "error",
-      className: `flex w-full rounded-lg border bg-background shadow-sm transition-all duration-200 file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring/20 focus:ring-offset-0 disabled:cursor-not-allowed disabled:opacity-50 disabled:bg-muted/50 ${sizeClasses[size]} ${validationClasses[validationState]} ${className}`
-    }
-  );
-}
-Input.displayName = "Input";
-var input_default = Input;
-function Checkbox({
-  checked,
-  onChange,
-  disabled = false,
-  className = "",
-  ariaLabel,
-  id,
-  name,
-  validationState = "default"
-}) {
-  const validationClasses = {
-    default: "border-input focus:ring-ring",
-    error: "border-destructive focus:ring-destructive",
-    success: "border-success focus:ring-success",
-    warning: "border-warning focus:ring-warning"
-  };
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    "input",
-    {
-      type: "checkbox",
-      checked,
-      onChange,
-      disabled,
-      "aria-label": ariaLabel,
-      "aria-invalid": validationState === "error",
-      id,
-      name,
-      className: `h-4 w-4 rounded border-2 bg-background text-primary-foreground transition-all duration-200 ease-in-out focus:outline-none focus:ring-2 focus:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 disabled:bg-muted/50 checked:bg-primary checked:border-primary checked:hover:bg-primary/90 hover:border-primary/50 hover:shadow-sm cursor-pointer accent-primary ${validationClasses[validationState]} ${className}`
-    }
-  );
-}
-Checkbox.displayName = "Checkbox";
-var checkbox_default = Checkbox;
-var RadioGroupContext = React5.createContext(null);
-var useRadioGroup = () => {
-  const context = React5.useContext(RadioGroupContext);
-  return context;
-};
-function RadioGroup({
-  children,
-  name,
-  label,
-  orientation = "vertical",
-  className = "",
-  value,
-  onChange
-}) {
-  const orientationClasses = orientation === "horizontal" ? "flex flex-row gap-4" : "flex flex-col gap-2";
-  return /* @__PURE__ */ jsxRuntime.jsx(RadioGroupContext.Provider, { value: { name, value, onChange }, children: /* @__PURE__ */ jsxRuntime.jsxs("fieldset", { className, children: [
-    label && /* @__PURE__ */ jsxRuntime.jsx("legend", { className: "text-sm font-medium text-foreground mb-2", children: label }),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: orientationClasses, role: "radiogroup", children })
-  ] }) });
-}
-RadioGroup.displayName = "RadioGroup";
-var radio_group_default = RadioGroup;
-function Radio({
-  checked,
-  onChange,
-  disabled = false,
-  className = "",
-  ariaLabel,
-  id,
-  name: nameProp,
-  value,
-  validationState = "default"
-}) {
-  const radioGroup = useRadioGroup();
-  const name = radioGroup?.name || nameProp;
-  const isChecked = radioGroup?.value !== void 0 ? radioGroup.value === value : checked;
-  const handleChange = (e) => {
-    if (radioGroup?.onChange && value) {
-      radioGroup.onChange(value);
-    }
-    onChange?.(e);
-  };
-  const validationClasses = {
-    default: "border-input focus:ring-ring",
-    error: "border-destructive focus:ring-destructive",
-    success: "border-success focus:ring-success",
-    warning: "border-warning focus:ring-warning"
-  };
-  const generatedId = React5.useId();
-  const inputId = id || `radio-${value || generatedId}`;
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    "div",
-    {
-      className: `inline-flex items-center justify-center relative ${disabled ? "opacity-60 cursor-not-allowed" : "cursor-pointer"}`,
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsx(
-          "input",
-          {
-            type: "radio",
-            checked: isChecked,
-            onChange: handleChange,
-            disabled,
-            "aria-label": ariaLabel,
-            "aria-invalid": validationState === "error" ? "true" : void 0,
-            id: inputId,
-            name,
-            value,
-            className: "peer sr-only"
-          }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          "span",
-          {
-            "aria-hidden": "true",
-            onClick: () => !disabled && document.getElementById(inputId)?.click(),
-            className: `w-5 h-5 rounded-full border-2 flex items-center justify-center transition-all duration-200 ease-out bg-background shadow-sm
-        before:content-[''] before:w-2.5 before:h-2.5 before:rounded-full before:scale-0 before:transition-transform before:duration-200 before:ease-out before:bg-primary
-        peer-checked:before:scale-100 peer-checked:border-primary
-        peer-focus-visible:ring-2 peer-focus-visible:ring-offset-2 peer-focus-visible:ring-ring
-        peer-disabled:opacity-50 peer-disabled:cursor-not-allowed
-        peer-hover:border-primary/60 peer-active:scale-95
-        ${validationClasses[validationState]} ${className}`
-          }
-        )
-      ]
-    }
-  );
-}
-Radio.displayName = "Radio";
-var radio_default = Radio;
-function Select({
-  value,
-  onChange,
-  disabled = false,
-  className = "",
-  ariaLabel,
-  id,
-  name,
-  children,
-  required = false,
-  size = "md",
-  validationState = "default"
-}) {
-  const sizeClasses = {
-    sm: "h-8 px-3 py-1.5 text-sm",
-    md: "h-10 px-3 py-2 text-sm pr-10",
-    lg: "h-12 px-4 py-3 text-base pr-10"
-  };
-  const validationClasses = {
-    default: "border-input focus:border-ring",
-    error: "border-destructive focus:border-destructive",
-    success: "border-success focus:border-success",
-    warning: "border-warning focus:border-warning"
-  };
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    "select",
-    {
-      value,
-      onChange,
-      disabled,
-      "aria-label": ariaLabel,
-      id,
-      name,
-      required,
-      "aria-invalid": validationState === "error",
-      className: `flex w-full rounded-lg border bg-background shadow-sm transition-all duration-200 focus:outline-none focus:ring-2 focus:ring-ring/20 focus:ring-offset-0 disabled:cursor-not-allowed disabled:opacity-50 disabled:bg-muted/50 appearance-none bg-[url('data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20fill%3D%22none%22%20viewBox%3D%220%200%2020%2020%22%3E%3Cpath%20stroke%3D%22%236b7280%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.5%22%20d%3D%22M6%208l4%204%204-4%22%2F%3E%3C%2Fsvg%3E')] bg-[length:1.5em] bg-[right_0.5rem_center] bg-no-repeat ${sizeClasses[size]} ${validationClasses[validationState]} ${className}`,
-      children
-    }
-  );
-}
-Select.displayName = "Select";
-var select_default = Select;
-function SelectItem({ value, disabled = false, children }) {
-  return /* @__PURE__ */ jsxRuntime.jsx("option", { value, disabled, children });
-}
-SelectItem.displayName = "SelectItem";
-var select_item_default = SelectItem;
-function MultiSelect({
-  options,
-  value = [],
-  onChange,
-  placeholder = "Select options...",
-  disabled = false,
-  maxSelections,
-  size = "md",
-  className = ""
-}) {
-  const [isOpen, setIsOpen] = React5.useState(false);
-  const [searchQuery, setSearchQuery] = React5.useState("");
-  const [focusedIndex, setFocusedIndex] = React5.useState(-1);
-  const containerRef = React5.useRef(null);
-  const searchInputRef = React5.useRef(null);
-  const selectedValues = value || [];
-  React5.useEffect(() => {
-    const handleClickOutside = (event) => {
-      if (containerRef.current && !containerRef.current.contains(event.target)) {
-        setIsOpen(false);
-        setSearchQuery("");
-      }
-    };
-    if (isOpen) {
-      document.addEventListener("mousedown", handleClickOutside);
-      return () => document.removeEventListener("mousedown", handleClickOutside);
-    }
-    return void 0;
-  }, [isOpen]);
-  React5.useEffect(() => {
-    if (isOpen && searchInputRef.current) {
-      searchInputRef.current.focus();
-    }
-  }, [isOpen]);
-  const filteredOptions = options.filter((option) => option.label.toLowerCase().includes(searchQuery.toLowerCase()));
-  const handleToggleOption = (optionValue) => {
-    const isSelected = selectedValues.includes(optionValue);
-    let newValues;
-    if (isSelected) {
-      newValues = selectedValues.filter((v) => v !== optionValue);
-    } else {
-      if (maxSelections && selectedValues.length >= maxSelections) {
-        return;
-      }
-      newValues = [...selectedValues, optionValue];
-    }
-    onChange?.(newValues);
-  };
-  const handleRemoveValue = (valueToRemove, e) => {
-    e.stopPropagation();
-    const newValues = selectedValues.filter((v) => v !== valueToRemove);
-    onChange?.(newValues);
-  };
-  const handleClearAll = (e) => {
-    e.stopPropagation();
-    onChange?.([]);
-  };
-  const handleKeyDown = (e) => {
-    if (disabled) return;
-    switch (e.key) {
-      case "Enter":
-        e.preventDefault();
-        if (!isOpen) {
-          setIsOpen(true);
-        } else if (focusedIndex >= 0 && focusedIndex < filteredOptions.length) {
-          handleToggleOption(filteredOptions[focusedIndex].value);
-        }
-        break;
-      case "Escape":
-        e.preventDefault();
-        setIsOpen(false);
-        setSearchQuery("");
-        break;
-      case "ArrowDown":
-        e.preventDefault();
-        if (!isOpen) {
-          setIsOpen(true);
-        } else {
-          setFocusedIndex((prev) => prev < filteredOptions.length - 1 ? prev + 1 : prev);
-        }
-        break;
-      case "ArrowUp":
-        e.preventDefault();
-        setFocusedIndex((prev) => prev > 0 ? prev - 1 : 0);
-        break;
-    }
-  };
-  const sizeClasses = {
-    sm: { container: "min-h-8 py-1 px-2", text: "text-sm", chip: "text-xs px-1.5 py-0.5", icon: 14 },
-    md: { container: "min-h-10 py-2 px-3", text: "text-base", chip: "text-sm px-2 py-1", icon: 16 },
-    lg: { container: "min-h-12 py-2 px-4", text: "text-lg", chip: "text-base px-2.5 py-1", icon: 18 }
-  };
-  const currentSize = sizeClasses[size];
-  const getSelectedLabels = () => {
-    return selectedValues.map((v) => options.find((opt) => opt.value === v)?.label).filter(Boolean);
-  };
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { ref: containerRef, className: `relative w-full ${className}`, children: [
-    /* @__PURE__ */ jsxRuntime.jsxs(
-      "div",
-      {
-        className: `
-          w-full flex flex-wrap items-center gap-1.5
-          border border-input rounded-md
-          bg-background text-foreground
-          cursor-pointer
-          transition-all duration-200
-          ${currentSize.container}
-          ${currentSize.text}
-          ${isOpen ? "ring-2 ring-ring ring-offset-2" : "hover:border-ring"}
-          ${disabled ? "opacity-50 cursor-not-allowed" : ""}
-        `.trim(),
-        onClick: () => !disabled && setIsOpen(!isOpen),
-        onKeyDown: handleKeyDown,
-        tabIndex: disabled ? -1 : 0,
-        role: "button",
-        "aria-haspopup": "listbox",
-        "aria-expanded": isOpen,
-        "aria-label": "Multi-select",
-        children: [
-          selectedValues.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: getSelectedLabels().map((label, index) => /* @__PURE__ */ jsxRuntime.jsxs(
-            "span",
-            {
-              className: `
-                  inline-flex items-center gap-1 
-                  bg-primary/10 text-primary rounded-md font-medium 
-                  animate-scaleIn origin-left
-                  transition-all duration-200
-                  ${currentSize.chip}
-                `.trim(),
-              children: [
-                label,
-                /* @__PURE__ */ jsxRuntime.jsx(
-                  "button",
-                  {
-                    type: "button",
-                    onClick: (e) => handleRemoveValue(selectedValues[index], e),
-                    className: "hover:bg-primary/20 rounded-sm transition-colors duration-150",
-                    "aria-label": `Remove ${label}`,
-                    tabIndex: -1,
-                    children: /* @__PURE__ */ jsxRuntime.jsx(iconsReact.IconX, { size: currentSize.icon - 4 })
-                  }
-                )
-              ]
-            },
-            selectedValues[index]
-          )) }) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground", children: placeholder }),
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1 ml-auto flex-shrink-0", children: [
-            selectedValues.length > 0 && !disabled && /* @__PURE__ */ jsxRuntime.jsx(
-              "button",
-              {
-                type: "button",
-                onClick: handleClearAll,
-                className: "p-1 hover:bg-muted rounded transition-colors",
-                "aria-label": "Clear all",
-                tabIndex: -1,
-                children: /* @__PURE__ */ jsxRuntime.jsx(iconsReact.IconX, { size: currentSize.icon })
-              }
-            ),
-            /* @__PURE__ */ jsxRuntime.jsx(
-              iconsReact.IconChevronDown,
-              {
-                size: currentSize.icon,
-                className: `text-muted-foreground transition-transform ${isOpen ? "rotate-180" : ""}`
-              }
-            )
-          ] })
-        ]
-      }
-    ),
-    isOpen && !disabled && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "absolute top-full left-0 right-0 mt-2 z-50 bg-card border border-border rounded-md shadow-lg max-h-64 overflow-hidden flex flex-col animate-scaleIn origin-top", children: [
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "p-2 border-b border-border", children: /* @__PURE__ */ jsxRuntime.jsx(
-        "input",
-        {
-          ref: searchInputRef,
-          type: "text",
-          value: searchQuery,
-          onChange: (e) => {
-            setSearchQuery(e.target.value);
-            setFocusedIndex(-1);
-          },
-          placeholder: "Search...",
-          className: `w-full px-3 py-1.5 ${currentSize.text} border border-input rounded-md bg-background text-foreground placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring`,
-          onClick: (e) => e.stopPropagation()
-        }
-      ) }),
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "overflow-y-auto", role: "listbox", children: filteredOptions.length > 0 ? filteredOptions.map((option, index) => {
-        const isSelected = selectedValues.includes(option.value);
-        const isFocused = index === focusedIndex;
-        const isDisabled = Boolean(maxSelections && !isSelected && selectedValues.length >= maxSelections);
-        return /* @__PURE__ */ jsxRuntime.jsxs(
-          "button",
-          {
-            type: "button",
-            onClick: () => !isDisabled && handleToggleOption(option.value),
-            className: `
-                      w-full px-3 py-2 flex items-center justify-between gap-2
-                      transition-all duration-200 text-left ${currentSize.text}
-                      ${isFocused ? "bg-muted" : ""}
-                      ${isSelected ? "bg-primary/10 text-primary font-medium" : "hover:bg-muted"}
-                      ${isDisabled ? "opacity-50 cursor-not-allowed" : ""}
-                    `.trim(),
-            role: "option",
-            "aria-selected": isSelected,
-            disabled: isDisabled,
-            children: [
-              /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex-1 truncate", children: option.label }),
-              isSelected && /* @__PURE__ */ jsxRuntime.jsx(
-                iconsReact.IconCheck,
-                {
-                  size: currentSize.icon,
-                  className: "flex-shrink-0 animate-scaleIn"
-                }
-              )
-            ]
-          },
-          option.value
-        );
-      }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "px-3 py-6 text-center text-muted-foreground", children: "No options found" }) }),
-      maxSelections && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "px-3 py-2 border-t border-border bg-muted/30 text-xs text-muted-foreground", children: [
-        selectedValues.length,
-        " / ",
-        maxSelections,
-        " selected"
-      ] })
-    ] })
-  ] });
-}
-MultiSelect.displayName = "MultiSelect";
-var multi_select_default = MultiSelect;
-function Textarea({
-  value,
-  onChange,
-  placeholder,
-  disabled = false,
-  className = "",
-  ariaLabel,
-  id,
-  name,
-  rows = 3,
-  required = false,
-  validationState = "default"
-}) {
-  const validationClasses = {
-    default: "border-input focus:border-ring",
-    error: "border-destructive focus:border-destructive",
-    success: "border-success focus:border-success",
-    warning: "border-warning focus:border-warning"
-  };
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    "textarea",
-    {
-      value,
-      onChange,
-      placeholder,
-      disabled,
-      "aria-label": ariaLabel,
-      id,
-      name,
-      rows,
-      required,
-      "aria-invalid": validationState === "error",
-      className: `flex min-h-[80px] w-full rounded-lg border bg-background px-3 py-2 text-sm shadow-sm transition-all duration-200 placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring/20 focus:ring-offset-0 disabled:cursor-not-allowed disabled:opacity-50 disabled:bg-muted/50 resize-y ${validationClasses[validationState]} ${className}`
-    }
-  );
-}
-Textarea.displayName = "Textarea";
-var textarea_default = Textarea;
-function Switch({
-  checked = false,
-  onChange,
-  disabled = false,
-  className = "",
-  ariaLabel,
-  id,
-  name,
-  size = "md",
-  variant
-}) {
-  const handleChange = (e) => {
-    onChange?.(e.target.checked);
-  };
-  const sizeStyles = {
-    xs: {
-      container: "h-4 w-8",
-      handle: "h-3 w-3",
-      padding: "p-0.5",
-      translate: checked ? "translate-x-4" : "translate-x-0"
-    },
-    sm: {
-      container: "h-5 w-10",
-      handle: "h-4 w-4",
-      padding: "p-0.5",
-      translate: checked ? "translate-x-5" : "translate-x-0"
-    },
-    md: {
-      container: "h-6 w-12",
-      handle: "h-5 w-5",
-      padding: "p-0.5",
-      translate: checked ? "translate-x-6" : "translate-x-0"
-    },
-    lg: {
-      container: "h-7 w-14",
-      handle: "h-6 w-6",
-      padding: "p-0.5",
-      translate: checked ? "translate-x-7" : "translate-x-0"
-    },
-    xl: {
-      container: "h-8 w-16",
-      handle: "h-7 w-7",
-      padding: "p-0.5",
-      translate: checked ? "translate-x-8" : "translate-x-0"
-    }
-  };
-  const getVariantColors = () => {
-    if (!checked) {
-      return "bg-input border-input";
-    }
-    switch (variant) {
-      case "secondary":
-        return "bg-secondary border-secondary";
-      case "accent":
-        return "bg-accent border-accent";
-      case "success":
-        return "bg-success border-success";
-      case "warning":
-        return "bg-warning border-warning";
-      case "info":
-        return "bg-info border-info";
-      case "error":
-        return "bg-destructive border-destructive";
-      case "neutral":
-        return "bg-neutral border-neutral";
-      case "primary":
-      default:
-        return "bg-primary border-primary";
-    }
-  };
-  const styles = sizeStyles[size];
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    "label",
-    {
-      className: `relative inline-flex ${styles.container} ${styles.padding} items-center rounded-full border transition-all duration-200 cursor-pointer ${disabled ? "opacity-30 cursor-not-allowed" : ""} ${getVariantColors()} ${className}`,
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsx(
-          "input",
-          {
-            type: "checkbox",
-            role: "switch",
-            checked,
-            onChange: handleChange,
-            disabled,
-            "aria-label": ariaLabel,
-            id,
-            name,
-            className: "sr-only"
-          }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          "span",
-          {
-            className: `inline-block ${styles.handle} rounded-full bg-background shadow-sm transition-transform duration-200 ${styles.translate}`
-          }
-        )
-      ]
-    }
-  );
-}
-Switch.displayName = "Switch";
-var switch_default = Switch;
-function Slider({
-  value = 50,
-  onChange,
-  min = 0,
-  max = 100,
-  step = 1,
-  disabled = false,
-  className = "",
-  ariaLabel,
-  id,
-  name
-}) {
-  const handleChange = (e) => {
-    onChange?.(Number(e.target.value));
-  };
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    "input",
-    {
-      type: "range",
-      value,
-      onChange: handleChange,
-      min,
-      max,
-      step,
-      disabled,
-      "aria-label": ariaLabel,
-      id,
-      name,
-      className: `w-full h-2 bg-muted/30 rounded-lg appearance-none cursor-pointer transition-all duration-200 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:opacity-50 disabled:cursor-not-allowed hover:bg-muted/40 ${className}`,
-      style: {
-        background: `linear-gradient(to right, hsl(var(--primary)) 0%, hsl(var(--primary)) ${(value - min) / (max - min) * 100}%, hsl(var(--muted) / 0.3) ${(value - min) / (max - min) * 100}%, hsl(var(--muted) / 0.3) 100%)`
-      }
-    }
-  );
-}
-Slider.displayName = "Slider";
-var slider_default = Slider;
-function ButtonGroup({
-  children,
-  className = "",
-  variant = "default",
-  orientation = "horizontal"
-}) {
-  const baseClasses = "inline-flex";
-  const orientationClasses = orientation === "horizontal" ? "flex-row" : "flex-col";
-  let variantClasses = "";
-  if (variant === "separated") {
-    variantClasses = "gap-2";
-  } else if (orientation === "horizontal") {
-    variantClasses = "[&>button]:rounded-none [&>button:first-child]:rounded-l-md [&>button:last-child]:rounded-r-md [&>button:not(:last-child)]:border-r-0";
-  } else {
-    variantClasses = "[&>button]:rounded-none [&>button:first-child]:rounded-t-md [&>button:last-child]:rounded-b-md [&>button:not(:last-child)]:border-b-0";
-  }
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: `${baseClasses} ${orientationClasses} ${variantClasses} ${className}`, children });
-}
-ButtonGroup.displayName = "ButtonGroup";
-var button_group_default = ButtonGroup;
-function Text({
-  children,
-  variant = "body",
-  size,
-  weight = "semibold",
-  // elevated default weight
-  className = "",
-  noMargin = false
-}) {
-  const variantClasses = {
-    body: "text-foreground",
-    muted: "text-muted-foreground",
-    small: "text-muted-foreground"
-  };
-  const sizeClasses = {
-    xs: "text-xs",
-    sm: "text-sm",
-    base: "text-base",
-    lg: "text-lg",
-    xl: "text-xl"
-  };
-  const weightClasses = {
-    normal: "font-normal",
-    medium: "font-medium",
-    semibold: "font-semibold",
-    bold: "font-bold"
-  };
-  const defaultSizes = {
-    body: "lg",
-    // bigger default body text
-    muted: "base",
-    // muted still readable
-    small: "sm"
-    // small bumped up slightly
-  };
-  const finalSize = size || defaultSizes[variant];
-  const margin = noMargin ? "" : "mb-4";
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    "p",
-    {
-      className: `${variantClasses[variant]} ${sizeClasses[finalSize]} ${weightClasses[weight]} ${margin} ${className}`,
-      children
-    }
-  );
-}
-Text.displayName = "Text";
-var text_default = Text;
-function Stack({
-  children,
-  className = "",
-  direction = "vertical",
-  spacing = "md",
-  align = "stretch",
-  justify
-}) {
-  const spacingClasses = {
-    none: "gap-0",
-    sm: "gap-2",
-    md: "gap-4",
-    lg: "gap-6",
-    xl: "gap-8"
-  };
-  const alignClasses = {
-    start: "items-start",
-    center: "items-center",
-    end: "items-end",
-    stretch: "items-stretch"
-  };
-  const justifyClasses = {
-    start: "justify-start",
-    center: "justify-center",
-    end: "justify-end",
-    between: "justify-between",
-    around: "justify-around"
-  };
-  const directionClass = direction === "horizontal" ? "flex-row" : "flex-col";
-  const justifyClass = justify ? justifyClasses[justify] : "";
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    "div",
-    {
-      "data-component": "Stack",
-      className: `flex ${directionClass} ${spacingClasses[spacing]} ${alignClasses[align]} ${justifyClass} ${className}`,
-      children
-    }
-  );
-}
-Stack.displayName = "Stack";
-var stack_default = Stack;
-function FormField({
-  children,
-  label,
-  htmlFor,
-  error,
-  helperText,
-  required = false,
-  className = "",
-  validationState = "default"
-}) {
-  const effectiveValidationState = error ? "error" : validationState;
-  const childWithValidation = React5.isValidElement(children) ? React5.cloneElement(children, {
-    validationState: effectiveValidationState
-  }) : children;
-  return /* @__PURE__ */ jsxRuntime.jsxs(stack_default, { direction: "vertical", spacing: "sm", className, children: [
-    label && /* @__PURE__ */ jsxRuntime.jsx("label", { htmlFor, children: /* @__PURE__ */ jsxRuntime.jsxs(text_default, { variant: "body", size: "sm", noMargin: true, className: "font-medium", children: [
-      label,
-      required && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-destructive ml-1", children: "*" })
-    ] }) }),
-    childWithValidation,
-    error && /* @__PURE__ */ jsxRuntime.jsx(text_default, { variant: "body", size: "sm", noMargin: true, className: "text-destructive", children: error }),
-    !error && helperText && /* @__PURE__ */ jsxRuntime.jsx(text_default, { variant: "muted", size: "sm", noMargin: true, children: helperText })
-  ] });
-}
-FormField.displayName = "FormField";
-var form_field_default = FormField;
-function InputGroup({ children, prefix, suffix, className = "" }) {
-  const isTextSuffix = typeof suffix === "string" || typeof suffix === "number";
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    "div",
-    {
-      className: [
-        "inline-flex items-stretch rounded-lg border border-input shadow-sm bg-background",
-        "focus-within:ring-2 focus-within:ring-ring/20 focus-within:border-ring",
-        "transition-colors duration-150 overflow-hidden",
-        // Use CSS nesting to style child input without cloning
-        "[&>input]:border-0 [&>input]:shadow-none [&>input]:rounded-none [&>input]:ring-0",
-        "[&>input]:focus:ring-0 [&>input]:focus:border-0 [&>input]:bg-transparent",
-        "[&>input]:flex-1 [&>input]:min-w-0",
-        // Style child buttons (both direct and nested)
-        "[&_button]:rounded-none [&_button]:border-0 [&_button]:shadow-none [&_button]:m-0",
-        "[&_button]:h-full",
-        className
-      ].filter(Boolean).join(" "),
-      children: [
-        prefix && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center px-3 bg-muted/50 text-muted-foreground text-sm shrink-0", children: prefix }),
-        children,
-        suffix && /* @__PURE__ */ jsxRuntime.jsx(
-          "div",
-          {
-            className: isTextSuffix ? "flex items-center px-3 bg-muted/50 text-muted-foreground text-sm shrink-0" : "flex items-stretch shrink-0",
-            children: suffix
-          }
-        )
-      ]
-    }
-  );
-}
-InputGroup.displayName = "InputGroup";
-var input_group_default = InputGroup;
-function Calendar({ value, onChange, minDate, maxDate, disabled = false, className = "" }) {
-  const [currentMonth, setCurrentMonth] = React5.useState(value || /* @__PURE__ */ new Date());
-  const [selectedDate, setSelectedDate] = React5.useState(value);
-  const getDaysInMonth = (date) => {
-    return new Date(date.getFullYear(), date.getMonth() + 1, 0).getDate();
-  };
-  const getFirstDayOfMonth = (date) => {
-    return new Date(date.getFullYear(), date.getMonth(), 1).getDay();
-  };
-  const handleDateClick = (day) => {
-    if (disabled) return;
-    const newDate = new Date(currentMonth.getFullYear(), currentMonth.getMonth(), day);
-    if (minDate && newDate < minDate) return;
-    if (maxDate && newDate > maxDate) return;
-    setSelectedDate(newDate);
-    onChange?.(newDate);
-  };
-  const handlePreviousMonth = () => {
-    setCurrentMonth(new Date(currentMonth.getFullYear(), currentMonth.getMonth() - 1));
-  };
-  const handleNextMonth = () => {
-    setCurrentMonth(new Date(currentMonth.getFullYear(), currentMonth.getMonth() + 1));
-  };
-  const daysInMonth = getDaysInMonth(currentMonth);
-  const firstDayOfMonth = getFirstDayOfMonth(currentMonth);
-  const monthName = currentMonth.toLocaleDateString("en-US", { month: "long", year: "numeric" });
-  const weekDays = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"];
-  const isDateSelected = (day) => {
-    if (!selectedDate) return false;
-    return selectedDate.getDate() === day && selectedDate.getMonth() === currentMonth.getMonth() && selectedDate.getFullYear() === currentMonth.getFullYear();
-  };
-  const isDateDisabled = (day) => {
-    const date = new Date(currentMonth.getFullYear(), currentMonth.getMonth(), day);
-    if (minDate && date < minDate) return true;
-    if (maxDate && date > maxDate) return true;
-    return false;
-  };
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    "div",
-    {
-      className: `inline-block border border-border rounded-lg bg-card text-card-foreground shadow-sm p-4 ${disabled ? "opacity-50 pointer-events-none" : ""} ${className}`.trim(),
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between mb-4", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(
-            "button",
-            {
-              type: "button",
-              onClick: handlePreviousMonth,
-              className: "p-2 hover:bg-muted rounded-md transition-colors focus:outline-none focus:ring-2 focus:ring-ring",
-              "aria-label": "Previous month",
-              children: /* @__PURE__ */ jsxRuntime.jsx(
-                "svg",
-                {
-                  xmlns: "http://www.w3.org/2000/svg",
-                  width: "20",
-                  height: "20",
-                  viewBox: "0 0 24 24",
-                  fill: "none",
-                  stroke: "currentColor",
-                  strokeWidth: "2",
-                  strokeLinecap: "round",
-                  strokeLinejoin: "round",
-                  children: /* @__PURE__ */ jsxRuntime.jsx("polyline", { points: "15 18 9 12 15 6" })
-                }
-              )
-            }
-          ),
-          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-semibold text-sm", children: monthName }),
-          /* @__PURE__ */ jsxRuntime.jsx(
-            "button",
-            {
-              type: "button",
-              onClick: handleNextMonth,
-              className: "p-2 hover:bg-muted rounded-md transition-colors focus:outline-none focus:ring-2 focus:ring-ring",
-              "aria-label": "Next month",
-              children: /* @__PURE__ */ jsxRuntime.jsx(
-                "svg",
-                {
-                  xmlns: "http://www.w3.org/2000/svg",
-                  width: "20",
-                  height: "20",
-                  viewBox: "0 0 24 24",
-                  fill: "none",
-                  stroke: "currentColor",
-                  strokeWidth: "2",
-                  strokeLinecap: "round",
-                  strokeLinejoin: "round",
-                  children: /* @__PURE__ */ jsxRuntime.jsx("polyline", { points: "9 18 15 12 9 6" })
-                }
-              )
-            }
-          )
-        ] }),
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-7 gap-1 mb-2", children: weekDays.map((day) => /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-9 h-9 flex items-center justify-center text-xs font-medium text-muted-foreground", children: day }, day)) }),
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-7 gap-1", children: [
-          Array.from({ length: firstDayOfMonth }).map((_, index) => /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-9 h-9" }, `empty-${index}`)),
-          Array.from({ length: daysInMonth }).map((_, index) => {
-            const day = index + 1;
-            const selected = isDateSelected(day);
-            const dateDisabled = isDateDisabled(day);
-            return /* @__PURE__ */ jsxRuntime.jsx(
-              "button",
-              {
-                type: "button",
-                onClick: () => handleDateClick(day),
-                disabled: dateDisabled,
-                className: `
-                w-9 h-9 flex items-center justify-center text-sm rounded-md transition-colors
-                focus:outline-none focus:ring-2 focus:ring-ring
-                ${selected ? "bg-primary text-primary-foreground font-semibold" : "hover:bg-muted"}
-                ${dateDisabled ? "text-muted-foreground cursor-not-allowed opacity-50" : ""}
-              `.trim(),
-                "aria-label": `Select ${day} ${monthName}`,
-                "aria-pressed": selected,
-                children: day
-              },
-              day
-            );
-          })
-        ] })
-      ]
-    }
-  );
-}
-Calendar.displayName = "Calendar";
-var calendar_default = Calendar;
-function DatePicker({
-  value,
-  onChange,
-  minDate,
-  maxDate,
-  placeholder = "Select date",
-  disabled = false,
-  dateFormat = "MM/DD/YYYY",
-  clearable = true,
-  className = "",
-  size = "md"
-}) {
-  const [isOpen, setIsOpen] = React5.useState(false);
-  const [selectedDate, setSelectedDate] = React5.useState(value);
-  const containerRef = React5.useRef(null);
-  const inputRef = React5.useRef(null);
-  React5.useEffect(() => {
-    setSelectedDate(value);
-  }, [value]);
-  React5.useEffect(() => {
-    const handleClickOutside = (event) => {
-      if (containerRef.current && !containerRef.current.contains(event.target)) {
-        setIsOpen(false);
-      }
-    };
-    if (isOpen) {
-      document.addEventListener("mousedown", handleClickOutside);
-      return () => document.removeEventListener("mousedown", handleClickOutside);
-    }
-    return void 0;
-  }, [isOpen]);
-  React5.useEffect(() => {
-    const handleEscape = (event) => {
-      if (event.key === "Escape" && isOpen) {
-        setIsOpen(false);
-        inputRef.current?.focus();
-      }
-    };
-    if (isOpen) {
-      document.addEventListener("keydown", handleEscape);
-      return () => document.removeEventListener("keydown", handleEscape);
-    }
-    return void 0;
-  }, [isOpen]);
-  const formatDate = (date) => {
-    if (!date) return "";
-    const month = String(date.getMonth() + 1).padStart(2, "0");
-    const day = String(date.getDate()).padStart(2, "0");
-    const year = date.getFullYear();
-    return dateFormat.replace("MM", month).replace("DD", day).replace("YYYY", String(year)).replace("YY", String(year).slice(-2));
-  };
-  const handleDateSelect = (date) => {
-    setSelectedDate(date);
-    onChange?.(date);
-    setIsOpen(false);
-    inputRef.current?.focus();
-  };
-  const handleClear = (e) => {
-    e.stopPropagation();
-    setSelectedDate(void 0);
-    onChange?.(void 0);
-    inputRef.current?.focus();
-  };
-  const handleInputClick = () => {
-    if (!disabled) {
-      setIsOpen(!isOpen);
-    }
-  };
-  const handleKeyDown = (e) => {
-    if (e.key === "Enter" || e.key === " ") {
-      e.preventDefault();
-      setIsOpen(!isOpen);
-    }
-  };
-  const sizeClasses = {
-    sm: { container: "h-8 px-3", text: "text-sm", icon: 16 },
-    md: { container: "h-10 px-4", text: "text-base", icon: 18 },
-    lg: { container: "h-12 px-5", text: "text-lg", icon: 20 }
-  };
-  const currentSize = sizeClasses[size];
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { ref: containerRef, className: `relative w-full ${className}`, children: [
-    /* @__PURE__ */ jsxRuntime.jsxs(
-      "div",
-      {
-        className: `
-          w-full flex items-center justify-between gap-2
-          border border-input rounded-md
-          bg-background text-foreground
-          cursor-pointer
-          transition-all duration-200
-          ${currentSize.container}
-          ${currentSize.text}
-          ${isOpen ? "ring-2 ring-ring ring-offset-2" : "hover:border-ring"}
-          ${disabled ? "opacity-50 cursor-not-allowed" : ""}
-        `.trim(),
-        onClick: handleInputClick,
-        role: "button",
-        tabIndex: disabled ? -1 : 0,
-        onKeyDown: handleKeyDown,
-        "aria-haspopup": "dialog",
-        "aria-expanded": isOpen,
-        "aria-label": "Date picker",
-        children: [
-          /* @__PURE__ */ jsxRuntime.jsx(
-            "input",
-            {
-              ref: inputRef,
-              type: "text",
-              value: formatDate(selectedDate),
-              placeholder,
-              readOnly: true,
-              disabled,
-              className: `flex-1 min-w-0 bg-transparent outline-none cursor-pointer placeholder:text-muted-foreground ${currentSize.text}`,
-              "aria-label": "Selected date"
-            }
-          ),
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1 flex-shrink-0", children: [
-            clearable && selectedDate && !disabled ? /* @__PURE__ */ jsxRuntime.jsx(
-              "button",
-              {
-                type: "button",
-                onClick: handleClear,
-                className: "p-1 hover:bg-muted rounded transition-colors flex-shrink-0",
-                "aria-label": "Clear date",
-                children: /* @__PURE__ */ jsxRuntime.jsxs(
-                  "svg",
-                  {
-                    xmlns: "http://www.w3.org/2000/svg",
-                    width: currentSize.icon - 2,
-                    height: currentSize.icon - 2,
-                    viewBox: "0 0 24 24",
-                    fill: "none",
-                    stroke: "currentColor",
-                    strokeWidth: "2",
-                    strokeLinecap: "round",
-                    strokeLinejoin: "round",
-                    children: [
-                      /* @__PURE__ */ jsxRuntime.jsx("line", { x1: "18", y1: "6", x2: "6", y2: "18" }),
-                      /* @__PURE__ */ jsxRuntime.jsx("line", { x1: "6", y1: "6", x2: "18", y2: "18" })
-                    ]
-                  }
-                )
-              }
-            ) : clearable ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-6 h-6 flex-shrink-0" }) : null,
-            /* @__PURE__ */ jsxRuntime.jsx(iconsReact.IconCalendar, { size: currentSize.icon, className: "text-muted-foreground flex-shrink-0" })
-          ] })
-        ]
-      }
-    ),
-    isOpen && !disabled && /* @__PURE__ */ jsxRuntime.jsx(
-      "div",
-      {
-        className: "absolute left-0 top-full mt-2 z-50 animate-scaleIn origin-top",
-        role: "dialog",
-        "aria-label": "Calendar",
-        children: /* @__PURE__ */ jsxRuntime.jsx(calendar_default, { value: selectedDate, onChange: handleDateSelect, minDate, maxDate })
-      }
-    )
-  ] });
-}
-DatePicker.displayName = "DatePicker";
-var date_picker_default = DatePicker;
-function Nav({
-  children,
-  className = "",
-  ariaLabel = "Main navigation",
-  direction = "horizontal",
-  spacing = "md",
-  align = "center"
-}) {
-  const spacingClasses = {
-    none: "gap-0",
-    sm: "gap-2",
-    md: "gap-4",
-    lg: "gap-6",
-    xl: "gap-8"
-  };
-  const alignClasses = {
-    start: "items-start",
-    center: "items-center",
-    end: "items-end",
-    stretch: "items-stretch"
-  };
-  const directionClass = direction === "horizontal" ? "flex-row" : "flex-col";
-  const spacingClass = spacingClasses[spacing];
-  const alignClass = alignClasses[align];
-  return /* @__PURE__ */ jsxRuntime.jsx("nav", { "aria-label": ariaLabel, className: `flex ${directionClass} ${spacingClass} ${alignClass} ${className}`, children });
-}
-Nav.displayName = "Nav";
-var nav_default = Nav;
-function Container({
-  children,
-  className = "",
-  size = "lg",
-  padding = "lg",
-  align = "center",
-  minWidth,
-  minHeight
-}) {
-  const sizeClasses = {
-    sm: "max-w-screen-sm",
-    md: "max-w-screen-md",
-    lg: "max-w-screen-lg",
-    xl: "max-w-screen-xl",
-    full: "max-w-full"
-  };
-  const paddingClasses = {
-    none: "",
-    sm: "py-6",
-    md: "py-8",
-    lg: "py-12",
-    xl: "py-16"
-  };
-  const alignClasses = {
-    start: "mr-auto",
-    center: "mx-auto",
-    end: "ml-auto"
-  };
-  const minWidthClasses = {
-    xs: "min-w-[20rem]",
-    // 320px
-    sm: "min-w-[24rem]",
-    // 384px
-    md: "min-w-[28rem]",
-    // 448px
-    lg: "min-w-[32rem]",
-    // 512px
-    xl: "min-w-[36rem]",
-    // 576px
-    "2xl": "min-w-[42rem]",
-    // 672px
-    "3xl": "min-w-[48rem]",
-    // 768px
-    full: "min-w-full"
-  };
-  const minHeightClasses = {
-    xs: "min-h-[10rem]",
-    // 160px
-    sm: "min-h-[15rem]",
-    // 240px
-    md: "min-h-[20rem]",
-    // 320px
-    lg: "min-h-[25rem]",
-    // 400px
-    xl: "min-h-[30rem]",
-    // 480px
-    "2xl": "min-h-[35rem]",
-    // 560px
-    "3xl": "min-h-[40rem]",
-    // 640px
-    screen: "min-h-screen"
-  };
-  const minWidthClass = minWidth && minWidthClasses[minWidth] ? minWidthClasses[minWidth] : "";
-  const minHeightClass = minHeight && minHeightClasses[minHeight] ? minHeightClasses[minHeight] : "";
-  const inlineStyles = {
-    ...minWidth && !minWidthClasses[minWidth] && { minWidth },
-    ...minHeight && !minHeightClasses[minHeight] && { minHeight }
-  };
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    "div",
-    {
-      className: `px-4 ${sizeClasses[size]} ${paddingClasses[padding]} ${alignClasses[align]} ${minWidthClass} ${minHeightClass} ${className}`,
-      style: Object.keys(inlineStyles).length > 0 ? inlineStyles : void 0,
-      children
-    }
-  );
-}
-Container.displayName = "Container";
-var container_default = Container;
-function Navbar({
-  brand,
-  children,
-  sticky = true,
-  className = "",
-  actions,
-  size = "xl",
-  appearance = "solid",
-  border = "none",
-  disableMobileMenu = false
-}) {
-  const [mobileMenuOpen, setMobileMenuOpen] = React5.useState(false);
-  const appearanceClasses = {
-    solid: "bg-background shadow-sm",
-    blur: "bg-background/70 backdrop-blur-md supports-[backdrop-filter]:bg-background/60 border border-border/60",
-    transparent: "bg-transparent"
-  };
-  const borderClasses = {
-    none: "",
-    bottom: "border-b border-border",
-    top: "border-t border-border",
-    both: "border-y border-border"
-  };
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    "nav",
-    {
-      "data-appearance": appearance,
-      className: `${sticky ? "sticky top-0 z-50" : ""} ${appearanceClasses[appearance]} ${borderClasses[border]} ${className}`,
-      children: /* @__PURE__ */ jsxRuntime.jsxs(container_default, { padding: "none", size, children: [
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between h-16", children: [
-          brand && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-shrink-0", children: brand }),
-          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "hidden md:flex md:items-center md:space-x-6 md:flex-1 md:ml-10", children }),
-          actions && /* @__PURE__ */ jsxRuntime.jsx("div", { className: `${disableMobileMenu ? "flex" : "hidden md:flex"} items-center space-x-4`, children: actions }),
-          !disableMobileMenu && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "md:hidden", children: /* @__PURE__ */ jsxRuntime.jsx(
-            button_default,
-            {
-              variant: "neutral",
-              style: "ghost",
-              size: "sm",
-              icon: mobileMenuOpen ? /* @__PURE__ */ jsxRuntime.jsx(iconsReact.IconX, { size: 24 }) : /* @__PURE__ */ jsxRuntime.jsx(iconsReact.IconMenu2, { size: 24 }),
-              ariaLabel: "Toggle menu",
-              onClick: () => setMobileMenuOpen(!mobileMenuOpen)
-            }
-          ) })
-        ] }),
-        !disableMobileMenu && mobileMenuOpen && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "md:hidden py-4 space-y-3 border-t border-border", children: [
-          children,
-          actions && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "pt-4 border-t border-border space-y-2", children: actions })
-        ] })
-      ] })
-    }
-  );
-}
-Navbar.displayName = "Navbar";
-var navbar_default = Navbar;
-function NavbarBrand({ children, href, external = false, onClick, className = "" }) {
-  const content = /* @__PURE__ */ jsxRuntime.jsx("span", { className: `text-lg md:text-xl font-bold ${className}`, children });
-  const linkClassName = "no-underline text-foreground hover:text-primary transition-colors";
-  if (href) {
-    if (external) {
-      return /* @__PURE__ */ jsxRuntime.jsx("a", { href, className: linkClassName, target: "_blank", rel: "noopener noreferrer", children: content });
-    }
-    return /* @__PURE__ */ jsxRuntime.jsx(reactRouterDom.Link, { to: href, className: linkClassName, children: content });
-  }
-  if (onClick) {
-    return /* @__PURE__ */ jsxRuntime.jsx("button", { onClick, className: linkClassName, children: content });
-  }
-  return content;
-}
-NavbarBrand.displayName = "NavbarBrand";
-var navbar_brand_default = NavbarBrand;
-function NavbarLink({ href, children, external = false, className = "", end = false }) {
-  const baseClassName = `block md:inline-block py-2 md:py-0 font-medium transition-colors no-underline ${className}`;
-  if (external) {
-    return /* @__PURE__ */ jsxRuntime.jsx(
-      "a",
-      {
-        href,
-        target: "_blank",
-        rel: "noopener noreferrer",
-        className: `${baseClassName} text-foreground hover:text-primary`,
-        children
-      }
-    );
-  }
-  if (href.startsWith("#")) {
-    return /* @__PURE__ */ jsxRuntime.jsx("a", { href, className: `${baseClassName} text-foreground hover:text-primary`, children });
-  }
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    reactRouterDom.NavLink,
-    {
-      to: href,
-      end,
-      className: ({ isActive }) => `${baseClassName} ${isActive ? "text-primary font-semibold border-b-2 border-primary" : "text-foreground hover:text-primary"}`,
-      children
-    }
-  );
-}
-NavbarLink.displayName = "NavbarLink";
-var navbar_link_default = NavbarLink;
-var PageTransition = ({
-  children,
-  duration = 300,
-  type = "fade",
-  className = ""
-}) => {
-  const [isVisible, setIsVisible] = React5__default.default.useState(false);
-  React5__default.default.useEffect(() => {
-    requestAnimationFrame(() => {
-      requestAnimationFrame(() => {
-        setIsVisible(true);
-      });
-    });
-  }, []);
-  const getAnimationStyles = () => {
-    if (type === "none") return "";
-    const baseClasses = "transition-all ease-out";
-    const durationClass = `duration-[${duration}ms]`;
-    if (!isVisible) {
-      switch (type) {
-        case "fade":
-          return `${baseClasses} ${durationClass} opacity-0 translate-y-1`;
-        case "slide":
-          return `${baseClasses} ${durationClass} opacity-0 translate-y-3`;
-        case "scale":
-          return `${baseClasses} ${durationClass} opacity-0 scale-[0.99]`;
-        default:
-          return `${baseClasses} ${durationClass} opacity-0 translate-y-1`;
-      }
-    } else {
-      return `${baseClasses} ${durationClass} opacity-100 translate-y-0 scale-100`;
-    }
-  };
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: `${getAnimationStyles()} ${className}`.trim(), children });
-};
-PageTransition.displayName = "PageTransition";
-var page_transition_default = PageTransition;
-function Tabs({ tabs, defaultTab, className = "", ariaLabel = "Tabs" }) {
-  const [activeTab, setActiveTab] = React5.useState(defaultTab || tabs[0]?.id);
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className, children: [
-    /* @__PURE__ */ jsxRuntime.jsx("div", { role: "tablist", "aria-label": ariaLabel, className: "flex border-b-2 border-border/50", children: tabs.map((tab) => /* @__PURE__ */ jsxRuntime.jsx(
-      "button",
-      {
-        role: "tab",
-        "aria-selected": activeTab === tab.id,
-        "aria-controls": `panel-${tab.id}`,
-        id: `tab-${tab.id}`,
-        onClick: () => setActiveTab(tab.id),
-        className: `px-4 py-3 font-medium cursor-pointer transition-all duration-200 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 relative ${activeTab === tab.id ? "text-primary after:absolute after:bottom-0 after:left-0 after:right-0 after:h-0.5 after:bg-primary after:rounded-t after:transition-all after:duration-200" : "text-muted-foreground hover:text-foreground hover:bg-muted/50"}`,
-        children: tab.label
-      },
-      tab.id
-    )) }),
-    tabs.map((tab) => /* @__PURE__ */ jsxRuntime.jsx(
-      "div",
-      {
-        role: "tabpanel",
-        id: `panel-${tab.id}`,
-        "aria-labelledby": `tab-${tab.id}`,
-        hidden: activeTab !== tab.id,
-        children: activeTab === tab.id && /* @__PURE__ */ jsxRuntime.jsx(page_transition_default, { type: "fade", duration: 150, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "pt-6", children: tab.content }) })
-      },
-      tab.id
-    ))
-  ] });
-}
-Tabs.displayName = "Tabs";
-var tabs_default = Tabs;
-var DropdownContext = React5.createContext(null);
-function Dropdown({
-  trigger,
-  children,
-  className = "",
-  align = "start",
-  autoClose = true,
-  size = "md"
-}) {
-  const [isOpen, setIsOpen] = React5.useState(false);
-  const dropdownRef = React5.useRef(null);
-  const menuRef = React5.useRef(null);
-  const itemsRef = React5.useRef([]);
-  const [activeIndex, setActiveIndex] = React5.useState(-1);
-  const close = React5.useCallback(() => setIsOpen(false), []);
-  const open = React5.useCallback(() => setIsOpen(true), []);
-  React5.useEffect(() => {
-    if (!isOpen) return;
-    const handleKey = (e) => {
-      if (!menuRef.current) return;
-      const itemEls = itemsRef.current.filter(Boolean);
-      if (["ArrowDown", "ArrowUp", "Home", "End"].includes(e.key)) {
-        e.preventDefault();
-        if (itemEls.length === 0) return;
-        let nextIndex = activeIndex;
-        if (e.key === "ArrowDown") nextIndex = (activeIndex + 1) % itemEls.length;
-        if (e.key === "ArrowUp") nextIndex = (activeIndex - 1 + itemEls.length) % itemEls.length;
-        if (e.key === "Home") nextIndex = 0;
-        if (e.key === "End") nextIndex = itemEls.length - 1;
-        setActiveIndex(nextIndex);
-        itemEls[nextIndex]?.focus();
-        return;
-      }
-      if (e.key === "Escape") {
-        e.preventDefault();
-        close();
-        dropdownRef.current?.querySelector('button[data-trigger="true"]')?.focus();
-      }
-      if (e.key === "Tab") {
-        e.preventDefault();
-        const itemEls2 = itemsRef.current.filter(Boolean);
-        if (itemEls2.length === 0) return;
-        const dir = e.shiftKey ? -1 : 1;
-        const nextIndex = (activeIndex + dir + itemEls2.length) % itemEls2.length;
-        setActiveIndex(nextIndex);
-        itemEls2[nextIndex]?.focus();
-      }
-    };
-    document.addEventListener("keydown", handleKey);
-    return () => document.removeEventListener("keydown", handleKey);
-  }, [isOpen, activeIndex, close]);
-  React5.useEffect(() => {
-    if (!isOpen) return;
-    const handleClickOutside = (event) => {
-      if (dropdownRef.current && !dropdownRef.current.contains(event.target)) {
-        close();
-      }
-    };
-    document.addEventListener("mousedown", handleClickOutside);
-    return () => document.removeEventListener("mousedown", handleClickOutside);
-  }, [isOpen, close]);
-  React5.useLayoutEffect(() => {
-    let raf;
-    if (isOpen) {
-      const itemEls = itemsRef.current.filter(Boolean);
-      if (itemEls.length) {
-        raf = requestAnimationFrame(() => {
-          setActiveIndex(0);
-          itemEls[0]?.focus();
-        });
-      }
-    } else {
-      raf = requestAnimationFrame(() => setActiveIndex(-1));
-    }
-    return () => {
-      if (raf) cancelAnimationFrame(raf);
-    };
-  }, [isOpen]);
-  const registerItem = React5.useCallback((el, index) => {
-    if (typeof index === "number" && index >= 0) {
-      itemsRef.current[index] = el;
-      return;
-    }
-    if (el === null) {
-      itemsRef.current = itemsRef.current.filter((x) => x !== el && x != null);
-      return;
-    }
-    if (!itemsRef.current.includes(el)) itemsRef.current.push(el);
-  }, []);
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { ref: dropdownRef, className: `relative ${className}`, children: [
-    /* @__PURE__ */ jsxRuntime.jsx(
-      "button",
-      {
-        "data-trigger": "true",
-        onClick: () => isOpen ? close() : open(),
-        className: "bg-transparent border-0 p-0 cursor-pointer outline-none",
-        type: "button",
-        "aria-expanded": isOpen,
-        "aria-haspopup": "true",
-        "aria-controls": isOpen ? "dropdown-menu" : void 0,
-        children: trigger
-      }
-    ),
-    isOpen && /* @__PURE__ */ jsxRuntime.jsx(DropdownContext.Provider, { value: { requestClose: close, autoClose, registerItem }, children: /* @__PURE__ */ jsxRuntime.jsx(
-      "div",
-      {
-        id: "dropdown-menu",
-        ref: menuRef,
-        className: `absolute mt-2 bg-popover text-popover-foreground border border-border rounded-md shadow-lg z-50 ${size === "sm" ? "min-w-[140px] text-xs py-1" : "min-w-[180px]"} max-h-[320px] overflow-y-auto origin-top animate-scaleIn focus:outline-none ${align === "start" ? "left-0" : align === "end" ? "right-0" : "left-1/2 -translate-x-1/2"} ${className}`,
-        role: "menu",
-        "aria-orientation": "vertical",
-        tabIndex: -1,
-        children
-      }
-    ) })
-  ] });
-}
-Dropdown.displayName = "Dropdown";
-var dropdown_default = Dropdown;
-function Breadcrumbs({ items, separator = "/", className = "" }) {
-  return /* @__PURE__ */ jsxRuntime.jsx("nav", { "aria-label": "Breadcrumb", className, children: /* @__PURE__ */ jsxRuntime.jsx("ol", { className: "flex items-center space-x-2 text-sm", children: items.map((item, index) => {
-    const isLast = index === items.length - 1;
-    const key = item.href || item.label;
-    return /* @__PURE__ */ jsxRuntime.jsxs("li", { className: "flex items-center", children: [
-      item.href && !isLast ? /* @__PURE__ */ jsxRuntime.jsx(
-        "a",
-        {
-          href: item.href,
-          className: "text-primary hover:text-primary/80 hover:underline cursor-pointer transition-colors duration-200 focus:outline-none focus:ring-2 focus:ring-ring rounded px-1 -mx-1",
-          children: item.label
-        }
-      ) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: isLast ? "text-foreground font-medium" : "text-muted-foreground", children: item.label }),
-      !isLast && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "mx-2 text-muted-foreground select-none", "aria-hidden": "true", children: separator })
-    ] }, key);
-  }) }) });
-}
-Breadcrumbs.displayName = "Breadcrumbs";
-var breadcrumbs_default = Breadcrumbs;
-function Pagination({
-  currentPage,
-  totalPages,
-  onPageChange,
-  siblingCount = 1,
-  className = ""
-}) {
-  const getPageNumbers = () => {
-    const pages = [];
-    const leftSibling = Math.max(currentPage - siblingCount, 1);
-    const rightSibling = Math.min(currentPage + siblingCount, totalPages);
-    if (leftSibling > 2) {
-      pages.push(1, "...");
-    } else {
-      for (let i = 1; i < leftSibling; i++) {
-        pages.push(i);
-      }
-    }
-    for (let i = leftSibling; i <= rightSibling; i++) {
-      pages.push(i);
-    }
-    if (rightSibling < totalPages - 1) {
-      pages.push("...", totalPages);
-    } else {
-      for (let i = rightSibling + 1; i <= totalPages; i++) {
-        pages.push(i);
-      }
-    }
-    return pages;
-  };
-  return /* @__PURE__ */ jsxRuntime.jsx("nav", { "aria-label": "Pagination", className, children: /* @__PURE__ */ jsxRuntime.jsxs("ul", { className: "flex items-center space-x-1", children: [
-    /* @__PURE__ */ jsxRuntime.jsx("li", { children: /* @__PURE__ */ jsxRuntime.jsx(
-      "button",
-      {
-        onClick: () => onPageChange(currentPage - 1),
-        disabled: currentPage === 1,
-        className: "px-3 py-2 rounded-lg border border-border hover:bg-accent hover:text-accent-foreground transition-colors duration-200 cursor-pointer disabled:opacity-50 disabled:cursor-not-allowed focus:outline-none focus:ring-2 focus:ring-ring",
-        "aria-label": "Previous page",
-        children: "\u2190"
-      }
-    ) }),
-    getPageNumbers().map((page, index) => {
-      const key = typeof page === "number" ? `page-${page}` : `ellipsis-${index}`;
-      return /* @__PURE__ */ jsxRuntime.jsx("li", { children: typeof page === "number" ? /* @__PURE__ */ jsxRuntime.jsx(
-        "button",
-        {
-          onClick: () => onPageChange(page),
-          className: `px-3 py-2 rounded-lg border cursor-pointer transition-all duration-200 focus:outline-none focus:ring-2 focus:ring-ring ${page === currentPage ? "bg-primary text-primary-foreground border-primary shadow-sm" : "border-border hover:bg-accent hover:text-accent-foreground hover:border-accent"}`,
-          "aria-label": `Page ${page}`,
-          "aria-current": page === currentPage ? "page" : void 0,
-          children: page
-        }
-      ) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: "px-3 py-2 text-muted-foreground", children: "..." }) }, key);
-    }),
-    /* @__PURE__ */ jsxRuntime.jsx("li", { children: /* @__PURE__ */ jsxRuntime.jsx(
-      "button",
-      {
-        onClick: () => onPageChange(currentPage + 1),
-        disabled: currentPage === totalPages,
-        className: "px-3 py-2 rounded-lg border border-border hover:bg-accent hover:text-accent-foreground transition-colors duration-200 cursor-pointer disabled:opacity-50 disabled:cursor-not-allowed focus:outline-none focus:ring-2 focus:ring-ring",
-        "aria-label": "Next page",
-        children: "\u2192"
-      }
-    ) })
-  ] }) });
-}
-Pagination.displayName = "Pagination";
-var pagination_default = Pagination;
-function Sidebar({ children, className = "", width = "16rem" }) {
-  const widthClass = width === "16rem" ? "w-64" : width === "4rem" ? "w-16" : "";
-  const enhancedChildren = React5__default.default.Children.map(children, (child) => {
-    if (!React5__default.default.isValidElement(child)) return child;
-    const childProps = child.props || {};
-    if ("href" in childProps) {
-      const existing = typeof childProps.className === "string" ? childProps.className : "";
-      const sidebarItemClasses = "flex items-center w-full justify-start gap-2 px-2 py-1.5 rounded hover:bg-muted";
-      const childInner = child.props.children;
-      const wrappedChildren = /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex items-center gap-2", children: childInner });
-      const newProps = {
-        ...child.props,
-        className: `${existing} ${sidebarItemClasses}`.trim()
-      };
-      return React5__default.default.cloneElement(child, newProps, wrappedChildren);
-    }
-    return child;
-  });
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    "nav",
-    {
-      className: `
-        ${widthClass || ""}
-        bg-card border-r border-border
-        flex flex-col
-        overflow-hidden
-        ${className}
-      `.replace(/\s+/g, " "),
-      style: !widthClass ? { width } : void 0,
-      "aria-label": "Sidebar navigation",
-      children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1 px-4 py-3 flex flex-col gap-2", children: enhancedChildren })
-    }
-  );
-}
-Sidebar.displayName = "Sidebar";
-var sidebar_default = Sidebar;
-function Stepper({
-  steps,
-  currentStep,
-  className = "",
-  orientation = "horizontal",
-  onStepClick,
-  clickable = false
-}) {
-  const getStepStatus = (index) => {
-    const step = steps[index];
-    if (step.status) return step.status;
-    if (index < currentStep) return "completed";
-    if (index === currentStep) return "current";
-    return "pending";
-  };
-  const renderStep = (step, index) => {
-    const status = getStepStatus(index) || "pending";
-    const isClickable = clickable;
-    const statusStyles = {
-      pending: {
-        circle: "bg-muted text-muted-foreground border-2 border-muted",
-        title: "text-muted-foreground",
-        description: "text-muted-foreground"
-      },
-      current: {
-        circle: "bg-primary text-primary-foreground border-2 border-primary",
-        title: "text-foreground font-semibold",
-        description: "text-muted-foreground"
-      },
-      completed: {
-        circle: "bg-success text-success-foreground border-2 border-success",
-        title: "text-foreground",
-        description: "text-muted-foreground"
-      },
-      error: {
-        circle: "bg-destructive text-destructive-foreground border-2 border-destructive",
-        title: "text-destructive",
-        description: "text-destructive"
-      }
-    };
-    const styles = statusStyles[status];
-    const handleClick = () => {
-      if (isClickable && onStepClick) {
-        onStepClick(index);
-      }
-    };
-    const handleKeyDown = (e) => {
-      if (isClickable && onStepClick && (e.key === "Enter" || e.key === " ")) {
-        e.preventDefault();
-        onStepClick(index);
-      }
-    };
-    if (orientation === "horizontal") {
-      return /* @__PURE__ */ jsxRuntime.jsxs(
-        "div",
-        {
-          className: `flex-1 flex flex-col items-center ${isClickable ? "cursor-pointer" : ""}`,
-          onClick: handleClick,
-          onKeyDown: handleKeyDown,
-          role: isClickable ? "button" : void 0,
-          tabIndex: isClickable ? 0 : void 0,
-          "aria-label": `Step ${index + 1}: ${step.title}`,
-          "aria-current": status === "current" ? "step" : void 0,
-          children: [
-            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative flex items-center w-full", children: [
-              index > 0 && /* @__PURE__ */ jsxRuntime.jsx(
-                "div",
-                {
-                  className: `h-0.5 flex-1 ${status === "completed" || status === "current" ? "bg-success" : "bg-muted"}`
-                }
-              ),
-              /* @__PURE__ */ jsxRuntime.jsx(
-                "div",
-                {
-                  className: `
-                relative z-10 flex items-center justify-center
-                w-10 h-10 rounded-full
-                transition-colors transition-[background-color,border-color] duration-300 ease-in-out
-                ${styles.circle}
-              `,
-                  children: status === "completed" ? /* @__PURE__ */ jsxRuntime.jsx(iconsReact.IconCheck, { className: "w-5 h-5" }) : step.icon ? step.icon : /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-semibold", children: index + 1 })
-                }
-              ),
-              index < steps.length - 1 && /* @__PURE__ */ jsxRuntime.jsx(
-                "div",
-                {
-                  className: `h-0.5 flex-1 transition-colors duration-300 ease-in-out ${status === "completed" ? "bg-success" : "bg-muted"}`
-                }
-              )
-            ] }),
-            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `mt-3 text-center text-sm transition-colors duration-300 ease-in-out ${styles.title}`, children: [
-              step.title,
-              step.optional && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ml-1 text-xs text-muted-foreground", children: "(Optional)" }),
-              step.description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: `text-xs mt-1 transition-colors duration-300 ease-in-out ${styles.description}`, children: step.description })
-            ] })
-          ]
-        },
-        index
-      );
-    }
-    return /* @__PURE__ */ jsxRuntime.jsxs(
-      "div",
-      {
-        className: `flex gap-4 ${index < steps.length - 1 ? "pb-8" : ""} ${isClickable ? "cursor-pointer" : ""}`,
-        onClick: handleClick,
-        onKeyDown: handleKeyDown,
-        role: isClickable ? "button" : void 0,
-        tabIndex: isClickable ? 0 : void 0,
-        "aria-label": `Step ${index + 1}: ${step.title}`,
-        "aria-current": status === "current" ? "step" : void 0,
-        children: [
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-center", children: [
-            /* @__PURE__ */ jsxRuntime.jsx(
-              "div",
-              {
-                className: `
-              flex items-center justify-center
-              w-10 h-10 rounded-full flex-shrink-0
-              transition-colors transition-[background-color,border-color] duration-300 ease-in-out
-              ${styles.circle}
-            `,
-                children: status === "completed" ? /* @__PURE__ */ jsxRuntime.jsx(iconsReact.IconCheck, { className: "w-5 h-5" }) : step.icon ? step.icon : /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-semibold", children: index + 1 })
-              }
-            ),
-            index < steps.length - 1 && /* @__PURE__ */ jsxRuntime.jsx(
-              "div",
-              {
-                className: `w-0.5 flex-1 mt-2 transition-colors duration-300 ease-in-out ${status === "completed" ? "bg-success" : "bg-muted"}`
-              }
-            )
-          ] }),
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `flex-1 pt-2 text-base transition-colors duration-300 ease-in-out ${styles.title}`, children: [
-            step.title,
-            step.optional && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ml-2 text-xs text-muted-foreground", children: "(Optional)" }),
-            step.description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: `text-sm mt-1 transition-colors duration-300 ease-in-out ${styles.description}`, children: step.description })
-          ] })
-        ]
-      },
-      index
-    );
-  };
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    "div",
-    {
-      className: `
-        ${orientation === "horizontal" ? "flex items-start" : "flex flex-col"}
-        ${className}
-      `,
-      children: steps.map((step, index) => renderStep(step, index))
-    }
-  );
-}
-Stepper.displayName = "Stepper";
-var stepper_default = Stepper;
-function Toast({ message, children, type = "info", onClose, className = "", duration = 5e3 }) {
-  const [isClosing, setIsClosing] = React5.useState(false);
-  const typeClasses = {
-    info: "bg-info text-info-foreground",
-    success: "bg-success text-success-foreground",
-    warning: "bg-warning text-warning-foreground",
-    error: "bg-destructive text-destructive-foreground"
-  };
-  const handleClose = React5.useCallback(() => {
-    setIsClosing(true);
-    setTimeout(() => {
-      onClose?.();
-    }, 300);
-  }, [onClose]);
-  React5.useEffect(() => {
-    if (duration > 0) {
-      const timer = setTimeout(() => {
-        handleClose();
-      }, duration);
-      return () => clearTimeout(timer);
-    }
-    return void 0;
-  }, [duration, handleClose]);
-  const toast = /* @__PURE__ */ jsxRuntime.jsxs(
-    "div",
-    {
-      role: "alert",
-      "aria-live": "polite",
-      className: `fixed bottom-4 right-4 px-4 py-3 rounded-md shadow-lg z-[9999] ${typeClasses[type]} transition-all duration-300 ease-out ${isClosing ? "opacity-0 translate-x-full" : "opacity-100 translate-x-0 animate-slideInRight"} ${className}`,
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsx("span", { children: children || message }),
-        onClose && /* @__PURE__ */ jsxRuntime.jsx("button", { onClick: handleClose, className: "ml-4 font-bold hover:opacity-70 transition-opacity", "aria-label": "Close", children: "\xD7" })
-      ]
-    }
-  );
-  return typeof document !== "undefined" ? reactDom.createPortal(toast, document.body) : toast;
-}
-Toast.displayName = "Toast";
-var toast_default = Toast;
-function Tooltip({
-  children,
-  content,
-  position = "top",
-  variant = "default",
-  open = false,
-  usePortal = false,
-  className = ""
-}) {
-  const [showTooltip, setShowTooltip] = React5.useState(false);
-  const [tooltipPosition, setTooltipPosition] = React5.useState({ top: 0, left: 0 });
-  const triggerRef = React5.useRef(null);
-  const isVisible = open || showTooltip;
-  React5.useEffect(() => {
-    if (usePortal && isVisible && triggerRef.current) {
-      const rect = triggerRef.current.getBoundingClientRect();
-      const positions = {
-        top: {
-          top: rect.top - 8,
-          left: rect.left + rect.width / 2
-        },
-        bottom: {
-          top: rect.bottom + 8,
-          left: rect.left + rect.width / 2
-        },
-        left: {
-          top: rect.top + rect.height / 2,
-          left: rect.left - 8
-        },
-        right: {
-          top: rect.top + rect.height / 2,
-          left: rect.right + 8
-        }
-      };
-      setTooltipPosition(positions[position]);
-    }
-  }, [usePortal, isVisible, position]);
-  const variantClasses = {
-    default: "bg-popover text-popover-foreground",
-    primary: "bg-primary text-primary-foreground",
-    secondary: "bg-secondary text-secondary-foreground",
-    accent: "bg-accent text-accent-foreground",
-    info: "bg-blue-500 text-white",
-    success: "bg-green-500 text-white",
-    warning: "bg-yellow-500 text-foreground",
-    error: "bg-red-500 text-white",
-    neutral: "bg-muted text-muted-foreground"
-  };
-  const arrowColorClasses = {
-    default: "before:border-popover",
-    primary: "before:border-primary",
-    secondary: "before:border-secondary",
-    accent: "before:border-accent",
-    info: "before:border-blue-500",
-    success: "before:border-green-500",
-    warning: "before:border-yellow-500",
-    error: "before:border-red-500",
-    neutral: "before:border-muted"
-  };
-  const portalPositionClasses = {
-    top: "-translate-x-1/2 -translate-y-full before:left-1/2 before:-translate-x-1/2 before:top-full before:border-l-transparent before:border-r-transparent before:border-b-transparent",
-    bottom: "-translate-x-1/2 before:left-1/2 before:-translate-x-1/2 before:bottom-full before:border-l-transparent before:border-r-transparent before:border-t-transparent",
-    left: "-translate-x-full -translate-y-1/2 before:left-full before:top-1/2 before:-translate-y-1/2 before:border-t-transparent before:border-b-transparent before:border-r-transparent",
-    right: "-translate-y-1/2 before:left-full before:top-1/2 before:-translate-y-1/2 before:border-t-transparent before:border-b-transparent before:border-r-transparent"
-  };
-  const absolutePositionClasses = {
-    top: "bottom-full left-1/2 -translate-x-1/2 mb-2 before:left-1/2 before:-translate-x-1/2 before:top-full before:border-l-transparent before:border-r-transparent before:border-b-transparent",
-    bottom: "top-full left-1/2 -translate-x-1/2 mt-2 before:left-1/2 before:-translate-x-1/2 before:bottom-full before:border-l-transparent before:border-r-transparent before:border-t-transparent",
-    left: "right-full top-1/2 -translate-y-1/2 mr-2 before:top-1/2 before:-translate-y-1/2 before:left-full before:border-t-transparent before:border-b-transparent before:border-r-transparent",
-    right: "left-full top-1/2 -translate-y-1/2 ml-2 before:top-1/2 before:-translate-y-1/2 before:left-full before:border-t-transparent before:border-b-transparent before:border-r-transparent"
-  };
-  const positionClasses = usePortal ? portalPositionClasses : absolutePositionClasses;
-  const tooltipContent = /* @__PURE__ */ jsxRuntime.jsx(
-    "span",
-    {
-      className: `
-        ${usePortal ? "fixed" : "absolute"}
-        z-[9999]
-        px-3 py-2
-        text-sm font-medium
-        rounded-lg
-        shadow-lg
-        whitespace-nowrap
-        pointer-events-none
-        transition-opacity duration-200
-        ${variantClasses[variant]}
-        ${positionClasses[position]}
-        ${arrowColorClasses[variant]}
-        ${isVisible ? "opacity-100 visible" : "opacity-0 invisible"}
-        before:content-['']
-        before:absolute
-        before:border-4
-        before:border-solid
-      `,
-      style: usePortal ? {
-        top: `${tooltipPosition.top}px`,
-        left: `${tooltipPosition.left}px`
-      } : void 0,
-      role: "tooltip",
-      "aria-hidden": !isVisible,
-      children: content
-    }
-  );
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    "span",
-    {
-      ref: triggerRef,
-      className: `group relative inline-flex ${usePortal ? "" : "w-full"} ${className}`,
-      "data-position": position,
-      onMouseEnter: () => !open && setShowTooltip(true),
-      onMouseLeave: () => !open && setShowTooltip(false),
-      onFocus: () => !open && setShowTooltip(true),
-      onBlur: () => !open && setShowTooltip(false),
-      children: [
-        children,
-        usePortal && isVisible ? reactDom.createPortal(tooltipContent, document.body) : !usePortal && tooltipContent
-      ]
-    }
-  );
-}
-Tooltip.displayName = "Tooltip";
-var tooltip_default = Tooltip;
-
-// src/utils/portal.ts
-function getPortalRoot(id = "hydn-ui-portal") {
-  if (typeof document === "undefined") return null;
-  let root = document.getElementById(id);
-  if (!root) {
-    root = document.createElement("div");
-    root.id = id;
-    document.body.appendChild(root);
-  }
-  return root;
-}
-var portal_default = getPortalRoot;
-function useOverlay(options) {
-  const {
-    isOpen,
-    focusTrap = true,
-    lockScroll = true,
-    animationFrames = 2,
-    restoreFocus = true,
-    exitDuration = 300,
-    unmountOnExit = true
-  } = options;
-  const previouslyFocusedRef = React5.useRef(null);
-  const containerRef = React5.useRef(null);
-  const [shouldRender, setShouldRender] = React5.useState(isOpen);
-  const [phase, setPhase] = React5.useState("mount");
-  React5.useLayoutEffect(() => {
-    if (isOpen && !shouldRender) {
-      setShouldRender(true);
-      setPhase("mount");
-    } else if (isOpen && shouldRender && phase === "mount") {
-      requestAnimationFrame(() => {
-        setPhase("animating-in");
-        let frame = 0;
-        const step = () => {
-          frame += 1;
-          if (frame >= animationFrames) {
-            setPhase("visible");
-          } else {
-            requestAnimationFrame(step);
-          }
-        };
-        if (animationFrames > 0) {
-          requestAnimationFrame(step);
-        } else {
-          setPhase("visible");
-        }
-      });
-    } else if (!isOpen && shouldRender && phase !== "animating-out") {
-      setPhase("animating-out");
-    }
-  }, [isOpen, shouldRender, phase, animationFrames]);
-  React5.useEffect(() => {
-    if (phase === "animating-out" && unmountOnExit) {
-      const timeout = setTimeout(() => {
-        setShouldRender(false);
-        setPhase("mount");
-      }, exitDuration);
-      return () => clearTimeout(timeout);
-    }
-    return void 0;
-  }, [phase, exitDuration, unmountOnExit]);
-  React5.useEffect(() => {
-    if (isOpen) {
-      if (typeof document !== "undefined") {
-        if (restoreFocus) previouslyFocusedRef.current = document.activeElement;
-        if (lockScroll) document.body.style.overflow = "hidden";
-      }
-    }
-    return () => {
-      if (typeof document !== "undefined") {
-        if (lockScroll) document.body.style.overflow = "";
-        if (!isOpen && restoreFocus && previouslyFocusedRef.current) {
-          previouslyFocusedRef.current.focus();
-        }
-      }
-    };
-  }, [isOpen, lockScroll, restoreFocus]);
-  React5.useEffect(() => {
-    if (phase === "visible" && containerRef.current) {
-      const el = containerRef.current;
-      try {
-        el.focus?.({ preventScroll: true });
-      } catch {
-        el.focus?.();
-      }
-    }
-  }, [phase]);
-  const handleKeyDown = React5.useCallback(
-    (e) => {
-      if (!focusTrap || phase !== "visible" || e.key !== "Tab" || !containerRef.current) return;
-      const node = containerRef.current;
-      const focusable = node.querySelectorAll(
-        'a[href], button:not([disabled]), textarea, input, select, [tabindex]:not([tabindex="-1"])'
-      );
-      if (!focusable.length) return;
-      const first = focusable[0];
-      const last = focusable[focusable.length - 1];
-      if (e.shiftKey) {
-        if (document.activeElement === first || document.activeElement === node) {
-          e.preventDefault();
-          last.focus();
-        }
-      } else if (document.activeElement === last) {
-        e.preventDefault();
-        first.focus();
-      }
-    },
-    [focusTrap, phase]
-  );
-  React5.useEffect(() => {
-    if (focusTrap && phase === "visible") {
-      document.addEventListener("keydown", handleKeyDown);
-      return () => document.removeEventListener("keydown", handleKeyDown);
-    }
-    return void 0;
-  }, [phase, focusTrap, handleKeyDown]);
-  const getPhaseClass = React5.useCallback(
-    (openClass, closedClass) => {
-      return phase === "animating-in" || phase === "visible" ? openClass : closedClass;
-    },
-    [phase]
-  );
-  return { phase, shouldRender, ref: containerRef, getPhaseClass };
-}
-var useOverlay_default = useOverlay;
-function Modal({
-  isOpen,
-  onClose,
-  children,
-  title,
-  description,
-  content,
-  actions,
-  className = "",
-  ariaLabel,
-  align = "center",
-  portalRoot = portal_default()
-}) {
-  const {
-    phase,
-    shouldRender,
-    ref: dialogRef,
-    getPhaseClass
-  } = useOverlay_default({
-    isOpen,
-    focusTrap: true,
-    lockScroll: true,
-    animationFrames: 2,
-    restoreFocus: true
-  });
-  React5__default.default.useEffect(() => {
-    if (!isOpen) return;
-    const handleEscape = (e) => {
-      if (e.key === "Escape") {
-        e.preventDefault();
-        onClose();
-      }
-    };
-    document.addEventListener("keydown", handleEscape);
-    return () => document.removeEventListener("keydown", handleEscape);
-  }, [isOpen, onClose]);
-  if (!shouldRender) return null;
-  const enteringClasses = "scale-100 translate-y-0 opacity-100";
-  const exitingClasses = "scale-[0.97] -translate-y-1 opacity-0";
-  const scaleClass = getPhaseClass(enteringClasses, exitingClasses);
-  const backdropOpacity = phase === "visible" || phase === "animating-in" ? "opacity-100" : "opacity-0 transition-opacity delay-50";
-  const hasStructured = title || description || content || actions;
-  const alignmentClasses = align === "center" ? "grid place-items-center" : "flex items-start justify-center pt-20";
-  const panel = /* @__PURE__ */ jsxRuntime.jsx(
-    "div",
-    {
-      "data-phase": phase,
-      className: `fixed inset-0 z-[999] ${alignmentClasses} bg-black/40 backdrop-blur-sm p-4 overflow-y-auto overscroll-contain transition-opacity duration-300 will-change-opacity ${backdropOpacity}`,
-      onMouseDown: (e) => {
-        if (e.target === e.currentTarget) onClose();
-      },
-      "aria-label": ariaLabel || "Close modal",
-      role: "presentation",
-      children: /* @__PURE__ */ jsxRuntime.jsx(
-        "div",
-        {
-          ref: dialogRef,
-          "data-phase": phase,
-          className: `relative w-11/12 max-w-2xl max-h-[calc(100vh-5em)] bg-card text-card-foreground rounded-2xl border border-border shadow-2xl p-6 focus:outline-none transform transition-[transform,opacity] duration-250 ease-[cubic-bezier(.33,.66,.33,1)] will-change-transform will-change-opacity select-none [backface-visibility:hidden] [transform-style:preserve-3d] ${scaleClass} ${className}`,
-          role: "dialog",
-          "aria-modal": "true",
-          tabIndex: -1,
-          onTransitionEnd: (e) => {
-            if (e.target !== dialogRef.current) return;
-          },
-          children: hasStructured ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-            title && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-              typeof title === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-xl font-semibold tracking-tight", children: title }) : title,
-              description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-1 text-sm text-muted-foreground", children: description })
-            ] }),
-            content && /* @__PURE__ */ jsxRuntime.jsx("section", { className: "text-sm leading-relaxed space-y-3 mt-4", children: content }),
-            actions && /* @__PURE__ */ jsxRuntime.jsx("footer", { className: "flex justify-end gap-2 pt-2 mt-4 border-t border-border/60", children: actions })
-          ] }) : children
-        }
-      )
-    }
-  );
-  return portalRoot ? reactDom.createPortal(panel, portalRoot) : panel;
-}
-Modal.displayName = "Modal";
-var modal_default = Modal;
-function Dialog({ isOpen, onClose, title, children, actions, className = "" }) {
-  return /* @__PURE__ */ jsxRuntime.jsx(modal_default, { isOpen, onClose, ariaLabel: title, className, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col p-6 gap-4", children: [
-    /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-2xl font-bold text-foreground", children: title }),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-foreground", children }),
-    actions && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex justify-end gap-3 pt-2", children: actions })
-  ] }) });
-}
-Dialog.displayName = "Dialog";
-var dialog_default = Dialog;
-function DeleteDialog({
-  isOpen,
-  onClose,
-  onConfirm,
-  title = "Confirm Deletion",
-  description,
-  itemName,
-  isLoading = false,
-  confirmText = "Delete",
-  cancelText = "Cancel",
-  className = ""
-}) {
-  const defaultDescription = itemName ? `Are you sure you want to delete "${itemName}"? This action cannot be undone.` : "Are you sure you want to delete this item? This action cannot be undone.";
-  const finalDescription = description || defaultDescription;
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    dialog_default,
-    {
-      isOpen,
-      onClose,
-      title,
-      className,
-      actions: /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-        /* @__PURE__ */ jsxRuntime.jsx(
-          button_default,
-          {
-            onClick: onClose,
-            disabled: isLoading,
-            className: "bg-muted hover:bg-muted/80 text-muted-foreground",
-            icon: /* @__PURE__ */ jsxRuntime.jsx(iconsReact.IconX, { size: 16 }),
-            children: cancelText
-          }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          button_default,
-          {
-            onClick: onConfirm,
-            disabled: isLoading,
-            className: "bg-destructive hover:bg-destructive/90 text-destructive-foreground",
-            icon: /* @__PURE__ */ jsxRuntime.jsx(iconsReact.IconTrash, { size: 16 }),
-            children: isLoading ? "Deleting..." : confirmText
-          }
-        )
-      ] }),
-      children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-foreground", children: finalDescription })
-    }
-  );
-}
-DeleteDialog.displayName = "DeleteDialog";
-var delete_dialog_default = DeleteDialog;
-function Popover({ trigger, children, content, position = "bottom", className = "" }) {
-  const [isOpen, setIsOpen] = React5.useState(false);
-  const popoverRef = React5.useRef(null);
-  const triggerContent = children || trigger;
-  React5.useEffect(() => {
-    const handleClickOutside = (event) => {
-      if (popoverRef.current && !popoverRef.current.contains(event.target)) {
-        setIsOpen(false);
-      }
-    };
-    const handleEscape = (event) => {
-      if (event.key === "Escape") {
-        setIsOpen(false);
-      }
-    };
-    if (isOpen) {
-      document.addEventListener("mousedown", handleClickOutside);
-      document.addEventListener("keydown", handleEscape);
-      return () => {
-        document.removeEventListener("mousedown", handleClickOutside);
-        document.removeEventListener("keydown", handleEscape);
-      };
-    }
-    return void 0;
-  }, [isOpen]);
-  const positionClasses = {
-    top: "bottom-full left-1/2 -translate-x-1/2 mb-2",
-    bottom: "top-full left-1/2 -translate-x-1/2 mt-2",
-    left: "right-full top-1/2 -translate-y-1/2 mr-2",
-    right: "left-full top-1/2 -translate-y-1/2 ml-2"
-  };
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `relative inline-block ${className}`, ref: popoverRef, children: [
-    /* @__PURE__ */ jsxRuntime.jsx(
-      "button",
-      {
-        onClick: () => setIsOpen(!isOpen),
-        className: "bg-transparent border-0 p-0 cursor-pointer",
-        type: "button",
-        "aria-expanded": isOpen,
-        "aria-haspopup": "true",
-        children: triggerContent
-      }
-    ),
-    isOpen && /* @__PURE__ */ jsxRuntime.jsx(
-      "div",
-      {
-        className: `absolute min-w-[200px] bg-popover text-popover-foreground border border-border rounded-lg shadow-xl p-4 z-50 animate-scaleIn ${positionClasses[position]}`,
-        role: "tooltip",
-        children: content
-      }
-    )
-  ] });
-}
-Popover.displayName = "Popover";
-var popover_default = Popover;
-function Alert({ children, type = "info", dismissible = false, onClose, className = "", position = "relative", duration = 0 }) {
-  const [isClosing, setIsClosing] = React5.useState(false);
-  const typeClasses = {
-    info: "bg-info/20 text-foreground border-info/50 backdrop-blur-sm",
-    success: "bg-success/20 text-foreground border-success/50 backdrop-blur-sm",
-    warning: "bg-warning/20 text-foreground border-warning/50 backdrop-blur-sm",
-    error: "bg-destructive/20 text-foreground border-destructive/50 backdrop-blur-sm"
-  };
-  const iconClasses = {
-    info: "text-info",
-    success: "text-success",
-    warning: "text-warning",
-    error: "text-destructive"
-  };
-  const handleClose = React5.useCallback(() => {
-    setIsClosing(true);
-    setTimeout(() => {
-      onClose?.();
-    }, 300);
-  }, [onClose]);
-  React5.useEffect(() => {
-    if (duration > 0 && onClose) {
-      const timer = setTimeout(() => {
-        handleClose();
-      }, duration);
-      return () => clearTimeout(timer);
-    }
-    return void 0;
-  }, [duration, onClose, handleClose]);
-  const icons = {
-    info: /* @__PURE__ */ jsxRuntime.jsx("svg", { className: "w-5 h-5 flex-shrink-0", fill: "currentColor", viewBox: "0 0 20 20", children: /* @__PURE__ */ jsxRuntime.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__ */ jsxRuntime.jsx("svg", { className: "w-5 h-5 flex-shrink-0", fill: "currentColor", viewBox: "0 0 20 20", children: /* @__PURE__ */ jsxRuntime.jsx(
-      "path",
-      {
-        fillRule: "evenodd",
-        d: "M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z",
-        clipRule: "evenodd"
-      }
-    ) }),
-    warning: /* @__PURE__ */ jsxRuntime.jsx("svg", { className: "w-5 h-5 flex-shrink-0", fill: "currentColor", viewBox: "0 0 20 20", children: /* @__PURE__ */ jsxRuntime.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"
-      }
-    ) }),
-    error: /* @__PURE__ */ jsxRuntime.jsx("svg", { className: "w-5 h-5 flex-shrink-0", fill: "currentColor", viewBox: "0 0 20 20", children: /* @__PURE__ */ jsxRuntime.jsx(
-      "path",
-      {
-        fillRule: "evenodd",
-        d: "M10 18a8 8 0 100-16 8 8 0 000 16zM8.707 7.293a1 1 0 00-1.414 1.414L8.586 10l-1.293 1.293a1 1 0 101.414 1.414L10 11.414l1.293 1.293a1 1 0 001.414-1.414L11.414 10l1.293-1.293a1 1 0 00-1.414-1.414L10 8.586 8.707 7.293z",
-        clipRule: "evenodd"
-      }
-    ) })
-  };
-  const positionClasses = {
-    top: "fixed top-4 left-1/2 -translate-x-1/2 z-[9999] max-w-2xl w-full mx-4",
-    bottom: "fixed bottom-4 left-1/2 -translate-x-1/2 z-[9999] max-w-2xl w-full mx-4",
-    relative: ""
-  };
-  const getAnimationClasses = () => {
-    if (position === "top") {
-      return isClosing ? "opacity-0 -translate-y-full" : "opacity-100 translate-y-0 animate-slideInTop";
-    }
-    if (position === "bottom") {
-      return isClosing ? "opacity-0 translate-y-full" : "opacity-100 translate-y-0 animate-slideInBottom";
-    }
-    return isClosing ? "opacity-0" : "opacity-100";
-  };
-  const alertContent = /* @__PURE__ */ jsxRuntime.jsxs(
-    "div",
-    {
-      role: "alert",
-      className: `p-4 border rounded-lg flex items-start gap-3 transition-all duration-300 ease-out ${typeClasses[type]} ${positionClasses[position]} ${getAnimationClasses()} ${className}`,
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsx("span", { className: iconClasses[type], children: icons[type] }),
-        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex-1 text-sm", children }),
-        dismissible && onClose && /* @__PURE__ */ jsxRuntime.jsx(
-          "button",
-          {
-            onClick: handleClose,
-            className: "flex-shrink-0 text-current opacity-70 hover:opacity-100 transition-opacity focus:outline-none focus:ring-2 focus:ring-ring rounded p-0.5",
-            "aria-label": "Close alert",
-            children: /* @__PURE__ */ jsxRuntime.jsx("svg", { className: "w-5 h-5", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsxRuntime.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" }) })
-          }
-        )
-      ]
-    }
-  );
-  if (position !== "relative" && typeof document !== "undefined") {
-    return reactDom.createPortal(alertContent, document.body);
-  }
-  return alertContent;
-}
-Alert.displayName = "Alert";
-var alert_default = Alert;
-function Spinner({ size = "md", variant = "primary", className = "", speed, ...props }) {
-  const sizeClasses = {
-    sm: "w-4 h-4 border-2",
-    md: "w-8 h-8 border-2",
-    lg: "w-12 h-12 border-4"
-  };
-  const variantTopBorder = {
-    primary: "border-t-primary",
-    accent: "border-t-accent",
-    secondary: "border-t-secondary",
-    neutral: "border-t-neutral"
-  }[variant];
-  const duration = speed ? `[animation-duration:${speed}]` : "";
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    "div",
-    {
-      role: "status",
-      "aria-label": "Loading",
-      "data-variant": variant,
-      className: `inline-block border-muted ${variantTopBorder} rounded-full animate-spin ${duration} ${sizeClasses[size]} ${className}`,
-      ...props,
-      children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Loading..." })
-    }
-  );
-}
-Spinner.displayName = "Spinner";
-var spinner_default = Spinner;
-function ProgressBar({
-  value,
-  max = 100,
-  showLabel = false,
-  variant = "default",
-  className = ""
-}) {
-  const percentage = Math.min(value / max * 100, 100);
-  const variantClasses = {
-    default: "bg-primary",
-    success: "bg-success",
-    warning: "bg-warning",
-    error: "bg-destructive"
-  };
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className, children: [
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-full bg-muted/30 rounded-full h-2.5 overflow-hidden shadow-inner", children: /* @__PURE__ */ jsxRuntime.jsx(
-      "div",
-      {
-        role: "progressbar",
-        "aria-valuenow": value,
-        "aria-valuemin": 0,
-        "aria-valuemax": max,
-        className: `h-full transition-all duration-500 ease-out rounded-full ${variantClasses[variant]}`,
-        style: { width: `${percentage}%` }
-      }
-    ) }),
-    showLabel && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-sm text-muted-foreground mt-2 text-right font-medium", children: [
-      Math.round(percentage),
-      "%"
-    ] })
-  ] });
-}
-ProgressBar.displayName = "ProgressBar";
-var progress_bar_default = ProgressBar;
-function Skeleton({ variant = "text", width, height, className = "", ...props }) {
-  const variantClasses = {
-    text: "rounded h-4",
-    circular: "rounded-full",
-    rectangular: "rounded-md"
-  };
-  const style = {
-    width: width || (variant === "circular" ? "40px" : "100%"),
-    height: height || (variant === "circular" ? "40px" : void 0)
-  };
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    "div",
-    {
-      className: `bg-muted animate-pulse ${variantClasses[variant]} ${className}`,
-      style,
-      "aria-busy": "true",
-      "aria-live": "polite",
-      ...props,
-      children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Loading..." })
-    }
-  );
-}
-Skeleton.displayName = "Skeleton";
-var skeleton_default = Skeleton;
-function Badge({ children, variant = "default", size = "md", className = "", ...props }) {
-  const variantClasses = {
-    default: "bg-muted text-muted-foreground border border-border",
-    primary: "bg-primary/10 text-primary border border-primary/20",
-    success: "bg-success/10 text-success border border-success/20",
-    warning: "bg-warning/10 text-warning border border-warning/20",
-    error: "bg-destructive/10 text-destructive border border-destructive/20"
-  };
-  const sizeClasses = {
-    sm: "px-2 py-0.5 text-xs",
-    md: "px-2.5 py-0.5 text-xs font-semibold",
-    lg: "px-3 py-1 text-sm font-semibold"
-  };
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    "span",
-    {
-      className: `inline-flex items-center font-medium rounded-full transition-colors ${variantClasses[variant]} ${sizeClasses[size]} ${className}`,
-      ...props,
-      children
-    }
-  );
-}
-Badge.displayName = "Badge";
-var badge_default = Badge;
-function StatusLabel({
-  children,
-  status = "info",
-  size = "md",
-  variant = "filled",
-  className = ""
-}) {
-  const statusConfig = {
-    active: {
-      filled: "bg-success/10 text-success border-success/20",
-      outlined: "bg-transparent text-success border-success",
-      dot: "bg-success"
-    },
-    inactive: {
-      filled: "bg-muted text-muted-foreground border-border",
-      outlined: "bg-transparent text-muted-foreground border-muted-foreground",
-      dot: "bg-muted-foreground"
-    },
-    pending: {
-      filled: "bg-warning/10 text-warning border-warning/20",
-      outlined: "bg-transparent text-warning border-warning",
-      dot: "bg-warning"
-    },
-    success: {
-      filled: "bg-success/10 text-success border-success/20",
-      outlined: "bg-transparent text-success border-success",
-      dot: "bg-success"
-    },
-    error: {
-      filled: "bg-destructive/10 text-destructive border-destructive/20",
-      outlined: "bg-transparent text-destructive border-destructive",
-      dot: "bg-destructive"
-    },
-    warning: {
-      filled: "bg-warning/10 text-warning border-warning/20",
-      outlined: "bg-transparent text-warning border-warning",
-      dot: "bg-warning"
-    },
-    info: {
-      filled: "bg-primary/10 text-primary border-primary/20",
-      outlined: "bg-transparent text-primary border-primary",
-      dot: "bg-primary"
-    }
-  };
-  const sizeClasses = {
-    sm: {
-      container: "px-2 py-0.5 text-xs gap-1.5",
-      dot: "w-1.5 h-1.5"
-    },
-    md: {
-      container: "px-2.5 py-0.5 text-sm gap-2",
-      dot: "w-2 h-2"
-    },
-    lg: {
-      container: "px-3 py-1 text-base gap-2",
-      dot: "w-2.5 h-2.5"
-    }
-  };
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    "span",
-    {
-      className: `inline-flex items-center font-medium rounded-full border ${statusConfig[status][variant]} ${sizeClasses[size].container} ${className}`,
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsx("span", { className: `rounded-full ${statusConfig[status].dot} ${sizeClasses[size].dot}` }),
-        children
-      ]
-    }
-  );
-}
-StatusLabel.displayName = "StatusLabel";
-var status_label_default = StatusLabel;
-function Avatar({ src, alt = "", fallback, size = "md", className = "" }) {
-  const sizeClasses = {
-    sm: "w-8 h-8 text-xs",
-    md: "w-10 h-10 text-sm",
-    lg: "w-12 h-12 text-base",
-    xl: "w-16 h-16 text-lg"
-  };
-  let content;
-  if (src) {
-    content = /* @__PURE__ */ jsxRuntime.jsx("img", { src, alt, className: "w-full h-full object-cover" });
-  } else if (fallback) {
-    content = fallback;
-  } else {
-    content = /* @__PURE__ */ jsxRuntime.jsx("span", { children: alt.charAt(0).toUpperCase() });
-  }
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    "div",
-    {
-      className: `inline-flex items-center justify-center rounded-full bg-muted text-muted-foreground font-medium overflow-hidden ${sizeClasses[size]} ${className}`,
-      children: content
-    }
-  );
-}
-Avatar.displayName = "Avatar";
-var avatar_default = Avatar;
-function EmptyState({ title, description, icon, action, className = "" }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `flex flex-col items-center justify-center text-center py-12 ${className}`, children: [
-    icon && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-muted-foreground mb-4", children: icon }),
-    /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-lg font-semibold text-foreground mb-2", children: title }),
-    description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-muted-foreground mb-6 max-w-sm", children: description }),
-    action
-  ] });
-}
-EmptyState.displayName = "EmptyState";
-var empty_state_default = EmptyState;
-function List({ children, className = "", ordered = false }) {
-  const Component = ordered ? "ol" : "ul";
-  return /* @__PURE__ */ jsxRuntime.jsx(Component, { className: `divide-y divide-border ${className}`, children });
-}
-List.displayName = "List";
-function ListItem({ children, className = "" }) {
-  return /* @__PURE__ */ jsxRuntime.jsx("li", { className: `py-3 ${className}`, children });
-}
-ListItem.displayName = "ListItem";
-function Table({
-  children,
-  className = "",
-  striped = false,
-  bordered = false,
-  hoverable = false,
-  compact = false,
-  caption,
-  ...props
-}) {
-  const baseClasses = "w-full text-sm text-left";
-  const stripedClasses = striped ? "striped" : "";
-  const borderedClasses = bordered ? "border border-border" : "";
-  const compactClasses = compact ? "table-compact" : "";
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "overflow-x-auto rounded-lg", children: [
-    /* @__PURE__ */ jsxRuntime.jsxs(
-      "table",
-      {
-        className: `${baseClasses} ${stripedClasses} ${borderedClasses} ${compactClasses} ${className}`,
-        ...props,
-        children: [
-          caption && /* @__PURE__ */ jsxRuntime.jsx("caption", { className: "sr-only", children: caption }),
-          children
-        ]
-      }
-    ),
-    /* @__PURE__ */ jsxRuntime.jsx("style", { children: `
-        .striped tbody tr:nth-child(even) {
-          background-color: hsl(var(--muted) / 0.3);
-        }
-        ${hoverable ? `
-        table tbody tr:hover {
-          background-color: hsl(var(--muted) / 0.5);
-        }
-        ` : ""}
-        .table-compact td,
-        .table-compact th {
-          padding: 0.5rem;
-        }
-      ` })
-  ] });
-}
-function TableHeader({ children, className = "", ...props }) {
-  return /* @__PURE__ */ jsxRuntime.jsx("thead", { className: `text-xs text-muted-foreground uppercase bg-muted/50 ${className}`, ...props, children });
-}
-function TableBody({ children, className = "", ...props }) {
-  return /* @__PURE__ */ jsxRuntime.jsx("tbody", { className: `divide-y divide-border ${className}`, ...props, children });
-}
-function TableFooter({ children, className = "", ...props }) {
-  return /* @__PURE__ */ jsxRuntime.jsx("tfoot", { className: `text-xs font-semibold text-foreground bg-muted/30 ${className}`, ...props, children });
-}
-function TableRow({ children, className = "", selected = false, ...props }) {
-  const selectedClasses = selected ? "bg-primary/10" : "";
-  return /* @__PURE__ */ jsxRuntime.jsx("tr", { className: `${selectedClasses} ${className}`, ...props, children });
-}
-function TableHeadCell({
-  children,
-  className = "",
-  align = "left",
-  scope = "col",
-  ...props
-}) {
-  const alignClasses = {
-    left: "text-left",
-    center: "text-center",
-    right: "text-right"
-  };
-  return /* @__PURE__ */ jsxRuntime.jsx("th", { scope, className: `px-6 py-3 font-medium ${alignClasses[align]} ${className}`, ...props, children });
-}
-function TableCell({ children, className = "", align = "left", ...props }) {
-  const alignClasses = {
-    left: "text-left",
-    center: "text-center",
-    right: "text-right"
-  };
-  return /* @__PURE__ */ jsxRuntime.jsx("td", { className: `px-6 py-4 whitespace-nowrap ${alignClasses[align]} ${className}`, ...props, children });
-}
-function useTable({ data, initialSort, pageSize = 10 }) {
-  const [sortConfig, setSortConfig] = React5.useState(
-    initialSort ? { key: initialSort.key, direction: initialSort.direction } : null
-  );
-  const [currentPage, setCurrentPage] = React5.useState(1);
-  const [selectedRows, setSelectedRows] = React5.useState(/* @__PURE__ */ new Set());
-  const sortedData = React5.useMemo(() => {
-    if (!sortConfig) return data;
-    const sorted = [...data].sort((a, b) => {
-      const aValue = a[sortConfig.key];
-      const bValue = b[sortConfig.key];
-      if (aValue === bValue) return 0;
-      if (aValue == null) return 1;
-      if (bValue == null) return -1;
-      if (aValue < bValue) {
-        return sortConfig.direction === "asc" ? -1 : 1;
-      }
-      return sortConfig.direction === "asc" ? 1 : -1;
-    });
-    return sorted;
-  }, [data, sortConfig]);
-  const totalPages = Math.ceil(sortedData.length / pageSize);
-  const startIndex = (currentPage - 1) * pageSize;
-  const endIndex = startIndex + pageSize;
-  const currentData = sortedData.slice(startIndex, endIndex);
-  const handleSort = (key) => {
-    let direction = "asc";
-    if (sortConfig?.key === key) {
-      if (sortConfig.direction === "asc") {
-        direction = "desc";
-      } else if (sortConfig.direction === "desc") {
-        direction = null;
-      }
-    }
-    setSortConfig(direction ? { key, direction } : null);
-    setCurrentPage(1);
-  };
-  const nextPage = () => {
-    setCurrentPage((prev) => Math.min(prev + 1, totalPages));
-  };
-  const prevPage = () => {
-    setCurrentPage((prev) => Math.max(prev - 1, 1));
-  };
-  const canNextPage = currentPage < totalPages;
-  const canPrevPage = currentPage > 1;
-  const toggleRow = (index) => {
-    setSelectedRows((prev) => {
-      const newSet = new Set(prev);
-      if (newSet.has(index)) {
-        newSet.delete(index);
-      } else {
-        newSet.add(index);
-      }
-      return newSet;
-    });
-  };
-  const toggleAll = () => {
-    if (selectedRows.size === currentData.length) {
-      setSelectedRows(/* @__PURE__ */ new Set());
-    } else {
-      const allIndices = currentData.map((_, idx) => startIndex + idx);
-      setSelectedRows(new Set(allIndices));
-    }
-  };
-  const isRowSelected = (index) => selectedRows.has(index);
-  const isAllSelected = currentData.length > 0 && currentData.every((_, idx) => selectedRows.has(startIndex + idx));
-  const clearSelection = () => setSelectedRows(/* @__PURE__ */ new Set());
-  return {
-    currentData,
-    sortedData,
-    sortConfig,
-    handleSort,
-    currentPage,
-    totalPages,
-    setCurrentPage,
-    nextPage,
-    prevPage,
-    canNextPage,
-    canPrevPage,
-    selectedRows,
-    toggleRow,
-    toggleAll,
-    isRowSelected,
-    isAllSelected,
-    clearSelection
-  };
-}
-function DataTable({
-  data,
-  columns,
-  className = "",
-  striped = true,
-  bordered = false,
-  hoverable = true,
-  compact = false,
-  stickyHeader = false,
-  sortable = true,
-  paginated = false,
-  pageSize = 10,
-  selectable = false,
-  actions,
-  actionsLabel = "Actions",
-  actionsWidth = "w-32",
-  onRowClick,
-  onSelectionChange,
-  emptyMessage = "No data available",
-  emptyIcon,
-  initialSort
-}) {
-  const tableOptions = {
-    data,
-    initialSort,
-    pageSize
-  };
-  const {
-    currentData,
-    sortedData,
-    sortConfig,
-    handleSort,
-    currentPage,
-    totalPages,
-    nextPage,
-    prevPage,
-    canNextPage,
-    canPrevPage,
-    selectedRows,
-    toggleRow,
-    toggleAll,
-    isRowSelected,
-    isAllSelected
-  } = useTable(tableOptions);
-  const displayData = paginated ? currentData : sortedData;
-  const handleToggleRow = (index) => {
-    toggleRow(index);
-    if (onSelectionChange) {
-      const newSelection = new Set(selectedRows);
-      if (newSelection.has(index)) {
-        newSelection.delete(index);
-      } else {
-        newSelection.add(index);
-      }
-      onSelectionChange(Array.from(newSelection));
-    }
-  };
-  const handleToggleAll = () => {
-    toggleAll();
-    if (onSelectionChange) {
-      if (isAllSelected) {
-        onSelectionChange([]);
-      } else {
-        const startIndex = (currentPage - 1) * pageSize;
-        const allIndices = displayData.map((_, idx) => startIndex + idx);
-        onSelectionChange(allIndices);
-      }
-    }
-  };
-  const renderSortIcon = (columnKey) => {
-    if (!sortable) return null;
-    const isSorted = sortConfig?.key === columnKey;
-    if (!isSorted) {
-      return /* @__PURE__ */ jsxRuntime.jsx(iconsReact.IconSelector, { className: "w-4 h-4 ml-1 text-muted-foreground" });
-    }
-    if (sortConfig?.direction === "asc") {
-      return /* @__PURE__ */ jsxRuntime.jsx(iconsReact.IconChevronUp, { className: "w-4 h-4 ml-1 text-primary" });
-    }
-    return /* @__PURE__ */ jsxRuntime.jsx(iconsReact.IconChevronDown, { className: "w-4 h-4 ml-1 text-primary" });
-  };
-  if (data.length === 0) {
-    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "border border-border rounded-lg", children: /* @__PURE__ */ jsxRuntime.jsx(empty_state_default, { title: emptyMessage, icon: emptyIcon, className: "py-12" }) });
-  }
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className, children: [
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: stickyHeader ? "overflow-auto max-h-[600px]" : "", children: /* @__PURE__ */ jsxRuntime.jsxs(Table, { striped, bordered, hoverable, compact, children: [
-      /* @__PURE__ */ jsxRuntime.jsx(TableHeader, { className: stickyHeader ? "sticky top-0 z-10 bg-background shadow-sm" : "", children: /* @__PURE__ */ jsxRuntime.jsxs(TableRow, { children: [
-        selectable && /* @__PURE__ */ jsxRuntime.jsx(TableHeadCell, { className: "w-12", children: /* @__PURE__ */ jsxRuntime.jsx(checkbox_default, { checked: isAllSelected, onChange: handleToggleAll, ariaLabel: "Select all rows" }) }),
-        columns.map((column) => /* @__PURE__ */ jsxRuntime.jsx(
-          TableHeadCell,
-          {
-            align: column.align,
-            className: column.width ? `w-[${column.width}]` : "",
-            children: column.sortable !== false && sortable ? /* @__PURE__ */ jsxRuntime.jsxs(
-              "button",
-              {
-                onClick: () => handleSort(column.key),
-                className: "flex items-center gap-1 hover:text-foreground transition-colors font-medium",
-                type: "button",
-                children: [
-                  column.label,
-                  renderSortIcon(column.key)
-                ]
-              }
-            ) : column.label
-          },
-          String(column.key)
-        )),
-        actions && /* @__PURE__ */ jsxRuntime.jsx(TableHeadCell, { align: "center", className: actionsWidth, children: actionsLabel })
-      ] }) }),
-      /* @__PURE__ */ jsxRuntime.jsx(TableBody, { children: displayData.map((row, rowIndex) => {
-        const actualIndex = paginated ? (currentPage - 1) * pageSize + rowIndex : rowIndex;
-        const isSelected = isRowSelected(actualIndex);
-        return /* @__PURE__ */ jsxRuntime.jsxs(
-          TableRow,
-          {
-            selected: isSelected,
-            onClick: onRowClick ? () => onRowClick(row, actualIndex) : void 0,
-            className: onRowClick ? "cursor-pointer" : "",
-            children: [
-              selectable && /* @__PURE__ */ jsxRuntime.jsx(TableCell, { onClick: (e) => e.stopPropagation(), children: /* @__PURE__ */ jsxRuntime.jsx(
-                checkbox_default,
-                {
-                  checked: isSelected,
-                  onChange: () => handleToggleRow(actualIndex),
-                  ariaLabel: `Select row ${actualIndex + 1}`
-                }
-              ) }),
-              columns.map((column) => {
-                const value = row[column.key];
-                const content = column.render ? column.render(value, row, actualIndex) : String(value ?? "");
-                return /* @__PURE__ */ jsxRuntime.jsx(TableCell, { align: column.align, children: content }, String(column.key));
-              }),
-              actions && /* @__PURE__ */ jsxRuntime.jsx(TableCell, { align: "center", onClick: (e) => e.stopPropagation(), children: Array.isArray(actions) ? /* @__PURE__ */ jsxRuntime.jsx(stack_default, { direction: "horizontal", spacing: "sm", justify: "center", children: actions.map((action, actionIndex) => {
-                if (action && typeof action === "object" && "onClick" in action) {
-                  const actionConfig = action;
-                  return /* @__PURE__ */ jsxRuntime.jsx(
-                    button_default,
-                    {
-                      size: "sm",
-                      variant: actionConfig.variant || "neutral",
-                      style: "ghost",
-                      icon: actionConfig.icon,
-                      ariaLabel: actionConfig.label,
-                      onClick: () => actionConfig.onClick(row, actualIndex)
-                    },
-                    actionIndex
-                  );
-                } else {
-                  return /* @__PURE__ */ jsxRuntime.jsx("div", { children: action }, actionIndex);
-                }
-              }) }) : actions(row, actualIndex) })
-            ]
-          },
-          actualIndex
-        );
-      }) })
-    ] }) }),
-    paginated && totalPages > 1 && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between px-4 py-3 border-t border-border", children: [
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-sm text-muted-foreground", children: [
-        "Page ",
-        currentPage,
-        " of ",
-        totalPages,
-        " (",
-        data.length,
-        " total rows)"
-      ] }),
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-2", children: [
-        /* @__PURE__ */ jsxRuntime.jsx(button_default, { size: "sm", style: "outline", onClick: prevPage, disabled: !canPrevPage, children: "Previous" }),
-        /* @__PURE__ */ jsxRuntime.jsx(button_default, { size: "sm", style: "outline", onClick: nextPage, disabled: !canNextPage, children: "Next" })
-      ] })
-    ] })
-  ] });
-}
-DataTable.displayName = "DataTable";
-var data_table_default = DataTable;
-function Chip({
-  children,
-  className = "",
-  variant = "default",
-  size = "md",
-  onRemove,
-  icon,
-  disabled = false,
-  clickable = false,
-  onClick
-}) {
-  const sizeClasses = {
-    sm: "text-xs px-2 py-1 gap-1",
-    md: "text-sm px-3 py-1.5 gap-1.5",
-    lg: "text-base px-4 py-2 gap-2"
-  };
-  const variantClasses = {
-    default: "bg-muted text-muted-foreground",
-    primary: "bg-primary/10 text-primary",
-    success: "bg-success/10 text-success",
-    warning: "bg-warning/10 text-warning",
-    error: "bg-destructive/10 text-destructive"
-  };
-  const interactiveClasses = clickable && !disabled ? "cursor-pointer hover:opacity-80 active:opacity-60 transition-opacity" : "";
-  const disabledClasses = disabled ? "opacity-50 cursor-not-allowed" : "";
-  const handleClick = (e) => {
-    if (!disabled && clickable && onClick) {
-      onClick(e);
-    }
-  };
-  const handleRemove = (e) => {
-    e.stopPropagation();
-    if (!disabled && onRemove) {
-      onRemove(e);
-    }
-  };
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    "div",
-    {
-      className: `
-        inline-flex items-center justify-center
-        rounded-full font-medium
-        ${sizeClasses[size]}
-        ${variantClasses[variant]}
-        ${interactiveClasses}
-        ${disabledClasses}
-        ${className}
-      `,
-      onClick: handleClick,
-      role: clickable ? "button" : void 0,
-      tabIndex: clickable && !disabled ? 0 : void 0,
-      onKeyDown: clickable && !disabled ? (e) => {
-        if (e.key === "Enter" || e.key === " ") {
-          e.preventDefault();
-          onClick?.(e);
-        }
-      } : void 0,
-      children: [
-        icon && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex-shrink-0 flex items-center", children: icon }),
-        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate", children }),
-        onRemove && /* @__PURE__ */ jsxRuntime.jsx(
-          "button",
-          {
-            type: "button",
-            onClick: handleRemove,
-            disabled,
-            className: `
-            flex-shrink-0 flex items-center justify-center
-            rounded-full hover:bg-black/10 dark:hover:bg-white/10
-            transition-colors
-            ${size === "sm" ? "w-3 h-3" : size === "md" ? "w-4 h-4" : "w-5 h-5"}
-            ${disabled ? "cursor-not-allowed" : "cursor-pointer"}
-          `,
-            "aria-label": "Remove",
-            children: /* @__PURE__ */ jsxRuntime.jsx(iconsReact.IconX, { className: size === "sm" ? "w-2.5 h-2.5" : size === "md" ? "w-3 h-3" : "w-3.5 h-3.5" })
-          }
-        )
-      ]
-    }
-  );
-}
-Chip.displayName = "Chip";
-var chip_default = Chip;
-function TimelineItem({
-  children,
-  className = "",
-  icon,
-  iconColor = "default",
-  title,
-  subtitle,
-  timestamp,
-  isLast = false
-}) {
-  const iconColorClasses = {
-    default: "bg-muted text-muted-foreground",
-    primary: "bg-primary text-primary-foreground",
-    success: "bg-success text-success-foreground",
-    warning: "bg-warning text-warning-foreground",
-    error: "bg-destructive text-destructive-foreground"
-  };
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `flex gap-4 ${className}`, children: [
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-center", children: [
-      /* @__PURE__ */ jsxRuntime.jsx(
-        "div",
-        {
-          className: `
-            flex items-center justify-center
-            w-8 h-8 rounded-full
-            flex-shrink-0
-            ${iconColorClasses[iconColor]}
-          `,
-          children: icon || /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-2 h-2 rounded-full bg-current" })
-        }
-      ),
-      !isLast && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-0.5 flex-1 bg-border mt-2" })
-    ] }),
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `flex-1 ${!isLast ? "pb-8" : ""}`, children: [
-      (title || timestamp) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start justify-between gap-4 mb-1", children: [
-        title && /* @__PURE__ */ jsxRuntime.jsx("h4", { className: "font-semibold text-foreground", children: title }),
-        timestamp && /* @__PURE__ */ jsxRuntime.jsx("time", { className: "text-sm text-muted-foreground whitespace-nowrap", children: timestamp })
-      ] }),
-      subtitle && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground mb-2", children: subtitle }),
-      children && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-sm text-foreground", children })
-    ] })
-  ] });
-}
-function Timeline({ children, className = "", position = "left" }) {
-  const positionClasses = {
-    left: "",
-    center: "mx-auto max-w-2xl",
-    right: "ml-auto max-w-2xl"
-  };
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: `${positionClasses[position]} ${className}`, children });
-}
-Timeline.displayName = "Timeline";
-var timeline_default = Timeline;
-function Grid({
-  children,
-  className = "",
-  itemSize = "md",
-  maxCols,
-  gap = "md",
-  responsive,
-  alignItems = "stretch",
-  justifyItems = "stretch"
-}) {
-  const itemSizeValues = {
-    xs: "150px",
-    sm: "200px",
-    md: "250px",
-    lg: "300px",
-    xl: "350px",
-    "2xl": "400px"
-  };
-  const gapClasses = {
-    none: "gap-0",
-    xs: "gap-1",
-    sm: "gap-2",
-    md: "gap-4",
-    lg: "gap-6",
-    xl: "gap-8",
-    "2xl": "gap-12"
-  };
-  const alignItemsClasses = {
-    start: "items-start",
-    center: "items-center",
-    end: "items-end",
-    stretch: "items-stretch"
-  };
-  const justifyItemsClasses = {
-    start: "justify-items-start",
-    center: "justify-items-center",
-    end: "justify-items-end",
-    stretch: "justify-items-stretch"
-  };
-  const responsiveClasses = responsive ? Object.entries(responsive).map(([breakpoint, cols]) => {
-    const breakpointPrefix = breakpoint === "sm" ? "sm:" : breakpoint === "md" ? "md:" : breakpoint === "lg" ? "lg:" : "xl:";
-    return `${breakpointPrefix}grid-cols-${cols}`;
-  }).join(" ") : "";
-  const minWidth = itemSizeValues[itemSize];
-  const gridStyle = !responsive ? {
-    gridTemplateColumns: maxCols ? `repeat(auto-fit, minmax(min(${minWidth}, 100%), 1fr))` : `repeat(auto-fill, minmax(min(${minWidth}, 100%), 1fr))`
-  } : void 0;
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    "div",
-    {
-      className: `
-        grid
-        ${!responsive ? "" : responsiveClasses}
-        ${gapClasses[gap]}
-        ${alignItemsClasses[alignItems]}
-        ${justifyItemsClasses[justifyItems]}
-        ${className}
-      `.trim(),
-      style: gridStyle,
-      children
-    }
-  );
-}
-Grid.displayName = "Grid";
-var grid_default = Grid;
-function Heading({ children, level = 1, className = "", noMargin = false }) {
-  const levelClasses = {
-    1: "text-4xl font-bold",
-    2: "text-3xl font-bold",
-    3: "text-2xl font-semibold",
-    4: "text-xl font-semibold",
-    5: "text-lg font-medium",
-    6: "text-base font-medium"
-  };
-  const marginClasses = {
-    1: "mb-4",
-    2: "mb-3",
-    3: "mb-3",
-    4: "mb-2",
-    5: "mb-2",
-    6: "mb-2"
-  };
-  const margin = noMargin ? "" : marginClasses[level];
-  return React5.createElement(
-    `h${level}`,
-    {
-      className: `text-foreground ${levelClasses[level]} ${margin} ${className}`
-    },
-    children
-  );
-}
-Heading.displayName = "Heading";
-var heading_default = Heading;
-function PricingTable({ title, description, children, columns = 3, className = "" }) {
-  return /* @__PURE__ */ jsxRuntime.jsx("section", { className: `py-16 md:py-20 ${className}`, children: /* @__PURE__ */ jsxRuntime.jsxs(container_default, { size: "xl", children: [
-    (title || description) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-center mb-12 md:mb-16 max-w-3xl mx-auto", children: [
-      title && /* @__PURE__ */ jsxRuntime.jsx(heading_default, { level: 2, className: "text-3xl md:text-4xl font-bold mb-4", children: title }),
-      description && /* @__PURE__ */ jsxRuntime.jsx(text_default, { className: "text-lg md:text-xl text-muted", children: description })
-    ] }),
-    /* @__PURE__ */ jsxRuntime.jsx(grid_default, { itemSize: "lg", maxCols: columns, gap: "lg", className: "items-stretch", children })
-  ] }) });
-}
-PricingTable.displayName = "PricingTable";
-var pricing_table_default = PricingTable;
-function Card({
-  children,
-  className = "",
-  variant = "default",
-  size = "md",
-  width = "auto",
-  hoverable = false,
-  imagePosition = "top",
-  centered = false,
-  compact = false,
-  ...props
-}) {
-  const variantClasses = {
-    default: "bg-card text-card-foreground border border-border shadow-md",
-    bordered: "bg-card text-card-foreground border-2 border-border",
-    ghost: "bg-transparent",
-    filled: "bg-muted text-foreground"
-  };
-  const sizeClasses = {
-    xs: "w-36",
-    sm: "w-64",
-    md: "w-96",
-    lg: "w-[28rem]",
-    xl: "w-[32rem]"
-  };
-  const widthClasses = {
-    auto: size !== "md" ? sizeClasses[size] : "max-w-full",
-    full: "w-full",
-    fit: "w-fit"
-  };
-  const hoverClasses = hoverable ? "transition-all duration-300 hover:shadow-xl hover:-translate-y-1 cursor-pointer" : "transition-shadow duration-200";
-  const imagePositionClasses = {
-    top: "flex-col",
-    bottom: "flex-col-reverse",
-    side: "flex-row",
-    overlay: "relative"
-  };
-  const centerClasses = centered ? "text-center items-center" : "";
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    "div",
-    {
-      className: `
-        rounded-2xl
-        overflow-hidden
-        ${variantClasses[variant]}
-        ${widthClasses[width]}
-        ${hoverClasses}
-        ${imagePositionClasses[imagePosition]}
-        ${centerClasses}
-        ${compact ? "p-4" : ""}
-        ${imagePosition === "side" ? "flex" : "flex"}
-        ${className}
-      `.trim().replace(/\s+/g, " "),
-      ...props,
-      children
-    }
-  );
-}
-Card.displayName = "Card";
-var card_default = Card;
-function CardHeader({ children, className = "", bordered = true, padding = "md" }) {
-  const paddingClasses = {
-    none: "p-0",
-    sm: "p-4",
-    md: "p-6",
-    lg: "p-8"
-  };
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    "div",
-    {
-      className: `
-        card-header
-        flex items-center justify-between gap-3
-        ${paddingClasses[padding]}
-        ${bordered ? "border-b border-border" : ""}
-        ${className}
-      `.trim().replace(/\s+/g, " "),
-      children
-    }
-  );
-}
-CardHeader.displayName = "CardHeader";
-var card_header_default = CardHeader;
-function CardFooter({
-  children,
-  className = "",
-  bordered = true,
-  padding = "md",
-  align = "start"
-}) {
-  const paddingClasses = {
-    none: "p-0",
-    sm: "p-4",
-    md: "p-6",
-    lg: "p-8"
-  };
-  const alignClasses = {
-    start: "justify-start",
-    center: "justify-center",
-    end: "justify-end"
-  };
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    "div",
-    {
-      className: `
-        card-footer
-        flex items-center gap-1
-        ${paddingClasses[padding]}
-        ${bordered ? "border-t border-border" : ""}
-        ${alignClasses[align]}
-        ${className}
-      `.trim().replace(/\s+/g, " "),
-      children
-    }
-  );
-}
-CardFooter.displayName = "CardFooter";
-var card_footer_default = CardFooter;
-function PricingTier({
-  name,
-  price,
-  period = "/month",
-  description,
-  features,
-  ctaLabel,
-  ctaOnClick,
-  featured = false,
-  badge,
-  className = ""
-}) {
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    card_default,
-    {
-      className: `relative flex flex-col h-full ${featured ? "border-2 border-primary shadow-xl" : "border border-border"} ${className}`,
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsxs(card_header_default, { className: `relative text-center border-none bg-transparent px-6 pt-12 pb-0`, children: [
-          badge && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute top-2 left-1/2 -translate-x-1/2", children: /* @__PURE__ */ jsxRuntime.jsx(badge_default, { variant: "primary", className: "px-4 py-1 shadow-md", children: badge }) }),
-          /* @__PURE__ */ jsxRuntime.jsx(heading_default, { level: 3, className: "text-2xl font-bold mb-3 text-foreground", children: name }),
-          description && /* @__PURE__ */ jsxRuntime.jsx(text_default, { variant: "muted", className: "text-sm mb-1", children: description })
-        ] }),
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "pt-3 pb-8 text-center px-6", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-baseline justify-center gap-1", children: [
-          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-5xl font-bold text-foreground", children: price }),
-          period && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground text-lg", children: period })
-        ] }) }),
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1 space-y-4 py-6 px-6 border-t border-border/50", children: features.map((feature, index) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start gap-3", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(
-            iconsReact.IconCheck,
-            {
-              size: 20,
-              className: `flex-shrink-0 mt-0.5 ${feature.included ? "text-success" : "text-muted-foreground opacity-30"}`
-            }
-          ),
-          /* @__PURE__ */ jsxRuntime.jsx(text_default, { className: `text-sm ${feature.included ? "text-foreground" : "text-muted-foreground line-through"}`, children: feature.label })
-        ] }, index)) }),
-        /* @__PURE__ */ jsxRuntime.jsx(card_footer_default, { className: "border-none bg-transparent px-6 pb-6 pt-4", children: /* @__PURE__ */ jsxRuntime.jsx(
-          button_default,
-          {
-            variant: featured ? "primary" : "neutral",
-            style: featured ? "solid" : "outline",
-            className: "w-full",
-            size: "lg",
-            onClick: ctaOnClick,
-            children: ctaLabel
-          }
-        ) })
-      ]
-    }
-  );
-}
-PricingTier.displayName = "PricingTier";
-var pricing_tier_default = PricingTier;
-function CodeBlock({ code, className = "", showCopy = true }) {
-  const [copied, setCopied] = React5.useState(false);
-  const handleCopy = async () => {
-    try {
-      await navigator.clipboard.writeText(code);
-      setCopied(true);
-      setTimeout(() => setCopied(false), 2e3);
-    } catch (err) {
-      console.error("Failed to copy code:", err);
-    }
-  };
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `relative group ${className}`, children: [
-    showCopy && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute top-2 right-2 opacity-0 group-hover:opacity-100 transition-opacity", children: /* @__PURE__ */ jsxRuntime.jsx(
-      button_default,
-      {
-        variant: "neutral",
-        style: "ghost",
-        size: "sm",
-        onClick: handleCopy,
-        className: "text-xs bg-background/80 hover:bg-background",
-        children: copied ? "\u2713 Copied" : "Copy"
-      }
-    ) }),
-    /* @__PURE__ */ jsxRuntime.jsx("pre", { className: `bg-muted/50 border rounded-lg p-4 overflow-x-auto text-sm ${showCopy ? "pr-24" : ""}`, children: /* @__PURE__ */ jsxRuntime.jsx("code", { className: "font-mono text-foreground", children: code }) })
-  ] });
-}
-CodeBlock.displayName = "CodeBlock";
-var code_block_default = CodeBlock;
-function CardBody({ children, padding = "md", className = "" }) {
-  const paddingClasses = {
-    none: "p-0",
-    sm: "p-4",
-    md: "p-6",
-    lg: "p-8",
-    xl: "p-10"
-  };
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    "div",
-    {
-      className: `
-        card-body
-        flex flex-col gap-2
-        ${paddingClasses[padding]}
-        ${className}
-      `.trim().replace(/\s+/g, " "),
-      children
-    }
-  );
-}
-CardBody.displayName = "CardBody";
-var card_body_default = CardBody;
-function CardTitle({ children, className = "", as: Component = "h2", size = "md" }) {
-  const sizeClasses = {
-    sm: "text-base font-semibold",
-    md: "text-lg font-bold",
-    lg: "text-xl font-bold",
-    xl: "text-2xl font-bold"
-  };
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    Component,
-    {
-      className: `
-        card-title
-        ${sizeClasses[size]}
-        ${className}
-      `.trim().replace(/\s+/g, " "),
-      children
-    }
-  );
-}
-CardTitle.displayName = "CardTitle";
-var card_title_default = CardTitle;
-function CardActions({ children, className = "", align = "end", direction = "row" }) {
-  const alignClasses = {
-    start: "justify-start",
-    center: "justify-center",
-    end: "justify-end",
-    stretch: "justify-stretch"
-  };
-  const directionClasses = {
-    row: "flex-row",
-    column: "flex-col"
-  };
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    "div",
-    {
-      className: `
-        flex gap-2 px-6 pb-6 pt-2
-        ${directionClasses[direction]}
-        ${alignClasses[align]}
-        ${className}
-      `.trim().replace(/\s+/g, " "),
-      children
-    }
-  );
-}
-CardActions.displayName = "CardActions";
-var card_actions_default = CardActions;
-function CardFigure({ children, className = "", aspectRatio = "auto" }) {
-  const aspectRatioClasses = {
-    square: "aspect-square",
-    video: "aspect-video",
-    wide: "aspect-[21/9]",
-    portrait: "aspect-[3/4]",
-    auto: ""
-  };
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    "figure",
-    {
-      className: `
-        card-figure
-        relative overflow-hidden
-        ${aspectRatioClasses[aspectRatio]}
-        ${className}
-      `.trim().replace(/\s+/g, " "),
-      children
-    }
-  );
-}
-CardFigure.displayName = "CardFigure";
-var card_figure_default = CardFigure;
-function Divider({ orientation = "horizontal", className = "", ...props }) {
-  const orientationClasses = orientation === "horizontal" ? "w-full h-px" : "h-full w-px";
-  return /* @__PURE__ */ jsxRuntime.jsx("hr", { className: `border-0 bg-border ${orientationClasses} ${className}`, "aria-orientation": orientation, ...props });
-}
-Divider.displayName = "Divider";
-var divider_default = Divider;
-function Drawer({
-  isOpen,
-  onClose,
-  children,
-  position = "right",
-  className = "",
-  title,
-  size = "md",
-  closeOnEscape = true,
-  closeOnOutside = true,
-  unmountOnExit = true,
-  portalRoot = portal_default(),
-  noAnimation = false
-}) {
-  const { phase, shouldRender, ref, getPhaseClass } = useOverlay_default({
-    isOpen,
-    lockScroll: true,
-    restoreFocus: true,
-    focusTrap: true,
-    unmountOnExit,
-    exitDuration: noAnimation ? 0 : 250,
-    animationFrames: noAnimation ? 0 : 0
-  });
-  if (!shouldRender) return null;
-  const sizeClasses = {
-    sm: "w-72",
-    md: "w-96",
-    lg: "w-[32rem]",
-    xl: "w-[40rem]",
-    full: "w-full max-w-2xl"
-  };
-  const edgeClasses = {
-    left: "left-0 top-0 bottom-0",
-    right: "right-0 top-0 bottom-0",
-    top: "top-0 left-0 right-0 h-96",
-    bottom: "bottom-0 left-0 right-0 h-96"
-  };
-  const closedTransform = {
-    left: "-translate-x-full",
-    right: "translate-x-full",
-    top: "-translate-y-full",
-    bottom: "translate-y-full"
-  };
-  const openTransform = "translate-x-0 translate-y-0";
-  const panelTransform = noAnimation ? "" : getPhaseClass(openTransform, closedTransform[position]);
-  const overlayOpacity = noAnimation ? "opacity-100" : getPhaseClass("opacity-100", "opacity-0");
-  const handleKeyDown = (e) => {
-    if (e.key === "Escape" && closeOnEscape) {
-      e.stopPropagation();
-      onClose();
-    }
-  };
-  const panel = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-    /* @__PURE__ */ jsxRuntime.jsx(
-      "button",
-      {
-        type: "button",
-        className: `fixed inset-0 z-[999] bg-black/50 backdrop-blur-sm transition-opacity duration-[250ms] ease-in-out ${overlayOpacity} border-0 p-0 m-0`,
-        "aria-label": closeOnOutside ? "Close overlay" : void 0,
-        "aria-hidden": !closeOnOutside,
-        tabIndex: closeOnOutside ? 0 : -1,
-        onClick: () => closeOnOutside && onClose(),
-        onKeyDown: (e) => {
-          if (!closeOnOutside) return;
-          if (e.key === "Enter" || e.key === " ") {
-            e.preventDefault();
-            onClose();
-          }
-        },
-        "data-phase": phase
-      }
-    ),
-    /* @__PURE__ */ jsxRuntime.jsxs(
-      "div",
-      {
-        ref,
-        role: "dialog",
-        "aria-modal": "true",
-        "aria-label": title || "Drawer",
-        tabIndex: -1,
-        "data-phase": phase,
-        "data-position": position,
-        className: `fixed ${edgeClasses[position]} ${position === "left" || position === "right" ? sizeClasses[size] : ""} bg-card text-card-foreground shadow-2xl z-[1000] flex flex-col outline-none ${panelTransform} ${noAnimation ? "" : "transition-transform duration-[250ms] ease-out will-change-transform"} ${className}`,
-        onKeyDown: handleKeyDown,
-        children: [
-          title && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between px-5 py-4 border-b border-border/60 bg-card/95 backdrop-blur-sm", children: [
-            /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-base font-semibold tracking-tight", children: title }),
-            /* @__PURE__ */ jsxRuntime.jsx(
-              "button",
-              {
-                type: "button",
-                "aria-label": "Close drawer",
-                onClick: onClose,
-                className: "w-8 h-8 inline-flex items-center justify-center rounded-md hover:bg-muted focus:outline-none focus:ring-2 focus:ring-ring",
-                children: /* @__PURE__ */ jsxRuntime.jsxs(
-                  "svg",
-                  {
-                    xmlns: "http://www.w3.org/2000/svg",
-                    width: "18",
-                    height: "18",
-                    viewBox: "0 0 24 24",
-                    fill: "none",
-                    stroke: "currentColor",
-                    strokeWidth: "2",
-                    strokeLinecap: "round",
-                    strokeLinejoin: "round",
-                    children: [
-                      /* @__PURE__ */ jsxRuntime.jsx("line", { x1: "18", y1: "6", x2: "6", y2: "18" }),
-                      /* @__PURE__ */ jsxRuntime.jsx("line", { x1: "6", y1: "6", x2: "18", y2: "18" })
-                    ]
-                  }
-                )
-              }
-            )
-          ] }),
-          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1 overflow-y-auto p-5 flex flex-col gap-4", children })
-        ]
-      }
-    )
-  ] });
-  return portalRoot ? reactDom.createPortal(panel, portalRoot) : panel;
-}
-Drawer.displayName = "Drawer";
-var drawer_default = Drawer;
-function Page({ children, className = "" }) {
-  return /* @__PURE__ */ jsxRuntime.jsx("main", { className: `min-h-screen bg-background ${className}`, children });
-}
-Page.displayName = "Page";
-var page_default = Page;
-function AccordionItem({ title, children, defaultOpen = false }) {
-  const [isOpen, setIsOpen] = React5.useState(defaultOpen);
-  return /* @__PURE__ */ jsxRuntime.jsxs("article", { className: "border-b border-border", children: [
-    /* @__PURE__ */ jsxRuntime.jsxs(
-      "button",
-      {
-        onClick: () => setIsOpen(!isOpen),
-        className: "w-full flex items-center justify-between py-4 px-2 text-left text-foreground hover:bg-muted/50 active:bg-muted transition-colors focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 rounded-sm",
-        "aria-expanded": isOpen,
-        children: [
-          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-medium", children: title }),
-          /* @__PURE__ */ jsxRuntime.jsx(
-            "svg",
-            {
-              className: `w-5 h-5 transition-transform ${isOpen ? "rotate-180" : ""}`,
-              fill: "none",
-              stroke: "currentColor",
-              viewBox: "0 0 24 24",
-              children: /* @__PURE__ */ jsxRuntime.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M19 9l-7 7-7-7" })
-            }
-          )
-        ]
-      }
-    ),
-    isOpen && /* @__PURE__ */ jsxRuntime.jsx("section", { className: "px-2 pb-4 text-muted-foreground", children })
-  ] });
-}
-function Accordion({ children, className = "" }) {
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: `divide-y divide-border ${className}`, children });
-}
-Accordion.displayName = "Accordion";
-var accordion_default = Accordion;
-function Hero({
-  title,
-  subtitle,
-  description,
-  primaryAction,
-  secondaryAction,
-  children,
-  className = "",
-  variant = "gradient",
-  centered = true,
-  size = "lg"
-}) {
-  const sizeClasses = {
-    sm: "py-12 md:py-16",
-    md: "py-16 md:py-20",
-    lg: "py-20 md:py-28"
-  };
-  const titleSizes = {
-    sm: "text-3xl md:text-4xl",
-    md: "text-4xl md:text-5xl",
-    lg: "text-5xl md:text-6xl lg:text-7xl"
-  };
-  const variantClasses = {
-    gradient: "bg-gradient-to-b from-primary/10 via-primary/5 to-background",
-    solid: "bg-muted/30",
-    minimal: "bg-background"
-  };
-  return /* @__PURE__ */ jsxRuntime.jsxs("section", { className: `relative ${sizeClasses[size]} ${variantClasses[variant]} ${className}`, children: [
-    variant === "gradient" && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-x-0 top-0 h-px bg-gradient-to-r from-transparent via-primary/20 to-transparent" }),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-x-0 bottom-0 h-32 bg-gradient-to-t from-background to-transparent pointer-events-none" }),
-    /* @__PURE__ */ jsxRuntime.jsx(container_default, { size: "lg", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: centered ? "text-center mx-auto max-w-4xl" : "max-w-4xl", children: [
-      subtitle && /* @__PURE__ */ jsxRuntime.jsx(text_default, { className: "text-lg md:text-xl font-semibold text-primary mb-4", weight: "semibold", children: subtitle }),
-      /* @__PURE__ */ jsxRuntime.jsx(heading_default, { level: 1, className: `${titleSizes[size]} font-extrabold mb-6 tracking-tight`, children: title }),
-      description && /* @__PURE__ */ jsxRuntime.jsx(text_default, { className: "text-lg md:text-xl mb-8 text-muted-foreground max-w-2xl mx-auto", children: description }),
-      (primaryAction || secondaryAction) && /* @__PURE__ */ jsxRuntime.jsxs(stack_default, { direction: "horizontal", spacing: "md", className: `flex-wrap ${centered ? "justify-center" : ""}`, children: [
-        primaryAction && /* @__PURE__ */ jsxRuntime.jsx(
-          button_default,
-          {
-            size: "lg",
-            variant: primaryAction.variant || "primary",
-            style: primaryAction.style,
-            onClick: primaryAction.onClick,
-            loading: primaryAction.loading,
-            icon: primaryAction.icon,
-            className: "shadow-lg shadow-primary/20 hover:shadow-xl hover:shadow-primary/30 transition-all",
-            children: primaryAction.label
-          }
-        ),
-        secondaryAction && /* @__PURE__ */ jsxRuntime.jsx(
-          button_default,
-          {
-            size: "lg",
-            variant: secondaryAction.variant || "neutral",
-            style: secondaryAction.style || "outline",
-            onClick: secondaryAction.onClick,
-            loading: secondaryAction.loading,
-            icon: secondaryAction.icon,
-            className: "hover:shadow-md transition-all",
-            children: secondaryAction.label
-          }
-        )
-      ] }),
-      children && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-10", children })
-    ] }) })
-  ] });
-}
-Hero.displayName = "Hero";
-var hero_default = Hero;
-function FeatureSection({
-  title,
-  description,
-  features,
-  columns = 3,
-  centered = true,
-  className = ""
-}) {
-  return /* @__PURE__ */ jsxRuntime.jsx("section", { className: `py-16 md:py-20 ${className}`, children: /* @__PURE__ */ jsxRuntime.jsxs(container_default, { size: "xl", children: [
-    (title || description) && /* @__PURE__ */ jsxRuntime.jsxs(
-      "div",
-      {
-        className: `mb-12 md:mb-16 ${centered ? "text-center" : ""} ${centered ? "max-w-3xl mx-auto" : "max-w-3xl"}`,
-        children: [
-          title && /* @__PURE__ */ jsxRuntime.jsx(heading_default, { level: 2, className: "text-3xl md:text-4xl font-bold mb-4", children: title }),
-          description && /* @__PURE__ */ jsxRuntime.jsx(text_default, { className: "text-lg md:text-xl", children: description })
-        ]
-      }
-    ),
-    /* @__PURE__ */ jsxRuntime.jsx(grid_default, { itemSize: "md", maxCols: columns, gap: "lg", children: features.map((feature, index) => /* @__PURE__ */ jsxRuntime.jsxs("article", { className: centered ? "text-center" : "", children: [
-      /* @__PURE__ */ jsxRuntime.jsx(
-        "span",
-        {
-          className: `inline-flex items-center justify-center w-12 h-12 md:w-16 md:h-16 rounded-lg md:rounded-xl bg-primary/10 text-primary mb-4 md:mb-6 ${centered ? "" : "mr-auto"}`,
-          children: feature.icon
-        }
-      ),
-      /* @__PURE__ */ jsxRuntime.jsx(heading_default, { level: 3, className: "text-xl font-semibold mb-2 md:mb-3", children: feature.title }),
-      /* @__PURE__ */ jsxRuntime.jsx(text_default, { variant: "muted", className: "text-sm md:text-base", children: feature.description })
-    ] }, index)) })
-  ] }) });
-}
-FeatureSection.displayName = "FeatureSection";
-var feature_section_default = FeatureSection;
-function Link2({
-  children,
-  href,
-  external = false,
-  variant = "default",
-  underline = "hover",
-  size = "md",
-  display = "inline",
-  className = ""
-}) {
-  const variantClasses = {
-    default: "text-primary hover:text-primary/80",
-    muted: "text-muted-foreground hover:text-foreground",
-    secondary: "text-secondary hover:text-secondary/80",
-    inherit: "text-inherit hover:opacity-80"
-  };
-  const underlineClasses = {
-    hover: "hover:underline",
-    always: "underline",
-    none: "no-underline"
-  };
-  const sizeClasses = {
-    sm: "text-sm",
-    md: "text-base",
-    lg: "text-lg"
-  };
-  const displayClasses = {
-    inline: "inline",
-    block: "block"
-  };
-  const linkClassName = [
-    variantClasses[variant],
-    underlineClasses[underline],
-    sizeClasses[size],
-    displayClasses[display],
-    "cursor-pointer transition-colors",
-    className
-  ].filter(Boolean).join(" ");
-  if (external) {
-    return /* @__PURE__ */ jsxRuntime.jsxs("a", { href, className: linkClassName, target: "_blank", rel: "noopener noreferrer", children: [
-      children,
-      /* @__PURE__ */ jsxRuntime.jsx(
-        "svg",
-        {
-          className: "inline-block w-4 h-4 ml-1",
-          fill: "none",
-          stroke: "currentColor",
-          viewBox: "0 0 24 24",
-          "aria-hidden": "true",
-          children: /* @__PURE__ */ jsxRuntime.jsx(
-            "path",
-            {
-              strokeLinecap: "round",
-              strokeLinejoin: "round",
-              strokeWidth: 2,
-              d: "M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14"
-            }
-          )
-        }
-      )
-    ] });
-  }
-  return /* @__PURE__ */ jsxRuntime.jsx(reactRouterDom.Link, { to: href, className: linkClassName, children });
-}
-Link2.displayName = "Link";
-var link_default = Link2;
-function Footer({ sections, copyright, social, className = "" }) {
-  return /* @__PURE__ */ jsxRuntime.jsx("footer", { className: `border-t border-border bg-muted/20 ${className}`, children: /* @__PURE__ */ jsxRuntime.jsxs(container_default, { children: [
-    sections && sections.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "py-12 md:py-16", children: /* @__PURE__ */ jsxRuntime.jsx(grid_default, { itemSize: "xs", maxCols: 4, gap: "lg", children: sections.map((section, index) => /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
-      /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "font-semibold text-foreground mb-4", children: section.title }),
-      /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "space-y-3", children: section.links.map((link, linkIndex) => /* @__PURE__ */ jsxRuntime.jsx("li", { children: /* @__PURE__ */ jsxRuntime.jsx(
-        link_default,
-        {
-          href: link.href,
-          external: link.external,
-          className: "text-sm text-muted hover:text-foreground transition-colors",
-          children: link.label
-        }
-      ) }, linkIndex)) })
-    ] }, index)) }) }),
-    /* @__PURE__ */ jsxRuntime.jsxs(
-      "div",
-      {
-        className: `${sections && sections.length > 0 ? "border-t border-border" : ""} py-6 flex flex-col md:flex-row items-center justify-between gap-4`,
-        children: [
-          copyright && /* @__PURE__ */ jsxRuntime.jsx(text_default, { variant: "muted", className: "text-sm text-center md:text-left", children: copyright }),
-          social && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center space-x-4", children: social })
-        ]
-      }
-    )
-  ] }) });
-}
-Footer.displayName = "Footer";
-var footer_default = Footer;
-function useScrollReset(deps, container) {
-  React5.useEffect(() => {
-    let cancelled = false;
-    const maxRaf = 6;
-    let rafCount = 0;
-    const isRef = (obj) => {
-      return typeof obj === "object" && obj !== null && "current" in obj;
-    };
-    const setAllScrollTop = () => {
-      if (cancelled) return;
-      window.scrollTo(0, 0);
-      const resolved = isRef(container) ? container.current : container;
-      if (resolved) resolved.scrollTop = 0;
-      document.documentElement.scrollTop = 0;
-      document.body.scrollTop = 0;
-    };
-    setAllScrollTop();
-    Promise.resolve().then(() => setAllScrollTop());
-    const timeoutId = setTimeout(() => setAllScrollTop(), 0);
-    const loop = () => {
-      if (cancelled) return;
-      setAllScrollTop();
-      rafCount += 1;
-      if (rafCount < maxRaf) requestAnimationFrame(loop);
-    };
-    requestAnimationFrame(loop);
-    return () => {
-      cancelled = true;
-      clearTimeout(timeoutId);
-    };
-  }, deps);
-}
-var useScrollReset_default = useScrollReset;
-function LeftNavLayout({
-  nav,
-  children,
-  collapsed: controlledCollapsed,
-  onCollapsedChange,
-  showToggle = true,
-  className = "",
-  navClassName = "",
-  contentClassName = "",
-  navWidth = "16rem",
-  navWidthCollapsed = "4.5rem",
-  mobileCollapsible = true,
-  mobileMenuOpen: controlledMobileMenuOpen,
-  onMobileMenuOpenChange,
-  embedded = false,
-  mainContentRef
-}) {
-  const [internalCollapsed, setInternalCollapsed] = React5.useState(false);
-  const [internalMobileMenuOpen, setInternalMobileMenuOpen] = React5.useState(false);
-  const navRef = React5.useRef(null);
-  const scrollPosRef = React5.useRef(0);
-  const internalContentRef = React5.useRef(null);
-  const contentRef = mainContentRef || internalContentRef;
-  const collapsed = controlledCollapsed ?? internalCollapsed;
-  const setCollapsed = (value) => {
-    if (onCollapsedChange) {
-      onCollapsedChange(value);
-    } else {
-      setInternalCollapsed(value);
-    }
-  };
-  const mobileMenuOpen = controlledMobileMenuOpen ?? internalMobileMenuOpen;
-  const setMobileMenuOpen = (value) => {
-    if (onMobileMenuOpenChange) {
-      onMobileMenuOpenChange(value);
-    } else {
-      setInternalMobileMenuOpen(value);
-    }
-  };
-  const toggleCollapsed = () => setCollapsed(!collapsed);
-  const toggleMobileMenu = () => setMobileMenuOpen(!mobileMenuOpen);
-  React5.useEffect(() => {
-    if (navRef.current) {
-      navRef.current.scrollTop = scrollPosRef.current;
-    }
-  }, [children]);
-  useScrollReset_default([children], contentRef);
-  const containerClasses = embedded ? "flex bg-background border border-border rounded-lg overflow-hidden" : "flex h-[calc(100vh-4rem)] bg-background";
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `${containerClasses} ${className}`, children: [
-    mobileCollapsible && mobileMenuOpen && /* @__PURE__ */ jsxRuntime.jsx(
-      "div",
-      {
-        className: "fixed inset-0 z-40 lg:hidden bg-background/80 backdrop-blur-sm",
-        onClick: toggleMobileMenu,
-        "aria-hidden": "true"
-      }
-    ),
-    /* @__PURE__ */ jsxRuntime.jsxs(
-      "aside",
-      {
-        className: `
-          ${embedded ? "relative flex flex-col h-full" : "fixed lg:relative top-0 left-0 z-40 lg:z-10 h-screen lg:h-full"}
-          flex flex-col flex-shrink-0
-          bg-background border-r border-border
-          transition-all duration-300 ease-in-out
-          ${!embedded && mobileCollapsible && !mobileMenuOpen ? "-translate-x-full lg:translate-x-0" : "translate-x-0"}
-          ${collapsed ? "w-[4.5rem]" : "w-64"}
-          ${navClassName}
-        `,
-        style: !collapsed && navWidth !== "16rem" || collapsed && navWidthCollapsed !== "4.5rem" ? {
-          width: collapsed ? navWidthCollapsed : navWidth
-        } : void 0,
-        "aria-label": "Main navigation",
-        children: [
-          showToggle && /* @__PURE__ */ jsxRuntime.jsxs(
-            "div",
-            {
-              className: `
-            relative flex items-center h-12 flex-shrink-0
-            px-4 border-b border-border
-          `,
-              children: [
-                /* @__PURE__ */ jsxRuntime.jsx(
-                  "span",
-                  {
-                    className: `
-                text-sm font-semibold text-foreground
-                transition-all duration-300 ease-in-out
-                ${collapsed ? "opacity-0 w-0 overflow-hidden" : "opacity-100"}
-              `,
-                    children: "Navigation"
-                  }
-                ),
-                /* @__PURE__ */ jsxRuntime.jsx(
-                  "button",
-                  {
-                    onClick: toggleCollapsed,
-                    className: `
-                hidden lg:flex items-center justify-center
-                w-8 h-8 rounded-md
-                text-muted-foreground hover:text-foreground
-                hover:bg-muted
-                transition-all duration-300 ease-in-out
-                focus:outline-none focus:ring-2 focus:ring-ring
-                ${collapsed ? "absolute left-1/2 -translate-x-1/2" : "absolute right-4"}
-              `,
-                    "aria-label": collapsed ? "Expand sidebar" : "Collapse sidebar",
-                    type: "button",
-                    children: collapsed ? /* @__PURE__ */ jsxRuntime.jsx(iconsReact.IconChevronRight, { size: 20 }) : /* @__PURE__ */ jsxRuntime.jsx(iconsReact.IconChevronLeft, { size: 20 })
-                  }
-                )
-              ]
-            }
-          ),
-          /* @__PURE__ */ jsxRuntime.jsx(
-            "nav",
-            {
-              ref: navRef,
-              className: "flex-1 overflow-y-auto overflow-x-hidden scrollbar-thin",
-              "data-collapsed": collapsed,
-              onScroll: (e) => {
-                scrollPosRef.current = e.currentTarget.scrollTop;
-              },
-              children: nav
-            }
-          )
-        ]
-      }
-    ),
-    /* @__PURE__ */ jsxRuntime.jsx(
-      "main",
-      {
-        ref: contentRef,
-        className: `flex-1 overflow-auto ${embedded ? "h-60" : ""} ${contentClassName}`,
-        children
-      }
-    )
-  ] });
-}
-LeftNavLayout.displayName = "LeftNavLayout";
-var left_nav_layout_default = LeftNavLayout;
-function LeftNavItem({
-  icon,
-  children,
-  active = false,
-  className = "",
-  badge,
-  href = "#",
-  title,
-  preventNavigation = false
-}) {
-  const navRef = React5.useRef(null);
-  const [isCollapsed, setIsCollapsed] = React5.useState(() => {
-    if (typeof window !== "undefined") {
-      const navElement = document.querySelector("nav[data-collapsed]");
-      return navElement?.getAttribute("data-collapsed") === "true";
-    }
-    return false;
-  });
-  React5.useEffect(() => {
-    const checkCollapsed = () => {
-      const navElement2 = navRef.current?.closest("nav");
-      if (navElement2) {
-        setIsCollapsed(navElement2.getAttribute("data-collapsed") === "true");
-      }
-    };
-    checkCollapsed();
-    const navElement = navRef.current?.closest("nav");
-    if (navElement) {
-      const observer = new MutationObserver(checkCollapsed);
-      observer.observe(navElement, {
-        attributes: true,
-        attributeFilter: ["data-collapsed"]
-      });
-      return () => observer.disconnect();
-    }
-    return void 0;
-  }, []);
-  const itemTitle = title || (typeof children === "string" ? children : void 0);
-  const navLink = /* @__PURE__ */ jsxRuntime.jsxs(
-    reactRouterDom.NavLink,
-    {
-      ref: navRef,
-      to: href,
-      onClick: (e) => {
-        if (preventNavigation) {
-          e.preventDefault();
-        }
-      },
-      className: ({ isActive }) => `
-        group relative flex items-center gap-3
-        px-3 py-2.5 rounded-lg
-        mx-2
-        [nav[data-collapsed='true']_&]:mx-2
-        [nav[data-collapsed='true']_&]:px-0
-        [nav[data-collapsed='true']_&]:w-12
-        [nav[data-collapsed='true']_&]:justify-center
-        text-sm font-medium
-        transition-colors duration-200
-        focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 focus:ring-offset-card
-        ${isActive || active ? "bg-primary text-primary-foreground shadow-sm" : "text-foreground hover:bg-muted hover:text-foreground"}
-        ${className}
-      `,
-      "aria-current": active ? "page" : void 0,
-      "aria-label": itemTitle,
-      end: true,
-      children: [
-        icon && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex-shrink-0", "aria-hidden": "true", children: icon }),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          "span",
-          {
-            className: "\n          flex-1 truncate\n          [nav[data-collapsed='true']_&]:hidden\n        ",
-            children
-          }
-        ),
-        badge && /* @__PURE__ */ jsxRuntime.jsx(
-          "span",
-          {
-            className: "\n            flex-shrink-0\n            [nav[data-collapsed='true']_&]:hidden\n          ",
-            children: badge
-          }
-        )
-      ]
-    }
-  );
-  if (!isCollapsed) {
-    return navLink;
-  }
-  const tooltipContent = typeof children === "string" ? children : itemTitle || "Menu Item";
-  return /* @__PURE__ */ jsxRuntime.jsx(tooltip_default, { content: tooltipContent, position: "right", variant: "default", usePortal: true, className: "w-full block", children: navLink });
-}
-LeftNavItem.displayName = "LeftNavItem";
-var left_nav_item_default = LeftNavItem;
-function LeftNavSection({ children, label, className = "" }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `py-2 ${className}`, children: [
-    label && /* @__PURE__ */ jsxRuntime.jsx(
-      "h3",
-      {
-        className: "\n            px-5 mb-2 mt-2\n            text-xs font-semibold uppercase tracking-wider\n            text-muted-foreground\n            [nav[data-collapsed='true']_&]:hidden\n          ",
-        children: label
-      }
-    ),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-1", children }),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-px bg-border mx-3 mt-2", "aria-hidden": "true" })
-  ] });
-}
-LeftNavSection.displayName = "LeftNavSection";
-var left_nav_section_default = LeftNavSection;
-function Code({ children, block = false, variant = "default", className = "" }) {
-  const variantClasses = {
-    default: "bg-muted text-foreground",
-    primary: "text-primary",
-    muted: "text-muted-foreground"
-  };
-  const baseClasses = `font-mono ${variantClasses[variant]}`;
-  if (block) {
-    return /* @__PURE__ */ jsxRuntime.jsx("pre", { className: `${baseClasses} p-4 rounded-lg overflow-x-auto border border-border ${className}`, children: /* @__PURE__ */ jsxRuntime.jsx("code", { children }) });
-  }
-  return /* @__PURE__ */ jsxRuntime.jsx("code", { className: `${baseClasses} px-1.5 py-0.5 rounded text-sm ${className}`, children });
-}
-Code.displayName = "Code";
-var code_default = Code;
-var ThemeContext = React5.createContext(void 0);
-function ThemeProvider({
-  children,
-  defaultTheme = "light",
-  storageKey = "hydn-theme",
-  themes = ["light", "dark"]
-}) {
-  const [theme, setThemeState] = React5.useState(() => {
-    if (typeof window !== "undefined") {
-      const stored = localStorage.getItem(storageKey);
-      return stored && themes.includes(stored) ? stored : defaultTheme;
-    }
-    return defaultTheme;
-  });
-  React5.useEffect(() => {
-    const root = window.document.documentElement;
-    root.classList.remove(...themes);
-    root.classList.add(theme);
-  }, [theme, themes]);
-  const setTheme = React5.useCallback(
-    (newTheme) => {
-      if (themes.includes(newTheme)) {
-        localStorage.setItem(storageKey, newTheme);
-        setThemeState(newTheme);
-      } else {
-        console.warn(`Theme "${newTheme}" is not in availableThemes. Add it to the themes prop.`);
-      }
-    },
-    [themes, storageKey]
-  );
-  const value = React5.useMemo(
-    () => ({
-      theme,
-      setTheme,
-      availableThemes: themes
-    }),
-    [theme, themes, setTheme]
-  );
-  return /* @__PURE__ */ jsxRuntime.jsx(ThemeContext.Provider, { value, children });
-}
-function useTheme() {
-  const context = React5.useContext(ThemeContext);
-  if (!context) {
-    throw new Error("useTheme must be used within a ThemeProvider");
-  }
-  return context;
-}
-function ColorModeToggle({ className = "" }) {
-  const { theme, setTheme } = useTheme();
-  const toggleTheme = () => {
-    setTheme(theme === "light" ? "dark" : "light");
-  };
-  const isDark = theme === "dark";
-  const label = `Switch to ${theme === "light" ? "dark" : "light"} theme`;
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    "button",
-    {
-      onClick: toggleTheme,
-      className: `relative p-2 rounded-md hover:bg-accent hover:text-accent-foreground transition-colors cursor-pointer ${className}`,
-      "aria-label": label,
-      title: label,
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsx(
-          "svg",
-          {
-            className: `w-5 h-5 absolute inset-0 m-auto transition-all duration-300 ${isDark ? "rotate-90 scale-0 opacity-0" : "rotate-0 scale-100 opacity-100"}`,
-            fill: "none",
-            stroke: "currentColor",
-            viewBox: "0 0 24 24",
-            children: /* @__PURE__ */ jsxRuntime.jsx(
-              "path",
-              {
-                strokeLinecap: "round",
-                strokeLinejoin: "round",
-                strokeWidth: 2,
-                d: "M12 3v1m0 16v1m9-9h-1M4 12H3m15.364 6.364l-.707-.707M6.343 6.343l-.707-.707m12.728 0l-.707.707M6.343 17.657l-.707.707M16 12a4 4 0 11-8 0 4 4 0 018 0z"
-              }
-            )
-          }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          "svg",
-          {
-            className: `w-5 h-5 transition-all duration-300 ${isDark ? "rotate-0 scale-100 opacity-100" : "-rotate-90 scale-0 opacity-0"}`,
-            fill: "none",
-            stroke: "currentColor",
-            viewBox: "0 0 24 24",
-            children: /* @__PURE__ */ jsxRuntime.jsx(
-              "path",
-              {
-                strokeLinecap: "round",
-                strokeLinejoin: "round",
-                strokeWidth: 2,
-                d: "M20.354 15.354A9 9 0 018.646 3.646 9.003 9.003 0 0012 21a9.003 9.003 0 008.354-5.646z"
-              }
-            )
-          }
-        )
-      ]
-    }
-  );
-}
-ColorModeToggle.displayName = "ColorModeToggle";
-var color_mode_toggle_default = ColorModeToggle;
-
-exports.Accordion = accordion_default;
-exports.AccordionItem = AccordionItem;
-exports.Alert = alert_default;
-exports.Avatar = avatar_default;
-exports.Badge = badge_default;
-exports.Breadcrumbs = breadcrumbs_default;
-exports.Button = button_default;
-exports.ButtonGroup = button_group_default;
-exports.Calendar = calendar_default;
-exports.Card = card_default;
-exports.CardActions = card_actions_default;
-exports.CardBody = card_body_default;
-exports.CardFigure = card_figure_default;
-exports.CardFooter = card_footer_default;
-exports.CardHeader = card_header_default;
-exports.CardTitle = card_title_default;
-exports.Checkbox = checkbox_default;
-exports.Chip = chip_default;
-exports.Code = code_default;
-exports.CodeBlock = code_block_default;
-exports.ColorModeToggle = color_mode_toggle_default;
-exports.Container = container_default;
-exports.DataTable = data_table_default;
-exports.DatePicker = date_picker_default;
-exports.DeleteDialog = delete_dialog_default;
-exports.Dialog = dialog_default;
-exports.Divider = divider_default;
-exports.Drawer = drawer_default;
-exports.Dropdown = dropdown_default;
-exports.EmptyState = empty_state_default;
-exports.FeatureSection = feature_section_default;
-exports.Footer = footer_default;
-exports.FormField = form_field_default;
-exports.Grid = grid_default;
-exports.Heading = heading_default;
-exports.Hero = hero_default;
-exports.Input = input_default;
-exports.InputGroup = input_group_default;
-exports.LeftNavItem = left_nav_item_default;
-exports.LeftNavLayout = left_nav_layout_default;
-exports.LeftNavSection = left_nav_section_default;
-exports.Link = link_default;
-exports.List = List;
-exports.ListItem = ListItem;
-exports.Modal = modal_default;
-exports.MultiSelect = multi_select_default;
-exports.Nav = nav_default;
-exports.Navbar = navbar_default;
-exports.NavbarBrand = navbar_brand_default;
-exports.NavbarLink = navbar_link_default;
-exports.Page = page_default;
-exports.Pagination = pagination_default;
-exports.Popover = popover_default;
-exports.PricingTable = pricing_table_default;
-exports.PricingTier = pricing_tier_default;
-exports.ProgressBar = progress_bar_default;
-exports.Radio = radio_default;
-exports.RadioGroup = radio_group_default;
-exports.Select = select_default;
-exports.SelectItem = select_item_default;
-exports.Sidebar = sidebar_default;
-exports.Skeleton = skeleton_default;
-exports.Slider = slider_default;
-exports.Spinner = spinner_default;
-exports.Stack = stack_default;
-exports.StatusLabel = status_label_default;
-exports.Stepper = stepper_default;
-exports.Switch = switch_default;
-exports.Table = Table;
-exports.TableBody = TableBody;
-exports.TableCell = TableCell;
-exports.TableFooter = TableFooter;
-exports.TableHeadCell = TableHeadCell;
-exports.TableHeader = TableHeader;
-exports.TableRow = TableRow;
-exports.Tabs = tabs_default;
-exports.Text = text_default;
-exports.Textarea = textarea_default;
-exports.ThemeProvider = ThemeProvider;
-exports.Timeline = timeline_default;
-exports.TimelineItem = TimelineItem;
-exports.Toast = toast_default;
-exports.Tooltip = tooltip_default;
-exports.useTable = useTable;
-exports.useTheme = useTheme;
-//# sourceMappingURL=index.cjs.map
-//# sourceMappingURL=index.cjs.map