@crispy-seed/data-table 0.1.0

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

@@ -0,0 +1,122 @@
+'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 };