@tipp/ui 2.1.9 → 2.1.11

package/dist/molecules/index.cjs

@@ -1640,7 +1640,7 @@ function ExpandTable(props) {
   const gridTemplateColumns = (0, import_react21.useMemo)(() => {
     return columns.map((col) => {
       var _a;
-      if ((_a = col.meta) == null ? void 0 : _a.autoSize) return "1fr";
+      if ((_a = col.meta) == null ? void 0 : _a.autoSize) return `minmax(${col.size || 50}px, 1fr)`;
       return `${col.size || 150}px`;
     }).join(" ");
   }, [columns]);
@@ -1677,71 +1677,73 @@ function ExpandTable(props) {
     if (!data) return 0;
     return Math.ceil(data.length / pageSize);
   }, [data, pageSize]);
-  return /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)("div", { className: "expand-table", style: tableStyle, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: "thead", children: getHeaderGroups().map((headerGroup) => /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
-      "div",
-      {
-        className: "tr",
-        style: { gridTemplateColumns },
-        children: headerGroup.headers.map((header) => {
-          var _a;
-          const sortable = header.column.getCanSort();
-          const sortedState = header.column.getIsSorted();
-          const justifyContent = ((_a = header.column.columnDef.meta) == null ? void 0 : _a.align) || defaultAlign;
-          return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: `${justifyContent} th`, children: /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(
-            "button",
-            {
-              onClick: header.column.getToggleSortingHandler(),
-              style: sortable ? { cursor: "pointer" } : { cursor: "default" },
-              type: "button",
-              children: [
-                /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(Typo, { as: "div", variant: "body", children: (0, import_react_table2.flexRender)(
-                  header.column.columnDef.header,
-                  header.getContext()
-                ) }),
-                sortable ? /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(
-                  import_themes22.Flex,
-                  {
-                    direction: "column",
-                    style: { marginLeft: "var(--space-2)" },
-                    children: [
-                      /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
-                        TriangleArrowUpIcon,
-                        {
-                          color: sortedState === "asc" ? "var(--iris-10)" : "var(--iris-6)"
-                        }
-                      ),
-                      /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
-                        TriangleArrowDownIcon,
-                        {
-                          color: sortedState === "desc" ? "var(--iris-10)" : "var(--iris-6)"
-                        }
-                      )
-                    ]
-                  }
-                ) : null
-              ]
-            }
-          ) }, header.id);
-        })
-      },
-      headerGroup.id
-    )) }),
-    /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: "tbody", children: helpCompRender(rowModels.rows.length) || rowModels.rows.map((row) => {
-      return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
-        Row,
+  return /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)("div", { className: "expand-table-wrapper", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)("div", { className: "expand-table", style: tableStyle, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: "thead", children: getHeaderGroups().map((headerGroup) => /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
+        "div",
         {
-          ExpandComp,
-          defaultAlign,
-          getCellStyle,
-          getRowStyle,
-          gridTemplateColumns,
-          onRowClick,
-          row
+          className: "tr",
+          style: { gridTemplateColumns },
+          children: headerGroup.headers.map((header) => {
+            var _a;
+            const sortable = header.column.getCanSort();
+            const sortedState = header.column.getIsSorted();
+            const justifyContent = ((_a = header.column.columnDef.meta) == null ? void 0 : _a.align) || defaultAlign;
+            return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: `${justifyContent} th`, children: /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(
+              "button",
+              {
+                onClick: header.column.getToggleSortingHandler(),
+                style: sortable ? { cursor: "pointer" } : { cursor: "default" },
+                type: "button",
+                children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(Typo, { as: "div", variant: "body", children: (0, import_react_table2.flexRender)(
+                    header.column.columnDef.header,
+                    header.getContext()
+                  ) }),
+                  sortable ? /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(
+                    import_themes22.Flex,
+                    {
+                      direction: "column",
+                      style: { marginLeft: "var(--space-2)" },
+                      children: [
+                        /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
+                          TriangleArrowUpIcon,
+                          {
+                            color: sortedState === "asc" ? "var(--iris-10)" : "var(--iris-6)"
+                          }
+                        ),
+                        /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
+                          TriangleArrowDownIcon,
+                          {
+                            color: sortedState === "desc" ? "var(--iris-10)" : "var(--iris-6)"
+                          }
+                        )
+                      ]
+                    }
+                  ) : null
+                ]
+              }
+            ) }, header.id);
+          })
         },
-        `row_${row.id}`
-      );
-    }) }),
+        headerGroup.id
+      )) }),
+      /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: "tbody", children: helpCompRender(rowModels.rows.length) || rowModels.rows.map((row) => {
+        return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
+          Row,
+          {
+            ExpandComp,
+            defaultAlign,
+            getCellStyle,
+            getRowStyle,
+            gridTemplateColumns,
+            onRowClick,
+            row
+          },
+          `row_${row.id}`
+        );
+      }) })
+    ] }),
     showPagination ? /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_themes22.Flex, { justify: "end", pt: "3", width: "100%", children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
       Pagination,
       {