@kubit-ui-web/react-components 2.0.0-beta.47 → 2.0.0-beta.49

package/dist/esm/components/dataTable/components/dataTableHead.js

@@ -1,4 +1,67 @@
-import{jsx as i}from"react/jsx-runtime";import{TableCell as t}from"../../tableCell/tableCell.js";import{TableHead as e}from"../../tableHead/tableHead.js";import{TableRow as l}from"../../tableRow/tableRow.js";import{applyFlexToCell as o}from"../utils/cellConfig.js";import{applyGridToRow as n}from"../utils/rowConfig.js";const d=({columns:d,cssClasses:s,hidden:a,sticky:c,tableHeadConfig:r,tableHeadRowConfig:m,usingRowGroups:h})=>{const f=h?n({rowConfig:m}):m;/* @__PURE__ */
-return i(e,{additionalClasses:s?.table_head,component:h?"div":void 0,hidden:a,sticky:c,...r,children:/* @__PURE__ */i(l,{additionalClasses:s?.table_head_row,component:h?"div":void 0,hoverable:!1,...f,children:d?.map(e=>{const l=e.headerContent;if(l&&"object"==typeof l&&"complex"in l){const n=h?o({cellConfig:l.complex}):l.complex;/* @__PURE__ */
-return i(t,{additionalClasses:s?.table_head_cell,alignItems:f?.cellsAlignItems,component:h?"div":void 0,hidden:e.hidden,justifyContent:e.justifyContent,maxWidth:h?void 0:e.maxWidth,minWidth:h?void 0:e.minWidth,scope:"col",sticky:e.sticky,textAlign:e.textAlign,th:!0,verticalAlign:f?.cellsVerticalAlign,width:h?void 0:e.width,...n,children:n?.content},e.field)}const n=h?o({cellConfig:void 0}):void 0;/* @__PURE__ */
-return i(t,{additionalClasses:s?.table_head_cell,alignItems:f?.cellsAlignItems,component:h?"div":void 0,hidden:e.hidden,justifyContent:e.justifyContent,maxWidth:h?void 0:e.maxWidth,minWidth:h?void 0:e.minWidth,scope:"col",sticky:e.sticky,textAlign:e.textAlign,th:!0,verticalAlign:f?.cellsVerticalAlign,width:h?void 0:e.width,...n,children:l},e.field)})})})};export{d as DataTableHead};
+import { TableCell } from "../../tableCell/tableCell.js";
+import { TableHead } from "../../tableHead/tableHead.js";
+import { TableRow } from "../../tableRow/tableRow.js";
+import { applyFlexToCell } from "../utils/cellConfig.js";
+import { applyGridToRow } from "../utils/rowConfig.js";
+import { jsx } from "react/jsx-runtime";
+const DataTableHead = ({ columns: r, cssClasses: i, hidden: a, sticky: o, tableHeadConfig: s, tableHeadRowConfig: c, usingRowGroups: l }) => {
+	let u = l ? applyGridToRow({
+		columns: r,
+		rowConfig: c
+	}) : c;
+	return /* @__PURE__ */ jsx(TableHead, {
+		additionalClasses: i?.table_head,
+		component: l ? "div" : void 0,
+		hidden: a,
+		sticky: o,
+		...s,
+		children: /* @__PURE__ */ jsx(TableRow, {
+			additionalClasses: i?.table_head_row,
+			component: l ? "div" : void 0,
+			hoverable: !1,
+			...u,
+			children: r?.map((e) => {
+				let t = e.headerContent;
+				if (t && typeof t == "object" && "complex" in t) {
+					let n = l ? applyFlexToCell({ cellConfig: t.complex }) : t.complex;
+					return /* @__PURE__ */ jsx(TableCell, {
+						additionalClasses: i?.table_head_cell,
+						alignItems: u?.cellsAlignItems,
+						component: l ? "div" : void 0,
+						hidden: e.hidden,
+						justifyContent: e.justifyContent,
+						maxWidth: l ? void 0 : e.maxWidth,
+						minWidth: l ? void 0 : e.minWidth,
+						scope: "col",
+						sticky: e.sticky,
+						textAlign: e.textAlign,
+						th: !0,
+						verticalAlign: u?.cellsVerticalAlign,
+						width: l ? void 0 : e.width,
+						...n,
+						children: n?.content
+					}, e.field);
+				}
+				let n = l ? applyFlexToCell({ cellConfig: void 0 }) : void 0;
+				return /* @__PURE__ */ jsx(TableCell, {
+					additionalClasses: i?.table_head_cell,
+					alignItems: u?.cellsAlignItems,
+					component: l ? "div" : void 0,
+					hidden: e.hidden,
+					justifyContent: e.justifyContent,
+					maxWidth: l ? void 0 : e.maxWidth,
+					minWidth: l ? void 0 : e.minWidth,
+					scope: "col",
+					sticky: e.sticky,
+					textAlign: e.textAlign,
+					th: !0,
+					verticalAlign: u?.cellsVerticalAlign,
+					width: l ? void 0 : e.width,
+					...n,
+					children: t
+				}, e.field);
+			})
+		})
+	});
+};
+export { DataTableHead };

package/dist/esm/components/dataTable/components/dataTableRows.js

@@ -1,6 +1,62 @@
-import{jsx as e,Fragment as i}from"react/jsx-runtime";import{TableCell as t}from"../../tableCell/tableCell.js";import{TableRow as o}from"../../tableRow/tableRow.js";import{applyFlexToCell as l}from"../utils/cellConfig.js";import{isRowHoverable as n}from"../utils/hoverable.js";import{applyGridToRow as s}from"../utils/rowConfig.js";const r=({activeRows:r,columns:a,cssClasses:c,hoverable:d,hoverableRows:m,isRowGroup:f=!1,nonHoverableRows:g,rows:u,usingRowGroups:v})=>{const b=f?{table_row:c?.row_group_table_body.table_body}:c?.table_body_row,w=f?c?.row_group_table_body_cell:c?.table_body_cell;
-/* @__PURE__ */
-return e(i,{children:u?.map((i,c)=>{const f=v?s({rowConfig:i?.config}):i?.config;/* @__PURE__ */
-return e(o,{active:Boolean(i.id&&r?.includes(i.id)),additionalClasses:b,hoverable:n({hoverable:d,hoverableRows:m,nonHoverableRows:g,row:i}),...f,children:a?.map(o=>{const n=o.valueGetter?o.valueGetter(i[o.field],i):i[o.field];if(n&&"object"==typeof n&&"complex"in n){const s=v?l({cellConfig:n.complex}):n.complex;/* @__PURE__ */
-return e(t,{additionalClasses:w,alignItems:i.config?.cellsAlignItems,justifyContent:o.valueJustifyContent??o.justifyContent,maxWidth:v?void 0:o.maxWidth,minWidth:v?void 0:o.minWidth,role:"row",sticky:o.sticky,textAlign:o.valueTextAlign??o.textAlign,verticalAlign:i.config?.cellsVerticalAlign,width:v?void 0:o.width,...s,children:s?.content},o.field)}const s=v?l({cellConfig:void 0}):void 0;/* @__PURE__ */
-return e(t,{additionalClasses:w,alignItems:i.config?.cellsAlignItems,justifyContent:o.valueJustifyContent??o.justifyContent,maxWidth:v?void 0:o.maxWidth,minWidth:v?void 0:o.minWidth,role:"row",sticky:o.sticky,textAlign:o.valueTextAlign??o.textAlign,verticalAlign:i.config?.cellsVerticalAlign,width:v?void 0:o.width,...s,children:n},o.field)})},i.id??c)})})};export{r as DataTableRows};
+import { TableCell } from "../../tableCell/tableCell.js";
+import { TableRow } from "../../tableRow/tableRow.js";
+import { applyFlexToCell } from "../utils/cellConfig.js";
+import { applyGridToRow } from "../utils/rowConfig.js";
+import { isRowHoverable } from "../utils/hoverable.js";
+import { Fragment, jsx } from "react/jsx-runtime";
+const DataTableRows = ({ activeRows: i, columns: a, cssClasses: o, hoverable: s, hoverableRows: c, isRowGroup: l = !1, nonHoverableRows: u, rows: d, usingRowGroups: f }) => {
+	let p = l ? { table_row: o?.row_group_table_body.table_body } : o?.table_body_row, m = l ? o?.row_group_table_body_cell : o?.table_body_cell;
+	return /* @__PURE__ */ jsx(Fragment, { children: d?.map((r, o) => {
+		let l = f ? applyGridToRow({
+			columns: a,
+			rowConfig: r?.config
+		}) : r?.config;
+		return /* @__PURE__ */ jsx(TableRow, {
+			active: !!(r.id && i?.includes(r.id)),
+			additionalClasses: p,
+			hoverable: isRowHoverable({
+				hoverable: s,
+				hoverableRows: c,
+				nonHoverableRows: u,
+				row: r
+			}),
+			...l,
+			children: a?.map((e) => {
+				let t = e.valueGetter ? e.valueGetter(r[e.field], r) : r[e.field];
+				if (t && typeof t == "object" && "complex" in t) {
+					let n = f ? applyFlexToCell({ cellConfig: t.complex }) : t.complex;
+					return /* @__PURE__ */ jsx(TableCell, {
+						additionalClasses: m,
+						alignItems: r.config?.cellsAlignItems,
+						justifyContent: e.valueJustifyContent ?? e.justifyContent,
+						maxWidth: f ? void 0 : e.maxWidth,
+						minWidth: f ? void 0 : e.minWidth,
+						role: "row",
+						sticky: e.sticky,
+						textAlign: e.valueTextAlign ?? e.textAlign,
+						verticalAlign: r.config?.cellsVerticalAlign,
+						width: f ? void 0 : e.width,
+						...n,
+						children: n?.content
+					}, e.field);
+				}
+				let n = f ? applyFlexToCell({ cellConfig: void 0 }) : void 0;
+				return /* @__PURE__ */ jsx(TableCell, {
+					additionalClasses: m,
+					alignItems: r.config?.cellsAlignItems,
+					justifyContent: e.valueJustifyContent ?? e.justifyContent,
+					maxWidth: f ? void 0 : e.maxWidth,
+					minWidth: f ? void 0 : e.minWidth,
+					role: "row",
+					sticky: e.sticky,
+					textAlign: e.valueTextAlign ?? e.textAlign,
+					verticalAlign: r.config?.cellsVerticalAlign,
+					width: f ? void 0 : e.width,
+					...n,
+					children: t
+				}, e.field);
+			})
+		}, r.id ?? o);
+	}) });
+};
+export { DataTableRows };

package/dist/esm/components/dataTable/components/hiddenDataTableHead.js

@@ -1,2 +1,25 @@
-import{jsx as e}from"react/jsx-runtime";import{TableCell as o}from"../../tableCell/tableCell.js";import{TableHead as t}from"../../tableHead/tableHead.js";import{TableRow as l}from"../../tableRow/tableRow.js";const a=({columns:a,cssClasses:r})=>/* @__PURE__ */e(t,{additionalClasses:r?.row_group_table_head,hidden:!0,children:/* @__PURE__ */e(l,{additionalClasses:r?.row_group_table_head_row,children:a?.map(t=>{let l=t.headerHiddenContent;if(!l){const e=t.headerContent;l=e&&"object"==typeof e&&"complex"in e?e.complex?.content:e}/* @__PURE__ */
-return e(o,{additionalClasses:r?.row_group_table_head_cell,scope:"col",th:!0,children:l},t.field)})})});export{a as HiddenDataTableHead};
+import { TableCell } from "../../tableCell/tableCell.js";
+import { TableHead } from "../../tableHead/tableHead.js";
+import { TableRow } from "../../tableRow/tableRow.js";
+import { jsx } from "react/jsx-runtime";
+const HiddenDataTableHead = ({ columns: r, cssClasses: i }) => /* @__PURE__ */ jsx(TableHead, {
+	additionalClasses: i?.row_group_table_head,
+	hidden: !0,
+	children: /* @__PURE__ */ jsx(TableRow, {
+		additionalClasses: i?.row_group_table_head_row,
+		children: r?.map((t) => {
+			let n = t.headerHiddenContent;
+			if (!n) {
+				let e = t.headerContent;
+				n = e && typeof e == "object" && "complex" in e ? e.complex?.content : e;
+			}
+			return /* @__PURE__ */ jsx(TableCell, {
+				additionalClasses: i?.row_group_table_head_cell,
+				scope: "col",
+				th: !0,
+				children: n
+			}, t.field);
+		})
+	})
+});
+export { HiddenDataTableHead };

package/dist/esm/components/dataTable/dataTable.js

@@ -1 +1,30 @@
-import{jsx as o}from"react/jsx-runtime";import{forwardRef as a,useRef as s,useImperativeHandle as r}from"react";import{useClassName as t}from"../../lib/hooks/useClassName/useClassName.js";import{DataTableStandAlone as e}from"./dataTableStandAlone.js";import{useDataTableHasScroll as l}from"./hooks/useDataTableHasScroll.js";import{useDataTableShadow as i}from"./hooks/useDataTableShadow.js";import{useDataTableStickyDividers as m}from"./hooks/useDataTableStickyDividers.js";import{useDataTableStickyLeftColumns as h}from"./hooks/useDataTableStickyLeftColumns.js";import{useDataTableStickyRightColumns as f}from"./hooks/useDataTableStickyRightColumns.js";const n=a(({additionalClasses:a,variant:n,...d},c)=>{const u=t({additionalClassNames:a,component:"DATA_TABLE",variant:n}),p=s(null);r(c,()=>p.current,[]);const{hasScroll:S}=l({ref:p});return f({ref:p}),h({ref:p}),m({ref:p}),i({headBoxShadow:u.headboxshadow,leftBoxShadow:u.leftboxshadow,ref:p,rightBoxShadow:u.rightboxshadow}),/* @__PURE__ */o(e,{ref:p,cssClasses:u,hasScroll:S,...d})});export{n as DataTable};
+import { useClassName } from "../../lib/hooks/useClassName/useClassName.js";
+import { DataTableStandAlone } from "./dataTableStandAlone.js";
+import { useDataTableHasScroll } from "./hooks/useDataTableHasScroll.js";
+import { useDataTableShadow } from "./hooks/useDataTableShadow.js";
+import { useDataTableStickyDividers } from "./hooks/useDataTableStickyDividers.js";
+import { useDataTableStickyLeftColumns } from "./hooks/useDataTableStickyLeftColumns.js";
+import { useDataTableStickyRightColumns } from "./hooks/useDataTableStickyRightColumns.js";
+import { forwardRef, useImperativeHandle, useRef } from "react";
+import { jsx } from "react/jsx-runtime";
+const DataTable = forwardRef(({ additionalClasses: e, variant: t, ...n }, r) => {
+	let i = useClassName({
+		additionalClassNames: e,
+		component: "DATA_TABLE",
+		variant: t
+	}), a = useRef(null);
+	useImperativeHandle(r, () => a.current, []);
+	let { hasScroll: o } = useDataTableHasScroll({ ref: a });
+	return useDataTableStickyRightColumns({ ref: a }), useDataTableStickyLeftColumns({ ref: a }), useDataTableStickyDividers({ ref: a }), useDataTableShadow({
+		headBoxShadow: i.headboxshadow,
+		leftBoxShadow: i.leftboxshadow,
+		ref: a,
+		rightBoxShadow: i.rightboxshadow
+	}), /* @__PURE__ */ jsx(DataTableStandAlone, {
+		ref: a,
+		cssClasses: i,
+		hasScroll: o,
+		...n
+	});
+});
+export { DataTable };

package/dist/esm/components/dataTable/dataTableStandAlone.js

@@ -1,10 +1,123 @@
-import{jsxs as a,jsx as o}from"react/jsx-runtime";import{forwardRef as e,Fragment as t}from"react";import{TableBody as s}from"../tableBody/tableBody.js";import{pickCustomAttributes as i}from"../../lib/utils/pickCustomAttributes/pickCustomAttributes.js";import{Table as l}from"../table/table.js";import{TableCaption as r}from"../tableCaption/tableCaption.js";import{TableDivider as n}from"../tableDivider/tableDivider.js";import{DataTableHead as d}from"./components/dataTableHead.js";import{DataTableRows as c}from"./components/dataTableRows.js";import{HiddenDataTableHead as b}from"./components/hiddenDataTableHead.js";import{applyZIndexToWrapper as m,applyPositionToWrapper as p}from"./utils/tableConfig.js";const h=e(({activeRows:e,caption:h,columns:v,config:w,cssClasses:f,hasScroll:u,hoverable:C,hoverableRows:g,nonHoverableRows:R,rowGroups:y,rows:_,stickyHead:j,styles:H,...S},k)=>{const D=y&&y.length>0,x=i(S);/* @__PURE__ */
-return a("div",{ref:k,className:f?.data_table,"data-testid":"data-table",...x,children:[
-/* @__PURE__ */a("div",{"aria-label":u?S["aria-label"]:void 0,"aria-labelledby":u?S["aria-labelledby"]:void 0,className:f?.scrollablecontainer,"data-datatable-scrollable-container":!0,role:u?"region":void 0,...u?{tabIndex:0}:{},children:[
-/* @__PURE__ */a(l,{additionalClasses:f?.table,"aria-hidden":!!D||void 0,autoLeftStickyCalc:!1,autoRightStickyCalc:!1,component:D?"div":void 0,disableShadowEffects:!0,hasScrollDisabled:!0,sticky:j,...m({tableConfig:w?.table}),children:[!!h?.content&&/* @__PURE__ */o(r,{additionalClasses:f?.table_caption,component:D?"div":void 0,...h,children:h?.content}),
-/* @__PURE__ */o(d,{columns:v,cssClasses:f,sticky:j,tableHeadConfig:w?.tableHead,tableHeadRowConfig:w?.tableHeadRow,usingRowGroups:D}),!D&&_&&_.length>0&&/* @__PURE__ */o(s,{additionalClasses:f?.table_body,...w?.tableBody,children:/* @__PURE__ */o(c,{activeRows:e,columns:v,cssClasses:f,hoverable:C,hoverableRows:g,nonHoverableRows:R,rows:_,usingRowGroups:D})})]}),y?.map((i,d)=>/* @__PURE__ */a(t,{children:[!!i.divider&&/* @__PURE__ */o(n,{variant:"DEFAULT",...i.divider,children:i.divider?.content}),
-/* @__PURE__ */a(l,{additionalClasses:f?.row_group_table,autoLeftStickyCalc:!1,autoRightStickyCalc:!1,disableShadowEffects:!0,hasScrollDisabled:!0,...p({tableConfig:i.config?.table}),children:[!!i.caption?.content&&/* @__PURE__ */o(r,{additionalClasses:f?.row_group_table_caption,...i.caption,children:i.caption?.content}),
-/* @__PURE__ */o(b,{columns:v,cssClasses:f}),
-/* @__PURE__ */o(s,{additionalClasses:f?.row_group_table_body,...i.config?.tableBody,children:/* @__PURE__ */o(c,{activeRows:e,columns:v,cssClasses:f,hoverable:C,hoverableRows:g,isRowGroup:!0,nonHoverableRows:R,rows:i.rows,usingRowGroups:D})})]})]},`${i.caption?.["data-testid"]}-${d.toString()}`))]}),
-/* @__PURE__ */o("div",{className:f?.leftboxshadowcontainer,"data-datatable-left-shadow":!0}),
-/* @__PURE__ */o("div",{className:f?.rightboxshadowcontainer,"data-datatable-right-shadow":!0})]})});export{h as DataTableStandAlone};
+import { pickCustomAttributes } from "../../lib/utils/pickCustomAttributes/pickCustomAttributes.js";
+import { TableBody } from "../tableBody/tableBody.js";
+import { Table } from "../table/table.js";
+import { TableCaption } from "../tableCaption/tableCaption.js";
+import { TableDivider } from "../tableDivider/tableDivider.js";
+import { DataTableHead } from "./components/dataTableHead.js";
+import { DataTableRows } from "./components/dataTableRows.js";
+import { HiddenDataTableHead } from "./components/hiddenDataTableHead.js";
+import { applyPositionToWrapper, applyZIndexToWrapper } from "./utils/tableConfig.js";
+import { Fragment, forwardRef } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+const DataTableStandAlone = forwardRef(({ activeRows: n, caption: r, columns: i, config: a, cssClasses: o, hasScroll: s, hoverable: c, hoverableRows: l, nonHoverableRows: u, rowGroups: d, rows: f, stickyHead: p, styles: m, ...h }, g) => {
+	let _ = d && d.length > 0, v = pickCustomAttributes(h);
+	return /* @__PURE__ */ jsxs("div", {
+		ref: g,
+		className: o?.data_table,
+		"data-testid": "data-table",
+		...v,
+		children: [
+			/* @__PURE__ */ jsxs("div", {
+				"aria-label": s ? h["aria-label"] : void 0,
+				"aria-labelledby": s ? h["aria-labelledby"] : void 0,
+				className: o?.scrollablecontainer,
+				"data-datatable-scrollable-container": !0,
+				role: s ? "region" : void 0,
+				...s ? { tabIndex: 0 } : {},
+				children: [/* @__PURE__ */ jsxs(Table, {
+					additionalClasses: o?.table,
+					"aria-hidden": _ ? !0 : void 0,
+					autoLeftStickyCalc: !1,
+					autoRightStickyCalc: !1,
+					component: _ ? "div" : void 0,
+					disableShadowEffects: !0,
+					hasScrollDisabled: !0,
+					sticky: p,
+					...applyZIndexToWrapper({
+						tableConfig: a?.table,
+						zIndex: 1
+					}),
+					children: [
+						!!r?.content && /* @__PURE__ */ jsx(TableCaption, {
+							additionalClasses: o?.table_caption,
+							component: _ ? "div" : void 0,
+							...r,
+							children: r?.content
+						}),
+						/* @__PURE__ */ jsx(DataTableHead, {
+							columns: i,
+							cssClasses: o,
+							sticky: p,
+							tableHeadConfig: a?.tableHead,
+							tableHeadRowConfig: a?.tableHeadRow,
+							usingRowGroups: _
+						}),
+						!_ && f && f.length > 0 && /* @__PURE__ */ jsx(TableBody, {
+							additionalClasses: o?.table_body,
+							...a?.tableBody,
+							children: /* @__PURE__ */ jsx(DataTableRows, {
+								activeRows: n,
+								columns: i,
+								cssClasses: o,
+								hoverable: c,
+								hoverableRows: l,
+								nonHoverableRows: u,
+								rows: f,
+								usingRowGroups: _
+							})
+						})
+					]
+				}), d?.map((e, t) => /* @__PURE__ */ jsxs(Fragment, { children: [!!e.divider && /* @__PURE__ */ jsx(TableDivider, {
+					variant: "DEFAULT",
+					...e.divider,
+					children: e.divider?.content
+				}), /* @__PURE__ */ jsxs(Table, {
+					additionalClasses: o?.row_group_table,
+					autoLeftStickyCalc: !1,
+					autoRightStickyCalc: !1,
+					disableShadowEffects: !0,
+					hasScrollDisabled: !0,
+					...applyPositionToWrapper({
+						position: "static",
+						tableConfig: e.config?.table
+					}),
+					children: [
+						!!e.caption?.content && /* @__PURE__ */ jsx(TableCaption, {
+							additionalClasses: o?.row_group_table_caption,
+							...e.caption,
+							children: e.caption?.content
+						}),
+						/* @__PURE__ */ jsx(HiddenDataTableHead, {
+							columns: i,
+							cssClasses: o
+						}),
+						/* @__PURE__ */ jsx(TableBody, {
+							additionalClasses: o?.row_group_table_body,
+							...e.config?.tableBody,
+							children: /* @__PURE__ */ jsx(DataTableRows, {
+								activeRows: n,
+								columns: i,
+								cssClasses: o,
+								hoverable: c,
+								hoverableRows: l,
+								isRowGroup: !0,
+								nonHoverableRows: u,
+								rows: e.rows,
+								usingRowGroups: _
+							})
+						})
+					]
+				})] }, `${e.caption?.["data-testid"]}-${t.toString()}`))]
+			}),
+			/* @__PURE__ */ jsx("div", {
+				className: o?.leftboxshadowcontainer,
+				"data-datatable-left-shadow": !0
+			}),
+			/* @__PURE__ */ jsx("div", {
+				className: o?.rightboxshadowcontainer,
+				"data-datatable-right-shadow": !0
+			})
+		]
+	});
+});
+export { DataTableStandAlone };

package/dist/esm/components/dataTable/hooks/useDataTableHasScroll.js

@@ -1 +1,20 @@
-import{useState as e,useEffect as r}from"react";import{hasScroll as t}from"../../../lib/utils/scroll/hasScroll.js";const o=({ref:o})=>{const[c,l]=e(!1);return r(()=>{const e=o.current?.querySelector?.("[data-datatable-scrollable-container]");let r;if(e instanceof HTMLElement){const o=e=>{l(t(e))};o(e),r=new ResizeObserver(()=>{o(e)}),r.observe(e)}return()=>{r?.disconnect()}},[]),{hasScroll:c}};export{o as useDataTableHasScroll};
+import { hasScroll } from "../../../lib/utils/scroll/hasScroll.js";
+import { useEffect, useState } from "react";
+const useDataTableHasScroll = ({ ref: n }) => {
+	let [r, i] = useState(!1);
+	return useEffect(() => {
+		let e = n.current?.querySelector?.("[data-datatable-scrollable-container]"), t;
+		if (e instanceof HTMLElement) {
+			let n = (e) => {
+				i(hasScroll(e));
+			};
+			n(e), t = new ResizeObserver(() => {
+				n(e);
+			}), t.observe(e);
+		}
+		return () => {
+			t?.disconnect();
+		};
+	}, []), { hasScroll: r };
+};
+export { useDataTableHasScroll };

package/dist/esm/components/dataTable/hooks/useDataTableShadow.js

@@ -1 +1,21 @@
-import{useEffect as e}from"react";const t=({headBoxShadow:t,leftBoxShadow:s,ref:a,rightBoxShadow:l})=>(e(()=>{const e=a.current,o=e?.querySelector("[data-datatable-scrollable-container]");let r;const c=()=>{if(!o)return;const a=o.querySelector("[data-table-head]");if(a instanceof HTMLElement&&a.hasAttribute("data-sticky")&&t&&(o.scrollTop?a.classList.add(t):a.classList.remove(t)),s){const t=e?.querySelector("[data-datatable-left-shadow]");t instanceof HTMLElement&&(o.scrollLeft?(t.style.boxShadow=s,t.classList.add(s),t.style.height=`${o.clientHeight}px`):t.classList.remove(s))}if(l){const t=e?.querySelector("[data-datatable-right-shadow]");t instanceof HTMLElement&&(o.scrollLeft+o.clientWidth<o.scrollWidth?(t.classList.add(l),t.style.height=`${o.clientHeight}px`):t.classList.remove(l))}};return o instanceof HTMLElement&&(c(),o?.addEventListener("scroll",c),r=new ResizeObserver(()=>{c()}),r.observe(o)),()=>{o?.removeEventListener("scroll",c),r?.disconnect()}},[]),{});export{t as useDataTableShadow};
+import { useEffect } from "react";
+const useDataTableShadow = ({ headBoxShadow: t, leftBoxShadow: n, ref: r, rightBoxShadow: i }) => (useEffect(() => {
+	let e = r.current, a = e?.querySelector("[data-datatable-scrollable-container]"), o, s = () => {
+		if (!a) return;
+		let r = a.querySelector("[data-table-head]");
+		if (r instanceof HTMLElement && r.hasAttribute("data-sticky") && t && (a.scrollTop ? r.classList.add(t) : r.classList.remove(t)), n) {
+			let t = e?.querySelector("[data-datatable-left-shadow]");
+			t instanceof HTMLElement && (a.scrollLeft ? (t.style.boxShadow = n, t.classList.add(n), t.style.height = `${a.clientHeight}px`) : t.classList.remove(n));
+		}
+		if (i) {
+			let t = e?.querySelector("[data-datatable-right-shadow]");
+			t instanceof HTMLElement && (a.scrollLeft + a.clientWidth < a.scrollWidth ? (t.classList.add(i), t.style.height = `${a.clientHeight}px`) : t.classList.remove(i));
+		}
+	};
+	return a instanceof HTMLElement && (s(), a?.addEventListener("scroll", s), o = new ResizeObserver(() => {
+		s();
+	}), o.observe(a)), () => {
+		a?.removeEventListener("scroll", s), o?.disconnect();
+	};
+}, []), {});
+export { useDataTableShadow };

package/dist/esm/components/dataTable/hooks/useDataTableStickyDividers.js

@@ -1 +1,29 @@
-import{useEffect as e}from"react";import{hasHorizontalScroll as t}from"../../../lib/utils/scroll/hasScroll.js";const l=({ref:l})=>(e(()=>{const e=l.current?.querySelector("[data-datatable-scrollable-container]");let r;if(e instanceof HTMLElement){const o=e=>{const r=t(e),o=e.querySelectorAll("[data-table-divider]"),a=e.querySelectorAll('[data-sticky="left"]').length>0;let n=0,s=0;if(a){const e=l.current?.querySelector("[data-datatable-left-shadow]");if(e){const t=window.getComputedStyle(e).getPropertyValue("z-index");t&&(n=parseInt(t,10))}}else e.querySelectorAll("[data-table-row]").forEach(e=>{e instanceof HTMLElement&&(s=Math.max(s,e.offsetWidth))});o.forEach(e=>{e instanceof HTMLElement&&(a?(e.style.position=r?"sticky":"",e.style.left=r?"0":"",e.style.zIndex=r?`${n+1}`:""):e.style.width=r?`${s}px`:"")})};o(e),r=new ResizeObserver(()=>{o(e)}),r.observe(e)}return()=>{r?.disconnect()}},[]),{});export{l as useDataTableStickyDividers};
+import { hasHorizontalScroll } from "../../../lib/utils/scroll/hasScroll.js";
+import { useEffect } from "react";
+const useDataTableStickyDividers = ({ ref: n }) => (useEffect(() => {
+	let t = n.current?.querySelector("[data-datatable-scrollable-container]"), r;
+	if (t instanceof HTMLElement) {
+		let i = (t) => {
+			let r = hasHorizontalScroll(t), i = t.querySelectorAll("[data-table-divider]"), a = t.querySelectorAll("[data-sticky=\"left\"]").length > 0, o = 0, s = 0;
+			if (a) {
+				let e = n.current?.querySelector("[data-datatable-left-shadow]");
+				if (e) {
+					let t = window.getComputedStyle(e).getPropertyValue("z-index");
+					t && (o = parseInt(t, 10));
+				}
+			} else t.querySelectorAll("[data-table-row]").forEach((e) => {
+				e instanceof HTMLElement && (s = Math.max(s, e.offsetWidth));
+			});
+			i.forEach((e) => {
+				e instanceof HTMLElement && (a ? (e.style.position = r ? "sticky" : "", e.style.left = r ? "0" : "", e.style.zIndex = r ? `${o + 1}` : "") : e.style.width = r ? `${s}px` : "");
+			});
+		};
+		i(t), r = new ResizeObserver(() => {
+			i(t);
+		}), r.observe(t);
+	}
+	return () => {
+		r?.disconnect();
+	};
+}, []), {});
+export { useDataTableStickyDividers };

package/dist/esm/components/dataTable/hooks/useDataTableStickyLeftColumns.js

@@ -1 +1,25 @@
-import{useEffect as e}from"react";import{hasHorizontalScroll as t}from"../../../lib/utils/scroll/hasScroll.js";const r=({ref:r})=>(e(()=>{const e=r.current?.querySelector("[data-datatable-scrollable-container]"),l=r.current?.querySelector("[data-datatable-left-shadow]");let o;if(e instanceof HTMLElement){const r=e=>{const r=t(e),o=e.querySelectorAll("[data-table-row]");let a=0;o.forEach(e=>{if(e instanceof HTMLElement){const t=Array.from(e.querySelectorAll('[data-sticky="left"]'));let l=0;t.forEach(e=>{e instanceof HTMLElement&&(e.style.left=r?`${l}px`:"auto",l+=e.offsetWidth)}),a=Math.max(a,l)}}),l instanceof HTMLElement&&(l.style.left=`${a}px`)};r(e),o=new ResizeObserver(()=>{r(e)}),o.observe(e)}return()=>{o?.disconnect()}},[]),{});export{r as useDataTableStickyLeftColumns};
+import { hasHorizontalScroll } from "../../../lib/utils/scroll/hasScroll.js";
+import { useEffect } from "react";
+const useDataTableStickyLeftColumns = ({ ref: n }) => (useEffect(() => {
+	let t = n.current?.querySelector("[data-datatable-scrollable-container]"), r = n.current?.querySelector("[data-datatable-left-shadow]"), i;
+	if (t instanceof HTMLElement) {
+		let n = (t) => {
+			let n = hasHorizontalScroll(t), i = t.querySelectorAll("[data-table-row]"), a = 0;
+			i.forEach((e) => {
+				if (e instanceof HTMLElement) {
+					let t = Array.from(e.querySelectorAll("[data-sticky=\"left\"]")), r = 0;
+					t.forEach((e) => {
+						e instanceof HTMLElement && (e.style.left = n ? `${r}px` : "auto", r += e.offsetWidth);
+					}), a = Math.max(a, r);
+				}
+			}), r instanceof HTMLElement && (r.style.left = `${a}px`);
+		};
+		n(t), i = new ResizeObserver(() => {
+			n(t);
+		}), i.observe(t);
+	}
+	return () => {
+		i?.disconnect();
+	};
+}, []), {});
+export { useDataTableStickyLeftColumns };

package/dist/esm/components/dataTable/hooks/useDataTableStickyRightColumns.js

@@ -1 +1,31 @@
-import{useEffect as t}from"react";import{hasHorizontalScroll as e,hasVerticalScroll as r}from"../../../lib/utils/scroll/hasScroll.js";const o=({ref:o})=>(t(()=>{const t=o.current?.querySelector("[data-datatable-scrollable-container]"),a=o.current?.querySelector("[data-datatable-right-shadow]");let l;if(t instanceof HTMLElement){const o=t=>{const o=e(t),l=t.querySelectorAll("[data-table-row]");let c=0;if(l.forEach(t=>{if(t instanceof HTMLElement){const e=Array.from(t.querySelectorAll('[data-sticky="true"], [data-sticky="right"]')).reverse();let r=0;e.forEach(t=>{t instanceof HTMLElement&&(t.style.right=o?`${r}px`:"auto",r+=t.offsetWidth)}),c=Math.max(c,r)}}),a instanceof HTMLElement){if(r(t)){const e=t.offsetWidth-t.clientWidth;c+=e}a.style.right=`${c}px`}};o(t),l=new ResizeObserver(()=>{o(t)}),l.observe(t)}return()=>{l?.disconnect()}},[]),{});export{o as useDataTableStickyRightColumns};
+import { hasHorizontalScroll, hasVerticalScroll } from "../../../lib/utils/scroll/hasScroll.js";
+import { useEffect } from "react";
+const useDataTableStickyRightColumns = ({ ref: r }) => (useEffect(() => {
+	let n = r.current?.querySelector("[data-datatable-scrollable-container]"), i = r.current?.querySelector("[data-datatable-right-shadow]"), a;
+	if (n instanceof HTMLElement) {
+		let r = (n) => {
+			let r = hasHorizontalScroll(n), a = n.querySelectorAll("[data-table-row]"), o = 0;
+			if (a.forEach((e) => {
+				if (e instanceof HTMLElement) {
+					let t = Array.from(e.querySelectorAll("[data-sticky=\"true\"], [data-sticky=\"right\"]")).reverse(), n = 0;
+					t.forEach((e) => {
+						e instanceof HTMLElement && (e.style.right = r ? `${n}px` : "auto", n += e.offsetWidth);
+					}), o = Math.max(o, n);
+				}
+			}), i instanceof HTMLElement) {
+				if (hasVerticalScroll(n)) {
+					let e = n.offsetWidth - n.clientWidth;
+					o += e;
+				}
+				i.style.right = `${o}px`;
+			}
+		};
+		r(n), a = new ResizeObserver(() => {
+			r(n);
+		}), a.observe(n);
+	}
+	return () => {
+		a?.disconnect();
+	};
+}, []), {});
+export { useDataTableStickyRightColumns };

package/dist/esm/components/dataTable/utils/cellConfig.js

@@ -1 +1,2 @@
-const o=({cellConfig:o})=>({...o});export{o as applyFlexToCell};
+const applyFlexToCell = ({ cellConfig: e }) => ({ ...e });
+export { applyFlexToCell };

package/dist/esm/components/dataTable/utils/hoverable.js

@@ -1 +1,5 @@
-const e=({hoverable:e,hoverableRows:o,nonHoverableRows:d,row:i})=>{let l;return o?l=Boolean(i.id&&o.includes(i.id)):d?l=!(i.id&&d.includes(i.id)):void 0!==e&&(l=e),l};export{e as isRowHoverable};
+const isRowHoverable = ({ hoverable: e, hoverableRows: t, nonHoverableRows: n, row: r }) => {
+	let i;
+	return t ? i = !!(r.id && t.includes(r.id)) : n ? i = !(r.id && n.includes(r.id)) : e !== void 0 && (i = e), i;
+};
+export { isRowHoverable };

package/dist/esm/components/dataTable/utils/rowConfig.js

@@ -1 +1,2 @@
-const o=({rowConfig:o})=>({...o});export{o as applyGridToRow};
+const applyGridToRow = ({ rowConfig: e }) => ({ ...e });
+export { applyGridToRow };

package/dist/esm/components/dataTable/utils/tableConfig.js

@@ -1 +1,2 @@
-const o=({tableConfig:o})=>({...o}),t=({tableConfig:o})=>({...o});export{t as applyPositionToWrapper,o as applyZIndexToWrapper};
+const applyZIndexToWrapper = ({ tableConfig: e }) => ({ ...e }), applyPositionToWrapper = ({ tableConfig: e }) => ({ ...e });
+export { applyPositionToWrapper, applyZIndexToWrapper };

package/dist/esm/components/dot/dot.js

@@ -1,2 +1,23 @@
-import{jsx as a}from"react/jsx-runtime";import{forwardRef as s}from"react";import{useClassName as e}from"../../lib/hooks/useClassName/useClassName.js";import{DotStandAlone as t}from"./dotStandAlone.js";const o=s(({additionalSizeClasses:s,additionalVariantClasses:o,maxNumber:r,number:i,size:n,variant:m,...l},d)=>{const p=e({additionalClassNames:o,component:"DOT",variant:m}),u=e({additionalClassNames:s,component:"DOT",variant:n}),c="number"==typeof i?"number"==typeof r&&i>r?`+${r}`:i.toString():void 0;/* @__PURE__ */
-return a(t,{...l,ref:d,cssSizeClasses:u,cssVariantClasses:p,formatedNumber:c})});export{o as Dot};
+import { useClassName } from "../../lib/hooks/useClassName/useClassName.js";
+import { DotStandAlone } from "./dotStandAlone.js";
+import { forwardRef } from "react";
+import { jsx } from "react/jsx-runtime";
+const Dot = forwardRef(({ additionalSizeClasses: e, additionalVariantClasses: t, maxNumber: n, number: r, size: i, variant: a, ...o }, s) => {
+	let c = useClassName({
+		additionalClassNames: t,
+		component: "DOT",
+		variant: a
+	}), l = useClassName({
+		additionalClassNames: e,
+		component: "DOT",
+		variant: i
+	}), u = typeof r == "number" ? typeof n == "number" && r > n ? `+${n}` : r.toString() : void 0;
+	return /* @__PURE__ */ jsx(DotStandAlone, {
+		...o,
+		ref: s,
+		cssSizeClasses: l,
+		cssVariantClasses: c,
+		formatedNumber: u
+	});
+});
+export { Dot };

package/dist/esm/components/dot/dotStandAlone.js

@@ -1,2 +1,19 @@
-import{jsxs as t}from"react/jsx-runtime";import{forwardRef as s}from"react";import{classNames as e}from"../../lib/utils/classNames/classNames.js";import{pickCustomAttributes as i}from"../../lib/utils/pickCustomAttributes/pickCustomAttributes.js";const r=s(({cssSizeClasses:s,cssVariantClasses:r,formatedNumber:o,height:a,label:m,width:l,...c},d)=>{const u=i(c);/* @__PURE__ */
-return t("span",{ref:d,className:e(s?.dot,r?.dot),"data-testid":"dot",style:a||l?{height:a,width:l}:void 0,...u,children:[m,o]})});export{r as DotStandAlone};
+import { pickCustomAttributes } from "../../lib/utils/pickCustomAttributes/pickCustomAttributes.js";
+import { classNames } from "../../lib/utils/classNames/classNames.js";
+import { forwardRef } from "react";
+import { jsxs } from "react/jsx-runtime";
+const DotStandAlone = forwardRef(({ cssSizeClasses: e, cssVariantClasses: t, formatedNumber: n, height: r, label: i, width: a, ...o }, s) => {
+	let c = pickCustomAttributes(o);
+	return /* @__PURE__ */ jsxs("span", {
+		ref: s,
+		className: classNames(e?.dot, t?.dot),
+		"data-testid": "dot",
+		style: r || a ? {
+			height: r,
+			width: a
+		} : void 0,
+		...c,
+		children: [i, n]
+	});
+});
+export { DotStandAlone };

package/dist/esm/components/icon/icon.js

@@ -1,3 +1,52 @@
-import{jsxs as t,jsx as e}from"react/jsx-runtime";import{forwardRef as s}from"react";import{ScreenReaderOnly as i}from"../../lib/components/screen-reader-only/screenReaderOnly.js";import{useClassName as a}from"../../lib/hooks/useClassName/useClassName.js";import{classNames as o}from"../../lib/utils/classNames/classNames.js";import{pickCustomAttributes as l}from"../../lib/utils/pickCustomAttributes/pickCustomAttributes.js";import{IconStandAlone as r}from"./iconStandAlone.js";const n=s(({className:s,color:n,height:c,icon:d,id:m,tabIndex:b,title:u,width:h,...p},f)=>{const{altText:C,disabled:N,onClick:j,screenReaderText:x,...k}=p,I=l(p),y=!(Object.keys(p).includes("color")&&!n||!n),g=a({component:"ICON"});return d?j?/* @__PURE__ */t("button",{"aria-disabled":N,"aria-label":p["aria-label"]||C,className:o(g.button,s),"data-testid":"button",disabled:N,id:m,style:{height:c,width:h},tabIndex:b,title:u||"",type:"button",onClick:j,...I,children:[
-/* @__PURE__ */e(i,{children:x}),
-/* @__PURE__ */e(r,{icon:d,...k,ref:f,"aria-label":void 0,className:s,cssClasses:g,"data-testid":void 0,height:c,id:void 0,linearIcon:y,width:h})]}):/* @__PURE__ */e(r,{icon:d,...k,ref:f,altText:C,className:s,cssClasses:g,"data-testid":"icon",height:c,linearIcon:y,width:h}):null});export{n as Icon,n as IconBasic};
+import { pickCustomAttributes } from "../../lib/utils/pickCustomAttributes/pickCustomAttributes.js";
+import { useClassName } from "../../lib/hooks/useClassName/useClassName.js";
+import { classNames } from "../../lib/utils/classNames/classNames.js";
+import { ScreenReaderOnly } from "../../lib/components/screen-reader-only/screenReaderOnly.js";
+import { IconStandAlone } from "./iconStandAlone.js";
+import { forwardRef } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+const IconBasic = forwardRef(({ className: e, color: t, height: n, icon: r, id: i, tabIndex: a, title: o, width: s, ...c }, l) => {
+	let { altText: u, disabled: d, onClick: f, screenReaderText: p, ...m } = c, h = pickCustomAttributes(c), g = !(Object.keys(c).includes("color") && !t) && !!t, _ = useClassName({ component: "ICON" });
+	return r ? f ? /* @__PURE__ */ jsxs("button", {
+		"aria-disabled": d,
+		"aria-label": c["aria-label"] || u,
+		className: classNames(_.button, e),
+		"data-testid": "button",
+		disabled: d,
+		id: i,
+		style: {
+			height: n,
+			width: s
+		},
+		tabIndex: a,
+		title: o || "",
+		type: "button",
+		onClick: f,
+		...h,
+		children: [/* @__PURE__ */ jsx(ScreenReaderOnly, { children: p }), /* @__PURE__ */ jsx(IconStandAlone, {
+			icon: r,
+			...m,
+			ref: l,
+			"aria-label": void 0,
+			className: e,
+			cssClasses: _,
+			"data-testid": void 0,
+			height: n,
+			id: void 0,
+			linearIcon: g,
+			width: s
+		})]
+	}) : /* @__PURE__ */ jsx(IconStandAlone, {
+		icon: r,
+		...m,
+		ref: l,
+		altText: u,
+		className: e,
+		cssClasses: _,
+		"data-testid": "icon",
+		height: n,
+		linearIcon: g,
+		width: s
+	}) : null;
+});
+export { IconBasic };