@tedi-design-system/react 18.0.0-rc.4 → 18.0.0-rc.5

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tedi-design-system/react",
-  "version": "18.0.0-rc.4",
+  "version": "18.0.0-rc.5",
   "type": "module",
   "sideEffects": false,
   "exports": {

package/src/tedi/components/buttons/button-group/button-group.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const o=require("react/jsx-runtime"),g=require("../../../../../external/classnames/index.cjs.js"),_=require("react"),n=require("../../base/icon/icon.cjs.js"),x=require("../button/button.cjs.js"),r=require("./button-group.module.scss.cjs.js"),L=require("../../../helpers/hooks/use-breakpoint.cjs.js"),C=require("../../../providers/label-provider/use-labels.cjs.js"),l=require("../../overlays/dropdown/dropdown.cjs.js"),b=k=>{const{getLabel:j}=C.useLabels(),{children:q,className:w,type:c="primary",onSelectionChange:i,stretch:v=!1,ariaLabel:I,size:f="default",enableMobileDropdown:A=!1,mobileBreakpoint:N="md",dropdownLabel:y=j("sidenav.submenu"),dropdownLabelMode:R="static"}=k,B=L.useBreakpoint(),D=L.isBreakpointBelow(B,N),m=_.Children.toArray(q).filter(e=>_.isValidElement(e)&&e.type===x.Button),s=m.find(e=>e.props.isActive),M=R==="static"?y:(s==null?void 0:s.props.children)??y,a=s==null?void 0:s.props.iconLeft,d=s==null?void 0:s.props.icon;return D&&A?o.jsxs(l.Dropdown,{width:"trigger",children:[o.jsx(l.Dropdown.Trigger,{children:o.jsxs(x.Button,{visualType:c,className:g.default(r.default["tedi-button-group__dropdown-trigger"],r.default[`tedi-button-group__dropdown-trigger--${c}`],w),noStyle:!0,fullWidth:!0,children:[a?o.jsx(n.Icon,{name:typeof a=="string"?a:a.name,color:"inherit"}):d?o.jsx(n.Icon,{name:typeof d=="string"?d:d.name,color:"inherit"}):o.jsx(n.Icon,{name:"menu",color:"inherit"}),M]})}),o.jsx(l.Dropdown.Content,{children:m.map((e,u)=>o.jsxs(l.Dropdown.Item,{index:u,active:e==null?void 0:e.props.isActive,disabled:e==null?void 0:e.props.disabled,onClick:t=>{var p,h;e.props.disabled||(t.type==="click"&&((h=(p=e.props).onClick)==null||h.call(p,t)),e.props.id&&(i==null||i(e.props.id)))},className:r.default["tedi-button-group__dropdown-item"],children:[e.props.iconLeft&&o.jsx(n.Icon,{name:typeof e.props.iconLeft=="string"?e.props.iconLeft:e.props.iconLeft.name,color:"inherit"}),e.props.children,e.props.iconRight&&o.jsx(n.Icon,{name:typeof e.props.iconRight=="string"?e.props.iconRight:e.props.iconRight.name,color:"inherit"}),e.props.isActive&&o.jsx("span",{className:"sr-only",children:j("button-group.selected")})]},e.props.id||u))})]}):o.jsx("div",{className:g.default(r.default["tedi-button-group"],r.default[`tedi-button-group--${c}`],{[r.default["tedi-button-group--stretch"]]:v},w),role:"group","aria-label":I,children:m.map(e=>_.cloneElement(e,{className:g.default(r.default["tedi-button-group__item"],{[r.default["tedi-button-group__item--active"]]:e.props.isActive,[r.default["tedi-button-group__item--disabled"]]:e.props.disabled,[r.default[`tedi-button-group__item--size-${f}`]]:f},e.props.className),size:f,"aria-pressed":!!e.props.isActive,onClick:u=>{var t,p;(p=(t=e.props).onClick)==null||p.call(t,u),e.props.id&&(i==null||i(e.props.id))}}))})};exports.ButtonGroup=b;exports.default=b;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const o=require("react/jsx-runtime"),g=require("../../../../../external/classnames/index.cjs.js"),_=require("react"),n=require("../../base/icon/icon.cjs.js"),x=require("../button/button.cjs.js"),r=require("./button-group.module.scss.cjs.js"),C=require("../../../providers/label-provider/use-labels.cjs.js"),L=require("../../../helpers/hooks/use-breakpoint.cjs.js"),l=require("../../overlays/dropdown/dropdown.cjs.js"),b=k=>{const{getLabel:j}=C.useLabels(),{children:q,className:w,type:c="primary",onSelectionChange:i,stretch:v=!1,ariaLabel:I,size:f="default",enableMobileDropdown:A=!1,mobileBreakpoint:N="md",dropdownLabel:y=j("sidenav.submenu"),dropdownLabelMode:R="static"}=k,B=L.useBreakpoint(),D=L.isBreakpointBelow(B,N),m=_.Children.toArray(q).filter(e=>_.isValidElement(e)&&e.type===x.Button),s=m.find(e=>e.props.isActive),M=R==="static"?y:(s==null?void 0:s.props.children)??y,a=s==null?void 0:s.props.iconLeft,d=s==null?void 0:s.props.icon;return D&&A?o.jsxs(l.Dropdown,{width:"trigger",children:[o.jsx(l.Dropdown.Trigger,{children:o.jsxs(x.Button,{visualType:c,className:g.default(r.default["tedi-button-group__dropdown-trigger"],r.default[`tedi-button-group__dropdown-trigger--${c}`],w),noStyle:!0,fullWidth:!0,children:[a?o.jsx(n.Icon,{name:typeof a=="string"?a:a.name,color:"inherit"}):d?o.jsx(n.Icon,{name:typeof d=="string"?d:d.name,color:"inherit"}):o.jsx(n.Icon,{name:"menu",color:"inherit"}),M]})}),o.jsx(l.Dropdown.Content,{children:m.map((e,u)=>o.jsxs(l.Dropdown.Item,{index:u,active:e==null?void 0:e.props.isActive,disabled:e==null?void 0:e.props.disabled,onClick:t=>{var p,h;e.props.disabled||(t.type==="click"&&((h=(p=e.props).onClick)==null||h.call(p,t)),e.props.id&&(i==null||i(e.props.id)))},className:r.default["tedi-button-group__dropdown-item"],children:[e.props.iconLeft&&o.jsx(n.Icon,{name:typeof e.props.iconLeft=="string"?e.props.iconLeft:e.props.iconLeft.name,color:"inherit"}),e.props.children,e.props.iconRight&&o.jsx(n.Icon,{name:typeof e.props.iconRight=="string"?e.props.iconRight:e.props.iconRight.name,color:"inherit"}),e.props.isActive&&o.jsx("span",{className:"sr-only",children:j("button-group.selected")})]},e.props.id||u))})]}):o.jsx("div",{className:g.default(r.default["tedi-button-group"],r.default[`tedi-button-group--${c}`],{[r.default["tedi-button-group--stretch"]]:v},w),role:"group","aria-label":I,children:m.map(e=>_.cloneElement(e,{className:g.default(r.default["tedi-button-group__item"],{[r.default["tedi-button-group__item--active"]]:e.props.isActive,[r.default["tedi-button-group__item--disabled"]]:e.props.disabled,[r.default[`tedi-button-group__item--size-${f}`]]:f},e.props.className),size:f,"aria-pressed":!!e.props.isActive,onClick:u=>{var t,p;(p=(t=e.props).onClick)==null||p.call(t,u),e.props.id&&(i==null||i(e.props.id))}}))})};exports.ButtonGroup=b;exports.default=b;

package/src/tedi/components/buttons/button-group/button-group.es.js

@@ -4,11 +4,11 @@ import { Children as x, isValidElement as z, cloneElement as B } from "react";
 import { Icon as a } from "../../base/icon/icon.es.js";
 import { Button as k } from "../button/button.es.js";
 import r from "./button-group.module.scss.es.js";
-import { useBreakpoint as D, isBreakpointBelow as E } from "../../../helpers/hooks/use-breakpoint.es.js";
-import { useLabels as T } from "../../../providers/label-provider/use-labels.es.js";
+import { useLabels as D } from "../../../providers/label-provider/use-labels.es.js";
+import { useBreakpoint as E, isBreakpointBelow as T } from "../../../helpers/hooks/use-breakpoint.es.js";
 import { Dropdown as d } from "../../overlays/dropdown/dropdown.es.js";
 const P = (N) => {
-  const { getLabel: _ } = T(), {
+  const { getLabel: _ } = D(), {
     children: v,
     className: h,
     type: m = "primary",
@@ -20,7 +20,7 @@ const P = (N) => {
     mobileBreakpoint: R = "md",
     dropdownLabel: L = _("sidenav.submenu"),
     dropdownLabelMode: C = "static"
-  } = N, M = D(), $ = E(M, R), f = x.toArray(v).filter(
+  } = N, M = E(), $ = T(M, R), f = x.toArray(v).filter(
     (o) => z(o) && o.type === k
   ), e = f.find((o) => o.props.isActive), j = C === "static" ? L : (e == null ? void 0 : e.props.children) ?? L, n = e == null ? void 0 : e.props.iconLeft, l = e == null ? void 0 : e.props.icon;
   return $ && I ? /* @__PURE__ */ g(d, { width: "trigger", children: [

package/src/tedi/components/buttons/collapse/collapse.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("react/jsx-runtime"),n=require("../../../../../external/classnames/index.cjs.js"),_=require("react"),F=require("../../../../../external/react-animate-height/dist/esm/index.cjs.js"),G=require("../../../providers/printing-provider/printing-provider.cjs.js"),H=require("../../base/icon/icon.cjs.js"),J=require("../../base/typography/text/text.cjs.js"),Q=require("../../misc/print/print.cjs.js"),e=require("./collapse.module.scss.cjs.js"),U=require("../../../helpers/hooks/use-breakpoint-props.cjs.js"),V=require("../../../providers/label-provider/use-labels.cjs.js"),C=require("../../layout/grid/row.cjs.js"),o=require("../../layout/grid/col.cjs.js"),I=x=>{const{getCurrentBreakpointProps:N}=U.useBreakpointProps(x.defaultServerBreakpoint),{getLabel:h}=V.useLabels(),{id:r,children:w,className:P,openText:j=h("open"),closeText:g=h("close"),hideCollapseText:k=!1,title:d,titleRowProps:O,defaultOpen:$,open:c,onToggle:u,arrowType:s="default",size:i="default",underline:S=!0,toggleLabel:y,iconOnly:B=!1,inverted:M=!1,...R}=N(x),p=`${r}__trigger`,f=`${r}__content`,T=`${r}__animate`,[b,L]=_.useState(()=>$),m=G.usePrint(),a=_.useMemo(()=>m||(c!==void 0?c:b),[m,c,b]),D=B===!0&&!d,z=M&&s!=="secondary",E=n.default(e.default["tedi-collapse"],i==="small"&&e.default["tedi-collapse--small"],a&&e.default["tedi-collapse--is-open"],D&&e.default["tedi-collapse--icon-only"],z&&e.default["tedi-collapse--inverted"],e.default[`tedi-collapse--arrow-${s}`],P),v=()=>{const l=!a;L(l),u==null||u(l)},K=l=>{(l.key==="Enter"||l.key===" ")&&!l.repeat&&(l.preventDefault(),v())},A=y||(a?g:j),q=_.useMemo(()=>t.jsx("div",{id:f,role:"region","aria-labelledby":p,className:e.default["tedi-collapse__content"],children:w}),[w,f,p]);return t.jsxs("div",{"data-name":"collapse",...R,className:E,children:[t.jsx("button",{id:p,type:"button","data-name":"collapse-trigger",className:e.default["tedi-collapse__title"],"aria-label":A,"aria-expanded":a,"aria-controls":f,onKeyDown:K,onClick:v,children:t.jsxs(C.Row,{justifyContent:"between",alignItems:"center",wrap:"nowrap",...O,element:"span",children:[d&&t.jsx(o.Col,{"aria-hidden":"true",children:d}),t.jsx(o.Col,{width:"auto",children:t.jsxs(C.Row,{element:"span",alignItems:"center",gutter:0,wrap:"nowrap",children:[t.jsx(Q.Print,{visibility:"hide",children:t.jsx(o.Col,{width:"auto",className:n.default({"visually-hidden":k}),children:t.jsx(J.Text,{element:"span",className:n.default(e.default["tedi-collapse__text"],{[e.default["tedi-collapse__text--underline"]]:S}),children:a?g:j})})}),t.jsx(o.Col,{width:"auto",children:t.jsx("div",{className:n.default(e.default["tedi-collapse__icon-wrapper"],e.default[`tedi-collapse__icon-wrapper--${s}`],i==="small"&&e.default["tedi-collapse__icon-wrapper--small"]),children:t.jsx(H.Icon,{className:n.default(e.default["tedi-collapse__icon"],e.default[`tedi-collapse__icon--${s}`],i==="small"&&e.default["tedi-collapse__icon--small"]),name:"expand_more",size:i==="small"||s==="secondary"?18:24})})})]})})]})}),m?q:t.jsx(F.default,{id:T,duration:300,height:a?"auto":0,"data-testid":"collapse-inner",children:q})]})};exports.Collapse=I;exports.default=I;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("react/jsx-runtime"),n=require("../../../../../external/classnames/index.cjs.js"),_=require("react"),H=require("../../../../../external/react-animate-height/dist/esm/index.cjs.js"),J=require("../../../providers/printing-provider/printing-provider.cjs.js"),Q=require("../../base/icon/icon.cjs.js"),U=require("../../base/typography/text/text.cjs.js"),V=require("../../misc/print/print.cjs.js"),e=require("./collapse.module.scss.cjs.js"),W=require("../../../helpers/hooks/use-breakpoint-props.cjs.js"),X=require("../../../providers/label-provider/use-labels.cjs.js"),N=require("../../layout/grid/row.cjs.js"),i=require("../../layout/grid/col.cjs.js"),P=x=>{const{getCurrentBreakpointProps:k}=W.useBreakpointProps(x.defaultServerBreakpoint),{getLabel:h}=X.useLabels(),{id:r,children:w,className:O,openText:j=h("open"),closeText:y=h("close"),hideCollapseText:$=!1,title:d,titleRowProps:S,defaultOpen:B,open:c,onToggle:u,arrowType:s="default",size:o="default",underline:M=!0,toggleLabel:g,iconOnly:R=!1,controlsId:v,inverted:T=!1,...L}=k(x),b=v!==void 0,p=`${r}__trigger`,f=`${r}__content`,D=`${r}__animate`,[C,E]=_.useState(()=>B),m=J.usePrint(),a=_.useMemo(()=>m||(c!==void 0?c:C),[m,c,C]),z=R===!0&&!d,K=T&&s!=="secondary",A=n.default(e.default["tedi-collapse"],o==="small"&&e.default["tedi-collapse--small"],a&&e.default["tedi-collapse--is-open"],z&&e.default["tedi-collapse--icon-only"],K&&e.default["tedi-collapse--inverted"],e.default[`tedi-collapse--arrow-${s}`],O),q=()=>{const l=!a;E(l),u==null||u(l)},F=l=>{(l.key==="Enter"||l.key===" ")&&!l.repeat&&(l.preventDefault(),q())},G=g||(a?y:j),I=_.useMemo(()=>t.jsx("div",{id:f,role:"region","aria-labelledby":p,className:e.default["tedi-collapse__content"],children:w}),[w,f,p]);return t.jsxs("div",{"data-name":"collapse",...L,className:A,children:[t.jsx("button",{id:p,type:"button","data-name":"collapse-trigger",className:e.default["tedi-collapse__title"],"aria-label":G,"aria-expanded":a,"aria-controls":b?v:f,onKeyDown:F,onClick:q,children:t.jsxs(N.Row,{justifyContent:"between",alignItems:"center",wrap:"nowrap",...S,element:"span",children:[d&&t.jsx(i.Col,{"aria-hidden":"true",children:d}),t.jsx(i.Col,{width:"auto",children:t.jsxs(N.Row,{element:"span",alignItems:"center",gutter:0,wrap:"nowrap",children:[t.jsx(V.Print,{visibility:"hide",children:t.jsx(i.Col,{width:"auto",className:n.default({"visually-hidden":$}),children:t.jsx(U.Text,{element:"span",className:n.default(e.default["tedi-collapse__text"],{[e.default["tedi-collapse__text--underline"]]:M}),children:a?y:j})})}),t.jsx(i.Col,{width:"auto",children:t.jsx("div",{className:n.default(e.default["tedi-collapse__icon-wrapper"],e.default[`tedi-collapse__icon-wrapper--${s}`],o==="small"&&e.default["tedi-collapse__icon-wrapper--small"]),children:t.jsx(Q.Icon,{className:n.default(e.default["tedi-collapse__icon"],e.default[`tedi-collapse__icon--${s}`],o==="small"&&e.default["tedi-collapse__icon--small"]),name:"expand_more",size:o==="small"||s==="secondary"?18:24})})})]})})]})}),!b&&(m?I:t.jsx(H.default,{id:D,duration:300,height:a?"auto":0,"data-testid":"collapse-inner",children:I}))]})};exports.Collapse=P;exports.default=P;

package/src/tedi/components/buttons/collapse/collapse.d.ts

@@ -84,6 +84,21 @@ export interface CollapseProps extends BreakpointSupport<CollapseBreakpointProps
      * If provided, overrides the default open/close text for the accessible name.
      */
     toggleLabel?: string;
+    /**
+     * Use Collapse purely as a toggle trigger for content rendered elsewhere.
+     *
+     * When set, the toggle button's `aria-controls` points at the supplied id
+     * instead of Collapse's internal content panel, and the internal panel is
+     * **not rendered**. Useful when the disclosed region must live outside
+     * Collapse's DOM subtree (e.g. a table row whose details live in a
+     * sibling `<tr>`). The consumer is responsible for rendering the target
+     * element with the matching `id` and an appropriate `role` (typically
+     * `region`).
+     *
+     * When omitted (default), Collapse renders its own `children` inside a
+     * built-in `role="region"` panel.
+     */
+    controlsId?: string;
 }
 export declare const Collapse: (props: CollapseProps) => JSX.Element;
 export default Collapse;

package/src/tedi/components/buttons/collapse/collapse.es.js

@@ -1,57 +1,58 @@
 import { jsx as t, jsxs as f } from "react/jsx-runtime";
 import n from "../../../../../external/classnames/index.es.js";
 import h from "react";
-import q from "../../../../../external/react-animate-height/dist/esm/index.es.js";
-import { usePrint as F } from "../../../providers/printing-provider/printing-provider.es.js";
-import { Icon as G } from "../../base/icon/icon.es.js";
-import { Text as J } from "../../base/typography/text/text.es.js";
-import { Print as Q } from "../../misc/print/print.es.js";
+import G from "../../../../../external/react-animate-height/dist/esm/index.es.js";
+import { usePrint as J } from "../../../providers/printing-provider/printing-provider.es.js";
+import { Icon as Q } from "../../base/icon/icon.es.js";
+import { Text as U } from "../../base/typography/text/text.es.js";
+import { Print as V } from "../../misc/print/print.es.js";
 import e from "./collapse.module.scss.es.js";
-import { useBreakpointProps as U } from "../../../helpers/hooks/use-breakpoint-props.es.js";
-import { useLabels as V } from "../../../providers/label-provider/use-labels.es.js";
-import { Row as k } from "../../layout/grid/row.es.js";
+import { useBreakpointProps as W } from "../../../helpers/hooks/use-breakpoint-props.es.js";
+import { useLabels as X } from "../../../providers/label-provider/use-labels.es.js";
+import { Row as P } from "../../layout/grid/row.es.js";
 import { Col as s } from "../../layout/grid/col.es.js";
-const ce = (w) => {
-  const { getCurrentBreakpointProps: O } = U(w.defaultServerBreakpoint), { getLabel: y } = V(), {
+const pe = (w) => {
+  const { getCurrentBreakpointProps: $ } = W(w.defaultServerBreakpoint), { getLabel: y } = X(), {
     id: r,
     children: g,
-    className: P,
-    openText: b = y("open"),
-    closeText: v = y("close"),
-    hideCollapseText: $ = !1,
+    className: B,
+    openText: v = y("open"),
+    closeText: x = y("close"),
+    hideCollapseText: S = !1,
     title: c,
-    titleRowProps: B,
-    defaultOpen: S,
+    titleRowProps: T,
+    defaultOpen: j,
     open: d,
     onToggle: p,
-    arrowType: o = "default",
+    arrowType: a = "default",
     size: i = "default",
-    underline: T = !0,
-    toggleLabel: x,
-    iconOnly: j = !1,
-    inverted: D = !1,
-    ...L
-  } = O(w), m = `${r}__trigger`, u = `${r}__content`, M = `${r}__animate`, [N, R] = h.useState(() => S), _ = F(), a = h.useMemo(
+    underline: D = !0,
+    toggleLabel: b,
+    iconOnly: E = !1,
+    controlsId: C,
+    inverted: L = !1,
+    ...M
+  } = $(w), I = C !== void 0, m = `${r}__trigger`, u = `${r}__content`, R = `${r}__animate`, [N, z] = h.useState(() => j), _ = J(), o = h.useMemo(
     () => _ || (d !== void 0 ? d : N),
     [_, d, N]
-  ), z = j === !0 && !c, E = D && o !== "secondary", K = n(
+  ), K = E === !0 && !c, A = L && a !== "secondary", H = n(
     e["tedi-collapse"],
     i === "small" && e["tedi-collapse--small"],
-    a && e["tedi-collapse--is-open"],
-    z && e["tedi-collapse--icon-only"],
-    E && e["tedi-collapse--inverted"],
-    e[`tedi-collapse--arrow-${o}`],
-    P
-  ), C = () => {
-    const l = !a;
-    R(l), p == null || p(l);
-  }, A = (l) => {
-    (l.key === "Enter" || l.key === " ") && !l.repeat && (l.preventDefault(), C());
-  }, H = x || (a ? v : b), I = h.useMemo(
+    o && e["tedi-collapse--is-open"],
+    K && e["tedi-collapse--icon-only"],
+    A && e["tedi-collapse--inverted"],
+    e[`tedi-collapse--arrow-${a}`],
+    B
+  ), k = () => {
+    const l = !o;
+    z(l), p == null || p(l);
+  }, q = (l) => {
+    (l.key === "Enter" || l.key === " ") && !l.repeat && (l.preventDefault(), k());
+  }, F = b || (o ? x : v), O = h.useMemo(
     () => /* @__PURE__ */ t("div", { id: u, role: "region", "aria-labelledby": m, className: e["tedi-collapse__content"], children: g }),
     [g, u, m]
   );
-  return /* @__PURE__ */ f("div", { "data-name": "collapse", ...L, className: K, children: [
+  return /* @__PURE__ */ f("div", { "data-name": "collapse", ...M, className: H, children: [
     /* @__PURE__ */ t(
       "button",
       {
@@ -59,22 +60,22 @@ const ce = (w) => {
         type: "button",
         "data-name": "collapse-trigger",
         className: e["tedi-collapse__title"],
-        "aria-label": H,
-        "aria-expanded": a,
-        "aria-controls": u,
-        onKeyDown: A,
-        onClick: C,
-        children: /* @__PURE__ */ f(k, { justifyContent: "between", alignItems: "center", wrap: "nowrap", ...B, element: "span", children: [
+        "aria-label": F,
+        "aria-expanded": o,
+        "aria-controls": I ? C : u,
+        onKeyDown: q,
+        onClick: k,
+        children: /* @__PURE__ */ f(P, { justifyContent: "between", alignItems: "center", wrap: "nowrap", ...T, element: "span", children: [
           c && /* @__PURE__ */ t(s, { "aria-hidden": "true", children: c }),
-          /* @__PURE__ */ t(s, { width: "auto", children: /* @__PURE__ */ f(k, { element: "span", alignItems: "center", gutter: 0, wrap: "nowrap", children: [
-            /* @__PURE__ */ t(Q, { visibility: "hide", children: /* @__PURE__ */ t(s, { width: "auto", className: n({ "visually-hidden": $ }), children: /* @__PURE__ */ t(
-              J,
+          /* @__PURE__ */ t(s, { width: "auto", children: /* @__PURE__ */ f(P, { element: "span", alignItems: "center", gutter: 0, wrap: "nowrap", children: [
+            /* @__PURE__ */ t(V, { visibility: "hide", children: /* @__PURE__ */ t(s, { width: "auto", className: n({ "visually-hidden": S }), children: /* @__PURE__ */ t(
+              U,
               {
                 element: "span",
                 className: n(e["tedi-collapse__text"], {
-                  [e["tedi-collapse__text--underline"]]: T
+                  [e["tedi-collapse__text--underline"]]: D
                 }),
-                children: a ? v : b
+                children: o ? x : v
               }
             ) }) }),
             /* @__PURE__ */ t(s, { width: "auto", children: /* @__PURE__ */ t(
@@ -82,19 +83,19 @@ const ce = (w) => {
               {
                 className: n(
                   e["tedi-collapse__icon-wrapper"],
-                  e[`tedi-collapse__icon-wrapper--${o}`],
+                  e[`tedi-collapse__icon-wrapper--${a}`],
                   i === "small" && e["tedi-collapse__icon-wrapper--small"]
                 ),
                 children: /* @__PURE__ */ t(
-                  G,
+                  Q,
                   {
                     className: n(
                       e["tedi-collapse__icon"],
-                      e[`tedi-collapse__icon--${o}`],
+                      e[`tedi-collapse__icon--${a}`],
                       i === "small" && e["tedi-collapse__icon--small"]
                     ),
                     name: "expand_more",
-                    size: i === "small" || o === "secondary" ? 18 : 24
+                    size: i === "small" || a === "secondary" ? 18 : 24
                   }
                 )
               }
@@ -103,10 +104,10 @@ const ce = (w) => {
         ] })
       }
     ),
-    _ ? I : /* @__PURE__ */ t(q, { id: M, duration: 300, height: a ? "auto" : 0, "data-testid": "collapse-inner", children: I })
+    !I && (_ ? O : /* @__PURE__ */ t(G, { id: R, duration: 300, height: o ? "auto" : 0, "data-testid": "collapse-inner", children: O }))
   ] });
 };
 export {
-  ce as Collapse,
-  ce as default
+  pe as Collapse,
+  pe as default
 };

package/src/tedi/components/content/table/index.d.ts

@@ -0,0 +1,6 @@
+export * from './table';
+export * from './table-context';
+export * from './use-table-persistence';
+export * from './table-columns-menu/table-columns-menu';
+export * from './table-header-button/table-header-button';
+export * from './table-toolbar/table-toolbar';

package/src/tedi/components/content/table/table-columns-menu/table-columns-menu.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),x=require("../../../buttons/button/button.cjs.js"),m=require("../../../form/checkbox/checkbox.cjs.js"),j=require("../../../overlays/dropdown/dropdown.cjs.js"),q=require("../../../overlays/dropdown/dropdown-content/dropdown-content.cjs.js"),T=require("../../../overlays/dropdown/dropdown-item/dropdown-item.cjs.js"),f=require("../../../overlays/dropdown/dropdown-trigger/dropdown-trigger.cjs.js"),w=require("../table-context.cjs.js"),L=require("../../../../providers/label-provider/use-labels.cjs.js"),r=({triggerLabel:i,className:l})=>{const{table:d,id:c}=w.useTableContext(),{getLabel:a}=L.useLabels(),u=i??a("table.columns"),o=d.getAllLeafColumns().filter(e=>e.getCanHide()),b=o.filter(e=>e.getIsVisible()).length,g=e=>{const n=e.columnDef.header;return typeof n=="string"?n:e.id};return t.jsxs(j.Dropdown,{placement:"bottom-end",children:[t.jsx(f.DropdownTrigger,{children:t.jsx(x.Button,{type:"button",visualType:"neutral",iconLeft:"tune",className:l,children:u})}),t.jsx(q.DropdownContent,{children:o.map(e=>{const n=e.getIsVisible(),h=n&&b===1,s=`${c}-columns-menu-${e.id}`,p=g(e);return t.jsx(T.DropdownItem,{asChild:!0,closeOnSelect:!1,children:t.jsx("div",{onClick:C=>C.stopPropagation(),children:t.jsx(m.Checkbox,{id:s,name:s,label:p,value:e.id,checked:n,disabled:h,onChange:()=>e.toggleVisibility()})})},e.id)})})]})};r.displayName="Table.ColumnsMenu";exports.TableColumnsMenu=r;

package/src/tedi/components/content/table/table-columns-menu/table-columns-menu.d.ts

@@ -0,0 +1,15 @@
+export interface TableColumnsMenuProps {
+    /**
+     * Trigger label. Falls back to the localised `table.columns` label from
+     * `LabelProvider` when not provided.
+     */
+    triggerLabel?: React.ReactNode;
+    /**
+     * Additional class name on the dropdown trigger button.
+     */
+    className?: string;
+}
+export declare const TableColumnsMenu: {
+    ({ triggerLabel, className }: TableColumnsMenuProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};

package/src/tedi/components/content/table/table-columns-menu/table-columns-menu.es.js

@@ -0,0 +1,37 @@
+import { jsxs as h, jsx as t } from "react/jsx-runtime";
+import { Button as g } from "../../../buttons/button/button.es.js";
+import { Checkbox as C } from "../../../form/checkbox/checkbox.es.js";
+import { Dropdown as L } from "../../../overlays/dropdown/dropdown.es.js";
+import { DropdownContent as v } from "../../../overlays/dropdown/dropdown-content/dropdown-content.es.js";
+import { DropdownItem as x } from "../../../overlays/dropdown/dropdown-item/dropdown-item.es.js";
+import { DropdownTrigger as T } from "../../../overlays/dropdown/dropdown-trigger/dropdown-trigger.es.js";
+import { useTableContext as y } from "../table-context.es.js";
+import { useLabels as D } from "../../../../providers/label-provider/use-labels.es.js";
+const V = ({ triggerLabel: n, className: s }) => {
+  const { table: l, id: a } = y(), { getLabel: d } = D(), m = n ?? d("table.columns"), i = l.getAllLeafColumns().filter((e) => e.getCanHide()), c = i.filter((e) => e.getIsVisible()).length, b = (e) => {
+    const o = e.columnDef.header;
+    return typeof o == "string" ? o : e.id;
+  };
+  return /* @__PURE__ */ h(L, { placement: "bottom-end", children: [
+    /* @__PURE__ */ t(T, { children: /* @__PURE__ */ t(g, { type: "button", visualType: "neutral", iconLeft: "tune", className: s, children: m }) }),
+    /* @__PURE__ */ t(v, { children: i.map((e) => {
+      const o = e.getIsVisible(), p = o && c === 1, r = `${a}-columns-menu-${e.id}`, u = b(e);
+      return /* @__PURE__ */ t(x, { asChild: !0, closeOnSelect: !1, children: /* @__PURE__ */ t("div", { onClick: (f) => f.stopPropagation(), children: /* @__PURE__ */ t(
+        C,
+        {
+          id: r,
+          name: r,
+          label: u,
+          value: e.id,
+          checked: o,
+          disabled: p,
+          onChange: () => e.toggleVisibility()
+        }
+      ) }) }, e.id);
+    }) })
+  ] });
+};
+V.displayName = "Table.ColumnsMenu";
+export {
+  V as TableColumnsMenu
+};

package/src/tedi/components/content/table/table-context.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react"),n=t.createContext(null);function o(){const e=t.useContext(n);if(!e)throw new Error("TableContext missing — wrap the component in <Table>.");return e}exports.TableContext=n;exports.useTableContext=o;

package/src/tedi/components/content/table/table-context.d.ts

@@ -0,0 +1,3 @@
+import { TableContextValue } from './table';
+export declare const TableContext: import('react').Context<TableContextValue<unknown> | null>;
+export declare function useTableContext<TData = unknown>(): TableContextValue<TData>;

package/src/tedi/components/content/table/table-context.es.js

@@ -0,0 +1,11 @@
+import { createContext as e, useContext as n } from "react";
+const o = e(null);
+function x() {
+  const t = n(o);
+  if (!t) throw new Error("TableContext missing — wrap the component in <Table>.");
+  return t;
+}
+export {
+  o as TableContext,
+  x as useTableContext
+};

package/src/tedi/components/content/table/table-header-button/table-header-button.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("react/jsx-runtime"),m=require("../../../../../../external/classnames/index.cjs.js"),q=require("react"),h=require("../../../base/icon/icon.cjs.js"),a=require("./table-header-button.module.scss.cjs.js"),e=q.forwardRef(({icon:o,filled:r=!1,selected:u=!1,disabled:n,onClick:l,className:d,iconSize:s=18,type:i="button",children:c,...b},f)=>t.jsxs("button",{...b,ref:f,type:i,disabled:n,onClick:l,className:m.default(a.default["tedi-table-header-button"],{[a.default["tedi-table-header-button--selected"]]:u},d),children:[c,t.jsx(h.Icon,{name:o,filled:r,color:"inherit",size:s})]}));e.displayName="TableHeaderButton";exports.TableHeaderButton=e;exports.default=e;

package/src/tedi/components/content/table/table-header-button/table-header-button.d.ts

@@ -0,0 +1,51 @@
+import { default as React } from 'react';
+import { IconSize } from '../../../base/icon/icon';
+interface TableHeaderButtonBaseProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'children' | 'aria-label'> {
+    /**
+     * Material icon name rendered inside the button (e.g. `unfold_more`,
+     * `arrow_downward`, `filter_alt`).
+     */
+    icon: string;
+    /**
+     * Render the icon's "filled" variant. Pair with `selected` for a fully
+     * activated look (e.g. an applied filter).
+     * @default false
+     */
+    filled?: boolean;
+    /**
+     * When `true`, the icon paints in the brand colour to indicate an active
+     * sort or filter at rest. Hover / focus / active states are still applied
+     * on top.
+     * @default false
+     */
+    selected?: boolean;
+    /** Size of the icon, in pixels. @default 18 */
+    iconSize?: IconSize;
+}
+/**
+ * Accessibility-driven discriminated union enforcing WCAG SC 4.1.2 at compile
+ * time:
+ * - **Labelled** — `children` provide visible text (e.g. a sortable column
+ *   header), which is the accessible name, so `aria-label` is optional.
+ * - **Icon-only** — no `children` (e.g. a filter trigger), so the button has
+ *   nothing to announce; `aria-label` is required.
+ */
+type TableHeaderButtonLabelProps = {
+    /**
+     * Label rendered before the icon — the whole "text + icon" area becomes
+     * one clickable button (matching the Angular implementation).
+     */
+    children: React.ReactNode;
+    /** Optional accessible name; the visible `children` already provide one. */
+    'aria-label'?: string;
+} | {
+    children?: undefined;
+    /**
+     * Required accessible name — icon-only buttons have no visible text for
+     * screen readers to announce.
+     */
+    'aria-label': string;
+};
+export type TableHeaderButtonProps = TableHeaderButtonBaseProps & TableHeaderButtonLabelProps;
+export declare const TableHeaderButton: React.ForwardRefExoticComponent<TableHeaderButtonProps & React.RefAttributes<HTMLButtonElement>>;
+export default TableHeaderButton;

package/src/tedi/components/content/table/table-header-button/table-header-button.es.js

@@ -0,0 +1,42 @@
+import { jsxs as b, jsx as c } from "react/jsx-runtime";
+import p from "../../../../../../external/classnames/index.es.js";
+import { forwardRef as u } from "react";
+import { Icon as h } from "../../../base/icon/icon.es.js";
+import e from "./table-header-button.module.scss.es.js";
+const x = u(
+  ({
+    icon: t,
+    filled: o = !1,
+    selected: a = !1,
+    disabled: r,
+    onClick: s,
+    className: l,
+    iconSize: m = 18,
+    type: i = "button",
+    children: d,
+    ...n
+  }, f) => /* @__PURE__ */ b(
+    "button",
+    {
+      ...n,
+      ref: f,
+      type: i,
+      disabled: r,
+      onClick: s,
+      className: p(
+        e["tedi-table-header-button"],
+        { [e["tedi-table-header-button--selected"]]: a },
+        l
+      ),
+      children: [
+        d,
+        /* @__PURE__ */ c(h, { name: t, filled: o, color: "inherit", size: m })
+      ]
+    }
+  )
+);
+x.displayName = "TableHeaderButton";
+export {
+  x as TableHeaderButton,
+  x as default
+};

package/src/tedi/components/content/table/table-header-button/table-header-button.module.scss.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e={"tedi-table-header-button":"tedi-table-header-button-b43c480a","tedi-table-header-button--selected":"tedi-table-header-button--selected-f428ec59"};exports.default=e;

package/src/tedi/components/content/table/table-header-button/table-header-button.module.scss.es.js

@@ -0,0 +1,7 @@
+const e = {
+  "tedi-table-header-button": "tedi-table-header-button-b43c480a",
+  "tedi-table-header-button--selected": "tedi-table-header-button--selected-f428ec59"
+};
+export {
+  e as default
+};

package/src/tedi/components/content/table/table-toolbar/table-toolbar.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("react/jsx-runtime"),o=require("../../../../../../external/classnames/index.cjs.js"),r=require("../table.module.scss.cjs.js"),e=({children:l,className:a})=>t.jsx("div",{className:o.default(r.default["tedi-table__toolbar"],a),children:l});e.displayName="Table.Toolbar";exports.TableToolbar=e;exports.default=e;

package/src/tedi/components/content/table/table-toolbar/table-toolbar.d.ts

@@ -0,0 +1,21 @@
+import { default as React } from 'react';
+export interface TableToolbarProps {
+    /**
+     * Toolbar contents — typically Table sub-components like
+     * `<Table.ColumnsMenu />`, but any node is allowed.
+     */
+    children?: React.ReactNode;
+    /**
+     * Additional class name on the toolbar wrapper.
+     */
+    className?: string;
+}
+/**
+ * Optional slot rendered above the `<table>`. Hosts controls like
+ * `<Table.ColumnsMenu />`. Nothing clever — it just provides consistent spacing.
+ */
+export declare const TableToolbar: {
+    ({ children, className }: TableToolbarProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export default TableToolbar;

package/src/tedi/components/content/table/table-toolbar/table-toolbar.es.js

@@ -0,0 +1,9 @@
+import { jsx as l } from "react/jsx-runtime";
+import s from "../../../../../../external/classnames/index.es.js";
+import e from "../table.module.scss.es.js";
+const r = ({ children: a, className: o }) => /* @__PURE__ */ l("div", { className: s(e["tedi-table__toolbar"], o), children: a });
+r.displayName = "Table.Toolbar";
+export {
+  r as TableToolbar,
+  r as default
+};

package/src/tedi/components/content/table/table.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const r=require("react/jsx-runtime"),ie=require("../../../../../external/@tanstack/react-table/build/lib/index.cjs.js"),I=require("../../../../../external/classnames/index.cjs.js"),i=require("react"),ft=require("../../base/icon/icon.cjs.js"),un=require("../../buttons/collapse/collapse.cjs.js"),gt=require("../../form/checkbox/checkbox.cjs.js"),gn=require("../../form/radio/radio.cjs.js"),fn=require("../../form/textfield/textfield.cjs.js"),o=require("./table.module.scss.cjs.js"),pn=require("./table-columns-menu/table-columns-menu.cjs.js"),mn=require("./table-context.cjs.js"),bn=require("./table-header-button/table-header-button.cjs.js"),hn=require("./table-toolbar/table-toolbar.cjs.js"),xn=require("./use-table-persistence.cjs.js"),wn=require("../../navigation/pagination/pagination.cjs.js"),Cn=require("../../../providers/label-provider/use-labels.cjs.js"),oe=require("../../../../../external/@tanstack/table-core/build/lib/index.cjs.js"),_n=(D,T)=>M=>{const v=M.index;if(v<0||v>=D.length)return 1;const N=T(D[v]);if(v>0&&T(D[v-1])===N)return 0;let E=1;for(let L=v+1;L<D.length&&T(D[L])===N;L++)E++;return E},pt="data-tedi-drag-handle",vn=({label:D,onHandlePointerDown:T,id:M,pickedUp:v,onKeyDown:N})=>r.jsx("button",{type:"button",id:M,className:I.default(o.default["tedi-table__drag-handle"],{[o.default["tedi-table__drag-handle--picked-up"]]:v}),"aria-label":D,"aria-pressed":v,onClick:E=>E.stopPropagation(),onMouseDown:T,onTouchStart:T,onKeyDown:N,[pt]:"",children:r.jsx(ft.Icon,{name:"drag_indicator",size:18,color:"inherit"})}),Sn=D=>{const{row:T,rowClassName:M,rowStyle:v,isActiveRow:N,clickable:E,onClick:L,onKeyDownHandler:_e,ariaRowIndex:ve,columnProps:Z,draggable:re,dragHandleLabel:se,dragHandlers:g,dragHandleId:Se,dragHandlePickedUp:Re,dragOverColumnId:de}=D;return r.jsx("tr",{className:M,style:v,draggable:re||void 0,onDragStart:g==null?void 0:g.onDragStart,onDragOver:g==null?void 0:g.onDragOver,onDragLeave:g==null?void 0:g.onDragLeave,onDragEnd:g==null?void 0:g.onDragEnd,onDrop:g==null?void 0:g.onDrop,onClick:E&&L?()=>L(T):void 0,onKeyDown:E?_e:void 0,tabIndex:E?0:void 0,role:E?"button":void 0,"aria-rowindex":ve,"aria-current":N?"true":void 0,children:T.getVisibleCells().map(O=>{var ce;const f=O.column.columnDef.meta,P=Z==null?void 0:Z(O.column.id),ee=re&&O.column.id===Ce,A=!!de&&O.column.id===de,B=(ce=f==null?void 0:f.rowSpan)==null?void 0:ce.call(f,O.row);return B===0?null:r.jsx("td",{rowSpan:B&&B>1?B:void 0,className:I.default(o.default["tedi-table__cell"],{[o.default[`tedi-table__cell--align-${f==null?void 0:f.align}`]]:f==null?void 0:f.align,[o.default[`tedi-table__cell--valign-${f==null?void 0:f.vAlign}`]]:f==null?void 0:f.vAlign,[o.default["tedi-table__cell--drag-handle"]]:ee,[o.default["tedi-table__cell--drag-over"]]:A},P==null?void 0:P.className),style:P==null?void 0:P.style,children:ee?r.jsx(vn,{label:se,onHandlePointerDown:(g==null?void 0:g.onHandlePointerDown)??(()=>{}),onKeyDown:g==null?void 0:g.onKeyDown,id:Se,pickedUp:Re}):ie.flexRender(O.column.columnDef.cell,O.getContext())},O.id)})})},Me="__select__",Be="__expand__",Ce="__drag__",ae=()=>!0,Rn={text:ae,select:ae,"multi-select":ae,"date-range":ae,"date-range-period":ae};function Dn(D){return Array.isArray(D.columns)}function mt(D){const{id:T,data:M,columns:v,size:N="medium",caption:E,state:L,defaultState:_e,onStateChange:ve,persist:Z,emptyState:re,emptyStateRole:se,className:g,children:Se,striped:Re=!1,verticalBorders:de=!1,borderless:O=!1,stickyFirstColumn:f=!1,stickyHeader:P=!1,maxHeight:ee,onRowClick:A,activeRowId:B,rowHover:ce,enableRowSelection:qe,selectionMode:De="multiple",highlightSelectedRows:ht=!0,enableColumnFilters:ye=!1,renderSubComponent:ue,getRowCanExpand:He,getSubRows:Ue,getRowId:xt,expandTrigger:ke="button",paginateExpandedRows:wt=!1,pagination:q,autoResetPageIndex:Ct=!0,manualPagination:U=!1,manualSorting:Ie=!1,manualFiltering:Te=!1,pageCount:Ke,rowCount:ge,checkboxProps:Ee,radioProps:Ve,collapseProps:Ge,rowProps:Ne,columnProps:H,reorderableRows:S=!1,onRowDrop:$,reorderableColumns:K=!1}=D,{getLabel:h}=Cn.useLabels(),We=re??h("table.no-data"),V=i.useRef(h);V.current=h;const _t=i.useId(),p=T??_t,x=i.useMemo(()=>q?q===!0?{pageSize:10,pageSizeOptions:[10,25,50],paginationProps:void 0}:{pageSize:q.pageSize??10,pageSizeOptions:q.pageSizeOptions===void 0?[10,25,50]:q.pageSizeOptions,paginationProps:q.paginationProps}:null,[q]),y=x!==null,vt=i.useMemo(()=>{const e=x==null?void 0:x.pageSizeOptions;return Array.isArray(e)&&e.length>0?e:void 0},[x]),[j,R]=xn.useTablePersistence({persist:Z,controlled:L,defaultState:_e,onStateChange:ve}),St=i.useCallback(e=>{R(n=>{const t=n.columnVisibility??{};return{columnVisibility:typeof e=="function"?e(t):e}})},[R]),Rt=i.useCallback(e=>{R(n=>{const t=n.rowSelection??{};return{rowSelection:typeof e=="function"?e(t):e}})},[R]),Dt=i.useCallback(e=>{R(n=>{const t=n.expanded??{};return{expanded:typeof e=="function"?e(t):e}})},[R]),yt=i.useCallback(e=>{R(n=>{const t=n.columnFilters??[];return{columnFilters:typeof e=="function"?e(t):e}})},[R]),kt=i.useCallback(e=>{R(n=>{const t=n.columnOrder??[];return{columnOrder:typeof e=="function"?e(t):e}})},[R]),It=i.useCallback(e=>{R(n=>{const t=n.sorting??[];return{sorting:typeof e=="function"?e(t):e}})},[R]),Tt=i.useCallback(e=>{R(n=>{const t=n.pagination??{pageIndex:0,pageSize:(x==null?void 0:x.pageSize)??10};return{pagination:typeof e=="function"?e(t):e}})},[R,x]),te=!!(ue||Ue),Xe=!!qe,Et=i.useMemo(()=>oe.getCoreRowModel(),[]),Nt=i.useMemo(()=>Te?void 0:oe.getFilteredRowModel(),[Te]),Ot=i.useMemo(()=>Ie?void 0:oe.getSortedRowModel(),[Ie]),$t=i.useMemo(()=>te?oe.getExpandedRowModel():void 0,[te]),jt=i.useMemo(()=>y&&!U?oe.getPaginationRowModel():void 0,[y,U]),Lt=i.useMemo(()=>{const e=[];if(S&&e.push({id:Ce,enableSorting:!1,enableHiding:!1,enableColumnFilter:!1,size:40,header:"",cell:()=>null}),Xe){const n=De==="single",t=`${p}-select`;e.push({id:Me,enableSorting:!1,enableHiding:!1,enableColumnFilter:!1,size:40,header:n?"":({table:l})=>r.jsx(gt.Checkbox,{...Ee,id:`${p}-select-all`,name:`${p}-select-all`,label:V.current("table.select-all",l.getIsAllPageRowsSelected()),hideLabel:!0,value:"all",checked:l.getIsAllPageRowsSelected(),indeterminate:l.getIsSomePageRowsSelected()&&!l.getIsAllPageRowsSelected(),onChange:(a,s)=>l.toggleAllPageRowsSelected(s)}),cell:({row:l})=>n?r.jsx(gn.Radio,{...Ve,id:`${p}-select-${l.id}`,name:t,label:V.current("table.select-row",l.getIsSelected()),hideLabel:!0,value:l.id,checked:l.getIsSelected(),disabled:!l.getCanSelect(),onChange:(a,s)=>{s&&l.toggleSelected(!0)}}):r.jsx(gt.Checkbox,{...Ee,id:`${p}-select-${l.id}`,name:`${p}-select-${l.id}`,label:V.current("table.select-row",l.getIsSelected()),hideLabel:!0,value:l.id,checked:l.getIsSelected(),disabled:!l.getCanSelect(),indeterminate:l.getIsSomeSelected(),onChange:(a,s)=>l.toggleSelected(s)})})}return te&&e.push({id:Be,enableSorting:!1,enableHiding:!1,enableColumnFilter:!1,size:40,header:"",cell:({row:n})=>{if(!n.getCanExpand())return null;const t=`${p}-sub-${n.id}`;return r.jsx("span",{onClick:l=>l.stopPropagation(),onKeyDown:l=>{(l.key==="Enter"||l.key===" ")&&l.stopPropagation()},children:r.jsx(un.Collapse,{iconOnly:!0,arrowType:ke==="row"?"default":"secondary",hideCollapseText:!0,...Ge,id:`${p}-expand-${n.id}`,controlsId:t,openText:V.current("table.expand-row"),closeText:V.current("table.collapse-row"),open:n.getIsExpanded(),onToggle:()=>n.toggleExpanded(),children:null})})}}),[...e,...v]},[v,Xe,De,te,ke,S,p,Ee,Ve,Ge]),Pt=i.useMemo(()=>({}),[]),At=i.useMemo(()=>({}),[]),Ft=i.useMemo(()=>[],[]),zt=i.useMemo(()=>[],[]),Mt=i.useMemo(()=>[],[]),Bt=i.useMemo(()=>({pageIndex:0,pageSize:(x==null?void 0:x.pageSize)??10}),[x]),c=ie.useReactTable({data:M,columns:Lt,state:{columnVisibility:j.columnVisibility,columnOrder:j.columnOrder??zt,rowSelection:j.rowSelection??Pt,expanded:j.expanded??At,columnFilters:j.columnFilters??Ft,sorting:j.sorting??Mt,pagination:y?j.pagination??Bt:void 0},enableRowSelection:qe,enableMultiRowSelection:De!=="single",enableColumnFilters:ye,autoResetPageIndex:Ct,paginateExpandedRows:y&&!U?wt:!0,manualPagination:U,manualSorting:Ie,manualFiltering:Te,pageCount:U&&Ke!==void 0?Ke:void 0,rowCount:U&&ge!==void 0?ge:void 0,getRowCanExpand:ue?He??(()=>!0):He,getSubRows:Ue,getRowId:xt,onColumnVisibilityChange:St,onColumnOrderChange:kt,onRowSelectionChange:Rt,onExpandedChange:Dt,onColumnFiltersChange:yt,onSortingChange:It,onPaginationChange:y?Tt:void 0,filterFns:Rn,getCoreRowModel:Et,getFilteredRowModel:Nt,getExpandedRowModel:$t,getSortedRowModel:Ot,getPaginationRowModel:jt}),qt=i.useMemo(()=>({table:c,size:N,id:p,state:j}),[c,N,p,j]),Ht=i.useCallback(e=>c.setPageIndex(e-1),[c]),Ut=i.useCallback(e=>c.setPageSize(e),[c]),Kt=c.getHeaderGroups().length>1,fe=ke==="row"&&te,Vt=ce??(!!A||fe),Gt=I.default(o.default["tedi-table"],o.default[`tedi-table--${N}`],{[o.default["tedi-table--striped"]]:Re,[o.default["tedi-table--vertical-borders"]]:de,[o.default["tedi-table--borderless"]]:O,[o.default["tedi-table--sticky-first-column"]]:f,[o.default["tedi-table--sticky-header"]]:P,[o.default["tedi-table--clickable-rows"]]:!!A||fe,[o.default["tedi-table--row-hover"]]:Vt,[o.default["tedi-table--has-pagination"]]:y,[o.default["tedi-table--grouped-headers"]]:Kt},g),w=c.getRowModel().rows,pe=c.getHeaderGroups(),Ye=c.getFooterGroups(),Je=c.getVisibleLeafColumns(),me=Je.length,Wt=Ye.some(e=>e.headers.some(n=>n.column.columnDef.footer!==void 0)),Qe=e=>!!A||fe&&e.getCanExpand(),Ze=e=>{fe&&e.getCanExpand()&&e.toggleExpanded(),A==null||A(e)},Xt=e=>n=>{Qe(e)&&n.target===n.currentTarget&&(n.key==="Enter"||n.key===" ")&&(n.preventDefault(),Ze(e))},et=pe.length+(ye?1:0),tt=c.getState().pagination,Yt=y?tt.pageIndex*tt.pageSize:0,Jt=y?ge??c.getFilteredRowModel().rows.length:w.length,Qt=y?et+Jt:void 0,[nt,Oe]=i.useState(null),[Zt,be]=i.useState(null),G=i.useRef(null),W=i.useRef(null),[lt,$e]=i.useState(null),[ot,he]=i.useState(null),X=i.useRef(null),Y=i.useRef(null),[at,je]=i.useState(null),xe=i.useRef([]),[it,Le]=i.useState(null),ne=i.useRef(-1),[en,F]=i.useState(""),we=i.useRef(null),[tn,rt]=i.useState(0),Pe=i.useMemo(()=>S?new Map(w.map(e=>[e.id,e.index])):new Map,[S,w]);i.useEffect(()=>{if(!S&&!K)return;const e=()=>{W.current=null,Y.current=null};return window.addEventListener("mouseup",e),window.addEventListener("touchend",e),()=>{window.removeEventListener("mouseup",e),window.removeEventListener("touchend",e)}},[S,K]);const nn=i.useCallback(e=>({onHandlePointerDown:()=>{W.current=e},onDragStart:n=>{if(W.current!==e){n.preventDefault();return}W.current=null,n.dataTransfer.effectAllowed="move";try{n.dataTransfer.setData("text/plain",e)}catch{}const t=n.currentTarget,l=t.closest("table");if(l){const a=t.getBoundingClientRect(),s=Array.from(t.children),u=document.createElement("div");u.style.cssText=`position:fixed;top:-10000px;left:0;width:${a.width}px;pointer-events:none;`;const b=document.createElement("table");b.className=l.className,b.style.cssText=`width:${a.width}px;table-layout:fixed;border-collapse:collapse;`;const C=document.createElement("tbody"),_=t.cloneNode(!0);_.classList.add(o.default["tedi-table__row--drag-preview"]);const d=Array.from(_.children);s.forEach((J,k)=>{const z=d[k];if(!z)return;const le=J.getBoundingClientRect();z.style.width=`${le.width}px`,z.style.minWidth=`${le.width}px`,z.style.maxWidth=`${le.width}px`}),C.appendChild(_),b.appendChild(C),u.appendChild(b),document.body.appendChild(u),n.dataTransfer.setDragImage(u,24,a.height/2),window.setTimeout(()=>u.remove(),0)}G.current=e,Oe(e)},onDragOver:n=>{!G.current||G.current===e||(n.preventDefault(),n.dataTransfer.dropEffect="move",be(e))},onDragLeave:()=>{be(n=>n===e?null:n)},onDragEnd:()=>{G.current=null,W.current=null,Oe(null),be(null)},onDrop:n=>{n.preventDefault();const t=G.current,l=e;if(G.current=null,W.current=null,Oe(null),be(null),!t||t===l)return;const a=Pe.get(t),s=Pe.get(l);a===void 0||s===void 0||$==null||$({fromId:t,toId:l,fromIndex:a,toIndex:s})}}),[Pe,$]),st=(e,n,t)=>{const l=e.slice(),[a]=l.splice(n,1);return l.splice(t,0,a),l},ln=i.useCallback(e=>({onHandlePointerDown:()=>{Y.current=e},onDragStart:n=>{if(Y.current!==e){n.preventDefault();return}Y.current=null,n.dataTransfer.effectAllowed="move";try{n.dataTransfer.setData("text/plain",e)}catch{}const t=n.currentTarget,l=t.getBoundingClientRect(),a=document.createElement("div");a.style.cssText=`position:fixed;top:-10000px;left:0;width:${l.width}px;pointer-events:none;`;const s=document.createElement("table"),u=t.closest("table");s.className=(u==null?void 0:u.className)??"",s.style.cssText=`width:${l.width}px;table-layout:fixed;border-collapse:collapse;`;const b=document.createElement("thead"),C=document.createElement("tr");C.className=o.default["tedi-table__row"];const _=t.cloneNode(!0);_.classList.add(o.default["tedi-table__header-cell--drag-preview"]),_.style.width=`${l.width}px`,C.appendChild(_),b.appendChild(C),s.appendChild(b),a.appendChild(s),document.body.appendChild(a),n.dataTransfer.setDragImage(a,l.width/2,l.height/2),window.setTimeout(()=>a.remove(),0),X.current=e,$e(e)},onDragOver:n=>{!X.current||X.current===e||(n.preventDefault(),n.dataTransfer.dropEffect="move",he(e))},onDragLeave:()=>{he(n=>n===e?null:n)},onDragEnd:()=>{X.current=null,Y.current=null,$e(null),he(null)},onDrop:n=>{n.preventDefault();const t=X.current,l=e;if(X.current=null,Y.current=null,$e(null),he(null),!t||t===l)return;const a=c.getState().columnOrder,s=a.length>0?a:c.getAllLeafColumns().map(C=>C.id),u=s.indexOf(t),b=s.indexOf(l);u<0||b<0||c.setColumnOrder(st(s,u,b))}}),[c]),on=e=>`${p}-col-reorder-${e}`,an=e=>`${p}-row-reorder-${e}`,dt=()=>c.getVisibleLeafColumns().filter(e=>!e.parent&&e.id!==Ce&&e.id!==Me&&e.id!==Be).map(e=>e.id),Ae=e=>{const n=c.getColumn(e),t=n==null?void 0:n.columnDef.meta;return(t==null?void 0:t.label)??(typeof(n==null?void 0:n.columnDef.header)=="string"?n.columnDef.header:e)},ct=(e,n)=>{const t=dt(),l=t.indexOf(n);if(l<0)return;const a=l+e;if(a<0||a>=t.length)return;const s=st(t,l,a),u=c.getState().columnOrder.length>0?[...c.getState().columnOrder]:c.getAllLeafColumns().map(d=>d.id),b=new Set(t);let C=0;const _=u.map(d=>b.has(d)?s[C++]:d);for(const d of s)_.includes(d)||_.push(d);c.setColumnOrder(_),F(h("table.reorder.move",Ae(n),a+1)),we.current={kind:"column",id:n},rt(d=>d+1)},rn=(e,n)=>{if(!K)return;const t=at;switch(e.key){case" ":case"Enter":if(e.preventDefault(),t===null)xe.current=[...c.getState().columnOrder??[]],je(n),F(h("table.reorder.pickup",Ae(n)));else{const l=dt().indexOf(t)+1;je(null),xe.current=[],F(h("table.reorder.drop",Ae(t),l))}break;case"Escape":t!==null&&(e.preventDefault(),c.setColumnOrder(xe.current),je(null),xe.current=[],F(h("table.reorder.cancel")));break;case"ArrowLeft":t!==null&&(e.preventDefault(),ct(-1,t));break;case"ArrowRight":t!==null&&(e.preventDefault(),ct(1,t));break}},ut=(e,n)=>{const t=w.findIndex(u=>u.original===n);if(t<0)return;const l=t+e;if(l<0||l>=w.length)return;const a=w[t],s=w[l];$==null||$({fromId:a.id,toId:s.id,fromIndex:a.index,toIndex:s.index}),F(h("table.row-reorder.move",l+1)),we.current={kind:"row",original:n},rt(u=>u+1)},sn=(e,n)=>{if(!S)return;const t=it;switch(e.key){case" ":case"Enter":if(e.preventDefault(),t===null)Le(n.original),ne.current=n.index,F(h("table.row-reorder.pickup",w.indexOf(n)+1));else{const l=w.findIndex(a=>a.original===t)+1;Le(null),ne.current=-1,F(h("table.row-reorder.drop",l))}break;case"Escape":if(t!==null){e.preventDefault();const l=w.findIndex(a=>a.original===t);if(l>=0&&ne.current>=0){const a=w[l];$==null||$({fromId:a.id,toId:a.id,fromIndex:a.index,toIndex:ne.current})}Le(null),ne.current=-1,F(h("table.row-reorder.cancel"))}break;case"ArrowUp":t!==null&&(e.preventDefault(),ut(-1,t));break;case"ArrowDown":t!==null&&(e.preventDefault(),ut(1,t));break}};return i.useEffect(()=>{var t;const e=we.current;if(!e)return;we.current=null;let n;if(e.kind==="column")n=`${p}-col-reorder-${e.id}`;else{const l=w.find(a=>a.original===e.original);n=l?`${p}-row-reorder-${l.id}`:null}n&&((t=document.getElementById(n))==null||t.focus())},[tn,w,p]),r.jsx(mn.TableContext.Provider,{value:qt,children:r.jsxs("div",{className:Gt,"data-name":"tedi-table",children:[Se,(S||K)&&r.jsx("div",{className:o.default["tedi-table__sr-only"],"aria-live":"polite","aria-atomic":"true",children:en}),r.jsx("div",{className:o.default["tedi-table__scroll"],style:ee!==void 0?{maxHeight:ee,overflowY:"auto"}:void 0,children:r.jsxs("table",{id:T,className:o.default["tedi-table__table"],"aria-rowcount":Qt,"aria-colcount":me>0?me:void 0,children:[E&&r.jsx("caption",{className:o.default["tedi-table__caption"],children:E}),r.jsxs("thead",{className:o.default["tedi-table__head"],children:[pe.map((e,n)=>r.jsx("tr",{className:o.default["tedi-table__row"],"aria-rowindex":y?n+1:void 0,children:e.headers.map(t=>{const l=t.subHeaders.length>0,a=!!t.column.parent,s=Dn(t.column.columnDef),u=!s&&!a;if(t.isPlaceholder&&!u||!t.isPlaceholder&&u&&n>0)return null;const b=u?pe.length-n:1,C=t.column.getIsSorted(),_=t.column.getCanSort()?C==="asc"?"ascending":C==="desc"?"descending":"none":void 0,d=t.column.columnDef.meta,J=(d==null?void 0:d.label)??(typeof t.column.columnDef.header=="string"?t.column.columnDef.header:void 0),k=H==null?void 0:H(t.column.id),z=t.column.getSize(),le=t.column.id===Ce||t.column.id===Me||t.column.id===Be,Q=K&&u&&!le,m=Q?ln(t.column.id):void 0,dn=Q&&lt===t.column.id,cn=Q&&ot===t.column.id&&lt!==t.column.id,Fe=Q&&at===t.column.id;return r.jsx("th",{colSpan:t.colSpan,rowSpan:b>1?b:void 0,draggable:Q||void 0,onDragStart:m==null?void 0:m.onDragStart,onDragOver:m==null?void 0:m.onDragOver,onDragLeave:m==null?void 0:m.onDragLeave,onDragEnd:m==null?void 0:m.onDragEnd,onDrop:m==null?void 0:m.onDrop,className:I.default(o.default["tedi-table__header-cell"],{[o.default["tedi-table__header-cell--group"]]:l,[o.default["tedi-table__header-cell--dragging"]]:dn,[o.default["tedi-table__header-cell--drag-over"]]:cn,[o.default["tedi-table__header-cell--picked-up"]]:Fe,[o.default[`tedi-table__cell--align-${d==null?void 0:d.align}`]]:d==null?void 0:d.align,[o.default[`tedi-table__cell--valign-${d==null?void 0:d.vAlign}`]]:d==null?void 0:d.vAlign},k==null?void 0:k.className),scope:"col","aria-sort":_,"aria-label":J??(s?void 0:t.column.id),style:z||k!=null&&k.style?{...z?{width:z}:null,...k==null?void 0:k.style}:void 0,children:Q&&m?r.jsxs("span",{className:o.default["tedi-table__header-cell-inner"],children:[r.jsx("button",{type:"button",id:on(t.column.id),className:I.default(o.default["tedi-table__drag-handle"],{[o.default["tedi-table__drag-handle--picked-up"]]:Fe}),"aria-label":h("table.drag-column",J??t.column.id),"aria-pressed":Fe,onClick:ze=>ze.stopPropagation(),onMouseDown:m.onHandlePointerDown,onTouchStart:m.onHandlePointerDown,onKeyDown:ze=>rn(ze,t.column.id),[pt]:"",children:r.jsx(ft.Icon,{name:"drag_indicator",size:18,color:"inherit"})}),ie.flexRender(t.column.columnDef.header,t.getContext())]}):ie.flexRender(t.column.columnDef.header,t.getContext())},t.id)})},e.id)),ye&&r.jsx("tr",{className:I.default(o.default["tedi-table__row"],o.default["tedi-table__row--filter"]),"aria-rowindex":y?pe.length+1:void 0,children:Je.map(e=>{const n=e.columnDef.meta,t=(n==null?void 0:n.label)??(typeof e.columnDef.header=="string"?e.columnDef.header:e.id),l=`${p}-filter-${e.id}`,a=H==null?void 0:H(e.id);return r.jsx("th",{className:I.default(o.default["tedi-table__header-cell"],a==null?void 0:a.className),style:a==null?void 0:a.style,scope:"col",children:e.getCanFilter()&&r.jsx(fn.TextField,{size:"small",placeholder:h("table.filter-placeholder"),...n==null?void 0:n.filterProps,id:l,name:l,label:h("table.filter-input",t),hideLabel:!0,value:e.getFilterValue()??"",onChange:s=>e.setFilterValue(s||void 0)})},e.id)})})]}),r.jsx("tbody",{className:o.default["tedi-table__body"],children:w.length===0?r.jsx("tr",{className:o.default["tedi-table__row"],children:r.jsx("td",{colSpan:Math.max(1,me),className:I.default(o.default["tedi-table__cell"],o.default["tedi-table__cell--placeholder"]),children:se?r.jsx("div",{role:se,children:We}):We})}):w.map((e,n)=>{const t=Qe(e),l=B!==void 0&&e.id===B,a=Ne==null?void 0:Ne(e),s=I.default(o.default["tedi-table__row"],{[o.default["tedi-table__row--selected"]]:ht&&e.getIsSelected(),[o.default["tedi-table__row--active"]]:l,[o.default["tedi-table__row--clickable"]]:t,[o.default["tedi-table__row--sub-row"]]:e.depth>0},a==null?void 0:a.className),u=y?et+Yt+n+1:void 0,b=`${p}-sub-${e.id}`,C=S&&nt===e.id,_=S&&Zt===e.id&&nt!==e.id,d=S&&it===e.original,J={row:e,rowClassName:I.default(s,{[o.default["tedi-table__row--dragging"]]:C,[o.default["tedi-table__row--drag-over"]]:_,[o.default["tedi-table__row--picked-up"]]:d}),rowStyle:a==null?void 0:a.style,isActiveRow:l,clickable:t,onClick:Ze,onKeyDownHandler:Xt(e),ariaRowIndex:u,columnProps:H,draggable:S,dragHandleLabel:h("table.drag-row"),dragHandlers:S?{...nn(e.id),onKeyDown:k=>sn(k,e)}:void 0,dragHandleId:S?an(e.id):void 0,dragHandlePickedUp:d,dragOverColumnId:K?ot:null};return r.jsxs(i.Fragment,{children:[r.jsx(Sn,{...J}),ue&&e.getIsExpanded()&&r.jsx("tr",{className:I.default(o.default["tedi-table__row"],o.default["tedi-table__row--sub-component"]),children:r.jsx("td",{id:b,role:"region","aria-label":h("table.row-details"),colSpan:Math.max(1,me),className:I.default(o.default["tedi-table__cell"],o.default["tedi-table__cell--sub-component"]),children:ue(e)})})]},e.id)})}),Wt&&r.jsx("tfoot",{className:o.default["tedi-table__foot"],children:Ye.map(e=>r.jsx("tr",{className:o.default["tedi-table__row"],children:e.headers.map(n=>{const t=n.column.columnDef.meta;return r.jsx("td",{colSpan:n.colSpan,className:I.default(o.default["tedi-table__cell"],o.default["tedi-table__cell--footer"],{[o.default[`tedi-table__cell--align-${t==null?void 0:t.align}`]]:t==null?void 0:t.align,[o.default[`tedi-table__cell--valign-${t==null?void 0:t.vAlign}`]]:t==null?void 0:t.vAlign}),children:n.isPlaceholder?null:ie.flexRender(n.column.columnDef.footer,n.getContext())},n.id)})},e.id))})]})}),y&&r.jsx("div",{className:o.default["tedi-table__pagination"],children:r.jsx(wn.Pagination,{...x==null?void 0:x.paginationProps,pageCount:Math.max(1,c.getPageCount()),page:c.getState().pagination.pageIndex+1,onPageChange:Ht,totalItems:ge??c.getFilteredRowModel().rows.length,pageSize:c.getState().pagination.pageSize,pageSizeOptions:vt,onPageSizeChange:Ut})})]})})}mt.displayName="Table";const bt=Object.assign(mt,{Toolbar:hn.TableToolbar,ColumnsMenu:pn.TableColumnsMenu,HeaderButton:bn.TableHeaderButton});exports.Table=bt;exports.default=bt;exports.groupRowSpan=_n;