analytica-frontend-lib 1.2.22 → 1.2.23

package/dist/Table/index.js

@@ -182,9 +182,52 @@ var Button = ({
 };
 var Button_default = Button;
 
+// src/components/EmptyState/EmptyState.tsx
+var import_jsx_runtime4 = require("react/jsx-runtime");
+var EmptyState = ({
+  image,
+  title,
+  description,
+  buttonText,
+  buttonIcon,
+  onButtonClick,
+  buttonVariant = "solid",
+  buttonAction = "primary"
+}) => {
+  const displayTitle = title || "Nenhum dado dispon\xEDvel";
+  const displayDescription = description || "N\xE3o h\xE1 dados para exibir no momento.";
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "flex flex-col justify-center items-center gap-6 w-full min-h-[705px] bg-background rounded-xl p-6", children: [
+    image && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("img", { src: image, alt: displayTitle, className: "w-[170px] h-[150px]" }),
+    /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "flex flex-col items-center gap-4 w-full max-w-[600px] px-6", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+        Text_default,
+        {
+          as: "h2",
+          className: "text-text-950 font-semibold text-3xl leading-[35px] text-center",
+          children: displayTitle
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Text_default, { className: "text-text-600 font-normal text-[18px] leading-[27px] text-center", children: displayDescription })
+    ] }),
+    buttonText && onButtonClick && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+      Button_default,
+      {
+        variant: buttonVariant,
+        action: buttonAction,
+        size: "large",
+        onClick: onButtonClick,
+        iconLeft: buttonIcon,
+        className: "rounded-full px-5 py-2.5",
+        children: buttonText
+      }
+    )
+  ] });
+};
+var EmptyState_default = EmptyState;
+
 // src/components/Skeleton/Skeleton.tsx
 var import_react = require("react");
-var import_jsx_runtime4 = require("react/jsx-runtime");
+var import_jsx_runtime5 = require("react/jsx-runtime");
 var SKELETON_ANIMATION_CLASSES = {
   pulse: "animate-pulse",
   none: ""
@@ -221,13 +264,13 @@ var Skeleton = (0, import_react.forwardRef)(
       height: typeof height === "number" ? `${height}px` : height
     };
     if (variant === "text" && lines > 1) {
-      return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+      return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
         "div",
         {
           ref,
           className: cn("flex flex-col", spacingClass, className),
           ...props,
-          children: Array.from({ length: lines }, (_, index) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+          children: Array.from({ length: lines }, (_, index) => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
             "div",
             {
               className: cn(variantClass, animationClass),
@@ -238,7 +281,7 @@ var Skeleton = (0, import_react.forwardRef)(
         }
       );
     }
-    return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
       "div",
       {
         ref,
@@ -251,11 +294,11 @@ var Skeleton = (0, import_react.forwardRef)(
   }
 );
 var SkeletonText = (0, import_react.forwardRef)(
-  (props, ref) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Skeleton, { ref, variant: "text", ...props })
+  (props, ref) => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Skeleton, { ref, variant: "text", ...props })
 );
-var SkeletonCircle = (0, import_react.forwardRef)((props, ref) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Skeleton, { ref, variant: "circular", ...props }));
-var SkeletonRectangle = (0, import_react.forwardRef)((props, ref) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Skeleton, { ref, variant: "rectangular", ...props }));
-var SkeletonRounded = (0, import_react.forwardRef)((props, ref) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Skeleton, { ref, variant: "rounded", ...props }));
+var SkeletonCircle = (0, import_react.forwardRef)((props, ref) => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Skeleton, { ref, variant: "circular", ...props }));
+var SkeletonRectangle = (0, import_react.forwardRef)((props, ref) => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Skeleton, { ref, variant: "rectangular", ...props }));
+var SkeletonRounded = (0, import_react.forwardRef)((props, ref) => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Skeleton, { ref, variant: "rounded", ...props }));
 var SkeletonCard = (0, import_react.forwardRef)(
   ({
     showAvatar = true,
@@ -266,7 +309,7 @@ var SkeletonCard = (0, import_react.forwardRef)(
     className = "",
     ...props
   }, ref) => {
-    return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
       "div",
       {
         ref,
@@ -276,16 +319,16 @@ var SkeletonCard = (0, import_react.forwardRef)(
         ),
         ...props,
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "flex items-start space-x-3", children: [
-            showAvatar && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(SkeletonCircle, { width: 40, height: 40 }),
-            /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "flex-1 space-y-2", children: [
-              showTitle && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(SkeletonText, { width: "60%", height: 20 }),
-              showDescription && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(SkeletonText, { lines, spacing: "small" })
+          /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "flex items-start space-x-3", children: [
+            showAvatar && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(SkeletonCircle, { width: 40, height: 40 }),
+            /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "flex-1 space-y-2", children: [
+              showTitle && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(SkeletonText, { width: "60%", height: 20 }),
+              showDescription && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(SkeletonText, { lines, spacing: "small" })
             ] })
           ] }),
-          showActions && /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "flex justify-end space-x-2 mt-4", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(SkeletonRectangle, { width: 80, height: 32 }),
-            /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(SkeletonRectangle, { width: 80, height: 32 })
+          showActions && /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "flex justify-end space-x-2 mt-4", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(SkeletonRectangle, { width: 80, height: 32 }),
+            /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(SkeletonRectangle, { width: 80, height: 32 })
           ] })
         ]
       }
@@ -302,19 +345,19 @@ var SkeletonList = (0, import_react.forwardRef)(
     className = "",
     ...props
   }, ref) => {
-    return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { ref, className: cn("space-y-3", className), ...props, children: Array.from({ length: items }, (_, index) => /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "flex items-start space-x-3 p-3", children: [
-      showAvatar && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(SkeletonCircle, { width: 32, height: 32 }),
-      /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "flex-1 space-y-2", children: [
-        showTitle && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(SkeletonText, { width: "40%", height: 16 }),
-        showDescription && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(SkeletonText, { lines, spacing: "small" })
+    return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { ref, className: cn("space-y-3", className), ...props, children: Array.from({ length: items }, (_, index) => /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "flex items-start space-x-3 p-3", children: [
+      showAvatar && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(SkeletonCircle, { width: 32, height: 32 }),
+      /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "flex-1 space-y-2", children: [
+        showTitle && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(SkeletonText, { width: "40%", height: 16 }),
+        showDescription && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(SkeletonText, { lines, spacing: "small" })
       ] })
     ] }, index)) });
   }
 );
 var SkeletonTable = (0, import_react.forwardRef)(
   ({ rows = 5, columns = 4, showHeader = true, className = "", ...props }, ref) => {
-    return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { ref, className: cn("w-full", className), ...props, children: [
-      showHeader && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "flex space-x-2 mb-3", children: Array.from({ length: columns }, (_, index) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { ref, className: cn("w-full", className), ...props, children: [
+      showHeader && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "flex space-x-2 mb-3", children: Array.from({ length: columns }, (_, index) => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
         SkeletonText,
         {
           width: `${100 / columns}%`,
@@ -322,7 +365,7 @@ var SkeletonTable = (0, import_react.forwardRef)(
         },
         index
       )) }),
-      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "space-y-2", children: Array.from({ length: rows }, (_, rowIndex) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "flex space-x-2", children: Array.from({ length: columns }, (_2, colIndex) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "space-y-2", children: Array.from({ length: rows }, (_, rowIndex) => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "flex space-x-2", children: Array.from({ length: columns }, (_2, colIndex) => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
         SkeletonText,
         {
           width: `${100 / columns}%`,
@@ -336,7 +379,7 @@ var SkeletonTable = (0, import_react.forwardRef)(
 
 // src/components/Table/TablePagination.tsx
 var import_phosphor_react = require("phosphor-react");
-var import_jsx_runtime5 = require("react/jsx-runtime");
+var import_jsx_runtime6 = require("react/jsx-runtime");
 var TablePagination = ({
   totalItems,
   currentPage,
@@ -367,7 +410,7 @@ var TablePagination = ({
   };
   const isFirstPage = currentPage === 1;
   const isLastPage = currentPage === totalPages;
-  return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
     "div",
     {
       className: cn(
@@ -377,29 +420,29 @@ var TablePagination = ({
       ),
       ...props,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("span", { className: "font-normal text-xs leading-[14px] text-text-800", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("span", { className: "font-normal text-xs leading-[14px] text-text-800", children: [
           startItem,
           " de ",
           totalItems,
           " ",
           itemLabel
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "flex flex-wrap sm:flex-nowrap items-center gap-2 sm:gap-4 justify-center sm:justify-start", children: [
-          onItemsPerPageChange && /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "relative", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "flex flex-wrap sm:flex-nowrap items-center gap-2 sm:gap-4 justify-center sm:justify-start", children: [
+          onItemsPerPageChange && /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "relative", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
               "select",
               {
                 value: itemsPerPage,
                 onChange: handleItemsPerPageChange,
                 className: "w-24 h-9 py-0 px-3 pr-8 bg-background border border-border-300 rounded appearance-none cursor-pointer font-normal text-sm leading-[21px] text-text-900",
                 "aria-label": "Items por p\xE1gina",
-                children: itemsPerPageOptions.map((option) => /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("option", { value: option, children: [
+                children: itemsPerPageOptions.map((option) => /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("option", { value: option, children: [
                   option,
                   " itens"
                 ] }, option))
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
               import_phosphor_react.CaretDown,
               {
                 size: 14,
@@ -408,13 +451,13 @@ var TablePagination = ({
               }
             )
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("span", { className: "font-normal text-xs leading-[14px] text-text-950", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("span", { className: "font-normal text-xs leading-[14px] text-text-950", children: [
             "P\xE1gina ",
             currentPage,
             " de ",
             totalPages
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
+          /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
             "button",
             {
               onClick: handlePrevious,
@@ -425,12 +468,12 @@ var TablePagination = ({
               ),
               "aria-label": "P\xE1gina anterior",
               children: [
-                /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_phosphor_react.CaretLeft, { size: 12, weight: "bold", className: "text-primary-950" }),
-                /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: "font-medium text-xs leading-[14px] text-primary-950", children: "Anterior" })
+                /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_phosphor_react.CaretLeft, { size: 12, weight: "bold", className: "text-primary-950" }),
+                /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "font-medium text-xs leading-[14px] text-primary-950", children: "Anterior" })
               ]
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
+          /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
             "button",
             {
               onClick: handleNext,
@@ -441,8 +484,8 @@ var TablePagination = ({
               ),
               "aria-label": "Pr\xF3xima p\xE1gina",
               children: [
-                /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: "font-medium text-xs leading-[14px] text-primary-950", children: "Pr\xF3xima" }),
-                /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_phosphor_react.CaretRight, { size: 12, weight: "bold", className: "text-primary-950" })
+                /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "font-medium text-xs leading-[14px] text-primary-950", children: "Pr\xF3xima" }),
+                /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_phosphor_react.CaretRight, { size: 12, weight: "bold", className: "text-primary-950" })
               ]
             }
           )
@@ -455,7 +498,7 @@ TablePagination.displayName = "TablePagination";
 var TablePagination_default = TablePagination;
 
 // src/components/Table/Table.tsx
-var import_jsx_runtime6 = require("react/jsx-runtime");
+var import_jsx_runtime7 = require("react/jsx-runtime");
 function useTableSort(data, options = {}) {
   const { syncWithUrl = false } = options;
   const getInitialState = () => {
@@ -538,7 +581,7 @@ var getNoSearchResultContent = (config, defaultTitle, defaultDescription) => {
     return config.component;
   }
   if (config.image) {
-    return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
       NoSearchResult_default,
       {
         image: config.image,
@@ -547,39 +590,31 @@ var getNoSearchResultContent = (config, defaultTitle, defaultDescription) => {
       }
     );
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "text-center", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("p", { className: "text-text-600 text-lg font-semibold mb-2", children: config.title || defaultTitle }),
-    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("p", { className: "text-text-500 text-sm", children: config.description || defaultDescription })
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "text-center", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("p", { className: "text-text-600 text-lg font-semibold mb-2", children: config.title || defaultTitle }),
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("p", { className: "text-text-500 text-sm", children: config.description || defaultDescription })
   ] });
 };
-var getEmptyStateContent = (config, defaultMessage, defaultButtonText, onButtonClick) => {
+var getEmptyStateContent = (config, defaultTitle, defaultDescription) => {
   if (config?.component) {
     return config.component;
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "flex flex-col items-center justify-center gap-4", children: [
-    config?.image && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
-      "img",
-      {
-        src: config.image,
-        alt: "Empty state",
-        className: "w-auto h-auto max-w-full"
-      }
-    ),
-    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("p", { className: "text-text-600 text-base font-normal", children: config?.message || defaultMessage }),
-    (config?.onButtonClick || onButtonClick) && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
-      Button_default,
-      {
-        variant: "solid",
-        action: "primary",
-        size: "medium",
-        onClick: config?.onButtonClick || onButtonClick,
-        children: config?.buttonText || defaultButtonText
-      }
-    )
-  ] });
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+    EmptyState_default,
+    {
+      image: config?.image,
+      title: config?.title || defaultTitle,
+      description: config?.description || defaultDescription,
+      buttonText: config?.buttonText,
+      buttonIcon: config?.buttonIcon,
+      onButtonClick: config?.onButtonClick,
+      buttonVariant: config?.buttonVariant,
+      buttonAction: config?.buttonAction
+    }
+  );
 };
 var renderTableWrapper = (variant, tableRef, className, children, stateContent, tableProps) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
     "div",
     {
       className: cn(
@@ -587,7 +622,7 @@ var renderTableWrapper = (variant, tableRef, className, children, stateContent,
         variant === "default" && "border border-border-200 rounded-xl"
       ),
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
           "table",
           {
             ref: tableRef,
@@ -599,7 +634,7 @@ var renderTableWrapper = (variant, tableRef, className, children, stateContent,
             children: renderHeaderElements(children)
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "py-8 flex justify-center", children: stateContent })
+        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "py-8 flex justify-center", children: stateContent })
       ]
     }
   );
@@ -622,13 +657,13 @@ var Table = (0, import_react2.forwardRef)(
       description: "N\xE3o encontramos nenhum resultado com esse nome. Tente revisar a busca ou usar outra palavra-chave."
     };
     const defaultEmptyState = {
-      message: "Nenhum dado dispon\xEDvel no momento.",
-      buttonText: "Adicionar item"
+      title: "Nenhum dado dispon\xEDvel",
+      description: "N\xE3o h\xE1 dados para exibir no momento."
     };
     const finalNoSearchResultState = noSearchResultState || defaultNoSearchResultState;
     const finalEmptyState = emptyState || defaultEmptyState;
     if (showLoading) {
-      const loadingContent = loadingState?.component || /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(SkeletonTable, { rows: 5, columns: 4, showHeader: false });
+      const loadingContent = loadingState?.component || /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(SkeletonTable, { rows: 5, columns: 4, showHeader: false });
       return renderTableWrapper(
         variant,
         ref,
@@ -656,8 +691,8 @@ var Table = (0, import_react2.forwardRef)(
     if (showEmpty) {
       const emptyContent = getEmptyStateContent(
         finalEmptyState,
-        defaultEmptyState.message || "Nenhum dado dispon\xEDvel no momento.",
-        defaultEmptyState.buttonText || "Adicionar item"
+        defaultEmptyState.title || "Nenhum dado dispon\xEDvel",
+        defaultEmptyState.description || "N\xE3o h\xE1 dados para exibir no momento."
       );
       return renderTableWrapper(
         variant,
@@ -668,14 +703,14 @@ var Table = (0, import_react2.forwardRef)(
         props
       );
     }
-    return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
       "div",
       {
         className: cn(
           "relative w-full overflow-x-auto",
           variant === "default" && "border border-border-200 rounded-xl"
         ),
-        children: /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
           "table",
           {
             ref,
@@ -689,7 +724,7 @@ var Table = (0, import_react2.forwardRef)(
             children: [
               !import_react2.Children.toArray(children).some(
                 (child) => (0, import_react2.isValidElement)(child) && child.type === TableCaption
-              ) && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("caption", { className: "sr-only", children: "My Table" }),
+              ) && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("caption", { className: "sr-only", children: "My Table" }),
               children
             ]
           }
@@ -699,7 +734,7 @@ var Table = (0, import_react2.forwardRef)(
   }
 );
 Table.displayName = "Table";
-var TableHeader = (0, import_react2.forwardRef)(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+var TableHeader = (0, import_react2.forwardRef)(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
   "thead",
   {
     ref,
@@ -709,7 +744,7 @@ var TableHeader = (0, import_react2.forwardRef)(({ className, ...props }, ref) =
 ));
 TableHeader.displayName = "TableHeader";
 var TableBody = (0, import_react2.forwardRef)(
-  ({ className, variant = "default", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+  ({ className, variant = "default", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
     "tbody",
     {
       ref,
@@ -724,7 +759,7 @@ var TableBody = (0, import_react2.forwardRef)(
 );
 TableBody.displayName = "TableBody";
 var TableFooter = (0, import_react2.forwardRef)(
-  ({ variant = "default", className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+  ({ variant = "default", className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
     "tfoot",
     {
       ref,
@@ -768,7 +803,7 @@ var TableRow = (0, import_react2.forwardRef)(
     className,
     ...props
   }, ref) => {
-    return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
       "tr",
       {
         ref,
@@ -800,7 +835,7 @@ var TableHead = (0, import_react2.forwardRef)(
         onSort();
       }
     };
-    return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
       "th",
       {
         ref,
@@ -811,11 +846,11 @@ var TableHead = (0, import_react2.forwardRef)(
         ),
         onClick: handleClick,
         ...props,
-        children: /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "flex items-center gap-2", children: [
+        children: /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "flex items-center gap-2", children: [
           children,
-          sortable && /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "flex flex-col", children: [
-            sortDirection === "asc" && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_phosphor_react2.CaretUp, { size: 16, weight: "fill", className: "text-text-800" }),
-            sortDirection === "desc" && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_phosphor_react2.CaretDown, { size: 16, weight: "fill", className: "text-text-800" })
+          sortable && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "flex flex-col", children: [
+            sortDirection === "asc" && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_phosphor_react2.CaretUp, { size: 16, weight: "fill", className: "text-text-800" }),
+            sortDirection === "desc" && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_phosphor_react2.CaretDown, { size: 16, weight: "fill", className: "text-text-800" })
           ] })
         ] })
       }
@@ -823,7 +858,7 @@ var TableHead = (0, import_react2.forwardRef)(
   }
 );
 TableHead.displayName = "TableHead";
-var TableCell = (0, import_react2.forwardRef)(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+var TableCell = (0, import_react2.forwardRef)(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
   "td",
   {
     ref,
@@ -835,7 +870,7 @@ var TableCell = (0, import_react2.forwardRef)(({ className, ...props }, ref) =>
   }
 ));
 TableCell.displayName = "TableCell";
-var TableCaption = (0, import_react2.forwardRef)(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+var TableCaption = (0, import_react2.forwardRef)(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
   "caption",
   {
     ref,