@lindle/linoardo 1.0.42 → 1.0.44

package/dist/expansion-panel.js

@@ -1,4 +1,4 @@
-export { ExpansionPanel_default as default } from './chunk-HBF4S2KY.js';
-export { ExpansionPanelItem_default as ExpansionPanelItem } from './chunk-KRYWWWXR.js';
+export { ExpansionPanel_default as default } from './chunk-FJNKMRYQ.js';
+export { ExpansionPanelItem_default as ExpansionPanelItem } from './chunk-RG5FCFLX.js';
 //# sourceMappingURL=expansion-panel.js.map
 //# sourceMappingURL=expansion-panel.js.map

package/dist/index.cjs

@@ -1091,31 +1091,17 @@ var ExpansionPanelItemInner = (props) => {
     __expansionPanelContext,
     ...rest
   } = props;
-  const [standaloneExpanded, setStandaloneExpanded] = React4.useState(false);
-  const generatedValueRef = React4.useRef(null);
-  if (generatedValueRef.current === null) {
-    generatedValueRef.current = generateId("expansion-panel-value");
-  }
-  const generatedValue = generatedValueRef.current;
-  const headerIdRef = React4.useRef(null);
-  if (!headerIdRef.current) {
-    headerIdRef.current = generateId("expansion-panel-header");
-  }
-  const headerId = headerIdRef.current;
-  const contentIdRef = React4.useRef(null);
-  if (!contentIdRef.current) {
-    contentIdRef.current = generateId("expansion-panel-content");
-  }
-  const contentId = contentIdRef.current;
   const context = __expansionPanelContext ?? null;
-  const panelValue = value ?? generatedValue;
+  const safeValue = typeof value === "string" || typeof value === "number" ? String(value) : null;
+  const idBase = safeValue ?? generateId("expansion-panel");
+  const inputId = `expansion-panel-toggle-${idBase}`;
   const density = context?.density ?? "default";
   const color = colorOverride ?? context?.color ?? "primary";
   const divider = context?.divider ?? true;
   const variant = context?.variant ?? "elevated";
   const rounded = context?.rounded ?? "lg";
   const accent = accentClasses2[color] ?? accentClasses2.primary;
-  const isExpanded = context ? context.expandedValues.includes(panelValue) : standaloneExpanded;
+  const isExpanded = value !== null && value !== void 0 ? context?.expandedValues.includes(value) ?? false : false;
   const rootSurface = divider ? "bg-transparent border-0 shadow-none" : itemVariantClasses[variant];
   const shapeClass = divider ? void 0 : roundedClasses[rounded] ?? roundedClasses.lg;
   const densityPadding = densityClasses2[density] ?? densityClasses2.default;
@@ -1133,30 +1119,19 @@ var ExpansionPanelItemInner = (props) => {
     }
   );
   const hasContent = Boolean(children ?? text);
-  const contentAnimationClass = isExpanded ? "pb-5 opacity-100" : "pb-0 opacity-0";
   const toggleIconNode = hideToggleIcon ? null : isExpanded && collapseIcon ? collapseIcon : expandIcon ?? defaultToggleIcon;
   const shouldRotateDefaultIcon = !expandIcon && !collapseIcon && !hideToggleIcon;
   const toggleWrapperClass = tailwindMerge.twMerge(
-    "ml-3 flex h-6 w-6 items-center justify-center text-gray-500 transition-transform duration-200",
+    "expansion-panel-item__icon ml-3 flex h-6 w-6 items-center justify-center text-gray-500 transition-transform duration-200",
     shouldRotateDefaultIcon && isExpanded ? "rotate-180" : void 0
   );
-  const handleToggle = () => {
-    if (disabled) {
-      return;
-    }
-    if (context) {
-      context.toggle(panelValue, disabled);
-      return;
-    }
-    setStandaloneExpanded((prev) => !prev);
-  };
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "div",
     {
       ...rest,
       ref: forwardedRef,
       className: tailwindMerge.twMerge(
-        "expansion-panel-item flex flex-col overflow-hidden transition-colors duration-200",
+        "expansion-panel-item group flex flex-col overflow-hidden transition-colors duration-200",
         rootSurface,
         shapeClass,
         className
@@ -1164,22 +1139,28 @@ var ExpansionPanelItemInner = (props) => {
       "data-state": isExpanded ? "open" : "closed",
       "data-disabled": disabled || void 0,
       children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "input",
+          {
+            id: inputId,
+            type: "checkbox",
+            className: "expansion-panel-item__toggle",
+            defaultChecked: isExpanded,
+            disabled
+          }
+        ),
         /* @__PURE__ */ jsxRuntime.jsxs(
-          "button",
+          "label",
           {
-            type: "button",
-            id: headerId,
-            onClick: handleToggle,
-            disabled,
-            "aria-expanded": isExpanded,
-            "aria-controls": hasContent ? contentId : void 0,
+            htmlFor: inputId,
             className: tailwindMerge.twMerge(
-              "flex w-full items-center gap-4 px-4 text-left focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/40",
+              "expansion-panel-item__header flex w-full list-none items-center gap-4 px-4 text-left",
               densityPadding,
               disabledClass,
               isExpanded ? accent.bg : void 0,
               headerClassName
             ),
+            "aria-disabled": disabled || void 0,
             "data-state": isExpanded ? "open" : "closed",
             children: [
               prepend && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex h-10 w-10 items-center justify-center text-gray-500", children: prepend }),
@@ -1195,22 +1176,14 @@ var ExpansionPanelItemInner = (props) => {
         hasContent && /* @__PURE__ */ jsxRuntime.jsx(
           "div",
           {
-            className: "grid overflow-hidden border-t border-gray-100 transition-all duration-200 ease-in-out",
-            style: { gridTemplateRows: isExpanded ? "1fr" : "0fr" },
-            "aria-hidden": isExpanded ? void 0 : true,
+            className: "expansion-panel-item__content overflow-hidden border-t border-gray-100",
             "data-state": isExpanded ? "open" : "closed",
             children: /* @__PURE__ */ jsxRuntime.jsx(
               "div",
               {
-                id: contentId,
-                role: "region",
-                "aria-labelledby": headerId,
-                "data-state": isExpanded ? "open" : "closed",
                 className: tailwindMerge.twMerge(
-                  "min-h-0 px-4 pt-0 text-sm text-gray-600 transition-all duration-200",
+                  "expansion-panel-item__body min-h-0 px-4 pt-0 text-sm text-gray-600",
                   activeBorderClass,
-                  contentAnimationClass,
-                  isExpanded ? "pointer-events-auto" : "pointer-events-none",
                   contentClassName
                 ),
                 children: children ?? text
@@ -1250,7 +1223,6 @@ var normalizeValues = (value, allowMultiple) => {
   }
   return normalized.length ? [normalized[0]] : [];
 };
-var clampValues = (values, allowMultiple) => allowMultiple ? uniqueValues(values) : values.length ? [values[0]] : [];
 var ExpansionPanelInner = (props, forwardedRef) => {
   const {
     variant = "elevated",
@@ -1267,64 +1239,16 @@ var ExpansionPanelInner = (props, forwardedRef) => {
     ...rest
   } = props;
   const allowMultiple = multiple ?? false;
-  const isControlled = value !== void 0;
-  const [internalValues, setInternalValues] = React4.useState(
-    () => normalizeValues(defaultValue, allowMultiple)
-  );
-  const prevAllowMultipleRef = React4.useRef(allowMultiple);
-  const prevIsControlledRef = React4.useRef(isControlled);
-  React4.useEffect(() => {
-    const prevAllowMultiple = prevAllowMultipleRef.current;
-    const wasControlled = prevIsControlledRef.current;
-    if (!isControlled && (allowMultiple !== prevAllowMultiple || wasControlled !== isControlled)) {
-      setInternalValues((prev) => clampValues(prev, allowMultiple));
-    }
-    prevAllowMultipleRef.current = allowMultiple;
-    prevIsControlledRef.current = isControlled;
-  }, [allowMultiple, isControlled]);
-  const handleValueChange = React4.useCallback(
-    (next) => {
-      if (!isControlled) {
-        setInternalValues(next);
-      }
-      if (onChange) {
-        if (allowMultiple) {
-          onChange(next);
-        } else {
-          onChange(next[0] ?? null);
-        }
-      }
-    },
-    [allowMultiple, isControlled, onChange]
-  );
-  const handleToggle = React4.useCallback(
-    (panelValue, disabled) => {
-      if (disabled) {
-        return;
-      }
-      const expandedValues2 = isControlled ? normalizeValues(value, allowMultiple) : internalValues;
-      const isActive = expandedValues2.includes(panelValue);
-      const next = allowMultiple ? isActive ? expandedValues2.filter((v) => v !== panelValue) : [...expandedValues2, panelValue] : isActive ? [] : [panelValue];
-      handleValueChange(next);
-    },
-    [allowMultiple, handleValueChange, internalValues, isControlled, value]
-  );
-  const expandedValues = React4.useMemo(
-    () => isControlled ? normalizeValues(value, allowMultiple) : internalValues,
-    [allowMultiple, internalValues, isControlled, value]
-  );
-  const providerValue = React4.useMemo(
-    () => ({
-      expandedValues,
-      toggle: handleToggle,
-      density,
-      color,
-      divider,
-      rounded,
-      variant
-    }),
-    [color, density, divider, expandedValues, handleToggle, rounded, variant]
-  );
+  const resolvedValue = value !== void 0 ? value : defaultValue;
+  const expandedValues = normalizeValues(resolvedValue, allowMultiple);
+  const providerValue = {
+    expandedValues,
+    density,
+    color,
+    divider,
+    rounded,
+    variant
+  };
   const variantClass = divider ? variantContainerClasses[variant] : "bg-transparent border border-transparent shadow-none";
   const shapeClass = roundedClasses2[rounded] ?? roundedClasses2.lg;
   const layoutClass = divider ? "divide-y divide-gray-100 overflow-hidden" : "gap-4";
@@ -1345,7 +1269,10 @@ var ExpansionPanelInner = (props, forwardedRef) => {
     }
   );
 };
-var ExpansionPanel = React4.forwardRef(ExpansionPanelInner);
+var ExpansionPanelBase = React4.forwardRef(ExpansionPanelInner);
+var ExpansionPanel = Object.assign(ExpansionPanelBase, {
+  Item: ExpansionPanelItem_default
+});
 ExpansionPanel.displayName = "ExpansionPanel";
 var ExpansionPanel_default = ExpansionPanel;
 var containerBaseClasses = "fixed inset-0 z-[70] flex items-center justify-center p-4 sm:p-8 data-[state=closed]:pointer-events-none";
@@ -1473,10 +1400,119 @@ var Dialog = React4__namespace.forwardRef((props, forwardedRef) => {
 });
 Dialog.displayName = "Dialog";
 var Dialog_default = Dialog;
+var overlayBaseClasses3 = "fixed inset-0 z-[55] bg-gray-900/55 backdrop-blur-[2px] transition-opacity duration-200 data-[state=closed]:opacity-0 data-[state=open]:opacity-100";
+var temporaryContainerBaseClasses = "fixed inset-y-0 z-[60] flex max-w-full transition-transform duration-200";
+var staticContainerBaseClasses = "relative flex h-full max-w-full";
+var drawerBaseClasses = "flex h-full w-full flex-col bg-white text-gray-900 shadow-xl shadow-black/10 ring-1 ring-black/5 focus-visible:outline-none dark:bg-gray-900 dark:text-gray-100 dark:ring-white/10";
+var resolveSizeValue2 = (value) => {
+  if (value === void 0) {
+    return void 0;
+  }
+  return typeof value === "number" ? `${value}px` : value;
+};
+var Drawer = React4__namespace.forwardRef((props, ref) => {
+  const {
+    location = "left",
+    floating = false,
+    temporary = false,
+    open,
+    keepMounted = false,
+    scrim = true,
+    width = "18rem",
+    onClose,
+    containerClassName,
+    overlayClassName,
+    overlayProps,
+    portal = true,
+    portalContainer,
+    className,
+    style,
+    role,
+    ...rest
+  } = props;
+  const isOpen = open ?? !temporary;
+  const state = isOpen ? "open" : "closed";
+  const shouldRender = keepMounted || isOpen || temporary;
+  const resolvedPortalContainer = portalContainer ?? (typeof document !== "undefined" ? document.body : null);
+  const resolvedStyle = { ...style };
+  if (resolvedStyle.width === void 0) {
+    resolvedStyle.width = resolveSizeValue2(width);
+  }
+  const locationClass = location === "right" ? "right-0" : "left-0";
+  const translateClass = isOpen ? "translate-x-0" : location === "right" ? "translate-x-full" : "-translate-x-full";
+  const floatingClasses = floating ? "rounded-2xl shadow-2xl shadow-black/20 ring-1 ring-black/10 dark:ring-white/10" : void 0;
+  const borderClasses = !floating && !temporary ? location === "right" ? "border-l border-gray-200 dark:border-gray-800" : "border-r border-gray-200 dark:border-gray-800" : void 0;
+  const {
+    className: overlayExtraClassName,
+    onClick: overlayOnClick,
+    ...restOverlayProps
+  } = overlayProps ?? {};
+  const overlayNode = temporary && scrim && shouldRender ? /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      ...restOverlayProps,
+      className: tailwindMerge.twMerge(
+        overlayBaseClasses3,
+        isOpen ? "pointer-events-auto opacity-100" : "pointer-events-none opacity-0",
+        overlayClassName,
+        overlayExtraClassName
+      ),
+      onClick: (event) => {
+        overlayOnClick?.(event);
+        if (!event.defaultPrevented) {
+          onClose?.();
+        }
+      },
+      "data-state": state,
+      "aria-hidden": true
+    }
+  ) : null;
+  const drawerNode = shouldRender ? /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      className: tailwindMerge.twMerge(
+        temporary ? temporaryContainerBaseClasses : staticContainerBaseClasses,
+        temporary ? locationClass : void 0,
+        temporary ? translateClass : void 0,
+        temporary && !isOpen ? "pointer-events-none" : void 0,
+        temporary && floating ? "p-4" : void 0,
+        !temporary && location === "right" ? "ml-auto" : void 0,
+        containerClassName
+      ),
+      "data-state": state,
+      "aria-hidden": temporary ? !isOpen : void 0,
+      children: /* @__PURE__ */ jsxRuntime.jsx(
+        "div",
+        {
+          ...rest,
+          ref,
+          role: role ?? "navigation",
+          className: tailwindMerge.twMerge(drawerBaseClasses, floatingClasses, borderClasses, className),
+          style: resolvedStyle,
+          "data-state": state,
+          children: props.children
+        }
+      )
+    }
+  ) : null;
+  const outputNode = temporary && portal && resolvedPortalContainer && drawerNode ? reactDom.createPortal(
+    /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      overlayNode,
+      drawerNode
+    ] }),
+    resolvedPortalContainer
+  ) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    overlayNode,
+    drawerNode
+  ] });
+  return outputNode;
+});
+Drawer.displayName = "Drawer";
+var Drawer_default = Drawer;
 var tooltipBaseClasses = "absolute z-[60] max-w-xs rounded-lg border border-white/10 bg-gray-900 px-3 py-2 text-xs font-medium text-white shadow-lg shadow-black/30 ring-1 ring-black/40 transition-all duration-150";
 var wrapperBaseClasses = "relative inline-flex max-w-full align-middle";
 var arrowBaseClasses = "pointer-events-none absolute h-2 w-2 rotate-45 border border-white/10 bg-gray-900 shadow-lg shadow-black/20";
-var resolveSizeValue2 = (value) => {
+var resolveSizeValue3 = (value) => {
   if (value === void 0) {
     return void 0;
   }
@@ -1534,7 +1570,7 @@ var ToolTip = React4__namespace.forwardRef((props, forwardedRef) => {
   const shouldRenderTooltip = hasRenderableContent && (shouldEnableTriggers || keepMounted);
   const resolvedStyle = { ...style };
   if (resolvedStyle.maxWidth === void 0) {
-    resolvedStyle.maxWidth = resolveSizeValue2(maxWidth);
+    resolvedStyle.maxWidth = resolveSizeValue3(maxWidth);
   }
   const baseVisibility = persistent ? "opacity-100 scale-100" : "opacity-0 scale-95";
   const hoverClasses = !persistent && showOnHover ? " group-hover/tooltip:opacity-100 group-hover/tooltip:scale-100" : "";
@@ -3391,118 +3427,141 @@ var resolveIconClassName5 = (icon) => {
   const classes = [...baseClasses, normalizedName];
   return Array.from(new Set(classes)).join(" ");
 };
-var Select = React4__namespace.default.forwardRef(({
-  options,
-  label,
-  placeholder,
-  variant = "outline",
-  size = "medium",
-  className,
-  wrapperClassName,
-  id,
-  name,
-  multiple,
-  value,
-  defaultValue,
-  error,
-  helperText,
-  disabled,
-  required,
-  onChange,
-  onBlur,
-  ...props
-}, ref) => {
-  const selectId = id || name || generateString();
-  const inputName = name || selectId;
-  const variantClass = variantClasses4[variant] ?? variantClasses4.outline;
-  const sizeConfig = sizeClasses3[size] ?? sizeClasses3.medium;
-  const sizeClass = `${sizeConfig.padding} ${sizeConfig.text}`;
-  const normalizedOptions = options.map(normalizeOption);
-  const selectedValueList = value !== void 0 ? (Array.isArray(value) ? value : [value]).map(String) : defaultValue !== void 0 ? (Array.isArray(defaultValue) ? defaultValue : [defaultValue]).map(String) : [];
-  const selectedLabels = normalizedOptions.filter((option) => selectedValueList.includes(String(option.value))).map((option) => option.label);
-  const hasSelection = selectedLabels.length > 0;
-  const summaryText = hasSelection ? multiple ? selectedLabels.join(", ") : selectedLabels[0] : placeholder || "\xA0";
-  const handleOptionChange = (event) => {
-    onChange?.(event);
-    if (multiple) return;
-    const detailsEl = event.currentTarget.closest("details");
-    detailsEl?.removeAttribute("open");
-  };
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: tailwindMerge.twMerge("flex flex-col gap-1", wrapperClassName), children: [
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
-      /* @__PURE__ */ jsxRuntime.jsxs("details", { className: "group w-full", ...props, open: void 0, children: [
+var Select = React4__namespace.default.forwardRef(
+  ({
+    options,
+    label,
+    placeholder,
+    variant = "outline",
+    size = "medium",
+    className,
+    wrapperClassName,
+    id,
+    name,
+    multiple,
+    value,
+    defaultValue,
+    error,
+    helperText,
+    disabled,
+    required,
+    onChange,
+    onBlur,
+    onFocus,
+    ...props
+  }, ref) => {
+    const selectId = id || name || generateString();
+    const inputName = name || selectId;
+    const variantClass = variantClasses4[variant] ?? variantClasses4.outline;
+    const sizeConfig = sizeClasses3[size] ?? sizeClasses3.medium;
+    const sizeClass = `${sizeConfig.padding} ${sizeConfig.text}`;
+    const normalizedOptions = options.map(normalizeOption);
+    const selectedValueList = value !== void 0 ? (Array.isArray(value) ? value : [value]).map(String) : defaultValue !== void 0 ? (Array.isArray(defaultValue) ? defaultValue : [defaultValue]).map(String) : [];
+    const selectedLabels = normalizedOptions.filter((option) => selectedValueList.includes(String(option.value))).map((option) => option.label);
+    const hasSelection = selectedLabels.length > 0;
+    const summaryText = hasSelection ? multiple ? selectedLabels.join(", ") : selectedLabels[0] : placeholder || "\xA0";
+    const handleOptionChange = (event) => {
+      onChange?.(event);
+      if (multiple) return;
+      const detailsEl = event.currentTarget.closest("details");
+      detailsEl?.removeAttribute("open");
+    };
+    const handleDetailsBlur = (event) => {
+      const nextFocus = event.relatedTarget;
+      if (nextFocus && event.currentTarget.contains(nextFocus)) return;
+      event.currentTarget.removeAttribute("open");
+    };
+    const handleDetailsFocus = (event) => {
+      if (normalizedOptions.length === 0) {
+        onFocus?.(event);
+      }
+    };
+    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: tailwindMerge.twMerge("flex flex-col gap-1", wrapperClassName), children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
         /* @__PURE__ */ jsxRuntime.jsxs(
-          "summary",
+          "details",
           {
-            className: tailwindMerge.twMerge(
-              baseClass2,
-              variantClass,
-              sizeClass,
-              "list-none cursor-pointer flex items-center justify-between pr-10 relative [&::-webkit-details-marker]:hidden",
-              error && "border-red-500 focus-visible:border-red-500 focus-visible:ring-red-500",
-              disabled && "pointer-events-none opacity-50 cursor-not-allowed",
-              className
-            ),
-            style: { minHeight: "2.75rem" },
-            onClick: (e) => disabled && e.preventDefault(),
+            className: "group w-full",
+            ...props,
+            onBlur: onBlur ? void 0 : handleDetailsBlur,
+            onFocus: onFocus ? handleDetailsFocus : void 0,
+            open: void 0,
             children: [
-              /* @__PURE__ */ jsxRuntime.jsx("span", { className: tailwindMerge.twMerge("truncate", !hasSelection && "text-gray-500 dark:text-gray-400"), children: summaryText }),
-              /* @__PURE__ */ jsxRuntime.jsx("span", { className: "pointer-events-none absolute inset-y-0 right-3 flex items-center text-gray-500 dark:text-gray-300", children: /* @__PURE__ */ jsxRuntime.jsx("i", { className: "mdi mdi-chevron-down text-base leading-none transition-transform duration-200 group-open:rotate-180", "aria-hidden": true }) })
+              /* @__PURE__ */ jsxRuntime.jsxs(
+                "summary",
+                {
+                  className: tailwindMerge.twMerge(
+                    baseClass2,
+                    variantClass,
+                    sizeClass,
+                    "list-none cursor-pointer flex items-center justify-between pr-10 relative [&::-webkit-details-marker]:hidden",
+                    error && "border-red-500 focus-visible:border-red-500 focus-visible:ring-red-500",
+                    disabled && "pointer-events-none opacity-50 cursor-not-allowed",
+                    className
+                  ),
+                  style: { minHeight: "2.75rem" },
+                  onClick: (e) => disabled && e.preventDefault(),
+                  children: [
+                    /* @__PURE__ */ jsxRuntime.jsx("span", { className: tailwindMerge.twMerge("truncate", !hasSelection && "text-gray-500 dark:text-gray-400"), children: summaryText }),
+                    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "pointer-events-none absolute inset-y-0 right-3 flex items-center text-gray-500 dark:text-gray-300", children: /* @__PURE__ */ jsxRuntime.jsx("i", { className: "mdi mdi-chevron-down text-base leading-none transition-transform duration-200 group-open:rotate-180", "aria-hidden": true }) })
+                  ]
+                }
+              ),
+              /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute z-50 mt-1 max-h-60 w-full overflow-auto rounded-lg border border-gray-200 bg-white py-1 shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none dark:bg-slate-800 dark:border-slate-700", children: normalizedOptions.map((option, index) => {
+                const optionValueStr = String(option.value);
+                const isSelected = Array.isArray(value) ? value.map(String).includes(optionValueStr) : String(value) === optionValueStr;
+                const isDefaultSelected = Array.isArray(defaultValue) ? defaultValue.map(String).includes(optionValueStr) : String(defaultValue) === optionValueStr;
+                const iconClassName = resolveIconClassName5(option.icon);
+                const inputId = `${selectId}-${toIdSafe(optionValueStr)}-${index}`;
+                return /* @__PURE__ */ jsxRuntime.jsxs(
+                  "label",
+                  {
+                    htmlFor: inputId,
+                    className: tailwindMerge.twMerge(
+                      "relative flex cursor-pointer select-none items-center gap-2 px-4 py-2 text-sm text-gray-900 hover:bg-gray-50 dark:text-gray-100 dark:hover:bg-slate-700",
+                      option.disabled && "cursor-not-allowed opacity-50"
+                    ),
+                    children: [
+                      /* @__PURE__ */ jsxRuntime.jsx(
+                        "input",
+                        {
+                          type: multiple ? "checkbox" : "radio",
+                          id: inputId,
+                          name: inputName,
+                          value: option.value,
+                          disabled: option.disabled || disabled,
+                          checked: value !== void 0 ? isSelected : void 0,
+                          defaultChecked: defaultValue !== void 0 ? isDefaultSelected : void 0,
+                          onChange: handleOptionChange,
+                          onBlur,
+                          ref,
+                          required: required && !multiple,
+                          className: "peer sr-only"
+                        }
+                      ),
+                      iconClassName && /* @__PURE__ */ jsxRuntime.jsx("i", { className: tailwindMerge.twMerge(iconClassName, "text-lg text-gray-500 peer-checked:text-primary dark:text-gray-400") }),
+                      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex-1 truncate peer-checked:font-medium peer-checked:text-primary", children: option.label }),
+                      /* @__PURE__ */ jsxRuntime.jsx("i", { className: "mdi mdi-check invisible ml-auto text-primary peer-checked:visible" })
+                    ]
+                  },
+                  `${optionValueStr}-${index}`
+                );
+              }) })
             ]
           }
         ),
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute z-50 mt-1 max-h-60 w-full overflow-auto rounded-lg border border-gray-200 bg-white py-1 shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none dark:bg-slate-800 dark:border-slate-700", children: normalizedOptions.map((option, index) => {
-          const optionValueStr = String(option.value);
-          const isSelected = Array.isArray(value) ? value.map(String).includes(optionValueStr) : String(value) === optionValueStr;
-          const isDefaultSelected = Array.isArray(defaultValue) ? defaultValue.map(String).includes(optionValueStr) : String(defaultValue) === optionValueStr;
-          const iconClassName = resolveIconClassName5(option.icon);
-          const inputId = `${selectId}-${toIdSafe(optionValueStr)}-${index}`;
-          return /* @__PURE__ */ jsxRuntime.jsxs(
-            "label",
-            {
-              htmlFor: inputId,
-              className: tailwindMerge.twMerge(
-                "relative flex cursor-pointer select-none items-center gap-2 px-4 py-2 text-sm text-gray-900 hover:bg-gray-50 dark:text-gray-100 dark:hover:bg-slate-700",
-                option.disabled && "cursor-not-allowed opacity-50"
-              ),
-              children: [
-                /* @__PURE__ */ jsxRuntime.jsx(
-                  "input",
-                  {
-                    type: multiple ? "checkbox" : "radio",
-                    id: inputId,
-                    name: inputName,
-                    value: option.value,
-                    disabled: option.disabled || disabled,
-                    checked: value !== void 0 ? isSelected : void 0,
-                    defaultChecked: defaultValue !== void 0 ? isDefaultSelected : void 0,
-                    onChange: handleOptionChange,
-                    onBlur,
-                    ref,
-                    required: required && !multiple,
-                    className: "peer sr-only"
-                  }
-                ),
-                iconClassName && /* @__PURE__ */ jsxRuntime.jsx("i", { className: tailwindMerge.twMerge(iconClassName, "text-lg text-gray-500 peer-checked:text-primary dark:text-gray-400") }),
-                /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex-1 truncate peer-checked:font-medium peer-checked:text-primary", children: option.label }),
-                /* @__PURE__ */ jsxRuntime.jsx("i", { className: "mdi mdi-check invisible ml-auto text-primary peer-checked:visible" })
-              ]
-            },
-            `${optionValueStr}-${index}`
-          );
-        }) })
+        label && /* @__PURE__ */ jsxRuntime.jsx(
+          "label",
+          {
+            className: tailwindMerge.twMerge("absolute left-3 -top-1.5 text-xs bg-white px-1 text-gray-500 transition-all dark:bg-slate-900 dark:text-gray-400"),
+            children: label
+          }
+        )
       ] }),
-      label && /* @__PURE__ */ jsxRuntime.jsx(
-        "label",
-        {
-          className: tailwindMerge.twMerge("absolute left-3 -top-1.5 text-xs bg-white px-1 text-gray-500 transition-all dark:bg-slate-900 dark:text-gray-400"),
-          children: label
-        }
-      )
-    ] }),
-    helperText && /* @__PURE__ */ jsxRuntime.jsx("p", { className: tailwindMerge.twMerge("mt-1 text-xs text-gray-500", error && "text-red-500"), children: helperText })
-  ] });
-});
+      helperText && /* @__PURE__ */ jsxRuntime.jsx("p", { className: tailwindMerge.twMerge("mt-1 text-xs text-gray-500", error && "text-red-500"), children: helperText })
+    ] });
+  }
+);
 Select.displayName = "Select";
 var Select_default = Select;
 var paletteValues = {
@@ -4638,6 +4697,7 @@ exports.Button = Button_default;
 exports.Card = Card_default;
 exports.Chip = Chip_default;
 exports.Dialog = Dialog_default;
+exports.Drawer = Drawer_default;
 exports.ExpansionPanel = ExpansionPanel_default;
 exports.ExpansionPanelItem = ExpansionPanelItem_default;
 exports.Hero = Hero_default;