@unifiedsoftware/react-ui 1.0.8-beta → 1.0.10

package/dist/index.mjs

@@ -0,0 +1,1132 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+
+// src/components/Badge/Badge.tsx
+import clsx from "clsx";
+
+// src/constants/index.ts
+var PREFIX_CLS = "us-";
+
+// src/components/Badge/Badge.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+var Badge = ({ children, placement, content }) => {
+  return /* @__PURE__ */ jsxs("div", { className: clsx(`${PREFIX_CLS}badge-wrapper`), children: [
+    children,
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: clsx(`${PREFIX_CLS}badge`, {
+          [`${PREFIX_CLS}badge--${placement}`]: placement
+        }),
+        children: content
+      }
+    )
+  ] });
+};
+var Badge_default = Badge;
+
+// src/components/Button/Button.tsx
+import clsx3 from "clsx";
+import { forwardRef as forwardRef5 } from "react";
+
+// src/icons/ChevronDownIcon.tsx
+import { forwardRef } from "react";
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+var ChevronDownIcon = forwardRef((props, ref) => {
+  return /* @__PURE__ */ jsxs2(
+    "svg",
+    __spreadProps(__spreadValues({
+      ref,
+      stroke: "currentColor",
+      fill: "currentColor",
+      "stroke-width": "0",
+      viewBox: "0 0 24 24",
+      height: "1em",
+      width: "1em",
+      xmlns: "http://www.w3.org/2000/svg"
+    }, props), {
+      children: [
+        /* @__PURE__ */ jsx2("path", { fill: "none", d: "M0 0h24v24H0V0z" }),
+        /* @__PURE__ */ jsx2("path", { d: "M7.41 8.59L12 13.17l4.59-4.58L18 10l-6 6-6-6 1.41-1.41z" })
+      ]
+    })
+  );
+});
+var ChevronDownIcon_default = ChevronDownIcon;
+
+// src/icons/ChevronUpIcon.tsx
+import { forwardRef as forwardRef2 } from "react";
+import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
+var ChevronUpIcon = forwardRef2((props, ref) => {
+  return /* @__PURE__ */ jsxs3(
+    "svg",
+    __spreadProps(__spreadValues({
+      ref,
+      stroke: "currentColor",
+      fill: "currentColor",
+      "stroke-width": "0",
+      viewBox: "0 0 24 24",
+      height: "1em",
+      width: "1em",
+      xmlns: "http://www.w3.org/2000/svg"
+    }, props), {
+      children: [
+        /* @__PURE__ */ jsx3("path", { fill: "none", d: "M0 0h24v24H0z" }),
+        /* @__PURE__ */ jsx3("path", { d: "M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z" })
+      ]
+    })
+  );
+});
+var ChevronUpIcon_default = ChevronUpIcon;
+
+// src/icons/LoaderIcon.tsx
+import { forwardRef as forwardRef3 } from "react";
+import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
+var LoaderIcon = forwardRef3((props, ref) => {
+  return /* @__PURE__ */ jsxs4(
+    "svg",
+    __spreadProps(__spreadValues({
+      ref,
+      stroke: "currentColor",
+      fill: "none",
+      "stroke-width": "2",
+      viewBox: "0 0 24 24",
+      "stroke-linecap": "round",
+      "stroke-linejoin": "round",
+      height: "1em",
+      width: "1em",
+      xmlns: "http://www.w3.org/2000/svg"
+    }, props), {
+      children: [
+        /* @__PURE__ */ jsx4("path", { stroke: "none", d: "M0 0h24v24H0z", fill: "none" }),
+        /* @__PURE__ */ jsx4("path", { d: "M12 3a9 9 0 1 0 9 9" })
+      ]
+    })
+  );
+});
+var LoaderIcon_default = LoaderIcon;
+
+// src/components/Icon/Icon.tsx
+import clsx2 from "clsx";
+import { Children, cloneElement, forwardRef as forwardRef4 } from "react";
+var Icon = forwardRef4(({ children, size }, ref) => {
+  const child = Children.only(children);
+  return cloneElement(child, __spreadProps(__spreadValues({
+    ref
+  }, child.props), {
+    className: clsx2(`${PREFIX_CLS}icon`, { [`${PREFIX_CLS}font-size-${size}`]: size }, child.props.className)
+  }));
+});
+var Icon_default = Icon;
+
+// src/components/Button/Button.tsx
+import { jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
+var Button = forwardRef5(
+  (_a, ref) => {
+    var _b = _a, {
+      as: Component = "button",
+      children,
+      className,
+      role = "presentation",
+      variant = "text",
+      color = "primary",
+      size = "md",
+      iconOnly,
+      startContent,
+      endContent,
+      loading,
+      disabled
+    } = _b, rest = __objRest(_b, [
+      "as",
+      "children",
+      "className",
+      "role",
+      "variant",
+      "color",
+      "size",
+      "iconOnly",
+      "startContent",
+      "endContent",
+      "loading",
+      "disabled"
+    ]);
+    return /* @__PURE__ */ jsxs5(
+      Component,
+      __spreadProps(__spreadValues({
+        ref,
+        className: clsx3(
+          `${PREFIX_CLS}button`,
+          {
+            [`${PREFIX_CLS}button--${variant}`]: variant,
+            [`${PREFIX_CLS}button--${color}`]: color,
+            [`${PREFIX_CLS}button--${size}`]: size,
+            [`${PREFIX_CLS}button--icon-only`]: iconOnly,
+            [`${PREFIX_CLS}button--disabled`]: disabled
+          },
+          className
+        ),
+        role,
+        disabled
+      }, rest), {
+        children: [
+          /* @__PURE__ */ jsx5("div", { className: `${PREFIX_CLS}overlay` }),
+          /* @__PURE__ */ jsx5("div", { className: `${PREFIX_CLS}outline` }),
+          loading ? /* @__PURE__ */ jsx5(Icon_default, { children: /* @__PURE__ */ jsx5(LoaderIcon_default, { className: `${PREFIX_CLS}animation-spin` }) }) : startContent,
+          /* @__PURE__ */ jsx5("div", { className: `${PREFIX_CLS}button__content`, children }),
+          endContent
+        ]
+      })
+    );
+  }
+);
+
+// src/components/Chip/Chip.tsx
+import clsx4 from "clsx";
+import { forwardRef as forwardRef6 } from "react";
+import { jsx as jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
+var Chip = forwardRef6(
+  (_a, ref) => {
+    var _b = _a, { as: Component = "div", children, className, variant, color, size } = _b, rest = __objRest(_b, ["as", "children", "className", "variant", "color", "size"]);
+    return /* @__PURE__ */ jsxs6(
+      Component,
+      __spreadProps(__spreadValues({
+        ref,
+        className: clsx4(
+          `${PREFIX_CLS}chip`,
+          {
+            [`${PREFIX_CLS}chip--${variant}`]: variant,
+            [`${PREFIX_CLS}chip--${color}`]: color,
+            [`${PREFIX_CLS}chip--${size}`]: size
+          },
+          className
+        )
+      }, rest), {
+        children: [
+          /* @__PURE__ */ jsx6("div", { className: clsx4(`${PREFIX_CLS}overlay`) }),
+          /* @__PURE__ */ jsx6("div", { className: `${PREFIX_CLS}outline` }),
+          children
+        ]
+      })
+    );
+  }
+);
+var Chip_default = Chip;
+
+// src/components/Collapse/Collapse.tsx
+import { Children as Children2, useEffect, useRef, useState } from "react";
+
+// src/components/Collapse/CollapseContext.tsx
+import { createContext, useContext } from "react";
+var CollapseContext = createContext(null);
+var useCollapse = () => {
+  const context = useContext(CollapseContext);
+  if (!context) {
+    throw new Error("`useCollapse` must be used within a `<Collapse />`");
+  }
+  return context;
+};
+var CollapseContext_default = CollapseContext;
+
+// src/components/Collapse/Collapse.tsx
+import { jsxs as jsxs7 } from "react/jsx-runtime";
+var Collapse = ({ children, isOpen, onOpen, onClose, onToggle }) => {
+  const collapseRef = useRef(null);
+  const [selfIsOpen, setSelfIsOpen] = useState(isOpen != null ? isOpen : false);
+  const [heightAuto, setHeightAuto] = useState(false);
+  const [trigger, content] = Children2.toArray(children);
+  const handleOpen = () => {
+    setSelfIsOpen(true);
+    onOpen == null ? void 0 : onOpen();
+  };
+  const handleClose = () => {
+    setSelfIsOpen(false);
+    onClose == null ? void 0 : onClose();
+  };
+  const handleToggle = () => {
+    setSelfIsOpen((prevState) => !prevState);
+    onToggle == null ? void 0 : onToggle();
+  };
+  useEffect(() => {
+    if (isOpen !== void 0) {
+      setSelfIsOpen(isOpen);
+    }
+    setTimeout(() => {
+      if (isOpen) {
+        setHeightAuto(true);
+      } else {
+        setHeightAuto(false);
+      }
+    }, 100);
+  }, [isOpen]);
+  return /* @__PURE__ */ jsxs7(
+    CollapseContext_default.Provider,
+    {
+      value: {
+        collapseRef,
+        isOpen: selfIsOpen,
+        heightAuto,
+        onOpen: handleOpen,
+        onClose: handleClose,
+        onToggle: handleToggle
+      },
+      children: [
+        trigger,
+        content
+      ]
+    }
+  );
+};
+var Collapse_default = Collapse;
+
+// src/components/Collapse/CollapseContent.tsx
+import clsx5 from "clsx";
+import { Children as Children3, cloneElement as cloneElement2, forwardRef as forwardRef7 } from "react";
+var CollapseContent = forwardRef7(({ children }, ref) => {
+  var _a, _b;
+  const { collapseRef, isOpen, heightAuto } = useCollapse();
+  const child = Children3.only(children);
+  return cloneElement2(child, __spreadProps(__spreadValues({}, child.props), {
+    ref: (node) => {
+      collapseRef.current = node;
+      if (ref !== null) {
+        ref.current = node;
+      }
+    },
+    style: __spreadProps(__spreadValues({}, child.props.style), {
+      height: isOpen && heightAuto ? "auto" : isOpen ? (_a = collapseRef.current) == null ? void 0 : _a.scrollHeight : !isOpen && heightAuto ? (_b = collapseRef.current) == null ? void 0 : _b.scrollHeight : 0
+    }),
+    className: clsx5(`${PREFIX_CLS}collapse`, child.props.className)
+  }));
+});
+var CollapseContent_default = CollapseContent;
+
+// src/components/Collapse/CollapseTrigger.tsx
+import { Children as Children4, cloneElement as cloneElement3, forwardRef as forwardRef8 } from "react";
+var CollapseTrigger = forwardRef8(({ children }, ref) => {
+  const { collapseRef, onToggle } = useCollapse();
+  const child = Children4.only(children);
+  return cloneElement3(child, __spreadValues({
+    ref,
+    onClick: (event) => {
+      var _a, _b;
+      if (!collapseRef.current) {
+        return;
+      }
+      onToggle();
+      (_b = (_a = child.props).onClick) == null ? void 0 : _b.call(_a, event);
+    }
+  }, child.props));
+});
+var CollapseTrigger_default = CollapseTrigger;
+
+// src/components/Menu/Menu.tsx
+import clsx9 from "clsx";
+import { useEffect as useEffect3, useMemo as useMemo3, useState as useState2 } from "react";
+
+// src/components/Menu/MenuContext.tsx
+import { createContext as createContext2, useContext as useContext2 } from "react";
+var MenuContext = createContext2(null);
+var useMenu = () => {
+  const context = useContext2(MenuContext);
+  if (!context) {
+    throw new Error("`useMenu` must be used within a `<Menu />`");
+  }
+  return context;
+};
+var MenuContext_default = MenuContext;
+
+// src/components/Menu/MenuGroup.tsx
+import clsx8 from "clsx";
+import { useMemo as useMemo2 } from "react";
+
+// src/components/Menu/MenuItem.tsx
+import clsx6 from "clsx";
+import { forwardRef as forwardRef9, useContext as useContext4, useEffect as useEffect2 } from "react";
+
+// src/components/Menu/MenuValueContext.tsx
+import { createContext as createContext3, useContext as useContext3 } from "react";
+var MenuValueContext = createContext3([]);
+var useMenuItemValue = () => {
+  const context = useContext3(MenuValueContext);
+  if (!context) {
+    throw new Error("`useMenuValue` must be used within a `<MenuValueContext.Provider />`");
+  }
+  return context;
+};
+var MenuValueContext_default = MenuValueContext;
+
+// src/components/Menu/MenuItem.tsx
+import { jsx as jsx7, jsxs as jsxs8 } from "react/jsx-runtime";
+var MenuItem = forwardRef9((props, ref) => {
+  const _a = props, { as: Component = "div", className, style, value, title, icon, level = 1, disabled, onClick } = _a, rest = __objRest(_a, ["as", "className", "style", "value", "title", "icon", "level", "disabled", "onClick"]);
+  const { value: menuValue, originalValue, navMode, onChange, onOpen, onItemSelect } = useMenu();
+  const values = useContext4(MenuValueContext_default);
+  const mergedValues = [...values, value];
+  const handleClick = (event) => {
+    if (value !== void 0) {
+      onChange(mergedValues);
+    }
+    onClick == null ? void 0 : onClick(event);
+    onItemSelect == null ? void 0 : onItemSelect(props);
+  };
+  useEffect2(() => {
+    if (navMode === "automatic" && originalValue.length > 0 && originalValue[originalValue.length - 1] === value) {
+      onOpen(values);
+      onChange(mergedValues);
+    }
+  }, [value, originalValue, navMode]);
+  return /* @__PURE__ */ jsxs8(
+    Component,
+    __spreadProps(__spreadValues({
+      ref,
+      className: clsx6(
+        `${PREFIX_CLS}menu-item`,
+        {
+          [`${PREFIX_CLS}menu-item--selected`]: menuValue.includes(value),
+          [`${PREFIX_CLS}menu-item--disabled`]: disabled
+        },
+        className
+      ),
+      style: __spreadValues({
+        paddingLeft: level <= 1 ? `var(--${PREFIX_CLS}menu-item-padding-x)` : `calc(${level} * var(--${PREFIX_CLS}menu-item-padding-level))`
+      }, style),
+      onClick: handleClick
+    }, rest), {
+      children: [
+        /* @__PURE__ */ jsx7("div", { className: `${PREFIX_CLS}overlay`, children: /* @__PURE__ */ jsx7("div", { className: `${PREFIX_CLS}overlay__surface` }) }),
+        icon && /* @__PURE__ */ jsx7("div", { className: `${PREFIX_CLS}menu-item__icon`, children: icon }),
+        /* @__PURE__ */ jsx7("div", { className: `${PREFIX_CLS}menu-item__content`, children: /* @__PURE__ */ jsx7("span", { className: `${PREFIX_CLS}menu-item__title`, children: title }) })
+      ]
+    })
+  );
+});
+MenuItem.displayName = "MenuItem";
+var MenuItem_default = MenuItem;
+
+// src/components/Menu/MenuSubmenu.tsx
+import clsx7 from "clsx";
+import { useContext as useContext5, useMemo } from "react";
+
+// src/components/Menu/utils.ts
+var getOpenValuesByPathname = (pathname) => {
+  return pathname.split("/").reduce((previousValue, currentValue) => {
+    const previousPath = previousValue[previousValue.length - 1];
+    if (previousPath != void 0) {
+      previousValue.push(previousPath + "/" + currentValue);
+    } else {
+      previousValue.push("");
+    }
+    return previousValue;
+  }, []);
+};
+var addOrRemoveValueInArray = (array, value) => {
+  const index = array.indexOf(value);
+  const newArray = [...array];
+  if (index === -1) {
+    newArray.push(value);
+  } else {
+    newArray.splice(index, 1);
+  }
+  return newArray;
+};
+
+// src/components/Menu/MenuSubmenu.tsx
+import { jsx as jsx8, jsxs as jsxs9 } from "react/jsx-runtime";
+var MenuSubmenu = (_a) => {
+  var _b = _a, {
+    children,
+    className,
+    style,
+    value,
+    title,
+    icon,
+    level = 1,
+    items,
+    onClick
+  } = _b, rest = __objRest(_b, [
+    "children",
+    "className",
+    "style",
+    "value",
+    "title",
+    "icon",
+    "level",
+    "items",
+    "onClick"
+  ]);
+  const { value: menuValue, openValues, expandMode, onOpen } = useMenu();
+  const values = useContext5(MenuValueContext_default);
+  const isOpen = openValues.includes(value);
+  const mergedValues = [...values, value];
+  const content = useMemo(() => {
+    return items == null ? void 0 : items.map((_a2, index) => {
+      var _b2 = _a2, { type } = _b2, item = __objRest(_b2, ["type"]);
+      return type === "item" ? /* @__PURE__ */ jsx8(MenuItem_default, __spreadValues({ level: level !== void 0 ? level + 1 : void 0 }, item), index) : type === "submenu" ? /* @__PURE__ */ jsx8(MenuSubmenu, __spreadValues({ level: level !== void 0 ? level + 1 : void 0 }, item), index) : type === "group" ? /* @__PURE__ */ jsx8(MenuGroup_default, __spreadValues({ level: level !== void 0 ? level + 1 : void 0 }, item), index) : /* @__PURE__ */ jsx8(MenuItem_default, __spreadValues({ level: level !== void 0 ? level + 1 : void 0 }, item), index);
+    });
+  }, [items]);
+  const handleClick = (event) => {
+    if (expandMode === "multiple") {
+      const updatedOpenValues = addOrRemoveValueInArray(openValues, value);
+      onOpen(updatedOpenValues);
+    } else {
+      if (isOpen) {
+        const updatedOpenValues = addOrRemoveValueInArray(mergedValues, value);
+        onOpen(updatedOpenValues);
+      } else {
+        const updatedOpenValues = addOrRemoveValueInArray(values, value);
+        onOpen(updatedOpenValues);
+      }
+    }
+    onClick == null ? void 0 : onClick(event);
+  };
+  return /* @__PURE__ */ jsx8(MenuValueContext_default.Provider, { value: mergedValues, children: /* @__PURE__ */ jsx8("div", { className: clsx7(`${PREFIX_CLS}menu-submenu`), children: /* @__PURE__ */ jsxs9(Collapse_default, { isOpen, children: [
+    /* @__PURE__ */ jsx8(CollapseTrigger_default, { children: /* @__PURE__ */ jsxs9(
+      "div",
+      __spreadProps(__spreadValues({
+        className: clsx7(
+          `${PREFIX_CLS}menu-item`,
+          {
+            [`${PREFIX_CLS}menu-item--selected`]: menuValue.includes(value) || items && mergedValues.includes(menuValue)
+          },
+          className
+        ),
+        style: __spreadValues({
+          paddingLeft: level <= 1 ? `var(--${PREFIX_CLS}menu-item-padding-x)` : `calc(${level} * var(--${PREFIX_CLS}menu-item-padding-level))`
+        }, style),
+        onClick: handleClick
+      }, rest), {
+        children: [
+          /* @__PURE__ */ jsx8("div", { className: `${PREFIX_CLS}overlay`, children: /* @__PURE__ */ jsx8("div", { className: `${PREFIX_CLS}overlay__surface` }) }),
+          icon && /* @__PURE__ */ jsx8("div", { className: `${PREFIX_CLS}menu-item__icon`, children: icon }),
+          /* @__PURE__ */ jsx8("div", { className: `${PREFIX_CLS}menu-item__content`, children: /* @__PURE__ */ jsx8("span", { className: `${PREFIX_CLS}menu-item__title`, children: title }) }),
+          /* @__PURE__ */ jsx8("div", { className: `${PREFIX_CLS}menu-item__icon`, children: isOpen ? /* @__PURE__ */ jsx8(ChevronUpIcon_default, { className: `${PREFIX_CLS}icon` }) : /* @__PURE__ */ jsx8(ChevronDownIcon_default, { className: `${PREFIX_CLS}icon` }) })
+        ]
+      })
+    ) }),
+    /* @__PURE__ */ jsx8(CollapseContent_default, { children: /* @__PURE__ */ jsx8(
+      "ul",
+      {
+        className: clsx7(`${PREFIX_CLS}menu`, {
+          [`${PREFIX_CLS}menu-open`]: !isOpen
+        }),
+        children: content || children
+      }
+    ) })
+  ] }) }) });
+};
+var MenuSubmenu_default = MenuSubmenu;
+
+// src/components/Menu/MenuGroup.tsx
+import { Fragment, jsx as jsx9, jsxs as jsxs10 } from "react/jsx-runtime";
+var MenuGroup = (_a) => {
+  var _b = _a, {
+    children,
+    className,
+    style,
+    title,
+    icon,
+    level = 1,
+    items
+  } = _b, rest = __objRest(_b, [
+    "children",
+    "className",
+    "style",
+    "title",
+    "icon",
+    "level",
+    "items"
+  ]);
+  const content = useMemo2(() => {
+    return items == null ? void 0 : items.map((_a2, index) => {
+      var _b2 = _a2, { type } = _b2, item = __objRest(_b2, ["type"]);
+      return type === "item" ? /* @__PURE__ */ jsx9(MenuItem_default, __spreadValues({}, item), index) : type === "submenu" ? /* @__PURE__ */ jsx9(MenuSubmenu_default, __spreadValues({}, item), index) : /* @__PURE__ */ jsx9(MenuItem_default, __spreadValues({}, item), index);
+    });
+  }, [items]);
+  return /* @__PURE__ */ jsxs10(Fragment, { children: [
+    /* @__PURE__ */ jsxs10(
+      "div",
+      __spreadProps(__spreadValues({
+        className: clsx8(`${PREFIX_CLS}menu-group`, className),
+        style: __spreadValues({
+          paddingLeft: level <= 1 ? `var(--${PREFIX_CLS}menu-group-padding-x)` : `calc(${level} * var(--${PREFIX_CLS}menu-group-padding-level))`
+        }, style)
+      }, rest), {
+        children: [
+          icon && /* @__PURE__ */ jsx9("div", { className: `${PREFIX_CLS}menu-group__icon`, children: icon }),
+          /* @__PURE__ */ jsx9("div", { className: `${PREFIX_CLS}menu-group__content`, children: /* @__PURE__ */ jsx9("span", { className: `${PREFIX_CLS}menu-group__title`, children: title }) })
+        ]
+      })
+    ),
+    content || children
+  ] });
+};
+var MenuGroup_default = MenuGroup;
+
+// src/components/Menu/Menu.tsx
+import { jsx as jsx10 } from "react/jsx-runtime";
+var Menu = (_a) => {
+  var _b = _a, {
+    children,
+    value: valueProp = [],
+    defaultValue,
+    openValues: openValuesProp,
+    expandMode = "multiple",
+    navMode = "manual",
+    items,
+    onChange,
+    onOpen,
+    onItemSelect
+  } = _b, rest = __objRest(_b, [
+    "children",
+    "value",
+    "defaultValue",
+    "openValues",
+    "expandMode",
+    "navMode",
+    "items",
+    "onChange",
+    "onOpen",
+    "onItemSelect"
+  ]);
+  var _a2;
+  const [selfValue, setSelfValue] = useState2((_a2 = valueProp != null ? valueProp : defaultValue) != null ? _a2 : []);
+  const [selfOpenValues, setSelfOpenValues] = useState2(openValuesProp != null ? openValuesProp : []);
+  const content = useMemo3(() => {
+    return items == null ? void 0 : items.map((_a3, index) => {
+      var _b2 = _a3, { type } = _b2, item = __objRest(_b2, ["type"]);
+      return type === "item" ? /* @__PURE__ */ jsx10(MenuItem_default, __spreadValues({}, item), index) : type === "submenu" ? /* @__PURE__ */ jsx10(MenuSubmenu_default, __spreadValues({}, item), index) : type === "group" ? /* @__PURE__ */ jsx10(MenuGroup_default, __spreadValues({}, item), index) : /* @__PURE__ */ jsx10(MenuItem_default, __spreadValues({}, item), index);
+    });
+  }, [items]);
+  const handleChange = (value) => {
+    if (valueProp !== void 0 && navMode !== "automatic") {
+      onChange == null ? void 0 : onChange(value);
+    } else {
+      setSelfValue(value);
+    }
+  };
+  const handleOpen = (values) => {
+    if (openValuesProp !== void 0) {
+      onOpen == null ? void 0 : onOpen(values);
+    } else {
+      setSelfOpenValues(values);
+    }
+  };
+  const handleItemSelect = (props) => {
+    onItemSelect == null ? void 0 : onItemSelect(props);
+  };
+  useEffect3(() => {
+    if (valueProp !== void 0 && navMode !== "automatic") {
+      setSelfValue(valueProp);
+    }
+  }, [valueProp]);
+  useEffect3(() => {
+    if (openValuesProp !== void 0) {
+      setSelfOpenValues(openValuesProp);
+    }
+  }, [openValuesProp]);
+  return /* @__PURE__ */ jsx10(
+    MenuContext_default.Provider,
+    {
+      value: {
+        value: selfValue,
+        originalValue: valueProp,
+        openValues: selfOpenValues,
+        expandMode,
+        navMode,
+        onOpen: handleOpen,
+        onChange: handleChange,
+        onItemSelect: handleItemSelect
+      },
+      children: /* @__PURE__ */ jsx10("div", __spreadProps(__spreadValues({ className: clsx9(`${PREFIX_CLS}menu`) }, rest), { children: content || children }))
+    }
+  );
+};
+Menu.displayName = "Menu";
+var Menu_default = Menu;
+
+// src/components/Tabs/Tab.tsx
+import clsx10 from "clsx";
+import mergeRefs from "merge-refs";
+import { forwardRef as forwardRef10, useEffect as useEffect4, useId, useRef as useRef2 } from "react";
+
+// ../../../node_modules/react-icons/lib/esm/iconBase.js
+import React3 from "react";
+
+// ../../../node_modules/react-icons/lib/esm/iconContext.js
+import React2 from "react";
+var DefaultContext = {
+  color: void 0,
+  size: void 0,
+  className: void 0,
+  style: void 0,
+  attr: void 0
+};
+var IconContext = React2.createContext && React2.createContext(DefaultContext);
+
+// ../../../node_modules/react-icons/lib/esm/iconBase.js
+var __assign = function() {
+  __assign = Object.assign || function(t) {
+    for (var s, i = 1, n = arguments.length; i < n; i++) {
+      s = arguments[i];
+      for (var p in s)
+        if (Object.prototype.hasOwnProperty.call(s, p))
+          t[p] = s[p];
+    }
+    return t;
+  };
+  return __assign.apply(this, arguments);
+};
+var __rest = function(s, e) {
+  var t = {};
+  for (var p in s)
+    if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+      t[p] = s[p];
+  if (s != null && typeof Object.getOwnPropertySymbols === "function")
+    for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+      if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+        t[p[i]] = s[p[i]];
+    }
+  return t;
+};
+function Tree2Element(tree) {
+  return tree && tree.map(function(node, i) {
+    return React3.createElement(node.tag, __assign({
+      key: i
+    }, node.attr), Tree2Element(node.child));
+  });
+}
+function GenIcon(data) {
+  return function(props) {
+    return React3.createElement(IconBase, __assign({
+      attr: __assign({}, data.attr)
+    }, props), Tree2Element(data.child));
+  };
+}
+function IconBase(props) {
+  var elem = function(conf) {
+    var attr = props.attr, size = props.size, title = props.title, svgProps = __rest(props, ["attr", "size", "title"]);
+    var computedSize = size || conf.size || "1em";
+    var className;
+    if (conf.className)
+      className = conf.className;
+    if (props.className)
+      className = (className ? className + " " : "") + props.className;
+    return React3.createElement("svg", __assign({
+      stroke: "currentColor",
+      fill: "currentColor",
+      strokeWidth: "0"
+    }, conf.attr, attr, svgProps, {
+      className,
+      style: __assign(__assign({
+        color: props.color || conf.color
+      }, conf.style), props.style),
+      height: computedSize,
+      width: computedSize,
+      xmlns: "http://www.w3.org/2000/svg"
+    }), title && React3.createElement("title", null, title), props.children);
+  };
+  return IconContext !== void 0 ? React3.createElement(IconContext.Consumer, null, function(conf) {
+    return elem(conf);
+  }) : elem(DefaultContext);
+}
+
+// ../../../node_modules/react-icons/tb/index.esm.js
+function TbX(props) {
+  return GenIcon({ "tag": "svg", "attr": { "viewBox": "0 0 24 24", "strokeWidth": "2", "stroke": "currentColor", "fill": "none", "strokeLinecap": "round", "strokeLinejoin": "round" }, "child": [{ "tag": "path", "attr": { "stroke": "none", "d": "M0 0h24v24H0z", "fill": "none" } }, { "tag": "path", "attr": { "d": "M18 6l-12 12" } }, { "tag": "path", "attr": { "d": "M6 6l12 12" } }] })(props);
+}
+
+// src/components/Tabs/TabsContext.ts
+import { createContext as createContext4, useContext as useContext6 } from "react";
+var TabsContext = createContext4(null);
+var useTabs = () => {
+  const context = useContext6(TabsContext);
+  if (!context) {
+    throw new Error("`useTabs` must be used within a `<Tabs />`");
+  }
+  return context;
+};
+
+// src/components/Tabs/Tab.tsx
+import { jsx as jsx11, jsxs as jsxs11 } from "react/jsx-runtime";
+var Tab = forwardRef10(
+  (_a, ref) => {
+    var _b = _a, {
+      as: Component = "div",
+      children,
+      className,
+      role = "presentation",
+      value: valueProp,
+      closable,
+      disabled,
+      onClick
+    } = _b, rest = __objRest(_b, [
+      "as",
+      "children",
+      "className",
+      "role",
+      "value",
+      "closable",
+      "disabled",
+      "onClick"
+    ]);
+    const tabRef = useRef2(null);
+    const id = useId();
+    const value = valueProp != null ? valueProp : id;
+    const _a2 = useTabs(), { onClose, registerItem } = _a2, tabs = __objRest(_a2, ["onClose", "registerItem"]);
+    const handleClick = (event) => {
+      const previousTab = tabs.previousTabRef.current;
+      const currentTab = tabRef.current;
+      if (!currentTab)
+        return;
+      if (previousTab) {
+        const previousIndicator = previousTab.querySelector(`.${PREFIX_CLS}tab__indicator`);
+        const currentIndicator = currentTab.querySelector(`.${PREFIX_CLS}tab__indicator`);
+        if (!previousIndicator || !currentIndicator)
+          return;
+        const from = {};
+        const fromRect = previousIndicator.getBoundingClientRect();
+        const fromPos = fromRect.left;
+        const fromWidth = fromRect.width;
+        const toRect = currentIndicator.getBoundingClientRect();
+        const toPos = toRect.left;
+        const toWidth = toRect.width;
+        const scale = fromWidth / toWidth;
+        if (scale) {
+          from["transform"] = `translateX(${(fromPos - toPos).toFixed(4)}px) scaleX(${scale.toFixed(4)})`;
+        } else {
+          from["opacity"] = 0;
+        }
+        const keyframes = [from, { transform: "none" }];
+        currentIndicator.animate(keyframes, {
+          duration: 250,
+          easing: "cubic-bezier(.3,0,0,1)"
+        });
+        tabs.previousTabRef.current = tabRef.current;
+      }
+      tabs.previousTabRef.current = tabRef.current;
+      tabs.onChange(value);
+      onClick == null ? void 0 : onClick(event);
+    };
+    const handleClose = (event) => {
+      event.stopPropagation();
+      onClose(value);
+    };
+    useEffect4(() => {
+      registerItem({ value, disabled });
+      if (value === tabs.value) {
+        tabs.previousTabRef.current = tabRef.current;
+      }
+    }, [value, tabs.value]);
+    return /* @__PURE__ */ jsxs11(
+      Component,
+      __spreadProps(__spreadValues({
+        ref: mergeRefs(tabRef, ref, (el) => tabs.tabRefs.current[value] = el),
+        className: clsx10(
+          `${PREFIX_CLS}tab`,
+          { [`${PREFIX_CLS}tab--selected`]: value === tabs.value, [`${PREFIX_CLS}tab--disabled`]: disabled },
+          className
+        ),
+        role,
+        onClick: handleClick
+      }, rest), {
+        children: [
+          /* @__PURE__ */ jsx11("div", { className: `${PREFIX_CLS}overlay`, children: /* @__PURE__ */ jsx11("div", { className: `${PREFIX_CLS}overlay__surface` }) }),
+          /* @__PURE__ */ jsxs11("div", { className: `${PREFIX_CLS}tab__content`, children: [
+            children,
+            closable && /* @__PURE__ */ jsx11(Button, { variant: "text", color: "secondary", iconOnly: true, size: "xs", onClick: handleClose, children: /* @__PURE__ */ jsx11(Icon_default, { children: /* @__PURE__ */ jsx11(TbX, {}) }) })
+          ] }),
+          /* @__PURE__ */ jsx11("div", { className: `${PREFIX_CLS}tab__indicator` })
+        ]
+      })
+    );
+  }
+);
+
+// src/components/Tabs/Tabs.tsx
+import clsx11 from "clsx";
+import { useEffect as useEffect5, useRef as useRef3, useState as useState3 } from "react";
+
+// src/utils/scroll.ts
+var scrollToItem = (parentElement, currentElement) => {
+  const parentRect = parentElement.getBoundingClientRect();
+  const currentRect = currentElement.getBoundingClientRect();
+  const behavior = "smooth";
+  const previousElement = currentElement.previousSibling;
+  const previousRect = (previousElement == null ? void 0 : previousElement.getBoundingClientRect()) || currentRect;
+  if (parentRect.left > previousRect.left) {
+    let offset = 0;
+    if (previousElement) {
+      offset = previousRect.left - parentRect.left + parentElement.scrollLeft + previousRect.width / 4;
+    }
+    parentElement.scrollTo({ behavior, left: offset });
+  }
+  const nextElement = currentElement.nextSibling;
+  const nextRect = (nextElement == null ? void 0 : nextElement.getBoundingClientRect()) || currentRect;
+  if (parentRect.right < nextRect.right) {
+    let offset = parentElement.scrollWidth;
+    if (nextElement) {
+      offset = nextRect.right - parentRect.right + parentElement.scrollLeft - nextRect.width / 4;
+    }
+    parentElement.scrollTo({ behavior, left: offset });
+  }
+};
+
+// src/components/Tabs/Tabs.tsx
+import { jsx as jsx12, jsxs as jsxs12 } from "react/jsx-runtime";
+var Tabs = (_a) => {
+  var _b = _a, {
+    children,
+    className,
+    value,
+    defaultValue,
+    alignment = "start",
+    onChange,
+    onClose
+  } = _b, rest = __objRest(_b, [
+    "children",
+    "className",
+    "value",
+    "defaultValue",
+    "alignment",
+    "onChange",
+    "onClose"
+  ]);
+  const tabsRef = useRef3(null);
+  const tabRefs = useRef3({});
+  const previousTabRef = useRef3(null);
+  const [selfValue, setSelfValue] = useState3(value != null ? value : defaultValue);
+  const [items, setItems] = useState3([]);
+  const registerItem = (item) => {
+    setItems((prevItems) => {
+      const index = prevItems.findIndex((item2) => item2.value);
+      if (index === -1) {
+        prevItems.push(item);
+      }
+      return prevItems;
+    });
+  };
+  const scrollToTab = (value2) => {
+    const tabsEl = tabsRef.current;
+    if (!tabsEl)
+      return;
+    const currentTabEl = tabRefs.current[value2];
+    if (!currentTabEl)
+      return;
+    scrollToItem(tabsEl, currentTabEl);
+  };
+  const handleChange = (value2) => {
+    setSelfValue(value2);
+    onChange == null ? void 0 : onChange(value2);
+    scrollToTab(value2);
+  };
+  const handleClose = (value2) => {
+    onClose == null ? void 0 : onClose(value2);
+  };
+  useEffect5(() => {
+    if (value !== void 0) {
+      setSelfValue(value);
+      scrollToTab(value);
+    }
+  }, [value]);
+  useEffect5(() => {
+    if (value === void 0) {
+      const item = items.find((tab) => !tab.disabled);
+      setSelfValue(item == null ? void 0 : item.value);
+    }
+  }, [value, items]);
+  return /* @__PURE__ */ jsxs12(
+    TabsContext.Provider,
+    {
+      value: { previousTabRef, tabRefs, value: selfValue, onChange: handleChange, onClose: handleClose, registerItem },
+      children: [
+        /* @__PURE__ */ jsx12(
+          "div",
+          __spreadProps(__spreadValues({
+            ref: tabsRef,
+            className: clsx11(`${PREFIX_CLS}tabs`, { [`${PREFIX_CLS}tabs--${alignment}`]: alignment }, className)
+          }, rest), {
+            children
+          })
+        ),
+        /* @__PURE__ */ jsx12("div", { className: `${PREFIX_CLS}divider` })
+      ]
+    }
+  );
+};
+
+// src/hooks/useLocalStorage.tsx
+import { useCallback, useEffect as useEffect7, useState as useState4 } from "react";
+
+// src/hooks/useEventListener.tsx
+import { useRef as useRef4 } from "react";
+
+// src/hooks/useIsomorphicLayoutEffect.tsx
+import { useEffect as useEffect6, useLayoutEffect } from "react";
+var useIsomorphicLayoutEffect = typeof window !== "undefined" ? useLayoutEffect : useEffect6;
+var useIsomorphicLayoutEffect_default = useIsomorphicLayoutEffect;
+
+// src/hooks/useEventListener.tsx
+function useEventListener(handler) {
+  const savedHandler = useRef4(handler);
+  useIsomorphicLayoutEffect_default(() => {
+    savedHandler.current = handler;
+  }, [handler]);
+}
+var useEventListener_default = useEventListener;
+
+// src/hooks/useLocalStorage.tsx
+function useLocalStorage(key, initialValue) {
+  const readValue = useCallback(() => {
+    if (typeof window === "undefined") {
+      return initialValue;
+    }
+    try {
+      const item = window.localStorage.getItem(key);
+      return item ? parseJSON(item) : initialValue;
+    } catch (error) {
+      console.warn(`Error reading localStorage key \u201C${key}\u201D:`, error);
+      return initialValue;
+    }
+  }, [initialValue, key]);
+  const [storedValue, setStoredValue] = useState4(readValue);
+  const setValue = useCallback(
+    (value) => {
+      if (typeof window == "undefined") {
+        console.warn(`Tried setting localStorage key \u201C${key}\u201D even though environment is not a client`);
+      }
+      try {
+        const newValue = value instanceof Function ? value(storedValue) : value;
+        window.localStorage.setItem(key, JSON.stringify(newValue));
+        setStoredValue(newValue);
+        window.dispatchEvent(new Event("local-storage"));
+      } catch (error) {
+        console.warn(`Error setting localStorage key \u201C${key}\u201D:`, error);
+      }
+    },
+    [key, storedValue]
+  );
+  useEffect7(() => {
+    setStoredValue(readValue());
+  }, []);
+  const handleStorageChange = useCallback(() => {
+    setStoredValue(readValue());
+  }, [readValue]);
+  useEventListener_default("storage", handleStorageChange);
+  useEventListener_default("local-storage", handleStorageChange);
+  return [storedValue, setValue];
+}
+function parseJSON(value) {
+  try {
+    return value === "undefined" ? void 0 : JSON.parse(value != null ? value : "");
+  } catch (e) {
+    console.log("parsing error on", { value });
+    return void 0;
+  }
+}
+
+// src/hooks/usePrevious.tsx
+import { useEffect as useEffect8, useRef as useRef5 } from "react";
+var usePrevious = (value) => {
+  const ref = useRef5();
+  useEffect8(() => {
+    ref.current = value;
+  });
+  return ref.current;
+};
+
+// src/hooks/useStep.tsx
+import { useCallback as useCallback2, useMemo as useMemo4, useState as useState5 } from "react";
+var useStep = (maxStep) => {
+  const [currentStep, setCurrentStep] = useState5(1);
+  const canGoToNextStep = useMemo4(() => currentStep + 1 <= maxStep, [currentStep, maxStep]);
+  const canGoToPrevStep = useMemo4(() => currentStep - 1 >= 1, [currentStep]);
+  const setStep = useCallback2(
+    (step) => {
+      const newStep = step instanceof Function ? step(currentStep) : step;
+      if (newStep >= 1 && newStep <= maxStep) {
+        setCurrentStep(newStep);
+        return;
+      }
+      throw new Error("Step not valid");
+    },
+    [maxStep, currentStep]
+  );
+  const goToNextStep = useCallback2(() => {
+    if (canGoToNextStep) {
+      setCurrentStep((step) => step + 1);
+    }
+  }, [canGoToNextStep]);
+  const goToPrevStep = useCallback2(() => {
+    if (canGoToPrevStep) {
+      setCurrentStep((step) => step - 1);
+    }
+  }, [canGoToPrevStep]);
+  const reset = useCallback2(() => {
+    setCurrentStep(1);
+  }, []);
+  return [
+    currentStep,
+    {
+      goToNextStep,
+      goToPrevStep,
+      canGoToNextStep,
+      canGoToPrevStep,
+      setStep,
+      reset
+    }
+  ];
+};
+export {
+  Badge_default as Badge,
+  Button,
+  Chip_default as Chip,
+  Collapse_default as Collapse,
+  CollapseContent_default as CollapseContent,
+  CollapseContext_default as CollapseContext,
+  CollapseTrigger_default as CollapseTrigger,
+  Icon_default as Icon,
+  Menu_default as Menu,
+  MenuContext_default as MenuContext,
+  MenuGroup_default as MenuGroup,
+  MenuItem_default as MenuItem,
+  MenuSubmenu_default as MenuSubmenu,
+  MenuValueContext_default as MenuValueContext,
+  Tab,
+  Tabs,
+  getOpenValuesByPathname,
+  useCollapse,
+  useLocalStorage,
+  useMenu,
+  useMenuItemValue,
+  usePrevious,
+  useStep
+};