asma-ui-core 3.45.2 → 3.46.0

package/dist/src/table/helpers/injectColumns.d.ts

@@ -1,4 +1,4 @@
 import { StyledTableProps } from '../types';
 export declare const injectColumns: <TData extends {
     id: string | number;
-}, TCustomData = Record<string, unknown>>(props: StyledTableProps<TData, TCustomData>) => void;
+}, TCustomData = Record<string, unknown>>(props: StyledTableProps<TData, TCustomData>) => StyledTableProps<TData, TCustomData>["columns"];

package/dist/src/table/hooks/useColumnSizingPersistence.d.ts

@@ -0,0 +1,3 @@
+import { ColumnSizingState, Table } from '@tanstack/react-table';
+export declare const usePersistedColumnSizing: (uniqueKey?: string) => ColumnSizingState | undefined;
+export declare const usePersistColumnSizing: <TData>(table: Table<TData>, uniqueKey?: string) => void;

package/dist/table/components/StyledTable.module.js

@@ -1,57 +1,57 @@
-var e = "_tbody_v7jow_124", _ = "_expanded_row_v7jow_187", o = "_selected_v7jow_205", l = "_shadowed_v7jow_234", t = "_resizer_v7jow_288", a = "_isResizing_v7jow_300", r = {
-  "asma-ui-table-styled-table": "_asma-ui-table-styled-table_v7jow_1",
-  "table-wrapper": "_table-wrapper_v7jow_26",
-  "table-shell": "_table-shell_v7jow_33",
-  "table-wrapper--no-rows": "_table-wrapper--no-rows_v7jow_39",
-  "table-wrapper--proxy": "_table-wrapper--proxy_v7jow_42",
-  "table-wrapper--proxy-bottom": "_table-wrapper--proxy-bottom_v7jow_43",
-  "table-wrapper-fetching": "_table-wrapper-fetching_v7jow_53",
-  "table-scroll": "_table-scroll_v7jow_56",
-  "table-x--fill-height": "_table-x--fill-height_v7jow_65",
-  "table-x": "_table-x_v7jow_65",
-  "table-content": "_table-content_v7jow_80",
-  "table-header--sticky": "_table-header--sticky_v7jow_85",
-  "table-hscroll": "_table-hscroll_v7jow_90",
-  "table-hscroll__content": "_table-hscroll__content_v7jow_100",
-  "no-rows-overlay-container": "_no-rows-overlay-container_v7jow_103",
-  "no-rows-overlay-content": "_no-rows-overlay-content_v7jow_111",
-  "styled-table": "_styled-table_v7jow_115",
+var e = "_tbody_1g04u_124", _ = "_expanded_row_1g04u_187", l = "_selected_1g04u_205", t = "_shadowed_1g04u_234", a = "_resizer_1g04u_288", o = "_isResizing_1g04u_300", r = {
+  "asma-ui-table-styled-table": "_asma-ui-table-styled-table_1g04u_1",
+  "table-wrapper": "_table-wrapper_1g04u_26",
+  "table-shell": "_table-shell_1g04u_33",
+  "table-wrapper--no-rows": "_table-wrapper--no-rows_1g04u_39",
+  "table-wrapper--proxy": "_table-wrapper--proxy_1g04u_42",
+  "table-wrapper--proxy-bottom": "_table-wrapper--proxy-bottom_1g04u_43",
+  "table-wrapper-fetching": "_table-wrapper-fetching_1g04u_53",
+  "table-scroll": "_table-scroll_1g04u_56",
+  "table-x--fill-height": "_table-x--fill-height_1g04u_65",
+  "table-x": "_table-x_1g04u_65",
+  "table-content": "_table-content_1g04u_80",
+  "table-header--sticky": "_table-header--sticky_1g04u_85",
+  "table-hscroll": "_table-hscroll_1g04u_90",
+  "table-hscroll__content": "_table-hscroll__content_1g04u_100",
+  "no-rows-overlay-container": "_no-rows-overlay-container_1g04u_103",
+  "no-rows-overlay-content": "_no-rows-overlay-content_1g04u_111",
+  "styled-table": "_styled-table_1g04u_115",
   tbody: e,
-  "loading-icon": "_loading-icon_v7jow_129",
-  "t-row": "_t-row_v7jow_136",
-  "t-cell": "_t-cell_v7jow_136",
-  "action-cell": "_action-cell_v7jow_146",
-  "fixed-cell": "_fixed-cell_v7jow_150",
-  "fixed-right-cell": "_fixed-right-cell_v7jow_153",
+  "loading-icon": "_loading-icon_1g04u_129",
+  "t-row": "_t-row_1g04u_136",
+  "t-cell": "_t-cell_1g04u_136",
+  "action-cell": "_action-cell_1g04u_146",
+  "fixed-cell": "_fixed-cell_1g04u_150",
+  "fixed-right-cell": "_fixed-right-cell_1g04u_153",
   expanded_row: _,
-  selected: o,
-  "single-selection": "_single-selection_v7jow_208",
-  "action-cell--no-shadow": "_action-cell--no-shadow_v7jow_225",
-  "action-cell--not-fixed": "_action-cell--not-fixed_v7jow_228",
-  shadowed: l,
-  "shadowed-right": "_shadowed-right_v7jow_268",
-  "is-loading": "_is-loading_v7jow_272",
-  "action-cell-default-background": "_action-cell-default-background_v7jow_275",
-  "fixed-cell-default-background": "_fixed-cell-default-background_v7jow_278",
-  "fixed-right-cell-default-background": "_fixed-right-cell-default-background_v7jow_281",
-  "sortable-column": "_sortable-column_v7jow_284",
-  resizer: t,
-  isResizing: a,
-  "hide-table-header": "_hide-table-header_v7jow_312",
-  "show-table-header": "_show-table-header_v7jow_316",
-  "table-header": "_table-header_v7jow_85",
-  "hide-header": "_hide-header_v7jow_342",
-  "t-cell__actions": "_t-cell__actions_v7jow_345",
-  "t-cell__actions--no-shadow": "_t-cell__actions--no-shadow_v7jow_353",
-  "t-cell__actions--not-fixed": "_t-cell__actions--not-fixed_v7jow_356",
-  "t-cell__fixed": "_t-cell__fixed_v7jow_363",
-  "t-cell__fixed-right": "_t-cell__fixed-right_v7jow_370",
-  "sort-icon": "_sort-icon_v7jow_377",
-  "table-footer--sticky": "_table-footer--sticky_v7jow_380",
-  "table-footer--inline": "_table-footer--inline_v7jow_391",
-  "table-bottom": "_table-bottom_v7jow_402",
-  "table-bottom--sticky": "_table-bottom--sticky_v7jow_416",
-  "cursor-not-allowed": "_cursor-not-allowed_v7jow_420"
+  selected: l,
+  "single-selection": "_single-selection_1g04u_208",
+  "action-cell--no-shadow": "_action-cell--no-shadow_1g04u_225",
+  "action-cell--not-fixed": "_action-cell--not-fixed_1g04u_228",
+  shadowed: t,
+  "shadowed-right": "_shadowed-right_1g04u_268",
+  "is-loading": "_is-loading_1g04u_272",
+  "action-cell-default-background": "_action-cell-default-background_1g04u_275",
+  "fixed-cell-default-background": "_fixed-cell-default-background_1g04u_278",
+  "fixed-right-cell-default-background": "_fixed-right-cell-default-background_1g04u_281",
+  "sortable-column": "_sortable-column_1g04u_284",
+  resizer: a,
+  isResizing: o,
+  "hide-table-header": "_hide-table-header_1g04u_312",
+  "show-table-header": "_show-table-header_1g04u_316",
+  "table-header": "_table-header_1g04u_85",
+  "hide-header": "_hide-header_1g04u_348",
+  "t-cell__actions": "_t-cell__actions_1g04u_351",
+  "t-cell__actions--no-shadow": "_t-cell__actions--no-shadow_1g04u_359",
+  "t-cell__actions--not-fixed": "_t-cell__actions--not-fixed_1g04u_362",
+  "t-cell__fixed": "_t-cell__fixed_1g04u_369",
+  "t-cell__fixed-right": "_t-cell__fixed-right_1g04u_376",
+  "sort-icon": "_sort-icon_1g04u_383",
+  "table-footer--sticky": "_table-footer--sticky_1g04u_386",
+  "table-footer--inline": "_table-footer--inline_1g04u_397",
+  "table-bottom": "_table-bottom_1g04u_408",
+  "table-bottom--sticky": "_table-bottom--sticky_1g04u_422",
+  "cursor-not-allowed": "_cursor-not-allowed_1g04u_426"
 };
 export {
   r as default

package/dist/table/components/StyledTableIndex.js

@@ -17,7 +17,7 @@ import { DndContext as fe, closestCenter as he } from "@dnd-kit/core";
 import { restrictToParentElement as be, restrictToVerticalAxis as ue } from "@dnd-kit/modifiers";
 import { arrayMove as pe } from "@dnd-kit/sortable";
 function we({ enabled: l, data: o, setData: i, children: v }) {
-  const y = O(() => o.map((c) => c.id), [o]), S = (c) => {
+  const y = O(() => o.map((c) => c.id), [o]), P = (c) => {
     if (!l || !i) return;
     const { active: m, over: f } = c;
     !m || !f || m.id === f.id || i((g) => pe(g, y.indexOf(m.id), y.indexOf(f.id)));
@@ -25,7 +25,7 @@ function we({ enabled: l, data: o, setData: i, children: v }) {
   return l ? /* @__PURE__ */ t(fe, {
     collisionDetection: he,
     modifiers: [ue, be],
-    onDragEnd: S,
+    onDragEnd: P,
     children: v
   }) : /* @__PURE__ */ t(X, { children: v });
 }
@@ -36,61 +36,65 @@ function ve({ enabled: l, className: o, children: i }) {
   }) : /* @__PURE__ */ t(X, { children: i });
 }
 var Ve = (l) => {
-  const o = O(() => ({
-    ...l,
-    rowHeight: l.rowHeight ?? 48
-  }), [l]), { className: i, tableClassName: v, height: y, noRowsOverlay: S, data: c, enableDnd: m, setData: f, loading: g } = o;
-  le(o);
-  const { table: a } = ne(o), C = c.length > 0, F = C && !!g, h = !C && !g, z = oe(re()), r = !!o.stickyFooter && !z, [G, M] = me(!1), x = L(null), W = L(null), P = o.hideHeader ? 0 : 32, { tableScrollRef: R, tableXRef: H, hScrollRef: J, hScrollContentRef: K } = ce(!r);
+  const o = O(() => {
+    const r = {
+      ...l,
+      rowHeight: l.rowHeight ?? 48
+    };
+    return {
+      ...r,
+      columns: le(r)
+    };
+  }, [l]), { className: i, tableClassName: v, height: y, noRowsOverlay: P, data: c, enableDnd: m, setData: f, loading: g } = o, { table: a } = ne(o), C = c.length > 0, F = C && !!g, h = !C && !g, z = oe(re()), n = !!o.stickyFooter && !z, [G, M] = me(!1), x = L(null), W = L(null), S = o.hideHeader ? 0 : 32, { tableScrollRef: R, tableXRef: H, hScrollRef: J, hScrollContentRef: K } = ce(!n);
   q(() => {
-    const n = r ? x.current : H.current ?? R.current;
-    if (!n) {
+    const r = n ? x.current : H.current ?? R.current;
+    if (!r) {
       M(!1);
       return;
     }
-    const s = n.querySelector("table"), b = () => {
-      const u = n.scrollWidth > n.clientWidth;
+    const s = r.querySelector("table"), b = () => {
+      const u = r.scrollWidth > r.clientWidth;
       M((I) => I === u ? I : u);
     };
     b();
     const d = new ResizeObserver(b);
-    return d.observe(n), s && d.observe(s), () => {
+    return d.observe(r), s && d.observe(s), () => {
       d.disconnect();
     };
   }, [
-    r,
+    n,
     H,
     R
   ]);
   const { ref: Q, heightPx: k } = $(), { ref: U, heightPx: D } = $(), N = o.rowHeight ?? 48, E = a.getRowModel().rows.length, V = o.hideHeader ? 0 : 32, _ = 12, Y = O(() => {
     if (N <= 0) return 0;
-    const n = r ? 0 : V + D + _, s = Math.max(0, k - n);
+    const r = n ? 0 : V + D + _, s = Math.max(0, k - r);
     return Math.floor(s / N);
   }, [
-    r,
+    n,
     D,
     V,
     _,
     N,
     k
-  ]), T = !r && E > 0 && E <= Y, Z = p(r ? e["table-wrapper"] : T || !r && h ? e["table-wrapper--proxy-bottom"] : e["table-wrapper--proxy"], F && e["table-wrapper-fetching"], h && e["table-wrapper--no-rows"], i), { columnWindow: j } = de({
+  ]), T = !n && E > 0 && E <= Y, Z = p(n ? e["table-wrapper"] : T || !n && h ? e["table-wrapper--proxy-bottom"] : e["table-wrapper--proxy"], F && e["table-wrapper-fetching"], h && e["table-wrapper--no-rows"], i), { columnWindow: j } = de({
     table: a,
-    scrollRef: r ? x : R,
+    scrollRef: n ? x : R,
     isMobileView: z
   });
   q(() => {
-    const n = x.current, s = W.current, b = () => n?.style.removeProperty("--no-rows-content-height");
-    if (!n || !h || !s) {
+    const r = x.current, s = W.current, b = () => r?.style.removeProperty("--no-rows-content-height");
+    if (!r || !h || !s) {
       b();
       return;
     }
-    const d = () => n.style.setProperty("--no-rows-content-height", `${Math.ceil(s.getBoundingClientRect().height) + P}px`);
+    const d = () => r.style.setProperty("--no-rows-content-height", `${Math.ceil(s.getBoundingClientRect().height) + S}px`);
     d();
     const u = new ResizeObserver(d);
     return u.observe(s), () => {
       u.disconnect(), b();
     };
-  }, [h, P]);
+  }, [h, S]);
   const A = /* @__PURE__ */ w("div", {
     className: e["table-content"],
     children: [/* @__PURE__ */ w("table", {
@@ -113,11 +117,11 @@ var Ve = (l) => {
     }), /* @__PURE__ */ t(ae, { fetching: !!F })]
   }), ee = h ? /* @__PURE__ */ t("div", {
     className: e["no-rows-overlay-container"],
-    style: { top: P },
+    style: { top: S },
     children: /* @__PURE__ */ t("div", {
       ref: W,
       className: e["no-rows-overlay-content"],
-      children: S
+      children: P
     })
   }) : null;
   return /* @__PURE__ */ t(te, { children: /* @__PURE__ */ t(we, {
@@ -130,12 +134,12 @@ var Ve = (l) => {
       "data-x-overflow": G ? "true" : "false",
       style: { height: y },
       children: [/* @__PURE__ */ t(ve, {
-        enabled: r,
+        enabled: n,
         className: e["table-shell"],
         children: /* @__PURE__ */ w("div", {
           ref: x,
           className: Z,
-          children: [r ? A : /* @__PURE__ */ w("div", {
+          children: [n ? A : /* @__PURE__ */ w("div", {
             ref: R,
             className: p(e["table-scroll"]),
             children: [
@@ -164,7 +168,7 @@ var Ve = (l) => {
             ]
           }), ee]
         })
-      }), r && /* @__PURE__ */ t(B, {
+      }), n && /* @__PURE__ */ t(B, {
         table: a,
         styledTableProps: o,
         canShowStickyFooter: !0

package/dist/table/components/TableRow.js

@@ -1,55 +1,62 @@
-import { ACTIONS_COLUMN_ID as U } from "../types.js";
-import { useRootContext as se } from "../context/RootContext.js";
+import { ACTIONS_COLUMN_ID as O } from "../types.js";
+import { useRootContext as ue } from "../context/RootContext.js";
 import n from "./StyledTable.module.js";
-import { compact as ae } from "../../helpers/arrays.js";
-import W from "clsx";
-import { Fragment as de, useCallback as ce, useEffect as re, useMemo as g } from "react";
-import { Fragment as me, jsx as l, jsxs as p } from "react/jsx-runtime";
-import { useSortable as ge } from "@dnd-kit/sortable";
-import { flexRender as ue } from "@tanstack/react-table";
-import { CSS as fe } from "@dnd-kit/utilities";
-function ve({ styledTableProps: _, row: t, index: H, columnWindow: { paddingLeft: u, paddingRight: f, indexes: F } }) {
-  const { loading: O, getRowClassName: s, rowHeight: y, onRowClick: x, expandArrow: $, enableDnd: v, disableDndForRow: j, tdClassName: N, customSubRowData: I, renderSubRows: P, defaultExpanded: K, actions: C, customActionsNode: V, textExpandArrow: E, enableMultiRowSelection: Y, enableRowSelection: q, singleSelectionRow: G } = _, w = j?.(t), { transform: J, transition: Q, setNodeRef: X, isDragging: A } = ge({
+import { compact as fe } from "../../helpers/arrays.js";
+import $ from "clsx";
+import { Fragment as he, useCallback as j, useEffect as pe, useLayoutEffect as xe, useMemo as g, useRef as Ce, useState as Re } from "react";
+import { Fragment as Se, jsx as l, jsxs as C } from "react/jsx-runtime";
+import { useSortable as be } from "@dnd-kit/sortable";
+import { flexRender as De } from "@tanstack/react-table";
+import { CSS as ke } from "@dnd-kit/utilities";
+function Me({ styledTableProps: P, row: t, index: K, columnWindow: { paddingLeft: u, paddingRight: f, indexes: N } }) {
+  const { loading: V, getRowClassName: s, rowHeight: h, onRowClick: R, expandArrow: Y, enableDnd: I, disableDndForRow: q, tdClassName: w, customSubRowData: B, renderSubRows: G, defaultExpanded: J, actions: S, customActionsNode: Q, textExpandArrow: A, enableMultiRowSelection: X, enableRowSelection: Z, singleSelectionRow: ee } = P, b = q?.(t), { transform: te, transition: ne, setNodeRef: H, isDragging: L } = be({
     id: t.original.id,
-    disabled: !v || w
-  }), Z = {
-    transform: fe.Transform.toString(J),
-    transition: Q,
-    opacity: A ? 0.8 : 1,
-    zIndex: A ? 1 : 0,
+    disabled: !I || b
+  }), ie = {
+    transform: ke.Transform.toString(te),
+    transition: ne,
+    opacity: L ? 0.8 : 1,
+    zIndex: L ? 1 : 0,
     position: "relative"
-  }, { isResizing: ee, disableResizingFlag: te } = se();
-  re(() => {
-    K && t.getCanExpand() && !t.getIsExpanded() && t.toggleExpand();
+  }, { isResizing: oe, disableResizingFlag: le } = ue(), D = t.isExpanded(), p = Ce(null), [se, ae] = Re(void 0);
+  xe(() => {
+    !D && p.current && ae(p.current.cells[0]?.clientHeight ?? p.current.offsetHeight);
+  }, [D]);
+  const de = j((e) => {
+    p.current = e, b || H(e);
+  }, [b, H]), M = D ? se ?? h : h;
+  pe(() => {
+    J && t.getCanExpand() && !t.getIsExpanded() && t.toggleExpand();
   }, []);
-  const B = (e) => {
-    t.getCanExpand() && !$ && t.getToggleExpandedHandler()(), document.getElementById(t.id)?.focus();
-    const i = window.getSelection()?.type !== "Range" && !ee, o = x instanceof Function;
-    !o && E && i ? t.toggleExpand() : o && i && x(e, t), te();
-  }, ne = (e) => {
-    e.target.classList.contains("MuiModal-backdrop") || e.target.nodeName === "INPUT" || e.target.nodeName === "BUTTON" || e.target.nodeName === "LI" || e.target.closest("li") || B(e);
+  const T = (e) => {
+    t.getCanExpand() && !Y && t.getToggleExpandedHandler()(), document.getElementById(t.id)?.focus();
+    const i = window.getSelection()?.type !== "Range" && !oe, o = R instanceof Function;
+    !o && A && i ? t.toggleExpand() : o && i && R(e, t), le();
+  }, ce = (e) => {
+    e.target.classList.contains("MuiModal-backdrop") || e.target.nodeName === "INPUT" || e.target.nodeName === "BUTTON" || e.target.nodeName === "LI" || e.target.closest("li") || T(e);
   }, r = t.getVisibleCells().map((e, i, o) => ({
     ...e,
     left: o.slice(0, i).reduce((d, c) => d + (c.column.getSize() ?? 0), 0)
-  })), T = g(() => r.filter((e) => !e.column.columnDef.fixedLeft && !e.column.columnDef.fixedRight && e.column.id !== "actions"), [r]), a = g(() => r.filter((e) => !!e.column.columnDef.fixedRight || e.column.id === "actions").map((e, i, o) => ({
+  })), z = g(() => r.filter((e) => !e.column.columnDef.fixedLeft && !e.column.columnDef.fixedRight && e.column.id !== "actions"), [r]), a = g(() => r.filter((e) => !!e.column.columnDef.fixedRight || e.column.id === "actions").map((e, i, o) => ({
     ...e,
     right: o.slice(i + 1).reduce((d, c) => d + (c.column.getSize() ?? 0), 0)
-  })), [r]), L = g(() => a.some((e) => e.column.id === U), [a]), h = !!C || !!V, M = g(() => a.some((e) => !!e.column.columnDef.fixedRight), [a]), m = g(() => r.filter((e) => e.column.columnDef.fixedLeft), [r]), S = !Y && !q && G, b = t.getIsSelected() && S, R = x instanceof Function, z = F.length > 0 ? ae(F.map((e) => T[e])) : T, D = ce((e, i) => {
-    const o = e.column.id === U, d = e.column.columnDef.fixedLeft, c = !!e.column.columnDef.fixedRight, ie = e.id === m.at(-1)?.id, oe = e.id === a.at(0)?.id && !o, le = t.isExpanded(), k = i === 0;
+  })), [r]), U = g(() => a.some((e) => e.column.id === O), [a]), x = !!S || !!Q, W = g(() => a.some((e) => !!e.column.columnDef.fixedRight), [a]), m = g(() => r.filter((e) => e.column.columnDef.fixedLeft), [r]), k = !X && !Z && ee, y = t.getIsSelected() && k, F = R instanceof Function, _ = N.length > 0 ? fe(N.map((e) => z[e])) : z, E = j((e, i) => {
+    const o = e.column.id === O, d = e.column.columnDef.fixedLeft, c = !!e.column.columnDef.fixedRight, re = e.id === m.at(-1)?.id, me = e.id === a.at(0)?.id && !o, ge = t.isExpanded(), v = i === 0;
     return /* @__PURE__ */ l("td", {
-      className: W(n["t-cell"], R && "cursor-pointer", N, o && n["action-cell"], o && !h && n["action-cell--not-fixed"], o && h && M && n["action-cell--no-shadow"], o && h && !!C && m.length && n.shadowed, o && (s?.(t) ? s?.(t) : n["action-cell-default-background"]), d && n["fixed-cell"], c && n["fixed-right-cell"], ie && n.shadowed, oe && n["shadowed-right"], t.getIsSelected() && n.selected, d && (s?.(t) ? s?.(t) : n["fixed-cell-default-background"]), c && (s?.(t) ? s?.(t) : n["fixed-right-cell-default-background"]), le && n.expanded_row, (!!b || t.isFocused()) && n["single-selection"]),
+      className: $(n["t-cell"], F && "cursor-pointer", w, o && n["action-cell"], o && !x && n["action-cell--not-fixed"], o && x && W && n["action-cell--no-shadow"], o && x && !!S && m.length && n.shadowed, o && (s?.(t) ? s?.(t) : n["action-cell-default-background"]), d && n["fixed-cell"], c && n["fixed-right-cell"], re && n.shadowed, me && n["shadowed-right"], t.getIsSelected() && n.selected, d && (s?.(t) ? s?.(t) : n["fixed-cell-default-background"]), c && (s?.(t) ? s?.(t) : n["fixed-right-cell-default-background"]), ge && n.expanded_row, (!!y || t.isFocused()) && n["single-selection"]),
       style: {
         left: d ? e.left : void 0,
-        right: c ? e.right + (L ? -1 : 0) : void 0
+        right: c ? e.right + (U ? -1 : 0) : void 0
       },
-      children: /* @__PURE__ */ p("div", {
+      children: /* @__PURE__ */ C("div", {
         style: {
           display: "flex",
           alignItems: "center",
-          minWidth: k ? 32 : void 0,
+          minWidth: v ? 32 : void 0,
+          minHeight: M,
           position: "relative"
         },
-        children: [k && b && /* @__PURE__ */ l("span", {
+        children: [v && y && /* @__PURE__ */ l("span", {
           style: {
             display: "inline-flex",
             alignItems: "center",
@@ -58,45 +65,46 @@ function ve({ styledTableProps: _, row: t, index: H, columnWindow: { paddingLeft
             top: "50%",
             transform: "translateY(-50%)"
           },
-          children: /* @__PURE__ */ l(he, {})
+          children: /* @__PURE__ */ l(ye, {})
         }), /* @__PURE__ */ l("span", {
           style: {
-            marginLeft: k && S ? 30 : 0,
+            marginLeft: v && k ? 30 : 0,
             width: "100%"
           },
-          children: ue(e.column.columnDef.cell, e.getContext())
+          children: De(e.column.columnDef.cell, e.getContext())
         })]
       })
     }, e.id);
   }, [
-    b,
-    C,
-    s,
-    R,
-    L,
+    y,
+    S,
     M,
+    s,
+    F,
+    U,
+    W,
     m,
     a,
     t,
-    h,
-    S,
-    N
+    x,
+    k,
+    w
   ]);
-  return /* @__PURE__ */ p(de, { children: [/* @__PURE__ */ p("tr", {
+  return /* @__PURE__ */ C(he, { children: [/* @__PURE__ */ C("tr", {
     "aria-selected": t.getIsSelected() || t.isFocused() ? "true" : "false",
     tabIndex: t.isFocused() ? 0 : -1,
-    "data-index": H,
+    "data-index": K,
     "data-test": t.id,
     id: t.id,
-    className: W(n["t-row"], O && n["is-loading"], s?.(t)),
+    className: $(n["t-row"], V && n["is-loading"], s?.(t)),
     style: {
-      height: y ? `${y}px` : "inherit",
-      ...v && Z
+      height: h ? `${h}px` : "inherit",
+      ...I && ie
     },
-    ref: w ? void 0 : X,
-    onMouseUp: ne,
+    ref: de,
+    onMouseUp: ce,
     onMouseDown: (e) => {
-      e.detail > 1 && !R && E && e.preventDefault();
+      e.detail > 1 && !F && A && e.preventDefault();
     },
     onKeyDown: (e) => {
       switch (e.key) {
@@ -108,12 +116,12 @@ function ve({ styledTableProps: _, row: t, index: H, columnWindow: { paddingLeft
           t.focusPrevRow(), e.preventDefault();
           break;
         case "Enter":
-          B(e);
+          T(e);
           break;
       }
     },
     children: [
-      m.map((e, i) => D(e, i)),
+      m.map((e, i) => E(e, i)),
       u > 0 && /* @__PURE__ */ l("td", {
         "aria-hidden": !0,
         className: n["t-cell"],
@@ -125,7 +133,7 @@ function ve({ styledTableProps: _, row: t, index: H, columnWindow: { paddingLeft
           border: "none"
         }
       }),
-      z.map((e, i) => D(e, m.length + i)),
+      _.map((e, i) => E(e, m.length + i)),
       f > 0 && /* @__PURE__ */ l("td", {
         "aria-hidden": !0,
         className: n["t-cell"],
@@ -137,14 +145,14 @@ function ve({ styledTableProps: _, row: t, index: H, columnWindow: { paddingLeft
           border: "none"
         }
       }),
-      a.map((e, i) => D(e, m.length + z.length + i))
+      a.map((e, i) => E(e, m.length + _.length + i))
     ]
-  }), t.getIsExpanded() && /* @__PURE__ */ l(me, { children: I && P?.({
-    rows: I.get(t.original.id.toString()) ?? [],
+  }), t.getIsExpanded() && /* @__PURE__ */ l(Se, { children: B && G?.({
+    rows: B.get(t.original.id.toString()) ?? [],
     row: t.original
   }) })] }, t.id);
 }
-var he = () => /* @__PURE__ */ p("svg", {
+var ye = () => /* @__PURE__ */ C("svg", {
   xmlns: "http://www.w3.org/2000/svg",
   width: "20",
   height: "20",
@@ -156,5 +164,5 @@ var he = () => /* @__PURE__ */ p("svg", {
   })]
 });
 export {
-  ve as TableRow
+  Me as TableRow
 };

package/dist/table/components/columns/expandColumn.js

@@ -1,10 +1,10 @@
-import { EXPAND_COLUMN_ID as r } from "../../types.js";
+import { EXPAND_COLUMN_ID as i } from "../../types.js";
 import { ChevronDownIcon as a } from "../../shared-components/ChevronDownIcon.js";
 import { jsx as t } from "react/jsx-runtime";
 import "@tanstack/react-table";
-function p(o, i) {
+function f(r, o) {
   return {
-    id: r,
+    id: i,
     minSize: 50,
     maxSize: 50,
     size: 50,
@@ -17,23 +17,27 @@ function p(o, i) {
         type: "button",
         "aria-label": n ? "Collapse row" : "Expand row",
         "aria-expanded": n,
-        className: "flex w-full items-center justify-center border-0 bg-transparent outline-none focus:outline-none",
+        className: "flex w-full items-center justify-center border-0 bg-transparent p-0 outline-none focus:outline-none",
         onClick: () => e.row.getToggleExpandedHandler()(),
-        style: { height: i ?? "auto" },
+        style: { height: o ?? "auto" },
         children: /* @__PURE__ */ t(a, {
+          className: "block size-6 shrink-0",
           width: 24,
           height: 24,
           style: {
-            rotate: n ? "180deg" : "0deg",
-            transitionTimingFunction: "cubic-bezier(0.4, 0, 0.2, 1)",
-            transitionDuration: "500ms"
+            transform: n ? "rotate(180deg)" : "rotate(0deg)",
+            transformBox: "fill-box",
+            transformOrigin: "center",
+            transitionProperty: "transform",
+            transitionDuration: "500ms",
+            transitionTimingFunction: "cubic-bezier(0.4, 0, 0.2, 1)"
           }
         })
       }) : null;
     },
-    fixedLeft: o
+    fixedLeft: r
   };
 }
 export {
-  p as generateExpandColumn
+  f as generateExpandColumn
 };

package/dist/table/components/columns/showTextColumn.js

@@ -1,8 +1,8 @@
 import { SHOW_FULL_TEXT_ID as i } from "../../types.js";
-import { ChevronDownIcon as a } from "../../shared-components/ChevronDownIcon.js";
+import { ChevronDownIcon as s } from "../../shared-components/ChevronDownIcon.js";
 import { StyledButton as l } from "../../shared-components/button/StyledButton.js";
-import { jsx as n } from "react/jsx-runtime";
-function g(e, o) {
+import { jsx as o } from "react/jsx-runtime";
+function f(e, n) {
   return {
     id: i,
     minSize: 38,
@@ -11,24 +11,24 @@ function g(e, o) {
     enableHiding: !1,
     enableSorting: !1,
     header: () => null,
-    cell: (r) => /* @__PURE__ */ n(s, {
+    cell: (r) => /* @__PURE__ */ o(u, {
       info: r,
-      rowHeight: o
+      rowHeight: n
     }),
     fixedLeft: e
   };
 }
-function s({ info: e, rowHeight: o }) {
-  const r = e.row.getCanExpand();
-  return /* @__PURE__ */ n("div", {
+function u({ info: e, rowHeight: n }) {
+  const r = e.row.getCanExpand(), a = e.row.isExpanded();
+  return /* @__PURE__ */ o("div", {
     className: "flex w-full items-center justify-center",
-    style: { height: o ?? "auto" },
-    children: /* @__PURE__ */ n(l, {
+    style: { height: n ?? "auto" },
+    children: /* @__PURE__ */ o(l, {
       dataTest: "expand-text-button",
       size: "small",
       variant: "textGray",
-      onClick: () => {
-        r && e.row.getToggleExpandedHandler()(), e.row.toggleExpand();
+      onClick: (t) => {
+        t.stopPropagation(), r && e.row.getToggleExpandedHandler()(), e.row.toggleExpand();
       },
       onMouseDown: (t) => {
         t.preventDefault(), t.stopPropagation();
@@ -36,13 +36,17 @@ function s({ info: e, rowHeight: o }) {
       onMouseUp: (t) => {
         t.preventDefault(), t.stopPropagation();
       },
-      startIcon: /* @__PURE__ */ n(a, {
+      startIcon: /* @__PURE__ */ o(s, {
+        className: "block size-5 shrink-0",
         width: 20,
         height: 20,
         style: {
-          rotate: e.row.isExpanded() ? "180deg" : "0deg",
-          transitionTimingFunction: "cubic-bezier(0.4, 0, 0.2, 1)",
+          transform: a ? "rotate(180deg)" : "rotate(0deg)",
+          transformBox: "fill-box",
+          transformOrigin: "center",
+          transitionProperty: "transform",
           transitionDuration: "500ms",
+          transitionTimingFunction: "cubic-bezier(0.4, 0, 0.2, 1)",
           cursor: "pointer"
         }
       })
@@ -50,5 +54,5 @@ function s({ info: e, rowHeight: o }) {
   });
 }
 export {
-  g as generateShowFullTextColumn
+  f as generateShowFullTextColumn
 };