@vuu-ui/vuu-table 0.8.32-debug → 0.8.32

package/esm/index.js

@@ -1,3896 +1,2 @@
-// src/header-cell/GroupHeaderCell.tsx
-import { OverflowContainer } from "@vuu-ui/vuu-ui-controls";
-import { useLayoutEffectSkipFirst } from "@vuu-ui/vuu-utils";
-import cx3 from "clsx";
-import { useCallback as useCallback4, useRef as useRef3, useState as useState2 } from "react";
-
-// src/column-header-pill/ColumnHeaderPill.tsx
-import cx from "clsx";
-import { useCallback } from "react";
-import { jsx, jsxs } from "react/jsx-runtime";
-var classBase = "vuuColumnHeaderPill";
-var ColumnHeaderPill = ({
-  children,
-  className,
-  column,
-  onRemove,
-  removable,
-  ...htmlAttributes
-}) => {
-  if (removable && typeof onRemove !== "function") {
-    throw Error(
-      "ColumnHeaderPill onRemove prop must be provided if Pill is removable"
-    );
-  }
-  const handleClickRemove = useCallback(
-    (evt) => {
-      evt.preventDefault();
-      evt.stopPropagation();
-      onRemove == null ? void 0 : onRemove(column);
-    },
-    [column, onRemove]
-  );
-  return /* @__PURE__ */ jsxs("div", { ...htmlAttributes, className: cx(classBase, className), children: [
-    children,
-    removable ? /* @__PURE__ */ jsx(
-      "span",
-      {
-        className: `${classBase}-removeButton`,
-        role: "button",
-        "data-icon": "cross",
-        onClick: handleClickRemove
-      }
-    ) : null
-  ] });
-};
-
-// src/column-header-pill/GroupColumnPill.tsx
-import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
-var GroupColumnPill = ({
-  column,
-  ...columnHeaderProps
-}) => {
-  const { name, sorted } = column;
-  const icon = typeof sorted === "number" ? sorted < 0 ? "arrow-down" : "arrow-up" : sorted === "A" ? "arrow-up" : sorted === "D" ? "arrow-down" : void 0;
-  return /* @__PURE__ */ jsxs2(ColumnHeaderPill, { ...columnHeaderProps, column, children: [
-    /* @__PURE__ */ jsx2("span", { className: "vuuGroupColumnPill-label", children: name }),
-    icon !== void 0 ? /* @__PURE__ */ jsx2("span", { "data-icon": icon }) : null,
-    typeof sorted === "number" ? /* @__PURE__ */ jsx2("span", { className: "vuuSortPosition", children: Math.abs(sorted) }) : null
-  ] });
-};
-
-// src/column-header-pill/SortIndicator.tsx
-import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
-var SortIndicator = ({ column }) => {
-  if (!column.sorted) {
-    return null;
-  }
-  const icon = typeof column.sorted === "number" ? column.sorted < 0 ? "arrow-down" : "arrow-up" : column.sorted === "A" ? "arrow-up" : "arrow-down";
-  return /* @__PURE__ */ jsxs3(ColumnHeaderPill, { column, children: [
-    /* @__PURE__ */ jsx3("span", { "data-icon": icon }),
-    typeof column.sorted === "number" ? /* @__PURE__ */ jsx3("span", { className: "vuuSortPosition", children: Math.abs(column.sorted) }) : null
-  ] });
-};
-
-// src/column-resizing/ColumnResizer.tsx
-import { useCallback as useCallback2, useRef } from "react";
-import { jsx as jsx4 } from "react/jsx-runtime";
-var NOOP = () => void 0;
-var baseClass = "vuuColumnResizer";
-var ColumnResizer = ({
-  onDrag,
-  onDragEnd = NOOP,
-  onDragStart = NOOP
-}) => {
-  const positionRef = useRef({ start: 0, now: 0 });
-  const onMouseMove = useCallback2(
-    (e) => {
-      if (e.stopPropagation) {
-        e.stopPropagation();
-      }
-      if (e.preventDefault) {
-        e.preventDefault();
-      }
-      const { current: position } = positionRef;
-      const x = Math.round(e.clientX);
-      const moveBy = x - position.now;
-      const distanceMoved = position.now - position.start;
-      positionRef.current.now = x;
-      if (moveBy !== 0) {
-        onDrag(e, moveBy, distanceMoved);
-      }
-    },
-    [onDrag]
-  );
-  const onMouseUp = useCallback2(
-    (e) => {
-      window.removeEventListener("mouseup", onMouseUp);
-      window.removeEventListener("mousemove", onMouseMove);
-      const { current: position } = positionRef;
-      const distanceMoved = position.now - position.start;
-      onDragEnd(e, distanceMoved);
-    },
-    [onDragEnd, onMouseMove]
-  );
-  const handleMouseDown = useCallback2(
-    (e) => {
-      const { current: position } = positionRef;
-      onDragStart(e);
-      position.now = position.start = Math.round(e.clientX);
-      window.addEventListener("mouseup", onMouseUp);
-      window.addEventListener("mousemove", onMouseMove);
-      if (e.stopPropagation) {
-        e.stopPropagation();
-      }
-      if (e.preventDefault) {
-        e.preventDefault();
-      }
-    },
-    [onDragStart, onMouseMove, onMouseUp]
-  );
-  return /* @__PURE__ */ jsx4("div", { className: baseClass, onMouseDown: handleMouseDown });
-};
-
-// src/column-resizing/useTableColumnResize.tsx
-import { useCallback as useCallback3, useRef as useRef2, useState } from "react";
-var useTableColumnResize = ({
-  column,
-  onResize,
-  rootRef
-}) => {
-  const widthRef = useRef2({ start: 0, now: 0 });
-  const [isResizing, setResizing] = useState(false);
-  const { name } = column;
-  const handleResizeStart = useCallback3(() => {
-    if (onResize && rootRef.current) {
-      const { current: width } = widthRef;
-      const { width: measuredWidth } = rootRef.current.getBoundingClientRect();
-      width.start = width.now = Math.round(measuredWidth);
-      setResizing(true);
-      onResize == null ? void 0 : onResize("begin", name);
-    }
-  }, [name, onResize, rootRef]);
-  const handleResize = useCallback3(
-    (_evt, moveBy, totalDistanceMoved) => {
-      if (rootRef.current) {
-        if (onResize) {
-          const { current: width } = widthRef;
-          const newWidth = width.start + totalDistanceMoved;
-          if (newWidth !== width.now && newWidth > 0) {
-            onResize("resize", name, newWidth);
-            width.now = newWidth;
-          }
-        }
-      }
-    },
-    [name, onResize, rootRef]
-  );
-  const handleResizeEnd = useCallback3(() => {
-    if (onResize) {
-      const { current: width } = widthRef;
-      onResize("end", name, width.now);
-      setTimeout(() => {
-        setResizing(false);
-      }, 80);
-    }
-  }, [name, onResize]);
-  return {
-    isResizing,
-    onDrag: handleResize,
-    onDragStart: handleResizeStart,
-    onDragEnd: handleResizeEnd
-  };
-};
-
-// src/useCell.ts
-import { getColumnStyle } from "@vuu-ui/vuu-utils";
-import cx2 from "clsx";
-import { useMemo } from "react";
-var useCell = (column, classBase11, isHeader) => (
-  // TODO measure perf without the memo, might not be worth the cost
-  useMemo(() => {
-    const className = cx2(classBase11, {
-      vuuPinFloating: column.pin === "floating",
-      vuuPinLeft: column.pin === "left",
-      vuuPinRight: column.pin === "right",
-      vuuEndPin: isHeader && column.endPin,
-      // [`${classBase}-resizing`]: column.resizing,
-      [`${classBase11}-editable`]: column.editable,
-      [`${classBase11}-right`]: column.align === "right"
-    });
-    const style = getColumnStyle(column);
-    return {
-      className,
-      style
-    };
-  }, [column, classBase11, isHeader])
-);
-
-// src/header-cell/GroupHeaderCell.tsx
-import { jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
-import { createElement } from "react";
-var classBase2 = "vuuTableGroupHeaderCell";
-var switchIfChanged = (columns, newColumns) => {
-  if (columns === newColumns) {
-    return columns;
-  } else {
-    return newColumns;
-  }
-};
-var GroupHeaderCell = ({
-  column: groupColumn,
-  className: classNameProp,
-  onMoveColumn,
-  onRemoveColumn,
-  onResize,
-  ...htmlAttributes
-}) => {
-  const rootRef = useRef3(null);
-  const { isResizing, ...resizeProps } = useTableColumnResize({
-    column: groupColumn,
-    onResize,
-    rootRef
-  });
-  const [columns, setColumns] = useState2(groupColumn.columns);
-  const { className, style } = useCell(groupColumn, classBase2, true);
-  const columnPillProps = columns.length > 1 ? {
-    removable: true,
-    onRemove: onRemoveColumn
-  } : void 0;
-  const handleMoveItem = useCallback4(
-    (fromIndex, toIndex) => {
-      setColumns((cols) => {
-        const newCols = cols.slice();
-        const [tab] = newCols.splice(fromIndex, 1);
-        if (toIndex === -1) {
-          const result = newCols.concat(tab);
-          onMoveColumn == null ? void 0 : onMoveColumn(result);
-          return result;
-        } else {
-          newCols.splice(toIndex, 0, tab);
-          onMoveColumn == null ? void 0 : onMoveColumn(newCols);
-          return newCols;
-        }
-      });
-    },
-    [onMoveColumn]
-  );
-  useLayoutEffectSkipFirst(() => {
-    setColumns((cols) => switchIfChanged(cols, groupColumn.columns));
-  }, [groupColumn.columns]);
-  return /* @__PURE__ */ jsxs4(
-    "div",
-    {
-      ...htmlAttributes,
-      className: cx3(className, classNameProp, {
-        [`${classBase2}-pending`]: groupColumn.groupConfirmed === false
-      }),
-      ref: rootRef,
-      role: "columnheader",
-      style,
-      children: [
-        /* @__PURE__ */ jsx5(
-          OverflowContainer,
-          {
-            allowDragDrop: true,
-            className: `${classBase2}-inner`,
-            onMoveItem: handleMoveItem,
-            overflowPosition: "start",
-            children: columns.map((column) => {
-              return /* @__PURE__ */ createElement(
-                GroupColumnPill,
-                {
-                  ...columnPillProps,
-                  column,
-                  key: column.name
-                }
-              );
-            })
-          }
-        ),
-        /* @__PURE__ */ jsx5(
-          ColumnHeaderPill,
-          {
-            column: groupColumn,
-            removable: true,
-            onRemove: onRemoveColumn
-          }
-        ),
-        groupColumn.resizeable !== false ? /* @__PURE__ */ jsx5(ColumnResizer, { ...resizeProps }) : null
-      ]
-    }
-  );
-};
-
-// src/header-cell/HeaderCell.tsx
-import { useContextMenu } from "@vuu-ui/vuu-popups";
-import cx5 from "clsx";
-import {
-  useCallback as useCallback5,
-  useMemo as useMemo2,
-  useRef as useRef4
-} from "react";
-
-// src/column-menu/ColumnMenu.tsx
-import { PopupMenu } from "@vuu-ui/vuu-popups";
-import cx4 from "clsx";
-import { jsx as jsx6 } from "react/jsx-runtime";
-var classBase3 = "vuuColumnMenu";
-var ColumnMenu = ({ className, column }) => {
-  return /* @__PURE__ */ jsx6(
-    PopupMenu,
-    {
-      className: cx4(classBase3, className),
-      "data-embedded": true,
-      menuLocation: "column-menu",
-      menuOptions: { column }
-    }
-  );
-};
-
-// src/header-cell/HeaderCell.tsx
-import { jsx as jsx7, jsxs as jsxs5 } from "react/jsx-runtime";
-var classBase4 = "vuuTableHeaderCell";
-var HeaderCell = ({
-  className: classNameProp,
-  column,
-  onClick,
-  onResize,
-  showMenu = true,
-  ...htmlAttributes
-}) => {
-  const { HeaderCellContentRenderer, HeaderCellLabelRenderer } = column;
-  const rootRef = useRef4(null);
-  const { isResizing, ...resizeProps } = useTableColumnResize({
-    column,
-    onResize,
-    rootRef
-  });
-  const [showContextMenu] = useContextMenu();
-  const handleContextMenu = useMemo2(() => {
-    if (showMenu) {
-      return void 0;
-    } else {
-      return (e) => showContextMenu(e, "column-menu", { column });
-    }
-  }, [column, showContextMenu, showMenu]);
-  const headerItems = useMemo2(() => {
-    var _a;
-    const sortIndicator = /* @__PURE__ */ jsx7(SortIndicator, { column });
-    const columnLabel = HeaderCellLabelRenderer ? /* @__PURE__ */ jsx7(
-      HeaderCellLabelRenderer,
-      {
-        className: `${classBase4}-label`,
-        column
-      }
-    ) : /* @__PURE__ */ jsx7("div", { className: `${classBase4}-label`, children: (_a = column.label) != null ? _a : column.name });
-    const columnContent = HeaderCellContentRenderer ? [/* @__PURE__ */ jsx7(HeaderCellContentRenderer, { column }, "content")] : [];
-    if (showMenu) {
-      const columnMenu = /* @__PURE__ */ jsx7(ColumnMenu, { column });
-      if (column.align === "right") {
-        return [sortIndicator, columnLabel, columnContent, columnMenu];
-      } else {
-        return [columnMenu, columnLabel, sortIndicator, columnContent];
-      }
-    } else {
-      if (column.align === "right") {
-        return [sortIndicator, columnLabel, columnContent];
-      } else {
-        return [columnLabel, sortIndicator, columnContent];
-      }
-    }
-  }, [HeaderCellContentRenderer, HeaderCellLabelRenderer, column, showMenu]);
-  const handleClick = useCallback5(
-    (evt) => {
-      !isResizing && (onClick == null ? void 0 : onClick(evt));
-    },
-    [isResizing, onClick]
-  );
-  const handleKeyDown = useCallback5(
-    (evt) => {
-      if (evt.key === "Enter") {
-        onClick == null ? void 0 : onClick(evt);
-      }
-    },
-    [onClick]
-  );
-  const { className, style } = useCell(column, classBase4, true);
-  return /* @__PURE__ */ jsxs5(
-    "div",
-    {
-      ...htmlAttributes,
-      className: cx5(className, classNameProp, {
-        [`${classBase4}-resizing`]: isResizing,
-        [`${classBase4}-noMenu`]: showMenu === false
-      }),
-      onClick: handleClick,
-      onContextMenu: handleContextMenu,
-      onKeyDown: handleKeyDown,
-      ref: rootRef,
-      role: "columnheader",
-      style,
-      children: [
-        ...headerItems,
-        column.resizeable !== false ? /* @__PURE__ */ jsx7(ColumnResizer, { ...resizeProps }) : null
-      ]
-    }
-  );
-};
-
-// src/Table.tsx
-import { ContextMenuProvider } from "@vuu-ui/vuu-popups";
-import {
-  MeasuredContainer
-} from "@vuu-ui/vuu-ui-controls";
-import { metadataKeys as metadataKeys6, useId } from "@vuu-ui/vuu-utils";
-import { useForkRef } from "@salt-ds/core";
-import cx9 from "clsx";
-import {
-  forwardRef as forwardRef2,
-  useRef as useRef15,
-  useState as useState8
-} from "react";
-
-// src/Row.tsx
-import {
-  isGroupColumn,
-  isJsonColumn,
-  isJsonGroup,
-  metadataKeys as metadataKeys2,
-  isNotHidden,
-  RowSelected
-} from "@vuu-ui/vuu-utils";
-import cx7 from "clsx";
-import {
-  forwardRef,
-  memo,
-  useCallback as useCallback8
-} from "react";
-
-// src/table-cell/TableCell.tsx
-import { isNumericColumn } from "@vuu-ui/vuu-utils";
-import { useCallback as useCallback6 } from "react";
-import { jsx as jsx8 } from "react/jsx-runtime";
-var classBase5 = "vuuTableCell";
-var TableCell = ({
-  column,
-  columnMap,
-  onClick,
-  onDataEdited,
-  row
-}) => {
-  const { className, style } = useCell(column, classBase5);
-  const { CellRenderer, index, name, valueFormatter } = column;
-  const dataIdx = columnMap[name];
-  const handleDataItemEdited = useCallback6(
-    (value) => {
-      if (onDataEdited) {
-        let typedValue = value;
-        if (isNumericColumn(column) && typeof value === "string") {
-          typedValue = column.serverDataType === "double" ? parseFloat(value) : parseInt(value);
-        }
-        return onDataEdited == null ? void 0 : onDataEdited(row, name, typedValue);
-      } else {
-        throw Error(
-          "TableCell onDataEdited prop not supplied for an editable cell"
-        );
-      }
-    },
-    [column, name, onDataEdited, row]
-  );
-  const handleClick = useCallback6(
-    (evt) => {
-      onClick == null ? void 0 : onClick(evt, column);
-    },
-    [column, onClick]
-  );
-  return /* @__PURE__ */ jsx8(
-    "div",
-    {
-      "aria-colindex": index,
-      className,
-      onClick: onClick ? handleClick : void 0,
-      role: "cell",
-      style,
-      children: CellRenderer ? /* @__PURE__ */ jsx8(
-        CellRenderer,
-        {
-          column,
-          columnMap,
-          onCommit: handleDataItemEdited,
-          row
-        }
-      ) : valueFormatter(row[dataIdx])
-    }
-  );
-};
-
-// src/table-cell/TableGroupCell.tsx
-import { getGroupValueAndOffset, metadataKeys } from "@vuu-ui/vuu-utils";
-import { useCallback as useCallback7 } from "react";
-import cx6 from "clsx";
-import { jsx as jsx9, jsxs as jsxs6 } from "react/jsx-runtime";
-var { IS_LEAF } = metadataKeys;
-var classBase6 = "vuuTableGroupCell";
-var TableGroupCell = ({
-  column,
-  columnMap,
-  onClick,
-  row
-}) => {
-  const { columns } = column;
-  const [value, offset] = getGroupValueAndOffset(columns, row, columnMap);
-  const { className, style } = useCell(column, classBase6);
-  const handleClick = useCallback7(
-    (evt) => {
-      onClick == null ? void 0 : onClick(evt, column);
-    },
-    [column, onClick]
-  );
-  const isLeaf = row[IS_LEAF];
-  const spacers = Array(offset).fill(0).map((n, i) => /* @__PURE__ */ jsx9("span", { className: `${classBase6}-spacer` }, i));
-  return /* @__PURE__ */ jsxs6(
-    "div",
-    {
-      className: cx6(className, "vuuTableCell"),
-      role: "cell",
-      style,
-      onClick: isLeaf ? void 0 : handleClick,
-      children: [
-        spacers,
-        isLeaf ? null : /* @__PURE__ */ jsx9("span", { className: `${classBase6}-toggle`, "data-icon": "triangle-right" }),
-        /* @__PURE__ */ jsx9("span", { children: value })
-      ]
-    }
-  );
-};
-
-// src/Row.tsx
-import { jsx as jsx10, jsxs as jsxs7 } from "react/jsx-runtime";
-var { IDX, IS_EXPANDED, SELECTED } = metadataKeys2;
-var classBase7 = "vuuTableRow";
-var RowProxy = forwardRef(
-  function RowProxy2({ height }, forwardedRef) {
-    return /* @__PURE__ */ jsx10(
-      "div",
-      {
-        "aria-hidden": true,
-        className: cx7(classBase7, `${classBase7}-proxy`),
-        ref: forwardedRef,
-        style: { height }
-      }
-    );
-  }
-);
-var Row = memo(
-  ({
-    className: classNameProp,
-    classNameGenerator,
-    columnMap,
-    columns,
-    highlighted,
-    row,
-    offset,
-    onClick,
-    onDataEdited,
-    onToggleGroup,
-    virtualColSpan = 0,
-    zebraStripes = false,
-    ...htmlAttributes
-  }) => {
-    const {
-      [IDX]: rowIndex,
-      [IS_EXPANDED]: isExpanded,
-      [SELECTED]: selectionStatus
-    } = row;
-    const handleRowClick = useCallback8(
-      (evt) => {
-        const rangeSelect = evt.shiftKey;
-        const keepExistingSelection = evt.ctrlKey || evt.metaKey;
-        onClick == null ? void 0 : onClick(evt, row, rangeSelect, keepExistingSelection);
-      },
-      [onClick, row]
-    );
-    const { True, First, Last } = RowSelected;
-    const className = cx7(
-      classBase7,
-      classNameProp,
-      classNameGenerator == null ? void 0 : classNameGenerator(row, columnMap),
-      {
-        [`${classBase7}-even`]: zebraStripes && rowIndex % 2 === 0,
-        [`${classBase7}-expanded`]: isExpanded,
-        [`${classBase7}-highlighted`]: highlighted,
-        [`${classBase7}-selected`]: selectionStatus & True,
-        [`${classBase7}-selectedStart`]: selectionStatus & First,
-        [`${classBase7}-selectedEnd`]: selectionStatus & Last
-      }
-    );
-    const style = { transform: `translate3d(0px, ${offset}px, 0px)` };
-    const handleGroupCellClick = useCallback8(
-      (evt, column) => {
-        if (isGroupColumn(column) || isJsonGroup(column, row, columnMap)) {
-          evt.stopPropagation();
-          onToggleGroup == null ? void 0 : onToggleGroup(row, column);
-        }
-      },
-      [columnMap, onToggleGroup, row]
-    );
-    return /* @__PURE__ */ jsxs7(
-      "div",
-      {
-        ...htmlAttributes,
-        role: "row",
-        className,
-        onClick: handleRowClick,
-        style,
-        children: [
-          /* @__PURE__ */ jsx10("span", { className: `${classBase7}-selectionDecorator vuuStickyLeft` }),
-          virtualColSpan > 0 ? /* @__PURE__ */ jsx10("div", { className: "vuuTableCell", style: { width: virtualColSpan } }) : null,
-          columns.filter(isNotHidden).map((column) => {
-            const isGroup = isGroupColumn(column);
-            const isJsonCell = isJsonColumn(column);
-            const Cell = isGroup ? TableGroupCell : TableCell;
-            return /* @__PURE__ */ jsx10(
-              Cell,
-              {
-                column,
-                columnMap,
-                onClick: isGroup || isJsonCell ? handleGroupCellClick : void 0,
-                onDataEdited,
-                row
-              },
-              column.name
-            );
-          }),
-          /* @__PURE__ */ jsx10("span", { className: `${classBase7}-selectionDecorator vuuStickyRight` })
-        ]
-      }
-    );
-  }
-);
-Row.displayName = "Row";
-
-// src/table-header/TableHeader.tsx
-import { isGroupColumn as isGroupColumn2, isNotHidden as isNotHidden2 } from "@vuu-ui/vuu-utils";
-import cx8 from "clsx";
-import { memo as memo2 } from "react";
-
-// src/table-header/useTableHeader.ts
-import {
-  useDragDrop
-} from "@vuu-ui/vuu-ui-controls";
-import {
-  moveColumnTo,
-  queryClosest,
-  visibleColumnAtIndex
-} from "@vuu-ui/vuu-utils";
-import { useCallback as useCallback9, useRef as useRef5 } from "react";
-var useTableHeader = ({
-  columns,
-  onMoveColumn,
-  onSortColumn,
-  tableConfig
-}) => {
-  const containerRef = useRef5(null);
-  const scrollingContainerRef = useRef5(null);
-  const setContainerRef = useCallback9((el) => {
-    containerRef.current = el;
-    if (el) {
-      scrollingContainerRef.current = el.closest(".vuuTable-contentContainer");
-    } else {
-      scrollingContainerRef.current = null;
-    }
-  }, []);
-  const handleDropColumnHeader = useCallback9(
-    ({ fromIndex: moveFrom, toIndex: moveTo }) => {
-      const column = columns[moveFrom];
-      const orderedColumns = moveColumnTo(columns, column, moveTo);
-      const ofColumn = ({ name }) => (col) => col.name === name;
-      const targetIndex = orderedColumns.findIndex(ofColumn(column));
-      const nextColumn = orderedColumns[targetIndex + 1];
-      const insertPos = nextColumn ? tableConfig.columns.findIndex(ofColumn(nextColumn)) : -1;
-      if (moveTo > moveFrom && insertPos !== -1) {
-        onMoveColumn(moveColumnTo(tableConfig.columns, column, insertPos - 1));
-      } else {
-        onMoveColumn(moveColumnTo(tableConfig.columns, column, insertPos));
-      }
-    },
-    [columns, onMoveColumn, tableConfig.columns]
-  );
-  const handleColumnHeaderClick = useCallback9(
-    (evt) => {
-      var _a;
-      const headerCell = queryClosest(evt.target, ".vuuTableHeaderCell");
-      const colIdx = parseInt((_a = headerCell == null ? void 0 : headerCell.dataset.index) != null ? _a : "-1");
-      const column = visibleColumnAtIndex(columns, colIdx);
-      const isAdditive = evt.shiftKey;
-      column && onSortColumn(column, isAdditive);
-    },
-    [columns, onSortColumn]
-  );
-  const {
-    onMouseDown: columnHeaderDragMouseDown,
-    draggable: draggableColumn,
-    ...dragDropHook
-  } = useDragDrop({
-    allowDragDrop: true,
-    containerRef,
-    draggableClassName: `vuuTable`,
-    itemQuery: ".vuuTableHeaderCell",
-    onDrop: handleDropColumnHeader,
-    orientation: "horizontal",
-    scrollingContainerRef
-  });
-  return {
-    draggableColumn,
-    draggedColumnIndex: dragDropHook.draggedItemIndex,
-    onClick: handleColumnHeaderClick,
-    onMouseDown: columnHeaderDragMouseDown,
-    setContainerRef
-  };
-};
-
-// src/table-header/TableHeader.tsx
-import { jsx as jsx11, jsxs as jsxs8 } from "react/jsx-runtime";
-var TableHeader = memo2(
-  ({
-    classBase: classBase11 = "vuuTable",
-    columns,
-    headings,
-    onMoveColumn,
-    onMoveGroupColumn,
-    onRemoveGroupColumn,
-    onResizeColumn,
-    onSortColumn,
-    showColumnHeaderMenus,
-    tableConfig,
-    tableId,
-    virtualColSpan = 0
-  }) => {
-    const {
-      draggableColumn,
-      draggedColumnIndex,
-      onClick,
-      onMouseDown,
-      setContainerRef
-    } = useTableHeader({
-      columns,
-      onMoveColumn,
-      onSortColumn,
-      tableConfig
-    });
-    return /* @__PURE__ */ jsxs8("div", { className: `${classBase11}-col-headings`, ref: setContainerRef, children: [
-      headings.map((colHeaders, i) => /* @__PURE__ */ jsx11("div", { className: "vuuTable-heading", children: colHeaders.map(({ label, width }, j) => /* @__PURE__ */ jsx11("div", { className: "vuuTable-headingCell", style: { width }, children: label }, j)) }, i)),
-      /* @__PURE__ */ jsxs8("div", { className: `${classBase11}-col-headers`, role: "row", children: [
-        virtualColSpan > 0 ? /* @__PURE__ */ jsx11(
-          "div",
-          {
-            role: "cell",
-            className: "vuuTableCell",
-            style: { width: virtualColSpan }
-          }
-        ) : null,
-        columns.filter(isNotHidden2).map(
-          (col, i) => isGroupColumn2(col) ? /* @__PURE__ */ jsx11(
-            GroupHeaderCell,
-            {
-              "aria-colindex": col.index,
-              column: col,
-              "data-index": i,
-              onMoveColumn: onMoveGroupColumn,
-              onRemoveColumn: onRemoveGroupColumn,
-              onResize: onResizeColumn
-            },
-            col.name
-          ) : /* @__PURE__ */ jsx11(
-            HeaderCell,
-            {
-              "aria-colindex": col.index,
-              className: cx8({
-                "vuuDraggable-dragAway": i === draggedColumnIndex
-              }),
-              column: col,
-              "data-index": i,
-              id: `${tableId}-col-${i}`,
-              onClick,
-              onMouseDown,
-              onResize: onResizeColumn,
-              showMenu: showColumnHeaderMenus
-            },
-            col.name
-          )
-        ),
-        draggableColumn
-      ] })
-    ] });
-  }
-);
-TableHeader.displayName = "TableHeader";
-
-// src/useTable.ts
-import {
-  useDragDrop as useDragDrop2
-} from "@vuu-ui/vuu-ui-controls";
-import {
-  toggleOrApplySort,
-  asDataSourceRowObject,
-  buildColumnMap as buildColumnMap2,
-  getIndexFromRowElement as getIndexFromRowElement3,
-  isGroupColumn as isGroupColumn4,
-  isJsonGroup as isJsonGroup2,
-  isValidNumber,
-  metadataKeys as metadataKeys5,
-  updateColumn,
-  useLayoutEffectSkipFirst as useLayoutEffectSkipFirst2
-} from "@vuu-ui/vuu-utils";
-import {
-  useCallback as useCallback18,
-  useEffect as useEffect4,
-  useMemo as useMemo8,
-  useRef as useRef13,
-  useState as useState6
-} from "react";
-
-// src/context-menu/buildContextMenuDescriptors.ts
-import { isNumericColumn as isNumericColumn2 } from "@vuu-ui/vuu-utils";
-var buildContextMenuDescriptors = (dataSource) => (location, options) => {
-  const descriptors = [];
-  if (dataSource === void 0) {
-    return descriptors;
-  }
-  if (location === "header" || location === "column-menu") {
-    descriptors.push(
-      ...buildSortMenuItems(options, dataSource)
-    );
-    descriptors.push(
-      ...buildGroupMenuItems(options, dataSource)
-    );
-    descriptors.push(
-      ...buildAggregationMenuItems(options, dataSource)
-    );
-    descriptors.push(...buildColumnDisplayMenuItems(options));
-    descriptors.push({
-      action: "column-settings",
-      icon: "cog",
-      label: `Column Settings`,
-      options
-    });
-    descriptors.push({
-      action: "table-settings",
-      icon: "cog",
-      label: `DataGrid Settings`,
-      options
-    });
-  }
-  return descriptors;
-};
-function buildSortMenuItems(options, { sort: { sortDefs } }) {
-  const { column } = options;
-  const menuItems = [];
-  if (column === void 0) {
-    return menuItems;
-  }
-  const hasSort = sortDefs.length > 0;
-  if (column.sorted === "A") {
-    menuItems.push({
-      label: "Reverse Sort (DSC)",
-      action: "sort-dsc",
-      options
-    });
-  } else if (column.sorted === "D") {
-    menuItems.push({
-      label: "Reverse Sort (ASC)",
-      action: "sort-asc",
-      options
-    });
-  } else if (typeof column.sorted === "number") {
-    if (column.sorted > 0) {
-      menuItems.push({
-        label: "Reverse Sort (DSC)",
-        action: "sort-add-dsc",
-        options
-      });
-    } else {
-      menuItems.push({
-        label: "Reverse Sort (ASC)",
-        action: "sort-add-asc",
-        options
-      });
-    }
-    if (hasSort && Math.abs(column.sorted) < sortDefs.length) {
-      menuItems.push({
-        label: "Remove from sort",
-        action: "sort-remove",
-        options
-      });
-    }
-    menuItems.push({
-      label: "New Sort",
-      children: [
-        { label: "Ascending", action: "sort-asc", options },
-        { label: "Descending", action: "sort-dsc", options }
-      ]
-    });
-  } else if (hasSort) {
-    menuItems.push({
-      label: "Add to sort",
-      children: [
-        { label: "Ascending", action: "sort-add-asc", options },
-        { label: "Descending", action: "sort-add-dsc", options }
-      ]
-    });
-    menuItems.push({
-      label: "New Sort",
-      children: [
-        { label: "Ascending", action: "sort-asc", options },
-        { label: "Descending", action: "sort-dsc", options }
-      ]
-    });
-  } else {
-    menuItems.push({
-      label: "Sort",
-      children: [
-        { label: "Ascending", action: "sort-asc", options },
-        { label: "Descending", action: "sort-dsc", options }
-      ]
-    });
-  }
-  return menuItems;
-}
-function buildAggregationMenuItems(options, dataSource) {
-  const { column } = options;
-  if (column === void 0 || dataSource.groupBy.length === 0) {
-    return [];
-  }
-  const { name, label = name } = column;
-  return [
-    {
-      label: `Aggregate ${label}`,
-      children: [
-        { label: "Count", action: "agg-count", options },
-        { label: "Distinct", action: "agg-distinct", options }
-      ].concat(
-        isNumericColumn2(column) ? [
-          { label: "Sum", action: "agg-sum", options },
-          { label: "Avg", action: "agg-avg", options },
-          { label: "High", action: "agg-high", options },
-          { label: "Low", action: "agg-low", options }
-        ] : []
-      )
-    }
-  ];
-}
-var pinColumn = (options, pinLocation) => ({
-  label: `Pin ${pinLocation}`,
-  action: `column-pin-${pinLocation}`,
-  options
-});
-var pinLeft = (options) => pinColumn(options, "left");
-var pinFloating = (options) => pinColumn(options, "floating");
-var pinRight = (options) => pinColumn(options, "right");
-function buildColumnDisplayMenuItems(options) {
-  const { column } = options;
-  if (column === void 0) {
-    return [];
-  }
-  const { pin } = column;
-  const menuItems = [
-    {
-      label: `Hide column`,
-      action: "column-hide",
-      options
-    },
-    {
-      label: `Remove column`,
-      action: "column-remove",
-      options
-    }
-  ];
-  if (pin === void 0) {
-    menuItems.push({
-      label: `Pin column`,
-      children: [pinLeft(options), pinFloating(options), pinRight(options)]
-    });
-  } else if (pin === "left") {
-    menuItems.push(
-      { label: "Unpin column", action: "column-unpin", options },
-      {
-        label: `Pin column`,
-        children: [pinFloating(options), pinRight(options)]
-      }
-    );
-  } else if (pin === "right") {
-    menuItems.push(
-      { label: "Unpin column", action: "column-unpin", options },
-      {
-        label: `Pin column`,
-        children: [pinLeft(options), pinFloating(options)]
-      }
-    );
-  } else if (pin === "floating") {
-    menuItems.push(
-      { label: "Unpin column", action: "column-unpin", options },
-      {
-        label: `Pin column`,
-        children: [pinLeft(options), pinRight(options)]
-      }
-    );
-  }
-  return menuItems;
-}
-function buildGroupMenuItems(options, { groupBy }) {
-  const { column } = options;
-  const menuItems = [];
-  if (column === void 0) {
-    return menuItems;
-  }
-  const { name, label = name } = column;
-  if (groupBy.length === 0) {
-    menuItems.push({
-      label: `Group by ${label}`,
-      action: "group",
-      options
-    });
-  } else {
-    menuItems.push({
-      label: `Add ${label} to group by`,
-      action: "group-add",
-      options
-    });
-  }
-  return menuItems;
-}
-
-// src/context-menu/useHandleTableContextMenu.ts
-import { removeColumnFromFilter } from "@vuu-ui/vuu-utils";
-import {
-  addGroupColumn,
-  addSortColumn,
-  AggregationType,
-  setAggregations,
-  setSortColumn
-} from "@vuu-ui/vuu-utils";
-var removeFilterColumn = (dataSourceFilter, column) => {
-  if (dataSourceFilter.filterStruct && column) {
-    const [filterStruct, filter] = removeColumnFromFilter(
-      column,
-      dataSourceFilter.filterStruct
-    );
-    return {
-      filter,
-      filterStruct
-    };
-  } else {
-    return dataSourceFilter;
-  }
-};
-var { Average, Count, Distinct, High, Low, Sum } = AggregationType;
-var useHandleTableContextMenu = ({
-  dataSource,
-  onPersistentColumnOperation
-}) => {
-  const handleContextMenuAction = (action) => {
-    const gridOptions = action.options;
-    if (gridOptions.column && dataSource) {
-      const { column } = gridOptions;
-      switch (action.menuId) {
-        case "sort-asc":
-          return dataSource.sort = setSortColumn(dataSource.sort, column, "A"), true;
-        case "sort-dsc":
-          return dataSource.sort = setSortColumn(dataSource.sort, column, "D"), true;
-        case "sort-add-asc":
-          return dataSource.sort = addSortColumn(dataSource.sort, column, "A"), true;
-        case "sort-add-dsc":
-          return dataSource.sort = addSortColumn(dataSource.sort, column, "D"), true;
-        case "group":
-          return dataSource.groupBy = addGroupColumn(dataSource.groupBy, column), true;
-        case "group-add":
-          return dataSource.groupBy = addGroupColumn(dataSource.groupBy, column), true;
-        case "column-hide":
-          return onPersistentColumnOperation({ type: "hideColumns", columns: [column] }), true;
-        case "column-remove":
-          return dataSource.columns = dataSource.columns.filter((name) => name !== column.name), true;
-        case "filter-remove-column":
-          return dataSource.filter = removeFilterColumn(dataSource.filter, column), true;
-        case "remove-filters":
-          return dataSource.filter = { filter: "" }, true;
-        case "agg-avg":
-          return dataSource.aggregations = setAggregations(dataSource.aggregations, column, Average), true;
-        case "agg-high":
-          return dataSource.aggregations = setAggregations(dataSource.aggregations, column, High), true;
-        case "agg-low":
-          return dataSource.aggregations = setAggregations(dataSource.aggregations, column, Low), true;
-        case "agg-count":
-          return dataSource.aggregations = setAggregations(dataSource.aggregations, column, Count), true;
-        case "agg-distinct":
-          return dataSource.aggregations = setAggregations(dataSource.aggregations, column, Distinct), true;
-        case "agg-sum":
-          return dataSource.aggregations = setAggregations(dataSource.aggregations, column, Sum), true;
-        case "column-pin-floating":
-          return onPersistentColumnOperation({ type: "pinColumn", column, pin: "floating" }), true;
-        case "column-pin-left":
-          return onPersistentColumnOperation({ type: "pinColumn", column, pin: "left" }), true;
-        case "column-pin-right":
-          return onPersistentColumnOperation({ type: "pinColumn", column, pin: "right" }), true;
-        case "column-unpin":
-          return onPersistentColumnOperation({ type: "pinColumn", column, pin: void 0 }), true;
-        case "column-settings":
-          return onPersistentColumnOperation({ type: "columnSettings", column }), true;
-        case "table-settings":
-          return onPersistentColumnOperation({ type: "tableSettings" }), true;
-        default:
-      }
-    }
-    return false;
-  };
-  return handleContextMenuAction;
-};
-
-// src/table-config.ts
-var updateTableConfig = (config, action) => {
-  switch (action.type) {
-    case "col-size":
-      return {
-        ...config,
-        columns: config.columns.map(
-          (col) => col.name === action.column.name ? { ...col, width: action.width } : col
-        )
-      };
-    case "column-prop":
-      return {
-        ...config,
-        columns: config.columns.map(
-          (col) => col.name === action.column.name ? { ...col, [action.property]: action.value } : col
-        )
-      };
-    default:
-      return config;
-  }
-};
-
-// src/useCellEditing.ts
-import { isCharacterKey } from "@vuu-ui/vuu-utils";
-import {
-  useCallback as useCallback10
-} from "react";
-
-// src/table-dom-utils.ts
-var headerCellQuery = (colIdx) => `.vuuTable-col-headers .vuuTableHeaderCell:nth-child(${colIdx})`;
-var dataCellQuery = (rowIdx, colIdx) => `.vuuTable-body > [aria-rowindex='${rowIdx + 1}'] > [role='cell']:nth-child(${colIdx + 1})`;
-var getTableCell = (containerRef, [rowIdx, colIdx]) => {
-  var _a;
-  const cssQuery = rowIdx === -1 ? headerCellQuery(colIdx) : dataCellQuery(rowIdx, colIdx);
-  const cell = (_a = containerRef.current) == null ? void 0 : _a.querySelector(
-    cssQuery
-  );
-  if (cellIsEditable(cell)) {
-    const focusableContent = cell.querySelector("button");
-    return focusableContent || cell;
-  } else {
-    return cell;
-  }
-};
-var cellIsEditable = (cell) => cell == null ? void 0 : cell.classList.contains("vuuTableCell-editable");
-var cellIsTextInput = (cell) => cell.querySelector(".vuuTableInputCell") !== null;
-function getRowIndex(rowEl) {
-  if (rowEl) {
-    const idx = rowEl.ariaRowIndex;
-    if (idx !== null) {
-      return parseInt(idx, 10) - 1;
-    }
-  }
-  return -1;
-}
-var closestRow = (el) => el.closest('[role="row"]');
-var closestRowIndex = (el) => getRowIndex(closestRow(el));
-var NO_SCROLL_NECESSARY = [void 0, void 0];
-var howFarIsRowOutsideViewport = (rowEl, totalHeaderHeight, contentContainer = rowEl.closest(".vuuTable-contentContainer")) => {
-  if (contentContainer) {
-    const viewport = contentContainer == null ? void 0 : contentContainer.getBoundingClientRect();
-    const upperBoundary = viewport.top + totalHeaderHeight;
-    const row = rowEl.getBoundingClientRect();
-    if (row) {
-      if (row.bottom > viewport.bottom) {
-        return ["down", row.bottom - viewport.bottom];
-      } else if (row.top < upperBoundary) {
-        return ["up", row.top - upperBoundary];
-      } else {
-        return NO_SCROLL_NECESSARY;
-      }
-    } else {
-      throw Error("Whats going on, row not found");
-    }
-  } else {
-    throw Error("Whats going on, scrollbar container not found");
-  }
-};
-
-// src/useCellEditing.ts
-var useCellEditing = ({ navigate }) => {
-  const commitHandler = useCallback10(() => {
-    navigate();
-  }, [navigate]);
-  const editInput = useCallback10(
-    (evt) => {
-      const cellEl = evt.target;
-      const input = cellEl.matches("input") ? cellEl : cellEl.querySelector("input");
-      if (input) {
-        input.focus();
-        input.select();
-      }
-    },
-    []
-  );
-  const focusInput = useCallback10(
-    (evt) => {
-      const cellEl = evt.target;
-      const input = cellEl.querySelector("input");
-      if (input) {
-        input.focus();
-        input.select();
-      }
-    },
-    []
-  );
-  const handleKeyDown = useCallback10(
-    (e) => {
-      const el = e.target;
-      if (cellIsTextInput(el)) {
-        if (isCharacterKey(e.key)) {
-          editInput(e);
-        } else if (e.key === "Enter") {
-          focusInput(e);
-        }
-      }
-    },
-    [editInput, focusInput]
-  );
-  const handleDoubleClick = useCallback10(
-    (e) => {
-      const el = e.target;
-      if (el.matches("input") || el.querySelector("input")) {
-        editInput(e);
-        e.stopPropagation();
-      }
-    },
-    [editInput]
-  );
-  const handleBlur = useCallback10(
-    (e) => {
-      const el = e.target;
-      el.removeEventListener("vuu-commit", commitHandler, true);
-    },
-    [commitHandler]
-  );
-  const handleFocus = useCallback10(
-    (e) => {
-      const el = e.target;
-      el.addEventListener("vuu-commit", commitHandler, true);
-    },
-    [commitHandler]
-  );
-  return {
-    onBlur: handleBlur,
-    onDoubleClick: handleDoubleClick,
-    onFocus: handleFocus,
-    onKeyDown: handleKeyDown
-  };
-};
-
-// src/useDataSource.ts
-import { getFullRange, NULL_RANGE, rangesAreSame } from "@vuu-ui/vuu-utils";
-import { useCallback as useCallback11, useEffect, useMemo as useMemo3, useRef as useRef6, useState as useState3 } from "react";
-
-// src/moving-window.ts
-import {
-  isRowSelectedLast,
-  metadataKeys as metadataKeys3,
-  WindowRange
-} from "@vuu-ui/vuu-utils";
-var { SELECTED: SELECTED2 } = metadataKeys3;
-var MovingWindow = class {
-  constructor({ from, to }) {
-    this.rowCount = 0;
-    this.setRowCount = (rowCount) => {
-      if (rowCount < this.data.length) {
-        this.data.length = rowCount;
-      }
-      this.rowCount = rowCount;
-    };
-    this.range = new WindowRange(from, to);
-    this.data = new Array(Math.max(0, to - from));
-    this.rowCount = 0;
-  }
-  add(data) {
-    const [index] = data;
-    if (this.isWithinRange(index)) {
-      const internalIndex = index - this.range.from;
-      this.data[internalIndex] = data;
-      if (data[SELECTED2]) {
-        const previousRow = this.data[internalIndex - 1];
-        if (isRowSelectedLast(previousRow)) {
-          this.data[internalIndex - 1] = previousRow.slice();
-          this.data[internalIndex - 1][SELECTED2] -= 4;
-        }
-      }
-    }
-  }
-  getAtIndex(index) {
-    return this.range.isWithin(index) && this.data[index - this.range.from] != null ? this.data[index - this.range.from] : void 0;
-  }
-  isWithinRange(index) {
-    return this.range.isWithin(index);
-  }
-  setRange({ from, to }) {
-    if (from !== this.range.from || to !== this.range.to) {
-      const [overlapFrom, overlapTo] = this.range.overlap(from, to);
-      const newData = new Array(Math.max(0, to - from));
-      for (let i = overlapFrom; i < overlapTo; i++) {
-        const data = this.getAtIndex(i);
-        if (data) {
-          const index = i - from;
-          newData[index] = data;
-        }
-      }
-      this.data = newData;
-      this.range.from = from;
-      this.range.to = to;
-    }
-  }
-  getSelectedRows() {
-    return this.data.filter((row) => row[SELECTED2] !== 0);
-  }
-};
-
-// src/useDataSource.ts
-var isVuuFeatureInvocation = (action) => action.type === "vuu-link-created" || action.type === "vuu-link-removed";
-var useDataSource = ({
-  dataSource,
-  onFeatureInvocation,
-  onSizeChange,
-  onSubscribed,
-  range = NULL_RANGE,
-  renderBufferSize = 0
-}) => {
-  const [, forceUpdate] = useState3(null);
-  const data = useRef6([]);
-  const isMounted = useRef6(true);
-  const hasUpdated = useRef6(false);
-  const rangeRef = useRef6(range);
-  const dataWindow = useMemo3(
-    () => new MovingWindow(getFullRange(range, renderBufferSize)),
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    []
-  );
-  const setData = useCallback11(
-    (updates) => {
-      for (const row of updates) {
-        dataWindow.add(row);
-      }
-      data.current = dataWindow.data;
-      if (isMounted.current) {
-        forceUpdate({});
-      } else {
-      }
-    },
-    [dataWindow]
-  );
-  const datasourceMessageHandler = useCallback11(
-    (message) => {
-      if (message.type === "subscribed") {
-        onSubscribed == null ? void 0 : onSubscribed(message);
-      } else if (message.type === "viewport-update") {
-        if (typeof message.size === "number") {
-          onSizeChange == null ? void 0 : onSizeChange(message.size);
-          dataWindow.setRowCount(message.size);
-        }
-        if (message.rows) {
-          setData(message.rows);
-        } else if (typeof message.size === "number") {
-          data.current = dataWindow.data;
-          hasUpdated.current = true;
-        }
-      } else if (isVuuFeatureInvocation(message)) {
-        onFeatureInvocation == null ? void 0 : onFeatureInvocation(message);
-      } else {
-        console.log(`useDataSource unexpected message ${message.type}`);
-      }
-    },
-    [dataWindow, onFeatureInvocation, onSizeChange, onSubscribed, setData]
-  );
-  const getSelectedRows = useCallback11(() => {
-    return dataWindow.getSelectedRows();
-  }, [dataWindow]);
-  useEffect(() => {
-    var _a;
-    isMounted.current = true;
-    (_a = dataSource.resume) == null ? void 0 : _a.call(dataSource);
-    return () => {
-      var _a2;
-      isMounted.current = false;
-      (_a2 = dataSource.suspend) == null ? void 0 : _a2.call(dataSource);
-    };
-  }, [dataSource]);
-  useEffect(() => {
-    var _a;
-    if (dataSource.status === "disabled") {
-      (_a = dataSource.enable) == null ? void 0 : _a.call(dataSource, datasourceMessageHandler);
-    } else {
-      dataSource == null ? void 0 : dataSource.subscribe(
-        { range: getFullRange(range, renderBufferSize) },
-        datasourceMessageHandler
-      );
-    }
-  }, [dataSource, datasourceMessageHandler, range, renderBufferSize]);
-  const setRange = useCallback11(
-    (range2) => {
-      if (!rangesAreSame(range2, rangeRef.current)) {
-        const fullRange = getFullRange(range2, renderBufferSize);
-        dataWindow.setRange(fullRange);
-        dataSource.range = rangeRef.current = fullRange;
-        dataSource.emit("range", range2);
-      }
-    },
-    [dataSource, dataWindow, renderBufferSize]
-  );
-  return {
-    data: data.current,
-    dataRef: data,
-    getSelectedRows,
-    range: rangeRef.current,
-    setRange
-  };
-};
-
-// src/useInitialValue.ts
-import { useMemo as useMemo4, useRef as useRef7 } from "react";
-var useInitialValue = (value) => {
-  const ref = useRef7(value);
-  return useMemo4(() => ref.current, []);
-};
-
-// src/useKeyboardNavigation.ts
-import { getIndexFromRowElement } from "@vuu-ui/vuu-utils";
-import { useControlled } from "@salt-ds/core";
-import {
-  useCallback as useCallback12,
-  useEffect as useEffect2,
-  useRef as useRef8
-} from "react";
-var rowNavigationKeys = /* @__PURE__ */ new Set([
-  "Home",
-  "End",
-  "PageUp",
-  "PageDown",
-  "ArrowDown",
-  "ArrowUp"
-]);
-var cellNavigationKeys = new Set(rowNavigationKeys);
-cellNavigationKeys.add("ArrowLeft");
-cellNavigationKeys.add("ArrowRight");
-var isNavigationKey = (key, navigationStyle) => {
-  switch (navigationStyle) {
-    case "cell":
-      return cellNavigationKeys.has(key);
-    case "row":
-      return rowNavigationKeys.has(key);
-    default:
-      return false;
-  }
-};
-var PageKeys = ["Home", "End", "PageUp", "PageDown"];
-var isPagingKey = (key) => PageKeys.includes(key);
-var NULL_CELL_POS = [-1, -1];
-function nextCellPos(key, [rowIdx, colIdx], columnCount, rowCount) {
-  if (key === "ArrowUp") {
-    if (rowIdx > -1) {
-      return [rowIdx - 1, colIdx];
-    } else {
-      return [rowIdx, colIdx];
-    }
-  } else if (key === "ArrowDown") {
-    if (rowIdx === -1) {
-      return [0, colIdx];
-    } else if (rowIdx === rowCount - 1) {
-      return [rowIdx, colIdx];
-    } else {
-      return [rowIdx + 1, colIdx];
-    }
-  } else if (key === "ArrowRight") {
-    if (colIdx < columnCount) {
-      return [rowIdx, colIdx + 1];
-    } else {
-      return [rowIdx, colIdx];
-    }
-  } else if (key === "ArrowLeft") {
-    if (colIdx > 1) {
-      return [rowIdx, colIdx - 1];
-    } else {
-      return [rowIdx, colIdx];
-    }
-  }
-  return [rowIdx, colIdx];
-}
-var useKeyboardNavigation = ({
-  columnCount = 0,
-  containerRef,
-  disableFocus = false,
-  defaultHighlightedIndex,
-  disableHighlightOnFocus,
-  highlightedIndex: highlightedIndexProp,
-  navigationStyle,
-  requestScroll,
-  onHighlight,
-  rowCount = 0,
-  viewportRowCount
-}) => {
-  var _a;
-  const focusedCellPos = useRef8([-1, -1]);
-  const focusableCell = useRef8();
-  const activeCellPos = useRef8([-1, 0]);
-  const highlightedIndexRef = useRef8();
-  const [highlightedIndex, setHighlightedIdx] = useControlled({
-    controlled: highlightedIndexProp,
-    default: defaultHighlightedIndex,
-    name: "UseKeyboardNavigation"
-  });
-  highlightedIndexRef.current = highlightedIndex;
-  const setHighlightedIndex = useCallback12(
-    (idx, fromKeyboard = false) => {
-      onHighlight == null ? void 0 : onHighlight(idx);
-      setHighlightedIdx(idx);
-      if (fromKeyboard) {
-      }
-    },
-    [onHighlight, setHighlightedIdx]
-  );
-  const getFocusedCell = (element) => element == null ? void 0 : element.closest(
-    "[role='columnHeader'],[role='cell']"
-  );
-  const getTableCellPos = (tableCell) => {
-    var _a2;
-    if (tableCell.role === "columnHeader") {
-      const colIdx = parseInt((_a2 = tableCell.dataset.idx) != null ? _a2 : "-1", 10);
-      return [-1, colIdx];
-    } else {
-      const focusedRow = tableCell.closest("[role='row']");
-      if (focusedRow) {
-        const rowIdx = getIndexFromRowElement(focusedRow);
-        const colIdx = Array.from(focusedRow.childNodes).indexOf(tableCell);
-        return [rowIdx, colIdx];
-      }
-    }
-    return NULL_CELL_POS;
-  };
-  const focusCell = useCallback12(
-    (cellPos) => {
-      var _a2;
-      if (containerRef.current) {
-        const activeCell = getTableCell(containerRef, cellPos);
-        if (activeCell) {
-          if (activeCell !== focusableCell.current) {
-            (_a2 = focusableCell.current) == null ? void 0 : _a2.removeAttribute("tabindex");
-            focusableCell.current = activeCell;
-            activeCell.setAttribute("tabindex", "0");
-          }
-          requestScroll == null ? void 0 : requestScroll({ type: "scroll-row", rowIndex: cellPos[0] });
-          activeCell.focus({ preventScroll: true });
-        }
-      }
-    },
-    // TODO we recreate this function whenever viewportRange changes, which will
-    // be often whilst scrolling - store range in a a ref ?
-    [containerRef, requestScroll]
-  );
-  const setActiveCell = useCallback12(
-    (rowIdx, colIdx, fromKeyboard = false) => {
-      const pos = [rowIdx, colIdx];
-      activeCellPos.current = pos;
-      if (navigationStyle === "row") {
-        setHighlightedIdx(rowIdx);
-      } else {
-        focusCell(pos);
-      }
-      if (fromKeyboard) {
-        focusedCellPos.current = pos;
-      }
-    },
-    [focusCell, navigationStyle, setHighlightedIdx]
-  );
-  const nextPageItemIdx = useCallback12(
-    (key, [rowIdx, colIdx]) => new Promise((resolve) => {
-      let newRowIdx = rowIdx;
-      switch (key) {
-        case "PageDown": {
-          newRowIdx = Math.min(rowCount - 1, rowIdx + viewportRowCount);
-          if (newRowIdx !== rowIdx) {
-            requestScroll == null ? void 0 : requestScroll({ type: "scroll-page", direction: "down" });
-          }
-          break;
-        }
-        case "PageUp": {
-          newRowIdx = Math.max(0, rowIdx - viewportRowCount);
-          if (newRowIdx !== rowIdx) {
-            requestScroll == null ? void 0 : requestScroll({ type: "scroll-page", direction: "up" });
-          }
-          break;
-        }
-        case "Home": {
-          newRowIdx = 0;
-          if (newRowIdx !== rowIdx) {
-            requestScroll == null ? void 0 : requestScroll({ type: "scroll-end", direction: "home" });
-          }
-          break;
-        }
-        case "End": {
-          newRowIdx = rowCount - 1;
-          if (newRowIdx !== rowIdx) {
-            requestScroll == null ? void 0 : requestScroll({ type: "scroll-end", direction: "end" });
-          }
-          break;
-        }
-      }
-      setTimeout(() => {
-        resolve([newRowIdx, colIdx]);
-      }, 35);
-    }),
-    [requestScroll, rowCount, viewportRowCount]
-  );
-  const handleFocus = useCallback12(() => {
-    var _a2;
-    if (disableHighlightOnFocus !== true) {
-      if ((_a2 = containerRef.current) == null ? void 0 : _a2.contains(document.activeElement)) {
-        const focusedCell = getFocusedCell(document.activeElement);
-        if (focusedCell) {
-          focusedCellPos.current = getTableCellPos(focusedCell);
-          if (navigationStyle === "row") {
-            setHighlightedIdx(focusedCellPos.current[0]);
-          }
-        }
-      }
-    }
-  }, [
-    disableHighlightOnFocus,
-    containerRef,
-    navigationStyle,
-    setHighlightedIdx
-  ]);
-  const navigateChildItems = useCallback12(
-    async (key) => {
-      const [nextRowIdx, nextColIdx] = isPagingKey(key) ? await nextPageItemIdx(key, activeCellPos.current) : nextCellPos(key, activeCellPos.current, columnCount, rowCount);
-      const [rowIdx, colIdx] = activeCellPos.current;
-      if (nextRowIdx !== rowIdx || nextColIdx !== colIdx) {
-        setActiveCell(nextRowIdx, nextColIdx, true);
-      }
-    },
-    [columnCount, nextPageItemIdx, rowCount, setActiveCell]
-  );
-  const scrollRowIntoViewIfNecessary = useCallback12(
-    (rowIndex) => {
-      requestScroll == null ? void 0 : requestScroll({ type: "scroll-row", rowIndex });
-    },
-    [requestScroll]
-  );
-  const moveHighlightedRow = useCallback12(
-    async (key) => {
-      const { current: highlighted } = highlightedIndexRef;
-      const [nextRowIdx] = isPagingKey(key) ? await nextPageItemIdx(key, [highlighted != null ? highlighted : -1, 0]) : nextCellPos(key, [highlighted != null ? highlighted : -1, 0], columnCount, rowCount);
-      if (nextRowIdx !== highlighted) {
-        setHighlightedIndex(nextRowIdx);
-        scrollRowIntoViewIfNecessary(nextRowIdx);
-      }
-    },
-    [
-      columnCount,
-      nextPageItemIdx,
-      rowCount,
-      scrollRowIntoViewIfNecessary,
-      setHighlightedIndex
-    ]
-  );
-  useEffect2(() => {
-    if (highlightedIndexProp !== void 0 && highlightedIndexProp !== -1) {
-      scrollRowIntoViewIfNecessary(highlightedIndexProp);
-    }
-  }, [highlightedIndexProp, scrollRowIntoViewIfNecessary]);
-  const handleKeyDown = useCallback12(
-    (e) => {
-      if (rowCount > 0 && isNavigationKey(e.key, navigationStyle)) {
-        e.preventDefault();
-        e.stopPropagation();
-        if (navigationStyle === "row") {
-          moveHighlightedRow(e.key);
-        } else {
-          void navigateChildItems(e.key);
-        }
-      }
-    },
-    [rowCount, navigationStyle, moveHighlightedRow, navigateChildItems]
-  );
-  const handleClick = useCallback12(
-    // Might not be a cell e.g the Settings button
-    (evt) => {
-      const target = evt.target;
-      const focusedCell = getFocusedCell(target);
-      if (focusedCell) {
-        const [rowIdx, colIdx] = getTableCellPos(focusedCell);
-        setActiveCell(rowIdx, colIdx);
-      }
-    },
-    [setActiveCell]
-  );
-  const handleMouseLeave = useCallback12(() => {
-    setHighlightedIndex(-1);
-  }, [setHighlightedIndex]);
-  const handleMouseMove = useCallback12(
-    (evt) => {
-      const idx = closestRowIndex(evt.target);
-      if (idx !== -1 && idx !== highlightedIndexRef.current) {
-        setHighlightedIndex(idx);
-      }
-    },
-    [setHighlightedIndex]
-  );
-  const navigate = useCallback12(() => {
-    navigateChildItems("ArrowDown");
-  }, [navigateChildItems]);
-  const fullyRendered = ((_a = containerRef.current) == null ? void 0 : _a.firstChild) != null;
-  useEffect2(() => {
-    if (fullyRendered && focusableCell.current === void 0 && !disableFocus) {
-      const { current: container } = containerRef;
-      const cell = (container == null ? void 0 : container.querySelector(headerCellQuery(0))) || (container == null ? void 0 : container.querySelector(dataCellQuery(0, 0)));
-      if (cell) {
-        cell.setAttribute("tabindex", "0");
-        focusableCell.current = cell;
-      }
-    }
-  }, [containerRef, disableFocus, fullyRendered]);
-  return {
-    highlightedIndexRef,
-    navigate,
-    onClick: handleClick,
-    onFocus: handleFocus,
-    onKeyDown: handleKeyDown,
-    onMouseLeave: navigationStyle === "row" ? handleMouseLeave : void 0,
-    onMouseMove: navigationStyle === "row" ? handleMouseMove : void 0
-  };
-};
-
-// src/useSelection.ts
-import {
-  deselectItem,
-  dispatchMouseEvent,
-  getRowElementAtIndex,
-  isRowSelected,
-  metadataKeys as metadataKeys4,
-  selectItem
-} from "@vuu-ui/vuu-utils";
-import {
-  useCallback as useCallback13,
-  useRef as useRef9
-} from "react";
-var { IDX: IDX2 } = metadataKeys4;
-var NO_SELECTION = [];
-var defaultSelectionKeys = ["Enter", " "];
-var useSelection = ({
-  highlightedIndexRef,
-  selectionKeys = defaultSelectionKeys,
-  selectionModel,
-  onSelect,
-  onSelectionChange
-}) => {
-  selectionModel === "extended" || selectionModel === "checkbox";
-  const lastActiveRef = useRef9(-1);
-  const selectedRef = useRef9(NO_SELECTION);
-  const isSelectionEvent = useCallback13(
-    (evt) => selectionKeys.includes(evt.key),
-    [selectionKeys]
-  );
-  const handleRowClick = useCallback13(
-    (evt, row, rangeSelect, keepExistingSelection) => {
-      const { [IDX2]: idx } = row;
-      const { current: active } = lastActiveRef;
-      const { current: selected } = selectedRef;
-      const selectOperation = isRowSelected(row) ? deselectItem : selectItem;
-      const newSelected = selectOperation(
-        selectionModel,
-        selected,
-        idx,
-        rangeSelect,
-        keepExistingSelection,
-        active
-      );
-      selectedRef.current = newSelected;
-      lastActiveRef.current = idx;
-      onSelect == null ? void 0 : onSelect(selectOperation === selectItem ? row : null);
-      onSelectionChange == null ? void 0 : onSelectionChange(newSelected);
-    },
-    [onSelect, onSelectionChange, selectionModel]
-  );
-  const handleKeyDown = useCallback13(
-    (e) => {
-      if (isSelectionEvent(e)) {
-        const { current: rowIndex } = highlightedIndexRef;
-        if (rowIndex !== void 0 && rowIndex !== -1) {
-          const rowEl = getRowElementAtIndex(e.target, rowIndex);
-          if (rowEl) {
-            dispatchMouseEvent(rowEl, "click");
-          }
-        }
-      }
-    },
-    [highlightedIndexRef, isSelectionEvent]
-  );
-  return {
-    onKeyDown: handleKeyDown,
-    onRowClick: handleRowClick
-  };
-};
-
-// src/useTableContextMenu.ts
-import { useContextMenu as usePopupContextMenu } from "@vuu-ui/vuu-popups";
-import { buildColumnMap, getIndexFromRowElement as getIndexFromRowElement2 } from "@vuu-ui/vuu-utils";
-import { useCallback as useCallback14 } from "react";
-var NO_ROWS = [];
-var useTableContextMenu = ({
-  columns,
-  data,
-  dataSource,
-  getSelectedRows
-}) => {
-  const [showContextMenu] = usePopupContextMenu();
-  const onContextMenu = useCallback14(
-    (evt) => {
-      const target = evt.target;
-      const cellEl = target == null ? void 0 : target.closest("div[role='cell']");
-      const rowEl = target == null ? void 0 : target.closest("div[role='row']");
-      if (cellEl && rowEl) {
-        const { selectedRowsCount } = dataSource;
-        const columnMap = buildColumnMap(columns);
-        const rowIndex = getIndexFromRowElement2(rowEl);
-        const cellIndex = Array.from(rowEl.childNodes).indexOf(cellEl);
-        const row = data.find(([idx]) => idx === rowIndex);
-        const columnName = columns[cellIndex];
-        showContextMenu(evt, "grid", {
-          columnMap,
-          columnName,
-          row,
-          selectedRows: selectedRowsCount === 0 ? NO_ROWS : getSelectedRows(),
-          viewport: dataSource.viewport
-        });
-      }
-    },
-    [columns, data, dataSource, getSelectedRows, showContextMenu]
-  );
-  return onContextMenu;
-};
-
-// src/useTableModel.ts
-import {
-  applyFilterToColumns,
-  applyGroupByToColumns,
-  applySortToColumns,
-  existingSort,
-  getCellRenderer,
-  getColumnHeaderContentRenderer,
-  getColumnHeaderLabelRenderer,
-  getColumnLabel,
-  getTableHeadings,
-  getValueFormatter,
-  hasValidationRules,
-  isFilteredColumn,
-  isGroupColumn as isGroupColumn3,
-  isPinned,
-  logger,
-  removeSort,
-  replaceColumn,
-  sortPinnedColumns,
-  stripFilterFromColumns,
-  subscribedOnly
-} from "@vuu-ui/vuu-utils";
-import { buildValidationChecker } from "@vuu-ui/vuu-ui-controls";
-import { useReducer } from "react";
-var { info } = logger("useTableModel");
-var DEFAULT_COLUMN_WIDTH = 100;
-var columnWithoutDataType = ({ serverDataType }) => serverDataType === void 0;
-var getDataType = (column, tableSchema) => {
-  const schemaColumn = tableSchema == null ? void 0 : tableSchema.columns.find(
-    ({ name }) => name === column.name
-  );
-  if (schemaColumn) {
-    return schemaColumn.serverDataType;
-  } else {
-    return column.serverDataType;
-  }
-};
-var numericTypes = ["int", "long", "double"];
-var getDefaultAlignment = (serverDataType) => serverDataType === void 0 ? void 0 : numericTypes.includes(serverDataType) ? "right" : "left";
-var isShowColumnSettings = (action) => action.type === "columnSettings";
-var isShowTableSettings = (action) => action.type === "tableSettings";
-var columnReducer = (state, action) => {
-  info == null ? void 0 : info(`TableModelReducer ${action.type}`);
-  switch (action.type) {
-    case "init":
-      return init(action);
-    case "moveColumn":
-      return moveColumn(state, action);
-    case "resizeColumn":
-      return resizeColumn(state, action);
-    case "setTableSchema":
-      return setTableSchema(state, action);
-    case "hideColumns":
-      return hideColumns(state, action);
-    case "showColumns":
-      return showColumns(state, action);
-    case "pinColumn":
-      return pinColumn2(state, action);
-    case "updateColumnProp":
-      return updateColumnProp(state, action);
-    case "tableConfig":
-      return updateTableConfig2(state, action);
-    default:
-      console.log(`unhandled action ${action.type}`);
-      return state;
-  }
-};
-var useTableModel = (tableConfigProp, dataSource) => {
-  const [state, dispatchTableModelAction] = useReducer(columnReducer, { tableConfig: tableConfigProp, dataSource }, init);
-  const { columns, headings, tableConfig, ...tableAttributes } = state;
-  return {
-    columns,
-    dispatchTableModelAction,
-    headings,
-    tableAttributes,
-    tableConfig
-  };
-};
-function init({ dataSource, tableConfig }) {
-  const { columns, ...tableAttributes } = tableConfig;
-  const { config: dataSourceConfig, tableSchema } = dataSource;
-  const runtimeColumns = columns.filter(subscribedOnly(dataSourceConfig == null ? void 0 : dataSourceConfig.columns)).map(
-    columnDescriptorToRuntimeColumDescriptor(tableAttributes, tableSchema)
-  );
-  const maybePinnedColumns = runtimeColumns.some(isPinned) ? sortPinnedColumns(runtimeColumns) : runtimeColumns;
-  let state = {
-    columns: maybePinnedColumns,
-    headings: getTableHeadings(maybePinnedColumns),
-    tableConfig,
-    ...tableAttributes
-  };
-  if (dataSourceConfig) {
-    const { columns: _, ...rest } = dataSourceConfig;
-    state = updateTableConfig2(state, {
-      type: "tableConfig",
-      ...rest
-    });
-  }
-  return state;
-}
-var getLabel = (label, columnFormatHeader) => {
-  if (columnFormatHeader === "uppercase") {
-    return label.toUpperCase();
-  } else if (columnFormatHeader === "capitalize") {
-    return label[0].toUpperCase() + label.slice(1).toLowerCase();
-  }
-  return label;
-};
-var columnDescriptorToRuntimeColumDescriptor = (tableAttributes, tableSchema) => (column, index) => {
-  const { columnDefaultWidth = DEFAULT_COLUMN_WIDTH, columnFormatHeader } = tableAttributes;
-  const serverDataType = getDataType(column, tableSchema);
-  const {
-    align = getDefaultAlignment(serverDataType),
-    name,
-    label = getColumnLabel(column),
-    width = columnDefaultWidth,
-    ...rest
-  } = column;
-  const runtimeColumnWithDefaults = {
-    ...rest,
-    align,
-    CellRenderer: getCellRenderer(column),
-    HeaderCellContentRenderer: getColumnHeaderContentRenderer(column),
-    HeaderCellLabelRenderer: getColumnHeaderLabelRenderer(column),
-    clientSideEditValidationCheck: hasValidationRules(column.type) ? buildValidationChecker(column.type.renderer.rules) : void 0,
-    index: index + 1,
-    label: getLabel(label, columnFormatHeader),
-    name,
-    originalIdx: index,
-    serverDataType,
-    valueFormatter: getValueFormatter(column, serverDataType),
-    width
-  };
-  if (isGroupColumn3(runtimeColumnWithDefaults)) {
-    runtimeColumnWithDefaults.columns = runtimeColumnWithDefaults.columns.map(
-      (col) => columnDescriptorToRuntimeColumDescriptor(tableAttributes)(col, index)
-    );
-  }
-  return runtimeColumnWithDefaults;
-};
-function moveColumn(state, { column, moveBy }) {
-  const { columns } = state;
-  if (typeof moveBy === "number") {
-    const idx = columns.indexOf(column);
-    const newColumns = columns.slice();
-    const [movedColumns] = newColumns.splice(idx, 1);
-    newColumns.splice(idx + moveBy, 0, movedColumns);
-    return {
-      ...state,
-      columns: newColumns
-    };
-  }
-  return state;
-}
-function hideColumns(state, { columns }) {
-  if (columns.some((col) => col.hidden !== true)) {
-    return columns.reduce((s, c) => {
-      if (c.hidden !== true) {
-        return updateColumnProp(s, {
-          type: "updateColumnProp",
-          column: c,
-          hidden: true
-        });
-      } else {
-        return s;
-      }
-    }, state);
-  } else {
-    return state;
-  }
-}
-function showColumns(state, { columns }) {
-  if (columns.some((col) => col.hidden)) {
-    return columns.reduce((s, c) => {
-      if (c.hidden) {
-        return updateColumnProp(s, {
-          type: "updateColumnProp",
-          column: c,
-          hidden: false
-        });
-      } else {
-        return s;
-      }
-    }, state);
-  } else {
-    return state;
-  }
-}
-function resizeColumn(state, { column, phase, width }) {
-  const type = "updateColumnProp";
-  const resizing = phase !== "end";
-  switch (phase) {
-    case "begin":
-      return updateColumnProp(state, { type, column, resizing });
-    case "end":
-      return updateColumnProp(state, { type, column, resizing, width });
-    case "resize":
-      return updateColumnProp(state, { type, column, width });
-    default:
-      throw Error(`useTableModel.resizeColumn, invalid resizePhase ${phase}`);
-  }
-}
-function setTableSchema(state, { tableSchema }) {
-  const { columns } = state;
-  if (columns.some(columnWithoutDataType)) {
-    const cols = columns.map((column) => {
-      var _a;
-      const serverDataType = getDataType(column, tableSchema);
-      return {
-        ...column,
-        align: (_a = column.align) != null ? _a : getDefaultAlignment(serverDataType),
-        serverDataType
-      };
-    });
-    return {
-      ...state,
-      columns: cols
-    };
-  } else {
-    return state;
-  }
-}
-function pinColumn2(state, action) {
-  let { columns } = state;
-  const { column, pin } = action;
-  const targetColumn = columns.find((col) => col.name === column.name);
-  if (targetColumn) {
-    columns = replaceColumn(columns, { ...targetColumn, pin });
-    columns = sortPinnedColumns(columns);
-    return {
-      ...state,
-      columns
-    };
-  } else {
-    return state;
-  }
-}
-function updateColumnProp(state, action) {
-  let { columns, tableConfig } = state;
-  const { align, column, hidden, label, resizing, width } = action;
-  const targetColumn = columns.find((col) => col.name === column.name);
-  if (targetColumn) {
-    if (align === "left" || align === "right") {
-      columns = replaceColumn(columns, { ...targetColumn, align });
-    }
-    if (typeof label === "string") {
-      columns = replaceColumn(columns, { ...targetColumn, label });
-    }
-    if (typeof resizing === "boolean") {
-      columns = replaceColumn(columns, { ...targetColumn, resizing });
-    }
-    if (typeof hidden === "boolean") {
-      columns = replaceColumn(columns, { ...targetColumn, hidden });
-    }
-    if (typeof width === "number") {
-      columns = replaceColumn(columns, { ...targetColumn, width });
-      const targetConfigColumn = tableConfig.columns.find(
-        (col) => col.name === column.name
-      );
-      if (targetConfigColumn) {
-        tableConfig = {
-          ...tableConfig,
-          columns: replaceColumn(tableConfig.columns, {
-            ...targetConfigColumn,
-            width
-          })
-        };
-      }
-    }
-  }
-  return {
-    ...state,
-    columns,
-    tableConfig
-  };
-}
-function updateTableConfig2(state, { confirmed, filter, groupBy, sort }) {
-  const hasGroupBy = groupBy !== void 0;
-  const hasFilter = typeof (filter == null ? void 0 : filter.filter) === "string";
-  const hasSort = sort && sort.sortDefs.length > 0;
-  let result = state;
-  if (hasGroupBy) {
-    result = {
-      ...state,
-      columns: applyGroupByToColumns(result.columns, groupBy, confirmed)
-    };
-  }
-  if (hasSort) {
-    result = {
-      ...state,
-      columns: applySortToColumns(result.columns, sort)
-    };
-  } else if (existingSort(result.columns)) {
-    result = {
-      ...state,
-      columns: removeSort(result.columns)
-    };
-  }
-  if (hasFilter) {
-    result = {
-      ...state,
-      columns: applyFilterToColumns(result.columns, filter)
-    };
-  } else if (result.columns.some(isFilteredColumn)) {
-    result = {
-      ...state,
-      columns: stripFilterFromColumns(result.columns)
-    };
-  }
-  return result;
-}
-
-// src/useTableScroll.ts
-import {
-  getColumnsInViewport,
-  getRowElementAtIndex as getRowElementAtIndex2,
-  itemsChanged
-} from "@vuu-ui/vuu-utils";
-import {
-  useCallback as useCallback15,
-  useEffect as useEffect3,
-  useImperativeHandle,
-  useMemo as useMemo5,
-  useRef as useRef10,
-  useState as useState4
-} from "react";
-var SCROLL_MOVE_CHECK_THRESHOLD = 100;
-var HORIZONTAL_SCROLL_BUFFER = 200;
-var getMaxScroll = (container) => {
-  const { clientHeight, clientWidth, scrollHeight, scrollWidth } = container;
-  return [scrollWidth - clientWidth, scrollHeight - clientHeight];
-};
-var getScrollDirection = (prevScrollPositions, scrollPos) => {
-  if (prevScrollPositions === void 0) {
-    return void 0;
-  } else {
-    const { scrollTop: prevTop } = prevScrollPositions;
-    return scrollPos > prevTop ? "fwd" : "bwd";
-  }
-};
-var getPctScroll = (container, currentScrollPos) => {
-  const {
-    clientHeight,
-    clientWidth,
-    scrollHeight,
-    scrollLeft,
-    scrollTop,
-    scrollWidth
-  } = container;
-  const maxScrollLeft = scrollWidth - clientWidth;
-  const pctScrollLeft = scrollLeft / (scrollWidth - clientWidth);
-  const maxScrollTop = scrollHeight - clientHeight;
-  let pctScrollTop = scrollTop / (scrollHeight - clientHeight);
-  const scrollDirection = getScrollDirection(currentScrollPos, scrollTop);
-  if (scrollDirection === "fwd" && pctScrollTop > 0.99) {
-    pctScrollTop = 1;
-  } else if (scrollDirection === "bwd" && pctScrollTop < 0.02) {
-    pctScrollTop = 0;
-  }
-  return [
-    scrollLeft,
-    pctScrollLeft,
-    maxScrollLeft,
-    scrollTop,
-    pctScrollTop,
-    maxScrollTop
-  ];
-};
-var noScrolling = {
-  scrollToIndex: () => void 0,
-  scrollToKey: () => void 0
-};
-var useCallbackRef = ({
-  onAttach,
-  onDetach
-}) => {
-  const ref = useRef10(null);
-  const callbackRef = useCallback15(
-    (el) => {
-      if (el) {
-        ref.current = el;
-        onAttach == null ? void 0 : onAttach(el);
-      } else if (ref.current) {
-        const { current: originalRef } = ref;
-        ref.current = el;
-        onDetach == null ? void 0 : onDetach(originalRef);
-      }
-    },
-    [onAttach, onDetach]
-  );
-  return callbackRef;
-};
-var useTableScroll = ({
-  columns,
-  getRowAtPosition,
-  onHorizontalScroll,
-  onVerticalScroll,
-  onVerticalScrollInSitu,
-  rowHeight,
-  scrollingApiRef,
-  setRange,
-  viewportMeasurements
-}) => {
-  const firstRowRef = useRef10(0);
-  const rowHeightRef = useRef10(rowHeight);
-  const contentContainerScrolledRef = useRef10(false);
-  const contentContainerPosRef = useRef10({
-    scrollTop: 0,
-    scrollLeft: 0
-  });
-  const scrollbarContainerScrolledRef = useRef10(false);
-  const scrollbarContainerPosRef = useRef10({
-    scrollTop: 0,
-    scrollLeft: 0
-  });
-  const scrollbarContainerRef = useRef10(null);
-  const contentContainerRef = useRef10(null);
-  const lastHorizontalScrollCheckPoint = useRef10(0);
-  const {
-    appliedPageSize,
-    isVirtualScroll,
-    rowCount: viewportRowCount,
-    totalHeaderHeight,
-    viewportWidth
-  } = viewportMeasurements;
-  const columnsWithinViewportRef = useRef10([]);
-  const [, forceRefresh] = useState4({});
-  const preSpanRef = useRef10(0);
-  useMemo5(() => {
-    const [visibleColumns, offset] = getColumnsInViewport(
-      columns,
-      contentContainerPosRef.current.scrollLeft,
-      contentContainerPosRef.current.scrollLeft + viewportWidth + HORIZONTAL_SCROLL_BUFFER
-    );
-    preSpanRef.current = offset;
-    columnsWithinViewportRef.current = visibleColumns;
-  }, [viewportWidth, columns]);
-  const handleHorizontalScroll = useCallback15(
-    (scrollLeft) => {
-      contentContainerPosRef.current.scrollLeft = scrollLeft;
-      onHorizontalScroll == null ? void 0 : onHorizontalScroll(scrollLeft);
-      if (Math.abs(scrollLeft - lastHorizontalScrollCheckPoint.current) > SCROLL_MOVE_CHECK_THRESHOLD) {
-        lastHorizontalScrollCheckPoint.current = scrollLeft;
-        const [visibleColumns, pre] = getColumnsInViewport(
-          columns,
-          scrollLeft,
-          scrollLeft + viewportWidth + HORIZONTAL_SCROLL_BUFFER
-        );
-        if (itemsChanged(columnsWithinViewportRef.current, visibleColumns)) {
-          preSpanRef.current = pre;
-          columnsWithinViewportRef.current = visibleColumns;
-          forceRefresh({});
-        }
-      }
-    },
-    [columns, onHorizontalScroll, viewportWidth]
-  );
-  const handleVerticalScroll = useCallback15(
-    (scrollTop, pctScrollTop) => {
-      contentContainerPosRef.current.scrollTop = scrollTop;
-      onVerticalScroll == null ? void 0 : onVerticalScroll(scrollTop, pctScrollTop);
-      const firstRow = getRowAtPosition(scrollTop);
-      if (firstRow !== firstRowRef.current) {
-        firstRowRef.current = firstRow;
-        setRange({ from: firstRow, to: firstRow + viewportRowCount });
-      }
-      onVerticalScrollInSitu == null ? void 0 : onVerticalScrollInSitu(0);
-    },
-    [
-      getRowAtPosition,
-      onVerticalScroll,
-      onVerticalScrollInSitu,
-      setRange,
-      viewportRowCount
-    ]
-  );
-  const handleScrollbarContainerScroll = useCallback15(() => {
-    const { current: contentContainer } = contentContainerRef;
-    const { current: scrollbarContainer } = scrollbarContainerRef;
-    const { current: contentContainerScrolled } = contentContainerScrolledRef;
-    const { current: scrollPos } = scrollbarContainerPosRef;
-    if (contentContainerScrolled) {
-      contentContainerScrolledRef.current = false;
-    } else if (contentContainer && scrollbarContainer) {
-      scrollbarContainerScrolledRef.current = true;
-      const [scrollLeft, pctScrollLeft, , scrollTop, pctScrollTop] = getPctScroll(scrollbarContainer, scrollPos);
-      scrollPos.scrollLeft = scrollLeft;
-      scrollPos.scrollTop = scrollTop;
-      const [maxScrollLeft, maxScrollTop] = getMaxScroll(scrollbarContainer);
-      const contentScrollLeft = Math.round(pctScrollLeft * maxScrollLeft);
-      const contentScrollTop = pctScrollTop * maxScrollTop;
-      contentContainer.scrollTo({
-        left: contentScrollLeft,
-        top: contentScrollTop,
-        behavior: "auto"
-      });
-    }
-    onVerticalScrollInSitu == null ? void 0 : onVerticalScrollInSitu(0);
-  }, [onVerticalScrollInSitu]);
-  const handleContentContainerScroll = useCallback15(() => {
-    const { current: scrollbarContainerScrolled } = scrollbarContainerScrolledRef;
-    const { current: contentContainer } = contentContainerRef;
-    const { current: scrollbarContainer } = scrollbarContainerRef;
-    const { current: scrollPos } = contentContainerPosRef;
-    if (contentContainer && scrollbarContainer) {
-      const [
-        scrollLeft,
-        pctScrollLeft,
-        maxScrollLeft,
-        scrollTop,
-        pctScrollTop,
-        maxScrollTop
-      ] = getPctScroll(contentContainer);
-      contentContainerScrolledRef.current = true;
-      if (scrollbarContainerScrolled) {
-        scrollbarContainerScrolledRef.current = false;
-      } else {
-        scrollbarContainer.scrollLeft = Math.round(
-          pctScrollLeft * maxScrollLeft
-        );
-        scrollbarContainer.scrollTop = pctScrollTop * maxScrollTop;
-      }
-      if (scrollPos.scrollTop !== scrollTop) {
-        handleVerticalScroll(scrollTop, pctScrollTop);
-      }
-      if (scrollPos.scrollLeft !== scrollLeft) {
-        handleHorizontalScroll(scrollLeft);
-      }
-    }
-  }, [handleVerticalScroll, handleHorizontalScroll]);
-  const handleAttachScrollbarContainer = useCallback15(
-    (el) => {
-      scrollbarContainerRef.current = el;
-      el.addEventListener("scroll", handleScrollbarContainerScroll, {
-        passive: true
-      });
-    },
-    [handleScrollbarContainerScroll]
-  );
-  const handleDetachScrollbarContainer = useCallback15(
-    (el) => {
-      scrollbarContainerRef.current = null;
-      el.removeEventListener("scroll", handleScrollbarContainerScroll);
-    },
-    [handleScrollbarContainerScroll]
-  );
-  const handleAttachContentContainer = useCallback15(
-    (el) => {
-      contentContainerRef.current = el;
-      el.addEventListener("scroll", handleContentContainerScroll, {
-        passive: true
-      });
-    },
-    [handleContentContainerScroll]
-  );
-  const handleDetachContentContainer = useCallback15(
-    (el) => {
-      contentContainerRef.current = null;
-      el.removeEventListener("scroll", handleContentContainerScroll);
-    },
-    [handleContentContainerScroll]
-  );
-  const contentContainerCallbackRef = useCallbackRef({
-    onAttach: handleAttachContentContainer,
-    onDetach: handleDetachContentContainer
-  });
-  const scrollbarContainerCallbackRef = useCallbackRef({
-    onAttach: handleAttachScrollbarContainer,
-    onDetach: handleDetachScrollbarContainer
-  });
-  const requestScroll = useCallback15(
-    (scrollRequest) => {
-      const { current: contentContainer } = contentContainerRef;
-      if (contentContainer) {
-        const [maxScrollLeft, maxScrollTop] = getMaxScroll(contentContainer);
-        const { scrollLeft, scrollTop } = contentContainer;
-        contentContainerScrolledRef.current = false;
-        if (scrollRequest.type === "scroll-row") {
-          const activeRow = getRowElementAtIndex2(
-            contentContainer,
-            scrollRequest.rowIndex
-          );
-          if (activeRow !== null) {
-            const [direction, distance] = howFarIsRowOutsideViewport(
-              activeRow,
-              totalHeaderHeight
-            );
-            console.log(`outside viewport ? ${direction} ${distance}`);
-            if (direction && distance) {
-              if (isVirtualScroll) {
-                const offset = direction === "down" ? 1 : -1;
-                onVerticalScrollInSitu == null ? void 0 : onVerticalScrollInSitu(offset);
-                const firstRow = firstRowRef.current + offset;
-                firstRowRef.current = firstRow;
-                setRange({
-                  from: firstRow,
-                  to: firstRow + viewportRowCount
-                });
-              } else {
-                let newScrollLeft = scrollLeft;
-                let newScrollTop = scrollTop;
-                if (direction === "up" || direction === "down") {
-                  newScrollTop = Math.min(
-                    Math.max(0, scrollTop + distance),
-                    maxScrollTop
-                  );
-                } else {
-                  newScrollLeft = Math.min(
-                    Math.max(0, scrollLeft + distance),
-                    maxScrollLeft
-                  );
-                }
-                contentContainer.scrollTo({
-                  top: newScrollTop,
-                  left: newScrollLeft,
-                  behavior: "smooth"
-                });
-              }
-            }
-          }
-        } else if (scrollRequest.type === "scroll-page") {
-          const { direction } = scrollRequest;
-          if (isVirtualScroll) {
-            const offset = direction === "down" ? viewportRowCount : -viewportRowCount;
-            onVerticalScrollInSitu == null ? void 0 : onVerticalScrollInSitu(offset);
-            const firstRow = firstRowRef.current + offset;
-            firstRowRef.current = firstRow;
-            setRange({ from: firstRow, to: firstRow + viewportRowCount });
-          } else {
-            const scrollBy = direction === "down" ? appliedPageSize : -appliedPageSize;
-            const newScrollTop = Math.min(
-              Math.max(0, scrollTop + scrollBy),
-              maxScrollTop
-            );
-            contentContainer.scrollTo({
-              top: newScrollTop,
-              left: scrollLeft,
-              behavior: "auto"
-            });
-          }
-        } else if (scrollRequest.type === "scroll-end") {
-          const { direction } = scrollRequest;
-          const scrollTo = direction === "end" ? maxScrollTop : 0;
-          contentContainer.scrollTo({
-            top: scrollTo,
-            left: contentContainer.scrollLeft,
-            behavior: "auto"
-          });
-        }
-      }
-    },
-    [
-      appliedPageSize,
-      isVirtualScroll,
-      onVerticalScrollInSitu,
-      setRange,
-      totalHeaderHeight,
-      viewportRowCount
-    ]
-  );
-  const scrollHandles = useMemo5(
-    // TODO not complete yet
-    () => ({
-      scrollToIndex: (rowIndex) => {
-        if (scrollbarContainerRef.current) {
-          const scrollPos = (rowIndex - 30) * 20;
-          scrollbarContainerRef.current.scrollTop = scrollPos;
-        }
-      },
-      scrollToKey: (rowKey) => {
-        console.log(`scrollToKey ${rowKey}`);
-      }
-    }),
-    []
-  );
-  useImperativeHandle(
-    scrollingApiRef,
-    () => {
-      if (scrollbarContainerRef.current) {
-        return scrollHandles;
-      } else {
-        return noScrolling;
-      }
-    },
-    [scrollHandles]
-  );
-  useEffect3(() => {
-    if (rowHeight !== rowHeightRef.current) {
-      rowHeightRef.current = rowHeight;
-      if (contentContainerPosRef.current.scrollTop > 0) {
-        if (contentContainerRef.current) {
-          contentContainerRef.current.scrollTop = 0;
-        }
-      }
-    } else {
-      const { current: from } = firstRowRef;
-      const rowRange = { from, to: from + viewportRowCount };
-      setRange(rowRange);
-    }
-  }, [rowHeight, setRange, viewportRowCount]);
-  return {
-    columnsWithinViewport: columnsWithinViewportRef.current,
-    /** Ref to be assigned to ScrollbarContainer */
-    scrollbarContainerRef: scrollbarContainerCallbackRef,
-    /** Ref to be assigned to ContentContainer */
-    contentContainerRef: contentContainerCallbackRef,
-    /** Scroll the table  */
-    requestScroll,
-    /** number of leading columns not rendered because of virtualization  */
-    virtualColSpan: preSpanRef.current
-  };
-};
-
-// src/useTableViewport.ts
-import {
-  actualRowPositioning,
-  measurePinnedColumns,
-  virtualRowPositioning
-} from "@vuu-ui/vuu-utils";
-import { useCallback as useCallback16, useMemo as useMemo6, useRef as useRef11 } from "react";
-var MAX_PIXEL_HEIGHT = 1e7;
-var UNMEASURED_VIEWPORT = {
-  appliedPageSize: 0,
-  contentHeight: 0,
-  contentWidth: 0,
-  getRowAtPosition: () => -1,
-  getRowOffset: () => -1,
-  horizontalScrollbarHeight: 0,
-  isVirtualScroll: false,
-  pinnedWidthLeft: 0,
-  pinnedWidthRight: 0,
-  rowCount: 0,
-  setInSituRowOffset: () => void 0,
-  setScrollTop: () => void 0,
-  totalHeaderHeight: 0,
-  verticalScrollbarWidth: 0,
-  viewportBodyHeight: 0,
-  viewportWidth: 0
-};
-var useTableViewport = ({
-  columns,
-  headerHeight,
-  headings,
-  rowCount,
-  rowHeight,
-  selectionEndSize = 4,
-  size
-}) => {
-  const inSituRowOffsetRef = useRef11(0);
-  const pctScrollTopRef = useRef11(0);
-  const pixelContentHeight = Math.min(rowHeight * rowCount, MAX_PIXEL_HEIGHT);
-  const virtualContentHeight = rowCount * rowHeight;
-  const virtualisedExtent = virtualContentHeight - pixelContentHeight;
-  const { pinnedWidthLeft, pinnedWidthRight, unpinnedWidth } = useMemo6(
-    () => measurePinnedColumns(columns, selectionEndSize),
-    [columns, selectionEndSize]
-  );
-  const totalHeaderHeightRef = useRef11(headerHeight);
-  useMemo6(() => {
-    totalHeaderHeightRef.current = headerHeight * (1 + headings.length);
-  }, [headerHeight, headings.length]);
-  const [getRowOffset, getRowAtPosition, isVirtualScroll] = useMemo6(() => {
-    if (virtualisedExtent) {
-      const [_getRowOffset, getRowAtPosition2, _isVirtual] = virtualRowPositioning(rowHeight, virtualisedExtent, pctScrollTopRef);
-      const getOffset = (row) => {
-        return _getRowOffset(row, inSituRowOffsetRef.current);
-      };
-      return [getOffset, getRowAtPosition2, _isVirtual];
-    } else {
-      return actualRowPositioning(rowHeight);
-    }
-  }, [virtualisedExtent, rowHeight]);
-  const setScrollTop = useCallback16((_, scrollPct) => {
-    pctScrollTopRef.current = scrollPct;
-  }, []);
-  const setInSituRowOffset = useCallback16((rowIndexOffset) => {
-    if (rowIndexOffset === 0) {
-      inSituRowOffsetRef.current = 0;
-    } else {
-      inSituRowOffsetRef.current = Math.max(
-        0,
-        inSituRowOffsetRef.current + rowIndexOffset
-      );
-    }
-  }, []);
-  return useMemo6(() => {
-    if (size) {
-      const { current: totalHeaderHeight } = totalHeaderHeightRef;
-      const scrollbarSize = 15;
-      const contentWidth = pinnedWidthLeft + unpinnedWidth + pinnedWidthRight;
-      const horizontalScrollbarHeight = contentWidth > size.width ? scrollbarSize : 0;
-      const visibleRows = (size.height - headerHeight) / rowHeight;
-      const count = Number.isInteger(visibleRows) ? visibleRows : Math.ceil(visibleRows);
-      const viewportBodyHeight = size.height - totalHeaderHeight;
-      const verticalScrollbarWidth = pixelContentHeight > viewportBodyHeight ? scrollbarSize : 0;
-      const appliedPageSize = count * rowHeight * (pixelContentHeight / virtualContentHeight);
-      const viewportWidth = size.width;
-      return {
-        appliedPageSize,
-        contentHeight: pixelContentHeight,
-        contentWidth,
-        getRowAtPosition,
-        getRowOffset,
-        isVirtualScroll,
-        horizontalScrollbarHeight,
-        pinnedWidthLeft,
-        pinnedWidthRight,
-        rowCount: count,
-        setInSituRowOffset,
-        setScrollTop,
-        totalHeaderHeight,
-        verticalScrollbarWidth,
-        viewportBodyHeight,
-        viewportWidth
-      };
-    } else {
-      return UNMEASURED_VIEWPORT;
-    }
-  }, [
-    getRowAtPosition,
-    getRowOffset,
-    headerHeight,
-    isVirtualScroll,
-    pinnedWidthLeft,
-    unpinnedWidth,
-    pinnedWidthRight,
-    pixelContentHeight,
-    rowHeight,
-    setInSituRowOffset,
-    setScrollTop,
-    size,
-    virtualContentHeight
-  ]);
-};
-
-// src/useTableAndColumnSettings.ts
-import { useLayoutProviderDispatch } from "@vuu-ui/vuu-layout";
-import { getCalculatedColumnType } from "@vuu-ui/vuu-utils";
-import { useCallback as useCallback17, useRef as useRef12, useState as useState5 } from "react";
-var useTableAndColumnSettings = ({
-  availableColumns: availableColumnsProps,
-  onAvailableColumnsChange,
-  onConfigChange,
-  onCreateCalculatedColumn,
-  onDataSourceConfigChange,
-  tableConfig
-}) => {
-  const dispatchLayoutAction = useLayoutProviderDispatch();
-  const showTableSettingsRef = useRef12();
-  const [availableColumns, setAvailableColumns] = useState5(
-    availableColumnsProps
-  );
-  const showContextPanel = useCallback17(
-    (componentType, title, props) => {
-      dispatchLayoutAction({
-        type: "set-props",
-        path: "#context-panel",
-        props: {
-          expanded: true,
-          content: {
-            type: componentType,
-            props
-          },
-          title
-        }
-      });
-    },
-    [dispatchLayoutAction]
-  );
-  const handleCancelCreateColumn = useCallback17(() => {
-    requestAnimationFrame(() => {
-      var _a;
-      (_a = showTableSettingsRef.current) == null ? void 0 : _a.call(showTableSettingsRef);
-    });
-  }, []);
-  const handleCreateCalculatedColumn = useCallback17(
-    (column) => {
-      const newAvailableColumns = availableColumns.concat({
-        name: column.name,
-        serverDataType: getCalculatedColumnType(column)
-      });
-      setAvailableColumns(newAvailableColumns);
-      onAvailableColumnsChange == null ? void 0 : onAvailableColumnsChange(newAvailableColumns);
-      requestAnimationFrame(() => {
-        var _a;
-        (_a = showTableSettingsRef.current) == null ? void 0 : _a.call(showTableSettingsRef);
-      });
-      onCreateCalculatedColumn(column);
-    },
-    [availableColumns, onAvailableColumnsChange, onCreateCalculatedColumn]
-  );
-  const showColumnSettingsPanel = useCallback17(
-    (action) => {
-      showContextPanel("ColumnSettings", "Column Settings", {
-        column: action.column,
-        onCancelCreateColumn: handleCancelCreateColumn,
-        onConfigChange,
-        onCreateCalculatedColumn: handleCreateCalculatedColumn,
-        tableConfig,
-        vuuTable: action.vuuTable
-      });
-    },
-    [
-      handleCancelCreateColumn,
-      handleCreateCalculatedColumn,
-      onConfigChange,
-      showContextPanel,
-      tableConfig
-    ]
-  );
-  const handleAddCalculatedColumn = useCallback17(() => {
-    showColumnSettingsPanel({
-      column: {
-        name: "::",
-        serverDataType: "string"
-      },
-      type: "columnSettings",
-      vuuTable: { module: "SIMUL", table: "instruments" }
-    });
-  }, [showColumnSettingsPanel]);
-  const handleNavigateToColumn = useCallback17(
-    (columnName) => {
-      const column = tableConfig.columns.find((c) => c.name === columnName);
-      if (column) {
-        showColumnSettingsPanel({
-          type: "columnSettings",
-          column,
-          //TODO where do we get this from
-          vuuTable: { module: "SIMUL", table: "instruments" }
-        });
-      }
-    },
-    [showColumnSettingsPanel, tableConfig.columns]
-  );
-  showTableSettingsRef.current = useCallback17(() => {
-    showContextPanel("TableSettings", "DataGrid Settings", {
-      availableColumns: availableColumns != null ? availableColumns : tableConfig.columns.map(({ name, serverDataType }) => ({
-        name,
-        serverDataType
-      })),
-      onAddCalculatedColumn: handleAddCalculatedColumn,
-      onConfigChange,
-      onDataSourceConfigChange,
-      onNavigateToColumn: handleNavigateToColumn,
-      tableConfig
-    });
-  }, [
-    availableColumns,
-    handleAddCalculatedColumn,
-    handleNavigateToColumn,
-    onConfigChange,
-    onDataSourceConfigChange,
-    showContextPanel,
-    tableConfig
-  ]);
-  return {
-    showColumnSettingsPanel,
-    showTableSettingsPanel: showTableSettingsRef.current
-  };
-};
-
-// src/useRowClassNameGenerators.ts
-import {
-  getRowClassNameGenerator
-} from "@vuu-ui/vuu-utils";
-import { useMemo as useMemo7 } from "react";
-var createClassNameGenerator = (ids) => {
-  const functions = [];
-  ids == null ? void 0 : ids.forEach((id) => {
-    const fn = getRowClassNameGenerator(id);
-    if (fn) {
-      functions.push(fn.fn);
-    }
-  });
-  return (row, columnMap) => {
-    const classNames = [];
-    functions == null ? void 0 : functions.forEach((fn) => {
-      const className = fn(row, columnMap);
-      if (className) {
-        classNames.push(className);
-      }
-    });
-    return classNames.join(" ");
-  };
-};
-var useRowClassNameGenerators = ({
-  rowClassNameGenerators
-}) => {
-  return useMemo7(() => {
-    return createClassNameGenerator(rowClassNameGenerators);
-  }, [rowClassNameGenerators]);
-};
-
-// src/useTable.ts
-var stripInternalProperties = (tableConfig) => {
-  return tableConfig;
-};
-var { KEY, IS_EXPANDED: IS_EXPANDED2, IS_LEAF: IS_LEAF2 } = metadataKeys5;
-var NULL_DRAG_DROP = {
-  draggable: void 0,
-  onMouseDown: void 0
-};
-var useNullDragDrop = () => NULL_DRAG_DROP;
-var addColumn = (tableConfig, column) => ({
-  ...tableConfig,
-  columns: tableConfig.columns.concat(column)
-});
-var useTable = ({
-  allowDragDrop = false,
-  availableColumns,
-  config,
-  containerRef,
-  dataSource,
-  disableFocus,
-  headerHeight = 25,
-  highlightedIndex: highlightedIndexProp,
-  id,
-  navigationStyle = "cell",
-  onAvailableColumnsChange,
-  onConfigChange,
-  onDragStart,
-  onDrop,
-  onFeatureInvocation,
-  onHighlight,
-  onRowClick: onRowClickProp,
-  onSelect,
-  onSelectionChange,
-  renderBufferSize = 0,
-  rowHeight = 20,
-  scrollingApiRef,
-  selectionModel,
-  size
-}) => {
-  const [rowCount, setRowCount] = useState6(dataSource.size);
-  if (dataSource === void 0) {
-    throw Error("no data source provided to Vuu Table");
-  }
-  const rowClassNameGenerator = useRowClassNameGenerators(config);
-  const useRowDragDrop = allowDragDrop ? useDragDrop2 : useNullDragDrop;
-  const menuBuilder = useMemo8(
-    () => buildContextMenuDescriptors(dataSource),
-    [dataSource]
-  );
-  const onDataRowcountChange = useCallback18((size2) => {
-    setRowCount(size2);
-  }, []);
-  const {
-    columns,
-    dispatchTableModelAction,
-    headings,
-    tableAttributes,
-    tableConfig
-  } = useTableModel(config, dataSource);
-  useLayoutEffectSkipFirst2(() => {
-    dispatchTableModelAction({
-      type: "init",
-      tableConfig: config,
-      dataSource
-    });
-  }, [config, dataSource, dispatchTableModelAction]);
-  const applyTableConfigChange = useCallback18(
-    (config2) => {
-      dispatchTableModelAction({
-        type: "init",
-        tableConfig: config2,
-        dataSource
-      });
-      onConfigChange == null ? void 0 : onConfigChange(stripInternalProperties(config2));
-    },
-    [dataSource, dispatchTableModelAction, onConfigChange]
-  );
-  const columnMap = useMemo8(
-    () => buildColumnMap2(dataSource.columns),
-    [dataSource.columns]
-  );
-  const onSubscribed = useCallback18(
-    ({ tableSchema }) => {
-      if (tableSchema) {
-        dispatchTableModelAction({
-          type: "setTableSchema",
-          tableSchema
-        });
-      } else {
-        console.log("subscription message with no schema");
-      }
-    },
-    [dispatchTableModelAction]
-  );
-  const {
-    getRowAtPosition,
-    getRowOffset,
-    setInSituRowOffset: viewportHookSetInSituRowOffset,
-    setScrollTop: viewportHookSetScrollTop,
-    ...viewportMeasurements
-  } = useTableViewport({
-    columns,
-    headerHeight,
-    headings,
-    rowCount,
-    rowHeight,
-    size
-  });
-  const initialRange = useInitialValue({
-    from: 0,
-    to: viewportMeasurements.rowCount
-  });
-  const { data, dataRef, getSelectedRows, range, setRange } = useDataSource({
-    dataSource,
-    // We need to factor this out of Table
-    onFeatureInvocation,
-    renderBufferSize,
-    onSizeChange: onDataRowcountChange,
-    onSubscribed,
-    range: initialRange
-  });
-  const { requestScroll, ...scrollProps } = useTableScroll({
-    columns,
-    getRowAtPosition,
-    rowHeight,
-    scrollingApiRef,
-    setRange,
-    onVerticalScroll: viewportHookSetScrollTop,
-    onVerticalScrollInSitu: viewportHookSetInSituRowOffset,
-    viewportMeasurements
-  });
-  const handleConfigEditedInSettingsPanel = useCallback18(
-    (tableConfig2) => {
-      dispatchTableModelAction({
-        type: "init",
-        tableConfig: tableConfig2,
-        dataSource
-      });
-      onConfigChange == null ? void 0 : onConfigChange(stripInternalProperties(tableConfig2));
-    },
-    [dataSource, dispatchTableModelAction, onConfigChange]
-  );
-  const handleDataSourceConfigChanged = useCallback18(
-    (dataSourceConfig) => {
-      dataSource.config = {
-        ...dataSource.config,
-        ...dataSourceConfig
-      };
-    },
-    [dataSource]
-  );
-  useEffect4(() => {
-    dataSource.on("config", (config2, confirmed, changes) => {
-      const scrollSensitiveChanges = (changes == null ? void 0 : changes.filterChanged) || (changes == null ? void 0 : changes.groupByChanged);
-      if (scrollSensitiveChanges && dataSource.range.from > 0) {
-        requestScroll({
-          type: "scroll-end",
-          direction: "home"
-        });
-      }
-      dispatchTableModelAction({
-        type: "tableConfig",
-        ...config2,
-        confirmed
-      });
-    });
-  }, [dataSource, dispatchTableModelAction, requestScroll]);
-  const handleCreateCalculatedColumn = useCallback18(
-    (column) => {
-      dataSource.columns = dataSource.columns.concat(column.name);
-      applyTableConfigChange(addColumn(tableConfig, column));
-    },
-    [dataSource, tableConfig, applyTableConfigChange]
-  );
-  const hideColumns2 = useCallback18(
-    (action) => {
-      const { columns: columns2 } = action;
-      const hiddenColumns = columns2.map((c) => c.name);
-      const newTableConfig = {
-        ...tableConfig,
-        columns: tableConfig.columns.map(
-          (col) => hiddenColumns.includes(col.name) ? { ...col, hidden: true } : col
-        )
-      };
-      applyTableConfigChange(newTableConfig);
-    },
-    [tableConfig, applyTableConfigChange]
-  );
-  const pinColumn3 = useCallback18(
-    (action) => {
-      applyTableConfigChange({
-        ...tableConfig,
-        columns: updateColumn(tableConfig.columns, {
-          ...action.column,
-          pin: action.pin
-        })
-      });
-    },
-    [tableConfig, applyTableConfigChange]
-  );
-  const { showColumnSettingsPanel, showTableSettingsPanel } = useTableAndColumnSettings({
-    availableColumns: availableColumns != null ? availableColumns : tableConfig.columns.map(({ name, serverDataType = "string" }) => ({
-      name,
-      serverDataType
-    })),
-    onAvailableColumnsChange,
-    onConfigChange: handleConfigEditedInSettingsPanel,
-    onCreateCalculatedColumn: handleCreateCalculatedColumn,
-    onDataSourceConfigChange: handleDataSourceConfigChanged,
-    tableConfig
-  });
-  const onPersistentColumnOperation = useCallback18(
-    (action) => {
-      if (isShowColumnSettings(action)) {
-        showColumnSettingsPanel(action);
-      } else if (isShowTableSettings(action)) {
-        showTableSettingsPanel();
-      } else {
-        switch (action.type) {
-          case "hideColumns":
-            return hideColumns2(action);
-          case "pinColumn":
-            return pinColumn3(action);
-          default:
-            dispatchTableModelAction(action);
-        }
-      }
-    },
-    [
-      dispatchTableModelAction,
-      hideColumns2,
-      pinColumn3,
-      showColumnSettingsPanel,
-      showTableSettingsPanel
-    ]
-  );
-  const handleContextMenuAction = useHandleTableContextMenu({
-    dataSource,
-    onPersistentColumnOperation
-  });
-  const handleSort = useCallback18(
-    (column, extendSort = false, sortType) => {
-      if (dataSource) {
-        dataSource.sort = toggleOrApplySort(
-          dataSource.sort,
-          column,
-          extendSort,
-          sortType
-        );
-      }
-    },
-    [dataSource]
-  );
-  const resizeCells = useRef13();
-  const onResizeColumn = useCallback18(
-    (phase, columnName, width) => {
-      var _a, _b, _c;
-      const column = columns.find((column2) => column2.name === columnName);
-      if (column) {
-        if (phase === "resize") {
-          (_a = resizeCells.current) == null ? void 0 : _a.forEach((cell) => {
-            cell.style.width = `${width}px`;
-          });
-        } else if (phase === "end") {
-          resizeCells.current = void 0;
-          if (isValidNumber(width)) {
-            dispatchTableModelAction({
-              type: "resizeColumn",
-              phase,
-              column,
-              width
-            });
-            onConfigChange == null ? void 0 : onConfigChange(
-              stripInternalProperties(
-                updateTableConfig(tableConfig, {
-                  type: "col-size",
-                  column,
-                  width
-                })
-              )
-            );
-          }
-        } else {
-          const byColIndex = `[aria-colindex='${column.index}']`;
-          resizeCells.current = Array.from(
-            (_c = (_b = containerRef.current) == null ? void 0 : _b.querySelectorAll(
-              `.vuuTableCell${byColIndex},.vuuTableHeaderCell${byColIndex}`
-            )) != null ? _c : []
-          );
-          dispatchTableModelAction({
-            type: "resizeColumn",
-            phase,
-            column,
-            width
-          });
-        }
-      } else {
-        throw Error(
-          `useDataTable.handleColumnResize, column ${columnName} not found`
-        );
-      }
-    },
-    [
-      columns,
-      dispatchTableModelAction,
-      onConfigChange,
-      tableConfig,
-      containerRef
-    ]
-  );
-  const onToggleGroup = useCallback18(
-    (row, column) => {
-      var _a, _b;
-      const isJson = isJsonGroup2(column, row, columnMap);
-      const key = row[KEY];
-      if (row[IS_EXPANDED2]) {
-        dataSource.closeTreeNode(key, true);
-        if (isJson) {
-          const idx = columns.indexOf(column);
-          const rows = (_a = dataSource.getRowsAtDepth) == null ? void 0 : _a.call(dataSource, idx + 1);
-          if (rows && !rows.some((row2) => row2[IS_EXPANDED2] || row2[IS_LEAF2])) {
-            dispatchTableModelAction({
-              type: "hideColumns",
-              columns: columns.slice(idx + 2)
-            });
-          }
-        }
-      } else {
-        dataSource.openTreeNode(key);
-        if (isJson) {
-          const childRows = (_b = dataSource.getChildRows) == null ? void 0 : _b.call(dataSource, key);
-          const idx = columns.indexOf(column) + 1;
-          const columnsToShow = [columns[idx]];
-          if (childRows && childRows.some((row2) => row2[IS_LEAF2])) {
-            columnsToShow.push(columns[idx + 1]);
-          }
-          if (columnsToShow.some((col) => col.hidden)) {
-            dispatchTableModelAction({
-              type: "showColumns",
-              columns: columnsToShow
-            });
-          }
-        }
-      }
-    },
-    [columnMap, columns, dataSource, dispatchTableModelAction]
-  );
-  const {
-    highlightedIndexRef,
-    navigate,
-    onFocus: navigationFocus,
-    onKeyDown: navigationKeyDown,
-    ...containerProps
-  } = useKeyboardNavigation({
-    columnCount: columns.filter((c) => c.hidden !== true).length,
-    containerRef,
-    disableFocus,
-    highlightedIndex: highlightedIndexProp,
-    navigationStyle,
-    requestScroll,
-    rowCount: dataSource == null ? void 0 : dataSource.size,
-    onHighlight,
-    viewportRange: range,
-    viewportRowCount: viewportMeasurements.rowCount
-  });
-  const {
-    onBlur: editingBlur,
-    onDoubleClick: editingDoubleClick,
-    onKeyDown: editingKeyDown,
-    onFocus: editingFocus
-  } = useCellEditing({
-    navigate
-  });
-  const handleFocus = useCallback18(
-    (e) => {
-      navigationFocus();
-      if (!e.defaultPrevented) {
-        editingFocus(e);
-      }
-    },
-    [editingFocus, navigationFocus]
-  );
-  const onContextMenu = useTableContextMenu({
-    columns,
-    data,
-    dataSource,
-    getSelectedRows
-  });
-  const onMoveGroupColumn = useCallback18(
-    (columns2) => {
-      dataSource.groupBy = columns2.map((col) => col.name);
-    },
-    [dataSource]
-  );
-  const onRemoveGroupColumn = useCallback18(
-    (column) => {
-      if (isGroupColumn4(column)) {
-        dataSource.groupBy = [];
-      } else {
-        if (dataSource && dataSource.groupBy.includes(column.name)) {
-          dataSource.groupBy = dataSource.groupBy.filter(
-            (columnName) => columnName !== column.name
-          );
-        }
-      }
-    },
-    [dataSource]
-  );
-  const handleSelectionChange = useCallback18(
-    (selected) => {
-      dataSource.select(selected);
-      onSelectionChange == null ? void 0 : onSelectionChange(selected);
-    },
-    [dataSource, onSelectionChange]
-  );
-  const handleSelect = useCallback18(
-    (row) => {
-      if (onSelect) {
-        onSelect(row === null ? null : asDataSourceRowObject(row, columnMap));
-      }
-    },
-    [columnMap, onSelect]
-  );
-  const {
-    onKeyDown: selectionHookKeyDown,
-    onRowClick: selectionHookOnRowClick
-  } = useSelection({
-    highlightedIndexRef,
-    onSelect: handleSelect,
-    onSelectionChange: handleSelectionChange,
-    selectionModel
-  });
-  const handleRowClick = useCallback18(
-    (evt, row, rangeSelect, keepExistingSelection) => {
-      selectionHookOnRowClick(evt, row, rangeSelect, keepExistingSelection);
-      onRowClickProp == null ? void 0 : onRowClickProp(evt, asDataSourceRowObject(row, columnMap));
-    },
-    [columnMap, onRowClickProp, selectionHookOnRowClick]
-  );
-  const handleKeyDown = useCallback18(
-    (e) => {
-      navigationKeyDown(e);
-      if (!e.defaultPrevented) {
-        editingKeyDown(e);
-      }
-      if (!e.defaultPrevented) {
-        selectionHookKeyDown(e);
-      }
-    },
-    [navigationKeyDown, editingKeyDown, selectionHookKeyDown]
-  );
-  const onMoveColumn = useCallback18(
-    (columns2) => {
-      const newTableConfig = {
-        ...tableConfig,
-        columns: columns2
-      };
-      dispatchTableModelAction({
-        type: "init",
-        tableConfig: newTableConfig,
-        dataSource
-      });
-      onConfigChange == null ? void 0 : onConfigChange(stripInternalProperties(newTableConfig));
-    },
-    [dataSource, dispatchTableModelAction, onConfigChange, tableConfig]
-  );
-  const handleDropRow = useCallback18(
-    (dragDropState) => {
-      onDrop == null ? void 0 : onDrop(dragDropState);
-    },
-    [onDrop]
-  );
-  const handleDataEdited = useCallback18(
-    async (row, columnName, value) => dataSource.applyEdit(row, columnName, value),
-    [dataSource]
-  );
-  const handleDragStartRow = useCallback18(
-    (dragDropState) => {
-      const { initialDragElement } = dragDropState;
-      const rowIndex = getIndexFromRowElement3(initialDragElement);
-      const row = dataRef.current.find((row2) => row2[0] === rowIndex);
-      if (row) {
-        dragDropState.setPayload(row);
-      } else {
-      }
-      onDragStart == null ? void 0 : onDragStart(dragDropState);
-    },
-    [dataRef, onDragStart]
-  );
-  const { onMouseDown: rowDragMouseDown, draggable: draggableRow } = useRowDragDrop({
-    allowDragDrop,
-    containerRef,
-    draggableClassName: `vuuTable`,
-    id,
-    onDragStart: handleDragStartRow,
-    onDrop: handleDropRow,
-    orientation: "vertical",
-    itemQuery: ".vuuTableRow"
-  });
-  return {
-    ...containerProps,
-    "aria-rowcount": dataSource.size,
-    rowClassNameGenerator,
-    draggableRow,
-    onBlur: editingBlur,
-    onDoubleClick: editingDoubleClick,
-    onFocus: handleFocus,
-    onKeyDown: handleKeyDown,
-    onMouseDown: rowDragMouseDown,
-    columnMap,
-    columns,
-    data,
-    getRowOffset,
-    handleContextMenuAction,
-    headings,
-    highlightedIndex: highlightedIndexRef.current,
-    menuBuilder,
-    onContextMenu,
-    onDataEdited: handleDataEdited,
-    onMoveColumn,
-    onMoveGroupColumn,
-    onRemoveGroupColumn,
-    onRowClick: handleRowClick,
-    onSortColumn: handleSort,
-    onResizeColumn,
-    onToggleGroup,
-    scrollProps,
-    // TODO don't think we need these ...
-    tableAttributes,
-    tableConfig,
-    viewportMeasurements
-  };
-};
-
-// src/useRowHeight.ts
-import { isValidNumber as isValidNumber2 } from "@vuu-ui/vuu-utils";
-import { useCallback as useCallback19, useMemo as useMemo9, useRef as useRef14, useState as useState7 } from "react";
-var useRowHeight = ({
-  rowHeight: rowHeightProp = 0
-}) => {
-  const [rowHeight, setRowHeight] = useState7(rowHeightProp);
-  const heightRef = useRef14(rowHeight);
-  const resizeObserver = useMemo9(() => {
-    return new ResizeObserver((entries) => {
-      for (const entry of entries) {
-        const [{ blockSize: measuredSize }] = entry.borderBoxSize;
-        const newHeight = Math.round(measuredSize);
-        if (isValidNumber2(newHeight) && heightRef.current !== newHeight) {
-          heightRef.current = newHeight;
-          setRowHeight(newHeight);
-        }
-      }
-    });
-  }, []);
-  const rowRef = useCallback19(
-    (el) => {
-      if (el) {
-        if (rowHeightProp === 0) {
-          const { height } = el.getBoundingClientRect();
-          console.log({ boundingClientHeight: height });
-          console.log(`measured rowHeight = ${height} (${rowHeightProp})`);
-          resizeObserver.observe(el);
-          setRowHeight(height);
-        }
-      } else {
-        resizeObserver.disconnect();
-      }
-    },
-    [resizeObserver, rowHeightProp]
-  );
-  return { rowHeight, rowRef };
-};
-
-// src/Table.tsx
-import { jsx as jsx12, jsxs as jsxs9 } from "react/jsx-runtime";
-var classBase8 = "vuuTable";
-var { IDX: IDX3, RENDER_IDX } = metadataKeys6;
-var TableCore = ({
-  Row: Row2 = Row,
-  allowDragDrop,
-  availableColumns,
-  config,
-  containerRef,
-  dataSource,
-  disableFocus = false,
-  highlightedIndex: highlightedIndexProp,
-  id: idProp,
-  navigationStyle = "cell",
-  onAvailableColumnsChange,
-  onConfigChange,
-  onDragStart,
-  onDrop,
-  onFeatureInvocation,
-  onHighlight,
-  onRowClick: onRowClickProp,
-  onSelect,
-  onSelectionChange,
-  renderBufferSize = 5,
-  rowHeight,
-  scrollingApiRef,
-  selectionModel = "extended",
-  showColumnHeaders = true,
-  showColumnHeaderMenus = true,
-  headerHeight = showColumnHeaders ? rowHeight * 1.25 : 0,
-  size
-}) => {
-  const id = useId(idProp);
-  const {
-    columnMap,
-    columns,
-    data,
-    draggableRow,
-    getRowOffset,
-    handleContextMenuAction,
-    headings,
-    highlightedIndex,
-    menuBuilder,
-    onDataEdited,
-    onMoveColumn,
-    onMoveGroupColumn,
-    onRemoveGroupColumn,
-    onResizeColumn,
-    onRowClick,
-    onSortColumn,
-    onToggleGroup,
-    rowClassNameGenerator,
-    scrollProps,
-    tableAttributes,
-    tableConfig,
-    viewportMeasurements,
-    ...tableProps
-  } = useTable({
-    allowDragDrop,
-    availableColumns,
-    config,
-    containerRef,
-    dataSource,
-    disableFocus,
-    headerHeight,
-    highlightedIndex: highlightedIndexProp,
-    id,
-    navigationStyle,
-    onAvailableColumnsChange,
-    onConfigChange,
-    onDragStart,
-    onDrop,
-    onFeatureInvocation,
-    onHighlight,
-    onRowClick: onRowClickProp,
-    onSelect,
-    onSelectionChange,
-    renderBufferSize: Math.max(5, renderBufferSize),
-    rowHeight,
-    scrollingApiRef,
-    selectionModel,
-    size
-  });
-  const contentContainerClassName = cx9(`${classBase8}-contentContainer`, {
-    [`${classBase8}-colLines`]: tableAttributes.columnSeparators,
-    [`${classBase8}-rowLines`]: tableAttributes.rowSeparators,
-    [`${classBase8}-zebra`]: tableAttributes.zebraStripes
-  });
-  const cssVariables = {
-    "--content-height": `${viewportMeasurements.contentHeight}px`,
-    "--content-width": `${viewportMeasurements.contentWidth}px`,
-    "--horizontal-scrollbar-height": `${viewportMeasurements.horizontalScrollbarHeight}px`,
-    "--pinned-width-left": `${viewportMeasurements.pinnedWidthLeft}px`,
-    "--pinned-width-right": `${viewportMeasurements.pinnedWidthRight}px`,
-    "--header-height": `${headerHeight}px`,
-    "--row-height-prop": `${rowHeight}px`,
-    "--total-header-height": `${viewportMeasurements.totalHeaderHeight}px`,
-    "--vertical-scrollbar-width": `${viewportMeasurements.verticalScrollbarWidth}px`,
-    "--viewport-body-height": `${viewportMeasurements.viewportBodyHeight}px`
-  };
-  return /* @__PURE__ */ jsxs9(
-    ContextMenuProvider,
-    {
-      menuActionHandler: handleContextMenuAction,
-      menuBuilder,
-      children: [
-        /* @__PURE__ */ jsx12(
-          "div",
-          {
-            className: `${classBase8}-scrollbarContainer`,
-            ref: scrollProps.scrollbarContainerRef,
-            style: cssVariables,
-            children: /* @__PURE__ */ jsx12("div", { className: `${classBase8}-scrollbarContent` })
-          }
-        ),
-        /* @__PURE__ */ jsx12(
-          "div",
-          {
-            className: contentContainerClassName,
-            ref: scrollProps.contentContainerRef,
-            style: cssVariables,
-            children: /* @__PURE__ */ jsxs9(
-              "div",
-              {
-                ...tableProps,
-                className: `${classBase8}-table`,
-                role: "table",
-                tabIndex: disableFocus ? void 0 : -1,
-                children: [
-                  showColumnHeaders ? /* @__PURE__ */ jsx12(
-                    TableHeader,
-                    {
-                      columns: scrollProps.columnsWithinViewport,
-                      headings,
-                      onMoveColumn,
-                      onMoveGroupColumn,
-                      onRemoveGroupColumn,
-                      onResizeColumn,
-                      onSortColumn,
-                      showColumnHeaderMenus,
-                      tableConfig,
-                      tableId: id,
-                      virtualColSpan: scrollProps.virtualColSpan
-                    }
-                  ) : null,
-                  /* @__PURE__ */ jsx12("div", { className: `${classBase8}-body`, children: data.map((data2) => /* @__PURE__ */ jsx12(
-                    Row2,
-                    {
-                      "aria-rowindex": data2[0] + 1,
-                      classNameGenerator: rowClassNameGenerator,
-                      columnMap,
-                      columns: scrollProps.columnsWithinViewport,
-                      highlighted: highlightedIndex === data2[IDX3],
-                      onClick: onRowClick,
-                      onDataEdited,
-                      row: data2,
-                      offset: getRowOffset(data2),
-                      onToggleGroup,
-                      virtualColSpan: scrollProps.virtualColSpan,
-                      zebraStripes: tableAttributes.zebraStripes
-                    },
-                    data2[RENDER_IDX]
-                  )) })
-                ]
-              }
-            )
-          }
-        ),
-        draggableRow
-      ]
-    }
-  );
-};
-var Table = forwardRef2(function TableNext({
-  Row: Row2,
-  allowDragDrop,
-  availableColumns,
-  className: classNameProp,
-  config,
-  dataSource,
-  disableFocus,
-  highlightedIndex,
-  id,
-  navigationStyle,
-  onAvailableColumnsChange,
-  onConfigChange,
-  onDragStart,
-  onDrop,
-  onFeatureInvocation,
-  onHighlight,
-  onRowClick,
-  onSelect,
-  onSelectionChange,
-  renderBufferSize,
-  rowHeight: rowHeightProp,
-  scrollingApiRef,
-  selectionModel,
-  showColumnHeaders,
-  showColumnHeaderMenus,
-  headerHeight,
-  style: styleProp,
-  ...htmlAttributes
-}, forwardedRef) {
-  const containerRef = useRef15(null);
-  const [size, setSize] = useState8();
-  const { rowHeight, rowRef } = useRowHeight({ rowHeight: rowHeightProp });
-  if (config === void 0) {
-    throw Error(
-      "vuu Table requires config prop. Minimum config is list of Column Descriptors"
-    );
-  }
-  if (dataSource === void 0) {
-    throw Error("vuu Table requires dataSource prop");
-  }
-  return /* @__PURE__ */ jsxs9(
-    MeasuredContainer,
-    {
-      ...htmlAttributes,
-      className: cx9(classBase8, classNameProp),
-      id,
-      onResize: setSize,
-      ref: useForkRef(containerRef, forwardedRef),
-      children: [
-        /* @__PURE__ */ jsx12(RowProxy, { ref: rowRef, height: rowHeightProp }),
-        size && rowHeight ? /* @__PURE__ */ jsx12(
-          TableCore,
-          {
-            Row: Row2,
-            allowDragDrop,
-            availableColumns,
-            config,
-            containerRef,
-            dataSource,
-            disableFocus,
-            headerHeight,
-            highlightedIndex,
-            id,
-            navigationStyle,
-            onAvailableColumnsChange,
-            onConfigChange,
-            onDragStart,
-            onDrop,
-            onFeatureInvocation,
-            onHighlight,
-            onRowClick,
-            onSelect,
-            onSelectionChange,
-            renderBufferSize,
-            rowHeight,
-            scrollingApiRef,
-            selectionModel,
-            showColumnHeaders,
-            showColumnHeaderMenus,
-            size
-          }
-        ) : null
-      ]
-    }
-  );
-});
-
-// src/cell-renderers/checkbox-cell/CheckboxCell.tsx
-import { memo as memo3, useCallback as useCallback20 } from "react";
-import { CheckboxIcon, WarnCommit } from "@vuu-ui/vuu-ui-controls";
-import { Checkbox } from "@salt-ds/core";
-import {
-  dataColumnAndKeyUnchanged,
-  dispatchCustomEvent,
-  registerComponent
-} from "@vuu-ui/vuu-utils";
-import { jsx as jsx13 } from "react/jsx-runtime";
-var CheckboxCell = memo3(
-  ({ column, columnMap, onCommit = WarnCommit, row }) => {
-    const dataIdx = columnMap[column.name];
-    const isChecked = !!row[dataIdx];
-    const handleCommit = useCallback20(
-      (value) => async (evt) => {
-        const res = await onCommit(value);
-        if (res === true) {
-          dispatchCustomEvent(evt.target, "vuu-commit");
-        }
-        return res;
-      },
-      [onCommit]
-    );
-    return column.editable ? /* @__PURE__ */ jsx13(Checkbox, { checked: isChecked, onClick: handleCommit(!isChecked) }) : /* @__PURE__ */ jsx13(CheckboxIcon, { checked: isChecked, disabled: true });
-  },
-  dataColumnAndKeyUnchanged
-);
-CheckboxCell.displayName = "CheckboxCell";
-registerComponent("checkbox-cell", CheckboxCell, "cell-renderer", {
-  serverDataType: "boolean"
-});
-
-// src/cell-renderers/input-cell/InputCell.tsx
-import { registerComponent as registerComponent2 } from "@vuu-ui/vuu-utils";
-import { Input } from "@salt-ds/core";
-import { useEditableText } from "@vuu-ui/vuu-ui-controls";
-import cx10 from "clsx";
-import { jsx as jsx14 } from "react/jsx-runtime";
-var classBase9 = "vuuTableInputCell";
-var WarnCommit2 = () => {
-  console.warn(
-    "onCommit handler has not been provided to InputCell cell renderer"
-  );
-  return Promise.resolve(true);
-};
-var InputCell = ({
-  column,
-  columnMap,
-  onCommit = WarnCommit2,
-  row
-}) => {
-  const dataIdx = columnMap[column.name];
-  const dataValue = row[dataIdx];
-  const { align = "left", clientSideEditValidationCheck } = column;
-  const { warningMessage, ...editProps } = useEditableText({
-    initialValue: dataValue,
-    onCommit,
-    clientSideEditValidationCheck
-  });
-  const endAdornment = warningMessage && align === "left" ? /* @__PURE__ */ jsx14("span", { className: `${classBase9}-icon`, "data-icon": "error" }) : void 0;
-  const startAdornment = warningMessage && align === "right" ? /* @__PURE__ */ jsx14("span", { className: `${classBase9}-icon`, "data-icon": "error" }) : void 0;
-  return /* @__PURE__ */ jsx14(
-    Input,
-    {
-      ...editProps,
-      className: cx10(classBase9, {
-        [`${classBase9}-error`]: warningMessage !== void 0
-      }),
-      endAdornment,
-      startAdornment
-    }
-  );
-};
-registerComponent2("input-cell", InputCell, "cell-renderer", {
-  userCanAssign: false
-});
-
-// src/cell-renderers/toggle-cell/ToggleCell.tsx
-import { WarnCommit as WarnCommit3 } from "@vuu-ui/vuu-ui-controls";
-import {
-  dataColumnAndKeyUnchanged as dataColumnAndKeyUnchanged2,
-  dispatchCustomEvent as dispatchCustomEvent2,
-  isTypeDescriptor,
-  isValueListRenderer,
-  registerComponent as registerComponent3
-} from "@vuu-ui/vuu-utils";
-import cx11 from "clsx";
-import { memo as memo4, useCallback as useCallback21 } from "react";
-import { CycleStateButton } from "@vuu-ui/vuu-ui-controls";
-import { jsx as jsx15 } from "react/jsx-runtime";
-var classBase10 = "vuuTableToggleCell";
-var getValueList = ({ name, type }) => {
-  if (isTypeDescriptor(type) && isValueListRenderer(type.renderer)) {
-    return type.renderer.values;
-  } else {
-    throw Error(
-      `useLookupValues column ${name} has not been configured with a values list`
-    );
-  }
-};
-var ToggleCell = memo4(
-  function ToggleCell2({
-    column,
-    columnMap,
-    onCommit = WarnCommit3,
-    row
-  }) {
-    const values = getValueList(column);
-    const dataIdx = columnMap[column.name];
-    const value = row[dataIdx];
-    const handleCommit = useCallback21(
-      (evt, value2) => {
-        return onCommit(value2).then((response) => {
-          if (response === true) {
-            dispatchCustomEvent2(evt.target, "vuu-commit");
-          }
-          return response;
-        });
-      },
-      [onCommit]
-    );
-    return /* @__PURE__ */ jsx15(
-      CycleStateButton,
-      {
-        className: cx11(classBase10, `${classBase10}-${column.name}`),
-        onCommit: handleCommit,
-        value,
-        values,
-        variant: "cta",
-        children: value
-      }
-    );
-  },
-  dataColumnAndKeyUnchanged2
-);
-registerComponent3("toggle-cell", ToggleCell, "cell-renderer", {
-  userCanAssign: false
-});
-
-// src/useControlledTableNavigation.ts
-import { useStateRef } from "@vuu-ui/vuu-ui-controls";
-import { dispatchMouseEvent as dispatchMouseEvent2 } from "@vuu-ui/vuu-utils";
-import { useCallback as useCallback22, useRef as useRef16 } from "react";
-var useControlledTableNavigation = (initialValue, rowCount) => {
-  const tableRef = useRef16(null);
-  const [highlightedIndexRef, setHighlightedIndex] = useStateRef(initialValue);
-  const handleKeyDown = useCallback22(
-    (e) => {
-      var _a;
-      if (e.key === "ArrowDown") {
-        setHighlightedIndex((index = -1) => Math.min(rowCount - 1, index + 1));
-      } else if (e.key === "ArrowUp") {
-        setHighlightedIndex((index = -1) => Math.max(0, index - 1));
-      } else if (e.key === "Enter" || e.key === " ") {
-        const { current: rowIdx } = highlightedIndexRef;
-        const rowEl = (_a = tableRef.current) == null ? void 0 : _a.querySelector(
-          `[aria-rowindex="${rowIdx}"]`
-        );
-        if (rowEl) {
-          dispatchMouseEvent2(rowEl, "click");
-        }
-      }
-    },
-    [highlightedIndexRef, rowCount, setHighlightedIndex]
-  );
-  const handleHighlight = useCallback22(
-    (idx) => {
-      setHighlightedIndex(idx);
-    },
-    [setHighlightedIndex]
-  );
-  return {
-    highlightedIndexRef,
-    onHighlight: handleHighlight,
-    onKeyDown: handleKeyDown,
-    tableRef
-  };
-};
-export {
-  CheckboxCell,
-  GroupHeaderCell,
-  GroupHeaderCell as GroupHeaderCellNext,
-  HeaderCell,
-  InputCell,
-  Table,
-  TableCell,
-  TableGroupCell,
-  ToggleCell,
-  isShowColumnSettings,
-  isShowTableSettings,
-  noScrolling,
-  updateTableConfig,
-  useControlledTableNavigation,
-  useTableModel,
-  useTableScroll,
-  useTableViewport
-};
+import{OverflowContainer as Hn}from"@vuu-ui/vuu-ui-controls";import{useLayoutEffectSkipFirst as Mn}from"@vuu-ui/vuu-utils";import Pn from"clsx";import{useCallback as En,useRef as Sn,useState as kn}from"react";import dn from"clsx";import{useCallback as pn}from"react";import{jsx as bn,jsxs as fn}from"react/jsx-runtime";var To="vuuColumnHeaderPill",ge=({children:e,className:o,column:t,onRemove:r,removable:n,...l})=>{if(n&&typeof r!="function")throw Error("ColumnHeaderPill onRemove prop must be provided if Pill is removable");let a=pn(i=>{i.preventDefault(),i.stopPropagation(),r==null||r(t)},[t,r]);return fn("div",{...l,className:dn(To,o),children:[e,n?bn("span",{className:`${To}-removeButton`,role:"button","data-icon":"cross",onClick:a}):null]})};import{jsx as Fe,jsxs as gn}from"react/jsx-runtime";var Ro=({column:e,...o})=>{let{name:t,sorted:r}=e,n=typeof r=="number"?r<0?"arrow-down":"arrow-up":r==="A"?"arrow-up":r==="D"?"arrow-down":void 0;return gn(ge,{...o,column:e,children:[Fe("span",{className:"vuuGroupColumnPill-label",children:t}),n!==void 0?Fe("span",{"data-icon":n}):null,typeof r=="number"?Fe("span",{className:"vuuSortPosition",children:Math.abs(r)}):null]})};import{jsx as yo,jsxs as Cn}from"react/jsx-runtime";var Do=({column:e})=>{if(!e.sorted)return null;let o=typeof e.sorted=="number"?e.sorted<0?"arrow-down":"arrow-up":e.sorted==="A"?"arrow-up":"arrow-down";return Cn(ge,{column:e,children:[yo("span",{"data-icon":o}),typeof e.sorted=="number"?yo("span",{className:"vuuSortPosition",children:Math.abs(e.sorted)}):null]})};import{useCallback as Ge,useRef as vn}from"react";import{jsx as wn}from"react/jsx-runtime";var Ho=()=>{},hn="vuuColumnResizer",De=({onDrag:e,onDragEnd:o=Ho,onDragStart:t=Ho})=>{let r=vn({start:0,now:0}),n=Ge(i=>{i.stopPropagation&&i.stopPropagation(),i.preventDefault&&i.preventDefault();let{current:s}=r,u=Math.round(i.clientX),m=u-s.now,c=s.now-s.start;r.current.now=u,m!==0&&e(i,m,c)},[e]),l=Ge(i=>{window.removeEventListener("mouseup",l),window.removeEventListener("mousemove",n);let{current:s}=r,u=s.now-s.start;o(i,u)},[o,n]),a=Ge(i=>{let{current:s}=r;t(i),s.now=s.start=Math.round(i.clientX),window.addEventListener("mouseup",l),window.addEventListener("mousemove",n),i.stopPropagation&&i.stopPropagation(),i.preventDefault&&i.preventDefault()},[t,n,l]);return wn("div",{className:hn,onMouseDown:a})};import{useCallback as Oe,useRef as xn,useState as Tn}from"react";var He=({column:e,onResize:o,rootRef:t})=>{let r=xn({start:0,now:0}),[n,l]=Tn(!1),{name:a}=e,i=Oe(()=>{if(o&&t.current){let{current:m}=r,{width:c}=t.current.getBoundingClientRect();m.start=m.now=Math.round(c),l(!0),o==null||o("begin",a)}},[a,o,t]),s=Oe((m,c,b)=>{if(t.current&&o){let{current:v}=r,w=v.start+b;w!==v.now&&w>0&&(o("resize",a,w),v.now=w)}},[a,o,t]),u=Oe(()=>{if(o){let{current:m}=r;o("end",a,m.now),setTimeout(()=>{l(!1)},80)}},[a,o]);return{isResizing:n,onDrag:s,onDragStart:i,onDragEnd:u}};import{getColumnStyle as Rn}from"@vuu-ui/vuu-utils";import yn from"clsx";import{useMemo as Dn}from"react";var ue=(e,o,t)=>Dn(()=>{let r=yn(o,{vuuPinFloating:e.pin==="floating",vuuPinLeft:e.pin==="left",vuuPinRight:e.pin==="right",vuuEndPin:t&&e.endPin,[`${o}-editable`]:e.editable,[`${o}-right`]:e.align==="right"}),n=Rn(e);return{className:r,style:n}},[e,o,t]);import{jsx as Be,jsxs as In}from"react/jsx-runtime";import{createElement as Ln}from"react";var $e="vuuTableGroupHeaderCell",An=(e,o)=>e===o?e:o,Ve=({column:e,className:o,onMoveColumn:t,onRemoveColumn:r,onResize:n,...l})=>{let a=Sn(null),{isResizing:i,...s}=He({column:e,onResize:n,rootRef:a}),[u,m]=kn(e.columns),{className:c,style:b}=ue(e,$e,!0),v=u.length>1?{removable:!0,onRemove:r}:void 0,w=En((T,d)=>{m(g=>{let h=g.slice(),[H]=h.splice(T,1);if(d===-1){let R=h.concat(H);return t==null||t(R),R}else return h.splice(d,0,H),t==null||t(h),h})},[t]);return Mn(()=>{m(T=>An(T,e.columns))},[e.columns]),In("div",{...l,className:Pn(c,o,{[`${$e}-pending`]:e.groupConfirmed===!1}),ref:a,role:"columnheader",style:b,children:[Be(Hn,{allowDragDrop:!0,className:`${$e}-inner`,onMoveItem:w,overflowPosition:"start",children:u.map(T=>Ln(Ro,{...v,column:T,key:T.name}))}),Be(ge,{column:e,removable:!0,onRemove:r}),e.resizeable!==!1?Be(De,{...s}):null]})};import{useContextMenu as Gn}from"@vuu-ui/vuu-popups";import On from"clsx";import{useCallback as Po,useMemo as Eo,useRef as $n}from"react";import{PopupMenu as zn}from"@vuu-ui/vuu-popups";import Nn from"clsx";import{jsx as Fn}from"react/jsx-runtime";var Kn="vuuColumnMenu",Mo=({className:e,column:o})=>Fn(zn,{className:Nn(Kn,e),"data-embedded":!0,menuLocation:"column-menu",menuOptions:{column:o}});import{jsx as Ce,jsxs as Bn}from"react/jsx-runtime";var xe="vuuTableHeaderCell",So=({className:e,column:o,onClick:t,onResize:r,showMenu:n=!0,...l})=>{let{HeaderCellContentRenderer:a,HeaderCellLabelRenderer:i}=o,s=$n(null),{isResizing:u,...m}=He({column:o,onResize:r,rootRef:s}),[c]=Gn(),b=Eo(()=>{if(!n)return h=>c(h,"column-menu",{column:o})},[o,c,n]),v=Eo(()=>{var D;let h=Ce(Do,{column:o}),H=i?Ce(i,{className:`${xe}-label`,column:o}):Ce("div",{className:`${xe}-label`,children:(D=o.label)!=null?D:o.name}),R=a?[Ce(a,{column:o},"content")]:[];if(n){let k=Ce(Mo,{column:o});return o.align==="right"?[h,H,R,k]:[k,H,h,R]}else return o.align==="right"?[h,H,R]:[H,h,R]},[a,i,o,n]),w=Po(h=>{!u&&(t==null||t(h))},[u,t]),T=Po(h=>{h.key==="Enter"&&(t==null||t(h))},[t]),{className:d,style:g}=ue(o,xe,!0);return Bn("div",{...l,className:On(d,e,{[`${xe}-resizing`]:u,[`${xe}-noMenu`]:n===!1}),onClick:w,onContextMenu:b,onKeyDown:T,ref:s,role:"columnheader",style:g,children:[...v,o.resizeable!==!1?Ce(De,{...m}):null]})};import{ContextMenuProvider as Mi}from"@vuu-ui/vuu-popups";import{MeasuredContainer as Pi}from"@vuu-ui/vuu-ui-controls";import{metadataKeys as Ei,useId as Si}from"@vuu-ui/vuu-utils";import{useForkRef as ki}from"@salt-ds/core";import Kt from"clsx";import{forwardRef as Ai,useRef as Li,useState as Ii}from"react";import{isGroupColumn as zo,isJsonColumn as Yn,isJsonGroup as jn,metadataKeys as qn,isNotHidden as er,RowSelected as or}from"@vuu-ui/vuu-utils";import Ko from"clsx";import{forwardRef as tr,memo as nr,useCallback as No}from"react";import{isNumericColumn as Vn}from"@vuu-ui/vuu-utils";import{useCallback as ko}from"react";import{jsx as Ao}from"react/jsx-runtime";var Wn="vuuTableCell",Lo=({column:e,columnMap:o,onClick:t,onDataEdited:r,row:n})=>{let{className:l,style:a}=ue(e,Wn),{CellRenderer:i,index:s,name:u,valueFormatter:m}=e,c=o[u],b=ko(w=>{if(r){let T=w;return Vn(e)&&typeof w=="string"&&(T=e.serverDataType==="double"?parseFloat(w):parseInt(w)),r==null?void 0:r(n,u,T)}else throw Error("TableCell onDataEdited prop not supplied for an editable cell")},[e,u,r,n]),v=ko(w=>{t==null||t(w,e)},[e,t]);return Ao("div",{"aria-colindex":s,className:l,onClick:t?v:void 0,role:"cell",style:a,children:i?Ao(i,{column:e,columnMap:o,onCommit:b,row:n}):m(n[c])})};import{getGroupValueAndOffset as Un,metadataKeys as _n}from"@vuu-ui/vuu-utils";import{useCallback as Xn}from"react";import Qn from"clsx";import{jsx as Ue,jsxs as Zn}from"react/jsx-runtime";var{IS_LEAF:Jn}=_n,We="vuuTableGroupCell",Io=({column:e,columnMap:o,onClick:t,row:r})=>{let{columns:n}=e,[l,a]=Un(n,r,o),{className:i,style:s}=ue(e,We),u=Xn(b=>{t==null||t(b,e)},[e,t]),m=r[Jn],c=Array(a).fill(0).map((b,v)=>Ue("span",{className:`${We}-spacer`},v));return Zn("div",{className:Qn(i,"vuuTableCell"),role:"cell",style:s,onClick:m?void 0:u,children:[c,m?null:Ue("span",{className:`${We}-toggle`,"data-icon":"triangle-right"}),Ue("span",{children:l})]})};import{jsx as Te,jsxs as ar}from"react/jsx-runtime";var{IDX:rr,IS_EXPANDED:lr,SELECTED:ir}=qn,le="vuuTableRow",Fo=tr(function({height:o},t){return Te("div",{"aria-hidden":!0,className:Ko(le,`${le}-proxy`),ref:t,style:{height:o}})}),_e=nr(({className:e,classNameGenerator:o,columnMap:t,columns:r,highlighted:n,row:l,offset:a,onClick:i,onDataEdited:s,onToggleGroup:u,virtualColSpan:m=0,zebraStripes:c=!1,...b})=>{let{[rr]:v,[lr]:w,[ir]:T}=l,d=No(M=>{let I=M.shiftKey,A=M.ctrlKey||M.metaKey;i==null||i(M,l,I,A)},[i,l]),{True:g,First:h,Last:H}=or,R=Ko(le,e,o==null?void 0:o(l,t),{[`${le}-even`]:c&&v%2===0,[`${le}-expanded`]:w,[`${le}-highlighted`]:n,[`${le}-selected`]:T&g,[`${le}-selectedStart`]:T&h,[`${le}-selectedEnd`]:T&H}),D={transform:`translate3d(0px, ${a}px, 0px)`},k=No((M,I)=>{(zo(I)||jn(I,l,t))&&(M.stopPropagation(),u==null||u(l,I))},[t,u,l]);return ar("div",{...b,role:"row",className:R,onClick:d,style:D,children:[Te("span",{className:`${le}-selectionDecorator vuuStickyLeft`}),m>0?Te("div",{className:"vuuTableCell",style:{width:m}}):null,r.filter(er).map(M=>{let I=zo(M),A=Yn(M);return Te(I?Io:Lo,{column:M,columnMap:t,onClick:I||A?k:void 0,onDataEdited:s,row:l},M.name)}),Te("span",{className:`${le}-selectionDecorator vuuStickyRight`})]})});_e.displayName="Row";import{isGroupColumn as mr,isNotHidden as dr}from"@vuu-ui/vuu-utils";import pr from"clsx";import{memo as br}from"react";import{useDragDrop as sr}from"@vuu-ui/vuu-ui-controls";import{moveColumnTo as Xe,queryClosest as ur,visibleColumnAtIndex as cr}from"@vuu-ui/vuu-utils";import{useCallback as Qe,useRef as Go}from"react";var Oo=({columns:e,onMoveColumn:o,onSortColumn:t,tableConfig:r})=>{let n=Go(null),l=Go(null),a=Qe(b=>{n.current=b,b?l.current=b.closest(".vuuTable-contentContainer"):l.current=null},[]),i=Qe(({fromIndex:b,toIndex:v})=>{let w=e[b],T=Xe(e,w,v),d=({name:R})=>D=>D.name===R,g=T.findIndex(d(w)),h=T[g+1],H=h?r.columns.findIndex(d(h)):-1;v>b&&H!==-1?o(Xe(r.columns,w,H-1)):o(Xe(r.columns,w,H))},[e,o,r.columns]),s=Qe(b=>{var g;let v=ur(b.target,".vuuTableHeaderCell"),w=parseInt((g=v==null?void 0:v.dataset.index)!=null?g:"-1"),T=cr(e,w),d=b.shiftKey;T&&t(T,d)},[e,t]),{onMouseDown:u,draggable:m,...c}=sr({allowDragDrop:!0,containerRef:n,draggableClassName:"vuuTable",itemQuery:".vuuTableHeaderCell",onDrop:i,orientation:"horizontal",scrollingContainerRef:l});return{draggableColumn:m,draggedColumnIndex:c.draggedItemIndex,onClick:s,onMouseDown:u,setContainerRef:a}};import{jsx as Re,jsxs as $o}from"react/jsx-runtime";var Je=br(({classBase:e="vuuTable",columns:o,headings:t,onMoveColumn:r,onMoveGroupColumn:n,onRemoveGroupColumn:l,onResizeColumn:a,onSortColumn:i,showColumnHeaderMenus:s,tableConfig:u,tableId:m,virtualColSpan:c=0})=>{let{draggableColumn:b,draggedColumnIndex:v,onClick:w,onMouseDown:T,setContainerRef:d}=Oo({columns:o,onMoveColumn:r,onSortColumn:i,tableConfig:u});return $o("div",{className:`${e}-col-headings`,ref:d,children:[t.map((g,h)=>Re("div",{className:"vuuTable-heading",children:g.map(({label:H,width:R},D)=>Re("div",{className:"vuuTable-headingCell",style:{width:R},children:H},D))},h)),$o("div",{className:`${e}-col-headers`,role:"row",children:[c>0?Re("div",{role:"cell",className:"vuuTableCell",style:{width:c}}):null,o.filter(dr).map((g,h)=>mr(g)?Re(Ve,{"aria-colindex":g.index,column:g,"data-index":h,onMoveColumn:n,onRemoveColumn:l,onResize:a},g.name):Re(So,{"aria-colindex":g.index,className:pr({"vuuDraggable-dragAway":h===v}),column:g,"data-index":h,id:`${m}-col-${h}`,onClick:w,onMouseDown:T,onResize:a,showMenu:s},g.name)),b]})]})});Je.displayName="TableHeader";import{useDragDrop as li}from"@vuu-ui/vuu-ui-controls";import{toggleOrApplySort as ii,asDataSourceRowObject as kt,buildColumnMap as ai,getIndexFromRowElement as si,isGroupColumn as ui,isJsonGroup as ci,isValidNumber as mi,metadataKeys as di,updateColumn as pi,useLayoutEffectSkipFirst as bi}from"@vuu-ui/vuu-utils";import{useCallback as K,useEffect as fi,useMemo as At,useRef as gi,useState as Ci}from"react";import{isNumericColumn as fr}from"@vuu-ui/vuu-utils";var Bo=e=>(o,t)=>{let r=[];return e===void 0||(o==="header"||o==="column-menu")&&(r.push(...gr(t,e)),r.push(...hr(t,e)),r.push(...Cr(t,e)),r.push(...vr(t)),r.push({action:"column-settings",icon:"cog",label:"Column Settings",options:t}),r.push({action:"table-settings",icon:"cog",label:"DataGrid Settings",options:t})),r};function gr(e,{sort:{sortDefs:o}}){let{column:t}=e,r=[];if(t===void 0)return r;let n=o.length>0;return t.sorted==="A"?r.push({label:"Reverse Sort (DSC)",action:"sort-dsc",options:e}):t.sorted==="D"?r.push({label:"Reverse Sort (ASC)",action:"sort-asc",options:e}):typeof t.sorted=="number"?(t.sorted>0?r.push({label:"Reverse Sort (DSC)",action:"sort-add-dsc",options:e}):r.push({label:"Reverse Sort (ASC)",action:"sort-add-asc",options:e}),n&&Math.abs(t.sorted)<o.length&&r.push({label:"Remove from sort",action:"sort-remove",options:e}),r.push({label:"New Sort",children:[{label:"Ascending",action:"sort-asc",options:e},{label:"Descending",action:"sort-dsc",options:e}]})):n?(r.push({label:"Add to sort",children:[{label:"Ascending",action:"sort-add-asc",options:e},{label:"Descending",action:"sort-add-dsc",options:e}]}),r.push({label:"New Sort",children:[{label:"Ascending",action:"sort-asc",options:e},{label:"Descending",action:"sort-dsc",options:e}]})):r.push({label:"Sort",children:[{label:"Ascending",action:"sort-asc",options:e},{label:"Descending",action:"sort-dsc",options:e}]}),r}function Cr(e,o){let{column:t}=e;if(t===void 0||o.groupBy.length===0)return[];let{name:r,label:n=r}=t;return[{label:`Aggregate ${n}`,children:[{label:"Count",action:"agg-count",options:e},{label:"Distinct",action:"agg-distinct",options:e}].concat(fr(t)?[{label:"Sum",action:"agg-sum",options:e},{label:"Avg",action:"agg-avg",options:e},{label:"High",action:"agg-high",options:e},{label:"Low",action:"agg-low",options:e}]:[])}]}var qe=(e,o)=>({label:`Pin ${o}`,action:`column-pin-${o}`,options:e}),Ze=e=>qe(e,"left"),Ye=e=>qe(e,"floating"),je=e=>qe(e,"right");function vr(e){let{column:o}=e;if(o===void 0)return[];let{pin:t}=o,r=[{label:"Hide column",action:"column-hide",options:e},{label:"Remove column",action:"column-remove",options:e}];return t===void 0?r.push({label:"Pin column",children:[Ze(e),Ye(e),je(e)]}):t==="left"?r.push({label:"Unpin column",action:"column-unpin",options:e},{label:"Pin column",children:[Ye(e),je(e)]}):t==="right"?r.push({label:"Unpin column",action:"column-unpin",options:e},{label:"Pin column",children:[Ze(e),Ye(e)]}):t==="floating"&&r.push({label:"Unpin column",action:"column-unpin",options:e},{label:"Pin column",children:[Ze(e),je(e)]}),r}function hr(e,{groupBy:o}){let{column:t}=e,r=[];if(t===void 0)return r;let{name:n,label:l=n}=t;return o.length===0?r.push({label:`Group by ${l}`,action:"group",options:e}):r.push({label:`Add ${l} to group by`,action:"group-add",options:e}),r}import{removeColumnFromFilter as wr}from"@vuu-ui/vuu-utils";import{addGroupColumn as Vo,addSortColumn as Wo,AggregationType as xr,setAggregations as ve,setSortColumn as Uo}from"@vuu-ui/vuu-utils";var Tr=(e,o)=>{if(e.filterStruct&&o){let[t,r]=wr(o,e.filterStruct);return{filter:r,filterStruct:t}}else return e},{Average:Rr,Count:yr,Distinct:Dr,High:Hr,Low:Mr,Sum:Pr}=xr,_o=({dataSource:e,onPersistentColumnOperation:o})=>r=>{let n=r.options;if(n.column&&e){let{column:l}=n;switch(r.menuId){case"sort-asc":return e.sort=Uo(e.sort,l,"A"),!0;case"sort-dsc":return e.sort=Uo(e.sort,l,"D"),!0;case"sort-add-asc":return e.sort=Wo(e.sort,l,"A"),!0;case"sort-add-dsc":return e.sort=Wo(e.sort,l,"D"),!0;case"group":return e.groupBy=Vo(e.groupBy,l),!0;case"group-add":return e.groupBy=Vo(e.groupBy,l),!0;case"column-hide":return o({type:"hideColumns",columns:[l]}),!0;case"column-remove":return e.columns=e.columns.filter(a=>a!==l.name),!0;case"filter-remove-column":return e.filter=Tr(e.filter,l),!0;case"remove-filters":return e.filter={filter:""},!0;case"agg-avg":return e.aggregations=ve(e.aggregations,l,Rr),!0;case"agg-high":return e.aggregations=ve(e.aggregations,l,Hr),!0;case"agg-low":return e.aggregations=ve(e.aggregations,l,Mr),!0;case"agg-count":return e.aggregations=ve(e.aggregations,l,yr),!0;case"agg-distinct":return e.aggregations=ve(e.aggregations,l,Dr),!0;case"agg-sum":return e.aggregations=ve(e.aggregations,l,Pr),!0;case"column-pin-floating":return o({type:"pinColumn",column:l,pin:"floating"}),!0;case"column-pin-left":return o({type:"pinColumn",column:l,pin:"left"}),!0;case"column-pin-right":return o({type:"pinColumn",column:l,pin:"right"}),!0;case"column-unpin":return o({type:"pinColumn",column:l,pin:void 0}),!0;case"column-settings":return o({type:"columnSettings",column:l}),!0;case"table-settings":return o({type:"tableSettings"}),!0;default:}}return!1};var Xo=(e,o)=>{switch(o.type){case"col-size":return{...e,columns:e.columns.map(t=>t.name===o.column.name?{...t,width:o.width}:t)};case"column-prop":return{...e,columns:e.columns.map(t=>t.name===o.column.name?{...t,[o.property]:o.value}:t)};default:return e}};import{isCharacterKey as Lr}from"@vuu-ui/vuu-utils";import{useCallback as de}from"react";var eo=e=>`.vuuTable-col-headers .vuuTableHeaderCell:nth-child(${e})`,oo=(e,o)=>`.vuuTable-body > [aria-rowindex='${e+1}'] > [role='cell']:nth-child(${o+1})`,Qo=(e,[o,t])=>{var l;let r=o===-1?eo(t):oo(o,t),n=(l=e.current)==null?void 0:l.querySelector(r);return Er(n)&&n.querySelector("button")||n},Er=e=>e==null?void 0:e.classList.contains("vuuTableCell-editable"),Jo=e=>e.querySelector(".vuuTableInputCell")!==null;function Sr(e){if(e){let o=e.ariaRowIndex;if(o!==null)return parseInt(o,10)-1}return-1}var kr=e=>e.closest('[role="row"]'),Zo=e=>Sr(kr(e)),Ar=[void 0,void 0],Yo=(e,o,t=e.closest(".vuuTable-contentContainer"))=>{if(t){let r=t==null?void 0:t.getBoundingClientRect(),n=r.top+o,l=e.getBoundingClientRect();if(l)return l.bottom>r.bottom?["down",l.bottom-r.bottom]:l.top<n?["up",l.top-n]:Ar;throw Error("Whats going on, row not found")}else throw Error("Whats going on, scrollbar container not found")};var jo=({navigate:e})=>{let o=de(()=>{e()},[e]),t=de(s=>{let u=s.target,m=u.matches("input")?u:u.querySelector("input");m&&(m.focus(),m.select())},[]),r=de(s=>{let m=s.target.querySelector("input");m&&(m.focus(),m.select())},[]),n=de(s=>{let u=s.target;Jo(u)&&(Lr(s.key)?t(s):s.key==="Enter"&&r(s))},[t,r]),l=de(s=>{let u=s.target;(u.matches("input")||u.querySelector("input"))&&(t(s),s.stopPropagation())},[t]),a=de(s=>{s.target.removeEventListener("vuu-commit",o,!0)},[o]),i=de(s=>{s.target.addEventListener("vuu-commit",o,!0)},[o]);return{onBlur:a,onDoubleClick:l,onFocus:i,onKeyDown:n}};import{getFullRange as no,NULL_RANGE as Kr,rangesAreSame as Fr}from"@vuu-ui/vuu-utils";import{useCallback as Pe,useEffect as qo,useMemo as Gr,useRef as Ee,useState as Or}from"react";import{isRowSelectedLast as Ir,metadataKeys as zr,WindowRange as Nr}from"@vuu-ui/vuu-utils";var{SELECTED:to}=zr,Me=class{constructor({from:o,to:t}){this.rowCount=0;this.setRowCount=o=>{o<this.data.length&&(this.data.length=o),this.rowCount=o};this.range=new Nr(o,t),this.data=new Array(Math.max(0,t-o)),this.rowCount=0}add(o){let[t]=o;if(this.isWithinRange(t)){let r=t-this.range.from;if(this.data[r]=o,o[to]){let n=this.data[r-1];Ir(n)&&(this.data[r-1]=n.slice(),this.data[r-1][to]-=4)}}}getAtIndex(o){return this.range.isWithin(o)&&this.data[o-this.range.from]!=null?this.data[o-this.range.from]:void 0}isWithinRange(o){return this.range.isWithin(o)}setRange({from:o,to:t}){if(o!==this.range.from||t!==this.range.to){let[r,n]=this.range.overlap(o,t),l=new Array(Math.max(0,t-o));for(let a=r;a<n;a++){let i=this.getAtIndex(a);if(i){let s=a-o;l[s]=i}}this.data=l,this.range.from=o,this.range.to=t}}getSelectedRows(){return this.data.filter(o=>o[to]!==0)}};var $r=e=>e.type==="vuu-link-created"||e.type==="vuu-link-removed",et=({dataSource:e,onFeatureInvocation:o,onSizeChange:t,onSubscribed:r,range:n=Kr,renderBufferSize:l=0})=>{let[,a]=Or(null),i=Ee([]),s=Ee(!0),u=Ee(!1),m=Ee(n),c=Gr(()=>new Me(no(n,l)),[]),b=Pe(d=>{for(let g of d)c.add(g);i.current=c.data,s.current&&a({})},[c]),v=Pe(d=>{d.type==="subscribed"?r==null||r(d):d.type==="viewport-update"?(typeof d.size=="number"&&(t==null||t(d.size),c.setRowCount(d.size)),d.rows?b(d.rows):typeof d.size=="number"&&(i.current=c.data,u.current=!0)):$r(d)?o==null||o(d):console.log(`useDataSource unexpected message ${d.type}`)},[c,o,t,r,b]),w=Pe(()=>c.getSelectedRows(),[c]);qo(()=>{var d;return s.current=!0,(d=e.resume)==null||d.call(e),()=>{var g;s.current=!1,(g=e.suspend)==null||g.call(e)}},[e]),qo(()=>{var d;e.status==="disabled"?(d=e.enable)==null||d.call(e,v):e==null||e.subscribe({range:no(n,l)},v)},[e,v,n,l]);let T=Pe(d=>{if(!Fr(d,m.current)){let g=no(d,l);c.setRange(g),e.range=m.current=g,e.emit("range",d)}},[e,c,l]);return{data:i.current,dataRef:i,getSelectedRows:w,range:m.current,setRange:T}};import{useMemo as Br,useRef as Vr}from"react";var ot=e=>{let o=Vr(e);return Br(()=>o.current,[])};import{getIndexFromRowElement as Wr}from"@vuu-ui/vuu-utils";import{useControlled as Ur}from"@salt-ds/core";import{useCallback as j,useEffect as tt,useRef as Se}from"react";var lt=new Set(["Home","End","PageUp","PageDown","ArrowDown","ArrowUp"]),ro=new Set(lt);ro.add("ArrowLeft");ro.add("ArrowRight");var _r=(e,o)=>{switch(o){case"cell":return ro.has(e);case"row":return lt.has(e);default:return!1}},Xr=["Home","End","PageUp","PageDown"],nt=e=>Xr.includes(e),Qr=[-1,-1];function rt(e,[o,t],r,n){return e==="ArrowUp"?o>-1?[o-1,t]:[o,t]:e==="ArrowDown"?o===-1?[0,t]:o===n-1?[o,t]:[o+1,t]:e==="ArrowRight"?t<r?[o,t+1]:[o,t]:e==="ArrowLeft"?t>1?[o,t-1]:[o,t]:[o,t]}var it=({columnCount:e=0,containerRef:o,disableFocus:t=!1,defaultHighlightedIndex:r,disableHighlightOnFocus:n,highlightedIndex:l,navigationStyle:a,requestScroll:i,onHighlight:s,rowCount:u=0,viewportRowCount:m})=>{var ne;let c=Se([-1,-1]),b=Se(),v=Se([-1,0]),w=Se(),[T,d]=Ur({controlled:l,default:r,name:"UseKeyboardNavigation"});w.current=T;let g=j((f,x=!1)=>{s==null||s(f),d(f)},[s,d]),h=f=>f==null?void 0:f.closest("[role='columnHeader'],[role='cell']"),H=f=>{var x;if(f.role==="columnHeader")return[-1,parseInt((x=f.dataset.idx)!=null?x:"-1",10)];{let y=f.closest("[role='row']");if(y){let G=Wr(y),C=Array.from(y.childNodes).indexOf(f);return[G,C]}}return Qr},R=j(f=>{var x;if(o.current){let y=Qo(o,f);y&&(y!==b.current&&((x=b.current)==null||x.removeAttribute("tabindex"),b.current=y,y.setAttribute("tabindex","0")),i==null||i({type:"scroll-row",rowIndex:f[0]}),y.focus({preventScroll:!0}))}},[o,i]),D=j((f,x,y=!1)=>{let G=[f,x];v.current=G,a==="row"?d(f):R(G),y&&(c.current=G)},[R,a,d]),k=j((f,[x,y])=>new Promise(G=>{let C=x;switch(f){case"PageDown":{C=Math.min(u-1,x+m),C!==x&&(i==null||i({type:"scroll-page",direction:"down"}));break}case"PageUp":{C=Math.max(0,x-m),C!==x&&(i==null||i({type:"scroll-page",direction:"up"}));break}case"Home":{C=0,C!==x&&(i==null||i({type:"scroll-end",direction:"home"}));break}case"End":{C=u-1,C!==x&&(i==null||i({type:"scroll-end",direction:"end"}));break}}setTimeout(()=>{G([C,y])},35)}),[i,u,m]),M=j(()=>{var f;if(n!==!0&&(f=o.current)!=null&&f.contains(document.activeElement)){let x=h(document.activeElement);x&&(c.current=H(x),a==="row"&&d(c.current[0]))}},[n,o,a,d]),I=j(async f=>{let[x,y]=nt(f)?await k(f,v.current):rt(f,v.current,e,u),[G,C]=v.current;(x!==G||y!==C)&&D(x,y,!0)},[e,k,u,D]),A=j(f=>{i==null||i({type:"scroll-row",rowIndex:f})},[i]),W=j(async f=>{let{current:x}=w,[y]=nt(f)?await k(f,[x!=null?x:-1,0]):rt(f,[x!=null?x:-1,0],e,u);y!==x&&(g(y),A(y))},[e,k,u,A,g]);tt(()=>{l!==void 0&&l!==-1&&A(l)},[l,A]);let J=j(f=>{u>0&&_r(f.key,a)&&(f.preventDefault(),f.stopPropagation(),a==="row"?W(f.key):I(f.key))},[u,a,W,I]),_=j(f=>{let x=f.target,y=h(x);if(y){let[G,C]=H(y);D(G,C)}},[D]),Z=j(()=>{g(-1)},[g]),z=j(f=>{let x=Zo(f.target);x!==-1&&x!==w.current&&g(x)},[g]),E=j(()=>{I("ArrowDown")},[I]),te=((ne=o.current)==null?void 0:ne.firstChild)!=null;return tt(()=>{if(te&&b.current===void 0&&!t){let{current:f}=o,x=(f==null?void 0:f.querySelector(eo(0)))||(f==null?void 0:f.querySelector(oo(0,0)));x&&(x.setAttribute("tabindex","0"),b.current=x)}},[o,t,te]),{highlightedIndexRef:w,navigate:E,onClick:_,onFocus:M,onKeyDown:J,onMouseLeave:a==="row"?Z:void 0,onMouseMove:a==="row"?z:void 0}};import{deselectItem as Jr,dispatchMouseEvent as Zr,getRowElementAtIndex as Yr,isRowSelected as jr,metadataKeys as qr,selectItem as at}from"@vuu-ui/vuu-utils";import{useCallback as lo,useRef as st}from"react";var{IDX:el}=qr,ol=[],tl=["Enter"," "],ut=({highlightedIndexRef:e,selectionKeys:o=tl,selectionModel:t,onSelect:r,onSelectionChange:n})=>{let l=st(-1),a=st(ol),i=lo(m=>o.includes(m.key),[o]),s=lo((m,c,b,v)=>{let{[el]:w}=c,{current:T}=l,{current:d}=a,g=jr(c)?Jr:at,h=g(t,d,w,b,v,T);a.current=h,l.current=w,r==null||r(g===at?c:null),n==null||n(h)},[r,n,t]);return{onKeyDown:lo(m=>{if(i(m)){let{current:c}=e;if(c!==void 0&&c!==-1){let b=Yr(m.target,c);b&&Zr(b,"click")}}},[e,i]),onRowClick:s}};import{useContextMenu as nl}from"@vuu-ui/vuu-popups";import{buildColumnMap as rl,getIndexFromRowElement as ll}from"@vuu-ui/vuu-utils";import{useCallback as il}from"react";var al=[],ct=({columns:e,data:o,dataSource:t,getSelectedRows:r})=>{let[n]=nl();return il(a=>{let i=a.target,s=i==null?void 0:i.closest("div[role='cell']"),u=i==null?void 0:i.closest("div[role='row']");if(s&&u){let{selectedRowsCount:m}=t,c=rl(e),b=ll(u),v=Array.from(u.childNodes).indexOf(s),w=o.find(([d])=>d===b),T=e[v];n(a,"grid",{columnMap:c,columnName:T,row:w,selectedRows:m===0?al:r(),viewport:t.viewport})}},[e,o,t,r,n])};import{applyFilterToColumns as sl,applyGroupByToColumns as ul,applySortToColumns as cl,existingSort as ml,getCellRenderer as dl,getColumnHeaderContentRenderer as pl,getColumnHeaderLabelRenderer as bl,getColumnLabel as fl,getTableHeadings as gl,getValueFormatter as Cl,hasValidationRules as vl,isFilteredColumn as hl,isGroupColumn as wl,isPinned as xl,logger as Tl,removeSort as Rl,replaceColumn as pe,sortPinnedColumns as mt,stripFilterFromColumns as yl,subscribedOnly as Dl}from"@vuu-ui/vuu-utils";import{buildValidationChecker as Hl}from"@vuu-ui/vuu-ui-controls";import{useReducer as Ml}from"react";var{info:io}=Tl("useTableModel"),Pl=100,El=({serverDataType:e})=>e===void 0,dt=(e,o)=>{let t=o==null?void 0:o.columns.find(({name:r})=>r===e.name);return t?t.serverDataType:e.serverDataType},Sl=["int","long","double"],pt=e=>e===void 0?void 0:Sl.includes(e)?"right":"left",bt=e=>e.type==="columnSettings",ft=e=>e.type==="tableSettings",kl=(e,o)=>{switch(io==null||io(`TableModelReducer ${o.type}`),o.type){case"init":return Ct(o);case"moveColumn":return Ll(e,o);case"resizeColumn":return Nl(e,o);case"setTableSchema":return Kl(e,o);case"hideColumns":return Il(e,o);case"showColumns":return zl(e,o);case"pinColumn":return Fl(e,o);case"updateColumnProp":return he(e,o);case"tableConfig":return ht(e,o);default:return console.log(`unhandled action ${o.type}`),e}},gt=(e,o)=>{let[t,r]=Ml(kl,{tableConfig:e,dataSource:o},Ct),{columns:n,headings:l,tableConfig:a,...i}=t;return{columns:n,dispatchTableModelAction:r,headings:l,tableAttributes:i,tableConfig:a}};function Ct({dataSource:e,tableConfig:o}){let{columns:t,...r}=o,{config:n,tableSchema:l}=e,a=t.filter(Dl(n==null?void 0:n.columns)).map(vt(r,l)),i=a.some(xl)?mt(a):a,s={columns:i,headings:gl(i),tableConfig:o,...r};if(n){let{columns:u,...m}=n;s=ht(s,{type:"tableConfig",...m})}return s}var Al=(e,o)=>o==="uppercase"?e.toUpperCase():o==="capitalize"?e[0].toUpperCase()+e.slice(1).toLowerCase():e,vt=(e,o)=>(t,r)=>{let{columnDefaultWidth:n=Pl,columnFormatHeader:l}=e,a=dt(t,o),{align:i=pt(a),name:s,label:u=fl(t),width:m=n,...c}=t,b={...c,align:i,CellRenderer:dl(t),HeaderCellContentRenderer:pl(t),HeaderCellLabelRenderer:bl(t),clientSideEditValidationCheck:vl(t.type)?Hl(t.type.renderer.rules):void 0,index:r+1,label:Al(u,l),name:s,originalIdx:r,serverDataType:a,valueFormatter:Cl(t,a),width:m};return wl(b)&&(b.columns=b.columns.map(v=>vt(e)(v,r))),b};function Ll(e,{column:o,moveBy:t}){let{columns:r}=e;if(typeof t=="number"){let n=r.indexOf(o),l=r.slice(),[a]=l.splice(n,1);return l.splice(n+t,0,a),{...e,columns:l}}return e}function Il(e,{columns:o}){return o.some(t=>t.hidden!==!0)?o.reduce((t,r)=>r.hidden!==!0?he(t,{type:"updateColumnProp",column:r,hidden:!0}):t,e):e}function zl(e,{columns:o}){return o.some(t=>t.hidden)?o.reduce((t,r)=>r.hidden?he(t,{type:"updateColumnProp",column:r,hidden:!1}):t,e):e}function Nl(e,{column:o,phase:t,width:r}){let n="updateColumnProp",l=t!=="end";switch(t){case"begin":return he(e,{type:n,column:o,resizing:l});case"end":return he(e,{type:n,column:o,resizing:l,width:r});case"resize":return he(e,{type:n,column:o,width:r});default:throw Error(`useTableModel.resizeColumn, invalid resizePhase ${t}`)}}function Kl(e,{tableSchema:o}){let{columns:t}=e;if(t.some(El)){let r=t.map(n=>{var a;let l=dt(n,o);return{...n,align:(a=n.align)!=null?a:pt(l),serverDataType:l}});return{...e,columns:r}}else return e}function Fl(e,o){let{columns:t}=e,{column:r,pin:n}=o,l=t.find(a=>a.name===r.name);return l?(t=pe(t,{...l,pin:n}),t=mt(t),{...e,columns:t}):e}function he(e,o){let{columns:t,tableConfig:r}=e,{align:n,column:l,hidden:a,label:i,resizing:s,width:u}=o,m=t.find(c=>c.name===l.name);if(m&&((n==="left"||n==="right")&&(t=pe(t,{...m,align:n})),typeof i=="string"&&(t=pe(t,{...m,label:i})),typeof s=="boolean"&&(t=pe(t,{...m,resizing:s})),typeof a=="boolean"&&(t=pe(t,{...m,hidden:a})),typeof u=="number")){t=pe(t,{...m,width:u});let c=r.columns.find(b=>b.name===l.name);c&&(r={...r,columns:pe(r.columns,{...c,width:u})})}return{...e,columns:t,tableConfig:r}}function ht(e,{confirmed:o,filter:t,groupBy:r,sort:n}){let l=r!==void 0,a=typeof(t==null?void 0:t.filter)=="string",i=n&&n.sortDefs.length>0,s=e;return l&&(s={...e,columns:ul(s.columns,r,o)}),i?s={...e,columns:cl(s.columns,n)}:ml(s.columns)&&(s={...e,columns:Rl(s.columns)}),a?s={...e,columns:sl(s.columns,t)}:s.columns.some(hl)&&(s={...e,columns:yl(s.columns)}),s}import{getColumnsInViewport as wt,getRowElementAtIndex as Gl,itemsChanged as Ol}from"@vuu-ui/vuu-utils";import{useCallback as ie,useEffect as $l,useImperativeHandle as Bl,useMemo as xt,useRef as oe,useState as Vl}from"react";var Wl=100,Tt=200,Rt=e=>{let{clientHeight:o,clientWidth:t,scrollHeight:r,scrollWidth:n}=e;return[n-t,r-o]},Ul=(e,o)=>{if(e!==void 0){let{scrollTop:t}=e;return o>t?"fwd":"bwd"}},yt=(e,o)=>{let{clientHeight:t,clientWidth:r,scrollHeight:n,scrollLeft:l,scrollTop:a,scrollWidth:i}=e,s=i-r,u=l/(i-r),m=n-t,c=a/(n-t),b=Ul(o,a);return b==="fwd"&&c>.99?c=1:b==="bwd"&&c<.02&&(c=0),[l,u,s,a,c,m]},_l={scrollToIndex:()=>{},scrollToKey:()=>{}},Dt=({onAttach:e,onDetach:o})=>{let t=oe(null);return ie(n=>{if(n)t.current=n,e==null||e(n);else if(t.current){let{current:l}=t;t.current=n,o==null||o(l)}},[e,o])},Ht=({columns:e,getRowAtPosition:o,onHorizontalScroll:t,onVerticalScroll:r,onVerticalScrollInSitu:n,rowHeight:l,scrollingApiRef:a,setRange:i,viewportMeasurements:s})=>{let u=oe(0),m=oe(l),c=oe(!1),b=oe({scrollTop:0,scrollLeft:0}),v=oe(!1),w=oe({scrollTop:0,scrollLeft:0}),T=oe(null),d=oe(null),g=oe(0),{appliedPageSize:h,isVirtualScroll:H,rowCount:R,totalHeaderHeight:D,viewportWidth:k}=s,M=oe([]),[,I]=Vl({}),A=oe(0);xt(()=>{let[C,P]=wt(e,b.current.scrollLeft,b.current.scrollLeft+k+Tt);A.current=P,M.current=C},[k,e]);let W=ie(C=>{if(b.current.scrollLeft=C,t==null||t(C),Math.abs(C-g.current)>Wl){g.current=C;let[P,O]=wt(e,C,C+k+Tt);Ol(M.current,P)&&(A.current=O,M.current=P,I({}))}},[e,t,k]),J=ie((C,P)=>{b.current.scrollTop=C,r==null||r(C,P);let O=o(C);O!==u.current&&(u.current=O,i({from:O,to:O+R})),n==null||n(0)},[o,r,n,i,R]),_=ie(()=>{let{current:C}=d,{current:P}=T,{current:O}=c,{current:X}=w;if(O)c.current=!1;else if(C&&P){v.current=!0;let[U,re,,B,F]=yt(P,X);X.scrollLeft=U,X.scrollTop=B;let[N,V]=Rt(P),q=Math.round(re*N),Q=F*V;C.scrollTo({left:q,top:Q,behavior:"auto"})}n==null||n(0)},[n]),Z=ie(()=>{let{current:C}=v,{current:P}=d,{current:O}=T,{current:X}=b;if(P&&O){let[U,re,B,F,N,V]=yt(P);c.current=!0,C?v.current=!1:(O.scrollLeft=Math.round(re*B),O.scrollTop=N*V),X.scrollTop!==F&&J(F,N),X.scrollLeft!==U&&W(U)}},[J,W]),z=ie(C=>{T.current=C,C.addEventListener("scroll",_,{passive:!0})},[_]),E=ie(C=>{T.current=null,C.removeEventListener("scroll",_)},[_]),te=ie(C=>{d.current=C,C.addEventListener("scroll",Z,{passive:!0})},[Z]),ne=ie(C=>{d.current=null,C.removeEventListener("scroll",Z)},[Z]),f=Dt({onAttach:te,onDetach:ne}),x=Dt({onAttach:z,onDetach:E}),y=ie(C=>{let{current:P}=d;if(P){let[O,X]=Rt(P),{scrollLeft:U,scrollTop:re}=P;if(c.current=!1,C.type==="scroll-row"){let B=Gl(P,C.rowIndex);if(B!==null){let[F,N]=Yo(B,D);if(console.log(`outside viewport ? ${F} ${N}`),F&&N)if(H){let V=F==="down"?1:-1;n==null||n(V);let q=u.current+V;u.current=q,i({from:q,to:q+R})}else{let V=U,q=re;F==="up"||F==="down"?q=Math.min(Math.max(0,re+N),X):V=Math.min(Math.max(0,U+N),O),P.scrollTo({top:q,left:V,behavior:"smooth"})}}}else if(C.type==="scroll-page"){let{direction:B}=C;if(H){let F=B==="down"?R:-R;n==null||n(F);let N=u.current+F;u.current=N,i({from:N,to:N+R})}else{let F=B==="down"?h:-h,N=Math.min(Math.max(0,re+F),X);P.scrollTo({top:N,left:U,behavior:"auto"})}}else if(C.type==="scroll-end"){let{direction:B}=C,F=B==="end"?X:0;P.scrollTo({top:F,left:P.scrollLeft,behavior:"auto"})}}},[h,H,n,i,D,R]),G=xt(()=>({scrollToIndex:C=>{if(T.current){let P=(C-30)*20;T.current.scrollTop=P}},scrollToKey:C=>{console.log(`scrollToKey ${C}`)}}),[]);return Bl(a,()=>T.current?G:_l,[G]),$l(()=>{if(l!==m.current)m.current=l,b.current.scrollTop>0&&d.current&&(d.current.scrollTop=0);else{let{current:C}=u,P={from:C,to:C+R};i(P)}},[l,i,R]),{columnsWithinViewport:M.current,scrollbarContainerRef:x,contentContainerRef:f,requestScroll:y,virtualColSpan:A.current}};import{actualRowPositioning as Xl,measurePinnedColumns as Ql,virtualRowPositioning as Jl}from"@vuu-ui/vuu-utils";import{useCallback as Mt,useMemo as ke,useRef as ao}from"react";var Zl=1e7,Yl={appliedPageSize:0,contentHeight:0,contentWidth:0,getRowAtPosition:()=>-1,getRowOffset:()=>-1,horizontalScrollbarHeight:0,isVirtualScroll:!1,pinnedWidthLeft:0,pinnedWidthRight:0,rowCount:0,setInSituRowOffset:()=>{},setScrollTop:()=>{},totalHeaderHeight:0,verticalScrollbarWidth:0,viewportBodyHeight:0,viewportWidth:0},Pt=({columns:e,headerHeight:o,headings:t,rowCount:r,rowHeight:n,selectionEndSize:l=4,size:a})=>{let i=ao(0),s=ao(0),u=Math.min(n*r,Zl),m=r*n,c=m-u,{pinnedWidthLeft:b,pinnedWidthRight:v,unpinnedWidth:w}=ke(()=>Ql(e,l),[e,l]),T=ao(o);ke(()=>{T.current=o*(1+t.length)},[o,t.length]);let[d,g,h]=ke(()=>{if(c){let[D,k,M]=Jl(n,c,s);return[A=>D(A,i.current),k,M]}else return Xl(n)},[c,n]),H=Mt((D,k)=>{s.current=k},[]),R=Mt(D=>{D===0?i.current=0:i.current=Math.max(0,i.current+D)},[]);return ke(()=>{if(a){let{current:D}=T,k=15,M=b+w+v,I=M>a.width?k:0,A=(a.height-o)/n,W=Number.isInteger(A)?A:Math.ceil(A),J=a.height-D,_=u>J?k:0,Z=W*n*(u/m),z=a.width;return{appliedPageSize:Z,contentHeight:u,contentWidth:M,getRowAtPosition:g,getRowOffset:d,isVirtualScroll:h,horizontalScrollbarHeight:I,pinnedWidthLeft:b,pinnedWidthRight:v,rowCount:W,setInSituRowOffset:R,setScrollTop:H,totalHeaderHeight:D,verticalScrollbarWidth:_,viewportBodyHeight:J,viewportWidth:z}}else return Yl},[g,d,o,h,b,w,v,u,n,R,H,a,m])};import{useLayoutProviderDispatch as jl}from"@vuu-ui/vuu-layout";import{getCalculatedColumnType as ql}from"@vuu-ui/vuu-utils";import{useCallback as be,useRef as ei,useState as oi}from"react";var Et=({availableColumns:e,onAvailableColumnsChange:o,onConfigChange:t,onCreateCalculatedColumn:r,onDataSourceConfigChange:n,tableConfig:l})=>{let a=jl(),i=ei(),[s,u]=oi(e),m=be((d,g,h)=>{a({type:"set-props",path:"#context-panel",props:{expanded:!0,content:{type:d,props:h},title:g}})},[a]),c=be(()=>{requestAnimationFrame(()=>{var d;(d=i.current)==null||d.call(i)})},[]),b=be(d=>{let g=s.concat({name:d.name,serverDataType:ql(d)});u(g),o==null||o(g),requestAnimationFrame(()=>{var h;(h=i.current)==null||h.call(i)}),r(d)},[s,o,r]),v=be(d=>{m("ColumnSettings","Column Settings",{column:d.column,onCancelCreateColumn:c,onConfigChange:t,onCreateCalculatedColumn:b,tableConfig:l,vuuTable:d.vuuTable})},[c,b,t,m,l]),w=be(()=>{v({column:{name:"::",serverDataType:"string"},type:"columnSettings",vuuTable:{module:"SIMUL",table:"instruments"}})},[v]),T=be(d=>{let g=l.columns.find(h=>h.name===d);g&&v({type:"columnSettings",column:g,vuuTable:{module:"SIMUL",table:"instruments"}})},[v,l.columns]);return i.current=be(()=>{m("TableSettings","DataGrid Settings",{availableColumns:s!=null?s:l.columns.map(({name:d,serverDataType:g})=>({name:d,serverDataType:g})),onAddCalculatedColumn:w,onConfigChange:t,onDataSourceConfigChange:n,onNavigateToColumn:T,tableConfig:l})},[s,w,T,t,n,m,l]),{showColumnSettingsPanel:v,showTableSettingsPanel:i.current}};import{getRowClassNameGenerator as ti}from"@vuu-ui/vuu-utils";import{useMemo as ni}from"react";var ri=e=>{let o=[];return e==null||e.forEach(t=>{let r=ti(t);r&&o.push(r.fn)}),(t,r)=>{let n=[];return o==null||o.forEach(l=>{let a=l(t,r);a&&n.push(a)}),n.join(" ")}},St=({rowClassNameGenerators:e})=>ni(()=>ri(e),[e]);var Ae=e=>e,{KEY:vi,IS_EXPANDED:Lt,IS_LEAF:It}=di,hi={draggable:void 0,onMouseDown:void 0},wi=()=>hi,xi=(e,o)=>({...e,columns:e.columns.concat(o)}),zt=({allowDragDrop:e=!1,availableColumns:o,config:t,containerRef:r,dataSource:n,disableFocus:l,headerHeight:a=25,highlightedIndex:i,id:s,navigationStyle:u="cell",onAvailableColumnsChange:m,onConfigChange:c,onDragStart:b,onDrop:v,onFeatureInvocation:w,onHighlight:T,onRowClick:d,onSelect:g,onSelectionChange:h,renderBufferSize:H=0,rowHeight:R=20,scrollingApiRef:D,selectionModel:k,size:M})=>{let[I,A]=Ci(n.size);if(n===void 0)throw Error("no data source provided to Vuu Table");let W=St(t),J=e?li:wi,_=At(()=>Bo(n),[n]),Z=K(p=>{A(p)},[]),{columns:z,dispatchTableModelAction:E,headings:te,tableAttributes:ne,tableConfig:f}=gt(t,n);bi(()=>{E({type:"init",tableConfig:t,dataSource:n})},[t,n,E]);let x=K(p=>{E({type:"init",tableConfig:p,dataSource:n}),c==null||c(Ae(p))},[n,E,c]),y=At(()=>ai(n.columns),[n.columns]),G=K(({tableSchema:p})=>{p?E({type:"setTableSchema",tableSchema:p}):console.log("subscription message with no schema")},[E]),{getRowAtPosition:C,getRowOffset:P,setInSituRowOffset:O,setScrollTop:X,...U}=Pt({columns:z,headerHeight:a,headings:te,rowCount:I,rowHeight:R,size:M}),re=ot({from:0,to:U.rowCount}),{data:B,dataRef:F,getSelectedRows:N,range:V,setRange:q}=et({dataSource:n,onFeatureInvocation:w,renderBufferSize:H,onSizeChange:Z,onSubscribed:G,range:re}),{requestScroll:Q,...Ie}=Ht({columns:z,getRowAtPosition:C,rowHeight:R,scrollingApiRef:D,setRange:q,onVerticalScroll:X,onVerticalScrollInSitu:O,viewportMeasurements:U}),ze=K(p=>{E({type:"init",tableConfig:p,dataSource:n}),c==null||c(Ae(p))},[n,E,c]),ye=K(p=>{n.config={...n.config,...p}},[n]);fi(()=>{n.on("config",(p,S,L)=>{((L==null?void 0:L.filterChanged)||(L==null?void 0:L.groupByChanged))&&n.range.from>0&&Q({type:"scroll-end",direction:"home"}),E({type:"tableConfig",...p,confirmed:S})})},[n,E,Q]);let me=K(p=>{n.columns=n.columns.concat(p.name),x(xi(f,p))},[n,f,x]),co=K(p=>{let{columns:S}=p,L=S.map(Y=>Y.name),$={...f,columns:f.columns.map(Y=>L.includes(Y.name)?{...Y,hidden:!0}:Y)};x($)},[f,x]),mo=K(p=>{x({...f,columns:pi(f.columns,{...p.column,pin:p.pin})})},[f,x]),{showColumnSettingsPanel:po,showTableSettingsPanel:bo}=Et({availableColumns:o!=null?o:f.columns.map(({name:p,serverDataType:S="string"})=>({name:p,serverDataType:S})),onAvailableColumnsChange:m,onConfigChange:ze,onCreateCalculatedColumn:me,onDataSourceConfigChange:ye,tableConfig:f}),Bt=K(p=>{if(bt(p))po(p);else if(ft(p))bo();else switch(p.type){case"hideColumns":return co(p);case"pinColumn":return mo(p);default:E(p)}},[E,co,mo,po,bo]),Vt=_o({dataSource:n,onPersistentColumnOperation:Bt}),Wt=K((p,S=!1,L)=>{n&&(n.sort=ii(n.sort,p,S,L))},[n]),Ne=gi(),Ut=K((p,S,L)=>{var Y,we,se;let $=z.find(ee=>ee.name===S);if($)if(p==="resize")(Y=Ne.current)==null||Y.forEach(ee=>{ee.style.width=`${L}px`});else if(p==="end")Ne.current=void 0,mi(L)&&(E({type:"resizeColumn",phase:p,column:$,width:L}),c==null||c(Ae(Xo(f,{type:"col-size",column:$,width:L}))));else{let ee=`[aria-colindex='${$.index}']`;Ne.current=Array.from((se=(we=r.current)==null?void 0:we.querySelectorAll(`.vuuTableCell${ee},.vuuTableHeaderCell${ee}`))!=null?se:[]),E({type:"resizeColumn",phase:p,column:$,width:L})}else throw Error(`useDataTable.handleColumnResize, column ${S} not found`)},[z,E,c,f,r]),_t=K((p,S)=>{var Y,we;let L=ci(S,p,y),$=p[vi];if(p[Lt]){if(n.closeTreeNode($,!0),L){let se=z.indexOf(S),ee=(Y=n.getRowsAtDepth)==null?void 0:Y.call(n,se+1);ee&&!ee.some(fe=>fe[Lt]||fe[It])&&E({type:"hideColumns",columns:z.slice(se+2)})}}else if(n.openTreeNode($),L){let se=(we=n.getChildRows)==null?void 0:we.call(n,$),ee=z.indexOf(S)+1,fe=[z[ee]];se&&se.some(Ke=>Ke[It])&&fe.push(z[ee+1]),fe.some(Ke=>Ke.hidden)&&E({type:"showColumns",columns:fe})}},[y,z,n,E]),{highlightedIndexRef:fo,navigate:Xt,onFocus:go,onKeyDown:Co,...Qt}=it({columnCount:z.filter(p=>p.hidden!==!0).length,containerRef:r,disableFocus:l,highlightedIndex:i,navigationStyle:u,requestScroll:Q,rowCount:n==null?void 0:n.size,onHighlight:T,viewportRange:V,viewportRowCount:U.rowCount}),{onBlur:Jt,onDoubleClick:Zt,onKeyDown:vo,onFocus:ho}=jo({navigate:Xt}),Yt=K(p=>{go(),p.defaultPrevented||ho(p)},[ho,go]),jt=ct({columns:z,data:B,dataSource:n,getSelectedRows:N}),qt=K(p=>{n.groupBy=p.map(S=>S.name)},[n]),en=K(p=>{ui(p)?n.groupBy=[]:n&&n.groupBy.includes(p.name)&&(n.groupBy=n.groupBy.filter(S=>S!==p.name))},[n]),on=K(p=>{n.select(p),h==null||h(p)},[n,h]),tn=K(p=>{g&&g(p===null?null:kt(p,y))},[y,g]),{onKeyDown:wo,onRowClick:xo}=ut({highlightedIndexRef:fo,onSelect:tn,onSelectionChange:on,selectionModel:k}),nn=K((p,S,L,$)=>{xo(p,S,L,$),d==null||d(p,kt(S,y))},[y,d,xo]),rn=K(p=>{Co(p),p.defaultPrevented||vo(p),p.defaultPrevented||wo(p)},[Co,vo,wo]),ln=K(p=>{let S={...f,columns:p};E({type:"init",tableConfig:S,dataSource:n}),c==null||c(Ae(S))},[n,E,c,f]),an=K(p=>{v==null||v(p)},[v]),sn=K(async(p,S,L)=>n.applyEdit(p,S,L),[n]),un=K(p=>{let{initialDragElement:S}=p,L=si(S),$=F.current.find(Y=>Y[0]===L);$&&p.setPayload($),b==null||b(p)},[F,b]),{onMouseDown:cn,draggable:mn}=J({allowDragDrop:e,containerRef:r,draggableClassName:"vuuTable",id:s,onDragStart:un,onDrop:an,orientation:"vertical",itemQuery:".vuuTableRow"});return{...Qt,"aria-rowcount":n.size,rowClassNameGenerator:W,draggableRow:mn,onBlur:Jt,onDoubleClick:Zt,onFocus:Yt,onKeyDown:rn,onMouseDown:cn,columnMap:y,columns:z,data:B,getRowOffset:P,handleContextMenuAction:Vt,headings:te,highlightedIndex:fo.current,menuBuilder:_,onContextMenu:jt,onDataEdited:sn,onMoveColumn:ln,onMoveGroupColumn:qt,onRemoveGroupColumn:en,onRowClick:nn,onSortColumn:Wt,onResizeColumn:Ut,onToggleGroup:_t,scrollProps:Ie,tableAttributes:ne,tableConfig:f,viewportMeasurements:U}};import{isValidNumber as Ti}from"@vuu-ui/vuu-utils";import{useCallback as Ri,useMemo as yi,useRef as Di,useState as Hi}from"react";var Nt=({rowHeight:e=0})=>{let[o,t]=Hi(e),r=Di(o),n=yi(()=>new ResizeObserver(a=>{for(let i of a){let[{blockSize:s}]=i.borderBoxSize,u=Math.round(s);Ti(u)&&r.current!==u&&(r.current=u,t(u))}}),[]),l=Ri(a=>{if(a){if(e===0){let{height:i}=a.getBoundingClientRect();console.log({boundingClientHeight:i}),console.log(`measured rowHeight = ${i} (${e})`),n.observe(a),t(i)}}else n.disconnect()},[n,e]);return{rowHeight:o,rowRef:l}};import{jsx as ce,jsxs as so}from"react/jsx-runtime";var ae="vuuTable",{IDX:zi,RENDER_IDX:Ni}=Ei,Ki=({Row:e=_e,allowDragDrop:o,availableColumns:t,config:r,containerRef:n,dataSource:l,disableFocus:a=!1,highlightedIndex:i,id:s,navigationStyle:u="cell",onAvailableColumnsChange:m,onConfigChange:c,onDragStart:b,onDrop:v,onFeatureInvocation:w,onHighlight:T,onRowClick:d,onSelect:g,onSelectionChange:h,renderBufferSize:H=5,rowHeight:R,scrollingApiRef:D,selectionModel:k="extended",showColumnHeaders:M=!0,showColumnHeaderMenus:I=!0,headerHeight:A=M?R*1.25:0,size:W})=>{let J=Si(s),{columnMap:_,columns:Z,data:z,draggableRow:E,getRowOffset:te,handleContextMenuAction:ne,headings:f,highlightedIndex:x,menuBuilder:y,onDataEdited:G,onMoveColumn:C,onMoveGroupColumn:P,onRemoveGroupColumn:O,onResizeColumn:X,onRowClick:U,onSortColumn:re,onToggleGroup:B,rowClassNameGenerator:F,scrollProps:N,tableAttributes:V,tableConfig:q,viewportMeasurements:Q,...Ie}=zt({allowDragDrop:o,availableColumns:t,config:r,containerRef:n,dataSource:l,disableFocus:a,headerHeight:A,highlightedIndex:i,id:J,navigationStyle:u,onAvailableColumnsChange:m,onConfigChange:c,onDragStart:b,onDrop:v,onFeatureInvocation:w,onHighlight:T,onRowClick:d,onSelect:g,onSelectionChange:h,renderBufferSize:Math.max(5,H),rowHeight:R,scrollingApiRef:D,selectionModel:k,size:W}),ze=Kt(`${ae}-contentContainer`,{[`${ae}-colLines`]:V.columnSeparators,[`${ae}-rowLines`]:V.rowSeparators,[`${ae}-zebra`]:V.zebraStripes}),ye={"--content-height":`${Q.contentHeight}px`,"--content-width":`${Q.contentWidth}px`,"--horizontal-scrollbar-height":`${Q.horizontalScrollbarHeight}px`,"--pinned-width-left":`${Q.pinnedWidthLeft}px`,"--pinned-width-right":`${Q.pinnedWidthRight}px`,"--header-height":`${A}px`,"--row-height-prop":`${R}px`,"--total-header-height":`${Q.totalHeaderHeight}px`,"--vertical-scrollbar-width":`${Q.verticalScrollbarWidth}px`,"--viewport-body-height":`${Q.viewportBodyHeight}px`};return so(Mi,{menuActionHandler:ne,menuBuilder:y,children:[ce("div",{className:`${ae}-scrollbarContainer`,ref:N.scrollbarContainerRef,style:ye,children:ce("div",{className:`${ae}-scrollbarContent`})}),ce("div",{className:ze,ref:N.contentContainerRef,style:ye,children:so("div",{...Ie,className:`${ae}-table`,role:"table",tabIndex:a?void 0:-1,children:[M?ce(Je,{columns:N.columnsWithinViewport,headings:f,onMoveColumn:C,onMoveGroupColumn:P,onRemoveGroupColumn:O,onResizeColumn:X,onSortColumn:re,showColumnHeaderMenus:I,tableConfig:q,tableId:J,virtualColSpan:N.virtualColSpan}):null,ce("div",{className:`${ae}-body`,children:z.map(me=>ce(e,{"aria-rowindex":me[0]+1,classNameGenerator:F,columnMap:_,columns:N.columnsWithinViewport,highlighted:x===me[zi],onClick:U,onDataEdited:G,row:me,offset:te(me),onToggleGroup:B,virtualColSpan:N.virtualColSpan,zebraStripes:V.zebraStripes},me[Ni]))})]})}),E]})},Zm=Ai(function({Row:o,allowDragDrop:t,availableColumns:r,className:n,config:l,dataSource:a,disableFocus:i,highlightedIndex:s,id:u,navigationStyle:m,onAvailableColumnsChange:c,onConfigChange:b,onDragStart:v,onDrop:w,onFeatureInvocation:T,onHighlight:d,onRowClick:g,onSelect:h,onSelectionChange:H,renderBufferSize:R,rowHeight:D,scrollingApiRef:k,selectionModel:M,showColumnHeaders:I,showColumnHeaderMenus:A,headerHeight:W,style:J,..._},Z){let z=Li(null),[E,te]=Ii(),{rowHeight:ne,rowRef:f}=Nt({rowHeight:D});if(l===void 0)throw Error("vuu Table requires config prop. Minimum config is list of Column Descriptors");if(a===void 0)throw Error("vuu Table requires dataSource prop");return so(Pi,{..._,className:Kt(ae,n),id:u,onResize:te,ref:ki(z,Z),children:[ce(Fo,{ref:f,height:D}),E&&ne?ce(Ki,{Row:o,allowDragDrop:t,availableColumns:r,config:l,containerRef:z,dataSource:a,disableFocus:i,headerHeight:W,highlightedIndex:s,id:u,navigationStyle:m,onAvailableColumnsChange:c,onConfigChange:b,onDragStart:v,onDrop:w,onFeatureInvocation:T,onHighlight:d,onRowClick:g,onSelect:h,onSelectionChange:H,renderBufferSize:R,rowHeight:ne,scrollingApiRef:k,selectionModel:M,showColumnHeaders:I,showColumnHeaderMenus:A,size:E}):null]})});import{memo as Fi,useCallback as Gi}from"react";import{CheckboxIcon as Oi,WarnCommit as $i}from"@vuu-ui/vuu-ui-controls";import{Checkbox as Bi}from"@salt-ds/core";import{dataColumnAndKeyUnchanged as Vi,dispatchCustomEvent as Wi,registerComponent as Ui}from"@vuu-ui/vuu-utils";import{jsx as Ft}from"react/jsx-runtime";var Gt=Fi(({column:e,columnMap:o,onCommit:t=$i,row:r})=>{let n=o[e.name],l=!!r[n],a=Gi(i=>async s=>{let u=await t(i);return u===!0&&Wi(s.target,"vuu-commit"),u},[t]);return e.editable?Ft(Bi,{checked:l,onClick:a(!l)}):Ft(Oi,{checked:l,disabled:!0})},Vi);Gt.displayName="CheckboxCell";Ui("checkbox-cell",Gt,"cell-renderer",{serverDataType:"boolean"});import{registerComponent as _i}from"@vuu-ui/vuu-utils";import{Input as Xi}from"@salt-ds/core";import{useEditableText as Qi}from"@vuu-ui/vuu-ui-controls";import Ji from"clsx";import{jsx as uo}from"react/jsx-runtime";var Le="vuuTableInputCell",Zi=()=>(console.warn("onCommit handler has not been provided to InputCell cell renderer"),Promise.resolve(!0)),Yi=({column:e,columnMap:o,onCommit:t=Zi,row:r})=>{let n=o[e.name],l=r[n],{align:a="left",clientSideEditValidationCheck:i}=e,{warningMessage:s,...u}=Qi({initialValue:l,onCommit:t,clientSideEditValidationCheck:i}),m=s&&a==="left"?uo("span",{className:`${Le}-icon`,"data-icon":"error"}):void 0,c=s&&a==="right"?uo("span",{className:`${Le}-icon`,"data-icon":"error"}):void 0;return uo(Xi,{...u,className:Ji(Le,{[`${Le}-error`]:s!==void 0}),endAdornment:m,startAdornment:c})};_i("input-cell",Yi,"cell-renderer",{userCanAssign:!1});import{WarnCommit as ji}from"@vuu-ui/vuu-ui-controls";import{dataColumnAndKeyUnchanged as qi,dispatchCustomEvent as ea,isTypeDescriptor as oa,isValueListRenderer as ta,registerComponent as na}from"@vuu-ui/vuu-utils";import ra from"clsx";import{memo as la,useCallback as ia}from"react";import{CycleStateButton as aa}from"@vuu-ui/vuu-ui-controls";import{jsx as ca}from"react/jsx-runtime";var Ot="vuuTableToggleCell",sa=({name:e,type:o})=>{if(oa(o)&&ta(o.renderer))return o.renderer.values;throw Error(`useLookupValues column ${e} has not been configured with a values list`)},ua=la(function({column:o,columnMap:t,onCommit:r=ji,row:n}){let l=sa(o),a=t[o.name],i=n[a],s=ia((u,m)=>r(m).then(c=>(c===!0&&ea(u.target,"vuu-commit"),c)),[r]);return ca(aa,{className:ra(Ot,`${Ot}-${o.name}`),onCommit:s,value:i,values:l,variant:"cta",children:i})},qi);na("toggle-cell",ua,"cell-renderer",{userCanAssign:!1});import{useStateRef as ma}from"@vuu-ui/vuu-ui-controls";import{dispatchMouseEvent as da}from"@vuu-ui/vuu-utils";import{useCallback as $t,useRef as pa}from"react";var Vd=(e,o)=>{let t=pa(null),[r,n]=ma(e),l=$t(i=>{var s;if(i.key==="ArrowDown")n((u=-1)=>Math.min(o-1,u+1));else if(i.key==="ArrowUp")n((u=-1)=>Math.max(0,u-1));else if(i.key==="Enter"||i.key===" "){let{current:u}=r,m=(s=t.current)==null?void 0:s.querySelector(`[aria-rowindex="${u}"]`);m&&da(m,"click")}},[r,o,n]),a=$t(i=>{n(i)},[n]);return{highlightedIndexRef:r,onHighlight:a,onKeyDown:l,tableRef:t}};export{Gt as CheckboxCell,Ve as GroupHeaderCell,Ve as GroupHeaderCellNext,So as HeaderCell,Yi as InputCell,Zm as Table,Lo as TableCell,Io as TableGroupCell,ua as ToggleCell,bt as isShowColumnSettings,ft as isShowTableSettings,_l as noScrolling,Xo as updateTableConfig,Vd as useControlledTableNavigation,gt as useTableModel,Ht as useTableScroll,Pt as useTableViewport};
 //# sourceMappingURL=index.js.map