@crispy-seed/data-table 0.1.0

package/dist/DataTable-12s-Zml1x9Kr-12s-CTRzgvMT.cjs

@@ -0,0 +1,161 @@
+'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');
+var domUtils = require('@seed-design/dom-utils');
+var reactPrimitive = require('@seed-design/react-primitive');
+var React = require('react');
+var useDataTable12sBHiDUubw12s = require('./useDataTable-12s-BHiDUubw-12s-Dgvt7XDk.cjs');
+var useDataTableRow12sCPYaDa1p12s = require('./useDataTableRow-12s-CPYaDa1p-12s-D-DRjwAe.cjs');
+
+const DataTableContext = /*#__PURE__*/ React.createContext(null);
+const DataTableProvider = DataTableContext.Provider;
+function useDataTableContext({ strict = true } = {}) {
+    const context = React.useContext(DataTableContext);
+    if (!context && strict) {
+        throw new Error("useDataTableContext must be used within a DataTable");
+    }
+    return context;
+}
+const DataTableRowContext = /*#__PURE__*/ React.createContext(null);
+const DataTableRowProvider = DataTableRowContext.Provider;
+function useDataTableRowContext({ strict = true } = {}) {
+    const context = React.useContext(DataTableRowContext);
+    if (!context && strict) {
+        throw new Error("useDataTableRowContext must be used within a DataTableRow");
+    }
+    return context;
+}
+const DataTableRoot = /*#__PURE__*/ React.forwardRef((props, ref)=>{
+    const { sort, defaultSort, onSortChange, rowIds, selectable, selectedIds, defaultSelectedIds, onSelectionChange, query, defaultQuery, onQueryChange, filters, defaultFilters, onFiltersChange, columnKeys, columnOrder, defaultColumnOrder, onColumnOrderChange, hiddenColumnKeys, defaultHiddenColumnKeys, onHiddenColumnKeysChange, columnWidths, defaultColumnWidths, onColumnWidthsChange, columnLabels, defaultColumnLabels, onColumnLabelsChange, columnCalcOps, defaultColumnCalcOps, onColumnCalcOpsChange, onEdit, onLoadMore, hasMore, loadingMore, ...otherProps } = props;
+    const api = useDataTable12sBHiDUubw12s.useDataTable({
+        sort,
+        defaultSort,
+        onSortChange,
+        rowIds,
+        selectable,
+        selectedIds,
+        defaultSelectedIds,
+        onSelectionChange,
+        query,
+        defaultQuery,
+        onQueryChange,
+        filters,
+        defaultFilters,
+        onFiltersChange,
+        columnKeys,
+        columnOrder,
+        defaultColumnOrder,
+        onColumnOrderChange,
+        hiddenColumnKeys,
+        defaultHiddenColumnKeys,
+        onHiddenColumnKeysChange,
+        columnWidths,
+        defaultColumnWidths,
+        onColumnWidthsChange,
+        columnLabels,
+        defaultColumnLabels,
+        onColumnLabelsChange,
+        columnCalcOps,
+        defaultColumnCalcOps,
+        onColumnCalcOpsChange,
+        onEdit,
+        onLoadMore,
+        hasMore,
+        loadingMore
+    });
+    return /*#__PURE__*/ jsxRuntime.jsx(DataTableProvider, {
+        value: api,
+        children: /*#__PURE__*/ jsxRuntime.jsx(reactPrimitive.Primitive.div, {
+            ref: ref,
+            ...otherProps
+        })
+    });
+});
+DataTableRoot.displayName = "DataTableRoot";
+/**
+ * The real `<table>` -- everything a native table gets for free (columns that line up
+ * by construction across `<thead>`/`<tbody>`/`<tfoot>`, `<th scope="col">` semantics,
+ * sticky `th`/`td` that actually work under horizontal scroll) that a `display: flex`
+ * div grid faked with ARIA and broke on. `rootProps` (just `role: "table"`, which a
+ * real `<table>` already implies) comes off context rather than being computed here --
+ * `useDataTable()` runs once, in `DataTableRoot` above, not per render of this sibling.
+ */ const DataTableTable = /*#__PURE__*/ React.forwardRef((props, ref)=>{
+    const { rootProps } = useDataTableContext();
+    const mergedProps = domUtils.mergeProps(rootProps, props);
+    return /*#__PURE__*/ jsxRuntime.jsx(reactPrimitive.Primitive.table, {
+        ref: ref,
+        ...mergedProps
+    });
+});
+DataTableTable.displayName = "DataTableTable";
+/**
+ * `<thead>`, wrapping its own children in a single `<tr>` -- the styled layer still
+ * renders every header cell as a flat child of `DataTableHeader` (one header row is
+ * the only shape this table supports), so that `<tr>` is supplied HERE rather than
+ * asking every call site to add it.
+ */ const DataTableHeader = /*#__PURE__*/ React.forwardRef(({ children, ...otherProps }, ref)=>{
+    return /*#__PURE__*/ jsxRuntime.jsx(reactPrimitive.Primitive.thead, {
+        ref: ref,
+        ...otherProps,
+        children: /*#__PURE__*/ jsxRuntime.jsx("tr", {
+            children: children
+        })
+    });
+});
+DataTableHeader.displayName = "DataTableHeader";
+const DataTableHeaderCell = /*#__PURE__*/ React.forwardRef(({ columnKey, sortable, ...otherProps }, ref)=>{
+    const { getHeaderCellProps } = useDataTableContext();
+    const mergedProps = domUtils.mergeProps(getHeaderCellProps(columnKey, sortable), otherProps);
+    return /*#__PURE__*/ jsxRuntime.jsx(reactPrimitive.Primitive.th, {
+        scope: "col",
+        ref: ref,
+        ...mergedProps
+    });
+});
+DataTableHeaderCell.displayName = "DataTableHeaderCell";
+const DataTableBody = /*#__PURE__*/ React.forwardRef((props, ref)=>{
+    return /*#__PURE__*/ jsxRuntime.jsx(reactPrimitive.Primitive.tbody, {
+        ref: ref,
+        ...props
+    });
+});
+DataTableBody.displayName = "DataTableBody";
+const DataTableRow = /*#__PURE__*/ React.forwardRef(({ rowId, ...otherProps }, ref)=>{
+    const row = useDataTableRow12sCPYaDa1p12s.useDataTableRow({
+        rowId
+    });
+    const mergedProps = domUtils.mergeProps(row.rootProps, otherProps);
+    return /*#__PURE__*/ jsxRuntime.jsx(DataTableRowProvider, {
+        value: row,
+        children: /*#__PURE__*/ jsxRuntime.jsx(reactPrimitive.Primitive.tr, {
+            ref: ref,
+            ...mergedProps
+        })
+    });
+});
+DataTableRow.displayName = "DataTableRow";
+const DataTableCell = /*#__PURE__*/ React.forwardRef((props, ref)=>{
+    return /*#__PURE__*/ jsxRuntime.jsx(reactPrimitive.Primitive.td, {
+        ref: ref,
+        ...props
+    });
+});
+DataTableCell.displayName = "DataTableCell";
+
+exports.DataTableBody = DataTableBody;
+exports.DataTableCell = DataTableCell;
+exports.DataTableHeader = DataTableHeader;
+exports.DataTableHeaderCell = DataTableHeaderCell;
+exports.DataTableRoot = DataTableRoot;
+exports.DataTableRow = DataTableRow;
+exports.DataTableTable = DataTableTable;
+exports.useDataTableContext = useDataTableContext;
+exports.useDataTableRowContext = useDataTableRowContext;

package/dist/DataTable-12s-Zml1x9Kr-12s-Coi-3lUa.js

@@ -0,0 +1,153 @@
+'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 { jsx } from 'react/jsx-runtime';
+import { mergeProps } from '@seed-design/dom-utils';
+import { Primitive } from '@seed-design/react-primitive';
+import { forwardRef, createContext, useContext } from 'react';
+import { u as useDataTable } from './useDataTable-12s-BHiDUubw-12s-CBeCwTe7.js';
+import { u as useDataTableRow } from './useDataTableRow-12s-CPYaDa1p-12s-BmUSAnPe.js';
+
+const DataTableContext = /*#__PURE__*/ createContext(null);
+const DataTableProvider = DataTableContext.Provider;
+function useDataTableContext({ strict = true } = {}) {
+    const context = useContext(DataTableContext);
+    if (!context && strict) {
+        throw new Error("useDataTableContext must be used within a DataTable");
+    }
+    return context;
+}
+const DataTableRowContext = /*#__PURE__*/ createContext(null);
+const DataTableRowProvider = DataTableRowContext.Provider;
+function useDataTableRowContext({ strict = true } = {}) {
+    const context = useContext(DataTableRowContext);
+    if (!context && strict) {
+        throw new Error("useDataTableRowContext must be used within a DataTableRow");
+    }
+    return context;
+}
+const DataTableRoot = /*#__PURE__*/ forwardRef((props, ref)=>{
+    const { sort, defaultSort, onSortChange, rowIds, selectable, selectedIds, defaultSelectedIds, onSelectionChange, query, defaultQuery, onQueryChange, filters, defaultFilters, onFiltersChange, columnKeys, columnOrder, defaultColumnOrder, onColumnOrderChange, hiddenColumnKeys, defaultHiddenColumnKeys, onHiddenColumnKeysChange, columnWidths, defaultColumnWidths, onColumnWidthsChange, columnLabels, defaultColumnLabels, onColumnLabelsChange, columnCalcOps, defaultColumnCalcOps, onColumnCalcOpsChange, onEdit, onLoadMore, hasMore, loadingMore, ...otherProps } = props;
+    const api = useDataTable({
+        sort,
+        defaultSort,
+        onSortChange,
+        rowIds,
+        selectable,
+        selectedIds,
+        defaultSelectedIds,
+        onSelectionChange,
+        query,
+        defaultQuery,
+        onQueryChange,
+        filters,
+        defaultFilters,
+        onFiltersChange,
+        columnKeys,
+        columnOrder,
+        defaultColumnOrder,
+        onColumnOrderChange,
+        hiddenColumnKeys,
+        defaultHiddenColumnKeys,
+        onHiddenColumnKeysChange,
+        columnWidths,
+        defaultColumnWidths,
+        onColumnWidthsChange,
+        columnLabels,
+        defaultColumnLabels,
+        onColumnLabelsChange,
+        columnCalcOps,
+        defaultColumnCalcOps,
+        onColumnCalcOpsChange,
+        onEdit,
+        onLoadMore,
+        hasMore,
+        loadingMore
+    });
+    return /*#__PURE__*/ jsx(DataTableProvider, {
+        value: api,
+        children: /*#__PURE__*/ jsx(Primitive.div, {
+            ref: ref,
+            ...otherProps
+        })
+    });
+});
+DataTableRoot.displayName = "DataTableRoot";
+/**
+ * The real `<table>` -- everything a native table gets for free (columns that line up
+ * by construction across `<thead>`/`<tbody>`/`<tfoot>`, `<th scope="col">` semantics,
+ * sticky `th`/`td` that actually work under horizontal scroll) that a `display: flex`
+ * div grid faked with ARIA and broke on. `rootProps` (just `role: "table"`, which a
+ * real `<table>` already implies) comes off context rather than being computed here --
+ * `useDataTable()` runs once, in `DataTableRoot` above, not per render of this sibling.
+ */ const DataTableTable = /*#__PURE__*/ forwardRef((props, ref)=>{
+    const { rootProps } = useDataTableContext();
+    const mergedProps = mergeProps(rootProps, props);
+    return /*#__PURE__*/ jsx(Primitive.table, {
+        ref: ref,
+        ...mergedProps
+    });
+});
+DataTableTable.displayName = "DataTableTable";
+/**
+ * `<thead>`, wrapping its own children in a single `<tr>` -- the styled layer still
+ * renders every header cell as a flat child of `DataTableHeader` (one header row is
+ * the only shape this table supports), so that `<tr>` is supplied HERE rather than
+ * asking every call site to add it.
+ */ const DataTableHeader = /*#__PURE__*/ forwardRef(({ children, ...otherProps }, ref)=>{
+    return /*#__PURE__*/ jsx(Primitive.thead, {
+        ref: ref,
+        ...otherProps,
+        children: /*#__PURE__*/ jsx("tr", {
+            children: children
+        })
+    });
+});
+DataTableHeader.displayName = "DataTableHeader";
+const DataTableHeaderCell = /*#__PURE__*/ forwardRef(({ columnKey, sortable, ...otherProps }, ref)=>{
+    const { getHeaderCellProps } = useDataTableContext();
+    const mergedProps = mergeProps(getHeaderCellProps(columnKey, sortable), otherProps);
+    return /*#__PURE__*/ jsx(Primitive.th, {
+        scope: "col",
+        ref: ref,
+        ...mergedProps
+    });
+});
+DataTableHeaderCell.displayName = "DataTableHeaderCell";
+const DataTableBody = /*#__PURE__*/ forwardRef((props, ref)=>{
+    return /*#__PURE__*/ jsx(Primitive.tbody, {
+        ref: ref,
+        ...props
+    });
+});
+DataTableBody.displayName = "DataTableBody";
+const DataTableRow = /*#__PURE__*/ forwardRef(({ rowId, ...otherProps }, ref)=>{
+    const row = useDataTableRow({
+        rowId
+    });
+    const mergedProps = mergeProps(row.rootProps, otherProps);
+    return /*#__PURE__*/ jsx(DataTableRowProvider, {
+        value: row,
+        children: /*#__PURE__*/ jsx(Primitive.tr, {
+            ref: ref,
+            ...mergedProps
+        })
+    });
+});
+DataTableRow.displayName = "DataTableRow";
+const DataTableCell = /*#__PURE__*/ forwardRef((props, ref)=>{
+    return /*#__PURE__*/ jsx(Primitive.td, {
+        ref: ref,
+        ...props
+    });
+});
+DataTableCell.displayName = "DataTableCell";
+
+export { DataTableTable as D, DataTableHeader as a, DataTableHeaderCell as b, DataTableRow as c, DataTableCell as d, DataTableRoot as e, DataTableBody as f, useDataTableRowContext as g, useDataTableContext as u };

package/dist/Menu-12s-Db_zr1AP.cjs

@@ -0,0 +1,104 @@
+'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');
+var reactMenu = require('@seed-design/react-menu');
+var menu = require('@seed-design/css/recipes/menu');
+var menuItem = require('@seed-design/css/recipes/menu-item');
+var reactPrimitive = require('@seed-design/react-primitive');
+var DataTable12s = require('./DataTable-12s-8LMBtS2u.cjs');
+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);
+
+const { ClassNamesProvider, withContext, useClassNames } = DataTable12s.createSlotRecipeContext(menu.menu);
+const { PropsProvider: ItemPropsProvider, useProps: useItemProps, withContext: withItemContext, ClassNamesProvider: ItemClassNamesProvider } = DataTable12s.createSlotRecipeContext(menuItem.menuItem);
+const withStateProps = DataTable12s.createWithStateProps([
+    reactMenu.useMenuContext
+]);
+const withItemStateProps = DataTable12s.createWithStateProps([
+    reactMenu.useMenuItemContext
+]);
+const MenuRoot = (props)=>{
+    const [variantProps, otherProps] = menu.menu.splitVariantProps(props);
+    const classNames = menu.menu(variantProps);
+    return /*#__PURE__*/ jsxRuntime.jsx(ClassNamesProvider, {
+        value: classNames,
+        children: /*#__PURE__*/ jsxRuntime.jsx(ItemPropsProvider, {
+            value: {
+                size: variantProps.size
+            },
+            children: /*#__PURE__*/ jsxRuntime.jsx(reactMenu.Menu.Root, {
+                ...otherProps
+            })
+        })
+    });
+};
+reactMenu.Menu.Anchor;
+const MenuTrigger = reactMenu.Menu.Trigger;
+const MenuPositioner = /*#__PURE__*/ React__namespace.forwardRef(({ className, ...props }, ref)=>{
+    const classNames = useClassNames();
+    return /*#__PURE__*/ jsxRuntime.jsx(reactMenu.Menu.Positioner, {
+        ref: ref,
+        className: DataTable12s.clsx(classNames.positioner, className),
+        ...props
+    });
+});
+MenuPositioner.displayName = "MenuPositioner";
+const MenuContent = withContext(reactMenu.Menu.Content, "content");
+const MenuScrollArea = withContext(withStateProps(reactPrimitive.Primitive.div), "scrollArea");
+withContext(reactMenu.Menu.Group, "group");
+withContext(reactMenu.Menu.GroupLabel, "groupLabel");
+const MenuItem = /*#__PURE__*/ React__namespace.forwardRef(({ className: propClassName, ...props }, ref)=>{
+    const [variantProps, otherProps] = menuItem.menuItem.splitVariantProps(props);
+    const parentProps = useItemProps();
+    const classNames = menuItem.menuItem({
+        ...parentProps,
+        ...variantProps
+    });
+    return /*#__PURE__*/ jsxRuntime.jsx(ItemClassNamesProvider, {
+        value: classNames,
+        children: /*#__PURE__*/ jsxRuntime.jsx(reactMenu.Menu.Item, {
+            ref: ref,
+            className: DataTable12s.clsx(classNames.root, propClassName),
+            ...otherProps
+        })
+    });
+});
+MenuItem.displayName = "MenuItem";
+withItemContext(withItemStateProps(reactPrimitive.Primitive.div), "body");
+const MenuItemLabel = withItemContext(withItemStateProps(reactPrimitive.Primitive.span), "label");
+withItemContext(withItemStateProps(reactPrimitive.Primitive.span), "description");
+
+exports.MenuContent = MenuContent;
+exports.MenuItem = MenuItem;
+exports.MenuItemLabel = MenuItemLabel;
+exports.MenuPositioner = MenuPositioner;
+exports.MenuRoot = MenuRoot;
+exports.MenuScrollArea = MenuScrollArea;
+exports.MenuTrigger = MenuTrigger;

package/dist/Menu-12s-Di5JADW4.js

@@ -0,0 +1,78 @@
+'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 { jsx } from 'react/jsx-runtime';
+import { Menu, useMenuContext, useMenuItemContext } from '@seed-design/react-menu';
+import { menu } from '@seed-design/css/recipes/menu';
+import { menuItem } from '@seed-design/css/recipes/menu-item';
+import { Primitive } from '@seed-design/react-primitive';
+import { c as createSlotRecipeContext, a as createWithStateProps, b as clsx } from './DataTable-12s-Bd20OuMs.js';
+import * as React from 'react';
+
+const { ClassNamesProvider, withContext, useClassNames } = createSlotRecipeContext(menu);
+const { PropsProvider: ItemPropsProvider, useProps: useItemProps, withContext: withItemContext, ClassNamesProvider: ItemClassNamesProvider } = createSlotRecipeContext(menuItem);
+const withStateProps = createWithStateProps([
+    useMenuContext
+]);
+const withItemStateProps = createWithStateProps([
+    useMenuItemContext
+]);
+const MenuRoot = (props)=>{
+    const [variantProps, otherProps] = menu.splitVariantProps(props);
+    const classNames = menu(variantProps);
+    return /*#__PURE__*/ jsx(ClassNamesProvider, {
+        value: classNames,
+        children: /*#__PURE__*/ jsx(ItemPropsProvider, {
+            value: {
+                size: variantProps.size
+            },
+            children: /*#__PURE__*/ jsx(Menu.Root, {
+                ...otherProps
+            })
+        })
+    });
+};
+Menu.Anchor;
+const MenuTrigger = Menu.Trigger;
+const MenuPositioner = /*#__PURE__*/ React.forwardRef(({ className, ...props }, ref)=>{
+    const classNames = useClassNames();
+    return /*#__PURE__*/ jsx(Menu.Positioner, {
+        ref: ref,
+        className: clsx(classNames.positioner, className),
+        ...props
+    });
+});
+MenuPositioner.displayName = "MenuPositioner";
+const MenuContent = withContext(Menu.Content, "content");
+const MenuScrollArea = withContext(withStateProps(Primitive.div), "scrollArea");
+withContext(Menu.Group, "group");
+withContext(Menu.GroupLabel, "groupLabel");
+const MenuItem = /*#__PURE__*/ React.forwardRef(({ className: propClassName, ...props }, ref)=>{
+    const [variantProps, otherProps] = menuItem.splitVariantProps(props);
+    const parentProps = useItemProps();
+    const classNames = menuItem({
+        ...parentProps,
+        ...variantProps
+    });
+    return /*#__PURE__*/ jsx(ItemClassNamesProvider, {
+        value: classNames,
+        children: /*#__PURE__*/ jsx(Menu.Item, {
+            ref: ref,
+            className: clsx(classNames.root, propClassName),
+            ...otherProps
+        })
+    });
+});
+MenuItem.displayName = "MenuItem";
+withItemContext(withItemStateProps(Primitive.div), "body");
+const MenuItemLabel = withItemContext(withItemStateProps(Primitive.span), "label");
+withItemContext(withItemStateProps(Primitive.span), "description");
+
+export { MenuRoot as M, MenuTrigger as a, MenuPositioner as b, MenuContent as c, MenuScrollArea as d, MenuItem as e, MenuItemLabel as f };