@crispy-seed/data-table 0.1.0 → 0.1.2

package/dist/column-calc-12s-CKuSpe-l.cjs

@@ -1,149 +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 Menu12s = require('./Menu-12s-Db_zr1AP.cjs');
-var jsxRuntime = require('react/jsx-runtime');
-var React = require('react');
-var DataTable12s = require('./DataTable-12s-8LMBtS2u.cjs');
-var columnLayout12s = require('./column-layout-12s-CTu5yT_D.cjs');
-var DataTable12sZml1x9Kr12s = require('./DataTable-12s-Zml1x9Kr-12s-CTRzgvMT.cjs');
-var useDataTableColumnCalc12sDTQQTtEJ12s = require('./useDataTableColumnCalc-12s-DTQQTtEJ-12s-CvD14JYo.cjs');
-
-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);
-
-function ColumnCalcCells({ columns, rows, selectable, stickyFirst, stickyLast }) {
-    const effective = columnLayout12s.useEffectiveColumns(columns);
-    return /*#__PURE__*/ jsxRuntime.jsx(jsxRuntime.Fragment, {
-        children: effective.map(({ column }, index)=>{
-            const isFirst = index === 0;
-            const isLast = index === effective.length - 1;
-            const sticky = columnLayout12s.stickyProps({
-                selectable,
-                stickyFirst,
-                stickyLast,
-                isSelectionCell: false,
-                isFirst,
-                isLast
-            });
-            return /*#__PURE__*/ jsxRuntime.jsx(DataTable12s.DataTableFooterCell, {
-                "data-sticky": sticky["data-sticky"],
-                "data-sticky-edge": sticky["data-sticky-edge"],
-                "data-sticky-edge-end": sticky["data-sticky-edge-end"],
-                style: sticky.style,
-                children: column.summary && /*#__PURE__*/ jsxRuntime.jsx(ColumnCalcCell, {
-                    column: column,
-                    rows: rows,
-                    numeric: column.type === "number" || column.type === "currency",
-                    align: column.type === "number" || column.type === "currency" ? "right" : "left"
-                })
-            }, column.key);
-        })
-    });
-}
-function formatCalcValue(value) {
-    return value.toLocaleString(undefined, {
-        maximumFractionDigits: 2
-    });
-}
-/**
- * One ColumnCalc footer cell -- a click-anywhere-in-the-cell trigger (crisp's own
- * measured 246x36 hit target, `columncalc.recipe.ts`) that reads "Add calculation"
- * until an op is picked, then shows the computed value with its operation name beside
- * it. The math itself (`computeColumnCalc`) is headless and independently tested;
- * this component only resolves this column's own values and renders.
- */ function ColumnCalcCell({ column, rows, numeric, align }) {
-    const { getColumnCalcOp, setColumnCalcOp } = DataTable12sZml1x9Kr12s.useDataTableContext();
-    const op = getColumnCalcOp(column.key) ?? column.summaryDefaultOp;
-    const values = React__namespace.useMemo(()=>rows.map((row)=>DataTable12s.getColumnValue(column, row)), [
-        rows,
-        column
-    ]);
-    const result = React__namespace.useMemo(()=>op ? useDataTableColumnCalc12sDTQQTtEJ12s.computeColumnCalc(values, op) : null, [
-        values,
-        op
-    ]);
-    const ops = [
-        ...useDataTableColumnCalc12sDTQQTtEJ12s.DATA_TABLE_UNIVERSAL_CALC_OPS,
-        ...numeric ? useDataTableColumnCalc12sDTQQTtEJ12s.DATA_TABLE_NUMERIC_CALC_OPS : []
-    ];
-    return /*#__PURE__*/ jsxRuntime.jsxs(Menu12s.MenuRoot, {
-        children: [
-            /*#__PURE__*/ jsxRuntime.jsx(Menu12s.MenuTrigger, {
-                asChild: true,
-                children: /*#__PURE__*/ jsxRuntime.jsx("button", {
-                    type: "button",
-                    className: "seed-data-table-column-calc-trigger",
-                    "data-align": align === "right" ? "right" : undefined,
-                    children: op && result !== null ? /*#__PURE__*/ jsxRuntime.jsxs(jsxRuntime.Fragment, {
-                        children: [
-                            /*#__PURE__*/ jsxRuntime.jsx("span", {
-                                className: "seed-data-table-column-calc-value",
-                                children: formatCalcValue(result)
-                            }),
-                            /*#__PURE__*/ jsxRuntime.jsx("span", {
-                                className: "seed-data-table-column-calc-op",
-                                children: useDataTableColumnCalc12sDTQQTtEJ12s.DATA_TABLE_CALC_LABEL[op]
-                            }),
-                            /*#__PURE__*/ jsxRuntime.jsx(DataTable12s.IconChevronDownLine_default, {
-                                size: 14
-                            })
-                        ]
-                    }) : /*#__PURE__*/ jsxRuntime.jsx("span", {
-                        className: "seed-data-table-column-calc-placeholder",
-                        children: "Add calculation"
-                    })
-                })
-            }),
-            /*#__PURE__*/ jsxRuntime.jsx(Menu12s.MenuPositioner, {
-                children: /*#__PURE__*/ jsxRuntime.jsx(Menu12s.MenuContent, {
-                    style: {
-                        minWidth: 160
-                    },
-                    children: /*#__PURE__*/ jsxRuntime.jsxs(Menu12s.MenuScrollArea, {
-                        children: [
-                            ops.map((candidate)=>/*#__PURE__*/ jsxRuntime.jsx(Menu12s.MenuItem, {
-                                    onClick: ()=>setColumnCalcOp(column.key, candidate),
-                                    children: /*#__PURE__*/ jsxRuntime.jsx(Menu12s.MenuItemLabel, {
-                                        children: useDataTableColumnCalc12sDTQQTtEJ12s.DATA_TABLE_CALC_LABEL[candidate]
-                                    })
-                                }, candidate)),
-                            op && /*#__PURE__*/ jsxRuntime.jsx(Menu12s.MenuItem, {
-                                onClick: ()=>setColumnCalcOp(column.key, undefined),
-                                children: /*#__PURE__*/ jsxRuntime.jsx(Menu12s.MenuItemLabel, {
-                                    children: "Clear"
-                                })
-                            })
-                        ]
-                    })
-                })
-            })
-        ]
-    });
-}
-
-exports.ColumnCalcCells = ColumnCalcCells;

package/dist/column-layout-12s-CTu5yT_D.cjs

@@ -1,120 +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');
-var DataTable12sZml1x9Kr12s = require('./DataTable-12s-Zml1x9Kr-12s-CTRzgvMT.cjs');
-
-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);
-
-/** The subset of `useDataTableContext()` every "resolve which columns to actually
- *  render, in what order, under what label/width" helper below needs -- narrowed so
- *  each helper's own signature documents exactly what it reads, rather than the whole
- *  table API. */ function useEffectiveColumns(columns) {
-    const { visibleColumnOrder, getColumnLabel, getColumnWidth } = DataTable12sZml1x9Kr12s.useDataTableContext();
-    return React__namespace.useMemo(()=>{
-        const byKey = new Map(columns.map((column)=>[
-                column.key,
-                column
-            ]));
-        return visibleColumnOrder.map((key)=>byKey.get(key)).filter((column)=>Boolean(column)).map((column)=>({
-                column,
-                label: getColumnLabel(column.key, column.header),
-                width: getColumnWidth(column.key) ?? column.width
-            }));
-    }, [
-        columns,
-        visibleColumnOrder,
-        getColumnLabel,
-        getColumnWidth
-    ]);
-}
-/** Sticky positioning for the leading/trailing visible cell of a row (header, body, or
- *  footer) -- `stickyFirst` pins the SELECTION cell when the table has one, plus the
- *  first data column; `stickyLast` always pins the last VISIBLE data column. Only the
- *  OUTERMOST sticky cell on each side gets `data-sticky-edge(-end)` -- that's the one
- *  whose shadow should reveal on scroll, not every sticky cell.
- *
- *  When both a selection column and a sticky first data column are present, the edge
- *  is the data column (e.g. Company), not the 40px selection cell: the data column is
- *  ALSO `position: sticky`, sitting immediately to its right, so a shadow cast from the
- *  selection cell's trailing edge would render directly underneath that opaque sticky
- *  cell and never actually be visible. Putting `data-sticky-edge` on the trailing-most
- *  sticky-left cell is what makes the shadow render somewhere unobstructed -- past the
- *  whole pinned group, not between two members of it. */ function stickyProps(options) {
-    const { selectable, stickyFirst, stickyLast, isSelectionCell, isFirst, isLast } = options;
-    if (stickyFirst && isSelectionCell) {
-        // Still sticky either way. The edge marker only belongs here when there is no
-        // sticky first DATA column to hand it to instead (i.e. no columns at all) --
-        // otherwise that data column is the true trailing edge of the pinned group.
-        return selectable ? {
-            "data-sticky": "",
-            style: {
-                insetInlineStart: 0
-            }
-        } : {
-            "data-sticky": "",
-            "data-sticky-edge": "",
-            style: {
-                insetInlineStart: 0
-            }
-        };
-    }
-    if (stickyFirst && isFirst && !selectable) {
-        return {
-            "data-sticky": "",
-            "data-sticky-edge": "",
-            style: {
-                insetInlineStart: 0
-            }
-        };
-    }
-    if (stickyFirst && isFirst && selectable) {
-        // The trailing edge of the pinned group -- past the 40px selection cell, so this
-        // is where the scroll shadow actually renders unobstructed.
-        return {
-            "data-sticky": "",
-            "data-sticky-edge": "",
-            style: {
-                insetInlineStart: 40
-            }
-        };
-    }
-    if (stickyLast && isLast) {
-        return {
-            "data-sticky": "",
-            "data-sticky-edge-end": "",
-            style: {
-                insetInlineEnd: 0
-            }
-        };
-    }
-    return {};
-}
-
-exports.stickyProps = stickyProps;
-exports.useEffectiveColumns = useEffectiveColumns;

package/dist/column-layout-12s-s7wnxkMN.js

@@ -1,99 +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 { u as useDataTableContext } from './DataTable-12s-Zml1x9Kr-12s-Coi-3lUa.js';
-
-/** The subset of `useDataTableContext()` every "resolve which columns to actually
- *  render, in what order, under what label/width" helper below needs -- narrowed so
- *  each helper's own signature documents exactly what it reads, rather than the whole
- *  table API. */ function useEffectiveColumns(columns) {
-    const { visibleColumnOrder, getColumnLabel, getColumnWidth } = useDataTableContext();
-    return React.useMemo(()=>{
-        const byKey = new Map(columns.map((column)=>[
-                column.key,
-                column
-            ]));
-        return visibleColumnOrder.map((key)=>byKey.get(key)).filter((column)=>Boolean(column)).map((column)=>({
-                column,
-                label: getColumnLabel(column.key, column.header),
-                width: getColumnWidth(column.key) ?? column.width
-            }));
-    }, [
-        columns,
-        visibleColumnOrder,
-        getColumnLabel,
-        getColumnWidth
-    ]);
-}
-/** Sticky positioning for the leading/trailing visible cell of a row (header, body, or
- *  footer) -- `stickyFirst` pins the SELECTION cell when the table has one, plus the
- *  first data column; `stickyLast` always pins the last VISIBLE data column. Only the
- *  OUTERMOST sticky cell on each side gets `data-sticky-edge(-end)` -- that's the one
- *  whose shadow should reveal on scroll, not every sticky cell.
- *
- *  When both a selection column and a sticky first data column are present, the edge
- *  is the data column (e.g. Company), not the 40px selection cell: the data column is
- *  ALSO `position: sticky`, sitting immediately to its right, so a shadow cast from the
- *  selection cell's trailing edge would render directly underneath that opaque sticky
- *  cell and never actually be visible. Putting `data-sticky-edge` on the trailing-most
- *  sticky-left cell is what makes the shadow render somewhere unobstructed -- past the
- *  whole pinned group, not between two members of it. */ function stickyProps(options) {
-    const { selectable, stickyFirst, stickyLast, isSelectionCell, isFirst, isLast } = options;
-    if (stickyFirst && isSelectionCell) {
-        // Still sticky either way. The edge marker only belongs here when there is no
-        // sticky first DATA column to hand it to instead (i.e. no columns at all) --
-        // otherwise that data column is the true trailing edge of the pinned group.
-        return selectable ? {
-            "data-sticky": "",
-            style: {
-                insetInlineStart: 0
-            }
-        } : {
-            "data-sticky": "",
-            "data-sticky-edge": "",
-            style: {
-                insetInlineStart: 0
-            }
-        };
-    }
-    if (stickyFirst && isFirst && !selectable) {
-        return {
-            "data-sticky": "",
-            "data-sticky-edge": "",
-            style: {
-                insetInlineStart: 0
-            }
-        };
-    }
-    if (stickyFirst && isFirst && selectable) {
-        // The trailing edge of the pinned group -- past the 40px selection cell, so this
-        // is where the scroll shadow actually renders unobstructed.
-        return {
-            "data-sticky": "",
-            "data-sticky-edge": "",
-            style: {
-                insetInlineStart: 40
-            }
-        };
-    }
-    if (stickyLast && isLast) {
-        return {
-            "data-sticky": "",
-            "data-sticky-edge-end": "",
-            style: {
-                insetInlineEnd: 0
-            }
-        };
-    }
-    return {};
-}
-
-export { stickyProps as s, useEffectiveColumns as u };