asma-ui-core 3.18.0 → 3.20.0

package/dist/table/components/StyledTableIndex.js

@@ -0,0 +1,178 @@
+import { cn as p } from "../helpers/cn.js";
+import { RootContextProvider as te } from "../context/RootContext.js";
+import { mobileView as oe, useWindowWidthSize as re } from "../hooks/useWindowWidthSize.hook.js";
+import { useStyledTable as ne } from "../hooks/useStyledTable.js";
+import o from "./StyledTable.module.js";
+import { injectColumns as le } from "../helpers/injectColumns.js";
+import { TableHeader as se } from "./table-header/TableHeader.js";
+import { TableBody as ie } from "./TableBody.js";
+import { Fetching as ae } from "./Fetching.js";
+import { TableFooter as B } from "./table-footer/TableFooter.js";
+import { useProxyHorizontalScrollSync as ce } from "./columns/helpers/useProxyHorizontalScrollSync.js";
+import { useElementHeightPx as $ } from "./columns/helpers/useElementHeightPx.js";
+import { useColumnVirtualizer as de } from "../hooks/useColumnVirtualizer.js";
+import { useLayoutEffect as q, useMemo as O, useRef as L, useState as me } from "react";
+import { Fragment as X, jsx as e, jsxs as R } from "react/jsx-runtime";
+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: t, setData: i, children: w }) {
+  const v = O(() => t.map((c) => c.id), [t]), S = (c) => {
+    if (!l || !i) return;
+    const { active: m, over: f } = c;
+    !m || !f || m.id === f.id || i((y) => pe(y, v.indexOf(m.id), v.indexOf(f.id)));
+  };
+  return l ? /* @__PURE__ */ e(fe, {
+    collisionDetection: he,
+    modifiers: [ue, be],
+    onDragEnd: S,
+    children: w
+  }) : /* @__PURE__ */ e(X, { children: w });
+}
+function ve({ enabled: l, className: t, children: i }) {
+  return l ? /* @__PURE__ */ e("div", {
+    className: t,
+    children: i
+  }) : /* @__PURE__ */ e(X, { children: i });
+}
+var Ve = (l) => {
+  const t = O(() => ({
+    ...l,
+    rowHeight: l.rowHeight ?? 48
+  }), [l]), { className: i, tableClassName: w, height: v, noRowsOverlay: S, data: c, enableDnd: m, setData: f, loading: y } = t;
+  le(t);
+  const { table: a } = ne(t), C = c.length > 0, F = C && !!y, h = !C && !y, z = oe(re()), r = !!t.stickyFooter && !z, [G, M] = me(!1), g = L(null), W = L(null), P = t.hideHeader ? 0 : 32, { tableScrollRef: x, tableXRef: H, hScrollRef: J, hScrollContentRef: K } = ce(!r);
+  q(() => {
+    const n = r ? g.current : H.current ?? x.current;
+    if (!n) {
+      M(!1);
+      return;
+    }
+    const s = n.querySelector("table"), b = () => {
+      const u = n.scrollWidth > n.clientWidth;
+      M((I) => I === u ? I : u);
+    };
+    b();
+    const d = new ResizeObserver(b);
+    return d.observe(n), s && d.observe(s), () => {
+      d.disconnect();
+    };
+  }, [
+    r,
+    H,
+    x
+  ]);
+  const { ref: Q, heightPx: k } = $(), { ref: U, heightPx: D } = $(), T = t.rowHeight ?? 48, E = a.getRowModel().rows.length, V = t.hideHeader ? 0 : 32, _ = 12, Y = O(() => {
+    if (T <= 0) return 0;
+    const n = r ? 0 : V + D + _, s = Math.max(0, k - n);
+    return Math.floor(s / T);
+  }, [
+    r,
+    D,
+    V,
+    _,
+    T,
+    k
+  ]), N = !r && E > 0 && E <= Y, Z = p(r ? o["table-wrapper"] : N || !r && h ? o["table-wrapper--proxy-bottom"] : o["table-wrapper--proxy"], F && o["table-wrapper-fetching"], h && o["table-wrapper--no-rows"], i), { columnWindow: j } = de({
+    table: a,
+    scrollRef: r ? g : x,
+    isMobileView: z
+  });
+  q(() => {
+    const n = g.current, s = W.current, b = () => n?.style.removeProperty("--no-rows-content-height");
+    if (!n || !h || !s) {
+      b();
+      return;
+    }
+    const d = () => n.style.setProperty("--no-rows-content-height", `${Math.ceil(s.getBoundingClientRect().height) + P}px`);
+    d();
+    const u = new ResizeObserver(d);
+    return u.observe(s), () => {
+      u.disconnect(), b();
+    };
+  }, [h, P]);
+  const A = /* @__PURE__ */ R("table", {
+    className: o["styled-table"],
+    style: {
+      width: a.getTotalSize(),
+      minWidth: "100%"
+    },
+    children: [
+      /* @__PURE__ */ e(se, {
+        table: a,
+        styledTableProps: t,
+        tableCanResize: !!t.enableColumnResizing,
+        tableWidth: null,
+        columnWindow: j
+      }),
+      /* @__PURE__ */ e(ae, { fetching: !!F }),
+      /* @__PURE__ */ e(ie, {
+        table: a,
+        styledTableProps: t,
+        columnWindow: j
+      })
+    ]
+  }), ee = h ? /* @__PURE__ */ e("div", {
+    className: o["no-rows-overlay-container"],
+    style: { top: P },
+    children: /* @__PURE__ */ e("div", {
+      ref: W,
+      className: o["no-rows-overlay-content"],
+      children: S
+    })
+  }) : null;
+  return /* @__PURE__ */ e(te, { children: /* @__PURE__ */ e(we, {
+    enabled: !!m,
+    data: c,
+    setData: f,
+    children: /* @__PURE__ */ R("div", {
+      ref: Q,
+      className: p(o["asma-ui-table-styled-table"], w),
+      "data-x-overflow": G ? "true" : "false",
+      style: { height: v },
+      children: [/* @__PURE__ */ e(ve, {
+        enabled: r,
+        className: o["table-shell"],
+        children: /* @__PURE__ */ R("div", {
+          ref: g,
+          className: Z,
+          children: [r ? A : /* @__PURE__ */ R("div", {
+            ref: x,
+            className: p(o["table-scroll"]),
+            children: [
+              /* @__PURE__ */ e("div", {
+                ref: H,
+                className: p(o["table-x"], !N && o["table-x--fill-height"]),
+                children: A
+              }),
+              /* @__PURE__ */ e("div", {
+                ref: J,
+                className: o["table-hscroll"],
+                children: /* @__PURE__ */ e("div", {
+                  ref: K,
+                  className: o["table-hscroll__content"]
+                })
+              }),
+              /* @__PURE__ */ e("div", {
+                ref: U,
+                className: p(o["table-bottom"], N && o["table-bottom--sticky"]),
+                children: /* @__PURE__ */ e(B, {
+                  table: a,
+                  styledTableProps: t,
+                  canShowStickyFooter: !1
+                })
+              })
+            ]
+          }), ee]
+        })
+      }), r && /* @__PURE__ */ e(B, {
+        table: a,
+        styledTableProps: t,
+        canShowStickyFooter: !0
+      })]
+    })
+  }) });
+};
+export {
+  Ve as StyledTable
+};

package/dist/table/components/TableBody.js

@@ -0,0 +1,33 @@
+import l from "./StyledTable.module.js";
+import { TableSkeleton as g } from "./TableSkeleton.js";
+import { TableRows as i } from "./TableRows.js";
+import { jsx as t } from "react/jsx-runtime";
+import { SortableContext as s, verticalListSortingStrategy as h } from "@dnd-kit/sortable";
+function x({ table: e, styledTableProps: o, columnWindow: n }) {
+  const { columns: a, data: r, loading: m, enableDnd: d, rowHeight: c } = o, f = e.getAllLeafColumns().length || a.length || 1;
+  return m && r.length === 0 ? /* @__PURE__ */ t("tbody", {
+    className: l.tbody,
+    children: /* @__PURE__ */ t(g, {
+      colSpan: f,
+      rowHeight: c
+    })
+  }) : r.length === 0 ? null : /* @__PURE__ */ t("tbody", {
+    className: l.tbody,
+    children: d ? /* @__PURE__ */ t(s, {
+      items: r,
+      strategy: h,
+      children: /* @__PURE__ */ t(i, {
+        table: e,
+        styledTableProps: o,
+        columnWindow: n
+      })
+    }) : /* @__PURE__ */ t(i, {
+      table: e,
+      styledTableProps: o,
+      columnWindow: n
+    })
+  });
+}
+export {
+  x as TableBody
+};

package/dist/table/components/TableRow.js

@@ -0,0 +1,160 @@
+import { ACTIONS_COLUMN_ID as U } from "../types.js";
+import { useRootContext as se } from "../context/RootContext.js";
+import n from "./StyledTable.module.js";
+import W from "clsx";
+import { Fragment as ae, useCallback as de, useEffect as ce, useMemo as g } from "react";
+import { Fragment as re, jsx as l, jsxs as p } from "react/jsx-runtime";
+import { compact as me } from "lodash-es";
+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({
+    id: t.original.id,
+    disabled: !v || w
+  }), Z = {
+    transform: fe.Transform.toString(J),
+    transition: Q,
+    opacity: A ? 0.8 : 1,
+    zIndex: A ? 1 : 0,
+    position: "relative"
+  }, { isResizing: ee, disableResizingFlag: te } = se();
+  ce(() => {
+    K && 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);
+  }, 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) => ({
+    ...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 ? me(F.map((e) => T[e])) : T, D = de((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;
+    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"]),
+      style: {
+        left: d ? e.left : void 0,
+        right: c ? e.right + (L ? -1 : 0) : void 0
+      },
+      children: /* @__PURE__ */ p("div", {
+        style: {
+          display: "flex",
+          alignItems: "center",
+          minWidth: k ? 32 : void 0,
+          position: "relative"
+        },
+        children: [k && b && /* @__PURE__ */ l("span", {
+          style: {
+            display: "inline-flex",
+            alignItems: "center",
+            position: "absolute",
+            left: 0,
+            top: "50%",
+            transform: "translateY(-50%)"
+          },
+          children: /* @__PURE__ */ l(he, {})
+        }), /* @__PURE__ */ l("span", {
+          style: {
+            marginLeft: k && S ? 30 : 0,
+            width: "100%"
+          },
+          children: ue(e.column.columnDef.cell, e.getContext())
+        })]
+      })
+    }, e.id);
+  }, [
+    b,
+    C,
+    s,
+    R,
+    L,
+    M,
+    m,
+    a,
+    t,
+    h,
+    S,
+    N
+  ]);
+  return /* @__PURE__ */ p(ae, { children: [/* @__PURE__ */ p("tr", {
+    "aria-selected": t.getIsSelected() || t.isFocused() ? "true" : "false",
+    tabIndex: t.isFocused() ? 0 : -1,
+    "data-index": H,
+    "data-test": t.id,
+    id: t.id,
+    className: W(n["t-row"], O && n["is-loading"], s?.(t)),
+    style: {
+      height: y ? `${y}px` : "inherit",
+      ...v && Z
+    },
+    ref: w ? void 0 : X,
+    onMouseUp: ne,
+    onMouseDown: (e) => {
+      e.detail > 1 && !R && E && e.preventDefault();
+    },
+    onKeyDown: (e) => {
+      switch (e.key) {
+        case "Tab":
+        case "ArrowDown":
+          t.focusNextRow(), e.preventDefault();
+          break;
+        case "ArrowUp":
+          t.focusPrevRow(), e.preventDefault();
+          break;
+        case "Enter":
+          B(e);
+          break;
+      }
+    },
+    children: [
+      m.map((e, i) => D(e, i)),
+      u > 0 && /* @__PURE__ */ l("td", {
+        "aria-hidden": !0,
+        className: n["t-cell"],
+        style: {
+          width: String(u) + "px",
+          minWidth: String(u) + "px",
+          maxWidth: String(u) + "px",
+          padding: 0,
+          border: "none"
+        }
+      }),
+      z.map((e, i) => D(e, m.length + i)),
+      f > 0 && /* @__PURE__ */ l("td", {
+        "aria-hidden": !0,
+        className: n["t-cell"],
+        style: {
+          width: String(f) + "px",
+          minWidth: String(f) + "px",
+          maxWidth: String(f) + "px",
+          padding: 0,
+          border: "none"
+        }
+      }),
+      a.map((e, i) => D(e, m.length + z.length + i))
+    ]
+  }), t.getIsExpanded() && /* @__PURE__ */ l(re, { children: I && P?.({
+    rows: I.get(t.original.id.toString()) ?? [],
+    row: t.original
+  }) })] }, t.id);
+}
+var he = () => /* @__PURE__ */ p("svg", {
+  xmlns: "http://www.w3.org/2000/svg",
+  width: "20",
+  height: "20",
+  viewBox: "0 2 22 22",
+  style: { color: "var(--colors-gama-500)" },
+  children: [/* @__PURE__ */ l("title", { children: "Checkmark" }), /* @__PURE__ */ l("path", {
+    fill: "currentColor",
+    d: "M21 7L9 19l-5.5-5.5l1.41-1.41L9 16.17L19.59 5.59z"
+  })]
+});
+export {
+  ve as TableRow
+};

package/dist/table/components/TableRows.js

@@ -0,0 +1,13 @@
+import { TableRow as i } from "./TableRow.js";
+import { Fragment as m, jsx as t } from "react/jsx-runtime";
+function R({ styledTableProps: o, table: r, columnWindow: n }) {
+  return /* @__PURE__ */ t(m, { children: (o.hideFooter ? r.getExpandedRowModel().rows : r.getRowModel().rows).map((e, d) => /* @__PURE__ */ t(i, {
+    styledTableProps: o,
+    row: e,
+    index: d,
+    columnWindow: n
+  }, e.id)) });
+}
+export {
+  R as TableRows
+};

package/dist/table/components/TableSkeleton.js

@@ -0,0 +1,21 @@
+import a from "./TableSkeleton.module.js";
+import { Fragment as l } from "react";
+import { Skeleton as m } from "@mui/material";
+import { jsx as r } from "react/jsx-runtime";
+var p = (({ colSpan: o, rowHeight: t = 48 }) => /* @__PURE__ */ r(l, { children: Array.from({ length: 10 }).map((i, e) => /* @__PURE__ */ r("tr", { children: /* @__PURE__ */ r("td", {
+  colSpan: o,
+  height: t,
+  className: a["skeleton-row"],
+  children: /* @__PURE__ */ r(m, {
+    variant: "rectangular",
+    width: "100%",
+    height: 40,
+    sx: {
+      backgroundColor: "var(--colors-delta-50)",
+      borderRadius: "8px"
+    }
+  }, e)
+}) }, e)) }));
+export {
+  p as TableSkeleton
+};

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

@@ -0,0 +1,4 @@
+var e = { "skeleton-row": "_skeleton-row_5gbhw_1" };
+export {
+  e as default
+};

package/dist/table/components/columns/action-column/actionColumn.js

@@ -0,0 +1,31 @@
+import { ACTIONS_COLUMN_ID as m } from "../../../types.js";
+import { RowActionMenu as u } from "./components/RowActionMenu.js";
+import { HeaderActionMenu as d } from "./components/HeaderActionMenu.js";
+import { jsx as n, jsxs as f } from "react/jsx-runtime";
+function x(r) {
+  const { headerPin: i, actions: t, customActionsNode: o, rowHeight: a, customActionsColumnProps: s, rowActionsState: c, locale: l } = r;
+  return {
+    id: m,
+    enableHiding: !1,
+    enableSorting: !1,
+    accessorFn: (e) => e,
+    header: (e) => i ? /* @__PURE__ */ n(d, {
+      headerData: e,
+      locale: l
+    }) : null,
+    cell: (e) => t || o ? /* @__PURE__ */ f("div", {
+      className: "flex items-center justify-end gap-x-1",
+      style: { height: a ?? "auto" },
+      children: [o && /* @__PURE__ */ n("div", { children: o?.(e) }), t && /* @__PURE__ */ n(u, {
+        tableData: e,
+        actions: t,
+        rowActionsState: c
+      })]
+    }) : null,
+    size: 50,
+    ...s
+  };
+}
+export {
+  x as generateActionsColumn
+};

package/dist/table/components/columns/action-column/components/HeaderActionMenu.js

@@ -0,0 +1,139 @@
+import { INTERNAL_COLUMN_IDS as S } from "../../../../types.js";
+import { cn as D } from "../../../../helpers/cn.js";
+import { StyledCheckbox as N } from "../../../../shared-components/StyledCheckbox.js";
+import { StyledTooltip as T } from "../../../../shared-components/tooltip/index.js";
+import { useToggleMenuVisibility as A } from "../../../../hooks/useToggleMenuVisibility.hook.js";
+import { StyledButton as L } from "../../../../shared-components/button/StyledButton.js";
+import { PinIcon as _ } from "../../../../shared-components/PinIcon.js";
+import a from "./TableActions.module.js";
+import c from "./HeaderActionMenu.module.js";
+import { DotsHorizontalIcon as k } from "../../../../shared-components/DotsHorizontalIcon.js";
+import { useTranslations as H } from "../../../../hooks/useTranslations.js";
+import { Popover as I } from "@mui/material";
+import { jsx as i, jsxs as d } from "react/jsx-runtime";
+import { compact as O } from "lodash-es";
+import { DndContext as M, PointerSensor as R, closestCenter as V, useSensor as E, useSensors as P } from "@dnd-kit/core";
+import { restrictToParentElement as w, restrictToVerticalAxis as z } from "@dnd-kit/modifiers";
+import { SortableContext as W, arrayMove as j, useSortable as U, verticalListSortingStrategy as B } from "@dnd-kit/sortable";
+import { CSS as Y } from "@dnd-kit/utilities";
+function $({ id: n, disabled: m, children: f }) {
+  const { attributes: u, listeners: p, setNodeRef: h, transform: b, transition: l } = U({
+    id: n,
+    disabled: m
+  });
+  return /* @__PURE__ */ i("div", {
+    ref: h,
+    style: {
+      transform: Y.Transform.toString(b),
+      transition: l
+    },
+    children: f({
+      attributes: u,
+      listeners: p
+    })
+  });
+}
+function ce({ headerData: n, locale: m }) {
+  const { anchorEl: f, open: u, handleClose: p, handleOpen: h } = A(), b = n.table.getAllLeafColumns().some((e) => e.getCanHide() && !e.getIsVisible() && !S.includes(e.id)), l = n.table.getAllLeafColumns(), y = (e) => {
+    const { active: o, over: t } = e;
+    !o || !t || o.id === t.id || l.find((r) => r.id === t.id)?.columnDef.fixedLeft || l.find((r) => r.id === t.id)?.columnDef.fixedRight || n.table.setColumnOrder((r) => {
+      const s = O(r).length ? r : n.table.getAllLeafColumns().map((C) => C.id);
+      return j(s, s.indexOf(o.id), s.indexOf(t.id));
+    });
+  }, v = P(E(R, { activationConstraint: { distance: 8 } })), g = H(m), x = l.filter((e) => !S.includes(e.id) && !!e.columnDef.header);
+  return /* @__PURE__ */ d("div", {
+    className: a["actions-header-wrapper"],
+    children: [/* @__PURE__ */ d("button", {
+      type: "button",
+      className: a["actions-header"],
+      onClick: h,
+      children: [/* @__PURE__ */ i(_, { className: a["pin-icon"] }), b && /* @__PURE__ */ i("div", { className: a["pin-indicator"] })]
+    }), /* @__PURE__ */ d(I, {
+      anchorEl: f,
+      anchorOrigin: {
+        horizontal: "left",
+        vertical: "bottom"
+      },
+      open: u,
+      onClose: p,
+      sx: { "& .MuiPaper-root": {
+        maxHeight: "calc(7 * 36px)",
+        overflowY: "auto",
+        scrollbarWidth: "thin"
+      } },
+      children: [/* @__PURE__ */ i(M, {
+        modifiers: [z, w],
+        onDragEnd: y,
+        collisionDetection: (e) => V(e).filter((o) => {
+          const t = x.find((r) => r.id === o.id);
+          return !t?.columnDef.fixedLeft && !t?.columnDef.fixedRight;
+        }),
+        sensors: v,
+        children: /* @__PURE__ */ i(W, {
+          items: x.map((e) => e.id),
+          strategy: B,
+          children: x.map((e) => {
+            const o = !!e.columnDef.fixedLeft || !!e.columnDef.fixedRight, t = e.columnDef.enableHiding === !1, r = o || t ? /* @__PURE__ */ d("div", { children: [o && g.column_reorder, t && g.column_hidden] }) : null;
+            return /* @__PURE__ */ i($, {
+              id: e.id,
+              disabled: o,
+              children: ({ listeners: s, attributes: C }) => /* @__PURE__ */ i(T, {
+                title: r,
+                arrow: !0,
+                children: /* @__PURE__ */ d("button", {
+                  type: "button",
+                  onClick: () => {
+                    t || e.toggleVisibility(!e.getIsVisible());
+                  },
+                  className: c["table-action-item"],
+                  children: [
+                    /* @__PURE__ */ i(k, {
+                      width: 20,
+                      height: 20,
+                      ...C,
+                      ...s,
+                      style: {
+                        touchAction: "none",
+                        WebkitUserSelect: "none",
+                        userSelect: "none",
+                        WebkitTouchCallout: "none"
+                      },
+                      className: D(c["drag-icon"], o ? c["drag-icon--disabled"] : c["drag-icon--enabled"])
+                    }),
+                    /* @__PURE__ */ i("span", {
+                      className: "px-2",
+                      children: /* @__PURE__ */ i(N, {
+                        readOnly: t,
+                        dataTest: `${e.id}-column-visibility-checkbox`,
+                        size: "small",
+                        disableRipple: !0,
+                        checked: e.getIsVisible(),
+                        hideWrapper: !0
+                      })
+                    }),
+                    /* @__PURE__ */ i("span", {
+                      className: "font-roboto text-sm text-delta-700",
+                      children: e.columnDef.pinnedHeaderText ?? (typeof e.columnDef.header == "string" ? e.columnDef.header : e.id)
+                    })
+                  ]
+                })
+              })
+            }, e.id);
+          })
+        })
+      }), /* @__PURE__ */ i("div", {
+        className: "pb-2 pl-2",
+        children: /* @__PURE__ */ i(L, {
+          dataTest: "reset-order-button",
+          variant: "text",
+          size: "small",
+          onClick: () => n.table.resetColumnOrder(),
+          children: g.reset_order
+        })
+      })]
+    })]
+  });
+}
+export {
+  ce as HeaderActionMenu
+};

package/dist/table/components/columns/action-column/components/HeaderActionMenu.module.js

@@ -0,0 +1,9 @@
+var e = {
+  "table-action-item": "_table-action-item_ejh2p_1",
+  "drag-icon": "_drag-icon_ejh2p_18",
+  "drag-icon--disabled": "_drag-icon--disabled_ejh2p_23",
+  "drag-icon--enabled": "_drag-icon--enabled_ejh2p_28"
+};
+export {
+  e as default
+};