@ctlyst.id/internal-ui 5.7.0 → 5.7.2

package/dist/index.js

@@ -1739,17 +1739,17 @@ var DataTable = React6.forwardRef((props, ref) => {
                       "data-test-id": `CT_Container_TableHeader_${header.id}`,
                       userSelect: "none",
                       align: "center",
-                      gap: 2,
                       children: [
                         (0, import_react_table.flexRender)(header.column.columnDef.header, header.getContext()),
-                        /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+                        header.column.getCanSort() && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
                           import_react31.Box,
                           {
                             as: "span",
                             cursor: header.column.getCanSort() ? "pointer" : "default",
                             "data-test-id": `CT_Container_SortingIcon_${header.id}`,
                             onClick: header.column.getToggleSortingHandler(),
-                            children: (_b2 = header.column.getCanSort() && {
+                            ml: 2,
+                            children: (_b2 = {
                               asc: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_icons2.ChevronUpIcon, { h: 4, w: 4, color: "neutral.500" }),
                               desc: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_icons2.ChevronDownIcon, { h: 4, w: 4, color: "neutral.500" })
                             }[header.column.getIsSorted()]) != null ? _b2 : /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react31.Box, { display: "flex", justifyContent: "center", alignItems: "center", boxSize: 4, children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_icons2.UpDownIcon, { color: "neutral.500" }) })
@@ -4342,8 +4342,8 @@ var PaginationButton = (0, import_react63.forwardRef)(({ className, style, isAct
       px: 3,
       py: 2,
       h: 8,
-      minW: "auto",
-      width: 8,
+      minW: 8,
+      width: "auto",
       background: isActive ? "primary.500" : btnBg,
       color: isActive ? "white" : btnColor,
       _hover: !isActive ? {
@@ -4448,13 +4448,26 @@ var Pagination = ({ className, current, total, onSelect }) => {
         }
       ),
       generatePages().map((page) => {
+        const isActive = page === current;
         return /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
           pagination_button_default,
           {
             "data-test-id": "Pagination-Button",
-            isActive: page === current,
+            isActive,
             onClick: () => typeof page === "number" ? handleSelectPage(page) : null,
-            children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_react65.Text, { scale: 300, fontSize: "text.sm", lineHeight: 18, fontWeight: 500, children: page })
+            children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
+              import_react65.Text,
+              {
+                scale: 300,
+                fontSize: "text.sm",
+                lineHeight: 18,
+                fontWeight: 500,
+                maxW: !isActive ? 8 : void 0,
+                textOverflow: !isActive ? "ellipsis" : void 0,
+                overflow: !isActive ? "hidden" : void 0,
+                children: page
+              }
+            )
           },
           page
         );