@vuu-ui/vuu-table 0.13.6 → 0.13.8

package/esm/header-cell/HeaderCell.js

@@ -1,105 +0,0 @@
-import { jsx, jsxs } from 'react/jsx-runtime';
-import { useComponentCssInjection } from '@salt-ds/styles';
-import { useWindow } from '@salt-ds/window';
-import { ColumnMenu } from '@vuu-ui/vuu-table-extras';
-import cx from 'clsx';
-import { useRef, useMemo, useCallback } from 'react';
-import { SortIndicator } from '../column-header-pill/SortIndicator.js';
-import { ColumnResizer } from '../column-resizing/ColumnResizer.js';
-import { useTableColumnResize } from '../column-resizing/useTableColumnResize.js';
-import { useCell } from '../useCell.js';
-import headerCellCss from './HeaderCell.css.js';
-
-const classBase = "vuuTableHeaderCell";
-const HeaderCell = ({
-  className: classNameProp,
-  column,
-  onClick,
-  onResize,
-  showColumnHeaderMenus = true,
-  ...htmlAttributes
-}) => {
-  const targetWindow = useWindow();
-  useComponentCssInjection({
-    testId: "vuu-header-cell",
-    css: headerCellCss,
-    window: targetWindow
-  });
-  const { HeaderCellContentRenderer, HeaderCellLabelRenderer } = column;
-  const rootRef = useRef(null);
-  const { isResizing, ...resizeProps } = useTableColumnResize({
-    column,
-    onResize,
-    rootRef
-  });
-  const headerItems = useMemo(() => {
-    const sortIndicator = /* @__PURE__ */ jsx(SortIndicator, { column });
-    const columnLabel = HeaderCellLabelRenderer ? /* @__PURE__ */ jsx(
-      HeaderCellLabelRenderer,
-      {
-        className: `${classBase}-label`,
-        column
-      }
-    ) : /* @__PURE__ */ jsx("div", { className: `${classBase}-label`, children: column.label ?? column.name });
-    const columnContent = HeaderCellContentRenderer ? [/* @__PURE__ */ jsx(HeaderCellContentRenderer, { column }, "content")] : [];
-    if (showColumnHeaderMenus) {
-      const menuPermissions = showColumnHeaderMenus === true ? void 0 : showColumnHeaderMenus;
-      const columnMenu = /* @__PURE__ */ jsx(ColumnMenu, { column, menuPermissions });
-      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,
-    showColumnHeaderMenus
-  ]);
-  const handleClick = useCallback(
-    (evt) => {
-      !isResizing && onClick?.(evt);
-    },
-    [isResizing, onClick]
-  );
-  const handleKeyDown = useCallback(
-    (evt) => {
-      if (evt.key === "Enter") {
-        onClick?.(evt);
-      }
-    },
-    [onClick]
-  );
-  const { className, style } = useCell(column, classBase, true);
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      ...htmlAttributes,
-      "aria-colindex": column.ariaColIndex,
-      "aria-label": `${column.label ?? column.name} column header`,
-      className: cx(className, classNameProp, {
-        [`${classBase}-resizing`]: isResizing,
-        [`${classBase}-noMenu`]: showColumnHeaderMenus === false
-      }),
-      onClick: handleClick,
-      onKeyDown: handleKeyDown,
-      ref: rootRef,
-      role: "columnheader",
-      style,
-      children: [
-        ...headerItems,
-        column.resizeable !== false ? /* @__PURE__ */ jsx(ColumnResizer, { ...resizeProps }) : null
-      ]
-    }
-  );
-};
-
-export { HeaderCell };
-//# sourceMappingURL=HeaderCell.js.map

package/esm/header-cell/HeaderCell.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"HeaderCell.js","sources":["../../src/header-cell/HeaderCell.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { ColumnMenu } from \"@vuu-ui/vuu-table-extras\";\nimport { HeaderCellProps } from \"@vuu-ui/vuu-table-types\";\nimport cx from \"clsx\";\nimport {\n  KeyboardEventHandler,\n  MouseEventHandler,\n  useCallback,\n  useMemo,\n  useRef,\n} from \"react\";\nimport { SortIndicator } from \"../column-header-pill\";\nimport { ColumnResizer, useTableColumnResize } from \"../column-resizing\";\nimport { useCell } from \"../useCell\";\n\nimport headerCellCss from \"./HeaderCell.css\";\n\nconst classBase = \"vuuTableHeaderCell\";\n\nexport const HeaderCell = ({\n  className: classNameProp,\n  column,\n  onClick,\n  onResize,\n  showColumnHeaderMenus = true,\n  ...htmlAttributes\n}: HeaderCellProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-header-cell\",\n    css: headerCellCss,\n    window: targetWindow,\n  });\n\n  const { HeaderCellContentRenderer, HeaderCellLabelRenderer } = column;\n  const rootRef = useRef<HTMLDivElement>(null);\n  const { isResizing, ...resizeProps } = useTableColumnResize({\n    column,\n    onResize,\n    rootRef,\n  });\n\n  const headerItems = useMemo(() => {\n    const sortIndicator = <SortIndicator column={column} />;\n    const columnLabel = HeaderCellLabelRenderer ? (\n      <HeaderCellLabelRenderer\n        className={`${classBase}-label`}\n        column={column}\n      />\n    ) : (\n      <div className={`${classBase}-label`}>{column.label ?? column.name}</div>\n    );\n    const columnContent = HeaderCellContentRenderer\n      ? [<HeaderCellContentRenderer column={column} key=\"content\" />]\n      : [];\n\n    if (showColumnHeaderMenus) {\n      const menuPermissions =\n        showColumnHeaderMenus === true ? undefined : showColumnHeaderMenus;\n      const columnMenu = (\n        <ColumnMenu column={column} menuPermissions={menuPermissions} />\n      );\n\n      if (column.align === \"right\") {\n        return [sortIndicator, columnLabel, columnContent, columnMenu];\n      } else {\n        return [columnMenu, columnLabel, sortIndicator, columnContent];\n      }\n    } else {\n      if (column.align === \"right\") {\n        return [sortIndicator, columnLabel, columnContent];\n      } else {\n        return [columnLabel, sortIndicator, columnContent];\n      }\n    }\n  }, [\n    HeaderCellContentRenderer,\n    HeaderCellLabelRenderer,\n    column,\n    showColumnHeaderMenus,\n  ]);\n\n  const handleClick = useCallback<MouseEventHandler<HTMLDivElement>>(\n    (evt) => {\n      !isResizing && onClick?.(evt);\n    },\n    [isResizing, onClick],\n  );\n\n  const handleKeyDown = useCallback<KeyboardEventHandler<HTMLDivElement>>(\n    (evt) => {\n      if (evt.key === \"Enter\") {\n        onClick?.(evt);\n      }\n    },\n    [onClick],\n  );\n\n  const { className, style } = useCell(column, classBase, true);\n\n  return (\n    <div\n      {...htmlAttributes}\n      aria-colindex={column.ariaColIndex}\n      aria-label={`${column.label ?? column.name} column header`}\n      className={cx(className, classNameProp, {\n        [`${classBase}-resizing`]: isResizing,\n        [`${classBase}-noMenu`]: showColumnHeaderMenus === false,\n      })}\n      onClick={handleClick}\n      onKeyDown={handleKeyDown}\n      ref={rootRef}\n      role=\"columnheader\"\n      style={style}\n    >\n      {...headerItems}\n      {column.resizeable !== false ? <ColumnResizer {...resizeProps} /> : null}\n    </div>\n  );\n};\n"],"names":[],"mappings":"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"}

package/esm/pagination/PaginationControl.css.js

@@ -1,4 +0,0 @@
-var paginationControlCss = ".vuuPaginationControl {\n  align-items: center;\n  display: flex;\n  height: var(--vuuPaginationControl-height, auto);\n  justify-content: flex-end;\n  padding: 0 var(--salt-spacing-100);\n  .saltButton {\n    .saltIcon {\n      display: block !important;\n    }\n  }\n}\n";
-
-export { paginationControlCss as default };
-//# sourceMappingURL=PaginationControl.css.js.map

package/esm/pagination/PaginationControl.css.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"PaginationControl.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/esm/pagination/PaginationControl.js

@@ -1,36 +0,0 @@
-import { jsx, jsxs } from 'react/jsx-runtime';
-import { useComponentCssInjection } from '@salt-ds/styles';
-import { useWindow } from '@salt-ds/window';
-import { Pagination, GoToInput, Paginator } from '@salt-ds/core';
-import cx from 'clsx';
-import { usePagination } from './usePagination.js';
-import paginationControlCss from './PaginationControl.css.js';
-import { forwardRef } from 'react';
-
-const classBase = "vuuPaginationControl";
-const PaginationControl = forwardRef(function PaginationControl2({ className, dataSource, ...htmlAttributes }, forwardedRef) {
-  const targetWindow = useWindow();
-  useComponentCssInjection({
-    testId: "vuu-table",
-    css: paginationControlCss,
-    window: targetWindow
-  });
-  const { onPageChange, pageCount } = usePagination({
-    dataSource
-  });
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      ...htmlAttributes,
-      className: cx(classBase, className),
-      ref: forwardedRef,
-      children: /* @__PURE__ */ jsxs(Pagination, { count: pageCount, onPageChange, children: [
-        /* @__PURE__ */ jsx(GoToInput, {}),
-        /* @__PURE__ */ jsx(Paginator, {})
-      ] })
-    }
-  );
-});
-
-export { PaginationControl };
-//# sourceMappingURL=PaginationControl.js.map

package/esm/pagination/PaginationControl.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"PaginationControl.js","sources":["../../src/pagination/PaginationControl.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { GoToInput, Pagination, Paginator } from \"@salt-ds/core\";\nimport cx from \"clsx\";\nimport { usePagination } from \"./usePagination\";\n\nimport paginationControlCss from \"./PaginationControl.css\";\nimport { HtmlHTMLAttributes, forwardRef } from \"react\";\nimport { DataSource } from \"@vuu-ui/vuu-data-types\";\n\nconst classBase = \"vuuPaginationControl\";\n\nexport interface PaginationControlProps\n  extends HtmlHTMLAttributes<HTMLDivElement> {\n  dataSource: DataSource;\n}\n\nexport const PaginationControl = forwardRef<\n  HTMLDivElement,\n  PaginationControlProps\n>(function PaginationControl(\n  { className, dataSource, ...htmlAttributes },\n  forwardedRef,\n) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-table\",\n    css: paginationControlCss,\n    window: targetWindow,\n  });\n\n  const { onPageChange, pageCount } = usePagination({\n    dataSource,\n  });\n\n  return (\n    <div\n      {...htmlAttributes}\n      className={cx(classBase, className)}\n      ref={forwardedRef}\n    >\n      <Pagination count={pageCount} onPageChange={onPageChange}>\n        <GoToInput />\n        <Paginator />\n      </Pagination>\n    </div>\n  );\n});\n"],"names":["PaginationControl"],"mappings":";;;;;;;;;AAUA,MAAM,SAAY,GAAA,sBAAA;AAOL,MAAA,iBAAA,GAAoB,UAG/B,CAAA,SAASA,kBACT,CAAA,EAAE,WAAW,UAAY,EAAA,GAAG,cAAe,EAAA,EAC3C,YACA,EAAA;AACA,EAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,WAAA;AAAA,IACR,GAAK,EAAA,oBAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EAAA,MAAM,EAAE,YAAA,EAAc,SAAU,EAAA,GAAI,aAAc,CAAA;AAAA,IAChD;AAAA,GACD,CAAA;AAED,EACE,uBAAA,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACE,GAAG,cAAA;AAAA,MACJ,SAAA,EAAW,EAAG,CAAA,SAAA,EAAW,SAAS,CAAA;AAAA,MAClC,GAAK,EAAA,YAAA;AAAA,MAEL,QAAC,kBAAA,IAAA,CAAA,UAAA,EAAA,EAAW,KAAO,EAAA,SAAA,EAAW,YAC5B,EAAA,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,SAAU,EAAA,EAAA,CAAA;AAAA,4BACV,SAAU,EAAA,EAAA;AAAA,OACb,EAAA;AAAA;AAAA,GACF;AAEJ,CAAC;;;;"}

package/esm/pagination/usePagination.js

@@ -1,34 +0,0 @@
-import { useState, useMemo, useCallback } from 'react';
-import { Range } from '@vuu-ui/vuu-utils';
-
-const getPageCount = (dataSource) => {
-  const { range, size } = dataSource;
-  const pageSize = range.to - range.from;
-  if (pageSize > 0) {
-    return Math.ceil(size / pageSize);
-  } else {
-    return 0;
-  }
-};
-const usePagination = ({ dataSource }) => {
-  const [pageCount, setPageCount] = useState(getPageCount(dataSource));
-  useMemo(() => {
-    dataSource.on("page-count", (n) => setPageCount(n));
-  }, [dataSource]);
-  const handlePageChange = useCallback(
-    (_evt, page) => {
-      const { range } = dataSource;
-      const pageSize = range.to - range.from;
-      const firstRow = pageSize * (page - 1);
-      dataSource.range = Range(firstRow, firstRow + pageSize);
-    },
-    [dataSource]
-  );
-  return {
-    onPageChange: handlePageChange,
-    pageCount
-  };
-};
-
-export { usePagination };
-//# sourceMappingURL=usePagination.js.map

package/esm/pagination/usePagination.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"usePagination.js","sources":["../../src/pagination/usePagination.ts"],"sourcesContent":["import { SyntheticEvent, useCallback, useMemo, useState } from \"react\";\nimport { DataSource } from \"@vuu-ui/vuu-data-types\";\nimport { Range } from \"@vuu-ui/vuu-utils\";\n\nexport interface PaginationHookProps {\n  dataSource: DataSource;\n}\n\nconst getPageCount = (dataSource: DataSource) => {\n  const { range, size } = dataSource;\n  const pageSize = range.to - range.from;\n  if (pageSize > 0) {\n    return Math.ceil(size / pageSize);\n  } else {\n    return 0;\n  }\n};\n\nexport const usePagination = ({ dataSource }: PaginationHookProps) => {\n  const [pageCount, setPageCount] = useState<number>(getPageCount(dataSource));\n\n  useMemo(() => {\n    dataSource.on(\"page-count\", (n: number) => setPageCount(n));\n  }, [dataSource]);\n\n  const handlePageChange = useCallback(\n    (_evt: SyntheticEvent, page: number) => {\n      const { range } = dataSource;\n      const pageSize = range.to - range.from;\n      const firstRow = pageSize * (page - 1);\n      dataSource.range = Range(firstRow, firstRow + pageSize);\n    },\n    [dataSource],\n  );\n\n  return {\n    onPageChange: handlePageChange,\n    pageCount,\n  };\n};\n"],"names":[],"mappings":";;;AAQA,MAAM,YAAA,GAAe,CAAC,UAA2B,KAAA;AAC/C,EAAM,MAAA,EAAE,KAAO,EAAA,IAAA,EAAS,GAAA,UAAA;AACxB,EAAM,MAAA,QAAA,GAAW,KAAM,CAAA,EAAA,GAAK,KAAM,CAAA,IAAA;AAClC,EAAA,IAAI,WAAW,CAAG,EAAA;AAChB,IAAO,OAAA,IAAA,CAAK,IAAK,CAAA,IAAA,GAAO,QAAQ,CAAA;AAAA,GAC3B,MAAA;AACL,IAAO,OAAA,CAAA;AAAA;AAEX,CAAA;AAEO,MAAM,aAAgB,GAAA,CAAC,EAAE,UAAA,EAAsC,KAAA;AACpE,EAAA,MAAM,CAAC,SAAW,EAAA,YAAY,IAAI,QAAiB,CAAA,YAAA,CAAa,UAAU,CAAC,CAAA;AAE3E,EAAA,OAAA,CAAQ,MAAM;AACZ,IAAA,UAAA,CAAW,GAAG,YAAc,EAAA,CAAC,CAAc,KAAA,YAAA,CAAa,CAAC,CAAC,CAAA;AAAA,GAC5D,EAAG,CAAC,UAAU,CAAC,CAAA;AAEf,EAAA,MAAM,gBAAmB,GAAA,WAAA;AAAA,IACvB,CAAC,MAAsB,IAAiB,KAAA;AACtC,MAAM,MAAA,EAAE,OAAU,GAAA,UAAA;AAClB,MAAM,MAAA,QAAA,GAAW,KAAM,CAAA,EAAA,GAAK,KAAM,CAAA,IAAA;AAClC,MAAM,MAAA,QAAA,GAAW,YAAY,IAAO,GAAA,CAAA,CAAA;AACpC,MAAA,UAAA,CAAW,KAAQ,GAAA,KAAA,CAAM,QAAU,EAAA,QAAA,GAAW,QAAQ,CAAA;AAAA,KACxD;AAAA,IACA,CAAC,UAAU;AAAA,GACb;AAEA,EAAO,OAAA;AAAA,IACL,YAAc,EAAA,gBAAA;AAAA,IACd;AAAA,GACF;AACF;;;;"}

package/esm/table-cell/TableCell.css.js

@@ -1,4 +0,0 @@
-var tableCellCss = ".vuuTableCell {\n  border-right-color: var(--cell-borderColor);\n  border-right-style: solid;\n  border-right-width: 1px;\n  /* unfortunately inline-flex doesn't play nice with text-overflow ellipsis */\n  display: inline-block;\n  white-space: nowrap;\n  height: 100%;\n  overflow: hidden;\n  padding: var(--vuuTableCell-padding, 0 11px 0 12px);\n  text-overflow: ellipsis;\n  vertical-align: top;\n}\n\n.vuuTableCell-right {\n  text-align: right;\n}\n\n.vuuTableCell-editable {\n  align-items: center;\n  display: inline-flex;\n  text-overflow: unset;\n}\n\n.vuuTableCell:focus {\n  outline: var(\n    --vuuTableCell-outline,\n    solid var(--salt-focused-outlineColor) 2px\n  );\n  outline-offset: -2px;\n  /** This is to achieve a white background to outline dashes */\n  box-shadow: inset 0 0 0 var(--cell-outline-width) white;\n  border-bottom: none;\n}\n\n.vuuTableRow-selected .vuuTableCell:not(.vuuTableCell-editable):focus {\n  outline: var(\n    --vuuTableCell-outline,\n    solid var(--salt-focused-outlineColor) 2px\n  );\n\n  &:has(.vuuCheckboxRowSelector) {\n    outline: none;\n  }\n}\n.vuuTableCell-editable:focus {\n  outline: none;\n}\n";
-
-export { tableCellCss as default };
-//# sourceMappingURL=TableCell.css.js.map

package/esm/table-cell/TableCell.css.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"TableCell.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/esm/table-cell/TableCell.js

@@ -1,93 +0,0 @@
-import { jsx } from 'react/jsx-runtime';
-import { getTypedValue } from '@vuu-ui/vuu-utils';
-import { useComponentCssInjection } from '@salt-ds/styles';
-import { useWindow } from '@salt-ds/window';
-import { useState, useCallback } from 'react';
-import { useCell } from '../useCell.js';
-import { useHighlighting } from '../useHighlighting.js';
-import tableCellCss from './TableCell.css.js';
-
-const classBase = "vuuTableCell";
-const TableCell = ({
-  column,
-  columnMap,
-  onClick,
-  onDataEdited,
-  row,
-  searchPattern = ""
-}) => {
-  const targetWindow = useWindow();
-  useComponentCssInjection({
-    testId: "vuu-table-cell",
-    css: tableCellCss,
-    window: targetWindow
-  });
-  const [hasError, setHasError] = useState(false);
-  const { className, style } = useCell(column, classBase, false, hasError);
-  const { ariaColIndex, CellRenderer, valueFormatter } = column;
-  const dataIdx = columnMap[column.name];
-  const handleDataItemEdited = useCallback(
-    (editState, editPhase) => {
-      if (editPhase === "commit") {
-        const { serverDataType = "string" } = column;
-        if (onDataEdited) {
-          const typedValue = getTypedValue(
-            String(editState.value),
-            serverDataType,
-            true
-          );
-          return onDataEdited({
-            ...editState,
-            row,
-            columnName: column.name,
-            value: typedValue
-          });
-        } else {
-          throw Error(
-            "TableCell onDataEdited prop not supplied for an editable cell"
-          );
-        }
-      } else {
-        setHasError(editState.isValid === false);
-        onDataEdited({
-          ...editState,
-          row,
-          columnName: column.name
-        });
-        return void 0;
-      }
-    },
-    [column, onDataEdited, row]
-  );
-  const handleClick = useCallback(
-    (evt) => {
-      onClick?.(evt, column);
-    },
-    [column, onClick]
-  );
-  const value = valueFormatter(row[dataIdx]);
-  const valueWithHighlighting = useHighlighting(value, searchPattern);
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      "aria-colindex": ariaColIndex,
-      className,
-      onClick: onClick ? handleClick : void 0,
-      role: "cell",
-      style,
-      children: CellRenderer ? /* @__PURE__ */ jsx(
-        CellRenderer,
-        {
-          column,
-          columnMap,
-          onEdit: handleDataItemEdited,
-          row,
-          searchPattern
-        }
-      ) : valueWithHighlighting
-    }
-  );
-};
-
-export { TableCell };
-//# sourceMappingURL=TableCell.js.map

package/esm/table-cell/TableCell.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"TableCell.js","sources":["../../src/table-cell/TableCell.tsx"],"sourcesContent":["import type {\n  DataItemEditHandler,\n  TableCellProps,\n} from \"@vuu-ui/vuu-table-types\";\nimport { getTypedValue } from \"@vuu-ui/vuu-utils\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { MouseEventHandler, useCallback, useState } from \"react\";\nimport { useCell } from \"../useCell\";\nimport { useHighlighting } from \"../useHighlighting\";\n\nimport tableCellCss from \"./TableCell.css\";\n\nconst classBase = \"vuuTableCell\";\n\nexport const TableCell = ({\n  column,\n  columnMap,\n  onClick,\n  onDataEdited,\n  row,\n  searchPattern = \"\",\n}: TableCellProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-table-cell\",\n    css: tableCellCss,\n    window: targetWindow,\n  });\n\n  const [hasError, setHasError] = useState(false);\n\n  const { className, style } = useCell(column, classBase, false, hasError);\n  const { ariaColIndex, CellRenderer, valueFormatter } = column;\n  const dataIdx = columnMap[column.name];\n\n  const handleDataItemEdited = useCallback<DataItemEditHandler>(\n    (editState, editPhase) => {\n      if (editPhase === \"commit\") {\n        const { serverDataType = \"string\" } = column;\n        if (onDataEdited) {\n          const typedValue = getTypedValue(\n            String(editState.value),\n            serverDataType,\n            true,\n          );\n          return onDataEdited({\n            ...editState,\n            row,\n            columnName: column.name,\n            value: typedValue,\n          });\n        } else {\n          throw Error(\n            \"TableCell onDataEdited prop not supplied for an editable cell\",\n          );\n        }\n      } else {\n        setHasError(editState.isValid === false);\n        onDataEdited({\n          ...editState,\n          row,\n          columnName: column.name,\n        });\n        return undefined;\n      }\n    },\n    [column, onDataEdited, row],\n  );\n\n  const handleClick = useCallback<MouseEventHandler>(\n    (evt) => {\n      onClick?.(evt, column);\n    },\n    [column, onClick],\n  );\n\n  const value = valueFormatter(row[dataIdx]);\n  const valueWithHighlighting = useHighlighting(value, searchPattern);\n\n  return (\n    <div\n      aria-colindex={ariaColIndex}\n      className={className}\n      onClick={onClick ? handleClick : undefined}\n      role=\"cell\"\n      style={style}\n    >\n      {CellRenderer ? (\n        <CellRenderer\n          column={column}\n          columnMap={columnMap}\n          onEdit={handleDataItemEdited}\n          row={row}\n          searchPattern={searchPattern}\n        />\n      ) : (\n        valueWithHighlighting\n      )}\n    </div>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;AAaA,MAAM,SAAY,GAAA,cAAA;AAEX,MAAM,YAAY,CAAC;AAAA,EACxB,MAAA;AAAA,EACA,SAAA;AAAA,EACA,OAAA;AAAA,EACA,YAAA;AAAA,EACA,GAAA;AAAA,EACA,aAAgB,GAAA;AAClB,CAAsB,KAAA;AACpB,EAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,gBAAA;AAAA,IACR,GAAK,EAAA,YAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EAAA,MAAM,CAAC,QAAA,EAAU,WAAW,CAAA,GAAI,SAAS,KAAK,CAAA;AAE9C,EAAM,MAAA,EAAE,WAAW,KAAM,EAAA,GAAI,QAAQ,MAAQ,EAAA,SAAA,EAAW,OAAO,QAAQ,CAAA;AACvE,EAAA,MAAM,EAAE,YAAA,EAAc,YAAc,EAAA,cAAA,EAAmB,GAAA,MAAA;AACvD,EAAM,MAAA,OAAA,GAAU,SAAU,CAAA,MAAA,CAAO,IAAI,CAAA;AAErC,EAAA,MAAM,oBAAuB,GAAA,WAAA;AAAA,IAC3B,CAAC,WAAW,SAAc,KAAA;AACxB,MAAA,IAAI,cAAc,QAAU,EAAA;AAC1B,QAAM,MAAA,EAAE,cAAiB,GAAA,QAAA,EAAa,GAAA,MAAA;AACtC,QAAA,IAAI,YAAc,EAAA;AAChB,UAAA,MAAM,UAAa,GAAA,aAAA;AAAA,YACjB,MAAA,CAAO,UAAU,KAAK,CAAA;AAAA,YACtB,cAAA;AAAA,YACA;AAAA,WACF;AACA,UAAA,OAAO,YAAa,CAAA;AAAA,YAClB,GAAG,SAAA;AAAA,YACH,GAAA;AAAA,YACA,YAAY,MAAO,CAAA,IAAA;AAAA,YACnB,KAAO,EAAA;AAAA,WACR,CAAA;AAAA,SACI,MAAA;AACL,UAAM,MAAA,KAAA;AAAA,YACJ;AAAA,WACF;AAAA;AACF,OACK,MAAA;AACL,QAAY,WAAA,CAAA,SAAA,CAAU,YAAY,KAAK,CAAA;AACvC,QAAa,YAAA,CAAA;AAAA,UACX,GAAG,SAAA;AAAA,UACH,GAAA;AAAA,UACA,YAAY,MAAO,CAAA;AAAA,SACpB,CAAA;AACD,QAAO,OAAA,KAAA,CAAA;AAAA;AACT,KACF;AAAA,IACA,CAAC,MAAQ,EAAA,YAAA,EAAc,GAAG;AAAA,GAC5B;AAEA,EAAA,MAAM,WAAc,GAAA,WAAA;AAAA,IAClB,CAAC,GAAQ,KAAA;AACP,MAAA,OAAA,GAAU,KAAK,MAAM,CAAA;AAAA,KACvB;AAAA,IACA,CAAC,QAAQ,OAAO;AAAA,GAClB;AAEA,EAAA,MAAM,KAAQ,GAAA,cAAA,CAAe,GAAI,CAAA,OAAO,CAAC,CAAA;AACzC,EAAM,MAAA,qBAAA,GAAwB,eAAgB,CAAA,KAAA,EAAO,aAAa,CAAA;AAElE,EACE,uBAAA,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,eAAe,EAAA,YAAA;AAAA,MACf,SAAA;AAAA,MACA,OAAA,EAAS,UAAU,WAAc,GAAA,KAAA,CAAA;AAAA,MACjC,IAAK,EAAA,MAAA;AAAA,MACL,KAAA;AAAA,MAEC,QACC,EAAA,YAAA,mBAAA,GAAA;AAAA,QAAC,YAAA;AAAA,QAAA;AAAA,UACC,MAAA;AAAA,UACA,SAAA;AAAA,UACA,MAAQ,EAAA,oBAAA;AAAA,UACR,GAAA;AAAA,UACA;AAAA;AAAA,OAGF,GAAA;AAAA;AAAA,GAEJ;AAEJ;;;;"}

package/esm/table-cell/TableGroupCell.css.js

@@ -1,4 +0,0 @@
-var tableGroupCellCss = ".vuuTableGroupCell.vuuTableCell {\n  --group-cell-spacer-width: 20px;\n  align-items: center;\n  border-right-color: var(\n    --vuuTableGroupCell-borderColor,\n    var(--salt-separable-tertiary-borderColor)\n  );\n  border-right-style: solid;\n  border-right-width: 1px;\n\n  cursor: pointer;\n  display: inline-flex;\n  line-height: 16px;\n\n  .vuuIcon {\n    --vuu-icon-height: 20px;\n    --vuu-icon-width: 20px;\n    margin-right: var(--salt-spacing-100);\n    min-width: 20px;\n  }\n\n  .vuuTableGroupCell-toggle {\n    --vuu-icon-height: 16px;\n    --vuu-icon-size: 7px;\n    --vuu-icon-width: 8px;\n    margin-right: 4px;\n    transition: transform 0.25s;\n    transform: var(--toggle-icon-transform);\n  }\n\n  .vuuTableGroupCell-label {\n    overflow: hidden;\n    text-overflow: ellipsis;\n  }\n}\n\n[aria-level=\"2\"] {\n  --indent: 1;\n}\n[aria-level=\"3\"] {\n  --indent: 2;\n}\n[aria-level=\"4\"] {\n  --indent: 3;\n}\n[aria-level=\"5\"] {\n  --indent: 4;\n}\n[aria-level=\"6\"] {\n  --indent: 5;\n}\n[aria-level=\"7\"] {\n  --indent: 6;\n}\n[aria-level=\"8\"] {\n  --indent: 7;\n}\n[aria-level=\"9\"] {\n  --indent: 8;\n}\n[aria-level=\"10\"] {\n  --indent: 9;\n}\n\n.vuuTableGroupCell-spacer {\n  display: inline-block;\n  min-width: calc(var(--indent, 0) * var(--group-cell-spacer-width));\n}\n\n.vuuTreeTable {\n  .vuuTableGroupCell.vuuTableCell {\n    border-right: none;\n  } \n}";
-
-export { tableGroupCellCss as default };
-//# sourceMappingURL=TableGroupCell.css.js.map

package/esm/table-cell/TableGroupCell.css.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"TableGroupCell.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/esm/table-cell/TableGroupCell.js

@@ -1,64 +0,0 @@
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { ToggleIconButton, Icon } from '@vuu-ui/vuu-ui-controls';
-import { getGroupValue, getGroupIcon, metadataKeys } from '@vuu-ui/vuu-utils';
-import { useComponentCssInjection } from '@salt-ds/styles';
-import { useWindow } from '@salt-ds/window';
-import cx from 'clsx';
-import { useCallback } from 'react';
-import { useCell } from '../useCell.js';
-import tableCellCss from './TableCell.css.js';
-import tableGroupCellCss from './TableGroupCell.css.js';
-import { useHighlighting } from '../useHighlighting.js';
-
-const { COUNT, IS_EXPANDED, IS_LEAF } = metadataKeys;
-const classBase = "vuuTableGroupCell";
-const TableGroupCell = ({
-  column,
-  columnMap,
-  onClick,
-  row,
-  searchPattern = ""
-}) => {
-  const targetWindow = useWindow();
-  useComponentCssInjection({
-    testId: "vuu-table-cell",
-    css: tableCellCss,
-    window: targetWindow
-  });
-  useComponentCssInjection({
-    testId: "vuu-table-group-cell",
-    css: tableGroupCellCss,
-    window: targetWindow
-  });
-  const { columns } = column;
-  const value = getGroupValue(columns, row, columnMap);
-  const valueWithHighlighting = useHighlighting(value || "", searchPattern);
-  const icon = getGroupIcon(columns, row);
-  const { className, style } = useCell(column, classBase);
-  const handleClick = useCallback(
-    (evt) => {
-      onClick?.(evt, column);
-    },
-    [column, onClick]
-  );
-  const { [COUNT]: count, [IS_EXPANDED]: isExpanded, [IS_LEAF]: isLeaf } = row;
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      "aria-colindex": 1,
-      className: cx(className, "vuuTableCell"),
-      role: "cell",
-      style,
-      onClick: isLeaf ? void 0 : handleClick,
-      children: [
-        /* @__PURE__ */ jsx("span", { className: `${classBase}-spacer` }),
-        isLeaf || count == 0 ? null : /* @__PURE__ */ jsx(ToggleIconButton, { isExpanded }),
-        icon ? /* @__PURE__ */ jsx(Icon, { name: icon }) : null,
-        /* @__PURE__ */ jsx("span", { className: `${classBase}-label`, children: valueWithHighlighting })
-      ]
-    }
-  );
-};
-
-export { TableGroupCell };
-//# sourceMappingURL=TableGroupCell.js.map

package/esm/table-cell/TableGroupCell.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"TableGroupCell.js","sources":["../../src/table-cell/TableGroupCell.tsx"],"sourcesContent":["import { GroupColumnDescriptor, TableCellProps } from \"@vuu-ui/vuu-table-types\";\nimport { Icon, ToggleIconButton } from \"@vuu-ui/vuu-ui-controls\";\nimport { getGroupIcon, getGroupValue, metadataKeys } from \"@vuu-ui/vuu-utils\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport cx from \"clsx\";\nimport { MouseEvent, useCallback } from \"react\";\nimport { useCell } from \"../useCell\";\n\nimport tableCellCss from \"./TableCell.css\";\nimport tableGroupCellCss from \"./TableGroupCell.css\";\nimport { useHighlighting } from \"../useHighlighting\";\n\nconst { COUNT, IS_EXPANDED, IS_LEAF } = metadataKeys;\n\nconst classBase = \"vuuTableGroupCell\";\n\nexport const TableGroupCell = ({\n  column,\n  columnMap,\n  onClick,\n  row,\n  searchPattern = \"\",\n}: TableCellProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-table-cell\",\n    css: tableCellCss,\n    window: targetWindow,\n  });\n  useComponentCssInjection({\n    testId: \"vuu-table-group-cell\",\n    css: tableGroupCellCss,\n    window: targetWindow,\n  });\n\n  const { columns } = column as GroupColumnDescriptor;\n  const value = getGroupValue(columns, row, columnMap);\n  const valueWithHighlighting = useHighlighting(value || \"\", searchPattern);\n\n  const icon = getGroupIcon(columns, row);\n  const { className, style } = useCell(column, classBase);\n\n  const handleClick = useCallback(\n    (evt: MouseEvent<HTMLDivElement>) => {\n      onClick?.(evt, column);\n    },\n    [column, onClick],\n  );\n\n  const { [COUNT]: count, [IS_EXPANDED]: isExpanded, [IS_LEAF]: isLeaf } = row;\n\n  return (\n    <div\n      aria-colindex={1}\n      className={cx(className, \"vuuTableCell\")}\n      role=\"cell\"\n      style={style}\n      onClick={isLeaf ? undefined : handleClick}\n    >\n      <span className={`${classBase}-spacer`} />\n      {isLeaf || count == 0 ? null : (\n        <ToggleIconButton isExpanded={isExpanded} />\n      )}\n      {icon ? <Icon name={icon} /> : null}\n      <span className={`${classBase}-label`}>{valueWithHighlighting}</span>\n    </div>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;;;AAaA,MAAM,EAAE,KAAA,EAAO,WAAa,EAAA,OAAA,EAAY,GAAA,YAAA;AAExC,MAAM,SAAY,GAAA,mBAAA;AAEX,MAAM,iBAAiB,CAAC;AAAA,EAC7B,MAAA;AAAA,EACA,SAAA;AAAA,EACA,OAAA;AAAA,EACA,GAAA;AAAA,EACA,aAAgB,GAAA;AAClB,CAAsB,KAAA;AACpB,EAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,gBAAA;AAAA,IACR,GAAK,EAAA,YAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AACD,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,sBAAA;AAAA,IACR,GAAK,EAAA,iBAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EAAM,MAAA,EAAE,SAAY,GAAA,MAAA;AACpB,EAAA,MAAM,KAAQ,GAAA,aAAA,CAAc,OAAS,EAAA,GAAA,EAAK,SAAS,CAAA;AACnD,EAAA,MAAM,qBAAwB,GAAA,eAAA,CAAgB,KAAS,IAAA,EAAA,EAAI,aAAa,CAAA;AAExE,EAAM,MAAA,IAAA,GAAO,YAAa,CAAA,OAAA,EAAS,GAAG,CAAA;AACtC,EAAA,MAAM,EAAE,SAAW,EAAA,KAAA,EAAU,GAAA,OAAA,CAAQ,QAAQ,SAAS,CAAA;AAEtD,EAAA,MAAM,WAAc,GAAA,WAAA;AAAA,IAClB,CAAC,GAAoC,KAAA;AACnC,MAAA,OAAA,GAAU,KAAK,MAAM,CAAA;AAAA,KACvB;AAAA,IACA,CAAC,QAAQ,OAAO;AAAA,GAClB;AAEA,EAAA,MAAM,EAAE,CAAC,KAAK,GAAG,KAAO,EAAA,CAAC,WAAW,GAAG,UAAY,EAAA,CAAC,OAAO,GAAG,QAAW,GAAA,GAAA;AAEzE,EACE,uBAAA,IAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,eAAe,EAAA,CAAA;AAAA,MACf,SAAA,EAAW,EAAG,CAAA,SAAA,EAAW,cAAc,CAAA;AAAA,MACvC,IAAK,EAAA,MAAA;AAAA,MACL,KAAA;AAAA,MACA,OAAA,EAAS,SAAS,KAAY,CAAA,GAAA,WAAA;AAAA,MAE9B,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,MAAK,EAAA,EAAA,SAAA,EAAW,CAAG,EAAA,SAAS,CAAW,OAAA,CAAA,EAAA,CAAA;AAAA,QACvC,UAAU,KAAS,IAAA,CAAA,GAAI,IACtB,mBAAA,GAAA,CAAC,oBAAiB,UAAwB,EAAA,CAAA;AAAA,QAE3C,IAAO,mBAAA,GAAA,CAAC,IAAK,EAAA,EAAA,IAAA,EAAM,MAAM,CAAK,GAAA,IAAA;AAAA,4BAC9B,MAAK,EAAA,EAAA,SAAA,EAAW,CAAG,EAAA,SAAS,UAAW,QAAsB,EAAA,qBAAA,EAAA;AAAA;AAAA;AAAA,GAChE;AAEJ;;;;"}

package/esm/table-config.js

@@ -1,33 +0,0 @@
-import { getRuntimeColumnWidth } from '@vuu-ui/vuu-utils';
-
-const updateTableConfig = (config, action) => {
-  switch (action.type) {
-    case "col-size": {
-      const { columns: runtimeColumns, width } = action;
-      const isFit = config.columnLayout === "fit";
-      return {
-        ...config,
-        columnLayout: isFit ? "manual" : config.columnLayout,
-        columns: config.columns.map((col) => {
-          if (isFit) {
-            return col.name === action.column.name ? { ...col, width } : col.width ? col : { ...col, width: getRuntimeColumnWidth(col, runtimeColumns) };
-          } else {
-            return 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;
-  }
-};
-
-export { updateTableConfig };
-//# sourceMappingURL=table-config.js.map

package/esm/table-config.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"table-config.js","sources":["../src/table-config.ts"],"sourcesContent":["import {\n  ColumnDescriptor,\n  RuntimeColumnDescriptor,\n  TableConfig,\n} from \"@vuu-ui/vuu-table-types\";\nimport { getRuntimeColumnWidth } from \"@vuu-ui/vuu-utils\";\n\nexport type MoveColumnTableConfigAction = {\n  type: \"col-move\";\n  column: ColumnDescriptor;\n  fromIndex: number;\n  toIndex: number;\n};\n\nexport type ResizeColumnTableConfigAction = {\n  type: \"col-size\";\n  column: ColumnDescriptor;\n  columns: RuntimeColumnDescriptor[];\n  width: number;\n};\n\nexport type SubscribeColumnTableConfigAction = {\n  type: \"subscribed\";\n  column: ColumnDescriptor;\n  value: boolean;\n};\n\nexport type UpdateColumnPropertyTableConfigAction = {\n  type: \"column-prop\";\n  column: ColumnDescriptor;\n  property: keyof ColumnDescriptor;\n  value: boolean | number | string;\n};\n\nexport type TableConfigAction =\n  | MoveColumnTableConfigAction\n  | ResizeColumnTableConfigAction\n  | UpdateColumnPropertyTableConfigAction;\n\nexport const updateTableConfig = (\n  config: TableConfig,\n  action: TableConfigAction,\n): TableConfig => {\n  switch (action.type) {\n    case \"col-size\": {\n      const { columns: runtimeColumns, width } = action;\n      const isFit = config.columnLayout === \"fit\";\n      return {\n        ...config,\n        columnLayout: isFit ? \"manual\" : config.columnLayout,\n        columns: config.columns.map((col) => {\n          if (isFit) {\n            // When user resizes a column and 'fit' column layout is in effect,\n            // column layout becomes 'manual' and all columns are set to\n            // their current widths (unless subsequently resized by user).\n            return col.name === action.column.name\n              ? { ...col, width }\n              : col.width\n                ? col\n                : { ...col, width: getRuntimeColumnWidth(col, runtimeColumns) };\n          } else {\n            return col.name === action.column.name\n              ? { ...col, width: action.width }\n              : col;\n          }\n        }),\n      };\n    }\n    case \"column-prop\":\n      return {\n        ...config,\n        columns: config.columns.map((col) =>\n          col.name === action.column.name\n            ? { ...col, [action.property]: action.value }\n            : col,\n        ),\n      };\n\n    default:\n      return config;\n  }\n};\n"],"names":[],"mappings":";;AAuCa,MAAA,iBAAA,GAAoB,CAC/B,MAAA,EACA,MACgB,KAAA;AAChB,EAAA,QAAQ,OAAO,IAAM;AAAA,IACnB,KAAK,UAAY,EAAA;AACf,MAAA,MAAM,EAAE,OAAA,EAAS,cAAgB,EAAA,KAAA,EAAU,GAAA,MAAA;AAC3C,MAAM,MAAA,KAAA,GAAQ,OAAO,YAAiB,KAAA,KAAA;AACtC,MAAO,OAAA;AAAA,QACL,GAAG,MAAA;AAAA,QACH,YAAA,EAAc,KAAQ,GAAA,QAAA,GAAW,MAAO,CAAA,YAAA;AAAA,QACxC,OAAS,EAAA,MAAA,CAAO,OAAQ,CAAA,GAAA,CAAI,CAAC,GAAQ,KAAA;AACnC,UAAA,IAAI,KAAO,EAAA;AAIT,YAAO,OAAA,GAAA,CAAI,SAAS,MAAO,CAAA,MAAA,CAAO,OAC9B,EAAE,GAAG,KAAK,KAAM,EAAA,GAChB,IAAI,KACF,GAAA,GAAA,GACA,EAAE,GAAG,GAAA,EAAK,OAAO,qBAAsB,CAAA,GAAA,EAAK,cAAc,CAAE,EAAA;AAAA,WAC7D,MAAA;AACL,YAAO,OAAA,GAAA,CAAI,IAAS,KAAA,MAAA,CAAO,MAAO,CAAA,IAAA,GAC9B,EAAE,GAAG,GAAK,EAAA,KAAA,EAAO,MAAO,CAAA,KAAA,EACxB,GAAA,GAAA;AAAA;AACN,SACD;AAAA,OACH;AAAA;AACF,IACA,KAAK,aAAA;AACH,MAAO,OAAA;AAAA,QACL,GAAG,MAAA;AAAA,QACH,OAAA,EAAS,OAAO,OAAQ,CAAA,GAAA;AAAA,UAAI,CAAC,GAC3B,KAAA,GAAA,CAAI,IAAS,KAAA,MAAA,CAAO,OAAO,IACvB,GAAA,EAAE,GAAG,GAAA,EAAK,CAAC,MAAO,CAAA,QAAQ,GAAG,MAAA,CAAO,OACpC,GAAA;AAAA;AACN,OACF;AAAA,IAEF;AACE,MAAO,OAAA,MAAA;AAAA;AAEb;;;;"}

package/esm/table-dom-utils.js

@@ -1,181 +0,0 @@
-const headerCellQuery = (colIdx) => `.vuuTable-col-headers .vuuTableHeaderCell[aria-colindex='${colIdx}']`;
-const dataCellQuery = (ariaRowIdx, ariaColIdx) => `.vuuTable-table [aria-rowindex='${ariaRowIdx}'] > [aria-colindex='${ariaColIdx}']`;
-const getLevelUp = (containerRef, cellPos) => {
-  const cell = getTableCell(containerRef, cellPos);
-  let row = cell?.parentElement;
-  const level = parseInt(row?.ariaLevel ?? "1");
-  if (level > 1) {
-    const targetLevel = `${level - 1}`;
-    while (row !== null && row.ariaLevel !== targetLevel) {
-      row = row.previousElementSibling;
-    }
-    if (row) {
-      const nextRowIndex = parseInt(row.ariaRowIndex ?? "- 1");
-      if (nextRowIndex !== -1) {
-        return [nextRowIndex, 1];
-      }
-    }
-  }
-  return cellPos;
-};
-const getTableCell = (containerRef, [rowIdx, colIdx]) => {
-  const cssQuery = dataCellQuery(rowIdx, colIdx);
-  const cell = containerRef.current?.querySelector(cssQuery);
-  if (cellIsEditable(cell)) {
-    const focusableContent = cell.querySelector(
-      `button,input[type="checkbox"]`
-    );
-    return focusableContent || cell;
-  } else {
-    return cell;
-  }
-};
-const getFocusedCell = (el) => {
-  if (el?.role == "cell" || el?.role === "columnheader") {
-    return el;
-  } else {
-    return el?.closest(
-      "[role='columnHeader'],[role='cell']"
-    );
-  }
-};
-const cellIsEditable = (cell) => cell?.classList.contains("vuuTableCell-editable");
-const cellDropdownShowing = (cell) => {
-  if (cellIsEditable(cell)) {
-    return cell?.querySelector('.saltDropdown[aria-expanded="true"]') !== null;
-  }
-  return false;
-};
-const cellIsGroupCell = (cell) => cell?.classList.contains("vuuTableGroupCell");
-const rowIsExpanded = (cell) => {
-  switch (cell.parentElement?.ariaExpanded) {
-    case "true":
-      return true;
-    case "false":
-      return false;
-    default:
-      return void 0;
-  }
-};
-const cellIsTextInput = (cell) => cell.querySelector(".vuuTableInputCell") !== null;
-const getAriaRowIndex = (rowElement) => {
-  const rowIndex = rowElement?.ariaRowIndex;
-  if (rowIndex != null) {
-    const index = parseInt(rowIndex);
-    if (!isNaN(index)) {
-      return index;
-    }
-  }
-  return -1;
-};
-const getAriaColIndex = (cellElement) => {
-  const colIndex = cellElement?.ariaColIndex;
-  if (colIndex != null) {
-    const index = parseInt(colIndex);
-    if (!isNaN(index)) {
-      return index;
-    }
-  }
-  return -1;
-};
-const getRowElementByAriaIndex = (container, rowIndex) => {
-  if (rowIndex === -1) {
-    return null;
-  } else {
-    const activeRow = container.querySelector(
-      `[aria-rowindex="${rowIndex}"]`
-    );
-    if (activeRow) {
-      return activeRow;
-    } else {
-      throw Error(
-        `getRowElementAtIndex no row found for index index ${rowIndex}`
-      );
-    }
-  }
-};
-const getAriaCellPos = (tableCell) => {
-  const focusedRow = tableCell.closest("[role='row']");
-  return [getAriaRowIndex(focusedRow), getAriaColIndex(tableCell)];
-};
-const closestRow = (el) => el.closest('[role="row"]');
-const closestRowIndex = (el) => getAriaRowIndex(closestRow(el));
-function getNextCellPos(key, [rowIdx, colIdx], columnCount, maxRowIndex) {
-  if (key === "ArrowUp") {
-    if (rowIdx > -1) {
-      return [rowIdx - 1, colIdx];
-    } else {
-      return [rowIdx, colIdx];
-    }
-  } else if (key === "ArrowDown") {
-    if (rowIdx === -1) {
-      return [1, colIdx];
-    } else if (rowIdx === maxRowIndex) {
-      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];
-}
-const getTreeNodeOperation = (containerRef, navigationStyle, cellPos, key, shiftKey) => {
-  const cell = getTableCell(containerRef, cellPos);
-  if (navigationStyle === "cell" && !cellIsGroupCell(cell)) {
-    return void 0;
-  }
-  if (navigationStyle == "cell" && !shiftKey) {
-    return void 0;
-  }
-  if (cellIsGroupCell(cell)) {
-    const isExpanded = rowIsExpanded(cell);
-    if (isExpanded === true) {
-      if (key === "ArrowLeft") {
-        return "collapse";
-      }
-    } else if (isExpanded === false) {
-      if (key === "ArrowRight") {
-        return "expand";
-      } else if (key === "ArrowLeft") {
-        return "level-up";
-      }
-    } else if (key === "ArrowLeft") {
-      return "level-up";
-    }
-  }
-};
-const NO_SCROLL_NECESSARY = [void 0, void 0];
-const howFarIsRowOutsideViewport = (rowEl, totalHeaderHeight, contentContainer = rowEl.closest(".vuuTable-contentContainer")) => {
-  if (contentContainer) {
-    const viewport = 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");
-  }
-};
-
-export { cellDropdownShowing, cellIsEditable, cellIsTextInput, closestRowIndex, dataCellQuery, getAriaCellPos, getAriaColIndex, getAriaRowIndex, getFocusedCell, getLevelUp, getNextCellPos, getRowElementByAriaIndex, getTableCell, getTreeNodeOperation, headerCellQuery, howFarIsRowOutsideViewport };
-//# sourceMappingURL=table-dom-utils.js.map