@gridkitjs/core 0.11.0 → 0.12.1

package/dist/index.js

@@ -90,7 +90,9 @@ function buildKeyShortcuts(capabilities) {
     capabilities.sortable ? "Alt+ArrowUp" : "",
     // Down rather than reusing Up: it reads as "drill into groups", and Up is
     // already sort's own mnemonic on the same header.
-    capabilities.groupable ? "Alt+ArrowDown" : ""
+    capabilities.groupable ? "Alt+ArrowDown" : "",
+    // The ContextMenu key needs no mention: it says what it does on its face.
+    capabilities.contextMenu === true ? "Shift+F10" : ""
   ].filter(Boolean).join(" ");
 }
 function accessDotted(obj, path) {
@@ -1902,6 +1904,9 @@ function createGridController(initial) {
     });
   }
   function commitPagination(next) {
+    if (samePagination(state.pagination, next)) {
+      return;
+    }
     commit("pagination", next, () => {
       options.onPaginationChange?.({
         pagination: next,
@@ -2046,6 +2051,17 @@ function createGridController(initial) {
         options.onColumnSortChange?.({ columnId, sort: next });
       });
     },
+    clearColumnSort(columnId) {
+      const next = state.columnSort.filter(
+        (entry) => entry.columnId !== columnId
+      );
+      if (next.length === state.columnSort.length) {
+        return;
+      }
+      commit("columnSort", next, () => {
+        options.onColumnSortChange?.({ columnId, sort: next });
+      });
+    },
     setGroupBy(groupBy) {
       const columnId = changedEntryColumnId(state.groupBy, groupBy);
       if (columnId !== void 0) {
@@ -2084,11 +2100,7 @@ function createGridController(initial) {
     collapseAllGroups() {
       commitGroupExpansion(collapseAllGroups(getView().displayRows), null);
     },
-    setPagination(pagination) {
-      if (!samePagination(state.pagination, pagination)) {
-        commitPagination(pagination);
-      }
-    },
+    setPagination: commitPagination,
     goToPage,
     nextPage() {
       goToPage(shownPageIndex() + 1);
@@ -2142,14 +2154,653 @@ function createGridController(initial) {
   return controller;
 }
 
+// src/commands/context.ts
+function selectedRowsOf(rows, selection) {
+  if (selection.length === 0) {
+    return [];
+  }
+  const selected = new Set(selection);
+  return rows.filter((entry) => selected.has(entry.rowId));
+}
+function createCommandContext({
+  controller,
+  target,
+  messages,
+  host
+}) {
+  const state = controller.getState();
+  const view = controller.getView();
+  let selectedRows;
+  return {
+    target,
+    state,
+    view,
+    options: controller.getOptions(),
+    messages,
+    actions: controller,
+    host,
+    row: target.area === "cell" ? view.rows.find((entry) => entry.rowId === target.rowId) ?? null : null,
+    column: "columnId" in target ? view.dataColumns.find((entry) => entry.id === target.columnId) ?? null : null,
+    selectedRows: () => selectedRows ??= selectedRowsOf(view.rows, state.rowSelection)
+  };
+}
+
+// src/commands/builtInCommands.ts
+function isOn(context, areas) {
+  return areas.includes(context.target.area);
+}
+function columnOn(context, areas) {
+  return isOn(context, areas) ? context.column : null;
+}
+function isGroupedBy(context, columnId) {
+  return context.state.groupBy.some((entry) => entry.columnId === columnId);
+}
+function sortableColumn(context) {
+  const column = columnOn(context, ["header"]);
+  return column !== null && (column.column.sortable ?? context.options.sortableColumns ?? false) ? column : null;
+}
+function groupableColumn(context) {
+  const column = columnOn(context, ["header"]);
+  return column !== null && (column.column.groupable ?? context.options.groupableColumns ?? false) && !isGroupedBy(context, column.id) ? column : null;
+}
+function groupedColumn(context) {
+  const column = columnOn(context, ["header", "group"]);
+  return column !== null && isGroupedBy(context, column.id) ? column : null;
+}
+function hideableColumn(context) {
+  const column = columnOn(context, ["header"]);
+  return column !== null && column.column.hideable !== false ? column : null;
+}
+function resizableColumn(context) {
+  const column = columnOn(context, ["header"]);
+  if (column === null) {
+    return null;
+  }
+  return context.view.columns.find(
+    (entry) => entry.id === column.id && entry.resizable
+  ) ?? null;
+}
+function resizableColumnIds(context) {
+  return context.view.columns.filter((entry) => entry.resizable).map((entry) => entry.id);
+}
+function isAnythingSelectable(selectable) {
+  return [selectable?.rows, selectable?.columns, selectable?.cells].some(
+    (mode) => mode !== void 0 && mode !== false
+  );
+}
+function columnName(context) {
+  return context.column === null ? "" : resolveColumnHeaderText(context.column.column);
+}
+function columnCommand({
+  id,
+  label,
+  icon,
+  find,
+  isEnabled,
+  isChecked,
+  execute
+}) {
+  function test(predicate) {
+    return (context) => {
+      const column = find(context);
+      return column !== null && predicate(column, context);
+    };
+  }
+  return {
+    id,
+    label,
+    icon,
+    isVisible: (context) => find(context) !== null,
+    isEnabled: isEnabled === void 0 ? void 0 : test(isEnabled),
+    isChecked: isChecked === void 0 ? void 0 : test(isChecked),
+    execute: (context) => {
+      const column = find(context);
+      if (column !== null) {
+        execute(column, context);
+      }
+    }
+  };
+}
+function sortCommand(direction) {
+  return columnCommand({
+    id: direction === "asc" ? "sort.ascending" : "sort.descending",
+    label: ({ messages }) => direction === "asc" ? messages.sortAscending : messages.sortDescending,
+    icon: direction === "asc" ? "sortAscending" : "sortDescending",
+    find: sortableColumn,
+    isChecked: (column, { state }) => sortDirectionFor(state.columnSort, column.id) === direction,
+    execute: (column, { actions }) => {
+      actions.setColumnSort([{ columnId: column.id, direction }]);
+    }
+  });
+}
+function builtInCommands() {
+  return [
+    sortCommand("asc"),
+    sortCommand("desc"),
+    // Cleared rather than set, so the change reports this column — the one
+    // the announcement names — rather than a key that moved up past it.
+    columnCommand({
+      id: "sort.clear",
+      label: ({ messages }) => messages.clearSort,
+      find: sortableColumn,
+      isEnabled: (column, { state }) => sortDirectionFor(state.columnSort, column.id) !== null,
+      execute: (column, { actions }) => {
+        actions.clearColumnSort(column.id);
+      }
+    }),
+    {
+      id: "sort.clearAll",
+      label: ({ messages }) => messages.clearAllSorting,
+      isVisible: (context) => isOn(context, ["grid", "toolbar", "header"]),
+      isEnabled: ({ state }) => state.columnSort.length > 0,
+      execute: ({ actions }) => {
+        actions.setColumnSort([]);
+      }
+    },
+    columnCommand({
+      id: "group.add",
+      label: (context) => context.messages.groupByColumn(columnName(context)),
+      icon: "group",
+      find: groupableColumn,
+      execute: (column, { actions }) => {
+        actions.toggleGroupBy(column.id);
+      }
+    }),
+    // Toggled rather than set, so the change reports this column — the one
+    // the announcement names — rather than the level that moved up.
+    columnCommand({
+      id: "group.remove",
+      label: (context) => context.messages.removeGroupBy(columnName(context)),
+      icon: "group",
+      find: groupedColumn,
+      execute: (column, { actions }) => {
+        actions.toggleGroupBy(column.id);
+      }
+    }),
+    {
+      id: "group.clearAll",
+      label: ({ messages }) => messages.ungroupAll,
+      isVisible: (context) => isOn(context, ["grid", "toolbar"]) && context.state.groupBy.length > 0,
+      execute: ({ actions }) => {
+        actions.setGroupBy([]);
+      }
+    },
+    {
+      id: "group.expandAll",
+      label: ({ messages }) => messages.expandAllGroups,
+      isVisible: (context) => isOn(context, ["grid", "toolbar", "group", "cell"]) && context.state.groupBy.length > 0,
+      execute: ({ actions }) => {
+        actions.expandAllGroups();
+      }
+    },
+    {
+      id: "group.collapseAll",
+      label: ({ messages }) => messages.collapseAllGroups,
+      isVisible: (context) => isOn(context, ["grid", "toolbar", "group", "cell"]) && context.state.groupBy.length > 0,
+      execute: ({ actions }) => {
+        actions.collapseAllGroups();
+      }
+    },
+    columnCommand({
+      id: "column.hide",
+      label: ({ messages }) => messages.hideColumn,
+      icon: "hide",
+      find: hideableColumn,
+      // The last column shown stays: a grid with none has no header left to
+      // bring one back from.
+      isEnabled: (column, { view }) => view.columns.some((entry) => entry.id !== column.id),
+      execute: (column, { actions }) => {
+        actions.hideColumns([column.id]);
+      }
+    }),
+    columnCommand({
+      id: "column.autoFit",
+      label: ({ messages }) => messages.autoFitColumn,
+      icon: "autoFit",
+      find: resizableColumn,
+      execute: (column, { host }) => {
+        host.autoFitColumns([column.id]);
+      }
+    }),
+    {
+      id: "column.autoFitAll",
+      label: ({ messages }) => messages.autoFitAllColumns,
+      icon: "autoFit",
+      isVisible: (context) => isOn(context, ["grid", "toolbar", "header"]) && resizableColumnIds(context).length > 0,
+      execute: (context) => {
+        context.host.autoFitColumns(resizableColumnIds(context));
+      }
+    },
+    // The target goes along, so the renderer opens the chooser where it was
+    // asked for: beside the toolbar button, below the header, or at the
+    // grid's corner for a call from nowhere in particular.
+    {
+      id: "column.choose",
+      label: ({ messages }) => messages.chooseColumns,
+      isVisible: (context) => isOn(context, ["grid", "toolbar", "header"]),
+      execute: ({ host, target }) => {
+        host.openPanel("columnChooser", target);
+      }
+    },
+    {
+      id: "selection.selectAllRows",
+      label: ({ messages }) => messages.selectAllRows,
+      isVisible: (context) => isOn(context, ["grid", "cell"]) && context.options.selectable?.rows === "multiple",
+      isEnabled: ({ view }) => view.displayDataRows.length > 0,
+      execute: ({ actions }) => {
+        actions.selectAllRows();
+      }
+    },
+    {
+      id: "selection.clear",
+      label: ({ messages }) => messages.clearSelection,
+      isVisible: (context) => isOn(context, ["grid", "cell", "header"]) && isAnythingSelectable(context.options.selectable),
+      isEnabled: ({ state }) => state.rowSelection.length > 0 || state.columnSelection.length > 0 || state.cellSelection !== null,
+      execute: ({ actions }) => {
+        actions.clearSelection();
+      }
+    },
+    {
+      id: "filter.clearAll",
+      label: ({ messages }) => messages.clearFilters,
+      isVisible: (context) => isOn(context, ["grid", "toolbar", "header"]),
+      isEnabled: ({ state }) => state.filter.length > 0,
+      execute: ({ actions }) => {
+        actions.setFilter([]);
+      }
+    }
+  ];
+}
+
+// src/commands/registry.ts
+function isCommandVisible(command, context) {
+  return command.isVisible?.(context) ?? true;
+}
+function isCommandEnabled(command, context) {
+  return command.isEnabled?.(context) ?? true;
+}
+function resolveCommands(commands) {
+  const registry = new Map(
+    builtInCommands().map((command) => [command.id, command])
+  );
+  for (const command of commands ?? []) {
+    if (command.id === "separator") {
+      reportError(
+        "a command cannot have the id `separator`, which a menu reads as a separator, so it is left out."
+      );
+      continue;
+    }
+    registry.set(command.id, command);
+  }
+  return registry;
+}
+function runCommand(command, context) {
+  if (!isCommandVisible(command, context) || !isCommandEnabled(command, context)) {
+    return false;
+  }
+  command.execute(context);
+  return true;
+}
+
+// src/menu/resolveMenu.ts
+var reportedUnknownIds = /* @__PURE__ */ new WeakMap();
+function reportUnknownId(commands, id) {
+  let reported = reportedUnknownIds.get(commands);
+  if (reported === void 0) {
+    reported = /* @__PURE__ */ new Set();
+    reportedUnknownIds.set(commands, reported);
+  }
+  if (reported.has(id)) {
+    return;
+  }
+  reported.add(id);
+  reportError(
+    `the menu or toolbar entry \`${id}\` names no command, so it is left out.`
+  );
+}
+function evaluate(value, context) {
+  return typeof value === "function" ? value(context) : value;
+}
+function commandItem(command, context) {
+  if (!isCommandVisible(command, context)) {
+    return null;
+  }
+  return {
+    type: "item",
+    id: command.id,
+    label: evaluate(command.label, context),
+    icon: command.icon,
+    shortcut: command.shortcut,
+    disabled: !isCommandEnabled(command, context),
+    checked: command.isChecked?.(context),
+    run: () => runCommand(command, context)
+  };
+}
+function inlineItem(entry, context) {
+  if (evaluate(entry.hidden ?? false, context)) {
+    return null;
+  }
+  const disabled = evaluate(entry.disabled ?? false, context);
+  return {
+    type: "item",
+    id: entry.id,
+    label: evaluate(entry.label, context),
+    icon: entry.icon,
+    shortcut: entry.shortcut,
+    disabled,
+    checked: entry.checked === void 0 ? void 0 : evaluate(entry.checked, context),
+    run: () => {
+      if (disabled) {
+        return false;
+      }
+      entry.onSelect(context);
+      return true;
+    }
+  };
+}
+function collapseSeparators(entries, isEdge = () => false) {
+  const collapsed = [];
+  for (const entry of entries) {
+    const previous = collapsed.at(-1);
+    if (entry.type !== "separator") {
+      if (isEdge(entry) && previous?.type === "separator") {
+        collapsed.pop();
+      }
+      collapsed.push(entry);
+    } else if (previous !== void 0 && previous.type !== "separator" && !isEdge(previous)) {
+      collapsed.push(entry);
+    }
+  }
+  if (collapsed.at(-1)?.type === "separator") {
+    collapsed.pop();
+  }
+  return collapsed;
+}
+function resolveMenuEntry(entry, index, options) {
+  const { commands, context } = options;
+  if (entry === "separator") {
+    return { type: "separator", key: `separator-${String(index)}` };
+  }
+  if (typeof entry === "string") {
+    const command = commands.get(entry);
+    if (command === void 0) {
+      reportUnknownId(commands, entry);
+      return null;
+    }
+    return commandItem(command, context);
+  }
+  return entry.type === "item" ? inlineItem(entry, context) : resolveSubmenu(entry, options);
+}
+function resolveSubmenu(entry, options) {
+  const items = resolveMenu(entry.items, options);
+  return items.length === 0 ? null : {
+    type: "submenu",
+    id: entry.id,
+    label: evaluate(entry.label, options.context),
+    icon: entry.icon,
+    items
+  };
+}
+function resolveMenu(entries, options) {
+  return collapseSeparators(
+    entries.map((entry, index) => resolveMenuEntry(entry, index, options)).filter((entry) => entry !== null)
+  );
+}
+
+// src/menu/contextMenu.ts
+var defaultContextMenu = {
+  header: [
+    "sort.ascending",
+    "sort.descending",
+    "sort.clear",
+    "separator",
+    "group.add",
+    "group.remove",
+    "separator",
+    "column.autoFit",
+    "column.autoFitAll",
+    "separator",
+    "column.hide",
+    "column.choose"
+  ],
+  cell: [
+    "selection.selectAllRows",
+    "selection.clear",
+    "separator",
+    "group.expandAll",
+    "group.collapseAll"
+  ],
+  group: ["group.expandAll", "group.collapseAll", "separator", "group.remove"],
+  body: []
+};
+function hasContextMenu(contextMenu, area) {
+  if (contextMenu === void 0 || contextMenu === false) {
+    return false;
+  }
+  const entries = (contextMenu === true ? void 0 : contextMenu[area]) ?? defaultContextMenu[area];
+  return typeof entries === "function" || entries.length > 0;
+}
+function entriesFor(given, request) {
+  if (given === void 0) {
+    return request.defaults;
+  }
+  return typeof given === "function" ? given(request) ?? [] : given;
+}
+function contextMenuEntries(contextMenu, context) {
+  if (contextMenu === void 0 || contextMenu === false) {
+    return [];
+  }
+  const options = contextMenu === true ? {} : contextMenu;
+  const { target } = context;
+  switch (target.area) {
+    case "header":
+      return entriesFor(options.header, {
+        target,
+        defaults: defaultContextMenu.header,
+        context
+      });
+    case "cell":
+      return entriesFor(options.cell, {
+        target,
+        defaults: defaultContextMenu.cell,
+        context
+      });
+    case "group":
+      return entriesFor(options.group, {
+        target,
+        defaults: defaultContextMenu.group,
+        context
+      });
+    case "body":
+      return entriesFor(options.body, {
+        target,
+        defaults: defaultContextMenu.body,
+        context
+      });
+    default:
+      return [];
+  }
+}
+
+// src/menu/navigation.ts
+function startIndex(count, from, move) {
+  const focused = from >= 0 && from < count;
+  switch (move) {
+    case "first":
+      return 0;
+    case "last":
+      return count - 1;
+    case "next":
+      return focused ? from + 1 : 0;
+    case "previous":
+      return focused ? from - 1 : count - 1;
+  }
+}
+function nextMenuIndex(entries, from, move) {
+  const count = entries.length;
+  const step = move === "next" || move === "first" ? 1 : -1;
+  const start = startIndex(count, from, move);
+  for (let offset = 0; offset < count; offset++) {
+    const index = ((start + step * offset) % count + count) % count;
+    if (entries[index]?.type !== "separator") {
+      return index;
+    }
+  }
+  return -1;
+}
+function typeaheadIndex(labels, from, query) {
+  const typed = query.toLowerCase();
+  const firstCodePoint = typed.codePointAt(0);
+  if (firstCodePoint === void 0) {
+    return -1;
+  }
+  const first = String.fromCodePoint(firstCodePoint);
+  const repeated = typed.replaceAll(first, "") === "";
+  const prefix = repeated ? first : typed;
+  const start = repeated ? from + 1 : Math.max(from, 0);
+  for (let offset = 0; offset < labels.length; offset++) {
+    const index = (start + offset) % labels.length;
+    if (labels[index]?.toLowerCase().startsWith(prefix) === true) {
+      return index;
+    }
+  }
+  return -1;
+}
+
+// src/toolbar/options.ts
+var defaultToolbar = ["search", "spacer", "filter.clearAll", "column.choose"];
+function toolbarEntries(toolbar) {
+  if (toolbar === void 0 || toolbar === false) {
+    return [];
+  }
+  return (toolbar === true ? void 0 : toolbar.items) ?? defaultToolbar;
+}
+
+// src/toolbar/resolveToolbar.ts
+function isSpacer(entry) {
+  return entry.type === "spacer";
+}
+function resolveToolbar(entries, options) {
+  const { commands, contextFor } = options;
+  function resolveEntry(entry, index) {
+    if (entry === "search") {
+      return { type: "search", key: "search" };
+    }
+    if (entry === "spacer") {
+      return { type: "spacer", key: `spacer-${String(index)}` };
+    }
+    if (typeof entry === "object" && entry.type === "custom") {
+      return { type: "custom", id: entry.id, key: entry.id };
+    }
+    if (entry === "separator") {
+      return { type: "separator", key: `separator-${String(index)}` };
+    }
+    const resolved = resolveMenuEntry(entry, index, {
+      commands,
+      context: contextFor({
+        area: "toolbar",
+        itemId: typeof entry === "string" ? entry : entry.id
+      })
+    });
+    if (resolved === null || resolved.type === "separator") {
+      return resolved;
+    }
+    if (resolved.type === "submenu") {
+      return { ...resolved, type: "menu", key: resolved.id };
+    }
+    const { checked, ...item } = resolved;
+    return { ...item, type: "button", key: item.id, pressed: checked };
+  }
+  return collapseSeparators(
+    entries.map(resolveEntry).filter((entry) => entry !== null),
+    isSpacer
+  );
+}
+
+// src/toolbar/overflow.ts
+function fitToolbarItems({
+  widths,
+  available,
+  moreWidth,
+  pinned
+}) {
+  const total = widths.reduce((sum, width) => sum + width, 0);
+  if (total <= available) {
+    return widths.length;
+  }
+  let used = moreWidth + widths.reduce((sum, width, index) => sum + (pinned[index] ? width : 0), 0);
+  for (const [index, width] of widths.entries()) {
+    if (!pinned[index]) {
+      used += width;
+      if (used > available) {
+        return index;
+      }
+    }
+  }
+  return widths.length;
+}
+function isPinnedToolbarItem(item) {
+  return item.type === "search" || item.type === "custom";
+}
+function asMenuEntry(item) {
+  switch (item.type) {
+    case "button":
+      return {
+        type: "item",
+        id: item.id,
+        label: item.label,
+        icon: item.icon,
+        shortcut: item.shortcut,
+        disabled: item.disabled,
+        checked: item.pressed,
+        run: item.run
+      };
+    case "menu":
+      return {
+        type: "submenu",
+        id: item.id,
+        label: item.label,
+        icon: item.icon,
+        items: item.items
+      };
+    case "separator":
+      return item;
+    default:
+      return null;
+  }
+}
+function splitToolbarItems(items, fit) {
+  const fits = (item, index) => index < fit || isPinnedToolbarItem(item);
+  return {
+    shown: collapseSeparators(
+      items.filter(fits),
+      (item) => item.type === "spacer"
+    ),
+    overflow: collapseSeparators(
+      items.filter((item, index) => !fits(item, index)).map(asMenuEntry).filter((entry) => entry !== null)
+    )
+  };
+}
+
+// src/toolbar/search.ts
+function searchTextOf(filter) {
+  const query = filterQueryFor(filter) ?? "";
+  const start = query.startsWith("%") ? 1 : 0;
+  const end = query.endsWith("%") ? -1 : void 0;
+  return query.slice(start, end);
+}
+function setSearchText(filter, text) {
+  return setColumnFilter(filter, void 0, text === "" ? "" : `%${text}%`);
+}
+
 // src/util/navigation.ts
 var HEADER_ROW = -1;
-function clampFocus(focus, rowCount, columnCount) {
+function clampFocus(focus, rowCount, columnCount2) {
   return {
     rowIndex: Math.min(Math.max(focus.rowIndex, HEADER_ROW), rowCount - 1),
     columnIndex: Math.min(
       Math.max(focus.columnIndex, 0),
-      Math.max(columnCount - 1, 0)
+      Math.max(columnCount2 - 1, 0)
     )
   };
 }
@@ -2167,7 +2818,7 @@ function skipSkippableRows(rowIndex, direction, rowCount, isSkippableRow, fallba
   }
   return next;
 }
-function nextFocusForKey(key, modifiers, focus, rowCount, columnCount, pageSize, isSkippableRow = noRowsSkippable) {
+function nextFocusForKey(key, modifiers, focus, rowCount, columnCount2, pageSize, isSkippableRow = noRowsSkippable) {
   if (modifiers.altKey) {
     return null;
   }
@@ -2214,8 +2865,8 @@ function nextFocusForKey(key, modifiers, focus, rowCount, columnCount, pageSize,
           isSkippableRow,
           rowIndex
         ),
-        columnIndex: columnCount - 1
-      } : { rowIndex, columnIndex: columnCount - 1 };
+        columnIndex: columnCount2 - 1
+      } : { rowIndex, columnIndex: columnCount2 - 1 };
     case "PageUp":
       return {
         rowIndex: skipSkippableRows(
@@ -2278,6 +2929,139 @@ function paginationWindow(currentPage, pageCount, options) {
   return entries;
 }
 
+// src/util/columnChooser.ts
+function isHideable(column) {
+  return column.column.hideable !== false;
+}
+function matchesSearch(label, search) {
+  return label.toLowerCase().includes(search.toLowerCase());
+}
+function selectAllStateOf(states) {
+  if (states.length > 0 && states.every(Boolean)) {
+    return "checked";
+  }
+  return states.some(Boolean) ? "mixed" : "unchecked";
+}
+function resolveColumnChooser({
+  columns,
+  visibility,
+  search = ""
+}) {
+  const all = columns.map((column) => ({
+    column,
+    label: resolveColumnHeaderText(column.column),
+    visible: isColumnVisible(column.column, visibility)
+  }));
+  const shownCount = all.filter(({ visible }) => visible).length;
+  const matched = all.filter(({ label }) => matchesSearch(label, search));
+  const entries = matched.map(
+    ({ column, label, visible }) => ({
+      columnId: column.id,
+      label,
+      visible,
+      disabled: visible && (!isHideable(column) || shownCount === 1)
+    })
+  );
+  const covered = matched.filter(({ column }) => isHideable(column));
+  const selectAll2 = selectAllStateOf(covered.map(({ visible }) => visible));
+  return {
+    entries,
+    selectAll: selectAll2,
+    toggleAll: toggleAllOf(covered, selectAll2, shownCount)
+  };
+}
+function toggleAllOf(covered, selectAll2, shownCount) {
+  const show = selectAll2 !== "checked";
+  const changing = covered.filter(({ visible }) => visible !== show).map(({ column }) => column.id);
+  const columnIds = !show && changing.length === shownCount ? changing.slice(1) : changing;
+  return columnIds.length === 0 ? null : { visible: show, columnIds };
+}
+
+// src/messages.ts
+function columnCount(count, change) {
+  return count === 1 ? `1 column ${change}` : `${String(count)} columns ${change}`;
+}
+function searchResults(count) {
+  if (count === 0) {
+    return "No rows found";
+  }
+  return count === 1 ? "1 row found" : `${String(count)} rows found`;
+}
+function selectedCount(count, target) {
+  const noun = target === "rows" ? "row" : "column";
+  if (count === 0) {
+    return `No ${noun}s selected`;
+  }
+  return count === 1 ? `1 ${noun} selected` : `${String(count)} ${noun}s selected`;
+}
+var defaultMessages = {
+  pagerLabel: "Pagination",
+  previousPage: "Previous",
+  nextPage: "Next",
+  pageSizeLabel: "Rows per page",
+  pageButtonLabel: (page) => `Page ${String(page)}`,
+  pageStatus: (page, pageCount) => `Page ${String(page)} of ${String(pageCount)}`,
+  loadingMore: "Loading more\u2026",
+  booleanTrue: "true",
+  booleanFalse: "false",
+  blankGroupValue: "(blank)",
+  groupByBarLabel: "Grouped by",
+  groupByBarPlaceholder: "Drag a column here to group by it",
+  groupByChipLabel: (columnName2, level, levelCount) => levelCount > 1 ? `${columnName2}, level ${String(level)} of ${String(levelCount)}` : columnName2,
+  removeGroupBy: (columnName2) => `Stop grouping by ${columnName2}`,
+  columnResized: (columnName2, width) => `${columnName2}, ${String(width)} pixels wide`,
+  columnMoved: (columnName2, position, columnCount2) => `${columnName2}, column ${String(position)} of ${String(columnCount2)}`,
+  columnSorted: (columnName2, direction, key, keyCount) => {
+    const sorted = `${columnName2} sorted ${direction === "asc" ? "ascending" : "descending"}`;
+    return keyCount > 1 ? `${sorted}, key ${String(key)} of ${String(keyCount)}` : sorted;
+  },
+  sortCleared: (columnName2) => `${columnName2}, sort cleared`,
+  groupedBy: (columnName2, level, levelCount) => levelCount > 1 ? `Grouped by ${columnName2}, level ${String(level)} of ${String(levelCount)}` : `Grouped by ${columnName2}`,
+  groupingRemoved: (columnName2) => `${columnName2}, grouping removed`,
+  groupExpanded: "Group expanded",
+  groupCollapsed: "Group collapsed",
+  allGroupsExpanded: "All groups expanded",
+  allGroupsCollapsed: "All groups collapsed",
+  selectedCount,
+  cellSelected: (columnName2, rowNumber) => `${columnName2}, row ${String(rowNumber)}, selected`,
+  columnHidden: (columnName2) => `${columnName2}, column hidden`,
+  columnShown: (columnName2) => `${columnName2}, column shown`,
+  columnsHidden: (count) => columnCount(count, "hidden"),
+  columnsShown: (count) => columnCount(count, "shown"),
+  columnsAutoFitted: (count) => columnCount(count, "autofitted"),
+  headerMenuLabel: (columnName2) => `${columnName2} column menu`,
+  cellMenuLabel: "Row menu",
+  groupMenuLabel: "Group menu",
+  bodyMenuLabel: "Grid menu",
+  sortAscending: "Sort ascending",
+  sortDescending: "Sort descending",
+  clearSort: "Clear sort",
+  clearAllSorting: "Clear all sorting",
+  groupByColumn: (columnName2) => `Group by ${columnName2}`,
+  ungroupAll: "Ungroup all",
+  expandAllGroups: "Expand all groups",
+  collapseAllGroups: "Collapse all groups",
+  hideColumn: "Hide column",
+  autoFitColumn: "Autofit column",
+  autoFitAllColumns: "Autofit all columns",
+  selectAllRows: "Select all rows",
+  clearSelection: "Clear selection",
+  clearFilters: "Clear filters",
+  chooseColumns: "Choose columns",
+  toolbarLabel: "Grid toolbar",
+  searchLabel: "Search",
+  searchPlaceholder: "Search\u2026",
+  moreToolbarItems: "More",
+  searchResults,
+  columnChooserLabel: "Columns",
+  columnChooserSearchLabel: "Search columns",
+  showAllColumns: "Show all",
+  noMatchingColumns: "No matching columns"
+};
+function resolveMessages(messages) {
+  return messages === void 0 ? defaultMessages : { ...defaultMessages, ...messages };
+}
+
 // src/util/format.ts
 var DATE_FIELDS = {
   year: "numeric",
@@ -2464,7 +3248,7 @@ function describeColumnFilter(filter, columnId) {
 function isOfferable(value) {
   return typeof value === "string" || typeof value === "number" || typeof value === "boolean" || value instanceof Date;
 }
-function matchesSearch(label, search) {
+function matchesSearch2(label, search) {
   return label.toLowerCase().includes(search.toLowerCase());
 }
 function columnValueOptions(rows, dataColumns, filter, columnId, query = {}) {
@@ -2486,7 +3270,7 @@ function columnValueOptions(rows, dataColumns, filter, columnId, query = {}) {
     if (isEmptyCell(value)) {
       blanks++;
     } else if (isOfferable(value)) {
-      const key = bucketKey(value);
+      const key = filterValueKey(value, column.type);
       const bucket = buckets.get(key);
       if (bucket === void 0) {
         buckets.set(key, { value, row, count: 1 });
@@ -2496,22 +3280,27 @@ function columnValueOptions(rows, dataColumns, filter, columnId, query = {}) {
     }
   }
   const { search = "", limit, locale } = query;
+  const messages = resolveMessages(query.messages);
   const options = [...buckets.values()].sort((a, b) => compareValues(a.value, b.value, column.type)).map(({ value, row, count }) => ({
     value,
-    label: formatCellValue(value, column, locale, row),
+    label: formatCellValue(value, column, locale, row, messages),
     count
-  })).filter((option) => matchesSearch(option.label, search));
+  })).filter((option) => matchesSearch2(option.label, search));
   const shown = limit === void 0 ? options : options.slice(0, limit);
   return {
     options: shown,
     total: options.length,
     truncated: shown.length < options.length,
-    blanks
+    blanks,
+    columnType: column.type
   };
 }
-function everyOption(options) {
+function keyOf2(draft, value) {
+  return filterValueKey(value, draft.columnType);
+}
+function everyOption(draft) {
   return new Map(
-    options.map((option) => [bucketKey(option.value), option.value])
+    draft.options.map((option) => [keyOf2(draft, option.value), option.value])
   );
 }
 function initialFilterEditorDraft(shape, values) {
@@ -2520,17 +3309,18 @@ function initialFilterEditorDraft(shape, values) {
     options: values.options,
     blanks: values.blanks,
     search: "",
-    checked: everyOption(values.options),
+    checked: everyOption(values),
     includeBlanks: values.blanks > 0,
     conditions: [],
-    combinator: "and"
+    combinator: "and",
+    columnType: values.columnType
   };
   switch (shape.kind) {
     case "values":
       return {
         ...draft,
         checked: new Map(
-          shape.values.filter((value) => !isEmptyCell(value)).map((value) => [bucketKey(value), value])
+          shape.values.filter((value) => !isEmptyCell(value)).map((value) => [keyOf2(draft, value), value])
         ),
         includeBlanks: shape.includeBlanks
       };
@@ -2548,7 +3338,7 @@ function initialFilterEditorDraft(shape, values) {
 }
 function visibleFilterOptions(draft) {
   return draft.search === "" ? draft.options : draft.options.filter(
-    (option) => matchesSearch(option.label, draft.search)
+    (option) => matchesSearch2(option.label, draft.search)
   );
 }
 function selectAllCoversBlanks(draft) {
@@ -2556,7 +3346,7 @@ function selectAllCoversBlanks(draft) {
 }
 function selectAllState(draft) {
   const states = visibleFilterOptions(draft).map(
-    (option) => draft.checked.has(bucketKey(option.value))
+    (option) => draft.checked.has(keyOf2(draft, option.value))
   );
   if (selectAllCoversBlanks(draft)) {
     states.push(draft.includeBlanks);
@@ -2570,7 +3360,7 @@ function toggleAll(draft) {
   const check = selectAllState(draft) !== "checked";
   const checked = new Map(draft.checked);
   for (const option of visibleFilterOptions(draft)) {
-    const key = bucketKey(option.value);
+    const key = keyOf2(draft, option.value);
     if (check) {
       checked.set(key, option.value);
     } else {
@@ -2589,7 +3379,7 @@ function filterEditorReducer(draft, action) {
     case "search":
       return { ...draft, search: action.search };
     case "toggleValue": {
-      const key = bucketKey(action.value);
+      const key = keyOf2(draft, action.value);
       const checked = new Map(draft.checked);
       if (checked.has(key)) {
         checked.delete(key);
@@ -2613,7 +3403,7 @@ function filterEditorReducer(draft, action) {
       return {
         ...draft,
         search: "",
-        checked: everyOption(draft.options),
+        checked: everyOption(draft),
         includeBlanks: draft.blanks > 0,
         conditions: []
       };
@@ -2621,7 +3411,7 @@ function filterEditorReducer(draft, action) {
 }
 function checksEverything(draft) {
   return draft.options.every(
-    (option) => draft.checked.has(bucketKey(option.value))
+    (option) => draft.checked.has(keyOf2(draft, option.value))
   ) && (draft.includeBlanks || draft.blanks === 0);
 }
 function draftEntries(draft, columnId) {
@@ -2657,49 +3447,6 @@ function draftToFilter(draft, columnId, current) {
   return [...kept.slice(0, first), ...replacement, ...kept.slice(first)];
 }
 
-// src/messages.ts
-function selectedCount(count, target) {
-  const noun = target === "rows" ? "row" : "column";
-  if (count === 0) {
-    return `No ${noun}s selected`;
-  }
-  return count === 1 ? `1 ${noun} selected` : `${String(count)} ${noun}s selected`;
-}
-var defaultMessages = {
-  pagerLabel: "Pagination",
-  previousPage: "Previous",
-  nextPage: "Next",
-  pageSizeLabel: "Rows per page",
-  pageButtonLabel: (page) => `Page ${String(page)}`,
-  pageStatus: (page, pageCount) => `Page ${String(page)} of ${String(pageCount)}`,
-  loadingMore: "Loading more\u2026",
-  booleanTrue: "true",
-  booleanFalse: "false",
-  blankGroupValue: "(blank)",
-  groupByBarLabel: "Grouped by",
-  groupByBarPlaceholder: "Drag a column here to group by it",
-  groupByChipLabel: (columnName, level, levelCount) => levelCount > 1 ? `${columnName}, level ${String(level)} of ${String(levelCount)}` : columnName,
-  removeGroupBy: (columnName) => `Stop grouping by ${columnName}`,
-  columnResized: (columnName, width) => `${columnName}, ${String(width)} pixels wide`,
-  columnMoved: (columnName, position, columnCount) => `${columnName}, column ${String(position)} of ${String(columnCount)}`,
-  columnSorted: (columnName, direction, key, keyCount) => {
-    const sorted = `${columnName} sorted ${direction === "asc" ? "ascending" : "descending"}`;
-    return keyCount > 1 ? `${sorted}, key ${String(key)} of ${String(keyCount)}` : sorted;
-  },
-  sortCleared: (columnName) => `${columnName}, sort cleared`,
-  groupedBy: (columnName, level, levelCount) => levelCount > 1 ? `Grouped by ${columnName}, level ${String(level)} of ${String(levelCount)}` : `Grouped by ${columnName}`,
-  groupingRemoved: (columnName) => `${columnName}, grouping removed`,
-  groupExpanded: "Group expanded",
-  groupCollapsed: "Group collapsed",
-  allGroupsExpanded: "All groups expanded",
-  allGroupsCollapsed: "All groups collapsed",
-  selectedCount,
-  cellSelected: (columnName, rowNumber) => `${columnName}, row ${String(rowNumber)}, selected`
-};
-function resolveMessages(messages) {
-  return messages === void 0 ? defaultMessages : { ...defaultMessages, ...messages };
-}
-
 // src/util/virtualization.ts
 function visibleRange(heights, estimatedHeight, scrollTop, viewportHeight, overscan) {
   const rowCount = heights.length;
@@ -2752,6 +3499,7 @@ export {
   applySelectionIntent,
   beginColumnResize,
   buildKeyShortcuts,
+  builtInCommands,
   clampColumnWidth,
   clampFocus,
   clearAllFilters,
@@ -2760,9 +3508,13 @@ export {
   columnValueOptions,
   compareValues,
   computeAggregates,
+  contextMenuEntries,
+  createCommandContext,
   createGridController,
   createGridViewResolver,
+  defaultContextMenu,
   defaultMessages,
+  defaultToolbar,
   defineColumnsFromRows,
   describeColumnFilter,
   diffSelection,
@@ -2772,14 +3524,17 @@ export {
   filterQueryFor,
   filterRows,
   fitColumnsToWidth,
+  fitToolbarItems,
   formatAggregateValue,
   formatCellValue,
   getColumnId,
   groupRowId,
   groupRows,
+  hasContextMenu,
   initialFilterEditorDraft,
   intentOf,
   isColumnVisible,
+  isPinnedToolbarItem,
   isSameCell,
   matchesQuery,
   moveColumnBefore,
@@ -2787,23 +3542,30 @@ export {
   movesColumn,
   movesGroupBy,
   nextFocusForKey,
+  nextMenuIndex,
   paginateRows,
   paginationWindow,
   resolveCell,
+  resolveColumnChooser,
   resolveColumnConstraints,
   resolveColumnHeaderText,
   resolveColumnLabel,
   resolveColumnWidths,
   resolveColumns,
+  resolveCommands,
   resolveDataColumns,
   resolveDropBefore,
   resolveGridView,
   resolveKeyboardDropTarget,
+  resolveMenu,
   resolveMessages,
   resolveRowId,
   resolveRows,
   resolveShownRows,
+  resolveToolbar,
   revertColumnSize,
+  runCommand,
+  searchTextOf,
   selectAll,
   selectAllState,
   selectCell,
@@ -2812,15 +3574,19 @@ export {
   serializeGridState,
   setColumnFilter,
   setColumnVisibility,
+  setSearchText,
   sizeColumnToContent,
   sortDirectionFor,
   sortPriorityFor,
   sortRows,
+  splitToolbarItems,
   toggleCellSelection,
   toggleColumnSort,
   toggleGroupExpansion,
   toggleSelection,
+  toolbarEntries,
   totalColumnWidth,
+  typeaheadIndex,
   visibleFilterOptions,
   visibleRange,
   withGroupAggregates