@crispy-seed/data-table 0.1.0 → 0.1.2

package/dist/states-12s-CLO_uVue.cjs

@@ -1,125 +0,0 @@
-'use client';
-function __insertCSS(code) {
-  if (!code || typeof document == 'undefined') return
-  let head = document.head || document.getElementsByTagName('head')[0]
-  let style = document.createElement('style')
-  style.type = 'text/css'
-  head.appendChild(style)
-  ;style.styleSheet ? (style.styleSheet.cssText = code) : style.appendChild(document.createTextNode(code))
-}
-
-var jsxRuntime = require('react/jsx-runtime');
-require('react');
-var DataTable12s = require('./DataTable-12s-8LMBtS2u.cjs');
-var DataTable12sZml1x9Kr12s = require('./DataTable-12s-Zml1x9Kr-12s-CTRzgvMT.cjs');
-
-/**
- * A small inline spinner, not seed's own `ProgressCircle` -- that component's
- * smallest size (24px) is already bigger than crisp's own measured 16px loading
- * icon, the same gap `editors.tsx`'s `EditPendingIndicator` already works around for
- * its own (smaller still, 14px) in-cell pending spinner. Same shape, one size up,
- * reusing the SAME global `rotate` keyframe (this file's own qvism recipe slot
- * nests `.seed-data-table-loading-spinner` under it) rather than a third near-
- * identical spinner.
- */ function LoadingSpinner() {
-    return /*#__PURE__*/ jsxRuntime.jsxs("svg", {
-        className: "seed-data-table-loading-spinner",
-        width: 16,
-        height: 16,
-        viewBox: "0 0 16 16",
-        fill: "none",
-        role: "presentation",
-        "aria-hidden": "true",
-        children: [
-            /*#__PURE__*/ jsxRuntime.jsx("circle", {
-                cx: 8,
-                cy: 8,
-                r: 6.5,
-                stroke: "currentColor",
-                strokeOpacity: 0.25,
-                strokeWidth: 2
-            }),
-            /*#__PURE__*/ jsxRuntime.jsx("path", {
-                d: "M14.5 8a6.5 6.5 0 0 0-6.5-6.5",
-                stroke: "currentColor",
-                strokeWidth: 2,
-                strokeLinecap: "round"
-            })
-        ]
-    });
-}
-/** The full-body empty/error row's own content -- one `<tr>`/`<td colSpan>` wrapping
- *  this, rendered by `DataTable.tsx` itself (it already owns `totalCols`). Shared by
- *  `empty` and `error` alike, matching crisp's own single `.crisp-datatable-empty`
- *  class doing double duty for both. */ function EmptyStateContent({ children, classNames }) {
-    return /*#__PURE__*/ jsxRuntime.jsx("div", {
-        className: classNames.emptyState,
-        children: children
-    });
-}
-/** The full-body loading row's own content (spinner + `loadingLabel`). */ function LoadingStateContent({ label, classNames }) {
-    return /*#__PURE__*/ jsxRuntime.jsxs("div", {
-        className: classNames.loadingState,
-        children: [
-            /*#__PURE__*/ jsxRuntime.jsx(LoadingSpinner, {}),
-            label
-        ]
-    });
-}
-/**
- * Infinite scroll's own sentinel + "loading more" row -- the LAST child of
- * `<tbody>` while `hasMore` (the headless `useDataTableInfiniteScroll`'s own
- * return, read off context the same way `SelectAllCheckbox` reads `selectionState`).
- * Renders nothing once `hasMore` is false -- there is no manual pagination
- * fallback, matching DATATABLE-ATTIO-SPEC.md's auto-load-only contract. While a
- * fetch is in flight (`loadingMore`) the SAME row shows the compact spinner
- * (`loadingState`'s own `[data-inline]` modifier, a normal 36px row); at rest it's
- * an empty sentinel row the IntersectionObserver watches.
- */ function InfiniteScrollRow({ colSpan, classNames, loadingLabel }) {
-    const { sentinelRef, hasMore, loadingMore } = DataTable12sZml1x9Kr12s.useDataTableContext();
-    if (!hasMore) return null;
-    return /*#__PURE__*/ jsxRuntime.jsx("tr", {
-        ref: sentinelRef,
-        "aria-hidden": loadingMore ? undefined : "true",
-        children: /*#__PURE__*/ jsxRuntime.jsx(DataTable12s.DataTableCell, {
-            colSpan: colSpan,
-            children: loadingMore && /*#__PURE__*/ jsxRuntime.jsxs("div", {
-                className: classNames.loadingState,
-                "data-inline": "",
-                children: [
-                    /*#__PURE__*/ jsxRuntime.jsx(LoadingSpinner, {}),
-                    loadingLabel
-                ]
-            })
-        })
-    });
-}
-/** The trailing "+ New" add-row footer -- crisp's own `.crisp-datatable-addrow`
- *  inside a zero-padding `.crisp-datatable-addcell`, its own `<tfoot>` (a table can
- *  have more than one; the ColumnCalc summary footer, when both are present, is a
- *  separate one, matching crisp's own two independent `<TableFooter>` rows). */ function AddRowFooter({ onAddRow, addRowLabel, colSpan, classNames }) {
-    return /*#__PURE__*/ jsxRuntime.jsx("tfoot", {
-        children: /*#__PURE__*/ jsxRuntime.jsx("tr", {
-            children: /*#__PURE__*/ jsxRuntime.jsx("td", {
-                className: classNames.addRowCell,
-                colSpan: colSpan,
-                children: /*#__PURE__*/ jsxRuntime.jsxs("button", {
-                    type: "button",
-                    className: classNames.addRow,
-                    onClick: onAddRow,
-                    children: [
-                        /*#__PURE__*/ jsxRuntime.jsx(DataTable12s.IconPlusLine_default, {
-                            size: 15
-                        }),
-                        addRowLabel
-                    ]
-                })
-            })
-        })
-    });
-}
-
-exports.AddRowFooter = AddRowFooter;
-exports.EmptyStateContent = EmptyStateContent;
-exports.InfiniteScrollRow = InfiniteScrollRow;
-exports.LoadingStateContent = LoadingStateContent;

package/dist/states-12s-DEFSxJCO.js

@@ -1,122 +0,0 @@
-'use client';
-function __insertCSS(code) {
-  if (!code || typeof document == 'undefined') return
-  let head = document.head || document.getElementsByTagName('head')[0]
-  let style = document.createElement('style')
-  style.type = 'text/css'
-  head.appendChild(style)
-  ;style.styleSheet ? (style.styleSheet.cssText = code) : style.appendChild(document.createTextNode(code))
-}
-
-import { jsxs, jsx } from 'react/jsx-runtime';
-import 'react';
-import { D as DataTableCell, y as IconPlusLine_default } from './DataTable-12s-Bd20OuMs.js';
-import { u as useDataTableContext } from './DataTable-12s-Zml1x9Kr-12s-Coi-3lUa.js';
-
-/**
- * A small inline spinner, not seed's own `ProgressCircle` -- that component's
- * smallest size (24px) is already bigger than crisp's own measured 16px loading
- * icon, the same gap `editors.tsx`'s `EditPendingIndicator` already works around for
- * its own (smaller still, 14px) in-cell pending spinner. Same shape, one size up,
- * reusing the SAME global `rotate` keyframe (this file's own qvism recipe slot
- * nests `.seed-data-table-loading-spinner` under it) rather than a third near-
- * identical spinner.
- */ function LoadingSpinner() {
-    return /*#__PURE__*/ jsxs("svg", {
-        className: "seed-data-table-loading-spinner",
-        width: 16,
-        height: 16,
-        viewBox: "0 0 16 16",
-        fill: "none",
-        role: "presentation",
-        "aria-hidden": "true",
-        children: [
-            /*#__PURE__*/ jsx("circle", {
-                cx: 8,
-                cy: 8,
-                r: 6.5,
-                stroke: "currentColor",
-                strokeOpacity: 0.25,
-                strokeWidth: 2
-            }),
-            /*#__PURE__*/ jsx("path", {
-                d: "M14.5 8a6.5 6.5 0 0 0-6.5-6.5",
-                stroke: "currentColor",
-                strokeWidth: 2,
-                strokeLinecap: "round"
-            })
-        ]
-    });
-}
-/** The full-body empty/error row's own content -- one `<tr>`/`<td colSpan>` wrapping
- *  this, rendered by `DataTable.tsx` itself (it already owns `totalCols`). Shared by
- *  `empty` and `error` alike, matching crisp's own single `.crisp-datatable-empty`
- *  class doing double duty for both. */ function EmptyStateContent({ children, classNames }) {
-    return /*#__PURE__*/ jsx("div", {
-        className: classNames.emptyState,
-        children: children
-    });
-}
-/** The full-body loading row's own content (spinner + `loadingLabel`). */ function LoadingStateContent({ label, classNames }) {
-    return /*#__PURE__*/ jsxs("div", {
-        className: classNames.loadingState,
-        children: [
-            /*#__PURE__*/ jsx(LoadingSpinner, {}),
-            label
-        ]
-    });
-}
-/**
- * Infinite scroll's own sentinel + "loading more" row -- the LAST child of
- * `<tbody>` while `hasMore` (the headless `useDataTableInfiniteScroll`'s own
- * return, read off context the same way `SelectAllCheckbox` reads `selectionState`).
- * Renders nothing once `hasMore` is false -- there is no manual pagination
- * fallback, matching DATATABLE-ATTIO-SPEC.md's auto-load-only contract. While a
- * fetch is in flight (`loadingMore`) the SAME row shows the compact spinner
- * (`loadingState`'s own `[data-inline]` modifier, a normal 36px row); at rest it's
- * an empty sentinel row the IntersectionObserver watches.
- */ function InfiniteScrollRow({ colSpan, classNames, loadingLabel }) {
-    const { sentinelRef, hasMore, loadingMore } = useDataTableContext();
-    if (!hasMore) return null;
-    return /*#__PURE__*/ jsx("tr", {
-        ref: sentinelRef,
-        "aria-hidden": loadingMore ? undefined : "true",
-        children: /*#__PURE__*/ jsx(DataTableCell, {
-            colSpan: colSpan,
-            children: loadingMore && /*#__PURE__*/ jsxs("div", {
-                className: classNames.loadingState,
-                "data-inline": "",
-                children: [
-                    /*#__PURE__*/ jsx(LoadingSpinner, {}),
-                    loadingLabel
-                ]
-            })
-        })
-    });
-}
-/** The trailing "+ New" add-row footer -- crisp's own `.crisp-datatable-addrow`
- *  inside a zero-padding `.crisp-datatable-addcell`, its own `<tfoot>` (a table can
- *  have more than one; the ColumnCalc summary footer, when both are present, is a
- *  separate one, matching crisp's own two independent `<TableFooter>` rows). */ function AddRowFooter({ onAddRow, addRowLabel, colSpan, classNames }) {
-    return /*#__PURE__*/ jsx("tfoot", {
-        children: /*#__PURE__*/ jsx("tr", {
-            children: /*#__PURE__*/ jsx("td", {
-                className: classNames.addRowCell,
-                colSpan: colSpan,
-                children: /*#__PURE__*/ jsxs("button", {
-                    type: "button",
-                    className: classNames.addRow,
-                    onClick: onAddRow,
-                    children: [
-                        /*#__PURE__*/ jsx(IconPlusLine_default, {
-                            size: 15
-                        }),
-                        addRowLabel
-                    ]
-                })
-            })
-        })
-    });
-}
-
-export { AddRowFooter as A, EmptyStateContent as E, InfiniteScrollRow as I, LoadingStateContent as L };

package/dist/toolbar-12s-AVU-sbDW.js

@@ -1,69 +0,0 @@
-'use client';
-function __insertCSS(code) {
-  if (!code || typeof document == 'undefined') return
-  let head = document.head || document.getElementsByTagName('head')[0]
-  let style = document.createElement('style')
-  style.type = 'text/css'
-  head.appendChild(style)
-  ;style.styleSheet ? (style.styleSheet.cssText = code) : style.appendChild(document.createTextNode(code))
-}
-
-import { jsxs, jsx } from 'react/jsx-runtime';
-import 'react';
-import { z as withContext, A as dataTable, B as IconMagnifyingglassLine_default } from './DataTable-12s-Bd20OuMs.js';
-import { Primitive } from '@seed-design/react-primitive';
-import { c as TextFieldRoot, d as TextFieldPrefixIcon, e as TextFieldInput } from './editors-12s-BO9Mp034.js';
-import { u as useDataTableContext } from './DataTable-12s-Zml1x9Kr-12s-Coi-3lUa.js';
-
-const DataTableToolbar = withContext(Primitive.div, "toolbar");
-const DataTableCount = withContext(Primitive.span, "count");
-/**
- * Fix (recurring bug): the search box is seed's own DOCUMENTED `TextField`
- * composition -- `TextFieldRoot` (`variant="outline" size="medium"`) +
- * `TextFieldPrefixIcon` + `TextFieldInput`, exactly `docs/examples/react/
- * text-field-input/prefix.tsx` -- not that same trio fought with a custom
- * `classNames.search` overriding its height/padding/icon position with `!important`.
- * That override (this file's own previous state) is what kept mis-placing the icon:
- * every fix landed on ANOTHER property the override was still fighting (the icon's own
- * intrinsic SVG size, its inherited margin, the root's own min-height beating a plain
- * `height` override) because the override was never the right layer to fix it at.
- * `size="medium"`'s built-in prefix-icon spacing (a flex `gap` + edge margins, not
- * absolute positioning) is what `text-input.ts`'s own variant CSS already gets right,
- * so it needs no help from this component at all -- `search` (recipe.ts) is now just
- * this box's own layout constraint (`flex`, `max-width`) within the toolbar row, not
- * its internal chrome.
- */ function SearchBox({ placeholder, label }) {
-    const { query, setQuery } = useDataTableContext();
-    const classNames = dataTable();
-    return /*#__PURE__*/ jsxs(TextFieldRoot, {
-        variant: "outline",
-        size: "medium",
-        className: classNames.search,
-        children: [
-            /*#__PURE__*/ jsx(TextFieldPrefixIcon, {
-                svg: /*#__PURE__*/ jsx(IconMagnifyingglassLine_default, {})
-            }),
-            /*#__PURE__*/ jsx(TextFieldInput, {
-                type: "text",
-                value: query,
-                onChange: (event)=>setQuery(event.target.value),
-                placeholder: placeholder,
-                "aria-label": label
-            })
-        ]
-    });
-}
-/** crisp's own count format (`datatable.tsx`'s `resolvedCountLabel`): unfiltered reads
- *  "N rows" ("N row" for exactly one), filtered/searched reads "N of M" with no
- *  trailing word at all -- reproduced literally rather than reinvented, since this is
- *  the one piece of copy DATATABLE-ATTIO-SPEC.md calls out by example. */ function defaultCountLabel(shown, total) {
-    if (shown === total) return `${total} ${total === 1 ? "row" : "rows"}`;
-    return `${shown} of ${total}`;
-}
-function RowCount({ shown, total, countLabel }) {
-    return /*#__PURE__*/ jsx(DataTableCount, {
-        children: (countLabel ?? defaultCountLabel)(shown, total)
-    });
-}
-
-export { DataTableToolbar as D, RowCount as R, SearchBox as S };

package/dist/toolbar-12s-CaLgJrDo.cjs

@@ -1,71 +0,0 @@
-'use client';
-function __insertCSS(code) {
-  if (!code || typeof document == 'undefined') return
-  let head = document.head || document.getElementsByTagName('head')[0]
-  let style = document.createElement('style')
-  style.type = 'text/css'
-  head.appendChild(style)
-  ;style.styleSheet ? (style.styleSheet.cssText = code) : style.appendChild(document.createTextNode(code))
-}
-
-var jsxRuntime = require('react/jsx-runtime');
-require('react');
-var DataTable12s = require('./DataTable-12s-8LMBtS2u.cjs');
-var reactPrimitive = require('@seed-design/react-primitive');
-var editors12s = require('./editors-12s-DO8TZkYV.cjs');
-var DataTable12sZml1x9Kr12s = require('./DataTable-12s-Zml1x9Kr-12s-CTRzgvMT.cjs');
-
-const DataTableToolbar = DataTable12s.withContext(reactPrimitive.Primitive.div, "toolbar");
-const DataTableCount = DataTable12s.withContext(reactPrimitive.Primitive.span, "count");
-/**
- * Fix (recurring bug): the search box is seed's own DOCUMENTED `TextField`
- * composition -- `TextFieldRoot` (`variant="outline" size="medium"`) +
- * `TextFieldPrefixIcon` + `TextFieldInput`, exactly `docs/examples/react/
- * text-field-input/prefix.tsx` -- not that same trio fought with a custom
- * `classNames.search` overriding its height/padding/icon position with `!important`.
- * That override (this file's own previous state) is what kept mis-placing the icon:
- * every fix landed on ANOTHER property the override was still fighting (the icon's own
- * intrinsic SVG size, its inherited margin, the root's own min-height beating a plain
- * `height` override) because the override was never the right layer to fix it at.
- * `size="medium"`'s built-in prefix-icon spacing (a flex `gap` + edge margins, not
- * absolute positioning) is what `text-input.ts`'s own variant CSS already gets right,
- * so it needs no help from this component at all -- `search` (recipe.ts) is now just
- * this box's own layout constraint (`flex`, `max-width`) within the toolbar row, not
- * its internal chrome.
- */ function SearchBox({ placeholder, label }) {
-    const { query, setQuery } = DataTable12sZml1x9Kr12s.useDataTableContext();
-    const classNames = DataTable12s.dataTable();
-    return /*#__PURE__*/ jsxRuntime.jsxs(editors12s.TextFieldRoot, {
-        variant: "outline",
-        size: "medium",
-        className: classNames.search,
-        children: [
-            /*#__PURE__*/ jsxRuntime.jsx(editors12s.TextFieldPrefixIcon, {
-                svg: /*#__PURE__*/ jsxRuntime.jsx(DataTable12s.IconMagnifyingglassLine_default, {})
-            }),
-            /*#__PURE__*/ jsxRuntime.jsx(editors12s.TextFieldInput, {
-                type: "text",
-                value: query,
-                onChange: (event)=>setQuery(event.target.value),
-                placeholder: placeholder,
-                "aria-label": label
-            })
-        ]
-    });
-}
-/** crisp's own count format (`datatable.tsx`'s `resolvedCountLabel`): unfiltered reads
- *  "N rows" ("N row" for exactly one), filtered/searched reads "N of M" with no
- *  trailing word at all -- reproduced literally rather than reinvented, since this is
- *  the one piece of copy DATATABLE-ATTIO-SPEC.md calls out by example. */ function defaultCountLabel(shown, total) {
-    if (shown === total) return `${total} ${total === 1 ? "row" : "rows"}`;
-    return `${shown} of ${total}`;
-}
-function RowCount({ shown, total, countLabel }) {
-    return /*#__PURE__*/ jsxRuntime.jsx(DataTableCount, {
-        children: (countLabel ?? defaultCountLabel)(shown, total)
-    });
-}
-
-exports.DataTableToolbar = DataTableToolbar;
-exports.RowCount = RowCount;
-exports.SearchBox = SearchBox;

package/dist/useDataTable-12s-BHiDUubw-12s-CBeCwTe7.js

@@ -1,61 +0,0 @@
-'use client';
-function __insertCSS(code) {
-  if (!code || typeof document == 'undefined') return
-  let head = document.head || document.getElementsByTagName('head')[0]
-  let style = document.createElement('style')
-  style.type = 'text/css'
-  head.appendChild(style)
-  ;style.styleSheet ? (style.styleSheet.cssText = code) : style.appendChild(document.createTextNode(code))
-}
-
-import { elementProps } from '@seed-design/dom-utils';
-import { u as useDataTableColumnCalc } from './useDataTableColumnCalc-12s-DTQQTtEJ-12s-DsEse3uq.js';
-import { u as useDataTableColumns } from './useDataTableColumns-12s-Cn2ZAzFL-12s-CD6goR59.js';
-import { u as useDataTableEdit } from './useDataTableEdit-12s-9Wb_UCrN-12s-BoOHq3GB.js';
-import { u as useDataTableFilter } from './useDataTableFilter-12s-ZzbmWMin-12s-CWyBeFna.js';
-import { u as useDataTableInfiniteScroll } from './useDataTableInfiniteScroll-12s-8ZG31URd-12s-BexjP6iO.js';
-import { u as useDataTableScroll } from './useDataTableScroll-12s-BKDCr0en-12s-C7f2vHeG.js';
-import { u as useDataTableSearch } from './useDataTableSearch-12s-Ck3iWcpX-12s-B-65V6gH.js';
-import { u as useDataTableSelection } from './useDataTableSelection-12s-BIDtiRQq-12s-O6M_BhrH.js';
-import { u as useDataTableSort } from './useDataTableSort-12s-DvJYtmeS-12s-DABSNt6U.js';
-
-// Composes the eight independent concerns a table root owns -- which column is
-// sorted, which rows are selected, the toolbar's free-text query, each column's own
-// filter, column order/visibility/width/label, each column's ColumnCalc footer op, the
-// horizontal scroll-shadow edge state, and which single cell is mid-edit/pending/
-// erroring -- the way useSelect composes useSelectHighlight + useSelectOptions. No
-// sub-hook knows about any other; a future concern (row grouping) is a ninth sibling
-// call here, not a branch inside an existing one.
-function useDataTable(props) {
-    const sort = useDataTableSort(props);
-    const selection = useDataTableSelection(props);
-    const search = useDataTableSearch(props);
-    const filter = useDataTableFilter(props);
-    const columns = useDataTableColumns(props);
-    const columnCalc = useDataTableColumnCalc(props);
-    const scroll = useDataTableScroll();
-    const edit = useDataTableEdit(props);
-    // Wired to `scroll`'s own scroll-container ref (not a fresh one of its own) so a
-    // BOUNDED table's auto-load triggers off its own internal scroll, not the
-    // browsing viewport -- see useDataTableInfiniteScroll.ts's own doc comment.
-    const infiniteScroll = useDataTableInfiniteScroll({
-        ...props,
-        scrollRootRef: scroll.elementRef
-    });
-    return {
-        ...sort,
-        ...selection,
-        ...search,
-        ...filter,
-        ...columns,
-        ...columnCalc,
-        ...scroll,
-        ...edit,
-        ...infiniteScroll,
-        rootProps: elementProps({
-            role: "table"
-        })
-    };
-}
-
-export { useDataTable as u };

package/dist/useDataTable-12s-BHiDUubw-12s-Dgvt7XDk.cjs

@@ -1,61 +0,0 @@
-'use client';
-function __insertCSS(code) {
-  if (!code || typeof document == 'undefined') return
-  let head = document.head || document.getElementsByTagName('head')[0]
-  let style = document.createElement('style')
-  style.type = 'text/css'
-  head.appendChild(style)
-  ;style.styleSheet ? (style.styleSheet.cssText = code) : style.appendChild(document.createTextNode(code))
-}
-
-var domUtils = require('@seed-design/dom-utils');
-var useDataTableColumnCalc12sDTQQTtEJ12s = require('./useDataTableColumnCalc-12s-DTQQTtEJ-12s-CvD14JYo.cjs');
-var useDataTableColumns12sCn2ZAzFL12s = require('./useDataTableColumns-12s-Cn2ZAzFL-12s-CUk_CpYT.cjs');
-var useDataTableEdit12s9Wb_UCrN12s = require('./useDataTableEdit-12s-9Wb_UCrN-12s-De6YHBba.cjs');
-var useDataTableFilter12sZzbmWMin12s = require('./useDataTableFilter-12s-ZzbmWMin-12s-lpjzZY3_.cjs');
-var useDataTableInfiniteScroll12s8ZG31URd12s = require('./useDataTableInfiniteScroll-12s-8ZG31URd-12s-Bt8gojr9.cjs');
-var useDataTableScroll12sBKDCr0en12s = require('./useDataTableScroll-12s-BKDCr0en-12s-CUvUYMtt.cjs');
-var useDataTableSearch12sCk3iWcpX12s = require('./useDataTableSearch-12s-Ck3iWcpX-12s-DhVfN2Hq.cjs');
-var useDataTableSelection12sBIDtiRQq12s = require('./useDataTableSelection-12s-BIDtiRQq-12s-IS__VAnU.cjs');
-var useDataTableSort12sDvJYtmeS12s = require('./useDataTableSort-12s-DvJYtmeS-12s-C5VGnsq4.cjs');
-
-// Composes the eight independent concerns a table root owns -- which column is
-// sorted, which rows are selected, the toolbar's free-text query, each column's own
-// filter, column order/visibility/width/label, each column's ColumnCalc footer op, the
-// horizontal scroll-shadow edge state, and which single cell is mid-edit/pending/
-// erroring -- the way useSelect composes useSelectHighlight + useSelectOptions. No
-// sub-hook knows about any other; a future concern (row grouping) is a ninth sibling
-// call here, not a branch inside an existing one.
-function useDataTable(props) {
-    const sort = useDataTableSort12sDvJYtmeS12s.useDataTableSort(props);
-    const selection = useDataTableSelection12sBIDtiRQq12s.useDataTableSelection(props);
-    const search = useDataTableSearch12sCk3iWcpX12s.useDataTableSearch(props);
-    const filter = useDataTableFilter12sZzbmWMin12s.useDataTableFilter(props);
-    const columns = useDataTableColumns12sCn2ZAzFL12s.useDataTableColumns(props);
-    const columnCalc = useDataTableColumnCalc12sDTQQTtEJ12s.useDataTableColumnCalc(props);
-    const scroll = useDataTableScroll12sBKDCr0en12s.useDataTableScroll();
-    const edit = useDataTableEdit12s9Wb_UCrN12s.useDataTableEdit(props);
-    // Wired to `scroll`'s own scroll-container ref (not a fresh one of its own) so a
-    // BOUNDED table's auto-load triggers off its own internal scroll, not the
-    // browsing viewport -- see useDataTableInfiniteScroll.ts's own doc comment.
-    const infiniteScroll = useDataTableInfiniteScroll12s8ZG31URd12s.useDataTableInfiniteScroll({
-        ...props,
-        scrollRootRef: scroll.elementRef
-    });
-    return {
-        ...sort,
-        ...selection,
-        ...search,
-        ...filter,
-        ...columns,
-        ...columnCalc,
-        ...scroll,
-        ...edit,
-        ...infiniteScroll,
-        rootProps: domUtils.elementProps({
-            role: "table"
-        })
-    };
-}
-
-exports.useDataTable = useDataTable;