@mdigital_ui/ui 0.2.5 → 0.2.7

package/dist/chunk-CK6A2R66.js

@@ -0,0 +1,336 @@
+import { focusRingColorClasses, textColorClasses } from './chunk-NTPWR57C.js';
+import { cn, iconSizes } from './chunk-NGYLRX6F.js';
+import { cva } from 'class-variance-authority';
+import { ChevronDown } from 'lucide-react';
+import React, { useId, useState } from 'react';
+import { jsx, jsxs } 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 divide-border border border-border rounded-lg overflow-hidden",
+      splitted: "space-y-2"
+    },
+    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" }
+  ],
+  defaultVariants: {
+    variant: "default",
+    showDivider: true
+  }
+});
+var accordionItemVariants = cva("transition-colors", {
+  variants: {
+    variant: {
+      default: "bg-transparent hover:bg-surface/50",
+      solid: "bg-surface",
+      soft: "",
+      bordered: "bg-transparent",
+      splitted: "border border-border rounded-lg overflow-hidden"
+    },
+    color: {
+      default: "",
+      primary: "",
+      secondary: "",
+      accent: "",
+      success: "",
+      error: "",
+      warning: "",
+      info: ""
+    }
+  },
+  compoundVariants: [
+    // Soft variant with colors
+    { variant: "soft", color: "default", class: "bg-surface/50" },
+    {
+      variant: "soft",
+      color: "primary",
+      class: "bg-primary/5 hover:bg-primary/10"
+    },
+    {
+      variant: "soft",
+      color: "secondary",
+      class: "bg-secondary/5 hover:bg-secondary/10"
+    },
+    {
+      variant: "soft",
+      color: "accent",
+      class: "bg-accent/5 hover:bg-accent/10"
+    },
+    {
+      variant: "soft",
+      color: "success",
+      class: "bg-success/5 hover:bg-success/10"
+    },
+    { variant: "soft", color: "error", class: "bg-error/5 hover:bg-error/10" },
+    {
+      variant: "soft",
+      color: "warning",
+      class: "bg-warning/5 hover:bg-warning/10"
+    },
+    { variant: "soft", color: "info", class: "bg-info/5 hover:bg-info/10" },
+    // Splitted variant with colors
+    { variant: "splitted", color: "primary", class: "border-primary/30" },
+    { variant: "splitted", color: "secondary", class: "border-secondary/30" },
+    { variant: "splitted", color: "accent", class: "border-accent/30" },
+    { variant: "splitted", color: "success", class: "border-success/30" },
+    { variant: "splitted", color: "error", class: "border-error/30" },
+    { variant: "splitted", color: "warning", class: "border-warning/30" },
+    { variant: "splitted", color: "info", class: "border-info/30" }
+  ],
+  defaultVariants: {
+    variant: "default",
+    color: "default"
+  }
+});
+var accordionHeaderVariants = cva(
+  [
+    "flex items-center w-full text-left font-medium transition-all",
+    "focus:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-offset-background",
+    "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: focusRingColorClasses,
+      disabled: {
+        true: "cursor-not-allowed",
+        false: "cursor-pointer"
+      }
+    },
+    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 textColorClasses[color || "default"];
+};
+var Accordion = React.memo(
+  ({
+    items,
+    color = "default",
+    size = "md",
+    variant = "default",
+    defaultActiveKey,
+    activeKey: controlledActiveKey,
+    onChange,
+    multiple = false,
+    expandIcon,
+    expandIconPosition = "right",
+    collapsible = false,
+    destroyOnClose = false,
+    showDivider = true,
+    className,
+    itemClassName,
+    classNames,
+    ref
+  }) => {
+    const baseId = useId();
+    const [internalActiveKey, setInternalActiveKey] = useState(defaultActiveKey || (multiple ? [] : ""));
+    const activeKey = controlledActiveKey !== void 0 ? controlledActiveKey : internalActiveKey;
+    const isActive = (key) => {
+      if (Array.isArray(activeKey)) {
+        return activeKey.includes(key);
+      }
+      return activeKey === key;
+    };
+    const handleToggle = (key, disabled) => {
+      if (disabled) return;
+      let newActiveKey;
+      if (multiple) {
+        const currentKeys = Array.isArray(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);
+    };
+    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",
+            getIconColor(color, isExpanded),
+            iconSizes[size]
+          )
+        }
+      );
+    };
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref,
+        "data-slot": "root",
+        className: cn(
+          "accordion_root",
+          accordionContainerVariants({
+            variant,
+            showDivider: showDivider && variant !== "splitted"
+          }),
+          classNames?.root,
+          className
+        ),
+        children: items.map((item) => {
+          const isItemActive = isActive(item.key);
+          const headerId = `${baseId}-header-${item.key}`;
+          const panelId = `${baseId}-panel-${item.key}`;
+          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: () => handleToggle(item.key, item.disabled),
+                    "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",
+                            getIconColor(color, isItemActive),
+                            classNames?.icon
+                          ),
+                          children: item.icon
+                        }
+                      ),
+                      /* @__PURE__ */ jsxs("div", { className: "flex-1 min-w-0", children: [
+                        /* @__PURE__ */ jsx(
+                          "div",
+                          {
+                            className: cn(
+                              isItemActive && color !== "default" && textColorClasses[color || "default"]
+                            ),
+                            children: item.title
+                          }
+                        ),
+                        item.subtitle && /* @__PURE__ */ jsx("div", { className: "text-text-secondary font-normal mt-0.5", children: item.subtitle })
+                      ] }),
+                      item.extra && /* @__PURE__ */ jsx("span", { className: "shrink-0 text-text-secondary", children: item.extra }),
+                      expandIconPosition === "right" && renderExpandIcon(isItemActive)
+                    ]
+                  }
+                ),
+                /* @__PURE__ */ jsx(
+                  "div",
+                  {
+                    id: panelId,
+                    role: "region",
+                    "aria-labelledby": headerId,
+                    className: cn(
+                      "grid transition-[grid-template-rows] duration-300 ease-out",
+                      isItemActive ? "grid-rows-[1fr]" : "grid-rows-[0fr]"
+                    ),
+                    children: /* @__PURE__ */ jsx("div", { className: "overflow-hidden", children: (!destroyOnClose || isItemActive) && /* @__PURE__ */ jsx(
+                      "div",
+                      {
+                        "data-slot": "content",
+                        className: cn(
+                          "accordion_content",
+                          accordionContentVariants({ size }),
+                          classNames?.content
+                        ),
+                        children: item.content
+                      }
+                    ) })
+                  }
+                )
+              ]
+            },
+            item.key
+          );
+        })
+      }
+    );
+  }
+);
+Accordion.displayName = "Accordion";
+var accordion_default = Accordion;
+
+export { accordion_default };
+//# sourceMappingURL=chunk-CK6A2R66.js.map
+//# sourceMappingURL=chunk-CK6A2R66.js.map

package/dist/chunk-CK6A2R66.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/accordion/index.tsx"],"names":[],"mappings":"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","file":"chunk-CK6A2R66.js","sourcesContent":["'use client'\n\nimport { cva } from \"class-variance-authority\";\nimport { ChevronDown } from \"lucide-react\";\nimport React, { useId, useState } from \"react\";\n\nimport { cn, iconSizes } from \"../utils\";\nimport { focusRingColorClasses, textColorClasses } from \"../variants\";\nimport type { AccordionProps, AccordionSize } from \"./types\";\n\n// Variant styles for accordion container\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:\n        \"space-y-0 divide-y divide-border border border-border rounded-lg overflow-hidden\",\n      splitted: \"space-y-2\",\n    },\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  ],\n  defaultVariants: {\n    variant: \"default\",\n    showDivider: true,\n  },\n});\n\n// Variant styles for each accordion item\nconst accordionItemVariants = cva(\"transition-colors\", {\n  variants: {\n    variant: {\n      default: \"bg-transparent hover:bg-surface/50\",\n      solid: \"bg-surface\",\n      soft: \"\",\n      bordered: \"bg-transparent\",\n      splitted: \"border border-border rounded-lg overflow-hidden\",\n    },\n    color: {\n      default: \"\",\n      primary: \"\",\n      secondary: \"\",\n      accent: \"\",\n      success: \"\",\n      error: \"\",\n      warning: \"\",\n      info: \"\",\n    },\n  },\n  compoundVariants: [\n    // Soft variant with colors\n    { variant: \"soft\", color: \"default\", class: \"bg-surface/50\" },\n    {\n      variant: \"soft\",\n      color: \"primary\",\n      class: \"bg-primary/5 hover:bg-primary/10\",\n    },\n    {\n      variant: \"soft\",\n      color: \"secondary\",\n      class: \"bg-secondary/5 hover:bg-secondary/10\",\n    },\n    {\n      variant: \"soft\",\n      color: \"accent\",\n      class: \"bg-accent/5 hover:bg-accent/10\",\n    },\n    {\n      variant: \"soft\",\n      color: \"success\",\n      class: \"bg-success/5 hover:bg-success/10\",\n    },\n    { variant: \"soft\", color: \"error\", class: \"bg-error/5 hover:bg-error/10\" },\n    {\n      variant: \"soft\",\n      color: \"warning\",\n      class: \"bg-warning/5 hover:bg-warning/10\",\n    },\n    { variant: \"soft\", color: \"info\", class: \"bg-info/5 hover:bg-info/10\" },\n    // Splitted variant with colors\n    { variant: \"splitted\", color: \"primary\", class: \"border-primary/30\" },\n    { variant: \"splitted\", color: \"secondary\", class: \"border-secondary/30\" },\n    { variant: \"splitted\", color: \"accent\", class: \"border-accent/30\" },\n    { variant: \"splitted\", color: \"success\", class: \"border-success/30\" },\n    { variant: \"splitted\", color: \"error\", class: \"border-error/30\" },\n    { variant: \"splitted\", color: \"warning\", class: \"border-warning/30\" },\n    { variant: \"splitted\", color: \"info\", class: \"border-info/30\" },\n  ],\n  defaultVariants: {\n    variant: \"default\",\n    color: \"default\",\n  },\n});\n\n// Header button variants\nconst accordionHeaderVariants = cva(\n  [\n    \"flex items-center w-full text-left font-medium transition-all\",\n    \"focus:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-offset-background\",\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: focusRingColorClasses,\n      disabled: {\n        true: \"cursor-not-allowed\",\n        false: \"cursor-pointer\",\n      },\n    },\n    defaultVariants: {\n      size: \"md\",\n      color: \"default\",\n      disabled: false,\n    },\n  },\n);\n\n// Content variants\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\n// Icon color based on color prop\nconst getIconColor = (color: AccordionProps[\"color\"], isExpanded: boolean) => {\n  if (!isExpanded) return \"text-text-secondary\";\n  return textColorClasses[color || \"default\"];\n};\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 = false,\n    destroyOnClose = false,\n    showDivider = true,\n    className,\n    itemClassName,\n    classNames,\n    ref,\n  }) => {\n    const baseId = useId();\n    const [internalActiveKey, setInternalActiveKey] = useState<\n      string | string[]\n    >(defaultActiveKey || (multiple ? [] : \"\"));\n\n    const activeKey =\n      controlledActiveKey !== undefined\n        ? controlledActiveKey\n        : internalActiveKey;\n\n    const isActive = (key: string) => {\n      if (Array.isArray(activeKey)) {\n        return activeKey.includes(key);\n      }\n      return activeKey === key;\n    };\n\n    const handleToggle = (key: string, disabled?: boolean) => {\n      if (disabled) return;\n\n      let newActiveKey: string | string[];\n\n      if (multiple) {\n        const currentKeys = Array.isArray(activeKey) ? activeKey : [];\n        newActiveKey = currentKeys.includes(key)\n          ? currentKeys.filter((k) => k !== key)\n          : [...currentKeys, key];\n      } else {\n        // Handle collapsible: prevent closing if it's the only open panel\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    };\n\n    // Render expand icon\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            getIconColor(color, isExpanded),\n            iconSizes[size as AccordionSize],\n          )}\n        />\n      );\n    };\n\n    return (\n      <div\n        ref={ref}\n        data-slot=\"root\"\n        className={cn(\n          \"accordion_root\",\n          accordionContainerVariants({\n            variant,\n            showDivider: showDivider && variant !== \"splitted\",\n          }),\n          classNames?.root,\n          className,\n        )}\n      >\n        {items.map((item) => {\n          const isItemActive = isActive(item.key);\n          const headerId = `${baseId}-header-${item.key}`;\n          const panelId = `${baseId}-panel-${item.key}`;\n\n          return (\n            <div\n              key={item.key}\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={() => handleToggle(item.key, item.disabled)}\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                {/* Left expand icon */}\n                {expandIconPosition === \"left\" &&\n                  renderExpandIcon(isItemActive)}\n\n                {/* Item icon */}\n                {item.icon && (\n                  <span\n                    data-slot=\"icon\"\n                    className={cn(\n                      \"accordion_icon\",\n                      \"shrink-0\",\n                      getIconColor(color, isItemActive),\n                      classNames?.icon,\n                    )}\n                  >\n                    {item.icon}\n                  </span>\n                )}\n\n                {/* Title and subtitle */}\n                <div className=\"flex-1 min-w-0\">\n                  <div\n                    className={cn(\n                      isItemActive &&\n                        color !== \"default\" &&\n                        textColorClasses[color || \"default\"],\n                    )}\n                  >\n                    {item.title}\n                  </div>\n                  {item.subtitle && (\n                    <div className=\"text-text-secondary font-normal mt-0.5\">\n                      {item.subtitle}\n                    </div>\n                  )}\n                </div>\n\n                {/* Extra content */}\n                {item.extra && (\n                  <span className=\"shrink-0 text-text-secondary\">\n                    {item.extra}\n                  </span>\n                )}\n\n                {/* Right expand icon */}\n                {expandIconPosition === \"right\" &&\n                  renderExpandIcon(isItemActive)}\n              </button>\n\n              {/* Content panel */}\n              <div\n                id={panelId}\n                role=\"region\"\n                aria-labelledby={headerId}\n                className={cn(\n                  \"grid transition-[grid-template-rows] duration-300 ease-out\",\n                  isItemActive ? \"grid-rows-[1fr]\" : \"grid-rows-[0fr]\",\n                )}\n              >\n                <div className=\"overflow-hidden\">\n                  {(!destroyOnClose || isItemActive) && (\n                    <div\n                      data-slot=\"content\"\n                      className={cn(\n                        \"accordion_content\",\n                        accordionContentVariants({ size }),\n                        classNames?.content,\n                      )}\n                    >\n                      {item.content}\n                    </div>\n                  )}\n                </div>\n              </div>\n            </div>\n          );\n        })}\n      </div>\n    );\n  },\n);\n\nAccordion.displayName = \"Accordion\";\n\nexport type * from \"./types\";\nexport default Accordion;\n"]}