@deepnoid/ui 0.1.173 → 0.1.175

package/dist/index.js

@@ -153,7 +153,7 @@ __export(index_exports, {
 module.exports = __toCommonJS(index_exports);
 
 // src/components/accordion/accordion.tsx
-var import_react = __toESM(require("react"));
+var import_react = require("react");
 
 // src/utils/tailwind-variants.ts
 var import_tailwind_variants = require("tailwind-variants");
@@ -781,8 +781,8 @@ var Accordion = (0, import_react.forwardRef)((originalProps, ref) => {
       }
     });
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { ref, className: slots.base({ class: classNames == null ? void 0 : classNames.base }), children: import_react.default.Children.map(children, (child, index) => {
-    return import_react.default.cloneElement(child, {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { ref, className: slots.base({ class: classNames == null ? void 0 : classNames.base }), children: import_react.Children.map(children, (child, index) => {
+    return (0, import_react.cloneElement)(child, {
       ...variantProps,
       ...child.props,
       isInGroup: true,
@@ -894,8 +894,8 @@ var AccordionItem = (0, import_react2.forwardRef)((originalProps, ref) => {
       }
     };
   }, [slots, classNames == null ? void 0 : classNames.content, contentHeight, isOpen, disableAnimation]);
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { ref, className: slots.base({ class: classNames == null ? void 0 : classNames.base }), children: [
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { "data-isopen": isOpen, className: slots.header({ class: classNames == null ? void 0 : classNames.header }), onClick: handleToggle, children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { ref, className: slots.base({ class: classNames == null ? void 0 : classNames.base }), onClick: handleToggle, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { "data-isopen": isOpen, className: slots.header({ class: classNames == null ? void 0 : classNames.header }), children: [
       startContent && renderContent(startContent),
       /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { className: slots.headerTitle({ class: classNames == null ? void 0 : classNames.headerTitle }), children: title }),
       endContent && renderContent(endContent)
@@ -907,16 +907,18 @@ AccordionItem.displayName = "AccordionItem";
 var accordionItem_default = AccordionItem;
 var accordionItem = tv({
   slots: {
-    base: ["group/accordion", "w-full", "flex", "flex-col", "gap-[12px]", "p-[12px]", "bg-body-background"],
-    header: [
+    base: [
+      "group/accordion",
+      "w-full",
       "flex",
-      "justify-between",
-      "items-center",
-      "text-foreground",
+      "flex-col",
+      "gap-[12px]",
+      "p-[12px]",
+      "bg-body-background",
       "cursor-pointer",
-      "select-none",
-      "gap-[8px]"
+      "select-none"
     ],
+    header: ["flex", "justify-between", "items-center", "text-foreground", "gap-[8px]"],
     headerTitle: ["w-full", "font-bold", "text-body-foreground"],
     content: [
       "overflow-hidden",
@@ -7971,7 +7973,7 @@ var textareaStyle = (0, import_tailwind_variants13.tv)({
 });
 
 // src/components/table/table.tsx
-var import_react17 = require("react");
+var import_react18 = require("react");
 var import_tailwind_variants17 = require("tailwind-variants");
 
 // src/components/checkbox/checkbox.tsx
@@ -8229,6 +8231,7 @@ var TableHead = ({
 var table_head_default = TableHead;
 
 // src/components/table/table-body.tsx
+var import_react15 = require("react");
 var import_jsx_runtime18 = require("react/jsx-runtime");
 var TableBody = ({
   slots,
@@ -8245,6 +8248,7 @@ var TableBody = ({
   classNames,
   className
 }) => {
+  const checkOverflow = (el) => el.scrollWidth > el.clientWidth;
   const renderCheckboxCell = (rowId, rowIndex) => /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
     "td",
     {
@@ -8266,11 +8270,20 @@ var TableBody = ({
           const value = row[column.field];
           const formattedValue = ((_a = column.valueFormatter) == null ? void 0 : _a.call(column, { value, field: column.field })) || value;
           const content = column.renderCell ? column.renderCell({ id: row.id, field: column.field, value, formattedValue, row }) : formattedValue;
+          const tdRef = (0, import_react15.useRef)(null);
+          const [showTitle, setShowTitle] = (0, import_react15.useState)(false);
+          (0, import_react15.useEffect)(() => {
+            if (tdRef.current) {
+              setShowTitle(checkOverflow(tdRef.current));
+            }
+          }, [content]);
           return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
             "td",
             {
-              className: clsx(slots.td(), classNames == null ? void 0 : classNames.td, column.className),
-              style: getCellStyle(column),
+              ref: tdRef,
+              className: clsx(slots.td(), classNames == null ? void 0 : classNames.td, column.className, "truncate"),
+              style: { ...getCellStyle(column), maxWidth: column.width || "150px" },
+              title: showTitle ? String(content) : void 0,
               children: content
             },
             `${row.id}-${column.field}-${colIdx}-${rowIndex}`
@@ -8297,18 +8310,18 @@ var TableBody = ({
 var table_body_default = TableBody;
 
 // src/components/pagination/pagination.tsx
-var import_react16 = require("react");
+var import_react17 = require("react");
 
 // src/components/pagination/usePagination.ts
-var import_react15 = require("react");
+var import_react16 = require("react");
 var usePagination = ({ currentPage, totalPage, groupSize, handleChangePage }) => {
-  const startPage = (0, import_react15.useMemo)(() => Math.floor((currentPage - 1) / groupSize) * groupSize + 1, [currentPage, groupSize]);
-  const endPage = (0, import_react15.useMemo)(() => Math.min(startPage + groupSize - 1, totalPage), [startPage, groupSize, totalPage]);
-  const pageList = (0, import_react15.useMemo)(
+  const startPage = (0, import_react16.useMemo)(() => Math.floor((currentPage - 1) / groupSize) * groupSize + 1, [currentPage, groupSize]);
+  const endPage = (0, import_react16.useMemo)(() => Math.min(startPage + groupSize - 1, totalPage), [startPage, groupSize, totalPage]);
+  const pageList = (0, import_react16.useMemo)(
     () => Array.from({ length: endPage - startPage + 1 }, (_, i) => startPage + i),
     [startPage, endPage]
   );
-  const handleClickMovePage = (0, import_react15.useCallback)(
+  const handleClickMovePage = (0, import_react16.useCallback)(
     (page) => (event) => {
       event.preventDefault();
       handleChangePage == null ? void 0 : handleChangePage(page);
@@ -8326,7 +8339,7 @@ var usePagination_default = usePagination;
 
 // src/components/pagination/pagination.tsx
 var import_jsx_runtime19 = require("react/jsx-runtime");
-var Pagination = (0, import_react16.forwardRef)((originalProps, ref) => {
+var Pagination = (0, import_react17.forwardRef)((originalProps, ref) => {
   const [props, variantProps] = mapPropsVariants(originalProps, paginationStyle.variantKeys);
   const {
     classNames,
@@ -8340,12 +8353,12 @@ var Pagination = (0, import_react16.forwardRef)((originalProps, ref) => {
     variant,
     size
   } = { ...props, ...variantProps };
-  const [inputPage, setInputPage] = (0, import_react16.useState)(currentPage);
+  const [inputPage, setInputPage] = (0, import_react17.useState)(currentPage);
   const isFirstPageDisabled = currentPage <= 1;
   const isPrevPageDisabled = currentPage <= 1;
   const isNextPageDisabled = currentPage >= totalPage;
   const isLastPageDisabled = currentPage >= totalPage;
-  const slots = (0, import_react16.useMemo)(() => paginationStyle(variantProps), [variantProps]);
+  const slots = (0, import_react17.useMemo)(() => paginationStyle(variantProps), [variantProps]);
   const { pageList, handleClickMovePage } = usePagination_default({
     currentPage,
     totalPage,
@@ -8713,7 +8726,7 @@ var scrollAreaStyle = (0, import_tailwind_variants16.tv)({
 
 // src/components/table/table.tsx
 var import_jsx_runtime21 = require("react/jsx-runtime");
-var Table = (0, import_react17.forwardRef)((originalProps, ref) => {
+var Table = (0, import_react18.forwardRef)((originalProps, ref) => {
   const [props, variantProps] = mapPropsVariants(originalProps, tableStyle.variantKeys);
   const {
     rows,
@@ -8738,8 +8751,8 @@ var Table = (0, import_react17.forwardRef)((originalProps, ref) => {
   } = { ...props, ...variantProps };
   const { page = 1, perPage = 15 } = pagination || {};
   const showPagination = pagination && totalData > 0;
-  const [checkedRowIds, setCheckedRowIds] = (0, import_react17.useState)(new Set(checkedRows == null ? void 0 : checkedRows.map((row) => row.id)));
-  const tableMinWidth = (0, import_react17.useMemo)(() => {
+  const [checkedRowIds, setCheckedRowIds] = (0, import_react18.useState)(new Set(checkedRows == null ? void 0 : checkedRows.map((row) => row.id)));
+  const tableMinWidth = (0, import_react18.useMemo)(() => {
     const columnsWidth = columns.reduce((total, column) => {
       if (column.width) return total + column.width;
       if (column.minWidth) return total + column.minWidth;
@@ -8748,10 +8761,10 @@ var Table = (0, import_react17.forwardRef)((originalProps, ref) => {
     const checkboxWidth = rowCheckbox ? 40 : 0;
     return columnsWidth + checkboxWidth;
   }, [columns, rowCheckbox]);
-  (0, import_react17.useEffect)(() => {
+  (0, import_react18.useEffect)(() => {
     onCheckedRowsChange == null ? void 0 : onCheckedRowsChange(getCheckedRowData(checkedRowIds));
   }, [checkedRowIds]);
-  (0, import_react17.useEffect)(() => {
+  (0, import_react18.useEffect)(() => {
     const currentRowIds = new Set(rows.map((row) => row.id));
     const ids = Array.from(checkedRowIds);
     const hasValidCheckedRows = ids.every((id) => currentRowIds.has(id));
@@ -8759,7 +8772,7 @@ var Table = (0, import_react17.forwardRef)((originalProps, ref) => {
       setCheckedRowIds(new Set(checkedRows == null ? void 0 : checkedRows.map((row) => row.id)));
     }
   }, [rows.map((row) => row.id).join(",")]);
-  (0, import_react17.useImperativeHandle)(
+  (0, import_react18.useImperativeHandle)(
     ref,
     () => ({
       checkedRowIds,
@@ -8786,7 +8799,7 @@ var Table = (0, import_react17.forwardRef)((originalProps, ref) => {
     onRowClick == null ? void 0 : onRowClick(row, index, event);
   };
   const getCheckedRowData = (checked) => rows.filter((row) => checked.has(row.id));
-  const slots = (0, import_react17.useMemo)(
+  const slots = (0, import_react18.useMemo)(
     () => tableStyle({ ...variantProps, rowClickable: typeof onRowClick === "function" }),
     [variantProps, onRowClick]
   );
@@ -9105,7 +9118,7 @@ var getCellStyle = (column) => {
 };
 
 // src/components/table/definition-table.tsx
-var import_react18 = require("react");
+var import_react19 = require("react");
 var import_jsx_runtime22 = require("react/jsx-runtime");
 var DEFAULT_CELL_CLASSES = "px-[10px] py-[8px] text-md border-r border-neutral-light h-[50px]";
 var FIRST_CELL_WIDTH_CLASS = "w-[120px] font-bold text-md text-body-foreground";
@@ -9198,10 +9211,10 @@ var DefinitionTableRow = ({
     colIndex
   );
 }) });
-var DefinitionTable = (0, import_react18.forwardRef)(
+var DefinitionTable = (0, import_react19.forwardRef)(
   ({ rows = [], footer, highlightColumnKey, classNames }, ref) => {
-    const slots = (0, import_react18.useMemo)(() => DefinitionTableStyle(), []);
-    const highlightColumnIndex = (0, import_react18.useMemo)(
+    const slots = (0, import_react19.useMemo)(() => DefinitionTableStyle(), []);
+    const highlightColumnIndex = (0, import_react19.useMemo)(
       () => getHighlightColumnIndex(rows, highlightColumnKey),
       [rows, highlightColumnKey]
     );
@@ -9234,10 +9247,10 @@ var DefinitionTableStyle = tv({
 });
 
 // src/components/select/select.tsx
-var import_react19 = require("react");
+var import_react20 = require("react");
 var import_react_dom = require("react-dom");
 var import_jsx_runtime23 = require("react/jsx-runtime");
-var Select = (0, import_react19.forwardRef)((originalProps, ref) => {
+var Select = (0, import_react20.forwardRef)((originalProps, ref) => {
   var _a, _b;
   const [props, variantProps] = mapPropsVariants(originalProps, select.variantKeys);
   const {
@@ -9254,14 +9267,14 @@ var Select = (0, import_react19.forwardRef)((originalProps, ref) => {
     optionIconPlacement,
     ...inputProps
   } = props;
-  const slots = (0, import_react19.useMemo)(() => select({ ...variantProps }), [variantProps]);
-  const [selectedOptions, setSelectedOptions] = (0, import_react19.useState)(defaultSelectedOptions || []);
-  const [targetRect, setTargetRect] = (0, import_react19.useState)(null);
-  const [optionWrapperHeight, setOptionWrapperHeight] = (0, import_react19.useState)(0);
-  const [isVisible, setIsVisible] = (0, import_react19.useState)(false);
-  const [isOpen, setIsOpen] = (0, import_react19.useState)(false);
-  const selectWrapperRef = (0, import_react19.useRef)(null);
-  const optionWrapperRef = (0, import_react19.useRef)(null);
+  const slots = (0, import_react20.useMemo)(() => select({ ...variantProps }), [variantProps]);
+  const [selectedOptions, setSelectedOptions] = (0, import_react20.useState)(defaultSelectedOptions || []);
+  const [targetRect, setTargetRect] = (0, import_react20.useState)(null);
+  const [optionWrapperHeight, setOptionWrapperHeight] = (0, import_react20.useState)(0);
+  const [isVisible, setIsVisible] = (0, import_react20.useState)(false);
+  const [isOpen, setIsOpen] = (0, import_react20.useState)(false);
+  const selectWrapperRef = (0, import_react20.useRef)(null);
+  const optionWrapperRef = (0, import_react20.useRef)(null);
   const isControlled = originalProps.value !== void 0;
   const openSelect = () => {
     if (selectWrapperRef.current) {
@@ -9301,7 +9314,7 @@ var Select = (0, import_react19.forwardRef)((originalProps, ref) => {
     setSelectedOptions(nextOptions);
     onChange == null ? void 0 : onChange(nextOptions);
   };
-  (0, import_react19.useEffect)(() => {
+  (0, import_react20.useEffect)(() => {
     const handleClickOutside = (e) => {
       var _a2;
       const target = e.target;
@@ -9312,12 +9325,12 @@ var Select = (0, import_react19.forwardRef)((originalProps, ref) => {
     window.addEventListener("mousedown", handleClickOutside);
     return () => window.removeEventListener("mousedown", handleClickOutside);
   }, []);
-  (0, import_react19.useEffect)(() => {
+  (0, import_react20.useEffect)(() => {
     if (optionWrapperRef.current) {
       setOptionWrapperHeight(optionWrapperRef.current.getBoundingClientRect().height);
     }
   }, [targetRect]);
-  (0, import_react19.useEffect)(() => {
+  (0, import_react20.useEffect)(() => {
     if (isControlled) {
       const valueArray = Array.isArray(originalProps.value) ? originalProps.value : [originalProps.value];
       const matched = options.filter((opt) => valueArray.includes(opt.value));
@@ -9687,14 +9700,14 @@ var select = tv({
 });
 
 // src/components/chip/chip.tsx
-var import_react20 = require("react");
+var import_react21 = require("react");
 var import_jsx_runtime24 = require("react/jsx-runtime");
-var Chip = (0, import_react20.forwardRef)((originalProps, ref) => {
+var Chip = (0, import_react21.forwardRef)((originalProps, ref) => {
   var _a;
   const [rawProps, variantProps] = mapPropsVariants(originalProps, chipStyle.variantKeys);
   const props = { ...rawProps, ...variantProps };
   const Component = props.onClick ? "button" : "div";
-  const slots = (0, import_react20.useMemo)(() => chipStyle({ ...variantProps }), [variantProps]);
+  const slots = (0, import_react21.useMemo)(() => chipStyle({ ...variantProps }), [variantProps]);
   const renderIcon = (name) => name ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Icon_default, { name, fill: true, size: props.size, className: slots.icon() }) : null;
   return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
     Component,
@@ -9872,12 +9885,12 @@ var chipStyle = tv({
 });
 
 // src/components/radio/radio.tsx
-var import_react21 = require("react");
+var import_react22 = require("react");
 var import_jsx_runtime25 = require("react/jsx-runtime");
-var Radio = (0, import_react21.forwardRef)((originalProps, ref) => {
+var Radio = (0, import_react22.forwardRef)((originalProps, ref) => {
   const [props, variantProps] = mapPropsVariants(originalProps, radioStyle.variantKeys);
   const { children, classNames, labelPosition = "end", ...inputProps } = props;
-  const slots = (0, import_react21.useMemo)(() => radioStyle({ ...variantProps }), [variantProps]);
+  const slots = (0, import_react22.useMemo)(() => radioStyle({ ...variantProps }), [variantProps]);
   return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
     "label",
     {
@@ -10042,16 +10055,16 @@ var radioStyle = tv({
 });
 
 // src/components/switch/switch.tsx
-var import_react22 = require("react");
+var import_react23 = require("react");
 var import_tailwind_variants22 = require("tailwind-variants");
 var import_jsx_runtime26 = require("react/jsx-runtime");
-var Switch = (0, import_react22.forwardRef)((originalProps, ref) => {
+var Switch = (0, import_react23.forwardRef)((originalProps, ref) => {
   const [rawProps, variantProps] = mapPropsVariants(originalProps, switchStyle.variantKeys);
   const { size, color, disabled, disableAnimation, id, checked, onChange, classNames, ...inputProps } = {
     ...rawProps,
     ...variantProps
   };
-  const slots = (0, import_react22.useMemo)(() => switchStyle({ ...variantProps }), [variantProps]);
+  const slots = (0, import_react23.useMemo)(() => switchStyle({ ...variantProps }), [variantProps]);
   return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("label", { className: slots.base({ class: classNames == null ? void 0 : classNames.base }), children: [
     /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
       "input",
@@ -10176,7 +10189,7 @@ var switchStyle = (0, import_tailwind_variants22.tv)({
 });
 
 // src/components/tooltip/tooltip.tsx
-var import_react24 = require("react");
+var import_react25 = require("react");
 var import_react_dom2 = require("react-dom");
 
 // src/components/tooltip/tooltip-utils.ts
@@ -10299,11 +10312,11 @@ var getTailStyles = (placement) => {
 };
 
 // src/components/tooltip/useTooltip.ts
-var import_react23 = require("react");
+var import_react24 = require("react");
 var useTooltip = ({ placement, offset, targetRect }) => {
-  const [tooltipPosition, setTooltipPosition] = (0, import_react23.useState)({ x: 0, y: 0 });
-  const tooltipRef = (0, import_react23.useRef)(null);
-  (0, import_react23.useEffect)(() => {
+  const [tooltipPosition, setTooltipPosition] = (0, import_react24.useState)({ x: 0, y: 0 });
+  const tooltipRef = (0, import_react24.useRef)(null);
+  (0, import_react24.useEffect)(() => {
     if (targetRect && tooltipRef.current) {
       const { width, height } = tooltipRef.current.getBoundingClientRect();
       const scrollX = window.scrollX;
@@ -10334,28 +10347,28 @@ var useTooltip = ({ placement, offset, targetRect }) => {
 
 // src/components/tooltip/tooltip.tsx
 var import_jsx_runtime27 = require("react/jsx-runtime");
-var Tooltip = (0, import_react24.forwardRef)((originalProps, ref) => {
+var Tooltip = (0, import_react25.forwardRef)((originalProps, ref) => {
   const [props, variantProps] = mapPropsVariants(originalProps, tooltipStyle.variantKeys);
   const { placement = "top", offset = 5, delay = 100, persistent = false, classNames, noTouchContent } = props;
-  const slots = (0, import_react24.useMemo)(() => tooltipStyle({ ...variantProps }), [variantProps]);
-  const [targetRect, setTargetRect] = (0, import_react24.useState)(null);
+  const slots = (0, import_react25.useMemo)(() => tooltipStyle({ ...variantProps }), [variantProps]);
+  const [targetRect, setTargetRect] = (0, import_react25.useState)(null);
   const { tooltipPosition, tooltipRef } = useTooltip({
     placement,
     offset,
     delay,
     targetRect
   });
-  const childrenRef = (0, import_react24.useRef)(null);
-  const delayTimeoutRef = (0, import_react24.useRef)(null);
-  const getProps = (0, import_react24.useCallback)(
+  const childrenRef = (0, import_react25.useRef)(null);
+  const delayTimeoutRef = (0, import_react25.useRef)(null);
+  const getProps = (0, import_react25.useCallback)(
     (slotKey, classNameKey) => ({
       className: slots[slotKey]({ class: classNames == null ? void 0 : classNames[classNameKey] })
     }),
     [slots, classNames]
   );
-  const getBaseProps = (0, import_react24.useCallback)(() => getProps("base", "base"), [getProps]);
-  const getContentProps = (0, import_react24.useCallback)(() => getProps("content", "content"), [getProps]);
-  const showTooltip = (0, import_react24.useCallback)(() => {
+  const getBaseProps = (0, import_react25.useCallback)(() => getProps("base", "base"), [getProps]);
+  const getContentProps = (0, import_react25.useCallback)(() => getProps("content", "content"), [getProps]);
+  const showTooltip = (0, import_react25.useCallback)(() => {
     if (childrenRef.current) {
       const rect = childrenRef.current.getBoundingClientRect();
       setTargetRect({
@@ -10368,12 +10381,12 @@ var Tooltip = (0, import_react24.forwardRef)((originalProps, ref) => {
       });
     }
   }, []);
-  const hideTooltip = (0, import_react24.useCallback)(() => {
+  const hideTooltip = (0, import_react25.useCallback)(() => {
     if (!persistent) {
       delayTimeoutRef.current = window.setTimeout(() => setTargetRect(null), delay);
     }
   }, [persistent, delay]);
-  (0, import_react24.useEffect)(() => {
+  (0, import_react25.useEffect)(() => {
     if (persistent) showTooltip();
   }, [persistent, showTooltip]);
   return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_jsx_runtime27.Fragment, { children: [
@@ -10458,10 +10471,10 @@ var tooltipStyle = tv({
 });
 
 // src/components/modal/modal.tsx
-var import_react25 = require("react");
+var import_react26 = require("react");
 var import_react_dom3 = require("react-dom");
 var import_jsx_runtime28 = require("react/jsx-runtime");
-var Modal = (0, import_react25.forwardRef)((props, ref) => {
+var Modal = (0, import_react26.forwardRef)((props, ref) => {
   const [localProps, variantProps] = mapPropsVariants(props, modal.variantKeys);
   const {
     classNames,
@@ -10476,8 +10489,8 @@ var Modal = (0, import_react25.forwardRef)((props, ref) => {
     onCancel,
     extraFooter
   } = localProps;
-  const slots = (0, import_react25.useMemo)(() => modal(variantProps), [variantProps]);
-  (0, import_react25.useEffect)(() => {
+  const slots = (0, import_react26.useMemo)(() => modal(variantProps), [variantProps]);
+  (0, import_react26.useEffect)(() => {
     document.body.classList.toggle("overflow-hidden", !!isOpen);
     if (!isOpen || isKeyboardDismissDisabled) return;
     const handleKeyDown = (e) => {
@@ -10579,18 +10592,18 @@ var modal = tv({
 });
 
 // src/components/drawer/drawer.tsx
-var import_react26 = require("react");
+var import_react27 = require("react");
 var import_react_dom4 = require("react-dom");
 var import_jsx_runtime29 = require("react/jsx-runtime");
-var Drawer = (0, import_react26.forwardRef)((props, ref) => {
+var Drawer = (0, import_react27.forwardRef)((props, ref) => {
   const [localProps, variantProps] = mapPropsVariants(props, drawer.variantKeys);
   const { classNames, isOpen, content, isKeyboardDismissDisabled = false, onClose, backdrop = true } = localProps;
   const position = props.position || "right";
-  const [shouldRender, setShouldRender] = (0, import_react26.useState)(isOpen);
-  const [isAnimating, setIsAnimating] = (0, import_react26.useState)(isOpen);
-  const [isContentAnimating, setIsContentAnimating] = (0, import_react26.useState)(isOpen);
-  const slots = (0, import_react26.useMemo)(() => drawer(variantProps), [variantProps]);
-  (0, import_react26.useEffect)(() => {
+  const [shouldRender, setShouldRender] = (0, import_react27.useState)(isOpen);
+  const [isAnimating, setIsAnimating] = (0, import_react27.useState)(isOpen);
+  const [isContentAnimating, setIsContentAnimating] = (0, import_react27.useState)(isOpen);
+  const slots = (0, import_react27.useMemo)(() => drawer(variantProps), [variantProps]);
+  (0, import_react27.useEffect)(() => {
     if (isOpen) {
       setShouldRender(true);
       requestAnimationFrame(() => {
@@ -10608,7 +10621,7 @@ var Drawer = (0, import_react26.forwardRef)((props, ref) => {
       return () => clearTimeout(timer);
     }
   }, [isOpen]);
-  (0, import_react26.useEffect)(() => {
+  (0, import_react27.useEffect)(() => {
     if (shouldRender) {
       document.body.classList.add("overflow-hidden");
     } else {
@@ -10739,15 +10752,15 @@ var drawer = tv({
 var drawer_default = Drawer;
 
 // src/components/list/list.tsx
-var import_react27 = require("react");
+var import_react28 = require("react");
 var import_jsx_runtime30 = require("react/jsx-runtime");
-var List = (0, import_react27.forwardRef)((originalProps, ref) => {
+var List = (0, import_react28.forwardRef)((originalProps, ref) => {
   const [props, variantProps] = mapPropsVariants(originalProps, listStyle.variantKeys);
   const { children, classNames } = props;
-  const slots = (0, import_react27.useMemo)(() => listStyle(variantProps), [variantProps]);
-  return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("div", { ref, className: slots.base({ class: classNames == null ? void 0 : classNames.base }), children: import_react27.Children.map(children, (child) => {
-    if (!(0, import_react27.isValidElement)(child)) return child;
-    return (0, import_react27.cloneElement)(child, {
+  const slots = (0, import_react28.useMemo)(() => listStyle(variantProps), [variantProps]);
+  return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("div", { ref, className: slots.base({ class: classNames == null ? void 0 : classNames.base }), children: import_react28.Children.map(children, (child) => {
+    if (!(0, import_react28.isValidElement)(child)) return child;
+    return (0, import_react28.cloneElement)(child, {
       ...variantProps,
       ...child.props
     });
@@ -10784,9 +10797,9 @@ var listStyle = tv({
 });
 
 // src/components/list/listItem.tsx
-var import_react28 = require("react");
+var import_react29 = require("react");
 var import_jsx_runtime31 = require("react/jsx-runtime");
-var ListItem = (0, import_react28.forwardRef)((props, ref) => {
+var ListItem = (0, import_react29.forwardRef)((props, ref) => {
   const [rawProps, variantProps] = mapPropsVariants(props, listItemStyle.variantKeys);
   const {
     title,
@@ -10798,7 +10811,7 @@ var ListItem = (0, import_react28.forwardRef)((props, ref) => {
     classNames,
     onClick
   } = { ...rawProps, ...variantProps };
-  const slots = (0, import_react28.useMemo)(() => listItemStyle(variantProps), [variantProps]);
+  const slots = (0, import_react29.useMemo)(() => listItemStyle(variantProps), [variantProps]);
   const iconSize = ["lg", "xl"].includes(size) ? "lg" : "md";
   const avatarSize = iconSize;
   return /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)("div", { ref, className: slots.base({ class: classNames == null ? void 0 : classNames.base }), "data-selected": selected, onClick, children: [
@@ -10978,9 +10991,9 @@ var listItemStyle = tv({
 });
 
 // src/components/toast/toast.tsx
-var import_react29 = require("react");
+var import_react30 = require("react");
 var import_jsx_runtime32 = require("react/jsx-runtime");
-var Toast = (0, import_react29.forwardRef)((originalProps, ref) => {
+var Toast = (0, import_react30.forwardRef)((originalProps, ref) => {
   const [props, variantProps] = mapPropsVariants(originalProps, toast.variantKeys);
   const {
     title,
@@ -10994,9 +11007,9 @@ var Toast = (0, import_react29.forwardRef)((originalProps, ref) => {
     disableAnimation,
     onClose
   } = { ...props, ...variantProps };
-  const slots = (0, import_react29.useMemo)(() => toast({ ...variantProps }), [variantProps]);
-  const toastRef = (0, import_react29.useRef)(null);
-  (0, import_react29.useImperativeHandle)(
+  const slots = (0, import_react30.useMemo)(() => toast({ ...variantProps }), [variantProps]);
+  const toastRef = (0, import_react30.useRef)(null);
+  (0, import_react30.useImperativeHandle)(
     ref,
     () => ({
       getWidth: () => {
@@ -11129,7 +11142,7 @@ var toast = tv({
 });
 
 // src/components/toast/use-toast.tsx
-var import_react30 = require("react");
+var import_react31 = require("react");
 
 // src/components/toast/toast-utils.ts
 var getToastPosition = (placement, width, offset) => {
@@ -11169,9 +11182,9 @@ var getToastPosition = (placement, width, offset) => {
 
 // src/components/toast/use-toast.tsx
 var import_jsx_runtime33 = require("react/jsx-runtime");
-var ToastContext = (0, import_react30.createContext)(null);
+var ToastContext = (0, import_react31.createContext)(null);
 var useToast = () => {
-  const context = (0, import_react30.useContext)(ToastContext);
+  const context = (0, import_react31.useContext)(ToastContext);
   if (!context) {
     throw new Error("useToast must be used within a ToastProvider");
   }
@@ -11181,10 +11194,10 @@ var ToastProvider = ({
   globalOptions,
   children
 }) => {
-  const [toasts, setToasts] = (0, import_react30.useState)([]);
-  const [containerStyle, setContainerStyle] = (0, import_react30.useState)({});
-  const toastRef = (0, import_react30.useRef)(null);
-  const addToast = (0, import_react30.useCallback)(
+  const [toasts, setToasts] = (0, import_react31.useState)([]);
+  const [containerStyle, setContainerStyle] = (0, import_react31.useState)({});
+  const toastRef = (0, import_react31.useRef)(null);
+  const addToast = (0, import_react31.useCallback)(
     (title, options = {}) => {
       const id = Date.now() + Math.floor(Math.random() * 1e5);
       const newToast = {
@@ -11201,11 +11214,11 @@ var ToastProvider = ({
     },
     [globalOptions]
   );
-  const removeToast = (0, import_react30.useCallback)((id) => {
+  const removeToast = (0, import_react31.useCallback)((id) => {
     setToasts((prevToasts) => prevToasts.filter((toast2) => toast2.id !== id));
   }, []);
   const contextValue = addToast;
-  (0, import_react30.useEffect)(() => {
+  (0, import_react31.useEffect)(() => {
     var _a;
     const width = (globalOptions == null ? void 0 : globalOptions.width) ? globalOptions.width : typeof ((_a = toastRef.current) == null ? void 0 : _a.getWidth) === "function" ? toastRef.current.getWidth() : 300;
     const offset = 20;
@@ -11226,12 +11239,12 @@ var ToastProvider = ({
 };
 
 // src/components/picker/day.tsx
-var import_react31 = require("react");
+var import_react32 = require("react");
 var import_jsx_runtime34 = require("react/jsx-runtime");
-var Day = (0, import_react31.forwardRef)((originalProps, ref) => {
+var Day = (0, import_react32.forwardRef)((originalProps, ref) => {
   const [props, variantProps] = mapPropsVariants(originalProps, dayStyle.variantKeys);
   const { classNames, children, ...divProps } = props;
-  const slots = (0, import_react31.useMemo)(() => dayStyle({ ...variantProps }), [variantProps]);
+  const slots = (0, import_react32.useMemo)(() => dayStyle({ ...variantProps }), [variantProps]);
   return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("div", { ref, className: slots.base({ class: classNames == null ? void 0 : classNames.base }), ...divProps, children });
 });
 Day.displayName = "Day";
@@ -11268,7 +11281,7 @@ var dayStyle = tv({
 });
 
 // src/components/picker/datePicker.tsx
-var import_react32 = require("react");
+var import_react33 = require("react");
 var import_react_dom5 = require("react-dom");
 
 // src/components/picker/utils.ts
@@ -11285,7 +11298,7 @@ var formatStringToDate = (date) => {
 
 // src/components/picker/datePicker.tsx
 var import_jsx_runtime35 = require("react/jsx-runtime");
-var DatePicker = (0, import_react32.forwardRef)((originalProps, ref) => {
+var DatePicker = (0, import_react33.forwardRef)((originalProps, ref) => {
   const [props, variantProps] = mapPropsVariants(originalProps, datePickerStyle.variantKeys);
   const {
     classNames,
@@ -11312,26 +11325,26 @@ var DatePicker = (0, import_react32.forwardRef)((originalProps, ref) => {
     dualCalendar = false,
     ...inputProps
   } = { ...props, ...variantProps };
-  const [selectedDate, setSelectedDate] = (0, import_react32.useState)(range ? "" : typeof value === "string" ? value || "" : "");
-  const [selectedRange, setSelectedRange] = (0, import_react32.useState)({
+  const [selectedDate, setSelectedDate] = (0, import_react33.useState)(range ? "" : typeof value === "string" ? value || "" : "");
+  const [selectedRange, setSelectedRange] = (0, import_react33.useState)({
     startDate: range && typeof value === "object" ? (value == null ? void 0 : value.startDate) || "" : "",
     endDate: range && typeof value === "object" ? (value == null ? void 0 : value.endDate) || "" : ""
   });
-  const [tempSelectedDate, setTempSelectedDate] = (0, import_react32.useState)(selectedDate);
-  const [tempSelectedRange, setTempSelectedRange] = (0, import_react32.useState)(selectedRange);
-  const [rangeSelection, setRangeSelection] = (0, import_react32.useState)("start");
-  const [isPanelOpen, setIsPanelOpen] = (0, import_react32.useState)(false);
-  const [leftCurrentDate, setLeftCurrentDate] = (0, import_react32.useState)(
+  const [tempSelectedDate, setTempSelectedDate] = (0, import_react33.useState)(selectedDate);
+  const [tempSelectedRange, setTempSelectedRange] = (0, import_react33.useState)(selectedRange);
+  const [rangeSelection, setRangeSelection] = (0, import_react33.useState)("start");
+  const [isPanelOpen, setIsPanelOpen] = (0, import_react33.useState)(false);
+  const [leftCurrentDate, setLeftCurrentDate] = (0, import_react33.useState)(
     range && tempSelectedRange.startDate ? new Date(tempSelectedRange.startDate) : tempSelectedDate ? new Date(tempSelectedDate) : /* @__PURE__ */ new Date()
   );
-  const [rightCurrentDate, setRightCurrentDate] = (0, import_react32.useState)(
+  const [rightCurrentDate, setRightCurrentDate] = (0, import_react33.useState)(
     dualCalendar ? new Date(leftCurrentDate.getFullYear(), leftCurrentDate.getMonth() + 1) : /* @__PURE__ */ new Date()
   );
-  const inputWrapperRef = (0, import_react32.useRef)(null);
-  const calendarWrapperRef = (0, import_react32.useRef)(null);
-  const [panelPos, setPanelPos] = (0, import_react32.useState)({ top: -9999, left: -9999 });
-  const blurTimeoutRef = (0, import_react32.useRef)(null);
-  const isConfirmDisabled = (0, import_react32.useMemo)(() => {
+  const inputWrapperRef = (0, import_react33.useRef)(null);
+  const calendarWrapperRef = (0, import_react33.useRef)(null);
+  const [panelPos, setPanelPos] = (0, import_react33.useState)({ top: -9999, left: -9999 });
+  const blurTimeoutRef = (0, import_react33.useRef)(null);
+  const isConfirmDisabled = (0, import_react33.useMemo)(() => {
     if (range) {
       const hasStart = !!tempSelectedRange.startDate;
       const hasEnd = !!tempSelectedRange.endDate;
@@ -11351,7 +11364,7 @@ var DatePicker = (0, import_react32.forwardRef)((originalProps, ref) => {
         return dateString;
     }
   };
-  const displayValue = (0, import_react32.useMemo)(() => {
+  const displayValue = (0, import_react33.useMemo)(() => {
     if (range) {
       const start = formatDate(selectedRange.startDate);
       const end = formatDate(selectedRange.endDate);
@@ -11361,7 +11374,7 @@ var DatePicker = (0, import_react32.forwardRef)((originalProps, ref) => {
     }
     return formatDate(selectedDate);
   }, [selectedDate, selectedRange, format, range]);
-  const calculatePosition = (0, import_react32.useCallback)(() => {
+  const calculatePosition = (0, import_react33.useCallback)(() => {
     if (inputWrapperRef.current) {
       const rect = inputWrapperRef.current.getBoundingClientRect();
       setPanelPos({ top: rect.bottom + window.scrollY + 6, left: rect.left + window.scrollX });
@@ -11404,7 +11417,7 @@ var DatePicker = (0, import_react32.forwardRef)((originalProps, ref) => {
     e.preventDefault();
     if (blurTimeoutRef.current) clearTimeout(blurTimeoutRef.current);
   };
-  const getCalendarDates = (0, import_react32.useCallback)((currentDate) => {
+  const getCalendarDates = (0, import_react33.useCallback)((currentDate) => {
     const year = currentDate.getFullYear();
     const month = currentDate.getMonth();
     const firstDayOfMonth = new Date(year, month, 1).getDay();
@@ -11500,7 +11513,7 @@ var DatePicker = (0, import_react32.forwardRef)((originalProps, ref) => {
     }
     setIsPanelOpen(false);
   };
-  const getDayProps = (0, import_react32.useCallback)(
+  const getDayProps = (0, import_react33.useCallback)(
     (dateObj, currentDate) => {
       const today = /* @__PURE__ */ new Date();
       const isToday = today.getDate() === dateObj.date && today.getMonth() === currentDate.getMonth() && today.getFullYear() === currentDate.getFullYear();
@@ -11527,7 +11540,7 @@ var DatePicker = (0, import_react32.forwardRef)((originalProps, ref) => {
   const getPlaceholderText = () => {
     return placeholder;
   };
-  (0, import_react32.useEffect)(() => {
+  (0, import_react33.useEffect)(() => {
     if (range && typeof value === "object") {
       setSelectedRange(value || { startDate: "", endDate: "" });
       setTempSelectedRange(value || { startDate: "", endDate: "" });
@@ -11538,12 +11551,12 @@ var DatePicker = (0, import_react32.forwardRef)((originalProps, ref) => {
       if (value) setLeftCurrentDate(new Date(value));
     }
   }, [value, range]);
-  (0, import_react32.useEffect)(() => {
+  (0, import_react33.useEffect)(() => {
     if (dualCalendar) {
       setRightCurrentDate(new Date(leftCurrentDate.getFullYear(), leftCurrentDate.getMonth() + 1));
     }
   }, [leftCurrentDate, dualCalendar]);
-  const slots = (0, import_react32.useMemo)(() => datePickerStyle({ ...variantProps, dualCalendar }), [variantProps, dualCalendar]);
+  const slots = (0, import_react33.useMemo)(() => datePickerStyle({ ...variantProps, dualCalendar }), [variantProps, dualCalendar]);
   const endContent = /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(Icon_default, { name: "calendar", size, className: "cursor-pointer", fill: true, onClick: handleCalendarIconClick });
   const renderCalendar = (currentDate, isLeft) => /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("div", { className: "flex flex-col gap-[5px]", children: [
     /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: slots.calendarHead({ class: classNames == null ? void 0 : classNames.calendarHead }), children: dualCalendar ? isLeft ? /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(import_jsx_runtime35.Fragment, { children: [
@@ -11560,7 +11573,7 @@ var DatePicker = (0, import_react32.forwardRef)((originalProps, ref) => {
       /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(icon_button_default, { name: "right", variant: "soft", color: "neutral", onClick: handleLeftNextMonth })
     ] }) }),
     /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: "grid grid-cols-7", children: daysOfWeek.map((day, index) => /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(day_default, { variant: "text", children: day }, `${day}-${index}`)) }),
-    /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: "grid grid-cols-7 gap-y-[5px] text-center", children: getCalendarDates(currentDate).map((week, weekIndex) => /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_react32.Fragment, { children: week.map((dateObj, index) => {
+    /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: "grid grid-cols-7 gap-y-[5px] text-center", children: getCalendarDates(currentDate).map((week, weekIndex) => /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_react33.Fragment, { children: week.map((dateObj, index) => {
       const dayVariant = getDayProps(dateObj, currentDate);
       return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
         day_default,
@@ -11708,10 +11721,10 @@ var datePickerStyle = tv({
 });
 
 // src/components/picker/timePicker.tsx
-var import_react33 = require("react");
+var import_react34 = require("react");
 var import_react_dom6 = require("react-dom");
 var import_jsx_runtime36 = require("react/jsx-runtime");
-var TimePicker = (0, import_react33.forwardRef)((originalProps, ref) => {
+var TimePicker = (0, import_react34.forwardRef)((originalProps, ref) => {
   const [props, variantProps] = mapPropsVariants(originalProps, timePickerStyle.variantKeys);
   const {
     classNames,
@@ -11724,20 +11737,20 @@ var TimePicker = (0, import_react33.forwardRef)((originalProps, ref) => {
     placeholder = "",
     ...inputProps
   } = props;
-  const [selectedRange, setSelectedRange] = (0, import_react33.useState)(
+  const [selectedRange, setSelectedRange] = (0, import_react34.useState)(
     valueRange || { start: "", end: "" }
   );
-  const [isPanelOpen, setIsPanelOpen] = (0, import_react33.useState)(false);
-  const inputWrapperRef = (0, import_react33.useRef)(null);
-  const panelWrapperRef = (0, import_react33.useRef)(null);
-  const [panelPos, setPanelPos] = (0, import_react33.useState)({ top: -9999, left: -9999 });
-  const displayValue = (0, import_react33.useMemo)(() => {
+  const [isPanelOpen, setIsPanelOpen] = (0, import_react34.useState)(false);
+  const inputWrapperRef = (0, import_react34.useRef)(null);
+  const panelWrapperRef = (0, import_react34.useRef)(null);
+  const [panelPos, setPanelPos] = (0, import_react34.useState)({ top: -9999, left: -9999 });
+  const displayValue = (0, import_react34.useMemo)(() => {
     if (selectedRange.start && selectedRange.end) {
       return `${selectedRange.start} ~ ${selectedRange.end}`;
     }
     return "";
   }, [selectedRange]);
-  const calculatePosition = (0, import_react33.useCallback)(() => {
+  const calculatePosition = (0, import_react34.useCallback)(() => {
     if (inputWrapperRef.current) {
       const rect = inputWrapperRef.current.getBoundingClientRect();
       setPanelPos({ top: rect.bottom + window.scrollY + 6, left: rect.left + window.scrollX });
@@ -11759,7 +11772,7 @@ var TimePicker = (0, import_react33.forwardRef)((originalProps, ref) => {
       setIsPanelOpen(false);
     }
   };
-  const slots = (0, import_react33.useMemo)(() => timePickerStyle({ ...variantProps }), [variantProps]);
+  const slots = (0, import_react34.useMemo)(() => timePickerStyle({ ...variantProps }), [variantProps]);
   const renderHourOptions = () => {
     return Array.from({ length: 24 }, (_, i) => {
       const value = String(i).padStart(2, "0");
@@ -12052,19 +12065,19 @@ var timePickerStyle = tv({
 });
 
 // src/components/tree/tree.tsx
-var import_react34 = require("react");
+var import_react35 = require("react");
 var import_jsx_runtime37 = require("react/jsx-runtime");
-var TreeNodeItem = (0, import_react34.forwardRef)(
+var TreeNodeItem = (0, import_react35.forwardRef)(
   ({ node, depth, fileIcon, selectedName, classNames, onExpand }, ref) => {
-    const [isOpen, setIsOpen] = (0, import_react34.useState)(false);
-    const [children, setChildren] = (0, import_react34.useState)(node.children);
-    const slots = (0, import_react34.useMemo)(() => treeStyle(), []);
-    const hasMore = (0, import_react34.useMemo)(() => {
+    const [isOpen, setIsOpen] = (0, import_react35.useState)(false);
+    const [children, setChildren] = (0, import_react35.useState)(node.children);
+    const slots = (0, import_react35.useMemo)(() => treeStyle(), []);
+    const hasMore = (0, import_react35.useMemo)(() => {
       if (node.isLeaf) return false;
       if (Array.isArray(children)) return children.length > 0;
       return typeof onExpand === "function";
     }, [node.isLeaf, children, onExpand]);
-    const toggleOpen = (0, import_react34.useCallback)(async () => {
+    const toggleOpen = (0, import_react35.useCallback)(async () => {
       if (!isOpen && !children && onExpand && !node.isLeaf) {
         try {
           const result = await onExpand(node);
@@ -12140,7 +12153,7 @@ var TreeNodeItem = (0, import_react34.forwardRef)(
 );
 TreeNodeItem.displayName = "TreeNodeItem";
 var Tree = ({ headerContent, group, groupIcon, fileIcon, selectedName, classNames, onExpand }) => {
-  const slots = (0, import_react34.useMemo)(() => treeStyle(), []);
+  const slots = (0, import_react35.useMemo)(() => treeStyle(), []);
   const handleClick = (e) => {
     var _a;
     (_a = group.onClick) == null ? void 0 : _a.call(group, e);
@@ -12208,19 +12221,19 @@ var treeStyle = tv({
 });
 
 // src/components/fileUpload/fileUpload.tsx
-var import_react37 = require("react");
+var import_react38 = require("react");
 var import_tailwind_variants34 = require("tailwind-variants");
 
 // src/components/progress/progress.tsx
-var import_react36 = require("react");
+var import_react37 = require("react");
 
 // src/hooks/useIsMounted.ts
-var import_react35 = require("react");
+var import_react36 = require("react");
 function useIsMounted(props = {}) {
   const { rerender = false, delay = 0 } = props;
-  const isMountedRef = (0, import_react35.useRef)(false);
-  const [isMounted, setIsMounted] = (0, import_react35.useState)(false);
-  (0, import_react35.useEffect)(() => {
+  const isMountedRef = (0, import_react36.useRef)(false);
+  const [isMounted, setIsMounted] = (0, import_react36.useState)(false);
+  (0, import_react36.useEffect)(() => {
     isMountedRef.current = true;
     let timer = null;
     if (rerender) {
@@ -12242,7 +12255,7 @@ function useIsMounted(props = {}) {
       }
     };
   }, [rerender]);
-  return [(0, import_react35.useCallback)(() => isMountedRef.current, []), isMounted];
+  return [(0, import_react36.useCallback)(() => isMountedRef.current, []), isMounted];
 }
 
 // src/components/progress/progress.tsx
@@ -12256,11 +12269,11 @@ var Progress = (originalProps) => {
     delay: 100
   });
   const selfMounted = variantProps.disableAnimation ? true : isMounted;
-  const percentage = (0, import_react36.useMemo)(
+  const percentage = (0, import_react37.useMemo)(
     () => isIndeterminate || !selfMounted ? void 0 : clampPercentage((value - minValue) / (maxValue - minValue) * 100),
     [selfMounted, isIndeterminate, value, minValue, maxValue]
   );
-  const slots = (0, import_react36.useMemo)(() => progressStyle({ ...variantProps }), [variantProps]);
+  const slots = (0, import_react37.useMemo)(() => progressStyle({ ...variantProps }), [variantProps]);
   return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: slots.base({ class: classNames == null ? void 0 : classNames.base }), children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: slots.track({ class: classNames == null ? void 0 : classNames.track }), children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
     "div",
     {
@@ -12377,13 +12390,13 @@ function FileUpload({
   classNames,
   defaultFile
 }) {
-  const fileInputRef = (0, import_react37.useRef)(null);
-  const uploadIntervalRef = (0, import_react37.useRef)(null);
-  const [currentFile, setCurrentFile] = (0, import_react37.useState)(null);
-  const [uploadProgress, setUploadProgress] = (0, import_react37.useState)(0);
-  const [message, setMessage] = (0, import_react37.useState)(errorMessage);
-  const [displayFileName, setDisplayFileName] = (0, import_react37.useState)(() => (defaultFile == null ? void 0 : defaultFile.name) || "");
-  const [hasUploadedFile, setHasUploadedFile] = (0, import_react37.useState)(false);
+  const fileInputRef = (0, import_react38.useRef)(null);
+  const uploadIntervalRef = (0, import_react38.useRef)(null);
+  const [currentFile, setCurrentFile] = (0, import_react38.useState)(null);
+  const [uploadProgress, setUploadProgress] = (0, import_react38.useState)(0);
+  const [message, setMessage] = (0, import_react38.useState)(errorMessage);
+  const [displayFileName, setDisplayFileName] = (0, import_react38.useState)(() => (defaultFile == null ? void 0 : defaultFile.name) || "");
+  const [hasUploadedFile, setHasUploadedFile] = (0, import_react38.useState)(false);
   const slots = fileUploadStyle();
   const handleButtonClick = () => {
     var _a;
@@ -12440,14 +12453,14 @@ function FileUpload({
     setHasUploadedFile(false);
     if (onCancelUpload) onCancelUpload();
   };
-  (0, import_react37.useEffect)(() => {
+  (0, import_react38.useEffect)(() => {
     return () => {
       if (uploadIntervalRef.current) {
         clearInterval(uploadIntervalRef.current);
       }
     };
   }, []);
-  (0, import_react37.useEffect)(() => {
+  (0, import_react38.useEffect)(() => {
     if (errorMessage !== void 0) {
       setMessage(errorMessage);
     }
@@ -12581,12 +12594,12 @@ var skeletonStyle = (0, import_tailwind_variants35.tv)({
 
 // src/components/charts/circularProgress.tsx
 var import_recharts = require("recharts");
-var import_react38 = require("react");
+var import_react39 = require("react");
 var import_jsx_runtime41 = require("react/jsx-runtime");
-var CircularProgress = (0, import_react38.forwardRef)((originalProps, ref) => {
+var CircularProgress = (0, import_react39.forwardRef)((originalProps, ref) => {
   const [props, variantProps] = mapPropsVariants(originalProps, circularProgressStyle.variantKeys);
   const { label, size = 150, percentage, innerContent, classNames } = { ...props, ...variantProps };
-  const slots = (0, import_react38.useMemo)(() => circularProgressStyle({ ...variantProps }), [variantProps]);
+  const slots = (0, import_react39.useMemo)(() => circularProgressStyle({ ...variantProps }), [variantProps]);
   const data = [
     {
       name: label,
@@ -12618,7 +12631,7 @@ var CircularProgress = (0, import_react38.forwardRef)((originalProps, ref) => {
   const colorValue = originalProps.color;
   const colorKey = colorValue || "blue";
   const currentGradient = gradientColors[colorKey];
-  const wrappedInnerContent = (0, import_react38.useMemo)(() => {
+  const wrappedInnerContent = (0, import_react39.useMemo)(() => {
     return wrapSpanWithClass(innerContent);
   }, [innerContent]);
   return /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { ref, className: slots.base({ class: classNames == null ? void 0 : classNames.base }), children: [
@@ -12712,16 +12725,16 @@ function wrapSpanWithClass(node) {
   if (Array.isArray(node)) {
     return node.map(wrapSpanWithClass);
   }
-  if ((0, import_react38.isValidElement)(node)) {
+  if ((0, import_react39.isValidElement)(node)) {
     const element = node;
     if (element.type === "span") {
       const existing = (_a = element.props.className) != null ? _a : "";
-      return (0, import_react38.cloneElement)(element, {
+      return (0, import_react39.cloneElement)(element, {
         className: `text-xl font-bold ${existing}`.trim()
       });
     }
     if (element.props.children) {
-      return (0, import_react38.cloneElement)(element, {
+      return (0, import_react39.cloneElement)(element, {
         children: wrapSpanWithClass(element.props.children)
       });
     }
@@ -12731,11 +12744,11 @@ function wrapSpanWithClass(node) {
 }
 
 // src/components/charts/areaChart.tsx
-var import_react39 = require("react");
+var import_react40 = require("react");
 var import_recharts2 = require("recharts");
 var import_jsx_runtime42 = require("react/jsx-runtime");
-var AreaChartComponent = (0, import_react39.forwardRef)((originalProps, ref) => {
-  const uniqueId = (0, import_react39.useId)();
+var AreaChartComponent = (0, import_react40.forwardRef)((originalProps, ref) => {
+  const uniqueId = (0, import_react40.useId)();
   const [props, variantProps] = mapPropsVariants(originalProps, areaChartStyle.variantKeys);
   const {
     data,
@@ -12747,26 +12760,26 @@ var AreaChartComponent = (0, import_react39.forwardRef)((originalProps, ref) =>
     chartHeight = 240,
     classNames
   } = { ...props, ...variantProps };
-  const slots = (0, import_react39.useMemo)(() => areaChartStyle({ ...variantProps }), [variantProps]);
+  const slots = (0, import_react40.useMemo)(() => areaChartStyle({ ...variantProps }), [variantProps]);
   const COLOR_MAP = {
     primary: "#3F9CF2",
     danger: "#FF4684"
   };
-  const colorHex = (0, import_react39.useMemo)(() => COLOR_MAP[color], [color]);
-  const totalChartWidth = (0, import_react39.useMemo)(() => {
+  const colorHex = (0, import_react40.useMemo)(() => COLOR_MAP[color], [color]);
+  const totalChartWidth = (0, import_react40.useMemo)(() => {
     if (!data || !itemWidth) return void 0;
     const dataLength = startFromZero ? data.length + 1 : data.length;
     return dataLength * itemWidth;
   }, [data, itemWidth, startFromZero]);
-  const needsScroll = (0, import_react39.useMemo)(() => {
+  const needsScroll = (0, import_react40.useMemo)(() => {
     return totalChartWidth;
   }, [totalChartWidth]);
-  const processedData = (0, import_react39.useMemo)(() => {
+  const processedData = (0, import_react40.useMemo)(() => {
     if (!data) return [];
     return data;
   }, [data, startFromZero]);
-  const [tickPositions, setTickPositions] = (0, import_react39.useState)([]);
-  const tickRef = (0, import_react39.useRef)([]);
+  const [tickPositions, setTickPositions] = (0, import_react40.useState)([]);
+  const tickRef = (0, import_react40.useRef)([]);
   const CustomTick = ({ x, y, payload }) => {
     if (x !== void 0) {
       tickRef.current.push(x);
@@ -12788,7 +12801,7 @@ var AreaChartComponent = (0, import_react39.forwardRef)((originalProps, ref) =>
       }
     );
   };
-  (0, import_react39.useEffect)(() => {
+  (0, import_react40.useEffect)(() => {
     const raf = requestAnimationFrame(() => {
       const unique = [...new Set(tickRef.current)].sort((a, b) => a - b);
       const mids = [];
@@ -12915,10 +12928,10 @@ var areaChartStyle = tv({
 });
 
 // src/components/charts/barChart.tsx
-var import_react40 = require("react");
+var import_react41 = require("react");
 var import_recharts3 = require("recharts");
 var import_jsx_runtime43 = require("react/jsx-runtime");
-var BarChartComponent = (0, import_react40.forwardRef)((originalProps, ref) => {
+var BarChartComponent = (0, import_react41.forwardRef)((originalProps, ref) => {
   const [props, variantProps] = mapPropsVariants(originalProps, barChartStyle.variantKeys);
   const {
     data = [],
@@ -12930,13 +12943,13 @@ var BarChartComponent = (0, import_react40.forwardRef)((originalProps, ref) => {
     barGap = 20,
     tooltipFormatter
   } = { ...props, ...variantProps };
-  const slots = (0, import_react40.useMemo)(() => barChartStyle({ ...variantProps }), [variantProps]);
-  const chartRef = (0, import_react40.useRef)(null);
-  const tooltipRef = (0, import_react40.useRef)(null);
-  const [tooltipLeft, setTooltipLeft] = (0, import_react40.useState)(0);
-  const [tickPositions, setTickPositions] = (0, import_react40.useState)([]);
-  const tickRef = (0, import_react40.useRef)([]);
-  const [tooltipState, setTooltipState] = (0, import_react40.useState)(null);
+  const slots = (0, import_react41.useMemo)(() => barChartStyle({ ...variantProps }), [variantProps]);
+  const chartRef = (0, import_react41.useRef)(null);
+  const tooltipRef = (0, import_react41.useRef)(null);
+  const [tooltipLeft, setTooltipLeft] = (0, import_react41.useState)(0);
+  const [tickPositions, setTickPositions] = (0, import_react41.useState)([]);
+  const tickRef = (0, import_react41.useRef)([]);
+  const [tooltipState, setTooltipState] = (0, import_react41.useState)(null);
   const handleMouseEnter = (e, dataKey) => {
     if (!tooltipFormatter || !chartRef.current) return;
     const { payload, x, y } = e;
@@ -12996,7 +13009,7 @@ var BarChartComponent = (0, import_react40.forwardRef)((originalProps, ref) => {
       children: yAxisTickFormatter(payload.value)
     }
   );
-  (0, import_react40.useEffect)(() => {
+  (0, import_react41.useEffect)(() => {
     const raf = requestAnimationFrame(() => {
       const unique = [...new Set(tickRef.current)].sort((a, b) => a - b);
       const mids = [];
@@ -13008,7 +13021,7 @@ var BarChartComponent = (0, import_react40.forwardRef)((originalProps, ref) => {
     });
     return () => cancelAnimationFrame(raf);
   }, [data]);
-  (0, import_react40.useLayoutEffect)(() => {
+  (0, import_react41.useLayoutEffect)(() => {
     if (!tooltipState || !chartRef.current || !tooltipRef.current) return;
     const chartRect = chartRef.current.getBoundingClientRect();
     const tooltipRect = tooltipRef.current.getBoundingClientRect();
@@ -13154,13 +13167,13 @@ function BarChartTooltip({ className = "", children }) {
 
 // src/components/charts/radarChart.tsx
 var import_recharts4 = require("recharts");
-var import_react41 = require("react");
+var import_react42 = require("react");
 var import_jsx_runtime44 = require("react/jsx-runtime");
-var RadarChart = (0, import_react41.forwardRef)((originalProps, ref) => {
+var RadarChart = (0, import_react42.forwardRef)((originalProps, ref) => {
   const [props, variantProps] = mapPropsVariants(originalProps, radarChartStyle.variantKeys);
   const { data, label, classNames, tooltipFormatter } = { ...props, ...variantProps };
-  const slots = (0, import_react41.useMemo)(() => radarChartStyle({ ...variantProps }), [variantProps]);
-  const normalizedData = (0, import_react41.useMemo)(() => {
+  const slots = (0, import_react42.useMemo)(() => radarChartStyle({ ...variantProps }), [variantProps]);
+  const normalizedData = (0, import_react42.useMemo)(() => {
     if (!data || data.length === 0) return [];
     return data.map((item) => ({
       ...item,
@@ -13169,18 +13182,18 @@ var RadarChart = (0, import_react41.forwardRef)((originalProps, ref) => {
       originalFullMark: item.fullMark || 100
     }));
   }, [data]);
-  const containerHeight = (0, import_react41.useMemo)(() => {
+  const containerHeight = (0, import_react42.useMemo)(() => {
     if (!data || data.length === 0) return 250;
     return data.length === 3 ? 245 : 306;
   }, [data]);
-  const chartMargin = (0, import_react41.useMemo)(() => {
+  const chartMargin = (0, import_react42.useMemo)(() => {
     return { top: 0, right: 0, bottom: 0, left: 0 };
   }, [data]);
-  const outerRadius = (0, import_react41.useMemo)(() => {
+  const outerRadius = (0, import_react42.useMemo)(() => {
     if (!data || data.length === 0) return 125;
     return data.length === 3 ? 135 : 125;
   }, [data]);
-  const chartCenter = (0, import_react41.useMemo)(() => {
+  const chartCenter = (0, import_react42.useMemo)(() => {
     if (!data || data.length === 0) return {};
     if (data.length === 3) return { cx: "50%", cy: "65%" };
     return {};
@@ -13257,10 +13270,10 @@ var radarChartStyle = tv({
 });
 
 // src/components/charts/simpleBarChart.tsx
-var import_react42 = require("react");
+var import_react43 = require("react");
 var import_recharts5 = require("recharts");
 var import_jsx_runtime45 = require("react/jsx-runtime");
-var SimpleBarChartComponent = (0, import_react42.forwardRef)((originalProps, ref) => {
+var SimpleBarChartComponent = (0, import_react43.forwardRef)((originalProps, ref) => {
   const [props, variantProps] = mapPropsVariants(originalProps, simpleBarChartStyle.variantKeys);
   const {
     data = [],
@@ -13271,13 +13284,13 @@ var SimpleBarChartComponent = (0, import_react42.forwardRef)((originalProps, ref
     barGap = 20,
     tooltipFormatter
   } = { ...props, ...variantProps };
-  const slots = (0, import_react42.useMemo)(() => simpleBarChartStyle({ ...variantProps }), [variantProps]);
-  const chartRef = (0, import_react42.useRef)(null);
-  const tooltipRef = (0, import_react42.useRef)(null);
-  const [tooltipLeft, setTooltipLeft] = (0, import_react42.useState)(0);
-  const [tickPositions, setTickPositions] = (0, import_react42.useState)([]);
-  const [tooltipState, setTooltipState] = (0, import_react42.useState)(null);
-  (0, import_react42.useEffect)(() => {
+  const slots = (0, import_react43.useMemo)(() => simpleBarChartStyle({ ...variantProps }), [variantProps]);
+  const chartRef = (0, import_react43.useRef)(null);
+  const tooltipRef = (0, import_react43.useRef)(null);
+  const [tooltipLeft, setTooltipLeft] = (0, import_react43.useState)(0);
+  const [tickPositions, setTickPositions] = (0, import_react43.useState)([]);
+  const [tooltipState, setTooltipState] = (0, import_react43.useState)(null);
+  (0, import_react43.useEffect)(() => {
     if (!chartRef.current || !data.length) return;
     const updateDimensions = () => {
       if (!chartRef.current) return;
@@ -13351,7 +13364,7 @@ var SimpleBarChartComponent = (0, import_react42.forwardRef)((originalProps, ref
       }
     );
   };
-  (0, import_react42.useLayoutEffect)(() => {
+  (0, import_react43.useLayoutEffect)(() => {
     if (!tooltipState || !chartRef.current || !tooltipRef.current) return;
     const chartRect = chartRef.current.getBoundingClientRect();
     const tooltipRect = tooltipRef.current.getBoundingClientRect();
@@ -13455,9 +13468,9 @@ var simpleBarChartStyle = tv({
 });
 
 // src/components/starRating/starRating.tsx
-var import_react43 = require("react");
+var import_react44 = require("react");
 var import_jsx_runtime46 = require("react/jsx-runtime");
-var StarRating = (0, import_react43.forwardRef)((originalProps, ref) => {
+var StarRating = (0, import_react44.forwardRef)((originalProps, ref) => {
   const [props, variantProps] = mapPropsVariants(originalProps, starRatingStyle.variantKeys);
   const {
     stars,
@@ -13470,8 +13483,8 @@ var StarRating = (0, import_react43.forwardRef)((originalProps, ref) => {
     filledColor = "text-primary-main",
     emptyColor = "text-neutral-soft"
   } = { ...props, ...variantProps };
-  const slots = (0, import_react43.useMemo)(() => starRatingStyle({ ...variantProps }), [variantProps]);
-  const [hoverRating, setHoverRating] = (0, import_react43.useState)(0);
+  const slots = (0, import_react44.useMemo)(() => starRatingStyle({ ...variantProps }), [variantProps]);
+  const [hoverRating, setHoverRating] = (0, import_react44.useState)(0);
   const handleStarClick = (starIndex, isHalf = false) => {
     if (readOnly || !onChange) return;
     let newRating;