@mdigital_ui/ui 0.4.2 → 0.4.4

package/dist/chunk-4HKPDSA6.js

@@ -0,0 +1,378 @@
+import { colorVars } from './chunk-G6QIIWKU.js';
+import { cn, iconSizes } from './chunk-RAS6HUEI.js';
+import { cva } from 'class-variance-authority';
+import { ChevronDown } from 'lucide-react';
+import React, { useRef, useCallback, useLayoutEffect, useId, useState } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var accordionContainerVariants = cva("w-full", {
+  variants: {
+    variant: {
+      default: "space-y-0 divide-y divide-border rounded-lg overflow-hidden",
+      solid: "space-y-0 divide-y divide-border/50 rounded-lg overflow-hidden",
+      soft: "space-y-0 divide-y divide-border/30 rounded-lg overflow-hidden",
+      bordered: "space-y-0 divide-y border border-slot rounded-lg overflow-hidden",
+      splitted: "space-y-2"
+    },
+    color: colorVars,
+    showDivider: {
+      true: "",
+      false: ""
+    }
+  },
+  compoundVariants: [
+    { variant: "default", showDivider: false, class: "divide-y-0" },
+    { variant: "solid", showDivider: false, class: "divide-y-0" },
+    { variant: "soft", showDivider: false, class: "divide-y-0" },
+    { variant: "bordered", showDivider: false, class: "divide-y-0" },
+    { variant: "bordered", color: "default", class: "divide-border" }
+  ],
+  defaultVariants: {
+    variant: "default",
+    color: "default",
+    showDivider: true
+  }
+});
+var accordionItemVariants = cva("", {
+  variants: {
+    variant: {
+      default: "bg-transparent",
+      solid: "bg-slot text-slot-fg",
+      soft: "bg-slot-10",
+      bordered: "bg-transparent border-slot-20",
+      splitted: "border rounded-lg overflow-hidden border-slot"
+    },
+    color: colorVars
+  },
+  compoundVariants: [
+    { variant: "soft", color: "default", class: "bg-surface/50" },
+    { variant: "bordered", color: "default", class: "border-border" }
+  ],
+  defaultVariants: {
+    variant: "default",
+    color: "default"
+  }
+});
+var accordionHeaderVariants = cva(
+  [
+    "flex items-center w-full text-left font-medium text-text-primary touch-manipulation",
+    "focus:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-offset-background focus-visible:ring-slot",
+    "disabled:opacity-50 disabled:cursor-not-allowed"
+  ],
+  {
+    variants: {
+      size: {
+        xs: "px-(--accordion-padding-x-xs) py-(--accordion-padding-y-xs) text-xs gap-2",
+        sm: "px-(--accordion-padding-x-sm) py-(--accordion-padding-y-sm) text-sm gap-2",
+        md: "px-(--accordion-padding-x-md) py-(--accordion-padding-y-md) text-base gap-3",
+        lg: "px-(--accordion-padding-x-lg) py-(--accordion-padding-y-lg) text-lg gap-3"
+      },
+      color: colorVars,
+      disabled: {
+        true: "cursor-not-allowed",
+        false: "cursor-pointer hover:bg-surface/50"
+      }
+    },
+    defaultVariants: {
+      size: "md",
+      color: "default",
+      disabled: false
+    }
+  }
+);
+var accordionContentVariants = cva("text-text-secondary", {
+  variants: {
+    size: {
+      xs: "px-(--accordion-padding-x-xs) pb-(--accordion-padding-y-xs) text-xs",
+      sm: "px-(--accordion-padding-x-sm) pb-(--accordion-padding-y-sm) text-sm",
+      md: "px-(--accordion-padding-x-md) pb-(--accordion-padding-y-md) text-base",
+      lg: "px-(--accordion-padding-x-lg) pb-(--accordion-padding-y-lg) text-lg"
+    }
+  },
+  defaultVariants: {
+    size: "md"
+  }
+});
+var getIconColor = (_color, isExpanded) => {
+  if (!isExpanded) return "text-text-secondary";
+  return "text-slot";
+};
+var AccordionItemComponent = React.memo(
+  ({
+    item,
+    isActive: isItemActive,
+    baseId,
+    size,
+    color,
+    variant,
+    isSolidColored,
+    expandIcon,
+    expandIconPosition,
+    destroyOnClose,
+    onToggle,
+    classNames,
+    itemClassName
+  }) => {
+    const headerId = `${baseId}-header-${item.key}`;
+    const panelId = `${baseId}-panel-${item.key}`;
+    const panelRef = useRef(null);
+    const contentRef = useRef(null);
+    const prevActiveRef = useRef(isItemActive);
+    const cachedHeightRef = useRef(0);
+    const animRef = useRef(null);
+    const handlePointerEnter = useCallback(() => {
+      if (contentRef.current) {
+        cachedHeightRef.current = contentRef.current.scrollHeight;
+      }
+    }, []);
+    useLayoutEffect(() => {
+      if (panelRef.current) {
+        panelRef.current.style.height = isItemActive ? "auto" : "0";
+      }
+    }, []);
+    useLayoutEffect(() => {
+      const panel = panelRef.current;
+      const content = contentRef.current;
+      if (!panel || !content) return;
+      const wasActive = prevActiveRef.current;
+      prevActiveRef.current = isItemActive;
+      if (isItemActive === wasActive) return;
+      if (animRef.current) animRef.current.cancel();
+      const height = cachedHeightRef.current || content.scrollHeight;
+      cachedHeightRef.current = 0;
+      const prefersReducedMotion = typeof window !== "undefined" && window.matchMedia?.("(prefers-reduced-motion: reduce)").matches;
+      const duration = prefersReducedMotion ? 0 : 200;
+      const anim = panel.animate(
+        isItemActive ? [{ height: "0px" }, { height: `${height}px` }] : [{ height: `${height}px` }, { height: "0px" }],
+        { duration, easing: "ease-out", fill: "forwards" }
+      );
+      anim.onfinish = () => {
+        panel.style.height = isItemActive ? "auto" : "0";
+        anim.cancel();
+      };
+      animRef.current = anim;
+    }, [isItemActive]);
+    const renderExpandIcon = (isExpanded) => {
+      if (expandIcon === false) return null;
+      if (typeof expandIcon === "function") {
+        return expandIcon(isExpanded);
+      }
+      if (expandIcon) {
+        return /* @__PURE__ */ jsx(
+          "span",
+          {
+            className: cn(
+              "shrink-0 transition-transform duration-300",
+              isExpanded && "rotate-180"
+            ),
+            children: expandIcon
+          }
+        );
+      }
+      return /* @__PURE__ */ jsx(
+        ChevronDown,
+        {
+          className: cn(
+            "shrink-0 transition-transform duration-300",
+            isExpanded && "rotate-180",
+            isSolidColored ? "text-inherit" : getIconColor(color, isExpanded),
+            iconSizes[size]
+          )
+        }
+      );
+    };
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        "data-slot": "item",
+        className: cn(
+          "accordion_item",
+          accordionItemVariants({ variant, color }),
+          item.disabled && "opacity-50",
+          classNames?.item,
+          itemClassName
+        ),
+        children: [
+          /* @__PURE__ */ jsxs(
+            "button",
+            {
+              type: "button",
+              id: headerId,
+              "aria-expanded": isItemActive,
+              "aria-controls": panelId,
+              "aria-disabled": item.disabled,
+              disabled: item.disabled,
+              onClick: () => onToggle(item.key, item.disabled),
+              onPointerEnter: handlePointerEnter,
+              "data-slot": "trigger",
+              className: cn(
+                "accordion_trigger",
+                accordionHeaderVariants({
+                  size,
+                  color,
+                  disabled: item.disabled
+                }),
+                classNames?.trigger
+              ),
+              children: [
+                expandIconPosition === "left" && renderExpandIcon(isItemActive),
+                item.icon && /* @__PURE__ */ jsx(
+                  "span",
+                  {
+                    "data-slot": "icon",
+                    className: cn(
+                      "accordion_icon",
+                      "shrink-0",
+                      isSolidColored ? "text-inherit" : getIconColor(color, isItemActive),
+                      classNames?.icon
+                    ),
+                    children: item.icon
+                  }
+                ),
+                /* @__PURE__ */ jsxs("div", { className: "flex-1 min-w-0", children: [
+                  /* @__PURE__ */ jsx(
+                    "div",
+                    {
+                      className: cn(
+                        !isSolidColored && isItemActive && color !== "default" && "text-slot"
+                      ),
+                      children: item.title
+                    }
+                  ),
+                  item.subtitle && /* @__PURE__ */ jsx("div", { className: cn(
+                    "font-normal mt-0.5",
+                    isSolidColored ? "text-inherit opacity-80" : "text-text-secondary"
+                  ), children: item.subtitle })
+                ] }),
+                item.extra && /* @__PURE__ */ jsx("span", { className: cn(
+                  "shrink-0",
+                  isSolidColored ? "text-inherit opacity-80" : "text-text-secondary"
+                ), children: item.extra }),
+                expandIconPosition === "right" && renderExpandIcon(isItemActive)
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            "div",
+            {
+              ref: panelRef,
+              id: panelId,
+              role: "region",
+              "aria-labelledby": headerId,
+              "aria-hidden": !isItemActive,
+              className: "overflow-hidden",
+              style: { contain: "content" },
+              children: /* @__PURE__ */ jsx("div", { ref: contentRef, children: (!destroyOnClose || isItemActive) && /* @__PURE__ */ jsx(
+                "div",
+                {
+                  "data-slot": "content",
+                  className: cn(
+                    "accordion_content",
+                    accordionContentVariants({ size }),
+                    isSolidColored && "text-inherit opacity-90",
+                    classNames?.content
+                  ),
+                  children: item.content
+                }
+              ) })
+            }
+          )
+        ]
+      }
+    );
+  }
+);
+AccordionItemComponent.displayName = "AccordionItem";
+var Accordion = React.memo(
+  ({
+    items,
+    color = "default",
+    size = "md",
+    variant = "default",
+    defaultActiveKey,
+    activeKey: controlledActiveKey,
+    onChange,
+    multiple = false,
+    expandIcon,
+    expandIconPosition = "right",
+    collapsible = true,
+    destroyOnClose = false,
+    showDivider = true,
+    className,
+    itemClassName,
+    classNames,
+    ref
+  }) => {
+    const isSolidColored = variant === "solid" && color !== "default";
+    const baseId = useId();
+    const [internalActiveKey, setInternalActiveKey] = useState(
+      defaultActiveKey ? multiple && !Array.isArray(defaultActiveKey) ? [defaultActiveKey] : defaultActiveKey : multiple ? [] : ""
+    );
+    const activeKey = controlledActiveKey !== void 0 ? controlledActiveKey : internalActiveKey;
+    const isActive = useCallback((key) => {
+      if (Array.isArray(activeKey)) {
+        return activeKey.includes(key);
+      }
+      return activeKey === key;
+    }, [activeKey]);
+    const handleToggle = useCallback((key, disabled) => {
+      if (disabled) return;
+      let newActiveKey;
+      if (multiple) {
+        const currentKeys = Array.isArray(activeKey) ? activeKey : activeKey ? [activeKey] : [];
+        newActiveKey = currentKeys.includes(key) ? currentKeys.filter((k) => k !== key) : [...currentKeys, key];
+      } else {
+        if (!collapsible && activeKey === key) {
+          return;
+        }
+        newActiveKey = activeKey === key ? "" : key;
+      }
+      if (controlledActiveKey === void 0) {
+        setInternalActiveKey(newActiveKey);
+      }
+      onChange?.(newActiveKey);
+    }, [multiple, activeKey, collapsible, controlledActiveKey, onChange]);
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref,
+        "data-slot": "root",
+        className: cn(
+          "accordion_root",
+          accordionContainerVariants({
+            variant,
+            color,
+            showDivider: showDivider && variant !== "splitted"
+          }),
+          classNames?.root,
+          className
+        ),
+        children: items.map((item) => /* @__PURE__ */ jsx(
+          AccordionItemComponent,
+          {
+            item,
+            isActive: isActive(item.key),
+            baseId,
+            size,
+            color,
+            variant,
+            isSolidColored,
+            expandIcon,
+            expandIconPosition,
+            destroyOnClose,
+            onToggle: handleToggle,
+            classNames,
+            itemClassName
+          },
+          item.key
+        ))
+      }
+    );
+  }
+);
+Accordion.displayName = "Accordion";
+var accordion_default = Accordion;
+
+export { accordion_default };
+//# sourceMappingURL=chunk-4HKPDSA6.js.map
+//# sourceMappingURL=chunk-4HKPDSA6.js.map

package/dist/chunk-4HKPDSA6.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/accordion/index.tsx"],"names":[],"mappings":"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","file":"chunk-4HKPDSA6.js","sourcesContent":["'use client'\n\nimport { cva } from \"class-variance-authority\";\nimport { ChevronDown } from \"lucide-react\";\nimport React, { useCallback, useId, useLayoutEffect, useRef, useState } from \"react\";\n\nimport { cn, iconSizes } from \"../utils\";\nimport { colorVars } from \"../variants\";\nimport type { AccordionItem as AccordionItemType, AccordionProps, AccordionSize } from \"./types\";\n\nconst accordionContainerVariants = cva(\"w-full\", {\n  variants: {\n    variant: {\n      default: \"space-y-0 divide-y divide-border rounded-lg overflow-hidden\",\n      solid: \"space-y-0 divide-y divide-border/50 rounded-lg overflow-hidden\",\n      soft: \"space-y-0 divide-y divide-border/30 rounded-lg overflow-hidden\",\n      bordered: \"space-y-0 divide-y border border-slot rounded-lg overflow-hidden\",\n      splitted: \"space-y-2\",\n    },\n    color: colorVars,\n    showDivider: {\n      true: \"\",\n      false: \"\",\n    },\n  },\n  compoundVariants: [\n    { variant: \"default\", showDivider: false, class: \"divide-y-0\" },\n    { variant: \"solid\", showDivider: false, class: \"divide-y-0\" },\n    { variant: \"soft\", showDivider: false, class: \"divide-y-0\" },\n    { variant: \"bordered\", showDivider: false, class: \"divide-y-0\" },\n    { variant: \"bordered\", color: \"default\", class: \"divide-border\" },\n  ],\n  defaultVariants: {\n    variant: \"default\",\n    color: \"default\",\n    showDivider: true,\n  },\n});\n\nconst accordionItemVariants = cva(\"\", {\n  variants: {\n    variant: {\n      default: \"bg-transparent\",\n      solid: \"bg-slot text-slot-fg\",\n      soft: \"bg-slot-10\",\n      bordered: \"bg-transparent border-slot-20\",\n      splitted: \"border rounded-lg overflow-hidden border-slot\",\n    },\n    color: colorVars,\n  },\n  compoundVariants: [\n    { variant: \"soft\", color: \"default\", class: \"bg-surface/50\" },\n    { variant: \"bordered\", color: \"default\", class: \"border-border\" },\n  ],\n  defaultVariants: {\n    variant: \"default\",\n    color: \"default\",\n  },\n});\n\nconst accordionHeaderVariants = cva(\n  [\n    \"flex items-center w-full text-left font-medium text-text-primary touch-manipulation\",\n    \"focus:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-offset-background focus-visible:ring-slot\",\n    \"disabled:opacity-50 disabled:cursor-not-allowed\",\n  ],\n  {\n    variants: {\n      size: {\n        xs: \"px-(--accordion-padding-x-xs) py-(--accordion-padding-y-xs) text-xs gap-2\",\n        sm: \"px-(--accordion-padding-x-sm) py-(--accordion-padding-y-sm) text-sm gap-2\",\n        md: \"px-(--accordion-padding-x-md) py-(--accordion-padding-y-md) text-base gap-3\",\n        lg: \"px-(--accordion-padding-x-lg) py-(--accordion-padding-y-lg) text-lg gap-3\",\n      },\n      color: colorVars,\n      disabled: {\n        true: \"cursor-not-allowed\",\n        false: \"cursor-pointer hover:bg-surface/50\",\n      },\n    },\n    defaultVariants: {\n      size: \"md\",\n      color: \"default\",\n      disabled: false,\n    },\n  },\n);\n\nconst accordionContentVariants = cva(\"text-text-secondary\", {\n  variants: {\n    size: {\n      xs: \"px-(--accordion-padding-x-xs) pb-(--accordion-padding-y-xs) text-xs\",\n      sm: \"px-(--accordion-padding-x-sm) pb-(--accordion-padding-y-sm) text-sm\",\n      md: \"px-(--accordion-padding-x-md) pb-(--accordion-padding-y-md) text-base\",\n      lg: \"px-(--accordion-padding-x-lg) pb-(--accordion-padding-y-lg) text-lg\",\n    },\n  },\n  defaultVariants: {\n    size: \"md\",\n  },\n});\n\nconst getIconColor = (_color: AccordionProps[\"color\"], isExpanded: boolean) => {\n  if (!isExpanded) return \"text-text-secondary\";\n  return \"text-slot\";\n};\n\ninterface AccordionItemComponentProps {\n  item: AccordionItemType;\n  isActive: boolean;\n  baseId: string;\n  size: AccordionSize;\n  color: NonNullable<AccordionProps[\"color\"]>;\n  variant: NonNullable<AccordionProps[\"variant\"]>;\n  isSolidColored: boolean;\n  expandIcon: AccordionProps[\"expandIcon\"];\n  expandIconPosition: NonNullable<AccordionProps[\"expandIconPosition\"]>;\n  destroyOnClose: boolean;\n  onToggle: (key: string, disabled?: boolean) => void;\n  classNames?: AccordionProps[\"classNames\"];\n  itemClassName?: string;\n}\n\nconst AccordionItemComponent = React.memo<AccordionItemComponentProps>(\n  ({\n    item,\n    isActive: isItemActive,\n    baseId,\n    size,\n    color,\n    variant,\n    isSolidColored,\n    expandIcon,\n    expandIconPosition,\n    destroyOnClose,\n    onToggle,\n    classNames,\n    itemClassName,\n  }) => {\n    const headerId = `${baseId}-header-${item.key}`;\n    const panelId = `${baseId}-panel-${item.key}`;\n    const panelRef = useRef<HTMLDivElement>(null);\n    const contentRef = useRef<HTMLDivElement>(null);\n    const prevActiveRef = useRef(isItemActive);\n    const cachedHeightRef = useRef<number>(0);\n    const animRef = useRef<Animation | null>(null);\n\n    // Pre-measure on hover so click has zero reflow cost\n    const handlePointerEnter = useCallback(() => {\n      if (contentRef.current) {\n        cachedHeightRef.current = contentRef.current.scrollHeight;\n      }\n    }, []);\n\n    // Set initial height before first paint (no animation on mount)\n    useLayoutEffect(() => {\n      if (panelRef.current) {\n        panelRef.current.style.height = isItemActive ? \"auto\" : \"0\";\n      }\n      // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, []);\n\n    // WAAPI animation — browser pre-computes full path, cancellable on rapid clicks\n    useLayoutEffect(() => {\n      const panel = panelRef.current;\n      const content = contentRef.current;\n      if (!panel || !content) return;\n\n      const wasActive = prevActiveRef.current;\n      prevActiveRef.current = isItemActive;\n      if (isItemActive === wasActive) return;\n\n      if (animRef.current) animRef.current.cancel();\n\n      const height = cachedHeightRef.current || content.scrollHeight;\n      cachedHeightRef.current = 0;\n\n      // Check for prefers-reduced-motion\n      const prefersReducedMotion = typeof window !== 'undefined' && window.matchMedia?.('(prefers-reduced-motion: reduce)').matches;\n      const duration = prefersReducedMotion ? 0 : 200;\n\n      const anim = panel.animate(\n        isItemActive\n          ? [{ height: \"0px\" }, { height: `${height}px` }]\n          : [{ height: `${height}px` }, { height: \"0px\" }],\n        { duration, easing: \"ease-out\", fill: \"forwards\" },\n      );\n\n      anim.onfinish = () => {\n        panel.style.height = isItemActive ? \"auto\" : \"0\";\n        anim.cancel();\n      };\n\n      animRef.current = anim;\n    }, [isItemActive]);\n\n    const renderExpandIcon = (isExpanded: boolean) => {\n      if (expandIcon === false) return null;\n\n      if (typeof expandIcon === \"function\") {\n        return expandIcon(isExpanded);\n      }\n\n      if (expandIcon) {\n        return (\n          <span\n            className={cn(\n              \"shrink-0 transition-transform duration-300\",\n              isExpanded && \"rotate-180\",\n            )}\n          >\n            {expandIcon}\n          </span>\n        );\n      }\n\n      return (\n        <ChevronDown\n          className={cn(\n            \"shrink-0 transition-transform duration-300\",\n            isExpanded && \"rotate-180\",\n            isSolidColored ? \"text-inherit\" : getIconColor(color, isExpanded),\n            iconSizes[size],\n          )}\n        />\n      );\n    };\n\n    return (\n      <div\n        data-slot=\"item\"\n        className={cn(\n          \"accordion_item\",\n          accordionItemVariants({ variant, color }),\n          item.disabled && \"opacity-50\",\n          classNames?.item,\n          itemClassName,\n        )}\n      >\n        <button\n          type=\"button\"\n          id={headerId}\n          aria-expanded={isItemActive}\n          aria-controls={panelId}\n          aria-disabled={item.disabled}\n          disabled={item.disabled}\n          onClick={() => onToggle(item.key, item.disabled)}\n          onPointerEnter={handlePointerEnter}\n          data-slot=\"trigger\"\n          className={cn(\n            \"accordion_trigger\",\n            accordionHeaderVariants({\n              size,\n              color,\n              disabled: item.disabled,\n            }),\n            classNames?.trigger,\n          )}\n        >\n          {expandIconPosition === \"left\" && renderExpandIcon(isItemActive)}\n\n          {item.icon && (\n            <span\n              data-slot=\"icon\"\n              className={cn(\n                \"accordion_icon\",\n                \"shrink-0\",\n                isSolidColored ? \"text-inherit\" : getIconColor(color, isItemActive),\n                classNames?.icon,\n              )}\n            >\n              {item.icon}\n            </span>\n          )}\n\n          <div className=\"flex-1 min-w-0\">\n            <div\n              className={cn(\n                !isSolidColored &&\n                  isItemActive &&\n                  color !== \"default\" &&\n                  \"text-slot\",\n              )}\n            >\n              {item.title}\n            </div>\n            {item.subtitle && (\n              <div className={cn(\n                \"font-normal mt-0.5\",\n                isSolidColored ? \"text-inherit opacity-80\" : \"text-text-secondary\",\n              )}>\n                {item.subtitle}\n              </div>\n            )}\n          </div>\n\n          {item.extra && (\n            <span className={cn(\n              \"shrink-0\",\n              isSolidColored ? \"text-inherit opacity-80\" : \"text-text-secondary\",\n            )}>\n              {item.extra}\n            </span>\n          )}\n\n          {expandIconPosition === \"right\" && renderExpandIcon(isItemActive)}\n        </button>\n\n        <div\n          ref={panelRef}\n          id={panelId}\n          role=\"region\"\n          aria-labelledby={headerId}\n          aria-hidden={!isItemActive}\n          className=\"overflow-hidden\"\n          style={{ contain: \"content\" }}\n        >\n          <div ref={contentRef}>\n            {(!destroyOnClose || isItemActive) && (\n              <div\n                data-slot=\"content\"\n                className={cn(\n                  \"accordion_content\",\n                  accordionContentVariants({ size }),\n                  isSolidColored && \"text-inherit opacity-90\",\n                  classNames?.content,\n                )}\n              >\n                {item.content}\n              </div>\n            )}\n          </div>\n        </div>\n      </div>\n    );\n  },\n);\n\nAccordionItemComponent.displayName = \"AccordionItem\";\n\nconst Accordion = React.memo<AccordionProps>(\n  ({\n    items,\n    color = \"default\",\n    size = \"md\",\n    variant = \"default\",\n    defaultActiveKey,\n    activeKey: controlledActiveKey,\n    onChange,\n    multiple = false,\n    expandIcon,\n    expandIconPosition = \"right\",\n    collapsible = true,\n    destroyOnClose = false,\n    showDivider = true,\n    className,\n    itemClassName,\n    classNames,\n    ref,\n  }) => {\n    const isSolidColored = variant === \"solid\" && color !== \"default\";\n    const baseId = useId();\n    const [internalActiveKey, setInternalActiveKey] = useState<\n      string | string[]\n    >(\n      defaultActiveKey\n        ? multiple && !Array.isArray(defaultActiveKey)\n          ? [defaultActiveKey]\n          : defaultActiveKey\n        : multiple\n          ? []\n          : \"\",\n    );\n\n    const activeKey =\n      controlledActiveKey !== undefined\n        ? controlledActiveKey\n        : internalActiveKey;\n\n    const isActive = useCallback((key: string) => {\n      if (Array.isArray(activeKey)) {\n        return activeKey.includes(key);\n      }\n      return activeKey === key;\n    }, [activeKey]);\n\n    const handleToggle = useCallback((key: string, disabled?: boolean) => {\n      if (disabled) return;\n\n      let newActiveKey: string | string[];\n\n      if (multiple) {\n        const currentKeys = Array.isArray(activeKey)\n          ? activeKey\n          : activeKey\n            ? [activeKey]\n            : [];\n        newActiveKey = currentKeys.includes(key)\n          ? currentKeys.filter((k) => k !== key)\n          : [...currentKeys, key];\n      } else {\n        if (!collapsible && activeKey === key) {\n          return;\n        }\n        newActiveKey = activeKey === key ? \"\" : key;\n      }\n\n      if (controlledActiveKey === undefined) {\n        setInternalActiveKey(newActiveKey);\n      }\n      onChange?.(newActiveKey);\n    }, [multiple, activeKey, collapsible, controlledActiveKey, onChange]);\n\n    return (\n      <div\n        ref={ref}\n        data-slot=\"root\"\n        className={cn(\n          \"accordion_root\",\n          accordionContainerVariants({\n            variant,\n            color,\n            showDivider: showDivider && variant !== \"splitted\",\n          }),\n          classNames?.root,\n          className,\n        )}\n      >\n        {items.map((item) => (\n          <AccordionItemComponent\n            key={item.key}\n            item={item}\n            isActive={isActive(item.key)}\n            baseId={baseId}\n            size={size as AccordionSize}\n            color={color}\n            variant={variant}\n            isSolidColored={isSolidColored}\n            expandIcon={expandIcon}\n            expandIconPosition={expandIconPosition}\n            destroyOnClose={destroyOnClose}\n            onToggle={handleToggle}\n            classNames={classNames}\n            itemClassName={itemClassName}\n          />\n        ))}\n      </div>\n    );\n  },\n);\n\nAccordion.displayName = \"Accordion\";\n\nexport type * from \"./types\";\nexport default Accordion;\n"]}

package/dist/{chunk-OFUPJH35.js → chunk-4TEZWGX7.js}

@@ -1,4 +1,4 @@
-import { cn } from './chunk-NGYLRX6F.js';
+import { cn } from './chunk-RAS6HUEI.js';
 import { useState, useRef, useCallback } from 'react';
 import { jsx, Fragment } from 'react/jsx-runtime';
 
@@ -70,5 +70,5 @@ var RippleContainer = ({ ripples, className, onAnimationEnd }) => {
 };
 
 export { RippleContainer, useRipple };
-//# sourceMappingURL=chunk-OFUPJH35.js.map
-//# sourceMappingURL=chunk-OFUPJH35.js.map
+//# sourceMappingURL=chunk-4TEZWGX7.js.map
+//# sourceMappingURL=chunk-4TEZWGX7.js.map

package/dist/{chunk-OFUPJH35.js.map → chunk-4TEZWGX7.js.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/hooks/useRipple.tsx"],"names":[],"mappings":"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","file":"chunk-OFUPJH35.js","sourcesContent":["import React, { useCallback, useRef, useState } from 'react'\n\nimport { cn } from '../utils'\n\ninterface RippleEntry {\n  key: number\n  x: number\n  y: number\n  size: number\n}\n\n/**\n * Lightweight ripple effect hook — GPU-composited (transform + opacity only).\n * Returns ripple state and handlers to attach to any interactive element.\n *\n * Animation uses only `transform: scale()` and `opacity` for 60fps performance.\n */\nexport function useRipple(enabled: boolean) {\n  const [ripples, setRipples] = useState<RippleEntry[]>([])\n  const counter = useRef(0)\n\n  const onPointerDown = useCallback(\n    (e: React.PointerEvent<HTMLElement>) => {\n      if (!enabled) return\n\n      const el = e.currentTarget\n      const rect = el.getBoundingClientRect()\n      const size = Math.max(rect.width, rect.height) * 2\n      const x = e.clientX - rect.left - size / 2\n      const y = e.clientY - rect.top - size / 2\n\n      const key = ++counter.current\n      setRipples((prev) => [...prev, { key, x, y, size }])\n    },\n    [enabled],\n  )\n\n  const onKeyDown = useCallback(\n    (e: React.KeyboardEvent<HTMLElement>) => {\n      if (!enabled) return\n      if (e.key !== 'Enter' && e.key !== ' ') return\n\n      const el = e.currentTarget\n      const rect = el.getBoundingClientRect()\n      const size = Math.max(rect.width, rect.height) * 2\n      // For keyboard events, center the ripple\n      const x = rect.width / 2 - size / 2\n      const y = rect.height / 2 - size / 2\n\n      const key = ++counter.current\n      setRipples((prev) => [...prev, { key, x, y, size }])\n    },\n    [enabled],\n  )\n\n  const onAnimationEnd = useCallback((key: number) => {\n    setRipples((prev) => prev.filter((r) => r.key !== key))\n  }, [])\n\n  return { ripples, onPointerDown, onKeyDown, onAnimationEnd } as const\n}\n\n// GPU-only animation (transform + opacity) — shared ripple span\nconst RippleSpan: React.FC<{\n  x: number\n  y: number\n  size: number\n  className?: string\n  onAnimationEnd: () => void\n}> = ({ x, y, size, className, onAnimationEnd }) => (\n  <span\n    className={cn(\n      'absolute rounded-full bg-current opacity-25 pointer-events-none animate-[ripple_600ms_ease-out_forwards]',\n      className,\n    )}\n    style={{\n      left: x,\n      top: y,\n      width: size,\n      height: size,\n    }}\n    onAnimationEnd={onAnimationEnd}\n    aria-hidden=\"true\"\n  />\n)\n\n/**\n * Renders all active ripple spans. Drop this inside any `relative overflow-hidden` element.\n */\nexport const RippleContainer: React.FC<{\n  ripples: RippleEntry[]\n  className?: string\n  onAnimationEnd: (key: number) => void\n}> = ({ ripples, className, onAnimationEnd }) => {\n  if (ripples.length === 0) return null\n  return (\n    <>\n      {ripples.map((r) => (\n        <RippleSpan\n          key={r.key}\n          x={r.x}\n          y={r.y}\n          size={r.size}\n          className={className}\n          onAnimationEnd={() => onAnimationEnd(r.key)}\n        />\n      ))}\n    </>\n  )\n}\n"]}
+{"version":3,"sources":["../src/hooks/useRipple.tsx"],"names":[],"mappings":"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","file":"chunk-4TEZWGX7.js","sourcesContent":["import React, { useCallback, useRef, useState } from 'react'\n\nimport { cn } from '../utils'\n\ninterface RippleEntry {\n  key: number\n  x: number\n  y: number\n  size: number\n}\n\n/**\n * Lightweight ripple effect hook — GPU-composited (transform + opacity only).\n * Returns ripple state and handlers to attach to any interactive element.\n *\n * Animation uses only `transform: scale()` and `opacity` for 60fps performance.\n */\nexport function useRipple(enabled: boolean) {\n  const [ripples, setRipples] = useState<RippleEntry[]>([])\n  const counter = useRef(0)\n\n  const onPointerDown = useCallback(\n    (e: React.PointerEvent<HTMLElement>) => {\n      if (!enabled) return\n\n      const el = e.currentTarget\n      const rect = el.getBoundingClientRect()\n      const size = Math.max(rect.width, rect.height) * 2\n      const x = e.clientX - rect.left - size / 2\n      const y = e.clientY - rect.top - size / 2\n\n      const key = ++counter.current\n      setRipples((prev) => [...prev, { key, x, y, size }])\n    },\n    [enabled],\n  )\n\n  const onKeyDown = useCallback(\n    (e: React.KeyboardEvent<HTMLElement>) => {\n      if (!enabled) return\n      if (e.key !== 'Enter' && e.key !== ' ') return\n\n      const el = e.currentTarget\n      const rect = el.getBoundingClientRect()\n      const size = Math.max(rect.width, rect.height) * 2\n      // For keyboard events, center the ripple\n      const x = rect.width / 2 - size / 2\n      const y = rect.height / 2 - size / 2\n\n      const key = ++counter.current\n      setRipples((prev) => [...prev, { key, x, y, size }])\n    },\n    [enabled],\n  )\n\n  const onAnimationEnd = useCallback((key: number) => {\n    setRipples((prev) => prev.filter((r) => r.key !== key))\n  }, [])\n\n  return { ripples, onPointerDown, onKeyDown, onAnimationEnd } as const\n}\n\n// GPU-only animation (transform + opacity) — shared ripple span\nconst RippleSpan: React.FC<{\n  x: number\n  y: number\n  size: number\n  className?: string\n  onAnimationEnd: () => void\n}> = ({ x, y, size, className, onAnimationEnd }) => (\n  <span\n    className={cn(\n      'absolute rounded-full bg-current opacity-25 pointer-events-none animate-[ripple_600ms_ease-out_forwards]',\n      className,\n    )}\n    style={{\n      left: x,\n      top: y,\n      width: size,\n      height: size,\n    }}\n    onAnimationEnd={onAnimationEnd}\n    aria-hidden=\"true\"\n  />\n)\n\n/**\n * Renders all active ripple spans. Drop this inside any `relative overflow-hidden` element.\n */\nexport const RippleContainer: React.FC<{\n  ripples: RippleEntry[]\n  className?: string\n  onAnimationEnd: (key: number) => void\n}> = ({ ripples, className, onAnimationEnd }) => {\n  if (ripples.length === 0) return null\n  return (\n    <>\n      {ripples.map((r) => (\n        <RippleSpan\n          key={r.key}\n          x={r.x}\n          y={r.y}\n          size={r.size}\n          className={className}\n          onAnimationEnd={() => onAnimationEnd(r.key)}\n        />\n      ))}\n    </>\n  )\n}\n"]}