@rio-cloud/rio-uikit 2.2.1 → 2.3.0-beta.2

package/components/table/render/header/TableColumnFilter.d.ts

@@ -0,0 +1,66 @@
+import { HTMLAttributes, ReactNode } from 'react';
+import { ButtonDropdownProps } from '../../../dropdown/ButtonDropdown';
+export type TableColumnFilterProps = Omit<HTMLAttributes<HTMLDivElement>, 'children' | 'className' | 'onClick' | 'role'> & {
+    /**
+     * Custom dropdown content rendered below the filter trigger.
+     */
+    children?: ReactNode;
+    /**
+     * Optional classes for the outer dropdown component.
+     */
+    className?: ButtonDropdownProps['className'];
+    /**
+     * Optional classes for the dropdown menu.
+     */
+    dropdownClassName?: ButtonDropdownProps['dropdownClassName'];
+    /**
+     * Optional DOM id for the dropdown trigger.
+     */
+    id?: ButtonDropdownProps['id'];
+    /**
+     * Called when the dropdown closes.
+     */
+    onClose?: ButtonDropdownProps['onClose'];
+    /**
+     * Called when the dropdown opens.
+     */
+    onOpen?: ButtonDropdownProps['onOpen'];
+    /**
+     * Controlled open state for the dropdown.
+     */
+    open?: ButtonDropdownProps['open'];
+    /**
+     * Optional Popper configuration passed to the underlying dropdown.
+     */
+    popperConfig?: ButtonDropdownProps['popperConfig'];
+    /**
+     * Aligns the dropdown menu to the right side of the trigger.
+     *
+     * @default true
+     */
+    pullRight?: ButtonDropdownProps['pullRight'];
+    /**
+     * Optional classes for the dropdown toggle button.
+     */
+    toggleClassName?: ButtonDropdownProps['toggleClassName'];
+    /**
+     * Renders the dropdown through a portal.
+     *
+     * @default true
+     */
+    usePortal?: ButtonDropdownProps['usePortal'];
+    /**
+     * Renders the active filter icon variant.
+     *
+     * @default false
+     */
+    active?: boolean;
+    /**
+     * Optional number of currently active filters shown next to the filter icon.
+     *
+     * @default 0
+     */
+    activeCount?: number;
+};
+declare const TableColumnFilter: (props: TableColumnFilterProps) => import("react/jsx-runtime").JSX.Element;
+export default TableColumnFilter;

package/components/table/render/header/TableColumnFilter.js

@@ -0,0 +1,72 @@
+import { jsx as s, jsxs as w } from "react/jsx-runtime";
+import { useState as y, useEffect as E } from "react";
+import L from "../../../../utils/classNames.js";
+import S from "../../../dropdown/ButtonDropdown.js";
+import { TABLE_HORIZONTAL_SCROLL_EVENT as p } from "../../layout/useHorizontalSectionSync.js";
+const j = (d) => {
+  const {
+    activeCount: a = 0,
+    active: c = !1,
+    children: m,
+    className: f,
+    dropdownClassName: u,
+    id: g,
+    onClose: o,
+    onOpen: h,
+    open: i,
+    popperConfig: v,
+    pullRight: C = !0,
+    toggleClassName: N,
+    usePortal: O = !0,
+    ...b
+  } = d, [x, n] = y(!1), e = i !== void 0, r = e ? i : x, l = a > 0;
+  return E(() => {
+    const t = () => {
+      r && (e || n(!1), o?.());
+    };
+    return window.addEventListener(p, t), () => window.removeEventListener(p, t);
+  }, [e, r, o]), /* @__PURE__ */ s(
+    S,
+    {
+      ...b,
+      id: g,
+      title: /* @__PURE__ */ w("span", { className: "display-flex gap-0 align-items-center text-color-dark", children: [
+        /* @__PURE__ */ s(
+          "span",
+          {
+            className: `text-size-16 rioglyph ${c ? "rioglyph-filter-active" : "rioglyph-filter"}`,
+            "aria-hidden": "true"
+          }
+        ),
+        l && /* @__PURE__ */ s("span", { className: "text-medium", children: a })
+      ] }),
+      bsStyle: "default",
+      variant: "outline",
+      bsSize: "xs",
+      noCaret: !0,
+      iconOnly: !l,
+      open: r,
+      onOpen: (t) => {
+        e || n(!0), h?.(t);
+      },
+      onClose: () => {
+        e || n(!1), o?.();
+      },
+      pullRight: C,
+      usePortal: O,
+      className: f,
+      popperConfig: v,
+      toggleClassName: L(
+        "table-head-filter-button no-hover-scale border-color-light bg-decent hover-bg-lighter rounded-small",
+        l && "padding-left-2",
+        N
+      ),
+      dropdownClassName: u,
+      customDropdown: m
+    }
+  );
+};
+export {
+  j as default
+};
+//# sourceMappingURL=TableColumnFilter.js.map

package/components/table/render/header/TableColumnFilter.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableColumnFilter.js","sources":["../../../../../src/components/table/render/header/TableColumnFilter.tsx"],"sourcesContent":["import { useEffect, useState, type HTMLAttributes, type ReactNode } from 'react';\n\nimport classNames from '../../../../utils/classNames';\nimport ButtonDropdown, { type ButtonDropdownProps } from '../../../dropdown/ButtonDropdown';\nimport { TABLE_HORIZONTAL_SCROLL_EVENT } from '../../layout/useHorizontalSectionSync';\n\nexport type TableColumnFilterProps = Omit<\n    HTMLAttributes<HTMLDivElement>,\n    'children' | 'className' | 'onClick' | 'role'\n> & {\n    /**\n     * Custom dropdown content rendered below the filter trigger.\n     */\n    children?: ReactNode;\n\n    /**\n     * Optional classes for the outer dropdown component.\n     */\n    className?: ButtonDropdownProps['className'];\n\n    /**\n     * Optional classes for the dropdown menu.\n     */\n    dropdownClassName?: ButtonDropdownProps['dropdownClassName'];\n\n    /**\n     * Optional DOM id for the dropdown trigger.\n     */\n    id?: ButtonDropdownProps['id'];\n\n    /**\n     * Called when the dropdown closes.\n     */\n    onClose?: ButtonDropdownProps['onClose'];\n\n    /**\n     * Called when the dropdown opens.\n     */\n    onOpen?: ButtonDropdownProps['onOpen'];\n\n    /**\n     * Controlled open state for the dropdown.\n     */\n    open?: ButtonDropdownProps['open'];\n\n    /**\n     * Optional Popper configuration passed to the underlying dropdown.\n     */\n    popperConfig?: ButtonDropdownProps['popperConfig'];\n\n    /**\n     * Aligns the dropdown menu to the right side of the trigger.\n     *\n     * @default true\n     */\n    pullRight?: ButtonDropdownProps['pullRight'];\n\n    /**\n     * Optional classes for the dropdown toggle button.\n     */\n    toggleClassName?: ButtonDropdownProps['toggleClassName'];\n\n    /**\n     * Renders the dropdown through a portal.\n     *\n     * @default true\n     */\n    usePortal?: ButtonDropdownProps['usePortal'];\n\n    /**\n     * Renders the active filter icon variant.\n     *\n     * @default false\n     */\n    active?: boolean;\n\n    /**\n     * Optional number of currently active filters shown next to the filter icon.\n     *\n     * @default 0\n     */\n    activeCount?: number;\n};\n\nconst TableColumnFilter = (props: TableColumnFilterProps) => {\n    const {\n        activeCount = 0,\n        active = false,\n        children,\n        className,\n        dropdownClassName,\n        id,\n        onClose,\n        onOpen,\n        open,\n        popperConfig,\n        pullRight = true,\n        toggleClassName,\n        usePortal = true,\n        ...remainingProps\n    } = props;\n\n    const [internalOpen, setInternalOpen] = useState(false);\n\n    const isControlled = open !== undefined;\n    const isOpen = isControlled ? open : internalOpen;\n    const hasActiveFilters = activeCount > 0;\n\n    useEffect(() => {\n        const handleHorizontalScroll = () => {\n            if (!isOpen) {\n                return;\n            }\n\n            if (!isControlled) {\n                setInternalOpen(false);\n            }\n\n            onClose?.();\n        };\n\n        window.addEventListener(TABLE_HORIZONTAL_SCROLL_EVENT, handleHorizontalScroll);\n\n        return () => window.removeEventListener(TABLE_HORIZONTAL_SCROLL_EVENT, handleHorizontalScroll);\n    }, [isControlled, isOpen, onClose]);\n\n    return (\n        <ButtonDropdown\n            {...remainingProps}\n            id={id}\n            title={\n                <span className='display-flex gap-0 align-items-center text-color-dark'>\n                    <span\n                        className={`text-size-16 rioglyph ${active ? 'rioglyph-filter-active' : 'rioglyph-filter'}`}\n                        aria-hidden='true'\n                    />\n                    {hasActiveFilters && <span className='text-medium'>{activeCount}</span>}\n                </span>\n            }\n            bsStyle='default'\n            variant='outline'\n            bsSize='xs'\n            noCaret\n            iconOnly={!hasActiveFilters}\n            open={isOpen}\n            onOpen={event => {\n                if (!isControlled) {\n                    setInternalOpen(true);\n                }\n\n                onOpen?.(event);\n            }}\n            onClose={() => {\n                if (!isControlled) {\n                    setInternalOpen(false);\n                }\n\n                onClose?.();\n            }}\n            pullRight={pullRight}\n            usePortal={usePortal}\n            className={className}\n            popperConfig={popperConfig}\n            toggleClassName={classNames(\n                'table-head-filter-button no-hover-scale border-color-light bg-decent hover-bg-lighter rounded-small',\n                hasActiveFilters && 'padding-left-2',\n                toggleClassName\n            )}\n            dropdownClassName={dropdownClassName}\n            customDropdown={children}\n        />\n    );\n};\n\nexport default TableColumnFilter;\n"],"names":["TableColumnFilter","props","activeCount","active","children","className","dropdownClassName","id","onClose","onOpen","open","popperConfig","pullRight","toggleClassName","usePortal","remainingProps","internalOpen","setInternalOpen","useState","isControlled","isOpen","hasActiveFilters","useEffect","handleHorizontalScroll","TABLE_HORIZONTAL_SCROLL_EVENT","jsx","ButtonDropdown","jsxs","event","classNames"],"mappings":";;;;;AAoFA,MAAMA,IAAoB,CAACC,MAAkC;AACzD,QAAM;AAAA,IACF,aAAAC,IAAc;AAAA,IACd,QAAAC,IAAS;AAAA,IACT,UAAAC;AAAA,IACA,WAAAC;AAAA,IACA,mBAAAC;AAAA,IACA,IAAAC;AAAA,IACA,SAAAC;AAAA,IACA,QAAAC;AAAA,IACA,MAAAC;AAAA,IACA,cAAAC;AAAA,IACA,WAAAC,IAAY;AAAA,IACZ,iBAAAC;AAAA,IACA,WAAAC,IAAY;AAAA,IACZ,GAAGC;AAAA,EAAA,IACHd,GAEE,CAACe,GAAcC,CAAe,IAAIC,EAAS,EAAK,GAEhDC,IAAeT,MAAS,QACxBU,IAASD,IAAeT,IAAOM,GAC/BK,IAAmBnB,IAAc;AAEvC,SAAAoB,EAAU,MAAM;AACZ,UAAMC,IAAyB,MAAM;AACjC,MAAKH,MAIAD,KACDF,EAAgB,EAAK,GAGzBT,IAAA;AAAA,IACJ;AAEA,kBAAO,iBAAiBgB,GAA+BD,CAAsB,GAEtE,MAAM,OAAO,oBAAoBC,GAA+BD,CAAsB;AAAA,EACjG,GAAG,CAACJ,GAAcC,GAAQZ,CAAO,CAAC,GAG9B,gBAAAiB;AAAA,IAACC;AAAA,IAAA;AAAA,MACI,GAAGX;AAAA,MACJ,IAAAR;AAAA,MACA,OACI,gBAAAoB,EAAC,QAAA,EAAK,WAAU,yDACZ,UAAA;AAAA,QAAA,gBAAAF;AAAA,UAAC;AAAA,UAAA;AAAA,YACG,WAAW,yBAAyBtB,IAAS,2BAA2B,iBAAiB;AAAA,YACzF,eAAY;AAAA,UAAA;AAAA,QAAA;AAAA,QAEfkB,KAAoB,gBAAAI,EAAC,QAAA,EAAK,WAAU,eAAe,UAAAvB,EAAA,CAAY;AAAA,MAAA,GACpE;AAAA,MAEJ,SAAQ;AAAA,MACR,SAAQ;AAAA,MACR,QAAO;AAAA,MACP,SAAO;AAAA,MACP,UAAU,CAACmB;AAAA,MACX,MAAMD;AAAA,MACN,QAAQ,CAAAQ,MAAS;AACb,QAAKT,KACDF,EAAgB,EAAI,GAGxBR,IAASmB,CAAK;AAAA,MAClB;AAAA,MACA,SAAS,MAAM;AACX,QAAKT,KACDF,EAAgB,EAAK,GAGzBT,IAAA;AAAA,MACJ;AAAA,MACA,WAAAI;AAAA,MACA,WAAAE;AAAA,MACA,WAAAT;AAAA,MACA,cAAAM;AAAA,MACA,iBAAiBkB;AAAA,QACb;AAAA,QACAR,KAAoB;AAAA,QACpBR;AAAA,MAAA;AAAA,MAEJ,mBAAAP;AAAA,MACA,gBAAgBF;AAAA,IAAA;AAAA,EAAA;AAG5B;"}

package/components/table/render/header/TableDraggableHeaderCell.d.ts

@@ -0,0 +1,4 @@
+import { TableRowData } from '../../Table.types';
+import { SharedHeaderCellProps } from './TableHeader.types';
+declare const TableDraggableHeaderCell: (props: SharedHeaderCellProps<TableRowData>) => import("react/jsx-runtime").JSX.Element;
+export default TableDraggableHeaderCell;

package/components/table/render/header/TableDraggableHeaderCell.js

@@ -0,0 +1,64 @@
+import { jsxs as y, jsx as s } from "react/jsx-runtime";
+import { useSortable as A } from "@dnd-kit/sortable";
+import h from "./TableHeaderCellContent.js";
+import H from "./TableHeaderCellResizeHandle.js";
+import { resolveAriaSort as R } from "./resolveAriaSort.js";
+import { resolveHeaderCellClassName as w } from "./resolveHeaderCellClassName.js";
+import { resolveHeaderCellStyle as k } from "./resolveHeaderCellStyle.js";
+import { resolveAriaSpan as n, resolveAriaColIndex as D } from "../../shared/resolveTableAria.js";
+const P = (r) => {
+  const {
+    column: e,
+    header: m,
+    hideWhileDragging: t,
+    htmlAttributes: c,
+    isResizable: d,
+    showSelectionColumn: a,
+    stickyLeftColumnCount: u
+  } = r, l = u ?? 0, i = e.columnKey ?? String(e.key), { attributes: f, listeners: p, setActivatorNodeRef: g, setNodeRef: v, transform: o, transition: C, isDragging: b } = A({
+    id: i
+  }), { role: N, ...S } = f, x = {
+    ...S,
+    ...p
+  };
+  return /* @__PURE__ */ y(
+    "div",
+    {
+      ref: v,
+      ...c,
+      className: w(e, m, {
+        isDraggable: !0,
+        isDragging: b,
+        isResizable: d,
+        isStickyLeftColumn: l > 0 && e.columnStart <= l
+      }),
+      "data-column": i,
+      role: "columnheader",
+      "aria-colindex": D(e.columnStart, a),
+      "aria-colspan": n(e.colSpan),
+      "aria-rowindex": e.rowStart,
+      "aria-rowspan": n(e.rowSpan),
+      "aria-sort": R(e),
+      style: k(e, a, {
+        pointerEvents: t ? "none" : void 0,
+        transform: t ? void 0 : o ? `translate3d(${o.x}px, ${o.y}px, 0)` : void 0,
+        transition: C
+      }),
+      children: [
+        /* @__PURE__ */ s(
+          h,
+          {
+            ...r,
+            dragActivatorProps: x,
+            dragActivatorRef: g
+          }
+        ),
+        /* @__PURE__ */ s(H, { ...r })
+      ]
+    }
+  );
+};
+export {
+  P as default
+};
+//# sourceMappingURL=TableDraggableHeaderCell.js.map

package/components/table/render/header/TableDraggableHeaderCell.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableDraggableHeaderCell.js","sources":["../../../../../src/components/table/render/header/TableDraggableHeaderCell.tsx"],"sourcesContent":["import { useSortable } from '@dnd-kit/sortable';\n\nimport type { TableRowData } from '../../Table.types';\nimport TableHeaderCellContent from './TableHeaderCellContent';\nimport TableHeaderCellResizeHandle from './TableHeaderCellResizeHandle';\nimport { resolveAriaSort } from './resolveAriaSort';\nimport { resolveHeaderCellClassName } from './resolveHeaderCellClassName';\nimport { resolveHeaderCellStyle } from './resolveHeaderCellStyle';\nimport type { SharedHeaderCellProps } from './TableHeader.types';\nimport { resolveAriaColIndex, resolveAriaSpan } from '../../shared/resolveTableAria';\n\nconst TableDraggableHeaderCell = (props: SharedHeaderCellProps<TableRowData>) => {\n    const {\n        column,\n        header,\n        hideWhileDragging,\n        htmlAttributes,\n        isResizable,\n        showSelectionColumn,\n        stickyLeftColumnCount,\n    } = props;\n\n    const stickyLeftColumns = stickyLeftColumnCount ?? 0;\n\n    const columnKey = column.columnKey ?? String(column.key);\n\n    const { attributes, listeners, setActivatorNodeRef, setNodeRef, transform, transition, isDragging } = useSortable({\n        id: columnKey,\n    });\n\n    const { role: _sortableRole, ...sortableAttributes } = attributes;\n\n    const dragActivatorProps = {\n        ...sortableAttributes,\n        ...listeners,\n    };\n\n    return (\n        <div\n            ref={setNodeRef}\n            {...htmlAttributes}\n            className={resolveHeaderCellClassName(column, header, {\n                isDraggable: true,\n                isDragging,\n                isResizable,\n                isStickyLeftColumn: stickyLeftColumns > 0 && column.columnStart <= stickyLeftColumns,\n            })}\n            data-column={columnKey}\n            role='columnheader'\n            aria-colindex={resolveAriaColIndex(column.columnStart, showSelectionColumn)}\n            aria-colspan={resolveAriaSpan(column.colSpan)}\n            aria-rowindex={column.rowStart}\n            aria-rowspan={resolveAriaSpan(column.rowSpan)}\n            aria-sort={resolveAriaSort(column)}\n            style={resolveHeaderCellStyle(column, showSelectionColumn, {\n                pointerEvents: hideWhileDragging ? 'none' : undefined,\n                transform: hideWhileDragging\n                    ? undefined\n                    : transform\n                      ? `translate3d(${transform.x}px, ${transform.y}px, 0)`\n                      : undefined,\n                transition,\n            })}\n        >\n            <TableHeaderCellContent\n                {...props}\n                dragActivatorProps={dragActivatorProps}\n                dragActivatorRef={setActivatorNodeRef}\n            />\n            <TableHeaderCellResizeHandle {...props} />\n        </div>\n    );\n};\n\nexport default TableDraggableHeaderCell;\n"],"names":["TableDraggableHeaderCell","props","column","header","hideWhileDragging","htmlAttributes","isResizable","showSelectionColumn","stickyLeftColumnCount","stickyLeftColumns","columnKey","attributes","listeners","setActivatorNodeRef","setNodeRef","transform","transition","isDragging","useSortable","_sortableRole","sortableAttributes","dragActivatorProps","jsxs","resolveHeaderCellClassName","resolveAriaColIndex","resolveAriaSpan","resolveAriaSort","resolveHeaderCellStyle","jsx","TableHeaderCellContent","TableHeaderCellResizeHandle"],"mappings":";;;;;;;;AAWA,MAAMA,IAA2B,CAACC,MAA+C;AAC7E,QAAM;AAAA,IACF,QAAAC;AAAA,IACA,QAAAC;AAAA,IACA,mBAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,aAAAC;AAAA,IACA,qBAAAC;AAAA,IACA,uBAAAC;AAAA,EAAA,IACAP,GAEEQ,IAAoBD,KAAyB,GAE7CE,IAAYR,EAAO,aAAa,OAAOA,EAAO,GAAG,GAEjD,EAAE,YAAAS,GAAY,WAAAC,GAAW,qBAAAC,GAAqB,YAAAC,GAAY,WAAAC,GAAW,YAAAC,GAAY,YAAAC,EAAA,IAAeC,EAAY;AAAA,IAC9G,IAAIR;AAAA,EAAA,CACP,GAEK,EAAE,MAAMS,GAAe,GAAGC,MAAuBT,GAEjDU,IAAqB;AAAA,IACvB,GAAGD;AAAA,IACH,GAAGR;AAAA,EAAA;AAGP,SACI,gBAAAU;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,KAAKR;AAAA,MACJ,GAAGT;AAAA,MACJ,WAAWkB,EAA2BrB,GAAQC,GAAQ;AAAA,QAClD,aAAa;AAAA,QACb,YAAAc;AAAA,QACA,aAAAX;AAAA,QACA,oBAAoBG,IAAoB,KAAKP,EAAO,eAAeO;AAAA,MAAA,CACtE;AAAA,MACD,eAAaC;AAAA,MACb,MAAK;AAAA,MACL,iBAAec,EAAoBtB,EAAO,aAAaK,CAAmB;AAAA,MAC1E,gBAAckB,EAAgBvB,EAAO,OAAO;AAAA,MAC5C,iBAAeA,EAAO;AAAA,MACtB,gBAAcuB,EAAgBvB,EAAO,OAAO;AAAA,MAC5C,aAAWwB,EAAgBxB,CAAM;AAAA,MACjC,OAAOyB,EAAuBzB,GAAQK,GAAqB;AAAA,QACvD,eAAeH,IAAoB,SAAS;AAAA,QAC5C,WAAWA,IACL,SACAW,IACE,eAAeA,EAAU,CAAC,OAAOA,EAAU,CAAC,WAC5C;AAAA,QACR,YAAAC;AAAA,MAAA,CACH;AAAA,MAED,UAAA;AAAA,QAAA,gBAAAY;AAAA,UAACC;AAAA,UAAA;AAAA,YACI,GAAG5B;AAAA,YACJ,oBAAAoB;AAAA,YACA,kBAAkBR;AAAA,UAAA;AAAA,QAAA;AAAA,QAEtB,gBAAAe,EAACE,GAAA,EAA6B,GAAG7B,EAAA,CAAO;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGpD;"}

package/components/table/render/header/TableHeader.types.d.ts

@@ -0,0 +1,37 @@
+import { DragEndEvent } from '@dnd-kit/core';
+import { HTMLAttributes, MouseEvent as ReactMouseEvent, PointerEvent as ReactPointerEvent, ReactNode, Ref } from 'react';
+import { TableViewHeader } from '../../model/tableView.types';
+import { TableHtmlAttributes, TableRowData, TableSortDirection } from '../../Table.types';
+export type HeaderColumn<RowType extends TableRowData = TableRowData> = TableViewHeader<RowType>['columns'][number];
+export type TableHeaderSectionProps<RowType extends TableRowData = TableRowData> = {
+    header: TableViewHeader<RowType>;
+    headerClassName?: string;
+    draggableColumnKeys?: string[];
+    isAllSelected?: boolean;
+    isSomeRowsSelected?: boolean;
+    lastResizableColumnKey?: string;
+    onColumnDragEnd?: (event: DragEndEvent) => void;
+    onColumnResizeReset?: (columnKey: string) => void;
+    onColumnResizeStart?: (columnKey: string, event: ReactPointerEvent<HTMLDivElement>) => void;
+    onToggleAllSelection?: () => void;
+    selectionHeaderContent?: ReactNode;
+    showSelectionColumn?: boolean;
+    stickyLeftColumnCount?: number;
+    tableHeadRowRef: Ref<HTMLDivElement>;
+    onSortChange?: (columnKey: string, direction: TableSortDirection, event: ReactMouseEvent<HTMLButtonElement>) => void;
+};
+export type SharedHeaderCellProps<RowType extends TableRowData = TableRowData> = {
+    column: HeaderColumn<RowType>;
+    header: TableViewHeader<RowType>;
+    dragActivatorProps?: HTMLAttributes<HTMLSpanElement>;
+    dragActivatorRef?: Ref<HTMLSpanElement>;
+    htmlAttributes?: TableHtmlAttributes;
+    hideWhileDragging?: boolean;
+    hasResettableWidth?: boolean;
+    isResizable: boolean;
+    onColumnResizeReset?: (columnKey: string) => void;
+    onColumnResizeStart?: (columnKey: string, event: ReactPointerEvent<HTMLDivElement>) => void;
+    onSortChange?: (columnKey: string, direction: TableSortDirection, event: ReactMouseEvent<HTMLButtonElement>) => void;
+    showSelectionColumn?: boolean;
+    stickyLeftColumnCount?: number;
+};

package/components/table/render/header/TableHeaderCellContent.d.ts

@@ -0,0 +1,4 @@
+import { TableRowData } from '../../Table.types';
+import { SharedHeaderCellProps } from './TableHeader.types';
+declare const TableHeaderCellContent: (props: SharedHeaderCellProps<TableRowData>) => import("react/jsx-runtime").JSX.Element;
+export default TableHeaderCellContent;

package/components/table/render/header/TableHeaderCellContent.js

@@ -0,0 +1,57 @@
+import { jsxs as r, jsx as a } from "react/jsx-runtime";
+import l from "../../../../utils/classNames.js";
+import p from "../../SortArrows.js";
+const u = (c) => {
+  const { column: e, dragActivatorProps: t, dragActivatorRef: n, hideWhileDragging: d, onSortChange: b } = c, i = e.hideLabel && typeof e.label == "string" ? e.label : void 0, s = e.hideLabel ? null : e.icon ? /* @__PURE__ */ r("span", { className: "display-inline-flex align-items-center gap-5", children: [
+    /* @__PURE__ */ a("span", { className: l("text-color-dark rioglyph", e.icon) }),
+    /* @__PURE__ */ a("span", { children: e.label })
+  ] }) : e.label, o = s === null ? null : /* @__PURE__ */ a("span", { className: "table-head-label", children: s });
+  return /* @__PURE__ */ a("div", { className: l("table-head-cell-content", d && "table-head-cell-content-hidden"), children: /* @__PURE__ */ r("div", { className: "table-head-cell-content-row", children: [
+    e.sortable ? /* @__PURE__ */ r(
+      "button",
+      {
+        type: "button",
+        className: l("table-head-button", e.filter && "table-head-button-has-filter"),
+        "aria-label": i,
+        onClick: (h) => b?.(
+          e.columnKey ?? String(e.key),
+          e.sortDirection === "asc" ? "desc" : "asc",
+          h
+        ),
+        children: [
+          /* @__PURE__ */ a(p, { direction: e.sortDirection }),
+          /* @__PURE__ */ a(
+            "span",
+            {
+              ref: n,
+              className: l(
+                "table-head-button-label",
+                t && "table-head-drag-label"
+              ),
+              ...t,
+              children: o
+            }
+          )
+        ]
+      }
+    ) : /* @__PURE__ */ a(
+      "span",
+      {
+        ref: n,
+        className: l(
+          "table-head-label-wrapper",
+          e.filter && "table-head-label-wrapper-has-filter",
+          t && "table-head-drag-label"
+        ),
+        "aria-label": i,
+        ...t,
+        children: o
+      }
+    ),
+    e.filter && /* @__PURE__ */ a("span", { className: "table-head-filter", children: e.filter })
+  ] }) });
+};
+export {
+  u as default
+};
+//# sourceMappingURL=TableHeaderCellContent.js.map

package/components/table/render/header/TableHeaderCellContent.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableHeaderCellContent.js","sources":["../../../../../src/components/table/render/header/TableHeaderCellContent.tsx"],"sourcesContent":["import classNames from '../../../../utils/classNames';\nimport SortArrows from '../../SortArrows';\nimport type { TableRowData } from '../../Table.types';\nimport type { SharedHeaderCellProps } from './TableHeader.types';\n\nconst TableHeaderCellContent = (props: SharedHeaderCellProps<TableRowData>) => {\n    const { column, dragActivatorProps, dragActivatorRef, hideWhileDragging, onSortChange } = props;\n\n    const ariaLabel = column.hideLabel && typeof column.label === 'string' ? column.label : undefined;\n\n    const labelContent = column.hideLabel ? null : column.icon ? (\n        <span className='display-inline-flex align-items-center gap-5'>\n            <span className={classNames('text-color-dark rioglyph', column.icon)} />\n            <span>{column.label}</span>\n        </span>\n    ) : (\n        column.label\n    );\n\n    const wrappedLabelContent = labelContent === null ? null : <span className='table-head-label'>{labelContent}</span>;\n\n    return (\n        <div className={classNames('table-head-cell-content', hideWhileDragging && 'table-head-cell-content-hidden')}>\n            <div className='table-head-cell-content-row'>\n                {column.sortable ? (\n                    <button\n                        type='button'\n                        className={classNames('table-head-button', column.filter && 'table-head-button-has-filter')}\n                        aria-label={ariaLabel}\n                        onClick={event =>\n                            onSortChange?.(\n                                column.columnKey ?? String(column.key),\n                                column.sortDirection === 'asc' ? 'desc' : 'asc',\n                                event\n                            )\n                        }\n                    >\n                        <SortArrows direction={column.sortDirection} />\n                        <span\n                            ref={dragActivatorRef}\n                            className={classNames(\n                                'table-head-button-label',\n                                dragActivatorProps && 'table-head-drag-label'\n                            )}\n                            {...dragActivatorProps}\n                        >\n                            {wrappedLabelContent}\n                        </span>\n                    </button>\n                ) : (\n                    <span\n                        ref={dragActivatorRef}\n                        className={classNames(\n                            'table-head-label-wrapper',\n                            column.filter && 'table-head-label-wrapper-has-filter',\n                            dragActivatorProps && 'table-head-drag-label'\n                        )}\n                        aria-label={ariaLabel}\n                        {...dragActivatorProps}\n                    >\n                        {wrappedLabelContent}\n                    </span>\n                )}\n                {column.filter && <span className='table-head-filter'>{column.filter}</span>}\n            </div>\n        </div>\n    );\n};\n\nexport default TableHeaderCellContent;\n"],"names":["TableHeaderCellContent","props","column","dragActivatorProps","dragActivatorRef","hideWhileDragging","onSortChange","ariaLabel","labelContent","jsxs","jsx","classNames","wrappedLabelContent","event","SortArrows"],"mappings":";;;AAKA,MAAMA,IAAyB,CAACC,MAA+C;AAC3E,QAAM,EAAE,QAAAC,GAAQ,oBAAAC,GAAoB,kBAAAC,GAAkB,mBAAAC,GAAmB,cAAAC,MAAiBL,GAEpFM,IAAYL,EAAO,aAAa,OAAOA,EAAO,SAAU,WAAWA,EAAO,QAAQ,QAElFM,IAAeN,EAAO,YAAY,OAAOA,EAAO,OAClD,gBAAAO,EAAC,QAAA,EAAK,WAAU,gDACZ,UAAA;AAAA,IAAA,gBAAAC,EAAC,UAAK,WAAWC,EAAW,4BAA4BT,EAAO,IAAI,GAAG;AAAA,IACtE,gBAAAQ,EAAC,QAAA,EAAM,UAAAR,EAAO,MAAA,CAAM;AAAA,EAAA,EAAA,CACxB,IAEAA,EAAO,OAGLU,IAAsBJ,MAAiB,OAAO,yBAAQ,QAAA,EAAK,WAAU,oBAAoB,UAAAA,EAAA,CAAa;AAE5G,SACI,gBAAAE,EAAC,OAAA,EAAI,WAAWC,EAAW,2BAA2BN,KAAqB,gCAAgC,GACvG,UAAA,gBAAAI,EAAC,OAAA,EAAI,WAAU,+BACV,UAAA;AAAA,IAAAP,EAAO,WACJ,gBAAAO;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,MAAK;AAAA,QACL,WAAWE,EAAW,qBAAqBT,EAAO,UAAU,8BAA8B;AAAA,QAC1F,cAAYK;AAAA,QACZ,SAAS,CAAAM,MACLP;AAAA,UACIJ,EAAO,aAAa,OAAOA,EAAO,GAAG;AAAA,UACrCA,EAAO,kBAAkB,QAAQ,SAAS;AAAA,UAC1CW;AAAA,QAAA;AAAA,QAIR,UAAA;AAAA,UAAA,gBAAAH,EAACI,GAAA,EAAW,WAAWZ,EAAO,cAAA,CAAe;AAAA,UAC7C,gBAAAQ;AAAA,YAAC;AAAA,YAAA;AAAA,cACG,KAAKN;AAAA,cACL,WAAWO;AAAA,gBACP;AAAA,gBACAR,KAAsB;AAAA,cAAA;AAAA,cAEzB,GAAGA;AAAA,cAEH,UAAAS;AAAA,YAAA;AAAA,UAAA;AAAA,QACL;AAAA,MAAA;AAAA,IAAA,IAGJ,gBAAAF;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,KAAKN;AAAA,QACL,WAAWO;AAAA,UACP;AAAA,UACAT,EAAO,UAAU;AAAA,UACjBC,KAAsB;AAAA,QAAA;AAAA,QAE1B,cAAYI;AAAA,QACX,GAAGJ;AAAA,QAEH,UAAAS;AAAA,MAAA;AAAA,IAAA;AAAA,IAGRV,EAAO,UAAU,gBAAAQ,EAAC,UAAK,WAAU,qBAAqB,YAAO,OAAA,CAAO;AAAA,EAAA,EAAA,CACzE,EAAA,CACJ;AAER;"}

package/components/table/render/header/TableHeaderCellResizeHandle.d.ts

@@ -0,0 +1,4 @@
+import { TableRowData } from '../../Table.types';
+import { SharedHeaderCellProps } from './TableHeader.types';
+declare const TableHeaderCellResizeHandle: (props: SharedHeaderCellProps<TableRowData>) => import("react/jsx-runtime").JSX.Element | null;
+export default TableHeaderCellResizeHandle;

package/components/table/render/header/TableHeaderCellResizeHandle.js

@@ -0,0 +1,22 @@
+import { jsx as i } from "react/jsx-runtime";
+import u from "../../../../utils/classNames.js";
+const d = (n) => {
+  const { column: t, hasResettableWidth: o, isResizable: s, onColumnResizeReset: a, onColumnResizeStart: r } = n, l = t.columnKey;
+  return !s || !l ? null : /* @__PURE__ */ i(
+    "div",
+    {
+      className: u(
+        "table-column-resize-handle",
+        o && "table-column-resize-handle-has-width"
+      ),
+      onPointerDown: (e) => r?.(l, e),
+      onDoubleClick: (e) => {
+        o && (e.preventDefault(), e.stopPropagation(), a?.(l));
+      }
+    }
+  );
+};
+export {
+  d as default
+};
+//# sourceMappingURL=TableHeaderCellResizeHandle.js.map

package/components/table/render/header/TableHeaderCellResizeHandle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableHeaderCellResizeHandle.js","sources":["../../../../../src/components/table/render/header/TableHeaderCellResizeHandle.tsx"],"sourcesContent":["import classNames from '../../../../utils/classNames';\nimport type { TableRowData } from '../../Table.types';\nimport type { SharedHeaderCellProps } from './TableHeader.types';\n\nconst TableHeaderCellResizeHandle = (props: SharedHeaderCellProps<TableRowData>) => {\n    const { column, hasResettableWidth, isResizable, onColumnResizeReset, onColumnResizeStart } = props;\n\n    const columnKey = column.columnKey;\n\n    if (!isResizable || !columnKey) {\n        return null;\n    }\n\n    return (\n        <div\n            className={classNames(\n                'table-column-resize-handle',\n                hasResettableWidth && 'table-column-resize-handle-has-width'\n            )}\n            onPointerDown={event => onColumnResizeStart?.(columnKey, event)}\n            onDoubleClick={event => {\n                if (!hasResettableWidth) {\n                    return;\n                }\n\n                event.preventDefault();\n                event.stopPropagation();\n                onColumnResizeReset?.(columnKey);\n            }}\n        />\n    );\n};\n\nexport default TableHeaderCellResizeHandle;\n"],"names":["TableHeaderCellResizeHandle","props","column","hasResettableWidth","isResizable","onColumnResizeReset","onColumnResizeStart","columnKey","jsx","classNames","event"],"mappings":";;AAIA,MAAMA,IAA8B,CAACC,MAA+C;AAChF,QAAM,EAAE,QAAAC,GAAQ,oBAAAC,GAAoB,aAAAC,GAAa,qBAAAC,GAAqB,qBAAAC,MAAwBL,GAExFM,IAAYL,EAAO;AAEzB,SAAI,CAACE,KAAe,CAACG,IACV,OAIP,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,WAAWC;AAAA,QACP;AAAA,QACAN,KAAsB;AAAA,MAAA;AAAA,MAE1B,eAAe,CAAAO,MAASJ,IAAsBC,GAAWG,CAAK;AAAA,MAC9D,eAAe,CAAAA,MAAS;AACpB,QAAKP,MAILO,EAAM,eAAA,GACNA,EAAM,gBAAA,GACNL,IAAsBE,CAAS;AAAA,MACnC;AAAA,IAAA;AAAA,EAAA;AAGZ;"}

package/components/table/render/header/TableHeaderDragOverlay.d.ts

@@ -0,0 +1,14 @@
+import { TableRowData } from '../../Table.types';
+import { HeaderColumn } from './TableHeader.types';
+type TableHeaderDragOverlayProps = {
+    column?: HeaderColumn<TableRowData>;
+    header: NonNullable<{
+        columns: HeaderColumn<TableRowData>[];
+        rowCount: number;
+        totalColumnCount: number;
+    }>;
+    showSelectionColumn?: boolean;
+    width?: number;
+};
+declare const TableHeaderDragOverlay: (props: TableHeaderDragOverlayProps) => import("react/jsx-runtime").JSX.Element | null;
+export default TableHeaderDragOverlay;

package/components/table/render/header/TableHeaderDragOverlay.js

@@ -0,0 +1,35 @@
+import { jsx as a } from "react/jsx-runtime";
+import t from "../../../../utils/classNames.js";
+import i from "./TableHeaderCellContent.js";
+import { resolveHeaderCellClassName as n } from "./resolveHeaderCellClassName.js";
+const f = (r) => {
+  const { column: e, header: l, showSelectionColumn: o, width: s } = r;
+  return e ? /* @__PURE__ */ a(
+    "div",
+    {
+      className: t(
+        n(e, l, {
+          isDraggable: !0,
+          isResizable: !1
+        }),
+        "table-head-cell-drag-overlay"
+      ),
+      "data-column": e.columnKey ?? String(e.key),
+      role: "presentation",
+      style: { width: s },
+      children: /* @__PURE__ */ a(
+        i,
+        {
+          column: e,
+          header: l,
+          isResizable: !1,
+          showSelectionColumn: o
+        }
+      )
+    }
+  ) : null;
+};
+export {
+  f as default
+};
+//# sourceMappingURL=TableHeaderDragOverlay.js.map

package/components/table/render/header/TableHeaderDragOverlay.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableHeaderDragOverlay.js","sources":["../../../../../src/components/table/render/header/TableHeaderDragOverlay.tsx"],"sourcesContent":["import classNames from '../../../../utils/classNames';\nimport TableHeaderCellContent from './TableHeaderCellContent';\nimport { resolveHeaderCellClassName } from './resolveHeaderCellClassName';\nimport type { TableRowData } from '../../Table.types';\nimport type { HeaderColumn } from './TableHeader.types';\n\ntype TableHeaderDragOverlayProps = {\n    column?: HeaderColumn<TableRowData>;\n    header: NonNullable<{ columns: HeaderColumn<TableRowData>[]; rowCount: number; totalColumnCount: number }>;\n    showSelectionColumn?: boolean;\n    width?: number;\n};\n\nconst TableHeaderDragOverlay = (props: TableHeaderDragOverlayProps) => {\n    const { column, header, showSelectionColumn, width } = props;\n\n    if (!column) {\n        return null;\n    }\n\n    return (\n        <div\n            className={classNames(\n                resolveHeaderCellClassName(column, header, {\n                    isDraggable: true,\n                    isResizable: false,\n                }),\n                'table-head-cell-drag-overlay'\n            )}\n            data-column={column.columnKey ?? String(column.key)}\n            role='presentation'\n            style={{ width }}\n        >\n            <TableHeaderCellContent\n                column={column}\n                header={header}\n                isResizable={false}\n                showSelectionColumn={showSelectionColumn}\n            />\n        </div>\n    );\n};\n\nexport default TableHeaderDragOverlay;\n"],"names":["TableHeaderDragOverlay","props","column","header","showSelectionColumn","width","jsx","classNames","resolveHeaderCellClassName","TableHeaderCellContent"],"mappings":";;;;AAaA,MAAMA,IAAyB,CAACC,MAAuC;AACnE,QAAM,EAAE,QAAAC,GAAQ,QAAAC,GAAQ,qBAAAC,GAAqB,OAAAC,MAAUJ;AAEvD,SAAKC,IAKD,gBAAAI;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,WAAWC;AAAA,QACPC,EAA2BN,GAAQC,GAAQ;AAAA,UACvC,aAAa;AAAA,UACb,aAAa;AAAA,QAAA,CAChB;AAAA,QACD;AAAA,MAAA;AAAA,MAEJ,eAAaD,EAAO,aAAa,OAAOA,EAAO,GAAG;AAAA,MAClD,MAAK;AAAA,MACL,OAAO,EAAE,OAAAG,EAAA;AAAA,MAET,UAAA,gBAAAC;AAAA,QAACG;AAAA,QAAA;AAAA,UACG,QAAAP;AAAA,UACA,QAAAC;AAAA,UACA,aAAa;AAAA,UACb,qBAAAC;AAAA,QAAA;AAAA,MAAA;AAAA,IACJ;AAAA,EAAA,IArBG;AAwBf;"}

package/components/table/render/header/TableHeaderSelectionCell.d.ts

@@ -0,0 +1,9 @@
+type TableHeaderSelectionCellProps = {
+    isAllSelected?: boolean;
+    isSomeRowsSelected?: boolean;
+    onToggleAllSelection?: () => void;
+    rowCount: number;
+    selectionHeaderContent?: React.ReactNode;
+};
+declare const TableHeaderSelectionCell: (props: TableHeaderSelectionCellProps) => import("react/jsx-runtime").JSX.Element;
+export default TableHeaderSelectionCell;

package/components/table/render/header/TableHeaderSelectionCell.js

@@ -0,0 +1,41 @@
+import { jsx as o } from "react/jsx-runtime";
+import c from "../../../checkbox/Checkbox.js";
+import s from "../../../../utils/classNames.js";
+import { resolveAriaSpan as d } from "../../shared/resolveTableAria.js";
+const h = (a) => {
+  const { isAllSelected: l, isSomeRowsSelected: r, onToggleAllSelection: i, rowCount: n, selectionHeaderContent: t } = a;
+  return /* @__PURE__ */ o(
+    "div",
+    {
+      className: s(
+        "table-head-cell table-selection-cell table-align-center",
+        t && "table-selection-cell-custom-content"
+      ),
+      role: "columnheader",
+      "aria-colindex": 1,
+      "aria-rowindex": 1,
+      "aria-rowspan": d(n),
+      style: { gridColumn: "1 / span 1", gridRow: `1 / span ${n}` },
+      children: /* @__PURE__ */ o(
+        "div",
+        {
+          className: "table-selection-control",
+          onClick: (e) => e.stopPropagation(),
+          onKeyDown: (e) => e.stopPropagation(),
+          children: t ?? /* @__PURE__ */ o(
+            c,
+            {
+              checked: l,
+              indeterminate: !l && !!r,
+              onChange: () => i?.()
+            }
+          )
+        }
+      )
+    }
+  );
+};
+export {
+  h as default
+};
+//# sourceMappingURL=TableHeaderSelectionCell.js.map

package/components/table/render/header/TableHeaderSelectionCell.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableHeaderSelectionCell.js","sources":["../../../../../src/components/table/render/header/TableHeaderSelectionCell.tsx"],"sourcesContent":["import Checkbox from '../../../checkbox/Checkbox';\nimport classNames from '../../../../utils/classNames';\nimport { resolveAriaSpan } from '../../shared/resolveTableAria';\n\ntype TableHeaderSelectionCellProps = {\n    isAllSelected?: boolean;\n    isSomeRowsSelected?: boolean;\n    onToggleAllSelection?: () => void;\n    rowCount: number;\n    selectionHeaderContent?: React.ReactNode;\n};\n\nconst TableHeaderSelectionCell = (props: TableHeaderSelectionCellProps) => {\n    const { isAllSelected, isSomeRowsSelected, onToggleAllSelection, rowCount, selectionHeaderContent } = props;\n\n    return (\n        <div\n            className={classNames(\n                'table-head-cell table-selection-cell table-align-center',\n                selectionHeaderContent && 'table-selection-cell-custom-content'\n            )}\n            role='columnheader'\n            aria-colindex={1}\n            aria-rowindex={1}\n            aria-rowspan={resolveAriaSpan(rowCount)}\n            style={{ gridColumn: '1 / span 1', gridRow: `1 / span ${rowCount}` }}\n        >\n            <div\n                className='table-selection-control'\n                onClick={event => event.stopPropagation()}\n                onKeyDown={event => event.stopPropagation()}\n            >\n                {selectionHeaderContent ?? (\n                    <Checkbox\n                        checked={isAllSelected}\n                        indeterminate={!isAllSelected && !!isSomeRowsSelected}\n                        onChange={() => onToggleAllSelection?.()}\n                    />\n                )}\n            </div>\n        </div>\n    );\n};\n\nexport default TableHeaderSelectionCell;\n"],"names":["TableHeaderSelectionCell","props","isAllSelected","isSomeRowsSelected","onToggleAllSelection","rowCount","selectionHeaderContent","jsx","classNames","resolveAriaSpan","event","Checkbox"],"mappings":";;;;AAYA,MAAMA,IAA2B,CAACC,MAAyC;AACvE,QAAM,EAAE,eAAAC,GAAe,oBAAAC,GAAoB,sBAAAC,GAAsB,UAAAC,GAAU,wBAAAC,MAA2BL;AAEtG,SACI,gBAAAM;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,WAAWC;AAAA,QACP;AAAA,QACAF,KAA0B;AAAA,MAAA;AAAA,MAE9B,MAAK;AAAA,MACL,iBAAe;AAAA,MACf,iBAAe;AAAA,MACf,gBAAcG,EAAgBJ,CAAQ;AAAA,MACtC,OAAO,EAAE,YAAY,cAAc,SAAS,YAAYA,CAAQ,GAAA;AAAA,MAEhE,UAAA,gBAAAE;AAAA,QAAC;AAAA,QAAA;AAAA,UACG,WAAU;AAAA,UACV,SAAS,CAAAG,MAASA,EAAM,gBAAA;AAAA,UACxB,WAAW,CAAAA,MAASA,EAAM,gBAAA;AAAA,UAEzB,UAAAJ,KACG,gBAAAC;AAAA,YAACI;AAAA,YAAA;AAAA,cACG,SAAST;AAAA,cACT,eAAe,CAACA,KAAiB,CAAC,CAACC;AAAA,cACnC,UAAU,MAAMC,IAAA;AAAA,YAAuB;AAAA,UAAA;AAAA,QAC3C;AAAA,MAAA;AAAA,IAER;AAAA,EAAA;AAGZ;"}

package/components/table/render/header/TableStaticHeaderCell.d.ts

@@ -0,0 +1,4 @@
+import { TableRowData } from '../../Table.types';
+import { SharedHeaderCellProps } from './TableHeader.types';
+declare const TableStaticHeaderCell: (props: SharedHeaderCellProps<TableRowData>) => import("react/jsx-runtime").JSX.Element;
+export default TableStaticHeaderCell;

package/components/table/render/header/TableStaticHeaderCell.js

@@ -0,0 +1,48 @@
+import { jsxs as d, jsx as o } from "react/jsx-runtime";
+import u from "../../../../utils/classNames.js";
+import C from "./TableHeaderCellContent.js";
+import f from "./TableHeaderCellResizeHandle.js";
+import { resolveAriaSort as S } from "./resolveAriaSort.js";
+import { resolveHeaderCellClassName as p } from "./resolveHeaderCellClassName.js";
+import { resolveHeaderCellStyle as h } from "./resolveHeaderCellStyle.js";
+import { resolveAriaSpan as t, resolveAriaColIndex as y } from "../../shared/resolveTableAria.js";
+const L = (r) => {
+  const {
+    column: e,
+    header: i,
+    hideWhileDragging: m,
+    htmlAttributes: n,
+    isResizable: s,
+    showSelectionColumn: l,
+    stickyLeftColumnCount: c
+  } = r, a = c ?? 0;
+  return /* @__PURE__ */ d(
+    "div",
+    {
+      ...n,
+      className: u(
+        p(e, i, {
+          isResizable: s,
+          isStickyLeftColumn: a > 0 && e.columnStart <= a
+        }),
+        m && "table-head-cell-drag-placeholder"
+      ),
+      "data-column": e.columnKey ?? String(e.key),
+      role: "columnheader",
+      "aria-colindex": y(e.columnStart, l),
+      "aria-colspan": t(e.colSpan),
+      "aria-rowindex": e.rowStart,
+      "aria-rowspan": t(e.rowSpan),
+      "aria-sort": S(e),
+      style: h(e, l),
+      children: [
+        /* @__PURE__ */ o(C, { ...r }),
+        /* @__PURE__ */ o(f, { ...r })
+      ]
+    }
+  );
+};
+export {
+  L as default
+};
+//# sourceMappingURL=TableStaticHeaderCell.js.map

package/components/table/render/header/TableStaticHeaderCell.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableStaticHeaderCell.js","sources":["../../../../../src/components/table/render/header/TableStaticHeaderCell.tsx"],"sourcesContent":["import classNames from '../../../../utils/classNames';\nimport type { TableRowData } from '../../Table.types';\nimport TableHeaderCellContent from './TableHeaderCellContent';\nimport TableHeaderCellResizeHandle from './TableHeaderCellResizeHandle';\nimport { resolveAriaSort } from './resolveAriaSort';\nimport { resolveHeaderCellClassName } from './resolveHeaderCellClassName';\nimport { resolveHeaderCellStyle } from './resolveHeaderCellStyle';\nimport type { SharedHeaderCellProps } from './TableHeader.types';\nimport { resolveAriaColIndex, resolveAriaSpan } from '../../shared/resolveTableAria';\n\nconst TableStaticHeaderCell = (props: SharedHeaderCellProps<TableRowData>) => {\n    const {\n        column,\n        header,\n        hideWhileDragging,\n        htmlAttributes,\n        isResizable,\n        showSelectionColumn,\n        stickyLeftColumnCount,\n    } = props;\n\n    const stickyLeftColumns = stickyLeftColumnCount ?? 0;\n\n    return (\n        <div\n            {...htmlAttributes}\n            className={classNames(\n                resolveHeaderCellClassName(column, header, {\n                    isResizable,\n                    isStickyLeftColumn: stickyLeftColumns > 0 && column.columnStart <= stickyLeftColumns,\n                }),\n                hideWhileDragging && 'table-head-cell-drag-placeholder'\n            )}\n            data-column={column.columnKey ?? String(column.key)}\n            role='columnheader'\n            aria-colindex={resolveAriaColIndex(column.columnStart, showSelectionColumn)}\n            aria-colspan={resolveAriaSpan(column.colSpan)}\n            aria-rowindex={column.rowStart}\n            aria-rowspan={resolveAriaSpan(column.rowSpan)}\n            aria-sort={resolveAriaSort(column)}\n            style={resolveHeaderCellStyle(column, showSelectionColumn)}\n        >\n            <TableHeaderCellContent {...props} />\n            <TableHeaderCellResizeHandle {...props} />\n        </div>\n    );\n};\n\nexport default TableStaticHeaderCell;\n"],"names":["TableStaticHeaderCell","props","column","header","hideWhileDragging","htmlAttributes","isResizable","showSelectionColumn","stickyLeftColumnCount","stickyLeftColumns","jsxs","classNames","resolveHeaderCellClassName","resolveAriaColIndex","resolveAriaSpan","resolveAriaSort","resolveHeaderCellStyle","jsx","TableHeaderCellContent","TableHeaderCellResizeHandle"],"mappings":";;;;;;;;AAUA,MAAMA,IAAwB,CAACC,MAA+C;AAC1E,QAAM;AAAA,IACF,QAAAC;AAAA,IACA,QAAAC;AAAA,IACA,mBAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,aAAAC;AAAA,IACA,qBAAAC;AAAA,IACA,uBAAAC;AAAA,EAAA,IACAP,GAEEQ,IAAoBD,KAAyB;AAEnD,SACI,gBAAAE;AAAA,IAAC;AAAA,IAAA;AAAA,MACI,GAAGL;AAAA,MACJ,WAAWM;AAAA,QACPC,EAA2BV,GAAQC,GAAQ;AAAA,UACvC,aAAAG;AAAA,UACA,oBAAoBG,IAAoB,KAAKP,EAAO,eAAeO;AAAA,QAAA,CACtE;AAAA,QACDL,KAAqB;AAAA,MAAA;AAAA,MAEzB,eAAaF,EAAO,aAAa,OAAOA,EAAO,GAAG;AAAA,MAClD,MAAK;AAAA,MACL,iBAAeW,EAAoBX,EAAO,aAAaK,CAAmB;AAAA,MAC1E,gBAAcO,EAAgBZ,EAAO,OAAO;AAAA,MAC5C,iBAAeA,EAAO;AAAA,MACtB,gBAAcY,EAAgBZ,EAAO,OAAO;AAAA,MAC5C,aAAWa,EAAgBb,CAAM;AAAA,MACjC,OAAOc,EAAuBd,GAAQK,CAAmB;AAAA,MAEzD,UAAA;AAAA,QAAA,gBAAAU,EAACC,GAAA,EAAwB,GAAGjB,GAAO;AAAA,QACnC,gBAAAgB,EAACE,GAAA,EAA6B,GAAGlB,EAAA,CAAO;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGpD;"}

package/components/table/render/header/resolveAriaSort.d.ts

@@ -0,0 +1,3 @@
+import { TableRowData } from '../../Table.types';
+import { HeaderColumn } from './TableHeader.types';
+export declare const resolveAriaSort: (column: HeaderColumn<TableRowData>) => "none" | "ascending" | "descending" | undefined;

package/components/table/render/header/resolveAriaSort.js

@@ -0,0 +1,8 @@
+const e = (r) => {
+  if (r.sortable)
+    return r.sortDirection === "asc" ? "ascending" : r.sortDirection === "desc" ? "descending" : "none";
+};
+export {
+  e as resolveAriaSort
+};
+//# sourceMappingURL=resolveAriaSort.js.map

package/components/table/render/header/resolveAriaSort.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"resolveAriaSort.js","sources":["../../../../../src/components/table/render/header/resolveAriaSort.ts"],"sourcesContent":["import type { TableRowData } from '../../Table.types';\nimport type { HeaderColumn } from './TableHeader.types';\n\nexport const resolveAriaSort = (column: HeaderColumn<TableRowData>) => {\n    if (!column.sortable) {\n        return;\n    }\n\n    if (column.sortDirection === 'asc') {\n        return 'ascending';\n    }\n\n    if (column.sortDirection === 'desc') {\n        return 'descending';\n    }\n\n    return 'none';\n};\n"],"names":["resolveAriaSort","column"],"mappings":"AAGO,MAAMA,IAAkB,CAACC,MAAuC;AACnE,MAAKA,EAAO;AAIZ,WAAIA,EAAO,kBAAkB,QAClB,cAGPA,EAAO,kBAAkB,SAClB,eAGJ;AACX;"}

package/components/table/render/header/resolveColumnCollisionDetection.d.ts

@@ -0,0 +1,2 @@
+import { CollisionDetection } from '@dnd-kit/core';
+export declare const resolveColumnCollisionDetection: CollisionDetection;

package/components/table/render/header/resolveColumnCollisionDetection.js

@@ -0,0 +1,9 @@
+import { pointerWithin as e, closestCenter as n } from "@dnd-kit/core";
+const i = (o) => {
+  const t = e(o);
+  return t.length > 0 ? t : n(o);
+};
+export {
+  i as resolveColumnCollisionDetection
+};
+//# sourceMappingURL=resolveColumnCollisionDetection.js.map

package/components/table/render/header/resolveColumnCollisionDetection.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"resolveColumnCollisionDetection.js","sources":["../../../../../src/components/table/render/header/resolveColumnCollisionDetection.ts"],"sourcesContent":["import { closestCenter, pointerWithin, type CollisionDetection } from '@dnd-kit/core';\n\nexport const resolveColumnCollisionDetection: CollisionDetection = collisionDetectionArguments => {\n    const pointerCollisions = pointerWithin(collisionDetectionArguments);\n\n    if (pointerCollisions.length > 0) {\n        return pointerCollisions;\n    }\n\n    return closestCenter(collisionDetectionArguments);\n};\n"],"names":["resolveColumnCollisionDetection","collisionDetectionArguments","pointerCollisions","pointerWithin","closestCenter"],"mappings":";AAEO,MAAMA,IAAsD,CAAAC,MAA+B;AAC9F,QAAMC,IAAoBC,EAAcF,CAA2B;AAEnE,SAAIC,EAAkB,SAAS,IACpBA,IAGJE,EAAcH,CAA2B;AACpD;"}

package/components/table/render/header/resolveHeaderCellClassName.d.ts

@@ -0,0 +1,12 @@
+import { TableRowData } from '../../Table.types';
+import { HeaderColumn } from './TableHeader.types';
+export declare const resolveHeaderCellClassName: (column: HeaderColumn<TableRowData>, header: NonNullable<{
+    columns: HeaderColumn<TableRowData>[];
+    rowCount: number;
+    totalColumnCount: number;
+}>, options: {
+    isDraggable?: boolean;
+    isDragging?: boolean;
+    isResizable: boolean;
+    isStickyLeftColumn?: boolean;
+}) => string;