@crispy-seed/data-table 0.1.1 → 0.1.3

package/dist/useDataTableColumnCalc-12s-DTQQTtEJ-12s-CvD14JYo.cjs

@@ -1,207 +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 React = require('react');
-
-function _interopNamespace(e) {
-  if (e && e.__esModule) return e;
-  var n = Object.create(null);
-  if (e) {
-    Object.keys(e).forEach(function (k) {
-      if (k !== 'default') {
-        var d = Object.getOwnPropertyDescriptor(e, k);
-        Object.defineProperty(n, k, d.get ? d : {
-          enumerable: true,
-          get: function () { return e[k]; }
-        });
-      }
-    });
-  }
-  n.default = e;
-  return n;
-}
-
-var React__namespace = /*#__PURE__*/_interopNamespace(React);
-
-// packages/react/use-layout-effect/src/use-layout-effect.tsx
-var useLayoutEffect2 = globalThis?.document ? React__namespace.useLayoutEffect : ()=>{};
-
-// src/use-controllable-state.tsx
-var useInsertionEffect = React__namespace[" useInsertionEffect ".trim().toString()] || useLayoutEffect2;
-function useControllableState({ prop, defaultProp, onChange = ()=>{}, caller }) {
-    const [uncontrolledProp, setUncontrolledProp, onChangeRef] = useUncontrolledState({
-        defaultProp,
-        onChange
-    });
-    const isControlled = prop !== void 0;
-    const value = isControlled ? prop : uncontrolledProp;
-    {
-        const isControlledRef = React__namespace.useRef(prop !== void 0);
-        React__namespace.useEffect(()=>{
-            const wasControlled = isControlledRef.current;
-            if (wasControlled !== isControlled) {
-                const from = wasControlled ? "controlled" : "uncontrolled";
-                const to = isControlled ? "controlled" : "uncontrolled";
-                console.warn(`${caller} is changing from ${from} to ${to}. Components should not switch from controlled to uncontrolled (or vice versa). Decide between using a controlled or uncontrolled value for the lifetime of the component.`);
-            }
-            isControlledRef.current = isControlled;
-        }, [
-            isControlled,
-            caller
-        ]);
-    }
-    const setValue = React__namespace.useCallback((nextValue)=>{
-        if (isControlled) {
-            const value2 = isFunction(nextValue) ? nextValue(prop) : nextValue;
-            if (value2 !== prop) {
-                onChangeRef.current?.(value2);
-            }
-        } else {
-            setUncontrolledProp(nextValue);
-        }
-    }, [
-        isControlled,
-        prop,
-        setUncontrolledProp,
-        onChangeRef
-    ]);
-    return [
-        value,
-        setValue
-    ];
-}
-function useUncontrolledState({ defaultProp, onChange }) {
-    const [value, setValue] = React__namespace.useState(defaultProp);
-    const prevValueRef = React__namespace.useRef(value);
-    const onChangeRef = React__namespace.useRef(onChange);
-    useInsertionEffect(()=>{
-        onChangeRef.current = onChange;
-    }, [
-        onChange
-    ]);
-    React__namespace.useEffect(()=>{
-        if (prevValueRef.current !== value) {
-            onChangeRef.current?.(value);
-            prevValueRef.current = value;
-        }
-    }, [
-        value,
-        prevValueRef
-    ]);
-    return [
-        value,
-        setValue,
-        onChangeRef
-    ];
-}
-function isFunction(value) {
-    return typeof value === "function";
-}
-
-const DATA_TABLE_UNIVERSAL_CALC_OPS = [
-    "count",
-    "countFilled"
-];
-const DATA_TABLE_NUMERIC_CALC_OPS = [
-    "sum",
-    "average",
-    "min",
-    "max"
-];
-const DATA_TABLE_CALC_LABEL = {
-    count: "Count",
-    countFilled: "Count filled",
-    sum: "Sum",
-    average: "Average",
-    min: "Min",
-    max: "Max"
-};
-/** A value counts as empty when it is null/undefined, an empty string, or an empty
- *  array -- crisp's own `isEmptyValue` (columncalc.tsx), reused verbatim. */ function isEmptyValueForCalc(value) {
-    if (value == null) return true;
-    if (typeof value === "string") return value.trim() === "";
-    if (Array.isArray(value)) return value.length === 0;
-    return false;
-}
-/**
- * Pure so the arithmetic is independently (and mutation-) testable without rendering a
- * table at all. `sum`/`average`/`min`/`max` skip empty values and non-numeric ones
- * (coerced via `Number`, dropping `NaN`); they return `null` -- render nothing, not a
- * misleading 0 -- when there is nothing numeric left to reduce over.
- */ function computeColumnCalc(values, op) {
-    switch(op){
-        case "count":
-            return values.length;
-        case "countFilled":
-            return values.filter((value)=>!isEmptyValueForCalc(value)).length;
-    }
-    const numbers = values.filter((value)=>!isEmptyValueForCalc(value)).map((value)=>typeof value === "number" ? value : Number(value)).filter((value)=>Number.isFinite(value));
-    if (numbers.length === 0) return null;
-    switch(op){
-        case "sum":
-            return numbers.reduce((total, value)=>total + value, 0);
-        case "average":
-            return numbers.reduce((total, value)=>total + value, 0) / numbers.length;
-        case "min":
-            return Math.min(...numbers);
-        case "max":
-            return Math.max(...numbers);
-        default:
-            return null;
-    }
-}
-const EMPTY_OPS = {};
-// Owns which aggregation (if any) each column's ColumnCalc footer cell currently
-// shows -- the way useDataTableFilter owns one filter per column key. The actual
-// REDUCE over row values needs `TRow` (a type this headless package never sees), so
-// -- same split as sort/search/filter -- this hook only tracks WHICH op is active per
-// column; the styled layer (DataTable.tsx's `ColumnCalcCell`) calls `computeColumnCalc`
-// with the column's own resolved values.
-function useDataTableColumnCalc(props) {
-    const { columnCalcOps: opsProp, defaultColumnCalcOps = EMPTY_OPS, onColumnCalcOpsChange } = props;
-    const [columnCalcOps = EMPTY_OPS, setColumnCalcOps] = useControllableState({
-        prop: opsProp,
-        defaultProp: defaultColumnCalcOps,
-        onChange: onColumnCalcOpsChange
-    });
-    const getColumnCalcOp = React.useCallback((columnKey)=>columnCalcOps[columnKey], [
-        columnCalcOps
-    ]);
-    const setColumnCalcOp = React.useCallback((columnKey, op)=>{
-        setColumnCalcOps((current = EMPTY_OPS)=>{
-            if (op === undefined) {
-                if (!(columnKey in current)) return current;
-                const next = {
-                    ...current
-                };
-                delete next[columnKey];
-                return next;
-            }
-            return {
-                ...current,
-                [columnKey]: op
-            };
-        });
-    }, [
-        setColumnCalcOps
-    ]);
-    return {
-        columnCalcOps,
-        getColumnCalcOp,
-        setColumnCalcOp
-    };
-}
-
-exports.DATA_TABLE_CALC_LABEL = DATA_TABLE_CALC_LABEL;
-exports.DATA_TABLE_NUMERIC_CALC_OPS = DATA_TABLE_NUMERIC_CALC_OPS;
-exports.DATA_TABLE_UNIVERSAL_CALC_OPS = DATA_TABLE_UNIVERSAL_CALC_OPS;
-exports.computeColumnCalc = computeColumnCalc;
-exports.useControllableState = useControllableState;
-exports.useDataTableColumnCalc = useDataTableColumnCalc;

package/dist/useDataTableColumnCalc-12s-DTQQTtEJ-12s-DsEse3uq.js

@@ -1,183 +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 * as React from 'react';
-import { useCallback } from 'react';
-
-// packages/react/use-layout-effect/src/use-layout-effect.tsx
-var useLayoutEffect2 = globalThis?.document ? React.useLayoutEffect : ()=>{};
-
-// src/use-controllable-state.tsx
-var useInsertionEffect = React[" useInsertionEffect ".trim().toString()] || useLayoutEffect2;
-function useControllableState({ prop, defaultProp, onChange = ()=>{}, caller }) {
-    const [uncontrolledProp, setUncontrolledProp, onChangeRef] = useUncontrolledState({
-        defaultProp,
-        onChange
-    });
-    const isControlled = prop !== void 0;
-    const value = isControlled ? prop : uncontrolledProp;
-    {
-        const isControlledRef = React.useRef(prop !== void 0);
-        React.useEffect(()=>{
-            const wasControlled = isControlledRef.current;
-            if (wasControlled !== isControlled) {
-                const from = wasControlled ? "controlled" : "uncontrolled";
-                const to = isControlled ? "controlled" : "uncontrolled";
-                console.warn(`${caller} is changing from ${from} to ${to}. Components should not switch from controlled to uncontrolled (or vice versa). Decide between using a controlled or uncontrolled value for the lifetime of the component.`);
-            }
-            isControlledRef.current = isControlled;
-        }, [
-            isControlled,
-            caller
-        ]);
-    }
-    const setValue = React.useCallback((nextValue)=>{
-        if (isControlled) {
-            const value2 = isFunction(nextValue) ? nextValue(prop) : nextValue;
-            if (value2 !== prop) {
-                onChangeRef.current?.(value2);
-            }
-        } else {
-            setUncontrolledProp(nextValue);
-        }
-    }, [
-        isControlled,
-        prop,
-        setUncontrolledProp,
-        onChangeRef
-    ]);
-    return [
-        value,
-        setValue
-    ];
-}
-function useUncontrolledState({ defaultProp, onChange }) {
-    const [value, setValue] = React.useState(defaultProp);
-    const prevValueRef = React.useRef(value);
-    const onChangeRef = React.useRef(onChange);
-    useInsertionEffect(()=>{
-        onChangeRef.current = onChange;
-    }, [
-        onChange
-    ]);
-    React.useEffect(()=>{
-        if (prevValueRef.current !== value) {
-            onChangeRef.current?.(value);
-            prevValueRef.current = value;
-        }
-    }, [
-        value,
-        prevValueRef
-    ]);
-    return [
-        value,
-        setValue,
-        onChangeRef
-    ];
-}
-function isFunction(value) {
-    return typeof value === "function";
-}
-
-const DATA_TABLE_UNIVERSAL_CALC_OPS = [
-    "count",
-    "countFilled"
-];
-const DATA_TABLE_NUMERIC_CALC_OPS = [
-    "sum",
-    "average",
-    "min",
-    "max"
-];
-const DATA_TABLE_CALC_LABEL = {
-    count: "Count",
-    countFilled: "Count filled",
-    sum: "Sum",
-    average: "Average",
-    min: "Min",
-    max: "Max"
-};
-/** A value counts as empty when it is null/undefined, an empty string, or an empty
- *  array -- crisp's own `isEmptyValue` (columncalc.tsx), reused verbatim. */ function isEmptyValueForCalc(value) {
-    if (value == null) return true;
-    if (typeof value === "string") return value.trim() === "";
-    if (Array.isArray(value)) return value.length === 0;
-    return false;
-}
-/**
- * Pure so the arithmetic is independently (and mutation-) testable without rendering a
- * table at all. `sum`/`average`/`min`/`max` skip empty values and non-numeric ones
- * (coerced via `Number`, dropping `NaN`); they return `null` -- render nothing, not a
- * misleading 0 -- when there is nothing numeric left to reduce over.
- */ function computeColumnCalc(values, op) {
-    switch(op){
-        case "count":
-            return values.length;
-        case "countFilled":
-            return values.filter((value)=>!isEmptyValueForCalc(value)).length;
-    }
-    const numbers = values.filter((value)=>!isEmptyValueForCalc(value)).map((value)=>typeof value === "number" ? value : Number(value)).filter((value)=>Number.isFinite(value));
-    if (numbers.length === 0) return null;
-    switch(op){
-        case "sum":
-            return numbers.reduce((total, value)=>total + value, 0);
-        case "average":
-            return numbers.reduce((total, value)=>total + value, 0) / numbers.length;
-        case "min":
-            return Math.min(...numbers);
-        case "max":
-            return Math.max(...numbers);
-        default:
-            return null;
-    }
-}
-const EMPTY_OPS = {};
-// Owns which aggregation (if any) each column's ColumnCalc footer cell currently
-// shows -- the way useDataTableFilter owns one filter per column key. The actual
-// REDUCE over row values needs `TRow` (a type this headless package never sees), so
-// -- same split as sort/search/filter -- this hook only tracks WHICH op is active per
-// column; the styled layer (DataTable.tsx's `ColumnCalcCell`) calls `computeColumnCalc`
-// with the column's own resolved values.
-function useDataTableColumnCalc(props) {
-    const { columnCalcOps: opsProp, defaultColumnCalcOps = EMPTY_OPS, onColumnCalcOpsChange } = props;
-    const [columnCalcOps = EMPTY_OPS, setColumnCalcOps] = useControllableState({
-        prop: opsProp,
-        defaultProp: defaultColumnCalcOps,
-        onChange: onColumnCalcOpsChange
-    });
-    const getColumnCalcOp = useCallback((columnKey)=>columnCalcOps[columnKey], [
-        columnCalcOps
-    ]);
-    const setColumnCalcOp = useCallback((columnKey, op)=>{
-        setColumnCalcOps((current = EMPTY_OPS)=>{
-            if (op === undefined) {
-                if (!(columnKey in current)) return current;
-                const next = {
-                    ...current
-                };
-                delete next[columnKey];
-                return next;
-            }
-            return {
-                ...current,
-                [columnKey]: op
-            };
-        });
-    }, [
-        setColumnCalcOps
-    ]);
-    return {
-        columnCalcOps,
-        getColumnCalcOp,
-        setColumnCalcOp
-    };
-}
-
-export { DATA_TABLE_CALC_LABEL as D, DATA_TABLE_UNIVERSAL_CALC_OPS as a, DATA_TABLE_NUMERIC_CALC_OPS as b, computeColumnCalc as c, useControllableState as d, useDataTableColumnCalc as u };

package/dist/useDataTableColumns-12s-Cn2ZAzFL-12s-CD6goR59.js

@@ -1,289 +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 { d as useControllableState } from './useDataTableColumnCalc-12s-DTQQTtEJ-12s-DsEse3uq.js';
-import { dataAttr } from '@seed-design/dom-utils';
-import { useMemo, useCallback, useState, useRef } from 'react';
-
-// Select's `dom.ts` reads state off REAL rendered elements (aria-disabled, data-value)
-// because its options register asynchronously through a floating-ui list and the DOM
-// is the one thing always in sync with `elementsRef`. DataTable's selection has no
-// such registry -- it is two plain id arrays (`rowIds`, `selectedIds`) the root already
-// holds -- so there is nothing to inspect on an element. What's isolated here instead is
-// the same KIND of thing Select isolates: small pure functions the state hooks would
-// otherwise inline, kept out of the hooks so they can be unit-tested (and mutation-
-// tested) on their own.
-/**
- * Tri-state selection summary of `selectedIds` against the CURRENTLY RENDERED
- * `rowIds` -- never against `selectedIds` alone, so a stale id that scrolled out of a
- * filtered/sorted view can't quietly count toward "all" or "some".
- */ function computeSelectionState(rowIds, selectedIds) {
-    if (rowIds.length === 0) return "none";
-    const selectedIdSet = new Set(selectedIds);
-    const selectedRowCount = rowIds.filter((id)=>selectedIdSet.has(id)).length;
-    if (selectedRowCount === 0) return "none";
-    return selectedRowCount === rowIds.length ? "all" : "some";
-}
-/** Adds `id` if absent, removes it if present. Never mutates `ids`. */ function toggleMembership(ids, id) {
-    return ids.includes(id) ? ids.filter((existing)=>existing !== id) : [
-        ...ids,
-        id
-    ];
-}
-/**
- * Reconciles a persisted/controlled column ORDER against the table's current column
- * KEYS -- used by useDataTableColumns so a consumer's `columnOrder` never silently drops
- * a column the table actually renders (a key added to `columns` after the order was
- * first captured) nor keeps a ghost entry for one that was removed. Known keys keep
- * their position from `order`; any key in `keys` missing from `order` is appended, in
- * `keys`' own order; any entry in `order` no longer in `keys` is dropped.
- */ function reconcileColumnOrder(order, keys) {
-    const keySet = new Set(keys);
-    const known = order.filter((key)=>keySet.has(key));
-    const knownSet = new Set(known);
-    const added = keys.filter((key)=>!knownSet.has(key));
-    return [
-        ...known,
-        ...added
-    ];
-}
-/**
- * Moves `key` one step toward `direction` in `order` -- a no-op (same array, well,
- * an equal-valued copy) at the edge it would otherwise walk off. Column-menu's
- * "Move left"/"Move right" (DATATABLE-ATTIO-SPEC.md's column menu) is one call of
- * this per click; drag-to-reorder is `reorderColumn` below instead, which can jump
- * more than one position in a single move.
- */ function moveColumnKey(order, key, direction) {
-    const index = order.indexOf(key);
-    if (index === -1) return [
-        ...order
-    ];
-    const targetIndex = direction === "left" ? index - 1 : index + 1;
-    if (targetIndex < 0 || targetIndex >= order.length) return [
-        ...order
-    ];
-    const next = [
-        ...order
-    ];
-    [next[index], next[targetIndex]] = [
-        next[targetIndex],
-        next[index]
-    ];
-    return next;
-}
-/**
- * Drag-to-reorder: removes `dragKey` from `order` and reinserts it immediately before
- * `dropKey`'s CURRENT position (i.e. its position after the removal, so dropping a
- * column just after its own old slot doesn't appear to do nothing). A no-op (an
- * equal-valued copy) when either key is missing or they're the same key.
- */ function reorderColumnKey(order, dragKey, dropKey) {
-    if (dragKey === dropKey || !order.includes(dragKey) || !order.includes(dropKey)) {
-        return [
-            ...order
-        ];
-    }
-    const withoutDrag = order.filter((key)=>key !== dragKey);
-    const dropIndex = withoutDrag.indexOf(dropKey);
-    return [
-        ...withoutDrag.slice(0, dropIndex),
-        dragKey,
-        ...withoutDrag.slice(dropIndex)
-    ];
-}
-/** Clamps a drag-resized column width to a sane range -- crisp's own datatable.tsx
- *  resize handler clamps the same way (a column can neither collapse to unreadable
- *  nor balloon past a sane cap from one fast mouse move). */ function clampColumnWidth(width, min = 80, max = 640) {
-    return Math.min(max, Math.max(min, width));
-}
-/**
- * Infinite scroll's own gate: fire `onLoadMore` only when the sentinel is ACTUALLY
- * intersecting (not e.g. an observer's initial `false` callback, which fires once on
- * `observe()` before any real intersection), there IS a next page (`hasMore`), and no
- * fetch is already in flight (`loadingMore`) -- either of the latter two alone must
- * suppress a trigger, which is why this is a pure `&&` rather than three separate
- * call sites that could each drift. Isolated the same way `computeSelectionState`/
- * `toggleMembership` are: the real IntersectionObserver callback (useDataTable
- * InfiniteScroll.ts) is unit-testable only through a live browser API, but the
- * DECISION it makes on every callback is plain data in, boolean out.
- */ function shouldTriggerLoadMore(isIntersecting, hasMore, loadingMore) {
-    return hasMore && !loadingMore;
-}
-const EMPTY_STRINGS = [];
-const EMPTY_RECORD = {};
-/**
- * Owns everything DATATABLE-ATTIO-SPEC.md's column menu + reorder + resize tranche
- * needs -- order, visibility, a per-column label override, and a per-column width --
- * the way useDataTableSelection owns the one selected-id SET rather than one hook per
- * row. All four are "one value per column key" maps/lists a consumer may want to
- * persist (a saved view), so they share this hook instead of splitting into four
- * separate ones; drag-to-reorder and drag-to-resize (below) are the two INTERACTIONS
- * built on top of the order/width state this hook already owns, not independent state
- * of their own.
- */ function useDataTableColumns(props) {
-    const { columnKeys = EMPTY_STRINGS, columnOrder: columnOrderProp, defaultColumnOrder, onColumnOrderChange, hiddenColumnKeys: hiddenProp, defaultHiddenColumnKeys = EMPTY_STRINGS, onHiddenColumnKeysChange, columnWidths: widthsProp, defaultColumnWidths = EMPTY_RECORD, onColumnWidthsChange, columnLabels: labelsProp, defaultColumnLabels = EMPTY_RECORD, onColumnLabelsChange } = props;
-    const [rawOrder, setRawOrder] = useControllableState({
-        prop: columnOrderProp,
-        defaultProp: defaultColumnOrder ?? columnKeys,
-        onChange: onColumnOrderChange
-    });
-    // Reconciled EVERY render against the table's current `columnKeys` (dom.ts's
-    // `reconcileColumnOrder`), not just once at mount -- a controlled `columnOrder` a
-    // consumer persisted before a new column existed must still show that new column
-    // (appended), and one holding a column that got removed from `columns` must not
-    // render a ghost header for it.
-    const columnOrder = useMemo(()=>reconcileColumnOrder(rawOrder ?? columnKeys, columnKeys), [
-        rawOrder,
-        columnKeys
-    ]);
-    const [hiddenColumnKeys = EMPTY_STRINGS, setHiddenColumnKeys] = useControllableState({
-        prop: hiddenProp,
-        defaultProp: defaultHiddenColumnKeys,
-        onChange: onHiddenColumnKeysChange
-    });
-    const hiddenSet = useMemo(()=>new Set(hiddenColumnKeys), [
-        hiddenColumnKeys
-    ]);
-    const [columnWidths = EMPTY_RECORD, setColumnWidths] = useControllableState({
-        prop: widthsProp,
-        defaultProp: defaultColumnWidths,
-        onChange: onColumnWidthsChange
-    });
-    const [columnLabels = EMPTY_RECORD, setColumnLabels] = useControllableState({
-        prop: labelsProp,
-        defaultProp: defaultColumnLabels,
-        onChange: onColumnLabelsChange
-    });
-    const visibleColumnOrder = useMemo(()=>columnOrder.filter((key)=>!hiddenSet.has(key)), [
-        columnOrder,
-        hiddenSet
-    ]);
-    const isColumnHidden = useCallback((key)=>hiddenSet.has(key), [
-        hiddenSet
-    ]);
-    const hideColumn = useCallback((key)=>setHiddenColumnKeys((current = EMPTY_STRINGS)=>[
-                ...current,
-                key
-            ]), [
-        setHiddenColumnKeys
-    ]);
-    const showColumn = useCallback((key)=>setHiddenColumnKeys((current = EMPTY_STRINGS)=>current.filter((existing)=>existing !== key)), [
-        setHiddenColumnKeys
-    ]);
-    const toggleColumnVisibility = useCallback((key)=>isColumnHidden(key) ? showColumn(key) : hideColumn(key), [
-        isColumnHidden,
-        showColumn,
-        hideColumn
-    ]);
-    const getColumnLabel = useCallback((key, fallback)=>columnLabels[key] ?? fallback, [
-        columnLabels
-    ]);
-    const renameColumn = useCallback((key, label)=>setColumnLabels((current = EMPTY_RECORD)=>({
-                ...current,
-                [key]: label
-            })), [
-        setColumnLabels
-    ]);
-    const getColumnWidth = useCallback((key)=>columnWidths[key], [
-        columnWidths
-    ]);
-    const setColumnWidth = useCallback((key, width)=>setColumnWidths((current = EMPTY_RECORD)=>({
-                ...current,
-                [key]: clampColumnWidth(width)
-            })), [
-        setColumnWidths
-    ]);
-    const moveColumn = useCallback((key, direction)=>setRawOrder((current)=>moveColumnKey(current ?? columnKeys, key, direction)), [
-        setRawOrder,
-        columnKeys
-    ]);
-    const reorderColumn = useCallback((dragKey, dropKey)=>setRawOrder((current)=>reorderColumnKey(current ?? columnKeys, dragKey, dropKey)), [
-        setRawOrder,
-        columnKeys
-    ]);
-    // -- drag-to-reorder ---------------------------------------------------------------
-    // Live state only (which column is currently being dragged) -- the styled layer
-    // drives it by calling `dragOverColumn` as the pointer crosses OTHER header cells
-    // (via `document.elementFromPoint`, since a captured pointer stops native
-    // `pointerenter` from firing on siblings), which reorders immediately rather than
-    // waiting for a drop. That is exactly what Attio's own header drag does (the column
-    // being passed visibly swaps live), and it means `endColumnDrag` never has to also
-    // commit a move -- there is nothing left to commit.
-    const [draggingColumnKey, setDraggingColumnKey] = useState(null);
-    const beginColumnDrag = useCallback((key)=>setDraggingColumnKey(key), []);
-    const dragOverColumn = useCallback((hoverKey)=>{
-        setDraggingColumnKey((current)=>{
-            if (!current || current === hoverKey) return current;
-            reorderColumn(current, hoverKey);
-            return current;
-        });
-    }, [
-        reorderColumn
-    ]);
-    const endColumnDrag = useCallback(()=>setDraggingColumnKey(null), []);
-    // -- drag-to-resize ------------------------------------------------------------------
-    // `resizeStartRef` holds the ONE thing that must survive across pointermove events
-    // without triggering a re-render on every pixel (the drag's origin) -- state
-    // (`resizingColumnKey`) is only for what the render actually needs: which column's
-    // handle should show its active/dragging look.
-    const resizeStartRef = useRef(null);
-    const [resizingColumnKey, setResizingColumnKey] = useState(null);
-    const beginColumnResize = useCallback((key, clientX, currentWidth)=>{
-        resizeStartRef.current = {
-            key,
-            startX: clientX,
-            startWidth: currentWidth
-        };
-        setResizingColumnKey(key);
-    }, []);
-    const updateColumnResize = useCallback((clientX)=>{
-        const start = resizeStartRef.current;
-        if (!start) return;
-        setColumnWidth(start.key, start.startWidth + (clientX - start.startX));
-    }, [
-        setColumnWidth
-    ]);
-    const endColumnResize = useCallback(()=>{
-        resizeStartRef.current = null;
-        setResizingColumnKey(null);
-    }, []);
-    return {
-        columnOrder,
-        visibleColumnOrder,
-        hiddenColumnKeys,
-        columnWidths,
-        columnLabels,
-        isColumnHidden,
-        hideColumn,
-        showColumn,
-        toggleColumnVisibility,
-        getColumnLabel,
-        renameColumn,
-        getColumnWidth,
-        setColumnWidth,
-        moveColumn,
-        reorderColumn,
-        draggingColumnKey,
-        beginColumnDrag,
-        dragOverColumn,
-        endColumnDrag,
-        resizingColumnKey,
-        beginColumnResize,
-        updateColumnResize,
-        endColumnResize,
-        // Exposed for the styled layer's header cell -- `data-dragging`/`data-resizing`
-        // read directly off state above already cover most of it; `dataAttr` re-exported
-        // via this hook's own module keeps every other sub-hook's habit of building its
-        // own data-attribute values rather than the styled layer re-deriving booleans.
-        isColumnDragging: (key)=>dataAttr(draggingColumnKey === key),
-        isColumnResizing: (key)=>dataAttr(resizingColumnKey === key)
-    };
-}
-
-export { computeSelectionState as c, shouldTriggerLoadMore as s, toggleMembership as t, useDataTableColumns as u };