@multiplatform.one/table 7.10.0 → 7.11.0

package/dist/esm/components/DataTable/DataTableCardControls.native.js

@@ -12,34 +12,112 @@ import { dataTableChrome } from "./dataTableChrome.native.js";
 function getColumnLabel(column) {
   return typeof column.columnDef.header === "string" ? column.columnDef.header : column.id;
 }
-function DataTableCardControls(param) {
+function DataTableCardSortControl(param) {
   var {
     table,
-    enableSorting = false,
-    enableFiltering = false,
-    availableColumns = [],
     compact = false,
-    disabled = false
+    disabled = false,
+    contained = false
   } = param;
   var _table_getState_sorting;
   var {
     t
   } = useTranslation();
   var {
-    knobProps,
-    disabledState
+    knobProps
   } = useResolvedKnobs({
     component: "DataTable",
     compact
   });
   var chrome = dataTableChrome(String(knobProps.sizeToken));
   var [sortMenuOpen, setSortMenuOpen] = useState(false);
-  var sortableColumns = enableSorting ? table.getVisibleLeafColumns().filter(function (col) {
+  var sortableColumns = table.getVisibleLeafColumns().filter(function (col) {
     return col.getCanSort();
-  }) : [];
+  });
   var activeSort = (_table_getState_sorting = table.getState().sorting) === null || _table_getState_sorting === void 0 ? void 0 : _table_getState_sorting[0];
   var activeSortColumn = activeSort ? table.getColumn(activeSort.id) : void 0;
   var sortLabel = activeSortColumn ? `${getColumnLabel(activeSortColumn)} ${activeSort.desc ? "\u2193" : "\u2191"}` : t("Sort");
+  if (!sortableColumns.length) return null;
+  var menu = /* @__PURE__ */_jsxs(DropdownMenu, {
+    open: disabled ? false : sortMenuOpen,
+    onOpenChange: function onOpenChange(open) {
+      if (disabled) return;
+      setSortMenuOpen(open);
+    },
+    children: [/* @__PURE__ */_jsx(DropdownMenu.Trigger, {
+      asChild: true,
+      children: /* @__PURE__ */_jsx(Button, {
+        size: knobProps.sizeToken,
+        icon: /* @__PURE__ */_jsx(CaretUpDownIcon, {
+          size: chrome.iconPx
+        }),
+        "aria-label": t("Sort rows"),
+        ...(contained ? {
+          minWidth: 0,
+          maxWidth: "100%",
+          "aria-description": activeSortColumn ? sortLabel : void 0
+        } : {}),
+        disabled,
+        children: sortLabel
+      })
+    }), /* @__PURE__ */_jsxs(DropdownMenu.Content, {
+      children: [/* @__PURE__ */_jsx(DropdownMenu.Label, {
+        children: t("Sort by")
+      }), sortableColumns.map(function (column) {
+        var sorted = column.getIsSorted();
+        return /* @__PURE__ */_jsx(DropdownMenu.Item, {
+          closeOnSelect: false,
+          icon: sorted === "asc" ? /* @__PURE__ */_jsx(CaretDownIcon, {
+            size: chrome.iconPx
+          }) : sorted === "desc" ? /* @__PURE__ */_jsx(CaretDownIcon, {
+            size: chrome.iconPx,
+            style: {
+              transform: "rotate(180deg)"
+            }
+          }) : /* @__PURE__ */_jsx(CaretUpDownIcon, {
+            size: chrome.iconPx
+          }),
+          "aria-label": withInterp(t("Sort by {{column}}", {
+            column: getColumnLabel(column)
+          }), {
+            column: getColumnLabel(column)
+          }),
+          onSelect: function onSelect() {
+            if (sorted === false) column.toggleSorting(false);else if (sorted === "asc") column.toggleSorting(true);else column.clearSorting();
+          },
+          children: getColumnLabel(column)
+        }, column.id);
+      })]
+    })]
+  });
+  return contained ? /* @__PURE__ */_jsx(View, {
+    "data-table-card-sort": "",
+    flexBasis: "auto",
+    flexGrow: 0,
+    flexShrink: 1,
+    minWidth: 0,
+    maxWidth: "50%",
+    children: menu
+  }) : menu;
+}
+function DataTableCardControls(param) {
+  var {
+    table,
+    enableSorting = false,
+    enableFiltering = false,
+    availableColumns = [],
+    compact = false,
+    disabled = false
+  } = param;
+  var {
+    t
+  } = useTranslation();
+  var {
+    disabledState
+  } = useResolvedKnobs({
+    component: "DataTable",
+    compact
+  });
   if (!enableSorting && !enableFiltering) return null;
   return /* @__PURE__ */_jsxs(XStack, {
     alignItems: "center",
@@ -48,52 +126,10 @@ function DataTableCardControls(param) {
     paddingVertical: "$2",
     role: "toolbar",
     "aria-label": t("Card list controls"),
-    children: [enableSorting && sortableColumns.length > 0 && /* @__PURE__ */_jsxs(DropdownMenu, {
-      open: disabled ? false : sortMenuOpen,
-      onOpenChange: function onOpenChange(open) {
-        if (disabled) return;
-        setSortMenuOpen(open);
-      },
-      children: [/* @__PURE__ */_jsx(DropdownMenu.Trigger, {
-        asChild: true,
-        children: /* @__PURE__ */_jsx(Button, {
-          size: knobProps.sizeToken,
-          icon: /* @__PURE__ */_jsx(CaretUpDownIcon, {
-            size: chrome.iconPx
-          }),
-          "aria-label": t("Sort rows"),
-          disabled,
-          children: sortLabel
-        })
-      }), /* @__PURE__ */_jsxs(DropdownMenu.Content, {
-        children: [/* @__PURE__ */_jsx(DropdownMenu.Label, {
-          children: t("Sort by")
-        }), sortableColumns.map(function (column) {
-          var sorted = column.getIsSorted();
-          return /* @__PURE__ */_jsx(DropdownMenu.Item, {
-            closeOnSelect: false,
-            icon: sorted === "asc" ? /* @__PURE__ */_jsx(CaretDownIcon, {
-              size: chrome.iconPx
-            }) : sorted === "desc" ? /* @__PURE__ */_jsx(CaretDownIcon, {
-              size: chrome.iconPx,
-              style: {
-                transform: "rotate(180deg)"
-              }
-            }) : /* @__PURE__ */_jsx(CaretUpDownIcon, {
-              size: chrome.iconPx
-            }),
-            "aria-label": withInterp(t("Sort by {{column}}", {
-              column: getColumnLabel(column)
-            }), {
-              column: getColumnLabel(column)
-            }),
-            onSelect: function onSelect() {
-              if (sorted === false) column.toggleSorting(false);else if (sorted === "asc") column.toggleSorting(true);else column.clearSorting();
-            },
-            children: getColumnLabel(column)
-          }, column.id);
-        })]
-      })]
+    children: [enableSorting && /* @__PURE__ */_jsx(DataTableCardSortControl, {
+      table,
+      compact,
+      disabled
     }), enableFiltering && availableColumns.length > 0 &&
     // DataTableFilters (chrome) has no disabled API — the wrapper is the
     // LC-40 carrier and interaction gate for the disabled table.
@@ -110,5 +146,5 @@ function DataTableCardControls(param) {
     })]
   });
 }
-export { DataTableCardControls };
+export { DataTableCardControls, DataTableCardSortControl };
 //# sourceMappingURL=DataTableCardControls.native.js.map

package/dist/esm/components/DataTable/DataTableCardControls.native.js.map

@@ -1 +1 @@
-{"version":3,"names":["jsx","_jsx","jsxs","_jsxs","CaretDownIcon","CaretUpDownIcon","DropdownMenu","Button","useResolvedKnobs","useState","View","XStack","useTranslation","withInterp","DataTableFilters","dataTableChrome","getColumnLabel","column","columnDef","header","id","DataTableCardControls","param","table","enableSorting","enableFiltering","availableColumns","compact","disabled","_table_getState_sorting","t","knobProps","disabledState","component","chrome","String","sizeToken","sortMenuOpen","setSortMenuOpen","sortableColumns","getVisibleLeafColumns","filter","col","getCanSort","activeSort","getState","sorting","activeSortColumn","getColumn","sortLabel","desc","alignItems","flexWrap","gap","paddingVertical","role","children","length","open","onOpenChange","Trigger","asChild","size","icon","iconPx","Content","Label","map","sorted","getIsSorted","Item","closeOnSelect","style","transform","onSelect","toggleSorting","clearSorting","chromeKnobProps","pointerEvents"],"sources":["../../../../src/components/DataTable/DataTableCardControls.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["jsx","_jsx","jsxs","_jsxs","CaretDownIcon","CaretUpDownIcon","DropdownMenu","Button","useResolvedKnobs","useState","View","XStack","useTranslation","withInterp","DataTableFilters","dataTableChrome","getColumnLabel","column","columnDef","header","id","DataTableCardSortControl","param","table","compact","disabled","contained","_table_getState_sorting","t","knobProps","component","chrome","String","sizeToken","sortMenuOpen","setSortMenuOpen","sortableColumns","getVisibleLeafColumns","filter","col","getCanSort","activeSort","getState","sorting","activeSortColumn","getColumn","sortLabel","desc","length","menu","open","onOpenChange","children","Trigger","asChild","size","icon","iconPx","minWidth","maxWidth","Content","Label","map","sorted","getIsSorted","Item","closeOnSelect","style","transform","onSelect","toggleSorting","clearSorting","flexBasis","flexGrow","flexShrink","DataTableCardControls","enableSorting","enableFiltering","availableColumns","disabledState","alignItems","flexWrap","gap","paddingVertical","role","chromeKnobProps"],"sources":["../../../../src/components/DataTable/DataTableCardControls.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}

package/dist/esm/components/DataTable/DataTableRoot.mjs

@@ -12,7 +12,7 @@ import { useDragScroll } from "../../hooks/useDragScroll.mjs";
 import { useDataTableKeyboard } from "../../hooks/useDataTableKeyboard.mjs";
 import { DataTableColumnPinning } from "../DataTableColumnPinning/index.mjs";
 import { DataTablePagination } from "../DataTablePagination/index.mjs";
-import { DataTableToolbar } from "../DataTableToolbar/index.mjs";
+import { DataTableCardToolbar, DataTableToolbar } from "../DataTableToolbar/index.mjs";
 import { DataTableBulkActions } from "../DataTableBulkActions/index.mjs";
 import { DataTableCell } from "../DataTableCell/index.mjs";
 import { ColumnHeaderFilter } from "../ColumnHeaderFilter/index.mjs";
@@ -20,7 +20,7 @@ import { DataTableFilterChips } from "../DataTableFilterChips/index.mjs";
 import { Table } from "@multiplatform.one/table-primitives";
 import { DataTableContext } from "./DataTableContext.mjs";
 import { DataTableStateContext } from "./DataTableStateContext.mjs";
-import { DataTableCardControls } from "./DataTableCardControls.mjs";
+import { DataTableCardControls, DataTableCardSortControl } from "./DataTableCardControls.mjs";
 import { DataTableMobileCards } from "./DataTableMobileCards.mjs";
 import { DataTableDocumentList } from "./DataTableDocumentList.mjs";
 import { DataTableVirtualized } from "./DataTableVirtualized.mjs";
@@ -249,6 +249,7 @@ function DataTableRoot({
         flexBasis: "auto"
       };
     }
+    if (columnLayout === "equal" && !enableColumnResizing) return {};
     if (hasExplicitSize || enableColumnResizing || columnLayout === "scroll") {
       return {
         width: col.getSize()
@@ -332,14 +333,15 @@ function DataTableRoot({
         flexGrow: 0,
         flexShrink: 0,
         flexBasis: "auto",
-        minWidth: 80
+        minWidth: 0
       };
     }
     if (enableColumnResizing) {
       return {
         flexGrow: 0,
         flexShrink: 0,
-        flexBasis: "auto"
+        flexBasis: "auto",
+        minWidth: 0
       };
     }
     return {
@@ -807,6 +809,9 @@ function DataTableRoot({
     selectAllScope,
     filterUi
   }), [table, state, actions, computed, selectAllScope, filterUi]);
+  const hasCardSort = showCards && enableSorting && table.getVisibleLeafColumns().some(column => column.getCanSort());
+  const defaultCardToolbar = showCards && !renderToolbar;
+  const ToolbarComponent = defaultCardToolbar ? DataTableCardToolbar : DataTableToolbar;
   const renderToolbarComponent = () => {
     const activeFilterCount = table.getState().columnFilters?.length || 0;
     if (renderToolbar) {
@@ -823,10 +828,16 @@ function DataTableRoot({
         isFetching: Boolean(state.isFetching)
       });
     }
-    return /* @__PURE__ */jsx(DataTableToolbar, {
+    return /* @__PURE__ */jsx(ToolbarComponent, {
       globalFilter: state.globalFilter || "",
       onGlobalFilterChange: actions.setGlobalFilter,
       onClearFilters: actions.clearFilters,
+      customActions: defaultCardToolbar && hasCardSort ? /* @__PURE__ */jsx(DataTableCardSortControl, {
+        table,
+        compact: isCompact,
+        disabled,
+        contained: true
+      }) : void 0,
       activeFilterCount,
       onSaveView: actions.saveView,
       onLoadView: actions.loadView,
@@ -857,7 +868,7 @@ function DataTableRoot({
     });
   };
   const renderInner = (tableData, effectiveHandleAddRow, effectiveHandleDeleteRow, _effectiveHandleCellChange) => {
-    const hasToolbar = enableGlobalSearch || enableFiltering || enableViews;
+    const hasToolbar = enableGlobalSearch || enableFiltering || enableViews || defaultCardToolbar && hasCardSort;
     const scrollContainerRef = useRef(null);
     const tableBodyRef = useRef(null);
     const [bodyClipped, setBodyClipped] = useState(false);
@@ -964,7 +975,7 @@ function DataTableRoot({
               getRowPressProps
             } : {})
           }) : showCards ? /* @__PURE__ */jsxs(Fragment, {
-            children: [/* @__PURE__ */jsx(DataTableCardControls, {
+            children: [!defaultCardToolbar && /* @__PURE__ */jsx(DataTableCardControls, {
               table,
               enableSorting,
               enableFiltering,
@@ -1459,13 +1470,41 @@ function DataTableRoot({
                   }
                 })]
               }), hasFooter && /* @__PURE__ */jsx(Table.Foot, {
-                children: footerGroups.map(footerGroup => /* @__PURE__ */jsx(Table.Row, {
-                  children: footerGroup.headers.map(header => {
+                children: footerGroups.map(footerGroup => /* @__PURE__ */jsxs(Table.Row, {
+                  children: [enableRowSelection && /* @__PURE__ */jsx(Table.Cell, {
+                    cellWidth: selectionColWidth,
+                    cellHeight,
+                    cellLocation: "first"
+                  }), showRowNumbers && /* @__PURE__ */jsx(Table.Cell, {
+                    cellWidth: chrome.rowNumberCol,
+                    cellHeight,
+                    cellLocation: enableRowSelection ? "middle" : "first"
+                  }), enableRowExpansion && /* @__PURE__ */jsx(Table.Cell, {
+                    cellWidth: chrome.expandCol,
+                    cellHeight,
+                    cellLocation: enableRowSelection || showRowNumbers ? "middle" : "first"
+                  }), footerGroup.headers.map(header => {
+                    const stickyStyle = getStickyStyle(header.column.id);
                     const columnAlign = resolveColumnAlign({
                       ...header.column.columnDef,
                       id: header.column.id
                     });
                     return /* @__PURE__ */jsx(Table.Cell, {
+                      ...cellFlexProps,
+                      ...getColSizeProps(header.column),
+                      ...(isWeb && stickyStyle ? {
+                        style: {
+                          position: "sticky",
+                          ...("insetInlineStart" in stickyStyle && {
+                            insetInlineStart: stickyStyle.insetInlineStart
+                          }),
+                          ...("insetInlineEnd" in stickyStyle && {
+                            insetInlineEnd: stickyStyle.insetInlineEnd
+                          }),
+                          zIndex: 2,
+                          backgroundColor: "var(--color2)"
+                        }
+                      } : {}),
                       justifyContent: alignToFlex(columnAlign),
                       "data-align": columnAlign,
                       children: header.isPlaceholder ? null : /* @__PURE__ */jsx(View, {
@@ -1481,7 +1520,11 @@ function DataTableRoot({
                         children: flexRender(header.column.columnDef.footer, header.getContext())
                       })
                     }, header.id);
-                  })
+                  }), showDeleteRow && !readOnly && /* @__PURE__ */jsx(Table.Cell, {
+                    cellWidth: chrome.deleteCol,
+                    cellHeight,
+                    cellLocation: "last"
+                  })]
                 }, footerGroup.id))
               })]
             })