@vuu-ui/vuu-table 0.8.34 → 0.8.35

package/esm/header-cell/HeaderCell.css

@@ -1,146 +0,0 @@
-.vuuTableGroupHeaderCell,
-.vuuTableHeaderCell {
-  --cell-align: 'flex-start';
-  --vuuColumnHeaderPill-margin: 0;
-  --vuuColumnHeaderPill-flex: 0 0 24px;
-
-  align-items: center;
-  background-color: var(--vuuTableHeaderCell-background, inherit);
-  border-bottom: 1px solid #ccc;
-  border-right-color: var(--cell-borderColor);
-  border-right-style: solid;
-  border-right-width: 1px;
-  box-sizing: border-box;
-  cursor: default;
-  display: inline-flex;
-  gap: 4px;
-  height: var(--header-height);
-  padding: 0 12px 0 4px;
-  position: relative;
-  vertical-align: top;
-}
-
-.vuuTableHeaderCell:focus {
-  outline: var(--vuuTableCell-outline, solid var(--salt-focused-outlineColor) 2px);
-  outline-offset: -3px;
-}
-
-.vuuTableHeaderCell-right {
-    --columnResizer-left: 0;
-    --vuuTable-columnMenu-margin: 0;
-    --vuuColumnHeaderPill-margin: 0 3px 0 0;
-    --column-menu-left: 2px;
-    justify-content: flex-end;
-    padding: 0 3px 0 12px;
-}
-
-.vuuTableHeaderCell-noMenu {
-  padding-left: var(--salt-spacing-300)
-}
-
-.vuuTableHeaderCell-label {
-  flex: 0 1 auto;
-  line-height: calc(var(--header-height) - 1px);
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-
-.vuuTableHeaderCell-right .vuuTableHeaderCell-label {
-  text-align: right;
-}
-
-.vuuTableHeaderCell-resizing {
-  --columnResizeThumb-color: var(--vuu-color-purple-10);
-  --columnResizer-color: var(--vuu-color-purple-10);
-  --columnResizer-height: var(--table-height);
-}
-
-.vuuTableHeaderCell.vuuPinLeft {
-  padding-left: 2px;
-}
-
-  .vuuTableHeaderCell.vuuPinLeft.vuuEndPin .vuuColumnResizer:before {
-    --height: calc(var(--table-height) - var(--horizontal-scrollbar-height));
-    --inset-r: calc(var(--pin-width) - 2px);
-    --inset-b: calc(var(--height) - 2px);
-    --clip-path: polygon(
-      0% 0%,                              
-      0% 120%,                            
-      2px 120%,    
-      2px 2px,      
-      var(--inset-r) 2px,      
-      var(--inset-r) var(--inset-b),      
-      2px var(--inset-b),      
-      2px 120%,     
-      120% 120%,    
-      120% 0%       
-    );
-    background-color: transparent;
-    border-color:   var(--vuuTablePinnedColumn-borderColor, var(--salt-container-primary-borderColor));
-    border-width: 1px;
-    border-style: solid solid solid solid;
-    /* border-radius: 0 6px 6px 0; */
-    border-radius: 4px;
-    box-shadow: 2px 1px 4px 0px rgba(0, 0, 0, 0.10);
-    /* clip-path: inset(10px 10px 10px 10px); */
-    clip-path: var(--clip-path);
-    content: '';
-    position: absolute;
-    width: var(--pin-width);
-    top:0;
-    bottom:0;
-    right: 3px;
-    height: var(--height);
-    z-index: -5;
-}
-
-.vuuTableHeaderCell.vuuPinRight.vuuEndPin .vuuColumnResizer:before {
-  --height: calc(var(--table-height) - var(--horizontal-scrollbar-height));
-  --inset-r: calc(var(--pin-width) - 2px);
-  --inset-b: calc(var(--height) - 2px);
-  --clip-path: polygon(
-    -20% 0%,                              
-    -20% 120%,                            
-    2px 120%,    
-    2px 2px,      
-    var(--inset-r) 2px,      
-    var(--inset-r) var(--inset-b),      
-    2px var(--inset-b),      
-    2px 120%,     
-    120% 120%,    
-    120% 0%       
-  );
-  background-color: transparent;
-  border-color: #A9AAAD;
-  border-width: 1px;
-  border-style: solid solid solid solid;
-  /* border-radius: 0 6px 6px 0; */
-  border-radius: 4px;
-  box-shadow: -2px 1px 4px 0px rgba(0, 0, 0, 0.10);
-  /* clip-path: inset(10px 10px 10px 10px); */
-  clip-path: var(--clip-path);
-  content: '';
-  position: absolute;
-  width: var(--pin-width);
-  top:0;
-  bottom:0;
-  right: 0px;
-  height: var(--height);
-  z-index: -5;
-}
-
-.vuuTableHeaderCell.vuuDraggable-dragAway {
-    display: none;
-}
-
-.vuuTable-headingCell {
-  background: var(--dataTable-background);
-  border-color: var(--salt-separable-tertiary-borderColor);
-  border-style: solid solid solid none;
-  border-width: 1px;
-  color: var(--salt-text-secondary-foreground);
-  display: inline-block;
-  height: var(--header-height);
-  padding: 0 !important;
-}

package/esm/header-cell/HeaderCell.js

@@ -1,98 +0,0 @@
-import { jsx, jsxs } from 'react/jsx-runtime';
-import { useContextMenu } from '@vuu-ui/vuu-popups';
-import cx from 'clsx';
-import { useRef, useMemo, useCallback } from 'react';
-import { SortIndicator } from '../column-header-pill/SortIndicator.js';
-import { ColumnMenu } from '../column-menu/ColumnMenu.js';
-import { ColumnResizer } from '../column-resizing/ColumnResizer.js';
-import { useTableColumnResize } from '../column-resizing/useTableColumnResize.js';
-import { useCell } from '../useCell.js';
-
-const classBase = "vuuTableHeaderCell";
-const HeaderCell = ({
-  className: classNameProp,
-  column,
-  onClick,
-  onResize,
-  showMenu = true,
-  ...htmlAttributes
-}) => {
-  const { HeaderCellContentRenderer, HeaderCellLabelRenderer } = column;
-  const rootRef = useRef(null);
-  const { isResizing, ...resizeProps } = useTableColumnResize({
-    column,
-    onResize,
-    rootRef
-  });
-  const [showContextMenu] = useContextMenu();
-  const handleContextMenu = useMemo(() => {
-    if (showMenu) {
-      return void 0;
-    } else {
-      return (e) => showContextMenu(e, "column-menu", { column });
-    }
-  }, [column, showContextMenu, showMenu]);
-  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 (showMenu) {
-      const columnMenu = /* @__PURE__ */ jsx(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 = 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,
-      className: cx(className, classNameProp, {
-        [`${classBase}-resizing`]: isResizing,
-        [`${classBase}-noMenu`]: showMenu === false
-      }),
-      onClick: handleClick,
-      onContextMenu: handleContextMenu,
-      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 { useContextMenu } from \"@vuu-ui/vuu-popups\";\nimport { HeaderCellProps } from \"@vuu-ui/vuu-table-types\";\nimport cx from \"clsx\";\nimport {\n  KeyboardEventHandler,\n  MouseEvent,\n  MouseEventHandler,\n  useCallback,\n  useMemo,\n  useRef,\n} from \"react\";\nimport { SortIndicator } from \"../column-header-pill\";\nimport { ColumnMenu } from \"../column-menu\";\nimport { ColumnResizer, useTableColumnResize } from \"../column-resizing\";\nimport { useCell } from \"../useCell\";\n\nimport \"./HeaderCell.css\";\n\nconst classBase = \"vuuTableHeaderCell\";\n\nexport const HeaderCell = ({\n  className: classNameProp,\n  column,\n  onClick,\n  onResize,\n  showMenu = true,\n  ...htmlAttributes\n}: HeaderCellProps) => {\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 [showContextMenu] = useContextMenu();\n\n  const handleContextMenu = useMemo(() => {\n    if (showMenu) {\n      return undefined;\n    } else {\n      return (e: MouseEvent) => showContextMenu(e, \"column-menu\", { column });\n    }\n  }, [column, showContextMenu, showMenu]);\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 (showMenu) {\n      const columnMenu = <ColumnMenu column={column} />;\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  }, [HeaderCellContentRenderer, HeaderCellLabelRenderer, column, showMenu]);\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      className={cx(className, classNameProp, {\n        [`${classBase}-resizing`]: isResizing,\n        [`${classBase}-noMenu`]: showMenu === false,\n      })}\n      onClick={handleClick}\n      onContextMenu={handleContextMenu}\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":";;;;;;;;;;AAkBA,MAAM,SAAY,GAAA,oBAAA,CAAA;AAEX,MAAM,aAAa,CAAC;AAAA,EACzB,SAAW,EAAA,aAAA;AAAA,EACX,MAAA;AAAA,EACA,OAAA;AAAA,EACA,QAAA;AAAA,EACA,QAAW,GAAA,IAAA;AAAA,EACX,GAAG,cAAA;AACL,CAAuB,KAAA;AACrB,EAAM,MAAA,EAAE,yBAA2B,EAAA,uBAAA,EAA4B,GAAA,MAAA,CAAA;AAC/D,EAAM,MAAA,OAAA,GAAU,OAAuB,IAAI,CAAA,CAAA;AAC3C,EAAA,MAAM,EAAE,UAAA,EAAY,GAAG,WAAA,KAAgB,oBAAqB,CAAA;AAAA,IAC1D,MAAA;AAAA,IACA,QAAA;AAAA,IACA,OAAA;AAAA,GACD,CAAA,CAAA;AAED,EAAM,MAAA,CAAC,eAAe,CAAA,GAAI,cAAe,EAAA,CAAA;AAEzC,EAAM,MAAA,iBAAA,GAAoB,QAAQ,MAAM;AACtC,IAAA,IAAI,QAAU,EAAA;AACZ,MAAO,OAAA,KAAA,CAAA,CAAA;AAAA,KACF,MAAA;AACL,MAAA,OAAO,CAAC,CAAkB,KAAA,eAAA,CAAgB,GAAG,aAAe,EAAA,EAAE,QAAQ,CAAA,CAAA;AAAA,KACxE;AAAA,GACC,EAAA,CAAC,MAAQ,EAAA,eAAA,EAAiB,QAAQ,CAAC,CAAA,CAAA;AAEtC,EAAM,MAAA,WAAA,GAAc,QAAQ,MAAM;AAChC,IAAM,MAAA,aAAA,mBAAiB,GAAA,CAAA,aAAA,EAAA,EAAc,MAAgB,EAAA,CAAA,CAAA;AACrD,IAAA,MAAM,cAAc,uBAClB,mBAAA,GAAA;AAAA,MAAC,uBAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAW,GAAG,SAAS,CAAA,MAAA,CAAA;AAAA,QACvB,MAAA;AAAA,OAAA;AAAA,KACF,mBAEC,GAAA,CAAA,KAAA,EAAA,EAAI,SAAW,EAAA,CAAA,EAAG,SAAS,CAAW,MAAA,CAAA,EAAA,QAAA,EAAA,MAAA,CAAO,KAAS,IAAA,MAAA,CAAO,IAAK,EAAA,CAAA,CAAA;AAErE,IAAM,MAAA,aAAA,GAAgB,4BAClB,iBAAC,GAAA,CAAC,6BAA0B,MAAoB,EAAA,EAAA,SAAU,CAAE,CAAA,GAC5D,EAAC,CAAA;AAEL,IAAA,IAAI,QAAU,EAAA;AACZ,MAAM,MAAA,UAAA,mBAAc,GAAA,CAAA,UAAA,EAAA,EAAW,MAAgB,EAAA,CAAA,CAAA;AAE/C,MAAI,IAAA,MAAA,CAAO,UAAU,OAAS,EAAA;AAC5B,QAAA,OAAO,CAAC,aAAA,EAAe,WAAa,EAAA,aAAA,EAAe,UAAU,CAAA,CAAA;AAAA,OACxD,MAAA;AACL,QAAA,OAAO,CAAC,UAAA,EAAY,WAAa,EAAA,aAAA,EAAe,aAAa,CAAA,CAAA;AAAA,OAC/D;AAAA,KACK,MAAA;AACL,MAAI,IAAA,MAAA,CAAO,UAAU,OAAS,EAAA;AAC5B,QAAO,OAAA,CAAC,aAAe,EAAA,WAAA,EAAa,aAAa,CAAA,CAAA;AAAA,OAC5C,MAAA;AACL,QAAO,OAAA,CAAC,WAAa,EAAA,aAAA,EAAe,aAAa,CAAA,CAAA;AAAA,OACnD;AAAA,KACF;AAAA,KACC,CAAC,yBAAA,EAA2B,uBAAyB,EAAA,MAAA,EAAQ,QAAQ,CAAC,CAAA,CAAA;AAEzE,EAAA,MAAM,WAAc,GAAA,WAAA;AAAA,IAClB,CAAC,GAAQ,KAAA;AACP,MAAC,CAAA,UAAA,IAAc,UAAU,GAAG,CAAA,CAAA;AAAA,KAC9B;AAAA,IACA,CAAC,YAAY,OAAO,CAAA;AAAA,GACtB,CAAA;AAEA,EAAA,MAAM,aAAgB,GAAA,WAAA;AAAA,IACpB,CAAC,GAAQ,KAAA;AACP,MAAI,IAAA,GAAA,CAAI,QAAQ,OAAS,EAAA;AACvB,QAAA,OAAA,GAAU,GAAG,CAAA,CAAA;AAAA,OACf;AAAA,KACF;AAAA,IACA,CAAC,OAAO,CAAA;AAAA,GACV,CAAA;AAEA,EAAA,MAAM,EAAE,SAAW,EAAA,KAAA,KAAU,OAAQ,CAAA,MAAA,EAAQ,WAAW,IAAI,CAAA,CAAA;AAE5D,EACE,uBAAA,IAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACE,GAAG,cAAA;AAAA,MACJ,SAAA,EAAW,EAAG,CAAA,SAAA,EAAW,aAAe,EAAA;AAAA,QACtC,CAAC,CAAA,EAAG,SAAS,CAAA,SAAA,CAAW,GAAG,UAAA;AAAA,QAC3B,CAAC,CAAA,EAAG,SAAS,CAAA,OAAA,CAAS,GAAG,QAAa,KAAA,KAAA;AAAA,OACvC,CAAA;AAAA,MACD,OAAS,EAAA,WAAA;AAAA,MACT,aAAe,EAAA,iBAAA;AAAA,MACf,SAAW,EAAA,aAAA;AAAA,MACX,GAAK,EAAA,OAAA;AAAA,MACL,IAAK,EAAA,cAAA;AAAA,MACL,KAAA;AAAA,MAEC,QAAA,EAAA;AAAA,QAAG,GAAA,WAAA;AAAA,QACH,OAAO,UAAe,KAAA,KAAA,uBAAS,aAAe,EAAA,EAAA,GAAG,aAAa,CAAK,GAAA,IAAA;AAAA,OAAA;AAAA,KAAA;AAAA,GACtE,CAAA;AAEJ;;;;"}

package/esm/index.js

@@ -1,14 +0,0 @@
-export { GroupHeaderCell, GroupHeaderCell as GroupHeaderCellNext } from './header-cell/GroupHeaderCell.js';
-export { HeaderCell } from './header-cell/HeaderCell.js';
-export { Table } from './Table.js';
-export { TableCell } from './table-cell/TableCell.js';
-export { TableGroupCell } from './table-cell/TableGroupCell.js';
-export { updateTableConfig } from './table-config.js';
-export { CheckboxCell } from './cell-renderers/checkbox-cell/CheckboxCell.js';
-export { InputCell } from './cell-renderers/input-cell/InputCell.js';
-export { ToggleCell } from './cell-renderers/toggle-cell/ToggleCell.js';
-export { useControlledTableNavigation } from './useControlledTableNavigation.js';
-export { isShowColumnSettings, isShowTableSettings, useTableModel } from './useTableModel.js';
-export { noScrolling, useTableScroll } from './useTableScroll.js';
-export { useTableViewport } from './useTableViewport.js';
-//# sourceMappingURL=index.js.map

package/esm/index.js.map

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

package/esm/moving-window.js

@@ -1,59 +0,0 @@
-import { WindowRange, isRowSelectedLast, metadataKeys } from '@vuu-ui/vuu-utils';
-
-const { SELECTED } = metadataKeys;
-class MovingWindow {
-  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[SELECTED]) {
-        const previousRow = this.data[internalIndex - 1];
-        if (isRowSelectedLast(previousRow)) {
-          this.data[internalIndex - 1] = previousRow.slice();
-          this.data[internalIndex - 1][SELECTED] -= 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[SELECTED] !== 0);
-  }
-}
-
-export { MovingWindow };
-//# sourceMappingURL=moving-window.js.map

package/esm/moving-window.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"moving-window.js","sources":["../src/moving-window.ts"],"sourcesContent":["import { DataSourceRow } from \"@vuu-ui/vuu-data-types\";\nimport {\n  isRowSelectedLast,\n  metadataKeys,\n  WindowRange,\n} from \"@vuu-ui/vuu-utils\";\nimport { VuuRange } from \"@vuu-ui/vuu-protocol-types\";\n\nconst { SELECTED } = metadataKeys;\n\nexport class MovingWindow {\n  public data: DataSourceRow[];\n  public rowCount = 0;\n  private range: WindowRange;\n\n  constructor({ from, to }: VuuRange) {\n    this.range = new WindowRange(from, to);\n    //internal data is always 0 based, we add range.from to determine an offset\n    this.data = new Array(Math.max(0, to - from));\n    this.rowCount = 0;\n  }\n\n  setRowCount = (rowCount: number) => {\n    if (rowCount < this.data.length) {\n      this.data.length = rowCount;\n    }\n\n    this.rowCount = rowCount;\n  };\n\n  add(data: DataSourceRow) {\n    const [index] = data;\n    if (this.isWithinRange(index)) {\n      const internalIndex = index - this.range.from;\n      this.data[internalIndex] = data;\n\n      // Hack until we can deal with this more elegantly. When we have a block\n      // select operation, first row is selected (and updated via server), then\n      // remaining rows are selected when we select the block-end row. We get an\n      // update for all rows except first. Because we're extending the select status\n      // on the client, we have to adjust the first row selected (its still selected\n      // but is no longer the 'last selected row in block')\n      // Maybe answer is to apply ALL the selection status code here, not in Viewport\n      if (data[SELECTED]) {\n        const previousRow = this.data[internalIndex - 1];\n        if (isRowSelectedLast(previousRow)) {\n          this.data[internalIndex - 1] = previousRow.slice() as DataSourceRow;\n          this.data[internalIndex - 1][SELECTED] -= 4;\n        }\n      }\n    }\n  }\n\n  getAtIndex(index: number) {\n    return this.range.isWithin(index) &&\n      this.data[index - this.range.from] != null\n      ? this.data[index - this.range.from]\n      : undefined;\n  }\n\n  isWithinRange(index: number) {\n    return this.range.isWithin(index);\n  }\n\n  setRange({ from, to }: VuuRange) {\n    if (from !== this.range.from || to !== this.range.to) {\n      const [overlapFrom, overlapTo] = this.range.overlap(from, to);\n      const newData = new Array(Math.max(0, to - from));\n      for (let i = overlapFrom; i < overlapTo; i++) {\n        const data = this.getAtIndex(i);\n        if (data) {\n          const index = i - from;\n          newData[index] = data;\n        }\n      }\n      this.data = newData;\n      this.range.from = from;\n      this.range.to = to;\n    }\n  }\n\n  getSelectedRows() {\n    return this.data.filter((row) => row[SELECTED] !== 0);\n  }\n}\n"],"names":[],"mappings":"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"}

package/esm/table-cell/TableCell.css

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

package/esm/table-cell/TableCell.js

@@ -1,61 +0,0 @@
-import { jsx } from 'react/jsx-runtime';
-import { isNumericColumn } from '@vuu-ui/vuu-utils';
-import { useCallback } from 'react';
-import { useCell } from '../useCell.js';
-
-const classBase = "vuuTableCell";
-const TableCell = ({
-  column,
-  columnMap,
-  onClick,
-  onDataEdited,
-  row
-}) => {
-  const { className, style } = useCell(column, classBase);
-  const { CellRenderer, index, name, valueFormatter } = column;
-  const dataIdx = columnMap[name];
-  const handleDataItemEdited = useCallback(
-    (value) => {
-      if (onDataEdited) {
-        let typedValue = value;
-        if (isNumericColumn(column) && typeof value === "string") {
-          typedValue = column.serverDataType === "double" ? parseFloat(value) : parseInt(value);
-        }
-        return onDataEdited?.(row, name, typedValue);
-      } else {
-        throw Error(
-          "TableCell onDataEdited prop not supplied for an editable cell"
-        );
-      }
-    },
-    [column, name, onDataEdited, row]
-  );
-  const handleClick = useCallback(
-    (evt) => {
-      onClick?.(evt, column);
-    },
-    [column, onClick]
-  );
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      "aria-colindex": index,
-      className,
-      onClick: onClick ? handleClick : void 0,
-      role: "cell",
-      style,
-      children: CellRenderer ? /* @__PURE__ */ jsx(
-        CellRenderer,
-        {
-          column,
-          columnMap,
-          onCommit: handleDataItemEdited,
-          row
-        }
-      ) : valueFormatter(row[dataIdx])
-    }
-  );
-};
-
-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 { DataItemCommitHandler, TableCellProps } from \"@vuu-ui/vuu-table-types\";\nimport { isNumericColumn } from \"@vuu-ui/vuu-utils\";\nimport { MouseEventHandler, useCallback } from \"react\";\nimport { useCell } from \"../useCell\";\n\nimport \"./TableCell.css\";\n\nconst classBase = \"vuuTableCell\";\n\nexport const TableCell = ({\n  column,\n  columnMap,\n  onClick,\n  onDataEdited,\n  row,\n}: TableCellProps) => {\n  const { className, style } = useCell(column, classBase);\n  const { CellRenderer, index, name, valueFormatter } = column;\n  const dataIdx = columnMap[name];\n\n  const handleDataItemEdited = useCallback<DataItemCommitHandler>(\n    (value) => {\n      if (onDataEdited) {\n        let typedValue = value;\n        if (isNumericColumn(column) && typeof value === \"string\") {\n          typedValue =\n            column.serverDataType === \"double\"\n              ? parseFloat(value)\n              : parseInt(value);\n        }\n        return onDataEdited?.(row, name, typedValue);\n      } else {\n        throw Error(\n          \"TableCell onDataEdited prop not supplied for an editable cell\"\n        );\n      }\n    },\n    [column, name, onDataEdited, row]\n  );\n\n  const handleClick = useCallback<MouseEventHandler>(\n    (evt) => {\n      onClick?.(evt, column);\n    },\n    [column, onClick]\n  );\n\n  return (\n    <div\n      aria-colindex={index}\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          onCommit={handleDataItemEdited}\n          row={row}\n        />\n      ) : (\n        valueFormatter(row[dataIdx])\n      )}\n    </div>\n  );\n};\n"],"names":[],"mappings":";;;;;AAOA,MAAM,SAAY,GAAA,cAAA,CAAA;AAEX,MAAM,YAAY,CAAC;AAAA,EACxB,MAAA;AAAA,EACA,SAAA;AAAA,EACA,OAAA;AAAA,EACA,YAAA;AAAA,EACA,GAAA;AACF,CAAsB,KAAA;AACpB,EAAA,MAAM,EAAE,SAAW,EAAA,KAAA,EAAU,GAAA,OAAA,CAAQ,QAAQ,SAAS,CAAA,CAAA;AACtD,EAAA,MAAM,EAAE,YAAA,EAAc,KAAO,EAAA,IAAA,EAAM,gBAAmB,GAAA,MAAA,CAAA;AACtD,EAAM,MAAA,OAAA,GAAU,UAAU,IAAI,CAAA,CAAA;AAE9B,EAAA,MAAM,oBAAuB,GAAA,WAAA;AAAA,IAC3B,CAAC,KAAU,KAAA;AACT,MAAA,IAAI,YAAc,EAAA;AAChB,QAAA,IAAI,UAAa,GAAA,KAAA,CAAA;AACjB,QAAA,IAAI,eAAgB,CAAA,MAAM,CAAK,IAAA,OAAO,UAAU,QAAU,EAAA;AACxD,UAAA,UAAA,GACE,OAAO,cAAmB,KAAA,QAAA,GACtB,WAAW,KAAK,CAAA,GAChB,SAAS,KAAK,CAAA,CAAA;AAAA,SACtB;AACA,QAAO,OAAA,YAAA,GAAe,GAAK,EAAA,IAAA,EAAM,UAAU,CAAA,CAAA;AAAA,OACtC,MAAA;AACL,QAAM,MAAA,KAAA;AAAA,UACJ,+DAAA;AAAA,SACF,CAAA;AAAA,OACF;AAAA,KACF;AAAA,IACA,CAAC,MAAA,EAAQ,IAAM,EAAA,YAAA,EAAc,GAAG,CAAA;AAAA,GAClC,CAAA;AAEA,EAAA,MAAM,WAAc,GAAA,WAAA;AAAA,IAClB,CAAC,GAAQ,KAAA;AACP,MAAA,OAAA,GAAU,KAAK,MAAM,CAAA,CAAA;AAAA,KACvB;AAAA,IACA,CAAC,QAAQ,OAAO,CAAA;AAAA,GAClB,CAAA;AAEA,EACE,uBAAA,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,eAAe,EAAA,KAAA;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,QAAU,EAAA,oBAAA;AAAA,UACV,GAAA;AAAA,SAAA;AAAA,OAGF,GAAA,cAAA,CAAe,GAAI,CAAA,OAAO,CAAC,CAAA;AAAA,KAAA;AAAA,GAE/B,CAAA;AAEJ;;;;"}

package/esm/table-cell/TableGroupCell.css

@@ -1,26 +0,0 @@
-.vuuTableGroupCell {
-    --group-cell-spacer-width: 20px;
-    align-items: center;
-    border-right-color: var(--vuuTableGroupCell-borderColor, var(--salt-separable-tertiary-borderColor));
-    border-right-style: solid;
-    border-right-width: 1px;
-  
-    cursor: pointer;
-    display: inline-flex;
-    height: var(--row-height);
-    line-height: 16px;
-}
-
-.vuuTableGroupCell-toggle {
-    --vuu-icon-height: 16px;
-    --vuu-icon-size: 16px;
-    --vuu-icon-width: 8px;
-    margin-right: 4px;
-    transition: transform 0.25s;
-    transform: var(--toggle-icon-transform);
-
-}
-
-.vuuTableGroupCell-spacer {
-    width: var(--group-cell-spacer-width);
-  }

package/esm/table-cell/TableGroupCell.js

@@ -1,43 +0,0 @@
-import { jsx, jsxs } from 'react/jsx-runtime';
-import { getGroupValueAndOffset, metadataKeys } from '@vuu-ui/vuu-utils';
-import { useCallback } from 'react';
-import { useCell } from '../useCell.js';
-import cx from 'clsx';
-
-const { IS_LEAF } = metadataKeys;
-const classBase = "vuuTableGroupCell";
-const TableGroupCell = ({
-  column,
-  columnMap,
-  onClick,
-  row
-}) => {
-  const { columns } = column;
-  const [value, offset] = getGroupValueAndOffset(columns, row, columnMap);
-  const { className, style } = useCell(column, classBase);
-  const handleClick = useCallback(
-    (evt) => {
-      onClick?.(evt, column);
-    },
-    [column, onClick]
-  );
-  const isLeaf = row[IS_LEAF];
-  const spacers = Array(offset).fill(0).map((n, i) => /* @__PURE__ */ jsx("span", { className: `${classBase}-spacer` }, i));
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      className: cx(className, "vuuTableCell"),
-      role: "cell",
-      style,
-      onClick: isLeaf ? void 0 : handleClick,
-      children: [
-        spacers,
-        isLeaf ? null : /* @__PURE__ */ jsx("span", { className: `${classBase}-toggle`, "data-icon": "triangle-right" }),
-        /* @__PURE__ */ jsx("span", { children: value })
-      ]
-    }
-  );
-};
-
-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 { getGroupValueAndOffset, metadataKeys } from \"@vuu-ui/vuu-utils\";\nimport { MouseEvent, useCallback } from \"react\";\nimport { useCell } from \"../useCell\";\nimport cx from \"clsx\";\n\nimport \"./TableGroupCell.css\";\n\nconst { IS_LEAF } = metadataKeys;\n\nconst classBase = \"vuuTableGroupCell\";\n\nexport const TableGroupCell = ({\n  column,\n  columnMap,\n  onClick,\n  row,\n}: TableCellProps) => {\n  const { columns } = column as GroupColumnDescriptor;\n  const [value, offset] = getGroupValueAndOffset(columns, row, columnMap);\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 isLeaf = row[IS_LEAF];\n  const spacers = Array(offset)\n    .fill(0)\n    .map((n, i) => <span className={`${classBase}-spacer`} key={i} />);\n\n  return (\n    <div\n      className={cx(className, \"vuuTableCell\")}\n      role=\"cell\"\n      style={style}\n      onClick={isLeaf ? undefined : handleClick}\n    >\n      {spacers}\n      {isLeaf ? null : (\n        <span className={`${classBase}-toggle`} data-icon=\"triangle-right\" />\n      )}\n      <span>{value}</span>\n    </div>\n  );\n};\n"],"names":[],"mappings":";;;;;;AAQA,MAAM,EAAE,SAAY,GAAA,YAAA,CAAA;AAEpB,MAAM,SAAY,GAAA,mBAAA,CAAA;AAEX,MAAM,iBAAiB,CAAC;AAAA,EAC7B,MAAA;AAAA,EACA,SAAA;AAAA,EACA,OAAA;AAAA,EACA,GAAA;AACF,CAAsB,KAAA;AACpB,EAAM,MAAA,EAAE,SAAY,GAAA,MAAA,CAAA;AACpB,EAAA,MAAM,CAAC,KAAO,EAAA,MAAM,IAAI,sBAAuB,CAAA,OAAA,EAAS,KAAK,SAAS,CAAA,CAAA;AACtE,EAAA,MAAM,EAAE,SAAW,EAAA,KAAA,EAAU,GAAA,OAAA,CAAQ,QAAQ,SAAS,CAAA,CAAA;AAEtD,EAAA,MAAM,WAAc,GAAA,WAAA;AAAA,IAClB,CAAC,GAAoC,KAAA;AACnC,MAAA,OAAA,GAAU,KAAK,MAAM,CAAA,CAAA;AAAA,KACvB;AAAA,IACA,CAAC,QAAQ,OAAO,CAAA;AAAA,GAClB,CAAA;AAEA,EAAM,MAAA,MAAA,GAAS,IAAI,OAAO,CAAA,CAAA;AAC1B,EAAA,MAAM,UAAU,KAAM,CAAA,MAAM,EACzB,IAAK,CAAA,CAAC,EACN,GAAI,CAAA,CAAC,CAAG,EAAA,CAAA,yBAAO,MAAK,EAAA,EAAA,SAAA,EAAW,GAAG,SAAS,CAAA,OAAA,CAAA,EAAA,EAAgB,CAAG,CAAE,CAAA,CAAA;AAEnE,EACE,uBAAA,IAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,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,MAE7B,QAAA,EAAA;AAAA,QAAA,OAAA;AAAA,QACA,MAAA,GAAS,uBACP,GAAA,CAAA,MAAA,EAAA,EAAK,WAAW,CAAG,EAAA,SAAS,CAAW,OAAA,CAAA,EAAA,WAAA,EAAU,gBAAiB,EAAA,CAAA;AAAA,wBAErE,GAAA,CAAC,UAAM,QAAM,EAAA,KAAA,EAAA,CAAA;AAAA,OAAA;AAAA,KAAA;AAAA,GACf,CAAA;AAEJ;;;;"}

package/esm/table-config.js

@@ -1,23 +0,0 @@
-const 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;
-  }
-};
-
-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 { ColumnDescriptor, TableConfig } from \"@vuu-ui/vuu-table-types\";\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  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      return {\n        ...config,\n        columns: config.columns.map((col) =>\n          col.name === action.column.name\n            ? { ...col, width: action.width }\n            : col\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":"AAiCa,MAAA,iBAAA,GAAoB,CAC/B,MAAA,EACA,MACgB,KAAA;AAChB,EAAA,QAAQ,OAAO,IAAM;AAAA,IACnB,KAAK,UAAA;AACH,MAAO,OAAA;AAAA,QACL,GAAG,MAAA;AAAA,QACH,OAAA,EAAS,OAAO,OAAQ,CAAA,GAAA;AAAA,UAAI,CAAC,GAAA,KAC3B,GAAI,CAAA,IAAA,KAAS,MAAO,CAAA,MAAA,CAAO,IACvB,GAAA,EAAE,GAAG,GAAA,EAAK,KAAO,EAAA,MAAA,CAAO,OACxB,GAAA,GAAA;AAAA,SACN;AAAA,OACF,CAAA;AAAA,IACF,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,GAAA;AAAA,SACN;AAAA,OACF,CAAA;AAAA,IAEF;AACE,MAAO,OAAA,MAAA,CAAA;AAAA,GACX;AACF;;;;"}

package/esm/table-dom-utils.js

@@ -1,51 +0,0 @@
-const headerCellQuery = (colIdx) => `.vuuTable-col-headers .vuuTableHeaderCell:nth-child(${colIdx})`;
-const dataCellQuery = (rowIdx, colIdx) => `.vuuTable-body > [aria-rowindex='${rowIdx + 1}'] > [role='cell']:nth-child(${colIdx + 1})`;
-const getTableCell = (containerRef, [rowIdx, colIdx]) => {
-  const cssQuery = rowIdx === -1 ? headerCellQuery(colIdx) : dataCellQuery(rowIdx, colIdx);
-  const cell = containerRef.current?.querySelector(
-    cssQuery
-  );
-  if (cellIsEditable(cell)) {
-    const focusableContent = cell.querySelector("button");
-    return focusableContent || cell;
-  } else {
-    return cell;
-  }
-};
-const cellIsEditable = (cell) => cell?.classList.contains("vuuTableCell-editable");
-const 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;
-}
-const closestRow = (el) => el.closest('[role="row"]');
-const closestRowIndex = (el) => getRowIndex(closestRow(el));
-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 { cellIsEditable, cellIsTextInput, closestRowIndex, dataCellQuery, getRowIndex, getTableCell, headerCellQuery, howFarIsRowOutsideViewport };
-//# sourceMappingURL=table-dom-utils.js.map

package/esm/table-dom-utils.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"table-dom-utils.js","sources":["../src/table-dom-utils.ts"],"sourcesContent":["import { RefObject } from \"react\";\nimport { ScrollDirection } from \"./useTableScroll\";\n\n/**\n * [rowIndex, colIndex\n */\nexport type CellPos = [number, number];\n\nexport const headerCellQuery = (colIdx: number) =>\n  `.vuuTable-col-headers .vuuTableHeaderCell:nth-child(${colIdx})`;\n\nexport const dataCellQuery = (rowIdx: number, colIdx: number) =>\n  `.vuuTable-body > [aria-rowindex='${rowIdx + 1}'] > [role='cell']:nth-child(${\n    colIdx + 1\n  })`;\n\nexport const getTableCell = (\n  containerRef: RefObject<HTMLElement>,\n\n  [rowIdx, colIdx]: CellPos\n) => {\n  const cssQuery =\n    rowIdx === -1 ? headerCellQuery(colIdx) : dataCellQuery(rowIdx, colIdx);\n  const cell = containerRef.current?.querySelector(\n    cssQuery\n  ) as HTMLTableCellElement;\n\n  if (cellIsEditable(cell)) {\n    // Dropdown gets focus, Input does not\n    const focusableContent = cell.querySelector(\"button\") as HTMLElement;\n    return focusableContent || cell;\n  } else {\n    return cell;\n  }\n};\n\nexport const cellIsEditable = (cell: HTMLDivElement | null) =>\n  cell?.classList.contains(\"vuuTableCell-editable\");\n\nexport const cellIsTextInput = (cell: HTMLElement) =>\n  cell.querySelector(\".vuuTableInputCell\") !== null;\n\nexport function getRowIndex(rowEl?: HTMLElement) {\n  if (rowEl) {\n    const idx: string | null = rowEl.ariaRowIndex;\n    if (idx !== null) {\n      return parseInt(idx, 10) - 1;\n    }\n  }\n  return -1;\n}\n\nconst closestRow = (el: HTMLElement) =>\n  el.closest('[role=\"row\"]') as HTMLElement;\n\nexport const closestRowIndex = (el: HTMLElement) => getRowIndex(closestRow(el));\n\nconst NO_SCROLL_NECESSARY = [undefined, undefined] as const;\n\nexport const howFarIsRowOutsideViewport = (\n  rowEl: HTMLElement,\n  totalHeaderHeight: number,\n  contentContainer = rowEl.closest(\".vuuTable-contentContainer\")\n): readonly [ScrollDirection | undefined, number | undefined] => {\n  //TODO lots of scope for optimisation here\n  if (contentContainer) {\n    // TODO take totalHeaderHeight into consideration\n    const viewport = contentContainer?.getBoundingClientRect();\n    const upperBoundary = viewport.top + totalHeaderHeight;\n    const row = rowEl.getBoundingClientRect();\n    if (row) {\n      if (row.bottom > viewport.bottom) {\n        return [\"down\", row.bottom - viewport.bottom];\n      } else if (row.top < upperBoundary) {\n        return [\"up\", row.top - upperBoundary];\n      } else {\n        return NO_SCROLL_NECESSARY;\n      }\n    } else {\n      throw Error(\"Whats going on, row not found\");\n    }\n  } else {\n    throw Error(\"Whats going on, scrollbar container not found\");\n  }\n};\n"],"names":[],"mappings":"AAQO,MAAM,eAAkB,GAAA,CAAC,MAC9B,KAAA,CAAA,oDAAA,EAAuD,MAAM,CAAA,CAAA,EAAA;AAElD,MAAA,aAAA,GAAgB,CAAC,MAAgB,EAAA,MAAA,KAC5C,oCAAoC,MAAS,GAAA,CAAC,CAC5C,6BAAA,EAAA,MAAA,GAAS,CACX,CAAA,CAAA,EAAA;AAEK,MAAM,eAAe,CAC1B,YAAA,EAEA,CAAC,MAAA,EAAQ,MAAM,CACZ,KAAA;AACH,EAAM,MAAA,QAAA,GACJ,WAAW,CAAK,CAAA,GAAA,eAAA,CAAgB,MAAM,CAAI,GAAA,aAAA,CAAc,QAAQ,MAAM,CAAA,CAAA;AACxE,EAAM,MAAA,IAAA,GAAO,aAAa,OAAS,EAAA,aAAA;AAAA,IACjC,QAAA;AAAA,GACF,CAAA;AAEA,EAAI,IAAA,cAAA,CAAe,IAAI,CAAG,EAAA;AAExB,IAAM,MAAA,gBAAA,GAAmB,IAAK,CAAA,aAAA,CAAc,QAAQ,CAAA,CAAA;AACpD,IAAA,OAAO,gBAAoB,IAAA,IAAA,CAAA;AAAA,GACtB,MAAA;AACL,IAAO,OAAA,IAAA,CAAA;AAAA,GACT;AACF,EAAA;AAEO,MAAM,iBAAiB,CAAC,IAAA,KAC7B,IAAM,EAAA,SAAA,CAAU,SAAS,uBAAuB,EAAA;AAE3C,MAAM,kBAAkB,CAAC,IAAA,KAC9B,IAAK,CAAA,aAAA,CAAc,oBAAoB,CAAM,KAAA,KAAA;AAExC,SAAS,YAAY,KAAqB,EAAA;AAC/C,EAAA,IAAI,KAAO,EAAA;AACT,IAAA,MAAM,MAAqB,KAAM,CAAA,YAAA,CAAA;AACjC,IAAA,IAAI,QAAQ,IAAM,EAAA;AAChB,MAAO,OAAA,QAAA,CAAS,GAAK,EAAA,EAAE,CAAI,GAAA,CAAA,CAAA;AAAA,KAC7B;AAAA,GACF;AACA,EAAO,OAAA,CAAA,CAAA,CAAA;AACT,CAAA;AAEA,MAAM,UAAa,GAAA,CAAC,EAClB,KAAA,EAAA,CAAG,QAAQ,cAAc,CAAA,CAAA;AAEpB,MAAM,kBAAkB,CAAC,EAAA,KAAoB,WAAY,CAAA,UAAA,CAAW,EAAE,CAAC,EAAA;AAE9E,MAAM,mBAAA,GAAsB,CAAC,KAAA,CAAA,EAAW,KAAS,CAAA,CAAA,CAAA;AAEpC,MAAA,0BAAA,GAA6B,CACxC,KACA,EAAA,iBAAA,EACA,mBAAmB,KAAM,CAAA,OAAA,CAAQ,4BAA4B,CACE,KAAA;AAE/D,EAAA,IAAI,gBAAkB,EAAA;AAEpB,IAAM,MAAA,QAAA,GAAW,kBAAkB,qBAAsB,EAAA,CAAA;AACzD,IAAM,MAAA,aAAA,GAAgB,SAAS,GAAM,GAAA,iBAAA,CAAA;AACrC,IAAM,MAAA,GAAA,GAAM,MAAM,qBAAsB,EAAA,CAAA;AACxC,IAAA,IAAI,GAAK,EAAA;AACP,MAAI,IAAA,GAAA,CAAI,MAAS,GAAA,QAAA,CAAS,MAAQ,EAAA;AAChC,QAAA,OAAO,CAAC,MAAA,EAAQ,GAAI,CAAA,MAAA,GAAS,SAAS,MAAM,CAAA,CAAA;AAAA,OAC9C,MAAA,IAAW,GAAI,CAAA,GAAA,GAAM,aAAe,EAAA;AAClC,QAAA,OAAO,CAAC,IAAA,EAAM,GAAI,CAAA,GAAA,GAAM,aAAa,CAAA,CAAA;AAAA,OAChC,MAAA;AACL,QAAO,OAAA,mBAAA,CAAA;AAAA,OACT;AAAA,KACK,MAAA;AACL,MAAA,MAAM,MAAM,+BAA+B,CAAA,CAAA;AAAA,KAC7C;AAAA,GACK,MAAA;AACL,IAAA,MAAM,MAAM,+CAA+C,CAAA,CAAA;AAAA,GAC7D;AACF;;;;"}