polpo 0.1.13 → 0.1.16

package/dist/components.cjs

@@ -1,3656 +1,2 @@
 "use client";
-"use strict";
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// src/components/index.ts
-var components_exports = {};
-__export(components_exports, {
-  Accordion: () => Accordion,
-  AccordionItem: () => AccordionItem,
-  ActionModal: () => ActionModal,
-  AsideModal: () => AsideModal,
-  Backdrop: () => Backdrop,
-  Button: () => Button,
-  Checkbox: () => Checkbox,
-  ClickToCopy: () => ClickToCopy,
-  ConfirmationModal: () => ConfirmationModal,
-  Cursor: () => Cursor,
-  DatePicker: () => DatePicker,
-  Field: () => Field,
-  FieldOrientation: () => FieldOrientation,
-  FieldVariant: () => FieldVariant,
-  FlipCard: () => FlipCard,
-  HoverCard: () => HoverCard,
-  Image: () => Image,
-  InfinityScroll: () => InfinityScroll,
-  Input: () => Input,
-  InputColor: () => InputColor,
-  InputFile: () => InputFile,
-  InputNumber: () => InputNumber,
-  InputPassword: () => InputPassword,
-  Line: () => Line,
-  LineOrientation: () => LineOrientation,
-  LineStyle: () => LineStyle,
-  Menu: () => Menu,
-  Modal: () => Modal,
-  ModalBackdrop: () => ModalBackdrop,
-  Portal: () => Portal,
-  Radio: () => Radio,
-  Ripple: () => Ripple,
-  Select: () => Select,
-  SlideCard: () => SlideCard,
-  Slider: () => Slider,
-  SmartTable: () => SmartTable,
-  Switch: () => Switch,
-  Tabs: () => Tabs,
-  Tag: () => Tag,
-  TagRounded: () => TagRounded,
-  Textarea: () => Textarea,
-  Tooltip: () => Tooltip,
-  Typography: () => Typography,
-  useAccordionItem: () => useAccordionItem
-});
-module.exports = __toCommonJS(components_exports);
-
-// src/components/accordion/accordion.component.tsx
-var import_react15 = require("react");
-
-// src/hooks/use-classnames.ts
-var import_react = require("react");
-var useClassNames = (classes) => (0, import_react.useMemo)(
-  () => Object.entries(classes).reduce(
-    (compiledClassNames, [classname, value]) => value ? [...compiledClassNames, classname] : compiledClassNames,
-    []
-  ).join(" "),
-  [classes]
-);
-
-// src/hooks/use-event-listener.ts
-var import_react2 = require("react");
-function useEventListener(eventName, callback, element, options) {
-  const callbackRef = (0, import_react2.useRef)(callback);
-  (0, import_react2.useEffect)(() => {
-    callbackRef.current = callback;
-  }, [callback]);
-  (0, import_react2.useLayoutEffect)(() => {
-    const targetElement = element?.current ?? window;
-    if (!(targetElement && targetElement.addEventListener)) return;
-    const listener = (event) => callbackRef.current(event);
-    targetElement.addEventListener(eventName, listener, options);
-    return () => {
-      targetElement.removeEventListener(eventName, listener, options);
-    };
-  }, [eventName, element, options]);
-}
-
-// src/hooks/use-click-outside.ts
-var checkIsOutside = (ref, target) => {
-  return ref.current && !ref.current.contains(target);
-};
-var useClickOutside = (ref, callback) => {
-  useEventListener("keydown", (e) => {
-    if (e.key === "Escape") {
-      callback();
-    }
-  });
-  useEventListener("mousedown", (event) => {
-    const target = event.target;
-    if (!target?.isConnected) {
-      return;
-    }
-    const isOutside = (Array.isArray(ref) ? ref : [ref]).every((r) => checkIsOutside(r, target));
-    if (isOutside) {
-      callback();
-    }
-  });
-};
-
-// src/hooks/use-debounce.ts
-var import_react3 = require("react");
-var useDebounce = (value, delay = 500) => {
-  const [debouncedValue, setDebouncedValue] = (0, import_react3.useState)(value);
-  (0, import_react3.useEffect)(() => {
-    const timer = setTimeout(() => setDebouncedValue(value), delay);
-    return () => {
-      clearTimeout(timer);
-    };
-  }, [value, delay]);
-  return debouncedValue;
-};
-
-// src/hooks/use-resize-observer.ts
-var import_react4 = require("react");
-var useResizeObserver = (ref, callback) => {
-  (0, import_react4.useEffect)(() => {
-    const refs = Array.isArray(ref) ? ref : [ref];
-    const observer = new ResizeObserver(callback);
-    refs.forEach((r) => r.current && observer.observe(r.current));
-    return () => {
-      observer.disconnect();
-    };
-  }, [ref, callback]);
-};
-
-// src/hooks/use-dom-container.ts
-var import_react5 = require("react");
-var createContainer = (containerID) => {
-  let domContainer = document.getElementById(containerID);
-  if (domContainer === null) {
-    domContainer = document.createElement("div");
-    domContainer.setAttribute("id", containerID);
-    document.body.appendChild(domContainer);
-  }
-  return domContainer;
-};
-var useDomContainer = (containerID) => {
-  const [container, setContainer] = (0, import_react5.useState)(() => createContainer(containerID));
-  (0, import_react5.useEffect)(() => {
-    const domContainer = document.getElementById(containerID);
-    if (container === null || domContainer === null) {
-      const domContainer2 = createContainer(containerID);
-      setContainer(domContainer2);
-    }
-    return () => {
-      if (container && container.parentNode && process.env.NODE_ENV === "production") {
-        document.body.removeChild(container);
-      }
-    };
-  }, [container, containerID]);
-  return container;
-};
-
-// src/helpers/format-bytes.ts
-var formatBytes = (bytes, decimals = 2) => {
-  if (bytes === 0) return "0 Bytes";
-  const k = 1e3;
-  const dm = decimals < 0 ? 0 : decimals;
-  const sizes = ["Bytes", "KB", "MB", "GB", "TB", "PB", "EB", "ZB", "YB"];
-  const i = Math.floor(Math.log(bytes) / Math.log(k));
-  return parseFloat((bytes / Math.pow(k, i)).toFixed(dm)) + " " + sizes[i];
-};
-
-// src/helpers/get-modal-position.ts
-var getModalPosition = ({ c, m, offset, position }) => {
-  let top = c.y + c.h + offset;
-  let left = c.x - (m.w - c.w) * (50 / 100);
-  switch (position) {
-    case "top" /* TOP */:
-    case "top center" /* TOP_CENTER */:
-      top = c.y - m.h - offset;
-      left = c.x - (m.w - c.w) / 2;
-      break;
-    case "top left" /* TOP_LEFT */:
-      top = c.y - m.h - offset;
-      left = c.x - m.w + c.w;
-      break;
-    case "top right" /* TOP_RIGHT */:
-      top = c.y - m.h - offset;
-      left = c.x;
-      break;
-    case "bottom" /* BOTTOM */:
-    case "bottom center" /* BOTTOM_CENTER */:
-      top = c.y + c.h + offset;
-      left = c.x - (m.w - c.w) / 2;
-      break;
-    case "bottom left" /* BOTTOM_LEFT */:
-      top = c.y + c.h + offset;
-      left = c.x - m.w + c.w;
-      break;
-    case "bottom right" /* BOTTOM_RIGHT */:
-      top = c.y + c.h + offset;
-      left = c.x;
-      break;
-    case "left" /* LEFT */:
-    case "left center" /* LEFT_CENTER */:
-      top = c.y - (m.h - c.h) / 2;
-      left = c.x - m.w - offset;
-      break;
-    case "left top" /* LEFT_TOP */:
-      top = c.y - m.h + c.h;
-      left = c.x - m.w - offset;
-      break;
-    case "left bottom" /* LEFT_BOTTOM */:
-      top = c.y;
-      left = c.x - m.w - offset;
-      break;
-    case "right" /* RIGHT */:
-    case "right center" /* RIGHT_CENTER */:
-      top = c.y - (m.h - c.h) / 2;
-      left = c.x + c.w + offset;
-      break;
-    case "right top" /* RIGHT_TOP */:
-      top = c.y - m.h + c.h;
-      left = c.x + c.w + offset;
-      break;
-    case "right bottom" /* RIGHT_BOTTOM */:
-      top = c.y;
-      left = c.x + c.w + offset;
-      break;
-  }
-  return {
-    left: Math.round(left),
-    top: Math.round(top)
-  };
-};
-var getOppositePosition = ({ top, left }, position, windowOffset, m) => {
-  const positions = position.split(" ");
-  const newPosition = [];
-  const rightOffset = left + m.w + windowOffset - window.innerWidth;
-  const bottomOffset = top + m.h + windowOffset - window.innerHeight;
-  for (const p of positions) {
-    if (p === "top" /* TOP */ && top < windowOffset) {
-      newPosition.push("bottom" /* BOTTOM */);
-    } else if (p === "left" /* LEFT */ && left < windowOffset) {
-      newPosition.push("right" /* RIGHT */);
-    } else if (p === "bottom" /* BOTTOM */ && bottomOffset > 0) {
-      newPosition.push("top" /* TOP */);
-    } else if (p === "right" /* RIGHT */ && rightOffset > 0) {
-      newPosition.push("left" /* LEFT */);
-    } else {
-      newPosition.push(p);
-    }
-  }
-  return newPosition.join(" ");
-};
-var fixModalPosition = ({ top, left }, m, windowOffset) => {
-  const rightOffset = left + m.w + windowOffset - window.innerWidth;
-  const bottomOffset = top + m.h + windowOffset - window.innerHeight;
-  left = rightOffset > 0 ? left - rightOffset : left;
-  top = bottomOffset > 0 ? top - bottomOffset : top;
-  left = left < windowOffset ? windowOffset : left;
-  top = top < windowOffset ? windowOffset : top;
-  return { top, left };
-};
-var getModalPositionRelativeToContainer = ({
-  c,
-  m,
-  offset,
-  windowOffset,
-  position
-}) => {
-  const params = { c, m, offset, position };
-  let modalContainerStyle = getModalPosition(params);
-  const oppositePosition = getOppositePosition(modalContainerStyle, position, windowOffset, m);
-  if (oppositePosition !== position) {
-    modalContainerStyle = getModalPosition({
-      ...params,
-      position: oppositePosition
-    });
-  }
-  const fixedPosition = fixModalPosition(modalContainerStyle, m, windowOffset);
-  return {
-    left: `${fixedPosition.left}px`,
-    top: `${fixedPosition.top}px`
-  };
-};
-
-// src/helpers/get-modal-position-relative-to-screen.ts
-var getModalPositionRelativeToScreen = ({
-  position,
-  windowOffset
-}) => {
-  switch (position) {
-    case "center" /* CENTER */:
-      return {
-        top: "50%",
-        left: "50%",
-        transform: "translate(-50%, -50%)"
-      };
-    case "top" /* TOP */:
-    case "top center" /* TOP_CENTER */:
-      return {
-        top: `${windowOffset}px`,
-        left: "50%",
-        transform: "translateX(-50%)"
-      };
-    case "top left" /* TOP_LEFT */:
-    case "left top" /* LEFT_TOP */:
-      return {
-        top: `${windowOffset}px`,
-        left: `${windowOffset}px`
-      };
-    case "top right" /* TOP_RIGHT */:
-    case "right top" /* RIGHT_TOP */:
-      return {
-        top: `${windowOffset}px`,
-        right: `${windowOffset}px`
-      };
-    case "bottom" /* BOTTOM */:
-    case "bottom center" /* BOTTOM_CENTER */:
-      return {
-        bottom: `${windowOffset}px`,
-        left: "50%",
-        transform: "translateX(-50%)"
-      };
-    case "left bottom" /* LEFT_BOTTOM */:
-    case "bottom left" /* BOTTOM_LEFT */:
-      return {
-        bottom: `${windowOffset}px`,
-        left: `${windowOffset}px`
-      };
-    case "right bottom" /* RIGHT_BOTTOM */:
-    case "bottom right" /* BOTTOM_RIGHT */:
-      return {
-        bottom: `${windowOffset}px`,
-        right: `${windowOffset}px`
-      };
-    case "left" /* LEFT */:
-    case "left center" /* LEFT_CENTER */:
-      return {
-        top: "50%",
-        left: `${windowOffset}px`,
-        transform: "translateY(-50%)"
-      };
-    case "right" /* RIGHT */:
-    case "right center" /* RIGHT_CENTER */:
-      return {
-        top: "50%",
-        right: `${windowOffset}px`,
-        transform: "translateY(-50%)"
-      };
-  }
-  return {
-    top: "50%",
-    left: "50%",
-    transform: "translate(-50%, -50%)"
-  };
-};
-
-// src/hooks/use-in-view.ts
-var import_react7 = require("react");
-
-// src/hooks/use-intersection-observer.ts
-var import_react6 = require("react");
-var useIntersectionObserver = (ref, callback, initOptions = {}) => {
-  (0, import_react6.useEffect)(() => {
-    const refs = Array.isArray(ref) ? ref : [ref];
-    const observer = new IntersectionObserver(callback, initOptions);
-    refs.forEach((r) => r.current && observer.observe(r.current));
-    return () => {
-      observer.disconnect();
-    };
-  }, [callback, initOptions, ref]);
-};
-
-// src/hooks/use-in-view.ts
-var useInView = (initOptions = {}) => {
-  const [inView, setInView] = (0, import_react7.useState)(false);
-  const ref = (0, import_react7.useRef)(null);
-  useIntersectionObserver(
-    ref,
-    ([entry]) => {
-      setInView(entry.isIntersecting);
-    },
-    initOptions
-  );
-  return { ref, inView };
-};
-
-// src/hooks/use-input-handlers.ts
-var import_react8 = require("react");
-var useInputHandlers = ({
-  onBlur,
-  onFocus,
-  onChange
-} = {}) => {
-  const [isFocus, setIsFocus] = (0, import_react8.useState)(false);
-  const handleFocus = (0, import_react8.useCallback)(
-    (e) => {
-      setIsFocus(true);
-      onFocus && onFocus(e);
-    },
-    [onFocus]
-  );
-  const handleBlur = (0, import_react8.useCallback)(
-    (e) => {
-      setIsFocus(false);
-      onBlur && onBlur(e);
-    },
-    [onBlur]
-  );
-  const handleChange = (0, import_react8.useCallback)(
-    (e) => {
-      onChange && onChange(e);
-    },
-    [onChange]
-  );
-  return {
-    isFocus,
-    handlers: {
-      onFocus: handleFocus,
-      onBlur: handleBlur,
-      onChange: handleChange
-    }
-  };
-};
-
-// src/hooks/use-media-query.ts
-var import_react9 = require("react");
-var useMediaQuery = (query) => {
-  const [matches, setMatches] = (0, import_react9.useState)(false);
-  (0, import_react9.useEffect)(() => {
-    const media = window.matchMedia(query);
-    if (media.matches !== matches) {
-      setMatches(media.matches);
-    }
-    const listener = () => {
-      setMatches(media.matches);
-    };
-    media.addEventListener("change", listener);
-    return () => {
-      media.removeEventListener("change", listener);
-    };
-  }, [matches, query]);
-  return matches;
-};
-
-// src/hooks/use-modal.ts
-var import_react10 = require("react");
-var useModal = () => {
-  const containerRef = (0, import_react10.useRef)(null);
-  const [isOpen, setIsOpen] = (0, import_react10.useState)(false);
-  const openModal = () => {
-    setIsOpen(true);
-  };
-  const closeModal = () => {
-    setIsOpen(false);
-  };
-  return {
-    containerRef,
-    isOpen,
-    openModal,
-    closeModal
-  };
-};
-
-// src/hooks/use-modal-in-container.ts
-var import_react11 = require("react");
-var convertDOMRectToPosition = (rect) => ({
-  x: rect.x,
-  y: rect.y,
-  w: rect.width,
-  h: rect.height,
-  top: rect.top,
-  left: rect.left
-});
-var useModalInContainer = ({
-  offset = 0,
-  windowOffset = 0,
-  position = "bottom" /* BOTTOM */,
-  modalRef,
-  containerRef,
-  isOpen
-}) => {
-  const containerTemporalRef = (0, import_react11.useRef)(null);
-  const getPosition = (0, import_react11.useCallback)(
-    (modalRef2, containerRef2) => {
-      const modal = modalRef2.current?.getClientRects()[0];
-      const container = containerRef2.current?.getClientRects()[0];
-      if (!modal) {
-        return;
-      }
-      const modalStyle = !container ? getModalPositionRelativeToScreen({ position, windowOffset }) : getModalPositionRelativeToContainer({
-        c: convertDOMRectToPosition(container),
-        m: convertDOMRectToPosition(modal),
-        offset,
-        windowOffset,
-        position
-      });
-      Object.keys(modalStyle).forEach((key) => {
-        modalRef2.current?.style.setProperty(key, modalStyle[key]);
-      });
-    },
-    [position, windowOffset, offset]
-  );
-  const callback = (0, import_react11.useCallback)(() => {
-    if (isOpen) {
-      getPosition(modalRef, containerRef ?? containerTemporalRef);
-    }
-  }, [getPosition, isOpen, containerRef, modalRef]);
-  (0, import_react11.useLayoutEffect)(callback, [callback]);
-  useResizeObserver(containerRef ?? containerTemporalRef, callback);
-  useResizeObserver(modalRef, callback);
-  useEventListener("resize", callback);
-  useEventListener("scroll", callback, modalRef);
-};
-
-// src/hooks/use-modal-transition.ts
-var import_react12 = __toESM(require("react"), 1);
-var useModalTransition = ({ transitionDuration = 0, isOpen }) => {
-  const [modalState, setModalState] = import_react12.default.useState("CLOSED" /* CLOSED */);
-  const isVisible = (0, import_react12.useMemo)(() => {
-    return modalState !== "CLOSED" /* CLOSED */;
-  }, [modalState]);
-  (0, import_react12.useEffect)(() => {
-    document.documentElement.style.overflow = isVisible ? "hidden" : "auto";
-  }, [isVisible]);
-  const closeModal = (0, import_react12.useCallback)(() => {
-    if (["OPENING" /* OPENING */, "OPEN" /* OPEN */].includes(modalState)) {
-      if (transitionDuration > 0) {
-        setModalState("CLOSING" /* CLOSING */);
-        setTimeout(() => {
-          setModalState("CLOSED" /* CLOSED */);
-        }, transitionDuration);
-      } else {
-        setModalState("CLOSED" /* CLOSED */);
-      }
-    }
-  }, [modalState, transitionDuration]);
-  const openModal = (0, import_react12.useCallback)(() => {
-    if (["CLOSING" /* CLOSING */, "CLOSED" /* CLOSED */].includes(modalState)) {
-      if (transitionDuration > 0) {
-        setModalState("OPENING" /* OPENING */);
-        setTimeout(() => {
-          setModalState("OPEN" /* OPEN */);
-        }, transitionDuration);
-      } else {
-        setModalState("OPEN" /* OPEN */);
-      }
-    }
-  }, [modalState, transitionDuration]);
-  (0, import_react12.useLayoutEffect)(() => {
-    if (modalState === "CLOSED" /* CLOSED */ && isOpen) {
-      openModal();
-    } else if (modalState === "OPEN" /* OPEN */ && !isOpen) {
-      closeModal();
-    }
-  }, [isOpen, openModal, closeModal, modalState]);
-  return {
-    isVisible,
-    modalState
-  };
-};
-
-// src/hooks/use-mouse-position.ts
-var import_react13 = require("react");
-var getMousePosition = (domRect, e) => {
-  const { left, top } = domRect;
-  const containerPositionX = left + window.scrollX;
-  const containerPositionY = top + window.scrollY;
-  const containerX = e.pageX - containerPositionX;
-  const containerY = e.pageY - containerPositionY;
-  return {
-    x: e.pageX,
-    y: e.pageY,
-    elementX: containerX,
-    elementY: containerY,
-    elementPositionX: containerPositionX,
-    elementPositionY: containerPositionY
-  };
-};
-var useMousePosition = (containerRef) => {
-  const ref = (0, import_react13.useRef)(null);
-  const [position, setPosition] = (0, import_react13.useState)({
-    x: null,
-    y: null,
-    elementX: null,
-    elementY: null,
-    elementPositionX: null,
-    elementPositionY: null
-  });
-  const mouseMove = (e) => {
-    const { clientX, clientY } = e;
-    setPosition((prev) => ({ ...prev, x: clientX, y: clientY }));
-    if (containerRef?.current instanceof Element) {
-      const newState = getMousePosition(containerRef.current.getBoundingClientRect(), e);
-      setPosition((prev) => ({
-        ...prev,
-        ...newState
-      }));
-    } else if (ref.current instanceof Element) {
-      const newState = getMousePosition(ref.current.getBoundingClientRect(), e);
-      setPosition((prev) => ({
-        ...prev,
-        ...newState
-      }));
-    }
-  };
-  useEventListener("mousemove", mouseMove);
-  return { ...position, ref };
-};
-
-// src/hooks/use-toggle-values.ts
-var import_react14 = require("react");
-var useToggleValues = (values, defaultIndex = 0) => {
-  const [index, setIndex] = (0, import_react14.useState)(defaultIndex);
-  const toggle = (0, import_react14.useCallback)(
-    (index2) => {
-      setIndex(index2 !== void 0 ? index2 : (prev) => (prev + 1) % values.length);
-    },
-    [values.length]
-  );
-  return [values[index], toggle];
-};
-
-// src/components/line/line.component.tsx
-var import_jsx_runtime = require("react/jsx-runtime");
-var LineOrientation = /* @__PURE__ */ ((LineOrientation2) => {
-  LineOrientation2["VERTICAL"] = "vertical";
-  LineOrientation2["HORIZONTAL"] = "horizontal";
-  return LineOrientation2;
-})(LineOrientation || {});
-var LineStyle = /* @__PURE__ */ ((LineStyle2) => {
-  LineStyle2["SOLID"] = "solid";
-  LineStyle2["DOTTED"] = "dotted";
-  LineStyle2["DASHED"] = "dashed";
-  return LineStyle2;
-})(LineStyle || {});
-var Line = ({
-  orientation = "horizontal" /* HORIZONTAL */,
-  className = "",
-  style = {},
-  color = "currentColor",
-  size = 1,
-  lineStyle = "solid" /* SOLID */,
-  dashedSize = 1,
-  spacing = 1
-}) => {
-  const classNames = useClassNames({
-    "custom-line": true,
-    [orientation]: true,
-    [className]: !!className,
-    [lineStyle]: true
-  });
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-    "span",
-    {
-      className: classNames,
-      style: {
-        ...style,
-        "--color": color,
-        "--size": `${size}px`,
-        "--spacing": `${spacing}px`,
-        "--dashSize": `${dashedSize}px`
-      }
-    }
-  );
-};
-
-// src/components/accordion/accordion.component.tsx
-var import_jsx_runtime2 = require("react/jsx-runtime");
-var AccordionContext = (0, import_react15.createContext)(null);
-var useAccordionItem = (id) => {
-  const context = (0, import_react15.useContext)(AccordionContext);
-  if (!context) {
-    throw new Error("You cant use this component out off an Accordion component");
-  }
-  const { toggleItem, openedItems } = context;
-  const toggle = () => toggleItem(id);
-  return [openedItems.includes(id), toggle];
-};
-var Accordion = ({
-  children,
-  className = "",
-  noSeparators,
-  multiple,
-  style = {},
-  defaultOpened = []
-}) => {
-  const [openedItems, setOpenedItems] = (0, import_react15.useState)(() => {
-    return (Array.isArray(defaultOpened) ? defaultOpened : [defaultOpened]).reduce((acc, id) => {
-      return typeof id === "string" ? { ...acc, [id]: true } : acc;
-    }, {});
-  });
-  const toggleItem = (0, import_react15.useCallback)(
-    (id) => {
-      setOpenedItems((prev) => ({ ...multiple ? prev : {}, [id]: !prev[id] }));
-    },
-    [multiple]
-  );
-  const openedItemsIDs = (0, import_react15.useMemo)(() => Object.keys(openedItems).filter((id) => openedItems[id]), [openedItems]);
-  const accordionClassName = useClassNames({
-    accordion: true,
-    [className]: Boolean(className)
-  });
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-    AccordionContext.Provider,
-    {
-      value: {
-        toggleItem,
-        openedItems: openedItemsIDs
-      },
-      children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("section", { className: accordionClassName, style, children: (Array.isArray(children) ? children : [children]).flatMap((child, key) => {
-        return key === 0 ? child : [noSeparators ? null : /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Line, { orientation: "horizontal" }, `${key}.5`), child];
-      }) })
-    }
-  );
-};
-
-// src/components/accordion/accordion-item.tsx
-var import_react19 = require("react");
-var import_fa = require("react-icons/fa");
-
-// src/components/cards/slide-card/slide-card.component.tsx
-var import_jsx_runtime3 = require("react/jsx-runtime");
-var SlideCard = ({ children, isOpen, className = "", style = {} }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-    "section",
-    {
-      className,
-      style: {
-        overflow: "hidden",
-        height: isOpen ? "auto" : 0,
-        transition: "height 300ms ease",
-        interpolateSize: "allow-keywords",
-        ...style
-      },
-      children
-    }
-  );
-};
-
-// src/components/cards/flip-card/flip-card.component.tsx
-var import_react16 = require("react");
-var import_jsx_runtime4 = require("react/jsx-runtime");
-var FlipCard = ({
-  cardZIndex = "auto",
-  flipDirection = "vertical",
-  flipSpeed = 500,
-  isFlipped = false,
-  children
-}) => {
-  const getComponent = (key) => {
-    if (children.length !== 2) {
-      throw new Error("Component FlipCard requires 2 children");
-    }
-    return children[key];
-  };
-  const frontRotate = (0, import_react16.useMemo)(() => {
-    const deg = isFlipped ? 180 : 0;
-    return `rotate${flipDirection === "horizontal" ? "Y" : "X"}(${deg}deg)`;
-  }, [flipDirection, isFlipped]);
-  const backRotate = (0, import_react16.useMemo)(() => {
-    const deg = isFlipped ? 0 : -180;
-    return `rotate${flipDirection === "horizontal" ? "Y" : "X"}(${deg}deg)`;
-  }, [flipDirection, isFlipped]);
-  const className = useClassNames({
-    "flip-card": true,
-    "is-flipped": isFlipped
-  });
-  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-    "section",
-    {
-      className,
-      style: {
-        "--cardZIndex": cardZIndex,
-        "--flipSpeed": `${flipSpeed}ms`,
-        "--frontRotate": frontRotate,
-        "--backRotate": backRotate
-      },
-      children: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("section", { className: "flipper", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("section", { className: "front", children: getComponent(0) }),
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("section", { className: "back", children: getComponent(1) })
-      ] })
-    }
-  );
-};
-
-// src/components/cards/hover-card/hover-card.component.tsx
-var import_react17 = require("react");
-var import_jsx_runtime5 = require("react/jsx-runtime");
-var HoverCard = ({
-  children,
-  threshold = 5,
-  translationZ = 25,
-  width = "fit-content",
-  className = ""
-}) => {
-  const refCard = (0, import_react17.useRef)(null);
-  const refLayer = (0, import_react17.useRef)(null);
-  const mouseMoveCallback = (0, import_react17.useCallback)(
-    (e) => {
-      const card = refCard.current;
-      const layer = refLayer.current;
-      if (!card || !layer) return;
-      const { clientX, clientY, currentTarget } = e;
-      const { clientWidth, clientHeight } = currentTarget;
-      const { top, left } = card.getBoundingClientRect();
-      const horizontal = (clientX - left) / clientWidth;
-      const vertical = (clientY - top) / clientHeight;
-      const relativePercentageX = horizontal * 2 - 1;
-      const relativePercentageY = vertical * 2 - 1;
-      const rotateY = (relativePercentageY * threshold).toFixed(2);
-      const rotateX = (relativePercentageX * threshold).toFixed(2);
-      layer.style.transform = `perspective(${clientWidth}px) rotateX(${-rotateY}deg) rotateY(${rotateX}deg)`;
-      card.style.transform = `perspective(${clientWidth}px) translateZ(${translationZ}px)`;
-    },
-    [threshold, translationZ]
-  );
-  const mouseLeaveCallback = (0, import_react17.useCallback)((e) => {
-    const card = refCard.current;
-    const layer = refLayer.current;
-    if (!card || !layer) return;
-    layer.style.transform = `perspective(${e.currentTarget.clientWidth}px) rotateX(0) rotateY(0)`;
-    card.style.transform = `perspective(${e.currentTarget.clientWidth}px) translateZ(0)`;
-  }, []);
-  useEventListener("mousemove", mouseMoveCallback, refCard);
-  useEventListener("mouseleave", mouseLeaveCallback, refCard);
-  const cardClassName = useClassNames({
-    "hover-card": true,
-    [className]: Boolean(className)
-  });
-  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { ref: refCard, style: { width }, className: cardClassName, children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: "card-hover-layer", ref: refLayer, children }) });
-};
-
-// src/components/typography/typography.component.tsx
-var import_react18 = require("react");
-
-// src/components/typography/typography.constants.ts
-var TypographyVariantsElements = {
-  ["hero" /* HERO */]: "h1",
-  ["header1" /* HEADER1 */]: "h1",
-  ["header2" /* HEADER2 */]: "h2",
-  ["header3" /* HEADER3 */]: "h3",
-  ["header4" /* HEADER4 */]: "h4",
-  ["body" /* BODY */]: "p",
-  ["label" /* LABEL */]: "span",
-  ["label-form" /* LABEL_FORM */]: "label",
-  ["small" /* SMALL */]: "small"
-};
-var TypographyVariantsClassNames = {
-  ["hero" /* HERO */]: "hero",
-  ["header1" /* HEADER1 */]: "header1",
-  ["header2" /* HEADER2 */]: "header2",
-  ["header3" /* HEADER3 */]: "header3",
-  ["header4" /* HEADER4 */]: "header4",
-  ["body" /* BODY */]: "body",
-  ["label" /* LABEL */]: "label",
-  ["label-form" /* LABEL_FORM */]: "label",
-  ["small" /* SMALL */]: "small"
-};
-
-// src/components/typography/typography.component.tsx
-var Typography = ({
-  variant = "body" /* BODY */,
-  nowrap = false,
-  className: customClassname = "",
-  style = {},
-  children,
-  as,
-  weight,
-  family = "primary",
-  noPadding = false,
-  align,
-  color,
-  htmlFor,
-  recommendedWidth = false,
-  ...props
-}) => {
-  const className = useClassNames({
-    typography: true,
-    [TypographyVariantsClassNames[variant]]: TypographyVariantsClassNames[variant] !== void 0,
-    [customClassname]: !!customClassname,
-    [weight ?? ""]: !!weight,
-    [color ?? ""]: Boolean(color),
-    "no-padding": noPadding,
-    "code-family": family === "code",
-    "recommended-width": recommendedWidth,
-    "nowrap-max-lines": typeof nowrap === "number",
-    "nowrap-max-lines-2": nowrap === 2,
-    "nowrap-max-lines-3": nowrap === 3,
-    "nowrap-max-lines-4": nowrap === 4,
-    "nowrap-max-lines-5": nowrap === 5,
-    nowrap: nowrap === true
-  });
-  const component = (0, import_react18.useMemo)(
-    () => TypographyVariantsElements[variant] ?? TypographyVariantsElements["body" /* BODY */],
-    [variant]
-  );
-  return (0, import_react18.createElement)(
-    as ?? component,
-    {
-      ...props,
-      className,
-      htmlFor,
-      style: {
-        textAlign: align,
-        ...style
-      }
-    },
-    children
-  );
-};
-
-// src/components/accordion/accordion-item.tsx
-var import_jsx_runtime6 = require("react/jsx-runtime");
-var getContent = (content, isOpen) => {
-  if (typeof content === "function") {
-    return content(isOpen);
-  }
-  return content;
-};
-var AccordionItem = ({
-  title,
-  subtitle,
-  children,
-  icon: Icon = import_fa.FaCaretLeft,
-  startContent,
-  content,
-  endContent,
-  classNames = {},
-  className = "",
-  style = {}
-}) => {
-  const id = (0, import_react19.useMemo)(() => crypto.randomUUID(), []);
-  const [isOpen, toggle] = useAccordionItem(id);
-  const headerClassName = useClassNames({
-    "accordion-header": true,
-    "has-start-content": !!startContent,
-    [classNames?.header ?? ""]: !!classNames?.header,
-    "is-open": isOpen
-  });
-  const headerContentClassName = useClassNames({
-    "accordion-header-content": true,
-    [classNames?.headerContent ?? ""]: !!classNames?.headerContent
-  });
-  const toggleIconClassName = useClassNames({
-    "accordion-toggle-icon": true,
-    isOpen,
-    [classNames?.toggleIcon ?? ""]: !!classNames?.toggleIcon
-  });
-  const bodyContentClassName = useClassNames({
-    "accordion-body": true,
-    [classNames?.body ?? ""]: !!classNames?.body
-  });
-  const titleContent = getContent(title, isOpen);
-  const subtitleContent = getContent(subtitle, isOpen);
-  const headerStart = getContent(startContent, isOpen);
-  const headerMiddle = getContent(content, isOpen) ?? /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("section", { className: headerContentClassName, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Typography, { className: classNames?.title, variant: "body", noPadding: true, weight: "bold", children: titleContent }),
-    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Typography, { className: classNames?.subtitle, variant: "label", noPadding: true, weight: "light", children: subtitleContent })
-  ] });
-  const headerEnd = getContent(endContent, isOpen) ?? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Icon, { className: toggleIconClassName });
-  const accordionItemClassName = useClassNames({
-    "accordion-item": true,
-    [className]: Boolean(className)
-  });
-  return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("section", { className: accordionItemClassName, style, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("section", { className: headerClassName, onClick: toggle, children: [
-      headerStart,
-      headerMiddle,
-      headerEnd
-    ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(SlideCard, { isOpen, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("section", { className: bodyContentClassName, children }) })
-  ] });
-};
-
-// src/components/ripple/ripple.component.tsx
-var import_react20 = require("react");
-var import_jsx_runtime7 = require("react/jsx-runtime");
-var Ripple = ({
-  color,
-  duration = 1e3,
-  timingFunction = "ease-out",
-  times = 1,
-  className = "",
-  style = {},
-  zIndex = 1
-}) => {
-  const ref = (0, import_react20.useRef)(null);
-  (0, import_react20.useEffect)(() => {
-    if (!ref.current?.parentElement) {
-      return;
-    }
-    const computedPosition = getComputedStyle(ref.current.parentElement).position;
-    if (!["absolute", "fixed", "sticky", "relative"].includes(computedPosition)) {
-      ref.current.parentElement.style.position = "relative";
-    }
-  }, []);
-  const handleClick = (e) => {
-    const { pageX, pageY, currentTarget } = e;
-    const rect = currentTarget.getBoundingClientRect();
-    const x = (pageX - rect.left) * 100 / rect.width;
-    const y = (pageY - rect.top) * 100 / rect.height;
-    const ripple = document.createElement("span");
-    ripple.classList.add("ripple-effect");
-    ripple.style.animationDuration = `${duration}ms`;
-    ripple.style.animationTimingFunction = timingFunction;
-    ripple.style.left = `${x}%`;
-    ripple.style.top = `${y}%`;
-    if (color) {
-      ripple.style.background = color;
-    }
-    currentTarget.appendChild(ripple);
-    setTimeout(
-      () => {
-        ripple.remove();
-      },
-      Math.max(duration, 500) * Math.max(times, 1)
-    );
-  };
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { ref, onMouseDown: handleClick, className: `ripple ${className}`, style: { ...style, zIndex } });
-};
-
-// src/components/button/button.component.tsx
-var import_jsx_runtime8 = require("react/jsx-runtime");
-var Button = ({
-  children,
-  color = "default" /* DEFAULT */,
-  variant = "solid" /* SOLID */,
-  radius = "medium" /* MEDIUM */,
-  size = "regular" /* REGULAR */,
-  noWrap = false,
-  forIcon = false,
-  className = "",
-  ...props
-}) => {
-  const classNames = useClassNames({
-    button: true,
-    [color]: Boolean(color),
-    [variant]: Boolean(variant),
-    [`radius-${radius}`]: Boolean(radius),
-    [`size-${size}`]: Boolean(size),
-    "no-wrap": noWrap,
-    icon: forIcon,
-    [className]: Boolean(className)
-  });
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("button", { ...props, className: classNames, children: [
-    children,
-    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(Ripple, {})
-  ] });
-};
-
-// src/components/cursor/cursor.component.tsx
-var import_react21 = require("react");
-var import_jsx_runtime9 = require("react/jsx-runtime");
-var Cursor = () => {
-  const { x, y, elementX, elementY, ref } = useMousePosition();
-  const [isCursorHover, setIsCursorHover] = (0, import_react21.useState)(false);
-  useEventListener("mouseover", (e) => {
-    const computedCursor = getComputedStyle(e.target).cursor;
-    setIsCursorHover(computedCursor === "pointer");
-  });
-  (0, import_react21.useEffect)(() => {
-    if (!("ontouchstart" in window || navigator.maxTouchPoints)) {
-      document.body.style.cursor = "none";
-    }
-    return () => {
-      document.body.style.cursor = "auto";
-    };
-  }, []);
-  if (x === null || y === null || "ontouchstart" in window || navigator.maxTouchPoints) {
-    return null;
-  }
-  const translate3d = `translate3d(${elementX}px, ${elementY}px, 0)`;
-  return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("section", { className: "cursor-overlay", ref, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-      "span",
-      {
-        className: `cursor outer-circle ${isCursorHover ? "cursor-hover" : ""}`,
-        style: {
-          transform: translate3d
-        }
-      }
-    ),
-    /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-      "span",
-      {
-        className: `cursor inner-circle ${isCursorHover ? "cursor-hover" : ""}`,
-        style: {
-          transform: translate3d
-        }
-      }
-    )
-  ] });
-};
-
-// src/components/form/checkbox/checkbox.component.tsx
-var import_react22 = require("react");
-var import_io5 = require("react-icons/io5");
-
-// src/components/form/controller/controller.component.tsx
-var import_react_hook_form = require("react-hook-form");
-var import_jsx_runtime10 = require("react/jsx-runtime");
-var Controller = ({
-  Component,
-  inputProps,
-  defaultValue: fieldDefaultValue,
-  rules
-}) => {
-  const { control, setValue } = (0, import_react_hook_form.useFormContext)();
-  const { name, defaultValue } = inputProps;
-  return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
-    import_react_hook_form.Controller,
-    {
-      name,
-      control,
-      rules,
-      defaultValue: defaultValue ?? fieldDefaultValue,
-      render: ({ field: { onBlur, value }, fieldState }) => /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
-        Component,
-        {
-          value,
-          error: fieldState.error?.message,
-          invalid: fieldState.invalid,
-          isTouched: fieldState.isTouched,
-          isDirty: fieldState.isDirty,
-          setValue: (value2) => setValue(name, value2),
-          onBlur,
-          ...inputProps
-        }
-      )
-    }
-  );
-};
-
-// src/components/form/checkbox/checkbox.component.tsx
-var import_jsx_runtime11 = require("react/jsx-runtime");
-var Checkbox = ({
-  name,
-  value,
-  setValue,
-  onBlur,
-  onFocus,
-  className = "",
-  style = {},
-  autoFocus = false,
-  readOnly = false,
-  disabled = false,
-  autoComplete = "off",
-  icon: Icon = import_io5.IoCheckmarkOutline,
-  label,
-  color = "primary" /* PRIMARY */,
-  size = "regular" /* REGULAR */
-  /*
-   * isDirty = false,
-   * isTouched = false,
-   * invalid = false,
-   * error,
-   */
-}) => {
-  const id = (0, import_react22.useMemo)(() => crypto.randomUUID(), []);
-  const { handlers } = useInputHandlers({
-    onChange: (e) => setValue(e.target.checked),
-    onBlur,
-    onFocus
-  });
-  const checkboxContainerClassName = useClassNames({
-    "checkbox-container": true,
-    [className]: Boolean(className),
-    [`color-${color}`]: Boolean(color)
-  });
-  const checkboxClassName = useClassNames({
-    checkbox: true,
-    "is-checked": value,
-    [`size-${size}`]: Boolean(size)
-  });
-  return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("section", { className: checkboxContainerClassName, style, onClick: (e) => e.stopPropagation(), children: [
-    /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("section", { className: checkboxClassName, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("section", { className: "checkbox-fill", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(Icon, { size: "1.3em", className: "checkbox-icon" }) }),
-      /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
-        "input",
-        {
-          id,
-          type: "checkbox",
-          name,
-          className: "checkbox-input",
-          checked: value,
-          autoFocus,
-          autoComplete,
-          disabled: disabled || readOnly,
-          ...handlers
-        }
-      )
-    ] }),
-    label ? /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(Typography, { variant: "label-form", htmlFor: id, className: "checkbox-label", children: label }) : null
-  ] });
-};
-var CheckboxController = ({ rules, ...props }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(Controller, { Component: Checkbox, defaultValue: false, inputProps: props, rules });
-};
-Checkbox.Controller = CheckboxController;
-
-// src/components/form/date-picker/date-picker.component.tsx
-var import_react23 = require("react");
-
-// src/components/form/field/field.component.tsx
-var import_im = require("react-icons/im");
-
-// src/components/form/field/field.types.ts
-var FieldVariant = /* @__PURE__ */ ((FieldVariant2) => {
-  FieldVariant2["FULL_BORDER"] = "full-border";
-  FieldVariant2["CONTENT_BORDER"] = "content-border";
-  FieldVariant2["CONTENT_LINE"] = "line";
-  return FieldVariant2;
-})(FieldVariant || {});
-var FieldOrientation = /* @__PURE__ */ ((FieldOrientation2) => {
-  FieldOrientation2["HORIZONTAL"] = "horizontal";
-  FieldOrientation2["VERTICAL"] = "vertical";
-  return FieldOrientation2;
-})(FieldOrientation || {});
-
-// src/components/form/field/field.component.tsx
-var import_jsx_runtime12 = require("react/jsx-runtime");
-var getIcon = ({ icon: Icon, className, onClick }) => Icon ? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(Icon, { className, onClick }) : /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", {});
-var Field = ({
-  id,
-  label,
-  leftIcon,
-  rightIcon,
-  errorIcon: ErrorIcon = import_im.ImCross,
-  error,
-  onClickLeftIcon,
-  onClickRightIcon,
-  fieldOrientation = "vertical" /* VERTICAL */,
-  children,
-  isFocus = false,
-  variant,
-  ref
-}) => {
-  const fieldClassName = useClassNames({
-    "form-field": true,
-    focus: isFocus,
-    error: !!error,
-    "variant-content-border": variant === "content-border" /* CONTENT_BORDER */,
-    "variant-content-line": variant === "line" /* CONTENT_LINE */,
-    "variant-full-border": variant === "full-border" /* FULL_BORDER */,
-    "variant-inline": fieldOrientation === "horizontal" /* HORIZONTAL */
-  });
-  const handleClick = (callback) => (e) => {
-    e.stopPropagation();
-    const input = document.getElementById(id);
-    input?.focus();
-    input?.click();
-    if (callback) callback();
-  };
-  return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("section", { className: fieldClassName, ref, children: [
-    label ? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(Typography, { className: "field-label", noPadding: true, variant: "label-form", htmlFor: id, children: label }) : null,
-    /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("section", { className: "field-content", children: [
-      getIcon({
-        className: "field-left-icon",
-        icon: leftIcon,
-        onClick: handleClick(onClickLeftIcon)
-      }),
-      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("section", { className: "field-children", children }),
-      getIcon({
-        className: "field-right-icon",
-        icon: rightIcon,
-        onClick: handleClick(onClickRightIcon)
-      })
-    ] }),
-    Boolean(error) && /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("section", { className: "field-message", children: [
-      ErrorIcon ? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(ErrorIcon, { size: 10 }) : /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", {}),
-      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(Typography, { noPadding: true, variant: "small", children: error })
-    ] })
-  ] });
-};
-
-// src/components/form/date-picker/date-picker.component.tsx
-var import_jsx_runtime13 = require("react/jsx-runtime");
-var DatePicker = ({
-  name,
-  value,
-  setValue,
-  onBlur,
-  onFocus,
-  type = "date",
-  className = "",
-  style = {},
-  autoFocus = false,
-  readOnly = false,
-  disabled = false,
-  placeholder = "",
-  autoComplete = "off",
-  // eslint-disable-next-line @typescript-eslint/no-unused-vars
-  isDirty = false,
-  // eslint-disable-next-line @typescript-eslint/no-unused-vars
-  isTouched = false,
-  // eslint-disable-next-line @typescript-eslint/no-unused-vars
-  invalid = false,
-  error,
-  ...fieldProps
-}) => {
-  const id = (0, import_react23.useMemo)(() => crypto.randomUUID(), []);
-  const { isFocus, handlers } = useInputHandlers({
-    onBlur,
-    onChange: (e) => setValue(e.target.value),
-    onFocus
-  });
-  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(Field, { id, error, isFocus, ...fieldProps, children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
-    "input",
-    {
-      id,
-      type,
-      name,
-      className,
-      style,
-      value,
-      autoFocus,
-      autoComplete,
-      placeholder,
-      disabled,
-      readOnly,
-      ...handlers
-    }
-  ) });
-};
-var DatePickerController = ({ rules, ...props }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(Controller, { Component: DatePicker, defaultValue: "", inputProps: props, rules });
-};
-DatePicker.Controller = DatePickerController;
-
-// src/components/form/input/input.component.tsx
-var import_react24 = require("react");
-var import_jsx_runtime14 = require("react/jsx-runtime");
-var Input = ({
-  name,
-  value,
-  setValue,
-  onBlur,
-  onFocus,
-  pattern,
-  type = "text",
-  className = "",
-  style = {},
-  autoFocus = false,
-  readOnly = false,
-  disabled = false,
-  placeholder = "",
-  autoComplete = "off",
-  // eslint-disable-next-line @typescript-eslint/no-unused-vars
-  isDirty = false,
-  // eslint-disable-next-line @typescript-eslint/no-unused-vars
-  isTouched = false,
-  // eslint-disable-next-line @typescript-eslint/no-unused-vars
-  invalid = false,
-  error,
-  min,
-  max,
-  ...fieldProps
-}) => {
-  const id = (0, import_react24.useMemo)(() => crypto.randomUUID(), []);
-  const { handlers, isFocus } = useInputHandlers({
-    onChange: (e) => setValue(e.target.value),
-    onBlur,
-    onFocus
-  });
-  return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Field, { id, error, isFocus, ...fieldProps, children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
-    "input",
-    {
-      id,
-      type,
-      name,
-      className,
-      style,
-      value,
-      pattern,
-      autoFocus,
-      autoComplete,
-      placeholder,
-      disabled,
-      readOnly,
-      min,
-      max,
-      ...handlers
-    }
-  ) });
-};
-var InputController = ({ rules, ...props }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Controller, { Component: Input, defaultValue: "", inputProps: props, rules });
-};
-Input.Controller = InputController;
-
-// src/components/form/input-password/input-password.component.tsx
-var import_react25 = require("react");
-var import_fi = require("react-icons/fi");
-var import_io = require("react-icons/io");
-var import_jsx_runtime15 = require("react/jsx-runtime");
-var InputPassword = ({
-  name,
-  value,
-  setValue,
-  onBlur,
-  onFocus,
-  className = "",
-  style = {},
-  autoFocus = false,
-  readOnly = false,
-  disabled = false,
-  placeholder = "",
-  autoComplete = "off",
-  // eslint-disable-next-line @typescript-eslint/no-unused-vars
-  isDirty = false,
-  // eslint-disable-next-line @typescript-eslint/no-unused-vars
-  isTouched = false,
-  // eslint-disable-next-line @typescript-eslint/no-unused-vars
-  invalid = false,
-  error,
-  ...fieldProps
-}) => {
-  const id = (0, import_react25.useMemo)(() => crypto.randomUUID(), []);
-  const [type, toggle] = useToggleValues(["password", "text"]);
-  const { isFocus, handlers } = useInputHandlers({
-    onBlur,
-    onChange: (e) => setValue(e.target.value),
-    onFocus
-  });
-  const icon = (0, import_react25.useMemo)(() => {
-    if (type === "password") return import_fi.FiEye;
-    if (type === "text") return import_fi.FiEyeOff;
-    return import_io.IoIosWarning;
-  }, [type]);
-  return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(Field, { id, error, isFocus, ...fieldProps, rightIcon: icon, onClickRightIcon: () => toggle(), children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
-    "input",
-    {
-      id,
-      type,
-      name,
-      className,
-      style,
-      value,
-      autoFocus,
-      autoComplete,
-      placeholder,
-      disabled,
-      readOnly,
-      ...handlers
-    }
-  ) });
-};
-var InputPasswordController = ({ rules, ...props }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(Controller, { Component: InputPassword, defaultValue: "", inputProps: props, rules });
-};
-InputPassword.Controller = InputPasswordController;
-
-// src/components/form/input-color/input-color.component.tsx
-var import_color = __toESM(require("color"), 1);
-var import_react31 = require("react");
-var import_react_colorful = require("react-colorful");
-var import_fa6 = require("react-icons/fa6");
-var import_use_eye_dropper = __toESM(require("use-eye-dropper"), 1);
-
-// src/components/modals/action-modal/action-modal.component.tsx
-var import_react28 = require("react");
-var import_im2 = require("react-icons/im");
-
-// src/components/modals/modal/modal.component.tsx
-var import_react27 = require("react");
-
-// src/components/modals/portal/portal.component.tsx
-var import_react_dom = require("react-dom");
-var Portal = ({ children, id }) => {
-  const root = useDomContainer(id);
-  if (root === null) {
-    return null;
-  }
-  return (0, import_react_dom.createPortal)(children, root);
-};
-
-// src/components/modals/modal/modal.backdrop.tsx
-var import_react26 = require("react");
-var import_jsx_runtime16 = require("react/jsx-runtime");
-var ModalBackdrop = /* @__PURE__ */ ((ModalBackdrop2) => {
-  ModalBackdrop2["OPAQUE"] = "opaque";
-  ModalBackdrop2["TRANSPARENT"] = "transparent";
-  ModalBackdrop2["BLUR"] = "blur";
-  ModalBackdrop2["NONE"] = "none";
-  return ModalBackdrop2;
-})(ModalBackdrop || {});
-var Backdrop = ({
-  opacity = 0.6,
-  backdrop = "blur" /* BLUR */,
-  zIndex,
-  backdropOnClick,
-  modalState
-}) => {
-  const backdropClassName = useClassNames({
-    "modal-backdrop": true,
-    "backdrop-close": modalState === "CLOSING" /* CLOSING */ || modalState === "CLOSED" /* CLOSED */
-  });
-  const backgroundStyles = (0, import_react26.useMemo)(() => {
-    const backdropStyles = {
-      ["opaque" /* OPAQUE */]: {
-        background: `hsl(from var(--background-paper) h s l / ${opacity * 100}%)`
-      },
-      ["transparent" /* TRANSPARENT */]: {
-        background: "transparent"
-      },
-      ["blur" /* BLUR */]: {
-        background: `hsl(from var(--background-paper) h s l / ${opacity * 100}%)`,
-        backdropFilter: "blur(5px)"
-      },
-      ["none" /* NONE */]: {
-        display: "none"
-      }
-    };
-    return backdropStyles[backdrop] ?? {};
-  }, [backdrop, opacity]);
-  if (backdrop === "none" /* NONE */) {
-    return null;
-  }
-  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
-    "section",
-    {
-      tabIndex: -1,
-      onClick: backdropOnClick,
-      className: backdropClassName,
-      style: {
-        zIndex,
-        ...backgroundStyles
-      }
-    }
-  );
-};
-
-// src/components/modals/modal/modal.component.tsx
-var import_jsx_runtime17 = require("react/jsx-runtime");
-var Modal = ({
-  id,
-  children,
-  isOpen,
-  onClose,
-  className = "",
-  style = {},
-  rootStyle = {},
-  animation = "fade-down",
-  closeAnimationClassName = "modal-close",
-  modalRef: modalRefProp,
-  closeOnClickOutside = true,
-  transitionDuration = 300,
-  windowOffset = 10,
-  offset = 20,
-  position,
-  containerRef,
-  zIndex = 1e3,
-  ...backdropProps
-}) => {
-  const uuid = (0, import_react27.useMemo)(() => crypto.randomUUID(), []);
-  const modalRef = (0, import_react27.useRef)(null);
-  const { modalState, isVisible } = useModalTransition({
-    transitionDuration,
-    isOpen
-  });
-  useModalInContainer({
-    modalRef: modalRefProp ?? modalRef,
-    containerRef,
-    offset,
-    windowOffset,
-    position,
-    isOpen: isVisible
-  });
-  useClickOutside(modalRefProp ?? modalRef, () => {
-    if (isOpen && closeOnClickOutside) {
-      onClose();
-    }
-  });
-  const modalContentClassName = useClassNames({
-    "modal-content": true,
-    [className]: Boolean(className),
-    [`animation-${animation}`]: Boolean(animation) && animation !== "none",
-    [closeAnimationClassName]: modalState === "CLOSING" /* CLOSING */ || modalState === "CLOSED" /* CLOSED */
-  });
-  if (!isVisible) {
-    return null;
-  }
-  return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(Portal, { id: `modal-${id}-${uuid}`, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(Backdrop, { ...backdropProps, modalState, zIndex }),
-    /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
-      "section",
-      {
-        className: "modal",
-        ref: modalRefProp ?? modalRef,
-        style: {
-          maxWidth: `calc(100dvw - ${windowOffset * 2}px)`,
-          maxHeight: `calc(100dvh - ${windowOffset * 2}px)`,
-          ...rootStyle,
-          zIndex: +zIndex + 1
-        },
-        children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("section", { style: { ...style, animationDuration: `${transitionDuration}ms` }, className: modalContentClassName, children })
-      }
-    )
-  ] });
-};
-
-// src/components/modals/action-modal/action-modal.component.tsx
-var import_jsx_runtime18 = require("react/jsx-runtime");
-var ActionModalContext = (0, import_react28.createContext)(null);
-var useActionModalContext = () => {
-  const context = (0, import_react28.useContext)(ActionModalContext);
-  if (!context) {
-    throw new Error("useActionModalContext must be used within a ActionModal");
-  }
-  return context;
-};
-var ActionModal = ({
-  children,
-  isOpen,
-  onClose,
-  actionRequired,
-  icon: Icon,
-  noCloseButton,
-  lineOnTop = false,
-  backCard = false,
-  noPadding = false,
-  className = "",
-  style = {},
-  ...modalProps
-}) => {
-  const [isActionInProgress, setIsActionInProgress] = (0, import_react28.useState)(false);
-  const ref = (0, import_react28.useRef)(null);
-  const remainAction = (0, import_react28.useCallback)(() => {
-    ref.current?.classList.add("shake-animation");
-    setTimeout(() => {
-      ref.current?.classList.remove("shake-animation");
-    }, 500);
-  }, []);
-  const actionModalClassName = useClassNames({
-    "action-modal-content": true,
-    "back-card": backCard,
-    "line-on-top": lineOnTop,
-    "no-padding": noPadding
-  });
-  return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(ActionModalContext.Provider, { value: { onClose, isActionInProgress, setIsActionInProgress }, children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
-    Modal,
-    {
-      className: "action-modal",
-      id: "action-modal",
-      animation: "bounce",
-      opacity: 0.8,
-      isOpen,
-      onClose,
-      ...modalProps,
-      backdropOnClick: actionRequired ? remainAction : onClose,
-      position: "center" /* CENTER */,
-      children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("section", { ref, className: "modal-content", children: /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("section", { className: actionModalClassName, children: [
-        !noCloseButton && !actionRequired && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("section", { className: "close-modal-button", onClick: () => onClose(), children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_im2.ImCross, {}) }),
-        Icon ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(Typography, { variant: "header4", className: "action-modal-icon", children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(Icon, {}) }) : null,
-        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("section", { className: "action-modal-body", children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("section", { className: `action-modal-content ${className}`, style, children }) })
-      ] }) })
-    }
-  ) });
-};
-var ActionButton = ({ onClick, children, isLoading: manualIsLoading, ...buttonProps }) => {
-  const { onClose, isActionInProgress, setIsActionInProgress } = useActionModalContext();
-  const [isLoading, setIsLoading] = (0, import_react28.useState)(false);
-  const handleAction = (0, import_react28.useCallback)(() => {
-    setIsLoading(true);
-    setIsActionInProgress(true);
-    const result = onClick();
-    if (result instanceof Promise) {
-      result.then(() => {
-        onClose();
-        setIsLoading(false);
-        setIsActionInProgress(false);
-      });
-    } else {
-      onClose();
-      setIsLoading(false);
-      setIsActionInProgress(false);
-    }
-  }, [onClick, onClose, setIsActionInProgress]);
-  if (!isLoading && isActionInProgress) {
-    return null;
-  }
-  return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(Button, { ...buttonProps, onClick: handleAction, isLoading: manualIsLoading || isLoading, children });
-};
-ActionModal.ActionButton = ActionButton;
-
-// src/components/modals/aside-modal/aside-modal.component.tsx
-var import_react29 = require("react");
-var import_im3 = require("react-icons/im");
-var import_jsx_runtime19 = require("react/jsx-runtime");
-var AsideModal = ({
-  children,
-  isOpen,
-  onClose,
-  position = "left" /* LEFT */,
-  size,
-  className = "",
-  ...modalProps
-}) => {
-  const modalRootStyles = (0, import_react29.useMemo)(() => {
-    const computedSize = {
-      ["top" /* TOP */]: { height: size, width: "100%" },
-      ["left" /* LEFT */]: { height: "100%", width: size },
-      ["right" /* RIGHT */]: { height: "100%", width: size },
-      ["bottom" /* BOTTOM */]: { height: size, width: "100%" }
-    };
-    return computedSize[position];
-  }, [position, size]);
-  return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
-    Modal,
-    {
-      id: "aside",
-      isOpen,
-      onClose,
-      opacity: 0.6,
-      windowOffset: 0,
-      animation: "none",
-      className: `aside-modal ${className} ${position}`,
-      rootStyle: modalRootStyles,
-      backdropOnClick: onClose,
-      position,
-      ...modalProps,
-      children: [
-        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { className: "close-modal-button", onClick: onClose, children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_im3.ImCross, {}) }),
-        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("section", { className: "aside-modal-content", children })
-      ]
-    }
-  );
-};
-
-// src/components/modals/confirmation-modal/confirmation-modal.component.tsx
-var import_jsx_runtime20 = require("react/jsx-runtime");
-var ConfirmationModal = ({
-  title,
-  onAccept,
-  onReject = () => null,
-  acceptText,
-  rejectText,
-  children,
-  isLoading,
-  ...actionModalProps
-}) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(ActionModal, { ...actionModalProps, backCard: true, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("section", { className: "confirmation-modal", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(Typography, { variant: "header4", children: title }),
-    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("section", { children }),
-    /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("section", { className: "confirmation-modal-actions", children: [
-      !isLoading && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(ActionModal.ActionButton, { variant: "flat", onClick: onReject, children: rejectText }),
-      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(ActionModal.ActionButton, { isLoading, onClick: onAccept, children: acceptText })
-    ] })
-  ] }) });
-};
-
-// src/components/modals/menu/menu.component.tsx
-var import_react30 = require("react");
-var import_jsx_runtime21 = require("react/jsx-runtime");
-var Menu = ({
-  children,
-  isOpen,
-  onClose,
-  id,
-  menuContentRef,
-  contentClassName = "",
-  contentStyle = {},
-  className = "",
-  ...modalProps
-}) => {
-  const modalClassName = useClassNames({
-    "menu-modal": true,
-    [className]: Boolean(className)
-  });
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Modal, { className: modalClassName, ...modalProps, id: `menu-${id}`, isOpen, onClose, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("ul", { className: `menu-content ${contentClassName}`, role: "listbox", style: contentStyle, ref: menuContentRef, children }) });
-};
-var MenuOption = ({
-  children,
-  label = "",
-  asCheckbox,
-  icon: Icon,
-  id,
-  disabled = false,
-  selected = false,
-  className = "",
-  style = {},
-  onClick = () => null,
-  ...liProps
-}) => {
-  const menuOptionClassName = useClassNames({
-    "menu-option": true,
-    [className]: true,
-    "is-disabled": disabled,
-    "is-selected": selected
-  });
-  const handleClick = (0, import_react30.useCallback)(
-    (e) => {
-      e.stopPropagation();
-      if (!disabled) {
-        onClick(!selected);
-      }
-    },
-    [disabled, onClick, selected]
-  );
-  const menuOptionContent = (0, import_react30.useMemo)(() => {
-    if (children) {
-      return children;
-    }
-    if (asCheckbox) {
-      return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
-        Checkbox,
-        {
-          className: "menu-checkbox",
-          disabled,
-          value: selected,
-          setValue: (n) => onClick(n),
-          name: "option",
-          style: { pointerEvents: "none" },
-          size: "small",
-          label: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_jsx_runtime21.Fragment, { children: [
-            Icon !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Icon, { className: "option-icon" }),
-            /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Typography, { variant: "label", children: label })
-          ] })
-        }
-      );
-    }
-    return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_jsx_runtime21.Fragment, { children: [
-      Icon !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Icon, { className: "option-icon" }),
-      typeof label === "string" ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Typography, { variant: "label", children: label }) : label
-    ] });
-  }, [asCheckbox, children, disabled, Icon, label, onClick, selected]);
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
-    "li",
-    {
-      ...liProps,
-      id,
-      role: "option",
-      tabIndex: -1,
-      "aria-selected": selected,
-      "aria-disabled": disabled,
-      onClick: handleClick,
-      className: menuOptionClassName,
-      style,
-      children: [
-        /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Ripple, { zIndex: 10 }),
-        menuOptionContent
-      ]
-    }
-  );
-};
-var Divider = () => {
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("li", { children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Line, { className: "divider" }) });
-};
-var Label = ({ children, className = "", ...props }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("li", { tabIndex: -1, className: "menu-label", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Typography, { ...props, variant: "small", className: `menu-group-label ${className}`, children }) });
-};
-var Group = ({
-  children,
-  label,
-  className = "",
-  style = {},
-  contentClassName = "",
-  contentStyle = {},
-  ...props
-}) => {
-  const groupClassName = useClassNames({
-    "menu-group": true,
-    [className]: Boolean(className)
-  });
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("li", { tabIndex: -1, ...props, className: groupClassName, style, children: [
-    label && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Label, { children: label }),
-    /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("ul", { className: `menu-group-content ${contentClassName}`, role: "listbox", style: contentStyle, children })
-  ] });
-};
-Menu.Option = MenuOption;
-Menu.Divider = Divider;
-Menu.GroupLabel = Label;
-Menu.Group = Group;
-
-// src/components/form/input-color/input-color.component.tsx
-var import_jsx_runtime22 = require("react/jsx-runtime");
-var InputColor = ({
-  name,
-  value,
-  setValue,
-  onBlur,
-  onFocus,
-  showValueText = false,
-  className = "",
-  style = {},
-  autoFocus = false,
-  readOnly = false,
-  disabled = false,
-  placeholder = "",
-  autoComplete = "off",
-  // eslint-disable-next-line @typescript-eslint/no-unused-vars
-  isDirty = false,
-  // eslint-disable-next-line @typescript-eslint/no-unused-vars
-  isTouched = false,
-  // eslint-disable-next-line @typescript-eslint/no-unused-vars
-  invalid = false,
-  error,
-  ...fieldProps
-}) => {
-  const { open, isSupported } = (0, import_use_eye_dropper.default)();
-  const [inputValue, setInputValue] = (0, import_react31.useState)(value);
-  const id = (0, import_react31.useMemo)(() => crypto.randomUUID(), []);
-  const containerRef = (0, import_react31.useRef)(null);
-  const [isOpen, setIsOpen] = (0, import_react31.useState)(false);
-  const { handlers, isFocus } = useInputHandlers({
-    onChange: (e) => setInputValue(e.target.value),
-    onBlur: (e) => {
-      setInputColor();
-      if (onBlur) onBlur(e);
-    },
-    onFocus: (e) => {
-      setInputColor();
-      if (onFocus) onFocus(e);
-    }
-  });
-  const borderColor = (0, import_react31.useMemo)(() => {
-    const color = (0, import_color.default)(value === "" ? "#000000" : value);
-    if (color.isLight() || color.alpha() < 0.5) {
-      return "#000000";
-    }
-    return "#FFFFFF";
-  }, [value]);
-  const openEyeDropper = async () => {
-    const { sRGBHex } = await open();
-    setValue(sRGBHex);
-  };
-  (0, import_react31.useEffect)(() => {
-    setInputValue(value);
-  }, [value]);
-  const setInputColor = (0, import_react31.useCallback)(() => {
-    if (inputValue.match(/^#(?:(?:[\da-f]{3}){1,2}|(?:[\da-f]{4}){1,2})$/i)) {
-      setValue(inputValue);
-    } else {
-      setInputValue(value);
-    }
-  }, [inputValue, setValue, value]);
-  const inputBoxClassName = useClassNames({
-    "input-color-box": true,
-    [className]: Boolean(className)
-  });
-  return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(Field, { id, error, isFocus, ...fieldProps, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
-      "section",
-      {
-        className: "input-color",
-        onClick: (e) => {
-          e.stopPropagation();
-          setIsOpen(true);
-        },
-        ref: containerRef,
-        children: [
-          /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
-            "section",
-            {
-              className: inputBoxClassName,
-              style: {
-                borderColor,
-                background: value,
-                color: value,
-                ...style
-              }
-            }
-          ),
-          showValueText ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
-            "input",
-            {
-              id,
-              name,
-              value: inputValue,
-              placeholder,
-              readOnly,
-              autoFocus,
-              disabled,
-              autoComplete,
-              className: "color-input",
-              ...handlers
-            }
-          ) : null
-        ]
-      }
-    ),
-    /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
-      Modal,
-      {
-        id: "input-color",
-        isOpen,
-        onClose: () => setIsOpen(false),
-        position: "bottom right",
-        offset: 5,
-        backdrop: "transparent",
-        containerRef,
-        className: "input-color-selector",
-        children: [
-          /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_react_colorful.HexAlphaColorPicker, { id, color: value, onChange: setValue }),
-          /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("section", { className: "color-input-container", children: [
-            isSupported() ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
-              import_fa6.FaEyeDropper,
-              {
-                onClick: () => {
-                  void openEyeDropper();
-                }
-              }
-            ) : /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", {}),
-            /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
-              import_react_colorful.HexColorInput,
-              {
-                className: "color-input",
-                id,
-                name,
-                color: value,
-                placeholder: "Type a color",
-                prefixed: true,
-                alpha: true,
-                onChange: setValue
-              }
-            ),
-            /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", {})
-          ] })
-        ]
-      }
-    )
-  ] });
-};
-var InputColorController = ({ rules, ...props }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Controller, { Component: InputColor, defaultValue: "#147EFB", inputProps: props, rules });
-};
-InputColor.Controller = InputColorController;
-
-// src/components/form/input-file/input-file.component.tsx
-var import_react33 = require("react");
-var import_fa62 = require("react-icons/fa6");
-var import_io2 = require("react-icons/io");
-var import_pi = require("react-icons/pi");
-
-// src/layouts/grid/grid.component.tsx
-var import_react32 = require("react");
-var Grid = ({
-  tag = "section",
-  children,
-  className,
-  style,
-  flow,
-  columnSize,
-  rowSize,
-  column,
-  row,
-  pc,
-  pi,
-  ps,
-  jc,
-  ji,
-  js,
-  ac,
-  ai,
-  as,
-  gtc,
-  gtr,
-  gta,
-  gt,
-  gap,
-  ...props
-}) => {
-  return (0, import_react32.createElement)(
-    tag,
-    {
-      className,
-      ...props,
-      style: {
-        ...style,
-        ...flow ? { gridAutoFlow: flow } : {},
-        ...columnSize ? { gridAutoColumns: columnSize } : {},
-        ...rowSize ? { gridAutoRows: rowSize } : {},
-        ...column ? { gridColumn: column } : {},
-        ...row ? { gridRow: row } : {},
-        ...pc ? { placeContent: pc } : {},
-        ...pi ? { placeItems: pi } : {},
-        ...ps ? { placeSelf: ps } : {},
-        ...jc ? { justifyContent: jc } : {},
-        ...ji ? { justifyItems: ji } : {},
-        ...js ? { justifySelf: js } : {},
-        ...ac ? { alignContent: ac } : {},
-        ...ai ? { alignItems: ai } : {},
-        ...as ? { alignSelf: as } : {},
-        ...gtc ? { gridTemplateColumns: gtc } : {},
-        ...gtr ? { gridTemplateRows: gtr } : {},
-        ...gta ? { gridTemplateAreas: gta } : {},
-        ...gt ? { gridTemplate: gt } : {},
-        ...gap ? { gap } : {},
-        display: "grid"
-      }
-    },
-    children
-  );
-};
-
-// src/components/form/input-file/input-file.component.tsx
-var import_jsx_runtime23 = require("react/jsx-runtime");
-var InputFile = ({
-  name,
-  value = {},
-  setValue,
-  onBlur,
-  onFocus,
-  className = "",
-  style = {},
-  autoFocus = false,
-  readOnly = false,
-  disabled = false,
-  placeholder = "Click to upload or drag and drop",
-  autoComplete = "off",
-  accept,
-  multiple = false,
-  limitSize = 5e6,
-  errorTimeout = 3e3,
-  label
-  /*
-   * isDirty = false,
-   * isTouched = false,
-   * invalid = false,
-   * error,
-   */
-}) => {
-  const [error, setError] = (0, import_react33.useState)(null);
-  const id = (0, import_react33.useMemo)(() => crypto.randomUUID(), []);
-  const { handlers } = useInputHandlers({
-    onBlur,
-    onFocus,
-    onChange: (e) => {
-      const { files } = e.target;
-      if (files) saveFiles(files);
-    }
-  });
-  (0, import_react33.useEffect)(() => {
-    let intervalId = null;
-    if (error !== null) {
-      intervalId = setTimeout(() => {
-        setError(null);
-      }, errorTimeout);
-    }
-    return () => {
-      if (intervalId !== null) {
-        clearTimeout(intervalId);
-      }
-    };
-  }, [error, errorTimeout]);
-  const saveFiles = (files) => {
-    const finalFiles = multiple ? { ...value } : {};
-    const filesToCheck = multiple ? files.length : 1;
-    for (let i = 0; i < filesToCheck; i++) {
-      const file = files.item(i);
-      if (!file) {
-        continue;
-      }
-      if (file.size < limitSize) {
-        finalFiles[file.name] = file;
-      } else {
-        setError(`File '${file.name}' size is larger than ${formatBytes(limitSize)}`);
-      }
-    }
-    setValue(finalFiles);
-  };
-  const handleDrop = (e) => {
-    e.preventDefault();
-    e.stopPropagation();
-    if (e.dataTransfer.files && e.dataTransfer.files.length) {
-      saveFiles(e.dataTransfer.files);
-    }
-  };
-  const getIconType = (0, import_react33.useCallback)((type) => {
-    const iconTypes = {
-      ["image/png" /* PNG */]: import_pi.PiFilePngFill,
-      ["application/pdf" /* PDF */]: import_pi.PiFilePdfFill
-    };
-    return iconTypes[type] ?? import_io2.IoIosWarning;
-  }, []);
-  const deleteFile = (file) => {
-    const prevValue = { ...value };
-    delete prevValue[file.name];
-    setValue(prevValue);
-  };
-  const deleteAll = () => {
-    setValue({});
-  };
-  const totalSize = (0, import_react33.useMemo)(() => Object.values(value).reduce((prev, { size }) => prev + size, 0), [value]);
-  const renderFileToCard = (file, key) => {
-    const Icon = getIconType(file.type);
-    return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("section", { className: "input-file-card", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("section", { className: "file-card--image", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Icon, {}) }),
-      /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(Grid, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Typography, { variant: "label", noPadding: true, nowrap: true, children: file.name }),
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Typography, { noPadding: true, variant: "small", children: formatBytes(file.size) })
-      ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("section", { className: "file-card--delete", onClick: () => deleteFile(file), children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_fa62.FaRegTrashCan, {}) })
-    ] }, key);
-  };
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("section", { className: "input-file-container", children: [
-    Boolean(label) && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Typography, { variant: "label-form", htmlFor: id, noPadding: true, children: label }),
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("section", { className: "input-file--box", onDrop: handleDrop, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("section", { className: "input-file--box--icon", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_fa62.FaMagnifyingGlass, {}) }),
-      /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(Grid, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Typography, { variant: "label-form", htmlFor: id, noPadding: true, weight: "bold", children: placeholder }),
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(Typography, { variant: "small", noPadding: true, children: [
-          "Max size (",
-          formatBytes(limitSize),
-          ")"
-        ] })
-      ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
-        "input",
-        {
-          id,
-          type: "file",
-          name,
-          value: "",
-          placeholder,
-          readOnly,
-          autoFocus,
-          disabled,
-          autoComplete,
-          className,
-          style,
-          accept,
-          multiple,
-          title: "",
-          ...handlers
-        }
-      )
-    ] }),
-    error !== null && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Typography, { variant: "small", noPadding: true, className: "error", children: error }),
-    Object.keys(value).length > 0 && /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(import_jsx_runtime23.Fragment, { children: [
-      multiple && /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("span", { className: "total-info", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(Typography, { variant: "small", noPadding: true, children: [
-          Object.keys(value).length,
-          " files - ",
-          formatBytes(totalSize)
-        ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: "total-info--delete", onClick: deleteAll, children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_fa62.FaRegTrashCan, {}) })
-      ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("section", { className: "input-file--files", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("section", { className: "input-file--files--content", children: Object.values(value).map(renderFileToCard) }) })
-    ] })
-  ] });
-};
-var InputFileController = ({ rules, ...props }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Controller, { Component: InputFile, defaultValue: {}, inputProps: props, rules });
-};
-InputFile.Controller = InputFileController;
-
-// src/components/form/input-number/input-number.component.tsx
-var import_react34 = require("react");
-var import_jsx_runtime24 = require("react/jsx-runtime");
-var RegexDecimal = {
-  comma: /(?!^-)[^0-9,]/g,
-  dot: /(?!^-)[^0-9.]/g
-};
-var getCleanedValue = (input, decimalSeparator = ".") => {
-  const regex = decimalSeparator === "." ? RegexDecimal.dot : RegexDecimal.comma;
-  const cleaned = input.replace(regex, "").replace(",", ".");
-  if (!cleaned) {
-    return "";
-  }
-  return cleaned;
-};
-var getFormattedValue = (value, format) => {
-  if (!value || Number.isNaN(value)) {
-    return format(0);
-  }
-  return format(value);
-};
-var InputNumber = ({
-  name,
-  value,
-  setValue,
-  onBlur,
-  onFocus,
-  pattern,
-  className = "",
-  style = {},
-  autoFocus = false,
-  readOnly = false,
-  disabled = false,
-  placeholder = "",
-  autoComplete = "off",
-  // eslint-disable-next-line @typescript-eslint/no-unused-vars
-  isDirty = false,
-  // eslint-disable-next-line @typescript-eslint/no-unused-vars
-  isTouched = false,
-  // eslint-disable-next-line @typescript-eslint/no-unused-vars
-  invalid = false,
-  error,
-  min,
-  max,
-  decimalSeparator,
-  format = {
-    locales: "en-US",
-    style: "decimal",
-    minimumFractionDigits: 0,
-    maximumFractionDigits: 2
-  },
-  ...fieldProps
-}) => {
-  const id = (0, import_react34.useMemo)(() => crypto.randomUUID(), []);
-  const formatFunction = (0, import_react34.useMemo)(() => {
-    if (typeof format === "function") return format;
-    const { locales, ...formatConfig } = format;
-    return Intl.NumberFormat(locales, formatConfig).format;
-  }, [format]);
-  const [formattedValue, setFormattedValue] = (0, import_react34.useState)(getFormattedValue(value, formatFunction));
-  const { handlers, isFocus } = useInputHandlers({
-    onChange: (e) => {
-      const cleaned = getCleanedValue(e.target.value, decimalSeparator);
-      if (cleaned.endsWith(".")) {
-        setFormattedValue(e.target.value);
-      } else {
-        setFormattedValue(getFormattedValue(Number(cleaned), formatFunction));
-        setValue(Number(cleaned));
-      }
-    },
-    onBlur: (e) => {
-      const cleaned = getCleanedValue(e.target.value, decimalSeparator);
-      setFormattedValue(getFormattedValue(Number(cleaned), formatFunction));
-      setValue(Number(cleaned));
-      if (onBlur) onBlur(e);
-    },
-    onFocus
-  });
-  (0, import_react34.useEffect)(() => {
-    const formatted = getFormattedValue(value, formatFunction);
-    if (formattedValue !== formatted) {
-      setFormattedValue(formatted);
-    }
-  }, [formatFunction, formattedValue, value]);
-  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Field, { id, error, isFocus, ...fieldProps, children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
-    "input",
-    {
-      id,
-      type: "text",
-      name,
-      className,
-      style,
-      value: formattedValue,
-      pattern,
-      autoFocus,
-      autoComplete,
-      placeholder,
-      disabled,
-      readOnly,
-      min,
-      max,
-      ...handlers
-    }
-  ) });
-};
-var InputController2 = ({ rules, ...props }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Controller, { Component: InputNumber, defaultValue: 0, inputProps: props, rules });
-};
-InputNumber.Controller = InputController2;
-
-// src/components/form/radio/radio.component.tsx
-var import_react35 = require("react");
-var import_jsx_runtime25 = require("react/jsx-runtime");
-var Radio = ({
-  name,
-  value,
-  setValue,
-  onBlur,
-  onFocus,
-  className = "",
-  style = {},
-  autoFocus = false,
-  readOnly = false,
-  disabled = false,
-  autoComplete = "off",
-  radioValue,
-  label,
-  color = "primary" /* PRIMARY */,
-  size = "regular" /* REGULAR */
-  /*
-   * isDirty = false,
-   * isTouched = false,
-   * invalid = false,
-   * error,
-   */
-}) => {
-  const id = (0, import_react35.useMemo)(() => crypto.randomUUID(), []);
-  const { handlers } = useInputHandlers({
-    onChange: (e) => setValue(e.target.value),
-    onBlur,
-    onFocus
-  });
-  const radioContainerClassName = useClassNames({
-    "radio-container": true,
-    [className]: Boolean(className),
-    [`color-${color}`]: Boolean(color)
-  });
-  const radioClassName = useClassNames({
-    radio: true,
-    "is-checked": radioValue === value,
-    [`size-${size}`]: Boolean(size)
-  });
-  return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("section", { className: radioContainerClassName, style, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("section", { className: radioClassName, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("section", { className: "radio-fill" }),
-      /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
-        "input",
-        {
-          id,
-          type: "radio",
-          name,
-          className: `radio-input ${className}`,
-          style,
-          value: radioValue,
-          checked: radioValue === value,
-          autoFocus,
-          autoComplete,
-          disabled: disabled || readOnly,
-          ...handlers
-        }
-      )
-    ] }),
-    label ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Typography, { variant: "label-form", htmlFor: id, className: "radio-label", children: label }) : null
-  ] });
-};
-var RadioController = ({ rules, ...props }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Controller, { Component: Radio, defaultValue: "", inputProps: props, rules });
-};
-Radio.Controller = RadioController;
-
-// src/components/form/select/select.component.tsx
-var import_react39 = require("react");
-var import_im4 = require("react-icons/im");
-var import_pi2 = require("react-icons/pi");
-
-// src/components/infinity-scroll/infinity-scroll.component.tsx
-var import_react36 = require("react");
-var import_jsx_runtime26 = require("react/jsx-runtime");
-var InfinityScroll = ({
-  isLoading: isLoadingProp = false,
-  hasNextPage = false,
-  loadMore,
-  customLoadMoreElement,
-  emptyMessage,
-  children
-}) => {
-  const { ref, inView } = useInView();
-  const isLoading = useDebounce(isLoadingProp, 100);
-  (0, import_react36.useEffect)(() => {
-    if (hasNextPage && inView && !isLoading) {
-      loadMore();
-    }
-  }, [hasNextPage, isLoading, loadMore, inView]);
-  const childrenExists = Array.isArray(children) ? children.length > 0 : Boolean(children);
-  return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(import_jsx_runtime26.Fragment, { children: [
-    children,
-    /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("section", { className: "infinity-scroll", children: [
-      Boolean(emptyMessage) && !childrenExists && !isLoading && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("p", { className: "empty-message", children: emptyMessage }),
-      (hasNextPage || isLoading) && (customLoadMoreElement ? customLoadMoreElement(ref) : /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("section", { ref, className: "loading", children: isLoading && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("span", { className: "loading--icon", children: ":D" }) }))
-    ] })
-  ] });
-};
-
-// src/components/form/select/option.tsx
-var import_react37 = require("react");
-var import_jsx_runtime27 = require("react/jsx-runtime");
-var Option = ({ children, value }) => {
-  const { multiselect, isEqualComparator, maxOptions, selectedValue, setValue, setIsOpen } = useSelectContext();
-  const compareValuesIsEqual = (0, import_react37.useCallback)(
-    (a, b) => {
-      if (["number", "string"].includes(typeof a)) {
-        return a === b;
-      }
-      return !!isEqualComparator && isEqualComparator(a, b);
-    },
-    [isEqualComparator]
-  );
-  const toggleOption = (0, import_react37.useCallback)(
-    (isSelected2) => {
-      if (isSelected2) {
-        if (multiselect) {
-          if (maxOptions && Array.isArray(selectedValue) && selectedValue.length >= maxOptions) {
-            return;
-          }
-          setValue([...selectedValue, value]);
-        } else {
-          setValue(value);
-          setIsOpen(false);
-        }
-      } else {
-        if (multiselect) {
-          setValue(selectedValue.filter((item) => !compareValuesIsEqual(item, value)));
-        } else {
-          setValue(null);
-          setIsOpen(false);
-        }
-      }
-    },
-    [multiselect, maxOptions, selectedValue, setValue, value, setIsOpen, compareValuesIsEqual]
-  );
-  const isSelected = (0, import_react37.useMemo)(() => {
-    if (selectedValue === "" || selectedValue === null) {
-      return false;
-    }
-    if (!Array.isArray(selectedValue)) {
-      return compareValuesIsEqual(value, selectedValue);
-    }
-    if (["number", "string"].includes(typeof value)) {
-      return selectedValue.includes(value);
-    }
-    return selectedValue.some((item) => !!isEqualComparator && isEqualComparator(value, item));
-  }, [compareValuesIsEqual, isEqualComparator, selectedValue, value]);
-  const handleKeyDown = (0, import_react37.useCallback)(
-    (e) => {
-      if (["Enter", " "].includes(e.key)) {
-        e.preventDefault();
-        toggleOption(!(isSelected && multiselect));
-      }
-    },
-    [toggleOption, isSelected, multiselect]
-  );
-  const optionLabel = (0, import_react37.useMemo)(() => {
-    if (typeof children === "string") {
-      return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(Typography, { "data-value": value, variant: "label", nowrap: true, children });
-    }
-    return children;
-  }, [children, value]);
-  return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
-    Menu.Option,
-    {
-      label: optionLabel,
-      onKeyDown: handleKeyDown,
-      asCheckbox: multiselect,
-      selected: isSelected,
-      onClick: (selected) => toggleOption(multiselect ? selected : true)
-    }
-  );
-};
-
-// src/components/form/select/options.tsx
-var import_react38 = require("react");
-var import_jsx_runtime28 = require("react/jsx-runtime");
-var useDynamicHeight = ({
-  height,
-  minHeight: defaultMinHeight,
-  containerRef,
-  offset,
-  windowOffset
-}) => {
-  const [h, setH] = (0, import_react38.useState)(void 0);
-  const getMaxHeight = (0, import_react38.useCallback)(() => {
-    const containerBottom = containerRef.current?.getBoundingClientRect().bottom ?? 0;
-    const heightBottom = window.innerHeight - containerBottom - windowOffset - offset - 5;
-    const heightTop = window.innerHeight - windowOffset * 3;
-    const heightCalculated = heightBottom < defaultMinHeight ? heightTop : heightBottom;
-    const maxHeight = Math.min(heightCalculated, height);
-    const minHeight = Math.max(maxHeight, defaultMinHeight);
-    setH(`${Math.round(minHeight)}px`);
-  }, [containerRef, windowOffset, offset, defaultMinHeight, height]);
-  (0, import_react38.useEffect)(() => {
-    getMaxHeight();
-  }, [getMaxHeight]);
-  useResizeObserver(containerRef, getMaxHeight);
-  useEventListener("resize", getMaxHeight);
-  return { h };
-};
-var Options = ({
-  children,
-  searchQueryValue,
-  searchQueryPlaceholder = "Search option",
-  searchQueryClassName = "",
-  searchQueryStyle = {},
-  onSearchQuery,
-  containerRef,
-  height = 300
-}) => {
-  const optionsGroupContainerRef = (0, import_react38.useRef)(null);
-  const optionsGroupRef = (0, import_react38.useRef)(null);
-  const [internalSearchQuery, setInternalSearchQuery] = (0, import_react38.useState)("");
-  const searchInputRef = (0, import_react38.useRef)(null);
-  const isMobile = useMediaQuery("(max-width: 480px)");
-  useEventListener("keydown", (e) => {
-    if (["ArrowDown", "ArrowUp"].includes(e.code)) {
-      e.preventDefault();
-      const focusedItem = document.activeElement;
-      const isListItem = focusedItem?.tagName === "LI";
-      if (isListItem) {
-        switch (e.code) {
-          case "ArrowDown":
-            focusedItem?.nextSibling?.focus();
-            break;
-          case "ArrowUp":
-            focusedItem?.previousElementSibling?.focus();
-            break;
-        }
-      }
-    }
-  });
-  const handleSearchQuery = (0, import_react38.useCallback)(
-    (e) => {
-      const { value } = e.target;
-      if (onSearchQuery) onSearchQuery(value);
-      setInternalSearchQuery(value);
-    },
-    [onSearchQuery]
-  );
-  (0, import_react38.useEffect)(() => {
-    if (searchInputRef.current) {
-      searchInputRef.current.focus();
-    }
-  }, []);
-  const { h } = useDynamicHeight({
-    height,
-    minHeight: 150,
-    containerRef,
-    offset: 5,
-    windowOffset: 10
-  });
-  const [shouldUseAuto, setShouldUseAuto] = (0, import_react38.useState)(false);
-  const calculateHeight = (0, import_react38.useCallback)(() => {
-    const optionsContainerHeight = Math.round(optionsGroupContainerRef.current?.getBoundingClientRect().height ?? 0) + 2;
-    const optionsHeight = Math.round(optionsGroupRef.current?.scrollHeight ?? 0);
-    setShouldUseAuto(optionsContainerHeight >= optionsHeight);
-  }, []);
-  (0, import_react38.useEffect)(calculateHeight, [calculateHeight]);
-  useResizeObserver(optionsGroupContainerRef, calculateHeight);
-  useResizeObserver(optionsGroupRef, calculateHeight);
-  useEventListener("resize", calculateHeight);
-  const selectOptionsHeader = useClassNames({
-    "select-options-header": true,
-    [searchQueryClassName]: Boolean(searchQueryClassName)
-  });
-  return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(
-    "section",
-    {
-      className: `select-options ${onSearchQuery ? "with-search-query" : ""}`,
-      style: isMobile ? {
-        maxHeight: window.innerHeight - 100,
-        width: window.innerWidth - 100
-      } : {
-        height: shouldUseAuto ? "auto" : h,
-        maxHeight: height,
-        width: containerRef.current?.offsetWidth ?? "auto"
-      },
-      children: [
-        onSearchQuery && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("section", { className: selectOptionsHeader, style: searchQueryStyle, children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
-          "input",
-          {
-            name: "query",
-            className: "input-search",
-            value: searchQueryValue ?? internalSearchQuery,
-            onChange: handleSearchQuery,
-            placeholder: searchQueryPlaceholder,
-            onClick: (e) => e.stopPropagation(),
-            ref: searchInputRef,
-            autoFocus: true
-          }
-        ) }),
-        /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("section", { className: "select-options-list-container", ref: optionsGroupContainerRef, children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("ul", { className: "select-options-list", ref: optionsGroupRef, children }) })
-      ]
-    }
-  );
-};
-
-// src/components/form/select/select.component.tsx
-var import_jsx_runtime29 = require("react/jsx-runtime");
-var SelectContext = (0, import_react39.createContext)(null);
-var useSelectContext = () => {
-  const context = (0, import_react39.useContext)(SelectContext);
-  if (!context) {
-    throw new Error("useSelectContext must be used within a Select component");
-  }
-  return context;
-};
-var OptionLabel = ({ children }) => {
-  const labelComponent = (0, import_react39.useMemo)(() => {
-    if (typeof children === "string") {
-      return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Typography, { noPadding: true, variant: "label", nowrap: true, children });
-    }
-    return children;
-  }, [children]);
-  return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Menu.GroupLabel, { children: labelComponent });
-};
-var DefaultOption = ({ value }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Typography, { variant: "label", nowrap: true, children: typeof value === "string" || typeof value === "number" ? value : JSON.stringify(value) });
-};
-var DefaultValue = ({ value, multiselect }) => {
-  if (multiselect) {
-    return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Typography, { noPadding: true, nowrap: true, variant: "label", children: `${value.length} item${value.length === 1 ? "" : "s"} selected` });
-  }
-  if (value === null) {
-    return null;
-  }
-  return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Typography, { noPadding: true, variant: "label", nowrap: true, children: typeof value === "string" || typeof value === "number" ? value : JSON.stringify(value) });
-};
-var Select = ({
-  // Select props
-  options,
-  isEqualComparator,
-  searchQueryValue,
-  searchQueryPlaceholder,
-  onSearchQuery,
-  loadMore = () => null,
-  isLoading = false,
-  hasNextPage = false,
-  emptyMessage = "No options to select",
-  multiselect,
-  optionComponent: OptionComponent = DefaultOption,
-  valueComponent: ValueComponent = DefaultValue,
-  maxOptions,
-  children,
-  // Shared props
-  name,
-  value,
-  setValue,
-  onBlur,
-  onFocus,
-  className = "",
-  style = {},
-  showClearOption = false,
-  height,
-  searchQueryStyle,
-  searchQueryClassName,
-  // eslint-disable-next-line @typescript-eslint/no-unused-vars
-  autoFocus = false,
-  // eslint-disable-next-line @typescript-eslint/no-unused-vars
-  readOnly = false,
-  disabled = false,
-  placeholder = "",
-  // eslint-disable-next-line @typescript-eslint/no-unused-vars
-  autoComplete = "off",
-  // eslint-disable-next-line @typescript-eslint/no-unused-vars
-  isDirty = false,
-  // eslint-disable-next-line @typescript-eslint/no-unused-vars
-  isTouched = false,
-  // eslint-disable-next-line @typescript-eslint/no-unused-vars
-  invalid = false,
-  error,
-  // Field props
-  ...fieldProps
-}) => {
-  const modalRef = (0, import_react39.useRef)(null);
-  const isMobile = useMediaQuery("(max-width: 480px)");
-  const id = (0, import_react39.useMemo)(() => crypto.randomUUID(), []);
-  const containerRef = (0, import_react39.useRef)(null);
-  const [isOpen, setIsOpen] = (0, import_react39.useState)(false);
-  const openSelect = (0, import_react39.useCallback)(
-    (open) => {
-      setIsOpen(open && !disabled);
-    },
-    [disabled]
-  );
-  const clearOption = (0, import_react39.useCallback)(
-    (e) => {
-      e.stopPropagation();
-      if (multiselect) {
-        setValue([]);
-      } else {
-        setValue(null);
-      }
-    },
-    [multiselect, setValue]
-  );
-  const valueNonEmpty = (0, import_react39.useMemo)(() => {
-    if (multiselect) {
-      return value.length > 0;
-    } else {
-      return Boolean(value);
-    }
-  }, [multiselect, value]);
-  const renderedOptions = (0, import_react39.useMemo)(() => {
-    if (!children)
-      return options.map((value2, key) => /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Select.Option, { value: value2, children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(OptionComponent, { value: value2 }) }, key));
-    return children;
-  }, [OptionComponent, children, options]);
-  return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
-    SelectContext.Provider,
-    {
-      value: {
-        selectedValue: value,
-        setValue,
-        multiselect: multiselect ?? false,
-        isEqualComparator,
-        maxOptions: maxOptions ?? null,
-        setIsOpen
-      },
-      children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Field, { id, error, isFocus: isOpen, ref: containerRef, ...fieldProps, children: /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(
-        "section",
-        {
-          id: name,
-          style,
-          onBlur,
-          className: `select ${disabled ? "disabled" : ""} ${className}`,
-          children: [
-            /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(
-              "section",
-              {
-                id,
-                className: `select-container ${valueNonEmpty && showClearOption ? "three-columns" : ""}`,
-                onClick: () => openSelect(true),
-                children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
-                    "button",
-                    {
-                      type: "button",
-                      className: `input-button ${(Array.isArray(value) ? value.length > 0 : value) ? "" : "placeholder"}`,
-                      "aria-haspopup": "listbox",
-                      "aria-expanded": isOpen,
-                      onFocus: (e) => {
-                        openSelect(true);
-                        if (onFocus) onFocus(e);
-                      },
-                      children: valueNonEmpty ? /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(ValueComponent, { ...multiselect ? { value, multiselect } : { value } }) : /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Typography, { variant: "label", noPadding: true, nowrap: true, children: placeholder })
-                    }
-                  ),
-                  valueNonEmpty && showClearOption && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("section", { className: "icon-close", onClick: clearOption, children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_im4.ImCross, {}) }),
-                  /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_pi2.PiCaretDown, { className: `select-caret-icon ${isOpen && "is-select-open"}` })
-                ]
-              }
-            ),
-            /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
-              Menu,
-              {
-                id: "form-select",
-                isOpen,
-                onClose: () => openSelect(false),
-                backdrop: isMobile ? "blur" : "transparent",
-                opacity: isMobile ? 0.8 : 0.4,
-                position: isMobile ? "center" : "bottom",
-                offset: 5,
-                modalRef,
-                windowOffset: 10,
-                transitionDuration: 200,
-                containerRef: isMobile ? void 0 : containerRef,
-                contentClassName: "select-menu-content",
-                className: "select-options-menu",
-                children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
-                  Options,
-                  {
-                    containerRef,
-                    onSearchQuery,
-                    searchQueryValue,
-                    searchQueryPlaceholder,
-                    searchQueryClassName,
-                    searchQueryStyle,
-                    height,
-                    children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
-                      InfinityScroll,
-                      {
-                        isLoading,
-                        hasNextPage,
-                        loadMore,
-                        emptyMessage,
-                        children: renderedOptions
-                      }
-                    )
-                  }
-                )
-              }
-            )
-          ]
-        }
-      ) })
-    }
-  );
-};
-var MultiSelectController = ({
-  rules,
-  ...props
-}) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
-    Controller,
-    {
-      Component: Select,
-      defaultValue: [],
-      inputProps: {
-        ...props,
-        multiselect: true
-      },
-      rules
-    }
-  );
-};
-var SingleSelectController = ({
-  rules,
-  ...props
-}) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
-    Controller,
-    {
-      Component: Select,
-      defaultValue: null,
-      inputProps: {
-        ...props,
-        multiselect: false
-      },
-      rules
-    }
-  );
-};
-var SelectController = (props) => {
-  const { multiselect } = props;
-  if (multiselect) {
-    return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(MultiSelectController, { ...props, multiselect: true });
-  }
-  return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(SingleSelectController, { ...props, multiselect: false });
-};
-Select.Controller = SelectController;
-Select.Option = Option;
-Select.OptionLabel = OptionLabel;
-
-// src/components/form/slider/slider.component.tsx
-var import_react40 = require("react");
-var import_jsx_runtime30 = require("react/jsx-runtime");
-var Slider = ({
-  name,
-  value,
-  setValue,
-  onBlur,
-  onFocus,
-  min,
-  max,
-  step,
-  onlySlider = false,
-  className = "",
-  style = {},
-  autoFocus = false,
-  readOnly = false,
-  disabled = false,
-  placeholder = "",
-  autoComplete = "off",
-  // eslint-disable-next-line @typescript-eslint/no-unused-vars
-  isDirty = false,
-  // eslint-disable-next-line @typescript-eslint/no-unused-vars
-  isTouched = false,
-  // eslint-disable-next-line @typescript-eslint/no-unused-vars
-  invalid = false,
-  error,
-  ...fieldProps
-}) => {
-  const id = (0, import_react40.useMemo)(() => crypto.randomUUID(), []);
-  const onBlurInput = (e) => {
-    if (onBlur) onBlur(e);
-    const parsedValue = parseInt(`${value}`);
-    if (min !== void 0 && parsedValue < min) {
-      setValue(min);
-    }
-    if (max !== void 0 && parsedValue > max) {
-      setValue(max);
-    }
-    setValue(parsedValue);
-  };
-  const { isFocus, handlers } = useInputHandlers({
-    onBlur: onBlurInput,
-    onChange: (e) => setValue(+e.target.value),
-    onFocus
-  });
-  const inputSliderClassName = useClassNames({
-    "input-slider": true,
-    "is-focus": isFocus
-  });
-  return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Field, { id, error, isFocus, ...fieldProps, children: /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)("section", { className: inputSliderClassName, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
-      "input",
-      {
-        id,
-        type: "range",
-        name,
-        className: `slider ${className}`,
-        style,
-        value,
-        autoFocus,
-        autoComplete,
-        placeholder,
-        disabled,
-        readOnly,
-        min,
-        max,
-        step,
-        ...handlers
-      }
-    ),
-    !onlySlider && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
-      "input",
-      {
-        id,
-        type: "number",
-        name,
-        className: `slider-number ${className}`,
-        style,
-        value,
-        autoComplete,
-        disabled,
-        readOnly,
-        min,
-        max,
-        step,
-        ...handlers
-      }
-    )
-  ] }) });
-};
-var SliderController = ({ rules, ...props }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Controller, { Component: Slider, defaultValue: 0, inputProps: props, rules });
-};
-Slider.Controller = SliderController;
-
-// src/components/form/textarea/textarea.component.tsx
-var import_react41 = require("react");
-var import_jsx_runtime31 = require("react/jsx-runtime");
-var Textarea = ({
-  name,
-  value,
-  setValue,
-  onBlur,
-  onFocus,
-  rows = 4,
-  resize = "vertical",
-  className = "",
-  style = {},
-  autoFocus = false,
-  readOnly = false,
-  disabled = false,
-  placeholder = "",
-  autoComplete = "off",
-  // eslint-disable-next-line @typescript-eslint/no-unused-vars
-  isDirty = false,
-  // eslint-disable-next-line @typescript-eslint/no-unused-vars
-  isTouched = false,
-  // eslint-disable-next-line @typescript-eslint/no-unused-vars
-  invalid = false,
-  error,
-  ...fieldProps
-}) => {
-  const id = (0, import_react41.useMemo)(() => crypto.randomUUID(), []);
-  const { handlers, isFocus } = useInputHandlers({
-    onBlur,
-    onChange: (e) => setValue(e.target.value),
-    onFocus
-  });
-  const textareaClassName = useClassNames({
-    textarea: true,
-    [className]: Boolean(className)
-  });
-  return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(Field, { id, error, isFocus, ...fieldProps, children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
-    "textarea",
-    {
-      id,
-      name,
-      className: textareaClassName,
-      style: {
-        resize,
-        ...style
-      },
-      value,
-      rows,
-      ...handlers,
-      autoFocus,
-      autoComplete,
-      placeholder,
-      disabled,
-      readOnly
-    }
-  ) });
-};
-var TextareaController = ({ rules, ...props }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(Controller, { Component: Textarea, defaultValue: "", inputProps: props, rules });
-};
-Textarea.Controller = TextareaController;
-
-// src/components/form/switch/switch.component.tsx
-var import_react44 = require("react");
-
-// src/components/tooltips/click-to-copy/click-to-copy.component.tsx
-var import_react43 = require("react");
-
-// src/components/tooltips/tooltip/tooltip.component.tsx
-var import_react42 = require("react");
-var import_jsx_runtime32 = require("react/jsx-runtime");
-var Tooltip = ({
-  position = "top" /* TOP */,
-  children,
-  content,
-  offset = 5,
-  disabled = false
-}) => {
-  const { containerRef, openModal, closeModal, isOpen } = useModal();
-  const classNames = useClassNames({
-    tooltip: true,
-    [position]: true
-  });
-  useEventListener("mouseenter", () => openModal(), containerRef);
-  useEventListener("mouseleave", () => closeModal(), containerRef);
-  if (disabled) return children;
-  return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(import_jsx_runtime32.Fragment, { children: [
-    (0, import_react42.cloneElement)(children, { ref: containerRef }),
-    /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
-      Modal,
-      {
-        backdrop: "none",
-        id: "tooltip",
-        isOpen,
-        containerRef,
-        onClose: closeModal,
-        position,
-        className: classNames,
-        closeOnClickOutside: false,
-        offset: 6 + +offset,
-        windowOffset: 10,
-        transitionDuration: 100,
-        closeAnimationClassName: "close-animation",
-        children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("span", { className: "tooltip-content", children: content })
-      }
-    )
-  ] });
-};
-
-// src/components/tooltips/click-to-copy/click-to-copy.component.tsx
-var import_jsx_runtime33 = require("react/jsx-runtime");
-var ClickToCopy = ({
-  children,
-  value,
-  position,
-  offset,
-  tooltipText,
-  tooltipCopiedText,
-  copiedTextTimeout = 500
-}) => {
-  const [justCopied, setJustCopied] = (0, import_react43.useState)(false);
-  const handleCopy = () => {
-    setJustCopied(true);
-    navigator.clipboard.writeText(value);
-    setTimeout(() => setJustCopied(false), copiedTextTimeout);
-  };
-  return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
-    Tooltip,
-    {
-      content: justCopied && tooltipCopiedText ? tooltipCopiedText : tooltipText,
-      position,
-      offset,
-      children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("span", { onClick: handleCopy, children })
-    }
-  );
-};
-
-// src/components/form/switch/switch.component.tsx
-var import_jsx_runtime34 = require("react/jsx-runtime");
-var DotSizeMap = {
-  ["small" /* SMALL */]: 1,
-  ["regular" /* REGULAR */]: 1.2,
-  ["large" /* LARGE */]: 1.4
-};
-var WidthMap = {
-  ["small" /* SMALL */]: 2,
-  ["regular" /* REGULAR */]: 2.5,
-  ["large" /* LARGE */]: 3
-};
-var Switch = ({
-  name,
-  value,
-  setValue,
-  onBlur,
-  onFocus,
-  className = "",
-  style = {},
-  autoFocus = false,
-  readOnly = false,
-  disabled = false,
-  placeholder = "",
-  autoComplete = "off",
-  label,
-  leftLabel,
-  rightLabel,
-  width = "regular" /* REGULAR */,
-  size = "regular" /* REGULAR */,
-  dotHoverSize = 1.3,
-  padding = 0.25,
-  leftIcon: LeftIcon,
-  rightIcon: RightIcon,
-  internalLeftIcon: InternalLeftIcon,
-  internalRightIcon: InternalRightIcon,
-  leftIconTooltip,
-  rightIconTooltip,
-  color
-  /*
-   * isDirty = false,
-   * isTouched = false,
-   * invalid = false,
-   * error,
-   */
-}) => {
-  const id = (0, import_react44.useMemo)(() => crypto.randomUUID(), []);
-  const { handlers } = useInputHandlers({
-    onChange: (e) => setValue(e.target.checked),
-    onBlur,
-    onFocus
-  });
-  const switchContainerClassName = useClassNames({
-    "switch-container": true,
-    [className]: Boolean(className),
-    [`color-${color}`]: Boolean(color)
-  });
-  const switchClassName = useClassNames({
-    switch: true,
-    "is-checked": value,
-    "is-readonly": !disabled && readOnly
-  });
-  const dotSize = DotSizeMap[size] ?? DotSizeMap["regular" /* REGULAR */];
-  const _width = (WidthMap[width] ?? WidthMap["regular" /* REGULAR */]) * dotSize;
-  const _padding = Math.min(padding, dotSize);
-  return /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(
-    "section",
-    {
-      className: switchContainerClassName,
-      style: {
-        ...style,
-        "--width": `${_width}em`,
-        "--dot-size": `${dotSize}em`,
-        "--dot-hover-size": `${dotSize * Math.min(Math.max(dotHoverSize, 1), 2)}em`,
-        "--padding": `${_padding}em`
-      },
-      children: [
-        leftLabel ? /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(Typography, { variant: "label-form", className: "switch-label", htmlFor: id, children: leftLabel }) : null,
-        LeftIcon !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(Tooltip, { content: leftIconTooltip, disabled: !leftIconTooltip, offset: 10, children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(LeftIcon, { size: `${dotSize * 0.7}em`, className: "switch-icon", onClick: () => setValue(!value) }) }),
-        /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("section", { className: switchClassName, children: [
-          InternalLeftIcon !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("span", { className: "switch-internal-left-icon", children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(InternalLeftIcon, { size: `${dotSize * 0.7}em` }) }),
-          InternalRightIcon !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("span", { className: "switch-internal-right-icon", children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(InternalRightIcon, { size: `${dotSize * 0.7}em` }) }),
-          /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("span", { className: "switch-dot" }),
-          /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
-            "input",
-            {
-              id,
-              type: "checkbox",
-              name,
-              className: `switch-checkbox ${className}`,
-              style,
-              checked: value,
-              autoFocus,
-              autoComplete,
-              placeholder,
-              disabled: disabled || readOnly,
-              ...handlers
-            }
-          )
-        ] }),
-        RightIcon !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(Tooltip, { content: rightIconTooltip, disabled: !rightIconTooltip, offset: 10, children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(RightIcon, { size: `${dotSize * 0.7}em`, className: "switch-icon", onClick: () => setValue(!value) }) }),
-        label || rightLabel ? /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(Typography, { variant: "label-form", className: "switch-label", htmlFor: id, children: label || rightLabel }) : null
-      ]
-    }
-  );
-};
-var SwitchController = ({ rules, ...props }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(Controller, { Component: Switch, defaultValue: false, inputProps: props, rules });
-};
-Switch.Controller = SwitchController;
-
-// src/components/image/image.tsx
-var import_jsx_runtime35 = require("react/jsx-runtime");
-var Image = ({ alt = "", loading = "eager", ...props }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("img", { loading, alt, ...props, width: "100%" });
-};
-
-// src/components/smart-table/smart-table.component.tsx
-var import_react47 = require("react");
-
-// src/components/smart-table/smart-table.column.tsx
-var import_react45 = require("react");
-var import_md = require("react-icons/md");
-var import_jsx_runtime36 = require("react/jsx-runtime");
-var SmartTableColumn = ({
-  header,
-  sortBy,
-  icon: Icon,
-  width,
-  field,
-  toggleSortField,
-  sortField,
-  orderField,
-  hidden
-}) => {
-  const sortByKey = sortBy !== void 0 ? sortBy : field;
-  const columnClassName = useClassNames({
-    "sort-on-click": Boolean(sortByKey)
-  });
-  const columnOnClick = sortByKey ? () => toggleSortField(sortByKey) : void 0;
-  const sortIcon = (0, import_react45.useMemo)(() => {
-    if (!sortByKey) return null;
-    return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("span", { className: "sort-icon", children: Boolean(sortField) && sortField === sortByKey && (orderField === "asc" ? /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_md.MdArrowUpward, {}) : /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_md.MdArrowDownward, {})) });
-  }, [sortByKey, sortField, orderField]);
-  if (hidden) return null;
-  return /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("th", { style: { width }, className: columnClassName, onClick: columnOnClick, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(Grid, { flow: "column", gap: "0.5em", jc: "space-between", ai: "center", children: [
-      Icon ? /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(Icon, {}) : null,
-      /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(Typography, { variant: "label", noPadding: true, children: header }),
-      sortIcon
-    ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(Ripple, { color: "var(--primary-700)" })
-  ] });
-};
-
-// src/components/smart-table/smart-table.helpers.tsx
-var import_jsx_runtime37 = require("react/jsx-runtime");
-var renderRowColumn = (data, { field, render, Component }, rowKey) => {
-  if (field && data[field])
-    return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(Typography, { noPadding: true, nowrap: true, children: data[field] });
-  if (render) return render(data, rowKey);
-  if (Component) return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(Component, { data, rowKey });
-};
-var renderRow = (data, columns, rowKey) => columns.map((column, key) => column.hidden ? null : /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("td", { children: renderRowColumn(data, column, rowKey) }, key));
-var sortData = (data, sortBy, order) => {
-  if (sortBy) {
-    return data.toSorted((a, b) => {
-      const fieldA = a[sortBy];
-      const fieldB = b[sortBy];
-      if (["number", "boolean", "string"].includes(typeof fieldA) && ["number", "boolean", "string"].includes(typeof fieldB)) {
-        if (fieldA === fieldB) return 0;
-        if (order === "asc") {
-          return fieldA > fieldB ? 1 : -1;
-        }
-        return fieldA > fieldB ? -1 : 1;
-      }
-      return 0;
-    });
-  }
-  return data;
-};
-
-// src/components/smart-table/smart-table.hooks.ts
-var import_react46 = require("react");
-var useSort = () => {
-  const [[sortBy, order], setSortField] = (0, import_react46.useState)([null, null]);
-  const toggleSortField = (0, import_react46.useCallback)((sortByField) => {
-    setSortField(([sortBy2, order2]) => {
-      if (sortByField !== sortBy2) {
-        return [sortByField, "asc"];
-      }
-      if (order2 === "asc") {
-        return [sortByField, "desc"];
-      }
-      return [null, null];
-    });
-  }, []);
-  return {
-    sortBy,
-    order,
-    toggleSortField
-  };
-};
-
-// src/components/smart-table/smart-table.row.tsx
-var import_jsx_runtime38 = require("react/jsx-runtime");
-var SmartTableRow = ({
-  data,
-  columns,
-  isSelected = false,
-  selectable = false,
-  rowKey
-}) => {
-  const rowClassName = useClassNames({
-    "row-selected": selectable && isSelected
-  });
-  return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("tr", { className: rowClassName, children: renderRow(data, columns, rowKey) });
-};
-
-// src/components/smart-table/smart-table.component.tsx
-var import_jsx_runtime39 = require("react/jsx-runtime");
-var SmartTable = ({
-  columns: initialColumns,
-  data,
-  width,
-  selectable = false,
-  rowId,
-  className = "",
-  tableClassName: _tableClassName = ""
-}) => {
-  const [selected, setSelected] = (0, import_react47.useState)({});
-  const tableClassName = useClassNames({
-    "smart-table": true,
-    [_tableClassName]: Boolean(_tableClassName),
-    "layout-fixed": width === "content",
-    "layout-scrollable": width === "scroll"
-  });
-  const tableContainerClassName = useClassNames({
-    "smart-table-container": true,
-    [className]: Boolean(className)
-  });
-  const { sortBy, order, toggleSortField } = useSort();
-  const columns = (0, import_react47.useMemo)(() => {
-    let finalColumns = [...initialColumns];
-    if (selectable) {
-      finalColumns = [
-        {
-          header: `${Object.values(selected).length}`,
-          render: (data2, rowKey) => /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
-            Checkbox,
-            {
-              name: `selected-${rowKey}`,
-              value: `${rowKey}` in selected,
-              setValue: (isSelected) => {
-                setSelected((prev) => {
-                  const copy = { ...prev };
-                  if (isSelected) {
-                    copy[`${rowKey}`] = data2;
-                  } else {
-                    delete copy[`${rowKey}`];
-                  }
-                  return copy;
-                });
-              }
-            }
-          )
-        },
-        ...finalColumns
-      ];
-    }
-    return finalColumns;
-  }, [initialColumns, selectable, selected]);
-  const rows = (0, import_react47.useMemo)(() => sortData(data, sortBy, order), [data, sortBy, order]);
-  return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("section", { className: tableContainerClassName, children: /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)("table", { className: tableClassName, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("thead", { children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("tr", { children: columns.map((column, key) => /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
-      SmartTableColumn,
-      {
-        toggleSortField,
-        sortField: sortBy,
-        orderField: order,
-        ...column
-      },
-      key
-    )) }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("tbody", { children: rows.map((row) => /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
-      SmartTableRow,
-      {
-        rowKey: row[rowId],
-        data: row,
-        columns,
-        isSelected: `${row[rowId]}` in selected,
-        selectable
-      },
-      row[rowId]
-    )) })
-  ] }) });
-};
-
-// src/components/tabs/tabs.tsx
-var import_react49 = require("react");
-
-// src/components/tabs/tabs-list.tsx
-var import_react48 = require("react");
-var import_jsx_runtime40 = require("react/jsx-runtime");
-var DefaultRect = {
-  top: 0,
-  left: 0,
-  width: 0,
-  height: 0
-};
-var TabsList = ({
-  tabs = [],
-  variant = "solid" /* SOLID */,
-  radius = "full" /* Full */,
-  direction = "horizontal" /* HORIZONTAL */,
-  color,
-  children,
-  openTab,
-  size = "medium" /* Medium */,
-  className = "",
-  style = {}
-}) => {
-  const containerRef = (0, import_react48.useRef)(null);
-  const selectedTabRef = (0, import_react48.useRef)(null);
-  const [isSelectorActive, setIsSelectorActive] = (0, import_react48.useState)(false);
-  const [selector, setSelector] = (0, import_react48.useState)(DefaultRect);
-  const containerClassNames = useClassNames({
-    "tab-list": true,
-    [`variant-${variant}`]: Boolean(variant),
-    [`size-${size}`]: Boolean(size),
-    [`radius-${radius}`]: Boolean(radius),
-    [`color-${color}`]: Boolean(color),
-    "vertical-direction": direction === "vertical" /* VERTICAL */,
-    [className]: Boolean(className)
-  });
-  (0, import_react48.useEffect)(() => {
-    const selectedRect = selectedTabRef.current?.getBoundingClientRect() ?? DefaultRect;
-    const containerRect = containerRef.current?.getBoundingClientRect() ?? DefaultRect;
-    const width = selectedRect.width;
-    const height = variant === "line" /* LINE */ ? 2 : selectedRect.height;
-    const left = selectedRect.left - containerRect.left;
-    const top = variant === "line" /* LINE */ ? selectedRect.top + selectedRect.height - containerRect.top : selectedRect.top - containerRect.top;
-    setSelector({ left, top, width, height });
-    if (!isSelectorActive) {
-      setTimeout(() => {
-        setIsSelectorActive(true);
-      }, 100);
-    }
-  }, [isSelectorActive, variant, openTab]);
-  return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("section", { className: containerClassNames, ref: containerRef, style, children: [
-    Boolean(variant) && /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("span", { className: `tabs-selector ${isSelectorActive ? "active" : ""}`, style: selector }),
-    tabs.map(({ id, label }) => /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(Tabs.Tab, { id, ref: id === openTab ? selectedTabRef : void 0, children: label }, id)),
-    children
-  ] });
-};
-
-// src/components/tabs/tabs.tsx
-var import_jsx_runtime41 = require("react/jsx-runtime");
-var TabsContext = (0, import_react49.createContext)(null);
-var useTab = (id) => {
-  const context = (0, import_react49.useContext)(TabsContext);
-  if (!context) {
-    throw new Error("You cant use this component out off an Tabs component");
-  }
-  const { openTab, changeOpenTab } = context;
-  return [openTab === id, () => changeOpenTab(id)];
-};
-var useTabsContext = () => {
-  const context = (0, import_react49.useContext)(TabsContext);
-  if (!context) {
-    throw new Error("You cant use this component out off an Tabs component");
-  }
-  return context;
-};
-var Tabs = ({ children, defaultOpenTab, onChange }) => {
-  const [openTab, setOpenTab] = (0, import_react49.useState)(defaultOpenTab);
-  (0, import_react49.useEffect)(() => {
-    if (onChange) {
-      onChange(openTab);
-    }
-  }, [openTab, onChange]);
-  return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
-    TabsContext.Provider,
-    {
-      value: {
-        openTab,
-        changeOpenTab: (id) => setOpenTab(id)
-      },
-      children
-    }
-  );
-};
-var Tab = ({ id, children, className = "", style = {}, onClick, ref }) => {
-  const [isOpen, openTab] = useTab(id);
-  const tabClassNames = useClassNames({
-    tab: true,
-    [className]: !!className,
-    "is-open": isOpen
-  });
-  const handleClick = (e) => {
-    openTab();
-    if (onClick) {
-      onClick(e);
-    }
-  };
-  return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("span", { className: tabClassNames, style, onClick: handleClick, ref, children });
-};
-var TabPanel = ({ id, children }) => {
-  const [isOpen] = useTab(id);
-  return isOpen ? children : null;
-};
-var TabList = ({ children, ...props }) => {
-  const { openTab } = useTabsContext();
-  return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(TabsList, { ...props, openTab, children });
-};
-Tabs.Tab = Tab;
-Tabs.TabPanel = TabPanel;
-Tabs.TabList = TabList;
-
-// src/components/tag/tag.component.tsx
-var import_jsx_runtime42 = require("react/jsx-runtime");
-var TagRounded = /* @__PURE__ */ ((TagRounded2) => {
-  TagRounded2["NONE"] = "none";
-  TagRounded2["SMALL"] = "small";
-  TagRounded2["MEDIUM"] = "medium";
-  TagRounded2["LARGE"] = "large";
-  TagRounded2["FULL"] = "full";
-  return TagRounded2;
-})(TagRounded || {});
-var Tag = ({ children, rounded = "medium" /* MEDIUM */, selected = false, noWrap = false, ref }) => {
-  const className = useClassNames({
-    tag: true,
-    [`rounded-${rounded}`]: Boolean(rounded),
-    "is-selected": selected,
-    "no-wrap": noWrap
-  });
-  return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("span", { className, ref, children });
-};
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  Accordion,
-  AccordionItem,
-  ActionModal,
-  AsideModal,
-  Backdrop,
-  Button,
-  Checkbox,
-  ClickToCopy,
-  ConfirmationModal,
-  Cursor,
-  DatePicker,
-  Field,
-  FieldOrientation,
-  FieldVariant,
-  FlipCard,
-  HoverCard,
-  Image,
-  InfinityScroll,
-  Input,
-  InputColor,
-  InputFile,
-  InputNumber,
-  InputPassword,
-  Line,
-  LineOrientation,
-  LineStyle,
-  Menu,
-  Modal,
-  ModalBackdrop,
-  Portal,
-  Radio,
-  Ripple,
-  Select,
-  SlideCard,
-  Slider,
-  SmartTable,
-  Switch,
-  Tabs,
-  Tag,
-  TagRounded,
-  Textarea,
-  Tooltip,
-  Typography,
-  useAccordionItem
-});
-//# sourceMappingURL=components.cjs.map
+"use strict";var Yr=Object.create;var Be=Object.defineProperty;var jr=Object.getOwnPropertyDescriptor;var _r=Object.getOwnPropertyNames;var Wr=Object.getPrototypeOf,Xr=Object.prototype.hasOwnProperty;var Qr=(e,o)=>{for(var t in o)Be(e,t,{get:o[t],enumerable:!0})},it=(e,o,t,r)=>{if(o&&typeof o=="object"||typeof o=="function")for(let a of _r(o))!Xr.call(e,a)&&a!==t&&Be(e,a,{get:()=>o[a],enumerable:!(r=jr(o,a))||r.enumerable});return e};var Co=(e,o,t)=>(t=e!=null?Yr(Wr(e)):{},it(o||!e||!e.__esModule?Be(t,"default",{value:e,enumerable:!0}):t,e)),Zr=e=>it(Be({},"__esModule",{value:!0}),e);var _n={};Qr(_n,{Accordion:()=>nn,AccordionItem:()=>ln,ActionModal:()=>Se,AsideModal:()=>bn,Backdrop:()=>jo,Button:()=>Fo,Checkbox:()=>ge,ClickToCopy:()=>Fn,ConfirmationModal:()=>vn,Cursor:()=>cn,DatePicker:()=>Bo,Field:()=>H,FieldOrientation:()=>$o,FieldVariant:()=>zo,FlipCard:()=>an,HoverCard:()=>sn,Image:()=>zn,InfinityScroll:()=>Zo,Input:()=>Go,InputColor:()=>_o,InputFile:()=>Wo,InputNumber:()=>Xo,InputPassword:()=>Vo,Line:()=>Ne,LineOrientation:()=>At,LineStyle:()=>Dt,Menu:()=>q,Modal:()=>Z,ModalBackdrop:()=>Jt,Portal:()=>Yo,Radio:()=>Qo,Ripple:()=>fe,Select:()=>pe,SlideCard:()=>Io,Slider:()=>Jo,SmartTable:()=>Bn,Switch:()=>ot,Tabs:()=>Ie,Tag:()=>jn,TagRounded:()=>Hr,Textarea:()=>qo,Tooltip:()=>Me,Typography:()=>R,useAccordionItem:()=>Mo});module.exports=Zr(_n);var K=require("react");var Ro=require("react");var wo=require("react");var st=require("react"),h=e=>(0,st.useMemo)(()=>Object.entries(e).reduce((o,[t,r])=>r?[...o,t]:o,[]).join(" "),[e]);var Te=require("react");function N(e,o,t,r){let a=(0,Te.useRef)(o);(0,Te.useEffect)(()=>{a.current=o},[o]),(0,Te.useLayoutEffect)(()=>{let n=t?.current??window;if(!(n&&n.addEventListener))return;let i=s=>a.current(s);return n.addEventListener(e,i,r),()=>{n.removeEventListener(e,i,r)}},[e,t,r])}var Kr=(e,o)=>e.current&&!e.current.contains(o),lt=(e,o)=>{N("keydown",t=>{t.key==="Escape"&&o()}),N("mousedown",t=>{let r=t.target;if(!r?.isConnected)return;(Array.isArray(e)?e:[e]).every(n=>Kr(n,r))&&o()})};var Jr=require("react");var ct=require("react");var Ge=require("react"),Po=(e,o=500)=>{let[t,r]=(0,Ge.useState)(e);return(0,Ge.useEffect)(()=>{let a=setTimeout(()=>r(e),o);return()=>{clearTimeout(a)}},[e,o]),t};var qr=require("react");var en=require("react");var dt=require("react"),ce=(e,o)=>{(0,dt.useEffect)(()=>{let t=Array.isArray(e)?e:[e],r=new ResizeObserver(o);return t.forEach(a=>a.current&&r.observe(a.current)),()=>{r.disconnect()}},[e,o])};var Ue=require("react"),pt=e=>{let o=document.getElementById(e);return o===null&&(o=document.createElement("div"),o.setAttribute("id",e),document.body.appendChild(o)),o},mt=e=>{let[o,t]=(0,Ue.useState)(()=>pt(e));return(0,Ue.useEffect)(()=>{let r=document.getElementById(e);if(o===null||r===null){let a=pt(e);t(a)}return()=>{o&&o.parentNode&&process.env.NODE_ENV==="production"&&document.body.removeChild(o)}},[o,e]),o};var yt=require("react");var ut=require("clsx"),ft=require("tailwind-merge"),gt=(...e)=>(0,ft.twMerge)((0,ut.clsx)(e));var Ce=(e,o=2)=>{if(e===0)return"0 Bytes";let t=1e3,r=o<0?0:o,a=["Bytes","KB","MB","GB","TB","PB","EB","ZB","YB"],n=Math.floor(Math.log(e)/Math.log(t));return parseFloat((e/Math.pow(t,n)).toFixed(r))+" "+a[n]};var ht=({c:e,m:o,offset:t,position:r})=>{let a=e.y+e.h+t,n=e.x-(o.w-e.w)*(50/100);switch(r){case"top":case"top center":a=e.y-o.h-t,n=e.x-(o.w-e.w)/2;break;case"top left":a=e.y-o.h-t,n=e.x-o.w+e.w;break;case"top right":a=e.y-o.h-t,n=e.x;break;case"bottom":case"bottom center":a=e.y+e.h+t,n=e.x-(o.w-e.w)/2;break;case"bottom left":a=e.y+e.h+t,n=e.x-o.w+e.w;break;case"bottom right":a=e.y+e.h+t,n=e.x;break;case"left":case"left center":a=e.y-(o.h-e.h)/2,n=e.x-o.w-t;break;case"left top":a=e.y-o.h+e.h,n=e.x-o.w-t;break;case"left bottom":a=e.y,n=e.x-o.w-t;break;case"right":case"right center":a=e.y-(o.h-e.h)/2,n=e.x+e.w+t;break;case"right top":a=e.y-o.h+e.h,n=e.x+e.w+t;break;case"right bottom":a=e.y,n=e.x+e.w+t;break}return{left:Math.round(n),top:Math.round(a)}},on=({top:e,left:o},t,r,a)=>{let n=t.split(" "),i=[],s=o+a.w+r-window.innerWidth,l=e+a.h+r-window.innerHeight;for(let c of n)c==="top"&&e<r?i.push("bottom"):c==="left"&&o<r?i.push("right"):c==="bottom"&&l>0?i.push("top"):c==="right"&&s>0?i.push("left"):i.push(c);return i.join(" ")},tn=({top:e,left:o},t,r)=>{let a=o+t.w+r-window.innerWidth,n=e+t.h+r-window.innerHeight;return o=a>0?o-a:o,e=n>0?e-n:e,o=o<r?r:o,e=e<r?r:e,{top:e,left:o}},bt=({c:e,m:o,offset:t,windowOffset:r,position:a})=>{let n={c:e,m:o,offset:t,position:a},i=ht(n),s=on(i,a,r,o);s!==a&&(i=ht({...n,position:s}));let l=tn(i,o,r);return{left:`${l.left}px`,top:`${l.top}px`}};var vt=({position:e,windowOffset:o})=>{switch(e){case"center":return{top:"50%",left:"50%",transform:"translate(-50%, -50%)"};case"top":case"top center":return{top:`${o}px`,left:"50%",transform:"translateX(-50%)"};case"top left":case"left top":return{top:`${o}px`,left:`${o}px`};case"top right":case"right top":return{top:`${o}px`,right:`${o}px`};case"bottom":case"bottom center":return{bottom:`${o}px`,left:"50%",transform:"translateX(-50%)"};case"left bottom":case"bottom left":return{bottom:`${o}px`,left:`${o}px`};case"right bottom":case"bottom right":return{bottom:`${o}px`,right:`${o}px`};case"left":case"left center":return{top:"50%",left:`${o}px`,transform:"translateY(-50%)"};case"right":case"right center":return{top:"50%",right:`${o}px`,transform:"translateY(-50%)"}}return{top:"50%",left:"50%",transform:"translate(-50%, -50%)"}};var ko=require("react");var So=require("react");var Ye=require("react");var xt=require("react"),Tt=(e,o,t={})=>{(0,xt.useEffect)(()=>{let r=Array.isArray(e)?e:[e],a=new IntersectionObserver(o,t);return r.forEach(n=>n.current&&a.observe(n.current)),()=>{a.disconnect()}},[o,t,e])};var Ct=(e={})=>{let[o,t]=(0,Ye.useState)(!1),r=(0,Ye.useRef)(null);return Tt(r,([a])=>{t(a.isIntersecting)},e),{ref:r,inView:o}};var we=require("react"),O=({onBlur:e,onFocus:o,onChange:t}={})=>{let[r,a]=(0,we.useState)(!1),n=(0,we.useCallback)(l=>{a(!0),o&&o(l)},[o]),i=(0,we.useCallback)(l=>{a(!1),e&&e(l)},[e]),s=(0,we.useCallback)(l=>{t&&t(l)},[t]);return{isFocus:r,handlers:{onFocus:n,onBlur:i,onChange:s}}};var je=require("react"),_e=e=>{let[o,t]=(0,je.useState)(!1);return(0,je.useEffect)(()=>{let r=window.matchMedia(e);r.matches!==o&&t(r.matches);let a=()=>{t(r.matches)};return r.addEventListener("change",a),()=>{r.removeEventListener("change",a)}},[o,e]),o};var We=require("react"),wt=()=>{let e=(0,We.useRef)(null),[o,t]=(0,We.useState)(!1);return{containerRef:e,isOpen:o,openModal:()=>{t(!0)},closeModal:()=>{t(!1)}}};var ue=require("react");var Rt=e=>({x:e.x,y:e.y,w:e.width,h:e.height,top:e.top,left:e.left}),Pt=({offset:e=0,windowOffset:o=0,position:t="bottom",modalRef:r,containerRef:a,isOpen:n})=>{let i=(0,ue.useRef)(null),s=(0,ue.useCallback)((c,m)=>{let d=c.current?.getClientRects()[0],p=m.current?.getClientRects()[0];if(!d)return;let u=p?bt({c:Rt(p),m:Rt(d),offset:e,windowOffset:o,position:t}):vt({position:t,windowOffset:o});Object.keys(u).forEach(g=>{c.current?.style.setProperty(g,u[g])})},[t,o,e]),l=(0,ue.useCallback)(()=>{n&&s(r,a??i)},[s,n,a,r]);(0,ue.useLayoutEffect)(l,[l]),ce(a??i,l),ce(r,l),N("resize",l),N("scroll",l,r)};var Q=Co(require("react"),1);var kt=({transitionDuration:e=0,isOpen:o})=>{let[t,r]=Q.default.useState("CLOSED"),a=(0,Q.useMemo)(()=>t!=="CLOSED",[t]);(0,Q.useEffect)(()=>{document.documentElement.style.overflow=a?"hidden":"auto"},[a]);let n=(0,Q.useCallback)(()=>{["OPENING","OPEN"].includes(t)&&(e>0?(r("CLOSING"),setTimeout(()=>{r("CLOSED")},e)):r("CLOSED"))},[t,e]),i=(0,Q.useCallback)(()=>{["CLOSING","CLOSED"].includes(t)&&(e>0?(r("OPENING"),setTimeout(()=>{r("OPEN")},e)):r("OPEN"))},[t,e]);return(0,Q.useLayoutEffect)(()=>{t==="CLOSED"&&o?i():t==="OPEN"&&!o&&n()},[o,i,n,t]),{isVisible:a,modalState:t}};var Xe=require("react");var St=(e,o)=>{let{left:t,top:r}=e,a=t+window.scrollX,n=r+window.scrollY,i=o.pageX-a,s=o.pageY-n;return{x:o.pageX,y:o.pageY,elementX:i,elementY:s,elementPositionX:a,elementPositionY:n}},Et=e=>{let o=(0,Xe.useRef)(null),[t,r]=(0,Xe.useState)({x:null,y:null,elementX:null,elementY:null,elementPositionX:null,elementPositionY:null});return N("mousemove",n=>{let{clientX:i,clientY:s}=n;if(r(l=>({...l,x:i,y:s})),e?.current instanceof Element){let l=St(e.current.getBoundingClientRect(),n);r(c=>({...c,...l}))}else if(o.current instanceof Element){let l=St(o.current.getBoundingClientRect(),n);r(c=>({...c,...l}))}}),{...t,ref:o}};var rn=require("react");var Mt=require("react");var Eo=require("react");var It=require("react");var Nt=require("react");var Qe=require("react"),Lt=(e,o=0)=>{let[t,r]=(0,Qe.useState)(o),a=(0,Qe.useCallback)(n=>{r(n!==void 0?n:i=>(i+1)%e.length)},[e.length]);return[e[t],a]};var Ot=require("react");var Ft=require("react/jsx-runtime"),At=(t=>(t.VERTICAL="vertical",t.HORIZONTAL="horizontal",t))(At||{}),Dt=(r=>(r.SOLID="solid",r.DOTTED="dotted",r.DASHED="dashed",r))(Dt||{}),Ne=({orientation:e="horizontal",className:o="",style:t={},color:r="currentColor",size:a=1,lineStyle:n="solid",dashedSize:i=1,spacing:s=1})=>{let l=h({"custom-line":!0,[e]:!0,[o]:!!o,[n]:!0});return(0,Ft.jsx)("span",{className:l,style:{...t,"--color":r,"--size":`${a}px`,"--spacing":`${s}px`,"--dashSize":`${i}px`}})};var Ze=require("react/jsx-runtime"),Ht=(0,K.createContext)(null),Mo=e=>{let o=(0,K.useContext)(Ht);if(!o)throw new Error("You cant use this component out off an Accordion component");let{toggleItem:t,openedItems:r}=o,a=()=>t(e);return[r.includes(e),a]},nn=({children:e,className:o="",noSeparators:t,multiple:r,style:a={},defaultOpened:n=[]})=>{let[i,s]=(0,K.useState)(()=>(Array.isArray(n)?n:[n]).reduce((d,p)=>typeof p=="string"?{...d,[p]:!0}:d,{})),l=(0,K.useCallback)(d=>{s(p=>({...r?p:{},[d]:!p[d]}))},[r]),c=(0,K.useMemo)(()=>Object.keys(i).filter(d=>i[d]),[i]),m=h({accordion:!0,[o]:!!o});return(0,Ze.jsx)(Ht.Provider,{value:{toggleItem:l,openedItems:c},children:(0,Ze.jsx)("section",{className:m,style:a,children:(Array.isArray(e)?e:[e]).flatMap((d,p)=>p===0?d:[t?null:(0,Ze.jsx)(Ne,{orientation:"horizontal"},`${p}.5`),d])})})};var $t=require("react"),Bt=require("react-icons/fa");var zt=require("react/jsx-runtime"),Io=({children:e,isOpen:o,className:t="",style:r={}})=>(0,zt.jsx)("section",{className:t,style:{overflow:"hidden",height:o?"auto":0,transition:"height 300ms ease",interpolateSize:"allow-keywords",...r},children:e});var No=require("react");var Re=require("react/jsx-runtime"),an=({cardZIndex:e="auto",flipDirection:o="vertical",flipSpeed:t=500,isFlipped:r=!1,children:a})=>{let n=c=>{if(a.length!==2)throw new Error("Component FlipCard requires 2 children");return a[c]},i=(0,No.useMemo)(()=>`rotate${o==="horizontal"?"Y":"X"}(${r?180:0}deg)`,[o,r]),s=(0,No.useMemo)(()=>`rotate${o==="horizontal"?"Y":"X"}(${r?0:-180}deg)`,[o,r]),l=h({"flip-card":!0,"is-flipped":r});return(0,Re.jsx)("section",{className:l,style:{"--cardZIndex":e,"--flipSpeed":`${t}ms`,"--frontRotate":i,"--backRotate":s},children:(0,Re.jsxs)("section",{className:"flipper",children:[(0,Re.jsx)("section",{className:"front",children:n(0)}),(0,Re.jsx)("section",{className:"back",children:n(1)})]})})};var Pe=require("react");var Lo=require("react/jsx-runtime"),sn=({children:e,threshold:o=5,translationZ:t=25,width:r="fit-content",className:a=""})=>{let n=(0,Pe.useRef)(null),i=(0,Pe.useRef)(null),s=(0,Pe.useCallback)(m=>{let d=n.current,p=i.current;if(!d||!p)return;let{clientX:u,clientY:g,currentTarget:b}=m,{clientWidth:f,clientHeight:v}=b,{top:y,left:C}=d.getBoundingClientRect(),T=(u-C)/f,x=(g-y)/v,P=T*2-1,D=((x*2-1)*o).toFixed(2),F=(P*o).toFixed(2);p.style.transform=`perspective(${f}px) rotateX(${-D}deg) rotateY(${F}deg)`,d.style.transform=`perspective(${f}px) translateZ(${t}px)`},[o,t]),l=(0,Pe.useCallback)(m=>{let d=n.current,p=i.current;!d||!p||(p.style.transform=`perspective(${m.currentTarget.clientWidth}px) rotateX(0) rotateY(0)`,d.style.transform=`perspective(${m.currentTarget.clientWidth}px) translateZ(0)`)},[]);N("mousemove",s,n),N("mouseleave",l,n);let c=h({"hover-card":!0,[a]:!!a});return(0,Lo.jsx)("span",{ref:n,style:{width:r},className:c,children:(0,Lo.jsx)("span",{className:"card-hover-layer",ref:i,children:e})})};var Ke=require("react");var Oo={hero:"h1",header1:"h1",header2:"h2",header3:"h3",header4:"h4",body:"p",label:"span","label-form":"label",small:"small"},Ao={hero:"hero",header1:"header1",header2:"header2",header3:"header3",header4:"header4",body:"body",label:"label","label-form":"label",small:"small"};var R=({variant:e="body",nowrap:o=!1,className:t="",style:r={},children:a,as:n,weight:i,family:s="primary",noPadding:l=!1,align:c,color:m,htmlFor:d,recommendedWidth:p=!1,...u})=>{let g=h({typography:!0,[Ao[e]]:Ao[e]!==void 0,[t]:!!t,[i??""]:!!i,[m??""]:!!m,"no-padding":l,"code-family":s==="code","recommended-width":p,"nowrap-max-lines":typeof o=="number","nowrap-max-lines-2":o===2,"nowrap-max-lines-3":o===3,"nowrap-max-lines-4":o===4,"nowrap-max-lines-5":o===5,nowrap:o===!0}),b=(0,Ke.useMemo)(()=>Oo[e]??Oo.body,[e]);return(0,Ke.createElement)(n??b,{...u,className:g,htmlFor:d,style:{textAlign:c,...r}},a)};var J=require("react/jsx-runtime"),Le=(e,o)=>typeof e=="function"?e(o):e,ln=({title:e,subtitle:o,children:t,icon:r=Bt.FaCaretLeft,startContent:a,content:n,endContent:i,classNames:s={},className:l="",style:c={}})=>{let m=(0,$t.useMemo)(()=>crypto.randomUUID(),[]),[d,p]=Mo(m),u=h({"accordion-header":!0,"has-start-content":!!a,[s?.header??""]:!!s?.header,"is-open":d}),g=h({"accordion-header-content":!0,[s?.headerContent??""]:!!s?.headerContent}),b=h({"accordion-toggle-icon":!0,isOpen:d,[s?.toggleIcon??""]:!!s?.toggleIcon}),f=h({"accordion-body":!0,[s?.body??""]:!!s?.body}),v=Le(e,d),y=Le(o,d),C=Le(a,d),T=Le(n,d)??(0,J.jsxs)("section",{className:g,children:[(0,J.jsx)(R,{className:s?.title,variant:"body",noPadding:!0,weight:"bold",children:v}),(0,J.jsx)(R,{className:s?.subtitle,variant:"label",noPadding:!0,weight:"light",children:y})]}),x=Le(i,d)??(0,J.jsx)(r,{className:b}),P=h({"accordion-item":!0,[l]:!!l});return(0,J.jsxs)("section",{className:P,style:c,children:[(0,J.jsxs)("section",{className:u,onClick:p,children:[C,T,x]}),(0,J.jsx)(Io,{isOpen:d,children:(0,J.jsx)("section",{className:f,children:t})})]})};var Je=require("react");var Gt=require("react/jsx-runtime"),fe=({color:e,duration:o=1e3,timingFunction:t="ease-out",times:r=1,className:a="",style:n={},zIndex:i=1})=>{let s=(0,Je.useRef)(null);return(0,Je.useEffect)(()=>{if(!s.current?.parentElement)return;let c=getComputedStyle(s.current.parentElement).position;["absolute","fixed","sticky","relative"].includes(c)||(s.current.parentElement.style.position="relative")},[]),(0,Gt.jsx)("span",{ref:s,onMouseDown:c=>{let{pageX:m,pageY:d,currentTarget:p}=c,u=p.getBoundingClientRect(),g=(m-u.left)*100/u.width,b=(d-u.top)*100/u.height;console.log({y:b,pageY:d,rectTop:u.top,rectHeight:u.height});let f=document.createElement("span");f.classList.add("ripple-effect"),f.style.animationDuration=`${o}ms`,f.style.animationTimingFunction=t,f.style.left=`${g}%`,f.style.top=`${b}%`,e&&(f.style.background=e),p.appendChild(f),setTimeout(()=>{f.remove()},Math.max(o,500)*Math.max(r,1))},className:`ripple ${a}`,style:{...n,zIndex:i}})};var qe=require("react/jsx-runtime"),Fo=({children:e,color:o="default",variant:t="solid",radius:r="medium",size:a="regular",noWrap:n=!1,forIcon:i=!1,className:s="",...l})=>(0,qe.jsxs)("button",{...l,className:gt("button",o,t,r&&`radius-${r}`,a&&`size-${a}`,n&&"no-wrap",i&&"icon",s),children:[e,(0,qe.jsx)(fe,{})]});var eo=require("react");var Oe=require("react/jsx-runtime"),cn=()=>{let{x:e,y:o,elementX:t,elementY:r,ref:a}=Et(),[n,i]=(0,eo.useState)(!1);if(N("mouseover",l=>{let c=getComputedStyle(l.target).cursor;i(c==="pointer")}),(0,eo.useEffect)(()=>("ontouchstart"in window||navigator.maxTouchPoints||(document.body.style.cursor="none"),()=>{document.body.style.cursor="auto"}),[]),e===null||o===null||"ontouchstart"in window||navigator.maxTouchPoints)return null;let s=`translate3d(${t}px, ${r}px, 0)`;return(0,Oe.jsxs)("section",{className:"cursor-overlay",ref:a,children:[(0,Oe.jsx)("span",{className:`cursor outer-circle ${n?"cursor-hover":""}`,style:{transform:s}}),(0,Oe.jsx)("span",{className:`cursor inner-circle ${n?"cursor-hover":""}`,style:{transform:s}})]})};var Vt=require("react"),Yt=require("react-icons/io5");var oo=require("react-hook-form"),Ho=require("react/jsx-runtime"),I=({Component:e,inputProps:o,defaultValue:t,rules:r})=>{let{control:a,setValue:n}=(0,oo.useFormContext)(),{name:i,defaultValue:s}=o;return(0,Ho.jsx)(oo.Controller,{name:i,control:a,rules:r,defaultValue:s??t,render:({field:{onBlur:l,value:c},fieldState:m})=>(0,Ho.jsx)(e,{value:c,error:m.error?.message,invalid:m.invalid,isTouched:m.isTouched,isDirty:m.isDirty,setValue:d=>n(i,d),onBlur:l,...o})})};var te=require("react/jsx-runtime"),ge=({name:e,value:o,setValue:t,onBlur:r,onFocus:a,className:n="",style:i={},autoFocus:s=!1,readOnly:l=!1,disabled:c=!1,autoComplete:m="off",icon:d=Yt.IoCheckmarkOutline,label:p,color:u="primary",size:g="regular"})=>{let b=(0,Vt.useMemo)(()=>crypto.randomUUID(),[]),{handlers:f}=O({onChange:C=>t(C.target.checked),onBlur:r,onFocus:a}),v=h({"checkbox-container":!0,[n]:!!n,[`color-${u}`]:!!u}),y=h({checkbox:!0,"is-checked":o,[`size-${g}`]:!!g});return(0,te.jsxs)("section",{className:v,style:i,onClick:C=>C.stopPropagation(),children:[(0,te.jsxs)("section",{className:y,children:[(0,te.jsx)("section",{className:"checkbox-fill",children:(0,te.jsx)(d,{size:"1.3em",className:"checkbox-icon"})}),(0,te.jsx)("input",{id:b,type:"checkbox",name:e,className:"checkbox-input",checked:o,autoFocus:s,autoComplete:m,disabled:c||l,...f})]}),p?(0,te.jsx)(R,{variant:"label-form",htmlFor:b,className:"checkbox-label",children:p}):null]})},dn=({rules:e,...o})=>(0,te.jsx)(I,{Component:ge,defaultValue:!1,inputProps:o,rules:e});ge.Controller=dn;var Wt=require("react");var _t=require("react-icons/im");var zo=(r=>(r.FULL_BORDER="full-border",r.CONTENT_BORDER="content-border",r.CONTENT_LINE="line",r))(zo||{}),$o=(t=>(t.HORIZONTAL="horizontal",t.VERTICAL="vertical",t))($o||{});var _=require("react/jsx-runtime"),jt=({icon:e,className:o,onClick:t})=>e?(0,_.jsx)(e,{className:o,onClick:t}):(0,_.jsx)("span",{}),H=({id:e,label:o,leftIcon:t,rightIcon:r,errorIcon:a=_t.ImCross,error:n,onClickLeftIcon:i,onClickRightIcon:s,fieldOrientation:l="vertical",children:c,isFocus:m=!1,variant:d,ref:p})=>{let u=h({"form-field":!0,focus:m,error:!!n,"variant-content-border":d==="content-border","variant-content-line":d==="line","variant-full-border":d==="full-border","variant-inline":l==="horizontal"}),g=b=>f=>{f.stopPropagation();let v=document.getElementById(e);v?.focus(),v?.click(),b&&b()};return(0,_.jsxs)("section",{className:u,ref:p,children:[o?(0,_.jsx)(R,{className:"field-label",noPadding:!0,variant:"label-form",htmlFor:e,children:o}):null,(0,_.jsxs)("section",{className:"field-content",children:[jt({className:"field-left-icon",icon:t,onClick:g(i)}),(0,_.jsx)("section",{className:"field-children",children:c}),jt({className:"field-right-icon",icon:r,onClick:g(s)})]}),!!n&&(0,_.jsxs)("section",{className:"field-message",children:[a?(0,_.jsx)(a,{size:10}):(0,_.jsx)("span",{}),(0,_.jsx)(R,{noPadding:!0,variant:"small",children:n})]})]})};var to=require("react/jsx-runtime"),Bo=({name:e,value:o,setValue:t,onBlur:r,onFocus:a,type:n="date",className:i="",style:s={},autoFocus:l=!1,readOnly:c=!1,disabled:m=!1,placeholder:d="",autoComplete:p="off",isDirty:u=!1,isTouched:g=!1,invalid:b=!1,error:f,...v})=>{let y=(0,Wt.useMemo)(()=>crypto.randomUUID(),[]),{isFocus:C,handlers:T}=O({onBlur:r,onChange:x=>t(x.target.value),onFocus:a});return(0,to.jsx)(H,{id:y,error:f,isFocus:C,...v,children:(0,to.jsx)("input",{id:y,type:n,name:e,className:i,style:s,value:o,autoFocus:l,autoComplete:p,placeholder:d,disabled:m,readOnly:c,...T})})},pn=({rules:e,...o})=>(0,to.jsx)(I,{Component:Bo,defaultValue:"",inputProps:o,rules:e});Bo.Controller=pn;var Xt=require("react");var ro=require("react/jsx-runtime"),Go=({name:e,value:o,setValue:t,onBlur:r,onFocus:a,pattern:n,type:i="text",className:s="",style:l={},autoFocus:c=!1,readOnly:m=!1,disabled:d=!1,placeholder:p="",autoComplete:u="off",isDirty:g=!1,isTouched:b=!1,invalid:f=!1,error:v,min:y,max:C,...T})=>{let x=(0,Xt.useMemo)(()=>crypto.randomUUID(),[]),{handlers:P,isFocus:S}=O({onChange:D=>t(D.target.value),onBlur:r,onFocus:a});return(0,ro.jsx)(H,{id:x,error:v,isFocus:S,...T,children:(0,ro.jsx)("input",{id:x,type:i,name:e,className:s,style:l,value:o,pattern:n,autoFocus:c,autoComplete:u,placeholder:p,disabled:d,readOnly:m,min:y,max:C,...P})})},mn=({rules:e,...o})=>(0,ro.jsx)(I,{Component:Go,defaultValue:"",inputProps:o,rules:e});Go.Controller=mn;var Uo=require("react"),ao=require("react-icons/fi"),Qt=require("react-icons/io");var no=require("react/jsx-runtime"),Vo=({name:e,value:o,setValue:t,onBlur:r,onFocus:a,className:n="",style:i={},autoFocus:s=!1,readOnly:l=!1,disabled:c=!1,placeholder:m="",autoComplete:d="off",isDirty:p=!1,isTouched:u=!1,invalid:g=!1,error:b,...f})=>{let v=(0,Uo.useMemo)(()=>crypto.randomUUID(),[]),[y,C]=Lt(["password","text"]),{isFocus:T,handlers:x}=O({onBlur:r,onChange:S=>t(S.target.value),onFocus:a}),P=(0,Uo.useMemo)(()=>y==="password"?ao.FiEye:y==="text"?ao.FiEyeOff:Qt.IoIosWarning,[y]);return(0,no.jsx)(H,{id:v,error:b,isFocus:T,...f,rightIcon:P,onClickRightIcon:()=>C(),children:(0,no.jsx)("input",{id:v,type:y,name:e,className:n,style:i,value:o,autoFocus:s,autoComplete:d,placeholder:m,disabled:c,readOnly:l,...x})})},un=({rules:e,...o})=>(0,no.jsx)(I,{Component:Vo,defaultValue:"",inputProps:o,rules:e});Vo.Controller=un;var ar=Co(require("color"),1),X=require("react"),lo=require("react-colorful"),ir=require("react-icons/fa6"),sr=Co(require("use-eye-dropper"),1);var W=require("react"),er=require("react-icons/im");var io=require("react");var Zt=require("react-dom");var Yo=({children:e,id:o})=>{let t=mt(o);return t===null?null:(0,Zt.createPortal)(e,t)};var Kt=require("react");var qt=require("react/jsx-runtime"),Jt=(a=>(a.OPAQUE="opaque",a.TRANSPARENT="transparent",a.BLUR="blur",a.NONE="none",a))(Jt||{}),jo=({opacity:e=.6,backdrop:o="blur",zIndex:t,backdropOnClick:r,modalState:a})=>{let n=h({"modal-backdrop":!0,"backdrop-close":a==="CLOSING"||a==="CLOSED"}),i=(0,Kt.useMemo)(()=>({opaque:{background:`hsl(from var(--color-background-paper) h s l / ${e*100}%)`},transparent:{background:"transparent"},blur:{background:`hsl(from var(--color-background-paper) h s l / ${e*100}%)`,backdropFilter:"blur(5px)"},none:{display:"none"}})[o]??{},[o,e]);return o==="none"?null:(0,qt.jsx)("section",{tabIndex:-1,onClick:r,className:n,style:{zIndex:t,...i}})};var ke=require("react/jsx-runtime"),Z=({id:e,children:o,isOpen:t,onClose:r,className:a="",style:n={},rootStyle:i={},animation:s="fade-down",closeAnimationClassName:l="modal-close",modalRef:c,closeOnClickOutside:m=!0,transitionDuration:d=300,windowOffset:p=10,offset:u=20,position:g,containerRef:b,zIndex:f=1e3,...v})=>{let y=(0,io.useMemo)(()=>crypto.randomUUID(),[]),C=(0,io.useRef)(null),{modalState:T,isVisible:x}=kt({transitionDuration:d,isOpen:t});Pt({modalRef:c??C,containerRef:b,offset:u,windowOffset:p,position:g,isOpen:x}),lt(c??C,()=>{t&&m&&r()});let P=h({"modal-content":!0,[a]:!!a,[`animation-${s}`]:!!s&&s!=="none",[l]:T==="CLOSING"||T==="CLOSED"});return x?(0,ke.jsxs)(Yo,{id:`modal-${e}-${y}`,children:[(0,ke.jsx)(jo,{...v,modalState:T,zIndex:f}),(0,ke.jsx)("section",{className:"modal",ref:c??C,style:{maxWidth:`calc(100dvw - ${p*2}px)`,maxHeight:`calc(100dvh - ${p*2}px)`,...i,zIndex:+f+1},children:(0,ke.jsx)("section",{style:{...n,animationDuration:`${d}ms`},className:P,children:o})})]}):null};var j=require("react/jsx-runtime"),or=(0,W.createContext)(null),gn=()=>{let e=(0,W.useContext)(or);if(!e)throw new Error("useActionModalContext must be used within a ActionModal");return e},Se=({children:e,isOpen:o,onClose:t,actionRequired:r,icon:a,noCloseButton:n,lineOnTop:i=!1,backCard:s=!1,noPadding:l=!1,className:c="",style:m={},...d})=>{let[p,u]=(0,W.useState)(!1),g=(0,W.useRef)(null),b=(0,W.useCallback)(()=>{g.current?.classList.add("shake-animation"),setTimeout(()=>{g.current?.classList.remove("shake-animation")},500)},[]),f=h({"action-modal-content":!0,"back-card":s,"line-on-top":i,"no-padding":l});return(0,j.jsx)(or.Provider,{value:{onClose:t,isActionInProgress:p,setIsActionInProgress:u},children:(0,j.jsx)(Z,{className:"action-modal",id:"action-modal",animation:"bounce",opacity:.8,isOpen:o,onClose:t,...d,backdropOnClick:r?b:t,position:"center",children:(0,j.jsx)("section",{ref:g,className:"modal-content",children:(0,j.jsxs)("section",{className:f,children:[!n&&!r&&(0,j.jsx)("section",{className:"close-modal-button",onClick:()=>t(),children:(0,j.jsx)(er.ImCross,{})}),a?(0,j.jsx)(R,{variant:"header4",className:"action-modal-icon",children:(0,j.jsx)(a,{})}):null,(0,j.jsx)("section",{className:"action-modal-body",children:(0,j.jsx)("section",{className:`action-modal-content ${c}`,style:m,children:e})})]})})})})},hn=({onClick:e,children:o,isLoading:t,...r})=>{let{onClose:a,isActionInProgress:n,setIsActionInProgress:i}=gn(),[s,l]=(0,W.useState)(!1),c=(0,W.useCallback)(()=>{l(!0),i(!0);let m=e();m instanceof Promise?m.then(()=>{a(),l(!1),i(!1)}):(a(),l(!1),i(!1))},[e,a,i]);return!s&&n?null:(0,j.jsx)(Fo,{...r,onClick:c,isLoading:t||s,children:o})};Se.ActionButton=hn;var tr=require("react"),rr=require("react-icons/im");var Ee=require("react/jsx-runtime"),bn=({children:e,isOpen:o,onClose:t,position:r="left",size:a,className:n="",...i})=>{let s=(0,tr.useMemo)(()=>({top:{height:a,width:"100%"},left:{height:"100%",width:a},right:{height:"100%",width:a},bottom:{height:a,width:"100%"}})[r],[r,a]);return(0,Ee.jsxs)(Z,{id:"aside",isOpen:o,onClose:t,opacity:.6,windowOffset:0,animation:"none",className:`aside-modal ${n} ${r}`,rootStyle:s,backdropOnClick:t,position:r,...i,children:[(0,Ee.jsx)("span",{className:"close-modal-button",onClick:t,children:(0,Ee.jsx)(rr.ImCross,{})}),(0,Ee.jsx)("section",{className:"aside-modal-content",children:e})]})};var re=require("react/jsx-runtime"),vn=({title:e,onAccept:o,onReject:t=()=>null,acceptText:r,rejectText:a,children:n,isLoading:i,...s})=>(0,re.jsx)(Se,{...s,backCard:!0,children:(0,re.jsxs)("section",{className:"confirmation-modal",children:[(0,re.jsx)(R,{variant:"header4",children:e}),(0,re.jsx)("section",{children:n}),(0,re.jsxs)("section",{className:"confirmation-modal-actions",children:[!i&&(0,re.jsx)(Se.ActionButton,{variant:"flat",onClick:t,children:a}),(0,re.jsx)(Se.ActionButton,{isLoading:i,onClick:o,children:r})]})]})});var so=require("react");var L=require("react/jsx-runtime"),q=({children:e,isOpen:o,onClose:t,id:r,menuContentRef:a,contentClassName:n="",contentStyle:i={},className:s="",...l})=>{let c=h({"menu-modal":!0,[s]:!!s});return(0,L.jsx)(Z,{className:c,...l,id:`menu-${r}`,isOpen:o,onClose:t,children:(0,L.jsx)("ul",{className:`menu-content ${n}`,role:"listbox",style:i,ref:a,children:e})})},yn=({children:e,label:o="",asCheckbox:t,icon:r,id:a,disabled:n=!1,selected:i=!1,className:s="",style:l={},onClick:c=()=>null,...m})=>{let d=h({"menu-option":!0,[s]:!0,"is-disabled":n,"is-selected":i}),p=(0,so.useCallback)(g=>{g.stopPropagation(),n||c(!i)},[n,c,i]),u=(0,so.useMemo)(()=>e||(t?(0,L.jsx)(ge,{className:"menu-checkbox",disabled:n,value:i,setValue:g=>c(g),name:"option",style:{pointerEvents:"none"},size:"small",label:(0,L.jsxs)(L.Fragment,{children:[r!==void 0&&(0,L.jsx)(r,{className:"option-icon"}),(0,L.jsx)(R,{variant:"label",children:o})]})}):(0,L.jsxs)(L.Fragment,{children:[r!==void 0&&(0,L.jsx)(r,{className:"option-icon"}),typeof o=="string"?(0,L.jsx)(R,{variant:"label",children:o}):o]})),[t,e,n,r,o,c,i]);return(0,L.jsxs)("li",{...m,id:a,role:"option",tabIndex:-1,"aria-selected":i,"aria-disabled":n,onClick:p,className:d,style:l,children:[(0,L.jsx)(fe,{zIndex:10}),u]})},xn=()=>(0,L.jsx)("li",{children:(0,L.jsx)(Ne,{className:"divider"})}),nr=({children:e,className:o="",...t})=>(0,L.jsx)("li",{tabIndex:-1,className:"menu-label",children:(0,L.jsx)(R,{...t,variant:"small",className:`menu-group-label ${o}`,children:e})}),Tn=({children:e,label:o,className:t="",style:r={},contentClassName:a="",contentStyle:n={},...i})=>{let s=h({"menu-group":!0,[t]:!!t});return(0,L.jsxs)("li",{tabIndex:-1,...i,className:s,style:r,children:[o&&(0,L.jsx)(nr,{children:o}),(0,L.jsx)("ul",{className:`menu-group-content ${a}`,role:"listbox",style:n,children:e})]})};q.Option=yn;q.Divider=xn;q.GroupLabel=nr;q.Group=Tn;var Y=require("react/jsx-runtime"),_o=({name:e,value:o,setValue:t,onBlur:r,onFocus:a,showValueText:n=!1,className:i="",style:s={},autoFocus:l=!1,readOnly:c=!1,disabled:m=!1,placeholder:d="",autoComplete:p="off",isDirty:u=!1,isTouched:g=!1,invalid:b=!1,error:f,...v})=>{let{open:y,isSupported:C}=(0,sr.default)(),[T,x]=(0,X.useState)(o),P=(0,X.useMemo)(()=>crypto.randomUUID(),[]),S=(0,X.useRef)(null),[D,F]=(0,X.useState)(!1),{handlers:V,isFocus:U}=O({onChange:A=>x(A.target.value),onBlur:A=>{B(),r&&r(A)},onFocus:A=>{B(),a&&a(A)}}),w=(0,X.useMemo)(()=>{let A=(0,ar.default)(o===""?"#000000":o);return A.isLight()||A.alpha()<.5?"#000000":"#FFFFFF"},[o]),E=async()=>{let{sRGBHex:A}=await y();t(A)};(0,X.useEffect)(()=>{x(o)},[o]);let B=(0,X.useCallback)(()=>{T.match(/^#(?:(?:[\da-f]{3}){1,2}|(?:[\da-f]{4}){1,2})$/i)?t(T):x(o)},[T,t,o]),se=h({"input-color-box":!0,[i]:!!i});return(0,Y.jsxs)(H,{id:P,error:f,isFocus:U,...v,children:[(0,Y.jsxs)("section",{className:"input-color",onClick:A=>{A.stopPropagation(),F(!0)},ref:S,children:[(0,Y.jsx)("section",{className:se,style:{borderColor:w,background:o,color:o,...s}}),n?(0,Y.jsx)("input",{id:P,name:e,value:T,placeholder:d,readOnly:c,autoFocus:l,disabled:m,autoComplete:p,className:"color-input",...V}):null]}),(0,Y.jsxs)(Z,{id:"input-color",isOpen:D,onClose:()=>F(!1),position:"bottom right",offset:5,backdrop:"transparent",containerRef:S,className:"input-color-selector",children:[(0,Y.jsx)(lo.HexAlphaColorPicker,{id:P,color:o,onChange:t}),(0,Y.jsxs)("section",{className:"color-input-container",children:[C()?(0,Y.jsx)(ir.FaEyeDropper,{onClick:()=>{E()}}):(0,Y.jsx)("span",{}),(0,Y.jsx)(lo.HexColorInput,{className:"color-input",id:P,name:e,color:o,placeholder:"Type a color",prefixed:!0,alpha:!0,onChange:t}),(0,Y.jsx)("span",{})]})]})]})},Cn=({rules:e,...o})=>(0,Y.jsx)(I,{Component:_o,defaultValue:"#147EFB",inputProps:o,rules:e});_o.Controller=Cn;var ne=require("react"),De=require("react-icons/fa6"),cr=require("react-icons/io"),co=require("react-icons/pi");var wn=require("react");var lr=require("react");var Ae=({tag:e="section",children:o,className:t,style:r,flow:a,columnSize:n,rowSize:i,column:s,row:l,pc:c,pi:m,ps:d,jc:p,ji:u,js:g,ac:b,ai:f,as:v,gtc:y,gtr:C,gta:T,gt:x,gap:P,...S})=>(0,lr.createElement)(e,{className:t,...S,style:{...r,...a?{gridAutoFlow:a}:{},...n?{gridAutoColumns:n}:{},...i?{gridAutoRows:i}:{},...s?{gridColumn:s}:{},...l?{gridRow:l}:{},...c?{placeContent:c}:{},...m?{placeItems:m}:{},...d?{placeSelf:d}:{},...p?{justifyContent:p}:{},...u?{justifyItems:u}:{},...g?{justifySelf:g}:{},...b?{alignContent:b}:{},...f?{alignItems:f}:{},...v?{alignSelf:v}:{},...y?{gridTemplateColumns:y}:{},...C?{gridTemplateRows:C}:{},...T?{gridTemplateAreas:T}:{},...x?{gridTemplate:x}:{},...P?{gap:P}:{},display:"grid"}},o);var k=require("react/jsx-runtime"),Wo=({name:e,value:o={},setValue:t,onBlur:r,onFocus:a,className:n="",style:i={},autoFocus:s=!1,readOnly:l=!1,disabled:c=!1,placeholder:m="Click to upload or drag and drop",autoComplete:d="off",accept:p,multiple:u=!1,limitSize:g=5e6,errorTimeout:b=3e3,label:f})=>{let[v,y]=(0,ne.useState)(null),C=(0,ne.useMemo)(()=>crypto.randomUUID(),[]),{handlers:T}=O({onBlur:r,onFocus:a,onChange:w=>{let{files:E}=w.target;E&&x(E)}});(0,ne.useEffect)(()=>{let w=null;return v!==null&&(w=setTimeout(()=>{y(null)},b)),()=>{w!==null&&clearTimeout(w)}},[v,b]);let x=w=>{let E=u?{...o}:{},B=u?w.length:1;for(let se=0;se<B;se++){let A=w.item(se);A&&(A.size<g?E[A.name]=A:y(`File '${A.name}' size is larger than ${Ce(g)}`))}t(E)},P=w=>{w.preventDefault(),w.stopPropagation(),w.dataTransfer.files&&w.dataTransfer.files.length&&x(w.dataTransfer.files)},S=(0,ne.useCallback)(w=>({"image/png":co.PiFilePngFill,"application/pdf":co.PiFilePdfFill})[w]??cr.IoIosWarning,[]),D=w=>{let E={...o};delete E[w.name],t(E)},F=()=>{t({})},V=(0,ne.useMemo)(()=>Object.values(o).reduce((w,{size:E})=>w+E,0),[o]),U=(w,E)=>{let B=S(w.type);return(0,k.jsxs)("section",{className:"input-file-card",children:[(0,k.jsx)("section",{className:"file-card--image",children:(0,k.jsx)(B,{})}),(0,k.jsxs)(Ae,{children:[(0,k.jsx)(R,{variant:"label",noPadding:!0,nowrap:!0,children:w.name}),(0,k.jsx)(R,{noPadding:!0,variant:"small",children:Ce(w.size)})]}),(0,k.jsx)("section",{className:"file-card--delete",onClick:()=>D(w),children:(0,k.jsx)(De.FaRegTrashCan,{})})]},E)};return(0,k.jsxs)("section",{className:"input-file-container",children:[!!f&&(0,k.jsx)(R,{variant:"label-form",htmlFor:C,noPadding:!0,children:f}),(0,k.jsxs)("section",{className:"input-file--box",onDrop:P,children:[(0,k.jsx)("section",{className:"input-file--box--icon",children:(0,k.jsx)(De.FaMagnifyingGlass,{})}),(0,k.jsxs)(Ae,{children:[(0,k.jsx)(R,{variant:"label-form",htmlFor:C,noPadding:!0,weight:"bold",children:m}),(0,k.jsxs)(R,{variant:"small",noPadding:!0,children:["Max size (",Ce(g),")"]})]}),(0,k.jsx)("input",{id:C,type:"file",name:e,value:"",placeholder:m,readOnly:l,autoFocus:s,disabled:c,autoComplete:d,className:n,style:i,accept:p,multiple:u,title:"",...T})]}),v!==null&&(0,k.jsx)(R,{variant:"small",noPadding:!0,className:"error",children:v}),Object.keys(o).length>0&&(0,k.jsxs)(k.Fragment,{children:[u&&(0,k.jsxs)("span",{className:"total-info",children:[(0,k.jsxs)(R,{variant:"small",noPadding:!0,children:[Object.keys(o).length," files - ",Ce(V)]}),(0,k.jsx)("span",{className:"total-info--delete",onClick:F,children:(0,k.jsx)(De.FaRegTrashCan,{})})]}),(0,k.jsx)("section",{className:"input-file--files",children:(0,k.jsx)("section",{className:"input-file--files--content",children:Object.values(o).map(U)})})]})]})},Rn=({rules:e,...o})=>(0,k.jsx)(I,{Component:Wo,defaultValue:{},inputProps:o,rules:e});Wo.Controller=Rn;var he=require("react");var mo=require("react/jsx-runtime"),dr={comma:/(?!^-)[^0-9,]/g,dot:/(?!^-)[^0-9.]/g},pr=(e,o=".")=>{let t=o==="."?dr.dot:dr.comma,r=e.replace(t,"").replace(",",".");return r||""},po=(e,o)=>!e||Number.isNaN(e)?o(0):o(e),Xo=({name:e,value:o,setValue:t,onBlur:r,onFocus:a,pattern:n,className:i="",style:s={},autoFocus:l=!1,readOnly:c=!1,disabled:m=!1,placeholder:d="",autoComplete:p="off",isDirty:u=!1,isTouched:g=!1,invalid:b=!1,error:f,min:v,max:y,decimalSeparator:C,format:T={locales:"en-US",style:"decimal",minimumFractionDigits:0,maximumFractionDigits:2},...x})=>{let P=(0,he.useMemo)(()=>crypto.randomUUID(),[]),S=(0,he.useMemo)(()=>{if(typeof T=="function")return T;let{locales:w,...E}=T;return Intl.NumberFormat(w,E).format},[T]),[D,F]=(0,he.useState)(po(o,S)),{handlers:V,isFocus:U}=O({onChange:w=>{let E=pr(w.target.value,C);E.endsWith(".")?F(w.target.value):(F(po(Number(E),S)),t(Number(E)))},onBlur:w=>{let E=pr(w.target.value,C);F(po(Number(E),S)),t(Number(E)),r&&r(w)},onFocus:a});return(0,he.useEffect)(()=>{let w=po(o,S);D!==w&&F(w)},[S,D,o]),(0,mo.jsx)(H,{id:P,error:f,isFocus:U,...x,children:(0,mo.jsx)("input",{id:P,type:"text",name:e,className:i,style:s,value:D,pattern:n,autoFocus:l,autoComplete:p,placeholder:d,disabled:m,readOnly:c,min:v,max:y,...V})})},Pn=({rules:e,...o})=>(0,mo.jsx)(I,{Component:Xo,defaultValue:0,inputProps:o,rules:e});Xo.Controller=Pn;var mr=require("react");var de=require("react/jsx-runtime"),Qo=({name:e,value:o,setValue:t,onBlur:r,onFocus:a,className:n="",style:i={},autoFocus:s=!1,readOnly:l=!1,disabled:c=!1,autoComplete:m="off",radioValue:d,label:p,color:u="primary",size:g="regular"})=>{let b=(0,mr.useMemo)(()=>crypto.randomUUID(),[]),{handlers:f}=O({onChange:C=>t(C.target.value),onBlur:r,onFocus:a}),v=h({"radio-container":!0,[n]:!!n,[`color-${u}`]:!!u}),y=h({radio:!0,"is-checked":d===o,[`size-${g}`]:!!g});return(0,de.jsxs)("section",{className:v,style:i,children:[(0,de.jsxs)("section",{className:y,children:[(0,de.jsx)("section",{className:"radio-fill"}),(0,de.jsx)("input",{id:b,type:"radio",name:e,className:`radio-input ${n}`,style:i,value:d,checked:d===o,autoFocus:s,autoComplete:m,disabled:c||l,...f})]}),p?(0,de.jsx)(R,{variant:"label-form",htmlFor:b,className:"radio-label",children:p}):null]})},kn=({rules:e,...o})=>(0,de.jsx)(I,{Component:Qo,defaultValue:"",inputProps:o,rules:e});Qo.Controller=kn;var z=require("react"),br=require("react-icons/im"),vr=require("react-icons/pi");var ur=require("react");var ae=require("react/jsx-runtime"),Zo=({isLoading:e=!1,hasNextPage:o=!1,loadMore:t,customLoadMoreElement:r,emptyMessage:a,children:n})=>{let{ref:i,inView:s}=Ct(),l=Po(e,100);(0,ur.useEffect)(()=>{o&&s&&!l&&t()},[o,l,t,s]);let c=Array.isArray(n)?n.length>0:!!n;return(0,ae.jsxs)(ae.Fragment,{children:[n,(0,ae.jsxs)("section",{className:"infinity-scroll",children:[!!a&&!c&&!l&&(0,ae.jsx)("p",{className:"empty-message",children:a}),(o||l)&&(r?r(i):(0,ae.jsx)("section",{ref:i,className:"loading",children:l&&(0,ae.jsx)("span",{className:"loading--icon",children:":D"})}))]})]})};var be=require("react");var Ko=require("react/jsx-runtime"),fr=({children:e,value:o})=>{let{multiselect:t,isEqualComparator:r,maxOptions:a,selectedValue:n,setValue:i,setIsOpen:s}=gr(),l=(0,be.useCallback)((u,g)=>["number","string"].includes(typeof u)?u===g:!!r&&r(u,g),[r]),c=(0,be.useCallback)(u=>{if(u)if(t){if(a&&Array.isArray(n)&&n.length>=a)return;i([...n,o])}else i(o),s(!1);else t?i(n.filter(g=>!l(g,o))):(i(null),s(!1))},[t,a,n,i,o,s,l]),m=(0,be.useMemo)(()=>n===""||n===null?!1:Array.isArray(n)?["number","string"].includes(typeof o)?n.includes(o):n.some(u=>!!r&&r(o,u)):l(o,n),[l,r,n,o]),d=(0,be.useCallback)(u=>{["Enter"," "].includes(u.key)&&(u.preventDefault(),c(!(m&&t)))},[c,m,t]),p=(0,be.useMemo)(()=>typeof e=="string"?(0,Ko.jsx)(R,{"data-value":o,variant:"label",nowrap:!0,children:e}):e,[e,o]);return(0,Ko.jsx)(q.Option,{label:p,onKeyDown:d,asCheckbox:t,selected:m,onClick:u=>c(t?u:!0)})};var G=require("react");var ve=require("react/jsx-runtime"),Sn=({height:e,minHeight:o,containerRef:t,offset:r,windowOffset:a})=>{let[n,i]=(0,G.useState)(void 0),s=(0,G.useCallback)(()=>{let l=t.current?.getBoundingClientRect().bottom??0,c=window.innerHeight-l-a-r-5,m=window.innerHeight-a*3,d=c<o?m:c,p=Math.min(d,e),u=Math.max(p,o);i(`${Math.round(u)}px`)},[t,a,r,o,e]);return(0,G.useEffect)(()=>{s()},[s]),ce(t,s),N("resize",s),{h:n}},hr=({children:e,searchQueryValue:o,searchQueryPlaceholder:t="Search option",searchQueryClassName:r="",searchQueryStyle:a={},onSearchQuery:n,containerRef:i,height:s=300})=>{let l=(0,G.useRef)(null),c=(0,G.useRef)(null),[m,d]=(0,G.useState)(""),p=(0,G.useRef)(null),u=_e("(max-width: 480px)");N("keydown",T=>{if(["ArrowDown","ArrowUp"].includes(T.code)){T.preventDefault();let x=document.activeElement;if(x?.tagName==="LI")switch(T.code){case"ArrowDown":x?.nextSibling?.focus();break;case"ArrowUp":x?.previousElementSibling?.focus();break}}});let g=(0,G.useCallback)(T=>{let{value:x}=T.target;n&&n(x),d(x)},[n]);(0,G.useEffect)(()=>{p.current&&p.current.focus()},[]);let{h:b}=Sn({height:s,minHeight:150,containerRef:i,offset:5,windowOffset:10}),[f,v]=(0,G.useState)(!1),y=(0,G.useCallback)(()=>{let T=Math.round(l.current?.getBoundingClientRect().height??0)+2,x=Math.round(c.current?.scrollHeight??0);v(T>=x)},[]);(0,G.useEffect)(y,[y]),ce(l,y),ce(c,y),N("resize",y);let C=h({"select-options-header":!0,[r]:!!r});return(0,ve.jsxs)("section",{className:`select-options ${n?"with-search-query":""}`,style:u?{maxHeight:window.innerHeight-100,width:window.innerWidth-100}:{height:f?"auto":b,maxHeight:s,width:i.current?.offsetWidth??"auto"},children:[n&&(0,ve.jsx)("section",{className:C,style:a,children:(0,ve.jsx)("input",{name:"query",className:"input-search",value:o??m,onChange:g,placeholder:t,onClick:T=>T.stopPropagation(),ref:p,autoFocus:!0})}),(0,ve.jsx)("section",{className:"select-options-list-container",ref:l,children:(0,ve.jsx)("ul",{className:"select-options-list",ref:c,children:e})})]})};var M=require("react/jsx-runtime"),yr=(0,z.createContext)(null),gr=()=>{let e=(0,z.useContext)(yr);if(!e)throw new Error("useSelectContext must be used within a Select component");return e},En=({children:e})=>{let o=(0,z.useMemo)(()=>typeof e=="string"?(0,M.jsx)(R,{noPadding:!0,variant:"label",nowrap:!0,children:e}):e,[e]);return(0,M.jsx)(q.GroupLabel,{children:o})},Mn=({value:e})=>(0,M.jsx)(R,{variant:"label",nowrap:!0,children:typeof e=="string"||typeof e=="number"?e:JSON.stringify(e)}),In=({value:e,multiselect:o})=>o?(0,M.jsx)(R,{noPadding:!0,nowrap:!0,variant:"label",children:`${e.length} item${e.length===1?"":"s"} selected`}):e===null?null:(0,M.jsx)(R,{noPadding:!0,variant:"label",nowrap:!0,children:typeof e=="string"||typeof e=="number"?e:JSON.stringify(e)}),pe=({options:e,isEqualComparator:o,searchQueryValue:t,searchQueryPlaceholder:r,onSearchQuery:a,loadMore:n=()=>null,isLoading:i=!1,hasNextPage:s=!1,emptyMessage:l="No options to select",multiselect:c,optionComponent:m=Mn,valueComponent:d=In,maxOptions:p,children:u,name:g,value:b,setValue:f,onBlur:v,onFocus:y,className:C="",style:T={},showClearOption:x=!1,height:P,searchQueryStyle:S,searchQueryClassName:D,autoFocus:F=!1,readOnly:V=!1,disabled:U=!1,placeholder:w="",autoComplete:E="off",isDirty:B=!1,isTouched:se=!1,invalid:A=!1,error:vo,...$r})=>{let Br=(0,z.useRef)(null),ze=_e("(max-width: 480px)"),nt=(0,z.useMemo)(()=>crypto.randomUUID(),[]),yo=(0,z.useRef)(null),[$e,at]=(0,z.useState)(!1),xo=(0,z.useCallback)(le=>{at(le&&!U)},[U]),Gr=(0,z.useCallback)(le=>{le.stopPropagation(),f(c?[]:null)},[c,f]),To=(0,z.useMemo)(()=>c?b.length>0:!!b,[c,b]),Ur=(0,z.useMemo)(()=>u||e.map((le,Vr)=>(0,M.jsx)(pe.Option,{value:le,children:(0,M.jsx)(m,{value:le})},Vr)),[m,u,e]);return(0,M.jsx)(yr.Provider,{value:{selectedValue:b,setValue:f,multiselect:c??!1,isEqualComparator:o,maxOptions:p??null,setIsOpen:at},children:(0,M.jsx)(H,{id:nt,error:vo,isFocus:$e,ref:yo,...$r,children:(0,M.jsxs)("section",{id:g,style:T,onBlur:v,className:`select ${U?"disabled":""} ${C}`,children:[(0,M.jsxs)("section",{id:nt,className:`select-container ${To&&x?"three-columns":""}`,onClick:()=>xo(!0),children:[(0,M.jsx)("button",{type:"button",className:`input-button ${(Array.isArray(b)?b.length>0:b)?"":"placeholder"}`,"aria-haspopup":"listbox","aria-expanded":$e,onFocus:le=>{xo(!0),y&&y(le)},children:To?(0,M.jsx)(d,{...c?{value:b,multiselect:c}:{value:b}}):(0,M.jsx)(R,{variant:"label",noPadding:!0,nowrap:!0,children:w})}),To&&x&&(0,M.jsx)("section",{className:"icon-close",onClick:Gr,children:(0,M.jsx)(br.ImCross,{})}),(0,M.jsx)(vr.PiCaretDown,{className:`select-caret-icon ${$e&&"is-select-open"}`})]}),(0,M.jsx)(q,{id:"form-select",isOpen:$e,onClose:()=>xo(!1),backdrop:ze?"blur":"transparent",opacity:ze?.8:.4,position:ze?"center":"bottom",offset:5,modalRef:Br,windowOffset:10,transitionDuration:200,containerRef:ze?void 0:yo,contentClassName:"select-menu-content",className:"select-options-menu",children:(0,M.jsx)(hr,{containerRef:yo,onSearchQuery:a,searchQueryValue:t,searchQueryPlaceholder:r,searchQueryClassName:D,searchQueryStyle:S,height:P,children:(0,M.jsx)(Zo,{isLoading:i,hasNextPage:s,loadMore:n,emptyMessage:l,children:Ur})})})]})})})},Nn=({rules:e,...o})=>(0,M.jsx)(I,{Component:pe,defaultValue:[],inputProps:{...o,multiselect:!0},rules:e}),Ln=({rules:e,...o})=>(0,M.jsx)(I,{Component:pe,defaultValue:null,inputProps:{...o,multiselect:!1},rules:e}),On=e=>{let{multiselect:o}=e;return o?(0,M.jsx)(Nn,{...e,multiselect:!0}):(0,M.jsx)(Ln,{...e,multiselect:!1})};pe.Controller=On;pe.Option=fr;pe.OptionLabel=En;var xr=require("react");var ye=require("react/jsx-runtime"),Jo=({name:e,value:o,setValue:t,onBlur:r,onFocus:a,min:n,max:i,step:s,onlySlider:l=!1,className:c="",style:m={},autoFocus:d=!1,readOnly:p=!1,disabled:u=!1,placeholder:g="",autoComplete:b="off",isDirty:f=!1,isTouched:v=!1,invalid:y=!1,error:C,...T})=>{let x=(0,xr.useMemo)(()=>crypto.randomUUID(),[]),P=V=>{r&&r(V);let U=parseInt(`${o}`);n!==void 0&&U<n&&t(n),i!==void 0&&U>i&&t(i),t(U)},{isFocus:S,handlers:D}=O({onBlur:P,onChange:V=>t(+V.target.value),onFocus:a}),F=h({"input-slider":!0,"is-focus":S});return(0,ye.jsx)(H,{id:x,error:C,isFocus:S,...T,children:(0,ye.jsxs)("section",{className:F,children:[(0,ye.jsx)("input",{id:x,type:"range",name:e,className:`slider ${c}`,style:m,value:o,autoFocus:d,autoComplete:b,placeholder:g,disabled:u,readOnly:p,min:n,max:i,step:s,...D}),!l&&(0,ye.jsx)("input",{id:x,type:"number",name:e,className:`slider-number ${c}`,style:m,value:o,autoComplete:b,disabled:u,readOnly:p,min:n,max:i,step:s,...D})]})})},An=({rules:e,...o})=>(0,ye.jsx)(I,{Component:Jo,defaultValue:0,inputProps:o,rules:e});Jo.Controller=An;var Tr=require("react");var uo=require("react/jsx-runtime"),qo=({name:e,value:o,setValue:t,onBlur:r,onFocus:a,rows:n=4,resize:i="vertical",className:s="",style:l={},autoFocus:c=!1,readOnly:m=!1,disabled:d=!1,placeholder:p="",autoComplete:u="off",isDirty:g=!1,isTouched:b=!1,invalid:f=!1,error:v,...y})=>{let C=(0,Tr.useMemo)(()=>crypto.randomUUID(),[]),{handlers:T,isFocus:x}=O({onBlur:r,onChange:S=>t(S.target.value),onFocus:a}),P=h({textarea:!0,[s]:!!s});return(0,uo.jsx)(H,{id:C,error:v,isFocus:x,...y,children:(0,uo.jsx)("textarea",{id:C,name:e,className:P,style:{resize:i,...l},value:o,rows:n,...T,autoFocus:c,autoComplete:u,placeholder:p,disabled:d,readOnly:m})})},Dn=({rules:e,...o})=>(0,uo.jsx)(I,{Component:qo,defaultValue:"",inputProps:o,rules:e});qo.Controller=Dn;var kr=require("react");var wr=require("react");var Cr=require("react");var xe=require("react/jsx-runtime"),Me=({position:e="top",children:o,content:t,offset:r=5,disabled:a=!1})=>{let{containerRef:n,openModal:i,closeModal:s,isOpen:l}=wt(),c=h({tooltip:!0,[e]:!0});return N("mouseenter",()=>i(),n),N("mouseleave",()=>s(),n),a?o:(0,xe.jsxs)(xe.Fragment,{children:[(0,Cr.cloneElement)(o,{ref:n}),(0,xe.jsx)(Z,{backdrop:"none",id:"tooltip",isOpen:l,containerRef:n,onClose:s,position:e,className:c,closeOnClickOutside:!1,offset:6+ +r,windowOffset:10,transitionDuration:100,closeAnimationClassName:"close-animation",children:(0,xe.jsx)("span",{className:"tooltip-content",children:t})})]})};var et=require("react/jsx-runtime"),Fn=({children:e,value:o,position:t,offset:r,tooltipText:a,tooltipCopiedText:n,copiedTextTimeout:i=500})=>{let[s,l]=(0,wr.useState)(!1);return(0,et.jsx)(Me,{content:s&&n?n:a,position:t,offset:r,children:(0,et.jsx)("span",{onClick:()=>{l(!0),navigator.clipboard.writeText(o),setTimeout(()=>l(!1),i)},children:e})})};var $=require("react/jsx-runtime"),Rr={small:1,regular:1.2,large:1.4},Pr={small:2,regular:2.5,large:3},ot=({name:e,value:o,setValue:t,onBlur:r,onFocus:a,className:n="",style:i={},autoFocus:s=!1,readOnly:l=!1,disabled:c=!1,placeholder:m="",autoComplete:d="off",label:p,leftLabel:u,rightLabel:g,width:b="regular",size:f="regular",dotHoverSize:v=1.3,padding:y=.25,leftIcon:C,rightIcon:T,internalLeftIcon:x,internalRightIcon:P,leftIconTooltip:S,rightIconTooltip:D,color:F})=>{let V=(0,kr.useMemo)(()=>crypto.randomUUID(),[]),{handlers:U}=O({onChange:vo=>t(vo.target.checked),onBlur:r,onFocus:a}),w=h({"switch-container":!0,[n]:!!n,[`color-${F}`]:!!F}),E=h({switch:!0,"is-checked":o,"is-readonly":!c&&l}),B=Rr[f]??Rr.regular,se=(Pr[b]??Pr.regular)*B,A=Math.min(y,B);return(0,$.jsxs)("section",{className:w,style:{...i,"--width":`${se}em`,"--dot-size":`${B}em`,"--dot-hover-size":`${B*Math.min(Math.max(v,1),2)}em`,"--padding":`${A}em`},children:[u?(0,$.jsx)(R,{variant:"label-form",className:"switch-label",htmlFor:V,children:u}):null,C!==void 0&&(0,$.jsx)(Me,{content:S,disabled:!S,offset:10,children:(0,$.jsx)(C,{size:`${B*.7}em`,className:"switch-icon",onClick:()=>t(!o)})}),(0,$.jsxs)("section",{className:E,children:[x!==void 0&&(0,$.jsx)("span",{className:"switch-internal-left-icon",children:(0,$.jsx)(x,{size:`${B*.7}em`})}),P!==void 0&&(0,$.jsx)("span",{className:"switch-internal-right-icon",children:(0,$.jsx)(P,{size:`${B*.7}em`})}),(0,$.jsx)("span",{className:"switch-dot"}),(0,$.jsx)("input",{id:V,type:"checkbox",name:e,className:`switch-checkbox ${n}`,style:i,checked:o,autoFocus:s,autoComplete:d,placeholder:m,disabled:c||l,...U})]}),T!==void 0&&(0,$.jsx)(Me,{content:D,disabled:!D,offset:10,children:(0,$.jsx)(T,{size:`${B*.7}em`,className:"switch-icon",onClick:()=>t(!o)})}),p||g?(0,$.jsx)(R,{variant:"label-form",className:"switch-label",htmlFor:V,children:p||g}):null]})},Hn=({rules:e,...o})=>(0,$.jsx)(I,{Component:ot,defaultValue:!1,inputProps:o,rules:e});ot.Controller=Hn;var Sr=require("react/jsx-runtime"),zn=({alt:e="",loading:o="eager",...t})=>(0,Sr.jsx)("img",{loading:o,alt:e,...t,width:"100%"});var Fe=require("react");var Er=require("react"),fo=require("react-icons/md");var ee=require("react/jsx-runtime"),Mr=({header:e,sortBy:o,icon:t,width:r,field:a,toggleSortField:n,sortField:i,orderField:s,hidden:l})=>{let c=o!==void 0?o:a,m=h({"sort-on-click":!!c}),d=c?()=>n(c):void 0,p=(0,Er.useMemo)(()=>c?(0,ee.jsx)("span",{className:"sort-icon",children:!!i&&i===c&&(s==="asc"?(0,ee.jsx)(fo.MdArrowUpward,{}):(0,ee.jsx)(fo.MdArrowDownward,{}))}):null,[c,i,s]);return l?null:(0,ee.jsxs)("th",{style:{width:r},className:m,onClick:d,children:[(0,ee.jsxs)(Ae,{flow:"column",gap:"0.5em",jc:"space-between",ai:"center",children:[t?(0,ee.jsx)(t,{}):null,(0,ee.jsx)(R,{variant:"label",noPadding:!0,children:e}),p]}),(0,ee.jsx)(fe,{color:"var(--color-primary-700)"})]})};var go=require("react/jsx-runtime"),$n=(e,{field:o,render:t,Component:r},a)=>{if(o&&e[o])return(0,go.jsx)(R,{noPadding:!0,nowrap:!0,children:e[o]});if(t)return t(e,a);if(r)return(0,go.jsx)(r,{data:e,rowKey:a})},Ir=(e,o,t)=>o.map((r,a)=>r.hidden?null:(0,go.jsx)("td",{children:$n(e,r,t)},a)),Nr=(e,o,t)=>o?e.toSorted((r,a)=>{let n=r[o],i=a[o];return["number","boolean","string"].includes(typeof n)&&["number","boolean","string"].includes(typeof i)?n===i?0:t==="asc"?n>i?1:-1:n>i?-1:1:0}):e;var ho=require("react"),Lr=()=>{let[[e,o],t]=(0,ho.useState)([null,null]),r=(0,ho.useCallback)(a=>{t(([n,i])=>a!==n?[a,"asc"]:i==="asc"?[a,"desc"]:[null,null])},[]);return{sortBy:e,order:o,toggleSortField:r}};var Ar=require("react/jsx-runtime"),Or=({data:e,columns:o,isSelected:t=!1,selectable:r=!1,rowKey:a})=>{let n=h({"row-selected":r&&t});return(0,Ar.jsx)("tr",{className:n,children:Ir(e,o,a)})};var oe=require("react/jsx-runtime"),Bn=({columns:e,data:o,width:t,selectable:r=!1,rowId:a,className:n="",tableClassName:i=""})=>{let[s,l]=(0,Fe.useState)({}),c=h({"smart-table":!0,[i]:!!i,"layout-fixed":t==="content","layout-scrollable":t==="scroll"}),m=h({"smart-table-container":!0,[n]:!!n}),{sortBy:d,order:p,toggleSortField:u}=Lr(),g=(0,Fe.useMemo)(()=>{let f=[...e];return r&&(f=[{header:`${Object.values(s).length}`,render:(v,y)=>(0,oe.jsx)(ge,{name:`selected-${y}`,value:`${y}`in s,setValue:C=>{l(T=>{let x={...T};return C?x[`${y}`]=v:delete x[`${y}`],x})}})},...f]),f},[e,r,s]),b=(0,Fe.useMemo)(()=>Nr(o,d,p),[o,d,p]);return(0,oe.jsx)("section",{className:m,children:(0,oe.jsxs)("table",{className:c,children:[(0,oe.jsx)("thead",{children:(0,oe.jsx)("tr",{children:g.map((f,v)=>(0,oe.jsx)(Mr,{toggleSortField:u,sortField:d,orderField:p,...f},v))})}),(0,oe.jsx)("tbody",{children:b.map(f=>(0,oe.jsx)(Or,{rowKey:f[a],data:f,columns:g,isSelected:`${f[a]}`in s,selectable:r},f[a]))})]})})};var ie=require("react");var me=require("react");var He=require("react/jsx-runtime");var tt={top:0,left:0,width:0,height:0};var Dr=({tabs:e=[],variant:o="solid",radius:t="full",direction:r="horizontal",color:a,children:n,openTab:i,size:s="medium",className:l="",style:c={}})=>{let m=(0,me.useRef)(null),d=(0,me.useRef)(null),[p,u]=(0,me.useState)(!1),[g,b]=(0,me.useState)(tt),f=h({"tab-list":!0,[`variant-${o}`]:!!o,[`size-${s}`]:!!s,[`radius-${t}`]:!!t,[`color-${a}`]:!!a,"vertical-direction":r==="vertical",[l]:!!l});return(0,me.useEffect)(()=>{let v=d.current?.getBoundingClientRect()??tt,y=m.current?.getBoundingClientRect()??tt,C=v.width,T=o==="line"?2:v.height,x=v.left-y.left,P=o==="line"?v.top+v.height-y.top:v.top-y.top;b({left:x,top:P,width:C,height:T}),p||setTimeout(()=>{u(!0)},100)},[p,o,i]),(0,He.jsxs)("section",{className:f,ref:m,style:c,children:[!!o&&(0,He.jsx)("span",{className:`tabs-selector ${p?"active":""}`,style:g}),e.map(({id:v,label:y})=>(0,He.jsx)(Ie.Tab,{id:v,ref:v===i?d:void 0,children:y},v)),n]})};var bo=require("react/jsx-runtime"),rt=(0,ie.createContext)(null),Fr=e=>{let o=(0,ie.useContext)(rt);if(!o)throw new Error("You cant use this component out off an Tabs component");let{openTab:t,changeOpenTab:r}=o;return[t===e,()=>r(e)]},Gn=()=>{let e=(0,ie.useContext)(rt);if(!e)throw new Error("You cant use this component out off an Tabs component");return e},Ie=({children:e,defaultOpenTab:o,onChange:t})=>{let[r,a]=(0,ie.useState)(o);return(0,ie.useEffect)(()=>{t&&t(r)},[r,t]),(0,bo.jsx)(rt.Provider,{value:{openTab:r,changeOpenTab:n=>a(n)},children:e})},Un=({id:e,children:o,className:t="",style:r={},onClick:a,ref:n})=>{let[i,s]=Fr(e),l=h({tab:!0,[t]:!!t,"is-open":i});return(0,bo.jsx)("span",{className:l,style:r,onClick:m=>{s(),a&&a(m)},ref:n,children:o})},Vn=({id:e,children:o})=>{let[t]=Fr(e);return t?o:null},Yn=({children:e,...o})=>{let{openTab:t}=Gn();return(0,bo.jsx)(Dr,{...o,openTab:t,children:e})};Ie.Tab=Un;Ie.TabPanel=Vn;Ie.TabList=Yn;var zr=require("react/jsx-runtime"),Hr=(n=>(n.NONE="none",n.SMALL="small",n.MEDIUM="medium",n.LARGE="large",n.FULL="full",n))(Hr||{}),jn=({children:e,rounded:o="medium",selected:t=!1,noWrap:r=!1,ref:a})=>{let n=h({tag:!0,[`rounded-${o}`]:!!o,"is-selected":t,"no-wrap":r});return(0,zr.jsx)("span",{className:n,ref:a,children:e})};0&&(module.exports={Accordion,AccordionItem,ActionModal,AsideModal,Backdrop,Button,Checkbox,ClickToCopy,ConfirmationModal,Cursor,DatePicker,Field,FieldOrientation,FieldVariant,FlipCard,HoverCard,Image,InfinityScroll,Input,InputColor,InputFile,InputNumber,InputPassword,Line,LineOrientation,LineStyle,Menu,Modal,ModalBackdrop,Portal,Radio,Ripple,Select,SlideCard,Slider,SmartTable,Switch,Tabs,Tag,TagRounded,Textarea,Tooltip,Typography,useAccordionItem});