@vuu-ui/vuu-table 0.13.9 → 0.13.11

package/cjs/CellFocusState.js

@@ -0,0 +1,45 @@
+'use strict';
+
+var tableDomUtils = require('./table-dom-utils.js');
+
+var __defProp = Object.defineProperty;
+var __typeError = (msg) => {
+  throw TypeError(msg);
+};
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+var __accessCheck = (obj, member, msg) => member.has(obj) || __typeError("Cannot " + msg);
+var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), getter ? getter.call(obj) : member.get(obj));
+var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
+var __privateSet = (obj, member, value, setter) => (__accessCheck(obj, member, "write to private field"), member.set(obj, value), value);
+var _cellPos, _el;
+class CellFocusState {
+  constructor() {
+    __privateAdd(this, _cellPos);
+    __privateAdd(this, _el, null);
+    __publicField(this, "outsideViewport", false);
+    __publicField(this, "placeholderEl", null);
+    __publicField(this, "pos");
+  }
+  set cell(cell) {
+    __privateSet(this, _el, cell);
+    __privateSet(this, _cellPos, tableDomUtils.getAriaCellPos(cell));
+  }
+  get cellPos() {
+    return __privateGet(this, _cellPos);
+  }
+  set cellPos(cellPos) {
+    __privateSet(this, _cellPos, cellPos);
+  }
+  get el() {
+    return __privateGet(this, _el);
+  }
+  set el(el) {
+    __privateSet(this, _el, el);
+  }
+}
+_cellPos = new WeakMap();
+_el = new WeakMap();
+
+exports.CellFocusState = CellFocusState;
+//# sourceMappingURL=CellFocusState.js.map

package/cjs/CellFocusState.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CellFocusState.js","sources":["../src/CellFocusState.ts"],"sourcesContent":["import { CellPos } from \"@vuu-ui/vuu-table-types\";\nimport { getAriaCellPos } from \"./table-dom-utils\";\n\n/**\n * Used to track the Table cell (if any) with focus.\n */\nexport interface ICellFocusState {\n  el: HTMLElement | null;\n  outsideViewport: \"above\" | \"below\" | false;\n  placeholderEl: HTMLDivElement | null;\n  pos: { top: number } | undefined;\n  cellPos: CellPos | undefined;\n}\n\nexport class CellFocusState implements ICellFocusState {\n  #cellPos: CellPos | undefined = undefined;\n  #el: HTMLElement | null = null;\n  outsideViewport: \"above\" | \"below\" | false = false;\n  placeholderEl: HTMLDivElement | null = null;\n  pos: { top: number } | undefined = undefined;\n\n  set cell(cell: HTMLDivElement) {\n    this.#el = cell;\n    this.#cellPos = getAriaCellPos(cell);\n  }\n\n  get cellPos() {\n    return this.#cellPos;\n  }\n  set cellPos(cellPos) {\n    this.#cellPos = cellPos;\n  }\n\n  get el() {\n    return this.#el;\n  }\n  set el(el) {\n    this.#el = el;\n  }\n}\n"],"names":["getAriaCellPos"],"mappings":";;;;;;;;;;;;;;AAAA,IAAA,QAAA,EAAA,GAAA;AAcO,MAAM,cAA0C,CAAA;AAAA,EAAhD,WAAA,GAAA;AACL,IAAA,YAAA,CAAA,IAAA,EAAA,QAAA,CAAA;AACA,IAA0B,YAAA,CAAA,IAAA,EAAA,GAAA,EAAA,IAAA,CAAA;AAC1B,IAA6C,aAAA,CAAA,IAAA,EAAA,iBAAA,EAAA,KAAA,CAAA;AAC7C,IAAuC,aAAA,CAAA,IAAA,EAAA,eAAA,EAAA,IAAA,CAAA;AACvC,IAAA,aAAA,CAAA,IAAA,EAAA,KAAA,CAAA;AAAA;AAAA,EAEA,IAAI,KAAK,IAAsB,EAAA;AAC7B,IAAA,YAAA,CAAA,IAAA,EAAK,GAAM,EAAA,IAAA,CAAA;AACX,IAAK,YAAA,CAAA,IAAA,EAAA,QAAA,EAAWA,6BAAe,IAAI,CAAA,CAAA;AAAA;AACrC,EAEA,IAAI,OAAU,GAAA;AACZ,IAAA,OAAO,YAAK,CAAA,IAAA,EAAA,QAAA,CAAA;AAAA;AACd,EACA,IAAI,QAAQ,OAAS,EAAA;AACnB,IAAA,YAAA,CAAA,IAAA,EAAK,QAAW,EAAA,OAAA,CAAA;AAAA;AAClB,EAEA,IAAI,EAAK,GAAA;AACP,IAAA,OAAO,YAAK,CAAA,IAAA,EAAA,GAAA,CAAA;AAAA;AACd,EACA,IAAI,GAAG,EAAI,EAAA;AACT,IAAA,YAAA,CAAA,IAAA,EAAK,GAAM,EAAA,EAAA,CAAA;AAAA;AAEf;AAxBE,QAAA,GAAA,IAAA,OAAA,EAAA;AACA,GAAA,GAAA,IAAA,OAAA,EAAA;;;;"}

package/cjs/Row.css.js

@@ -0,0 +1,6 @@
+'use strict';
+
+var rowCss = ".vuuTableRow {\n  background: var(--row-background, var(--table-background));\n  border-bottom: 1px solid var(--row-borderColor, var(--table-background));\n  box-sizing: border-box;\n  color: var(--salt-content-secondary-foreground);\n  contain: layout;\n  /* contain-intrinsic-height: var(--row-height);\n  content-visibility: auto; */\n  height: var(--row-height);\n  line-height: var(--row-height);\n  position: absolute;\n  top: 0;\n  white-space: nowrap;\n  width: 100%;\n}\n\n.vuuTableRow-proxy {\n  position: absolute !important;\n  visibility: hidden;\n}\n\n.vuuTableRow-even {\n  --row-background: var(--row-background-even);\n}\n\n.vuuTableRow-highlighted {\n  background: var(--salt-selectable-background-hover);\n}\n\n.vuuTableRow-selected,\n.vuuTableRow-selectedEnd {\n  /* --row-borderColor: var(--salt-separable-secondary-borderColor); */\n  background-color: var(--salt-selectable-background-selected);\n}\n\n.vuuTableRow-selectedEnd {\n  z-index: 1;\n}\n\n.vuuTableRow-selectedStart {\n  --selection-decorator-marginTop: 1px;\n  --vuu-selection-decorator-left-radius: 5px 0 0 0;\n  --vuu-selection-decorator-right-radius: 0 5px 0 0;\n\n  border-radius: 5px 5px 0 0;\n}\n\n.vuuTableRow-selectedEnd {\n  --vuu-selection-decorator-left-radius: 0 0 0 5px;\n  --vuu-selection-decorator-right-radius: 0 0 5px 0;\n  border-radius: 0 0 5px 5px;\n}\n\n.vuuTableRow-selectedStart.vuuTableRow-selectedEnd {\n  --vuu-selection-decorator-left-radius: 5px 0 0 5px;\n  --vuu-selection-decorator-right-radius: 0 5px 5px 0;\n  border-radius: 5px 5px 5px 5px;\n}\n\n.vuuTableRow-selectedStart:after {\n  content: \"\";\n  position: absolute;\n  top: 0px;\n  left: 4px;\n  height: 1px;\n  background: var(--vuuTableRow-selectionBlock-borderColor);\n  width: calc(var(--content-width) - 8px);\n  z-index: 1;\n}\n\n.vuuTableRow-selectedEnd {\n  border-bottom-color: var(\n    --vuuTableRow-selectionBlock-borderColor,\n    var(--row-borderColor)\n  );\n}\n\n.vuuTableRow-selectedStart.vuuTableRow-selectedEnd {\n  .vuuTableRow-selectionDecorator {\n    height: calc(var(--row-height) - 1px);\n  }\n}\n\n.vuuTableRow-selectionDecorator {\n  background: var(--table-background);\n  display: inline-block;\n  position: relative;\n  height: var(--row-height);\n  margin-top: var(--selection-decorator-marginTop, 0px);\n  width: 4px;\n  z-index: 2;\n}\n\n.vuuTableRow-selectionDecorator.vuuStickyLeft {\n  left: 0;\n  position: sticky;\n}\n\n.vuuTableRow-selectionDecorator.vuuStickyRight {\n  right: 0;\n  position: sticky;\n}\n\n.vuuTableRow-selectedStart .vuuTableRow-selectionDecorator:before,\n.vuuTableRow-selectedEnd .vuuTableRow-selectionDecorator:before {\n  content: \"\";\n  inset: -1px 0 0 0;\n  position: absolute;\n  background: var(--table-background);\n}\n\n.vuuTableRow-selectionDecorator.vuuStickyLeft:before {\n  border-radius: var(--vuu-selection-decorator-left-radius, 0);\n}\n\n.vuuTableRow-selectionDecorator.vuuStickyRight:before {\n  border-radius: var(--vuu-selection-decorator-right-radius, 0);\n}\n\n.vuuTableRow[aria-expanded=\"true\"] {\n  --toggle-icon-transform: rotate(90deg);\n}\n\n.vuuDraggable .vuuTableRow {\n  --cell-borderColor: transparent;\n  --vuu-selection-decorator-bg: transparent;\n  transform: none !important;\n  z-index: 1;\n}\n";
+
+module.exports = rowCss;
+//# sourceMappingURL=Row.css.js.map

package/cjs/Row.css.js.map

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

package/cjs/Row.js

@@ -0,0 +1,151 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var vuuUtils = require('@vuu-ui/vuu-utils');
+var styles = require('@salt-ds/styles');
+var window = require('@salt-ds/window');
+var cx = require('clsx');
+var react = require('react');
+var TableCell = require('./table-cell/TableCell.js');
+var TableGroupCell = require('./table-cell/TableGroupCell.js');
+var Row$1 = require('./Row.css.js');
+var VirtualColSpan = require('./VirtualColSpan.js');
+
+const { COUNT, DEPTH, IDX, IS_EXPANDED, IS_LEAF, SELECTED } = vuuUtils.metadataKeys;
+const classBase = "vuuTableRow";
+const RowProxy = react.forwardRef(
+  function RowProxy2({ height }, forwardedRef) {
+    const targetWindow = window.useWindow();
+    styles.useComponentCssInjection({
+      testId: "vuu-table-row",
+      css: Row$1,
+      window: targetWindow
+    });
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        "aria-hidden": true,
+        className: cx(classBase, `${classBase}-proxy`),
+        ref: forwardedRef,
+        style: { height }
+      }
+    );
+  }
+);
+const Row = react.memo(
+  ({
+    className: classNameProp,
+    classNameGenerator,
+    columnMap,
+    columns,
+    groupToggleTarget = "group-column",
+    highlighted,
+    row,
+    offset,
+    onCellEdit,
+    onClick,
+    onDataEdited,
+    onToggleGroup,
+    searchPattern,
+    showBookends = true,
+    virtualColSpan = 0,
+    zebraStripes = false,
+    ...htmlAttributes
+  }) => {
+    const targetWindow = window.useWindow();
+    styles.useComponentCssInjection({
+      testId: "vuu-table-row",
+      css: Row$1,
+      window: targetWindow
+    });
+    const {
+      [COUNT]: childRowCount,
+      [DEPTH]: depth,
+      [IDX]: rowIndex,
+      [IS_EXPANDED]: isExpanded,
+      [IS_LEAF]: isLeaf,
+      [SELECTED]: selectionStatus
+    } = row;
+    const handleRowClick = react.useCallback(
+      (evt) => {
+        const rangeSelect = evt.shiftKey;
+        const keepExistingSelection = evt.ctrlKey || evt.metaKey;
+        onClick?.(evt, row, rangeSelect, keepExistingSelection);
+      },
+      [onClick, row]
+    );
+    const { True, First, Last } = vuuUtils.RowSelected;
+    const className = cx(
+      classBase,
+      classNameProp,
+      classNameGenerator?.(row, columnMap),
+      {
+        [`${classBase}-even`]: zebraStripes && rowIndex % 2 === 0,
+        [`${classBase}-highlighted`]: highlighted,
+        [`${classBase}-selected`]: selectionStatus & True,
+        [`${classBase}-selectedStart`]: selectionStatus & First,
+        [`${classBase}-selectedEnd`]: selectionStatus & Last
+      }
+    );
+    const canExpand = isLeaf === false && childRowCount > 0;
+    const ariaExpanded = isExpanded ? true : canExpand ? false : void 0;
+    const ariaLevel = isLeaf && depth === 1 ? void 0 : depth;
+    const style = { top: offset };
+    const handleGroupCellClick = react.useCallback(
+      (evt, column) => {
+        if (vuuUtils.isGroupColumn(column) || vuuUtils.isJsonGroup(column, row, columnMap)) {
+          const toggleIconClicked = vuuUtils.queryClosest(evt.target, ".vuuToggleIconButton") !== null;
+          if (groupToggleTarget === "toggle-icon") {
+            if (!toggleIconClicked) {
+              return;
+            }
+          }
+          if (toggleIconClicked) {
+            evt.stopPropagation();
+          }
+          onToggleGroup?.(row, column);
+        }
+      },
+      [columnMap, groupToggleTarget, onToggleGroup, row]
+    );
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        ...htmlAttributes,
+        "aria-expanded": ariaExpanded,
+        "aria-level": ariaLevel,
+        role: "row",
+        className,
+        onClick: handleRowClick,
+        style,
+        children: [
+          showBookends ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: `${classBase}-selectionDecorator vuuStickyLeft` }) : null,
+          /* @__PURE__ */ jsxRuntime.jsx(VirtualColSpan.VirtualColSpan, { width: virtualColSpan }),
+          columns.filter(vuuUtils.isNotHidden).map((column) => {
+            const isGroup = vuuUtils.isGroupColumn(column);
+            const isJsonCell = vuuUtils.isJsonColumn(column);
+            const Cell = isGroup && !isJsonCell ? TableGroupCell.TableGroupCell : TableCell.TableCell;
+            return /* @__PURE__ */ jsxRuntime.jsx(
+              Cell,
+              {
+                column,
+                columnMap,
+                onClick: isGroup || isJsonCell ? handleGroupCellClick : void 0,
+                onDataEdited,
+                row,
+                searchPattern
+              },
+              column.name
+            );
+          }),
+          showBookends ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: `${classBase}-selectionDecorator vuuStickyRight` }) : null
+        ]
+      }
+    );
+  }
+);
+Row.displayName = "Row";
+
+exports.Row = Row;
+exports.RowProxy = RowProxy;
+//# sourceMappingURL=Row.js.map

package/cjs/Row.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Row.js","sources":["../src/Row.tsx"],"sourcesContent":["import { RowProps, RuntimeColumnDescriptor } from \"@vuu-ui/vuu-table-types\";\nimport {\n  RowSelected,\n  isGroupColumn,\n  isJsonColumn,\n  isJsonGroup,\n  isNotHidden,\n  metadataKeys,\n  queryClosest,\n} from \"@vuu-ui/vuu-utils\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport cx from \"clsx\";\nimport { MouseEvent, forwardRef, memo, useCallback } from \"react\";\nimport { TableCell, TableGroupCell } from \"./table-cell\";\n\nimport rowCss from \"./Row.css\";\nimport { VirtualColSpan } from \"./VirtualColSpan\";\n\nconst { COUNT, DEPTH, IDX, IS_EXPANDED, IS_LEAF, SELECTED } = metadataKeys;\nconst classBase = \"vuuTableRow\";\n\n// A dummy Table Row rendered once and not visible. We measure this to\n// determine height of Row(s) and monitor it for size changes (in\n// case of runtime density switch). This allows ListItem height to\n// be controlled purely through CSS.\nexport const RowProxy = forwardRef<HTMLDivElement, { height?: number }>(\n  function RowProxy({ height }, forwardedRef) {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"vuu-table-row\",\n      css: rowCss,\n      window: targetWindow,\n    });\n\n    return (\n      <div\n        aria-hidden\n        className={cx(classBase, `${classBase}-proxy`)}\n        ref={forwardedRef}\n        style={{ height }}\n      />\n    );\n  },\n);\n\n// export const Row = memo(\nexport const Row = memo(\n  ({\n    className: classNameProp,\n    classNameGenerator,\n    columnMap,\n    columns,\n    groupToggleTarget = \"group-column\",\n    highlighted,\n    row,\n    offset,\n    onCellEdit,\n    onClick,\n    onDataEdited,\n    onToggleGroup,\n    searchPattern,\n    showBookends = true,\n    virtualColSpan = 0,\n    zebraStripes = false,\n    ...htmlAttributes\n  }: RowProps) => {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"vuu-table-row\",\n      css: rowCss,\n      window: targetWindow,\n    });\n\n    const {\n      [COUNT]: childRowCount,\n      [DEPTH]: depth,\n      [IDX]: rowIndex,\n      [IS_EXPANDED]: isExpanded,\n      [IS_LEAF]: isLeaf,\n      [SELECTED]: selectionStatus,\n    } = row;\n\n    const handleRowClick = useCallback(\n      (evt: MouseEvent<HTMLDivElement>) => {\n        const rangeSelect = evt.shiftKey;\n        const keepExistingSelection = evt.ctrlKey || evt.metaKey; /* mac only */\n        onClick?.(evt, row, rangeSelect, keepExistingSelection);\n      },\n      [onClick, row],\n    );\n\n    const { True, First, Last } = RowSelected;\n\n    const className = cx(\n      classBase,\n      classNameProp,\n      classNameGenerator?.(row, columnMap),\n      {\n        [`${classBase}-even`]: zebraStripes && rowIndex % 2 === 0,\n        [`${classBase}-highlighted`]: highlighted,\n        [`${classBase}-selected`]: selectionStatus & True,\n        [`${classBase}-selectedStart`]: selectionStatus & First,\n        [`${classBase}-selectedEnd`]: selectionStatus & Last,\n      },\n    );\n\n    const canExpand = isLeaf === false && childRowCount > 0;\n    const ariaExpanded = isExpanded ? true : canExpand ? false : undefined;\n    const ariaLevel = isLeaf && depth === 1 ? undefined : depth;\n\n    // const style = { transform: `translate3d(0px, ${offset}px, 0px)` };\n    const style = { top: offset };\n\n    const handleGroupCellClick = useCallback(\n      (evt: MouseEvent, column: RuntimeColumnDescriptor) => {\n        if (isGroupColumn(column) || isJsonGroup(column, row, columnMap)) {\n          const toggleIconClicked =\n            queryClosest(evt.target, \".vuuToggleIconButton\") !== null;\n          if (groupToggleTarget === \"toggle-icon\") {\n            if (!toggleIconClicked) {\n              return;\n            }\n          }\n          if (toggleIconClicked) {\n            // prevent evt bubbling, will suppress selection hook.\n            // Clicking the toggle icon directly never triggers row selection\n            evt.stopPropagation();\n          }\n          onToggleGroup?.(row, column);\n        }\n      },\n      [columnMap, groupToggleTarget, onToggleGroup, row],\n    );\n\n    return (\n      <div\n        {...htmlAttributes}\n        aria-expanded={ariaExpanded}\n        aria-level={ariaLevel}\n        role=\"row\"\n        className={className}\n        onClick={handleRowClick}\n        style={style}\n      >\n        {showBookends ? (\n          <span className={`${classBase}-selectionDecorator vuuStickyLeft`} />\n        ) : null}\n        <VirtualColSpan width={virtualColSpan} />\n        {columns.filter(isNotHidden).map((column) => {\n          const isGroup = isGroupColumn(column);\n          const isJsonCell = isJsonColumn(column);\n          const Cell = isGroup && !isJsonCell ? TableGroupCell : TableCell;\n\n          return (\n            <Cell\n              column={column}\n              columnMap={columnMap}\n              key={column.name}\n              onClick={isGroup || isJsonCell ? handleGroupCellClick : undefined}\n              onDataEdited={onDataEdited}\n              row={row}\n              searchPattern={searchPattern}\n            />\n          );\n        })}\n        {showBookends ? (\n          <span className={`${classBase}-selectionDecorator vuuStickyRight`} />\n        ) : null}\n      </div>\n    );\n  },\n);\nRow.displayName = \"Row\";\n"],"names":["metadataKeys","forwardRef","RowProxy","useWindow","useComponentCssInjection","rowCss","jsx","memo","useCallback","RowSelected","isGroupColumn","isJsonGroup","queryClosest","jsxs","VirtualColSpan","isNotHidden","isJsonColumn","TableGroupCell","TableCell"],"mappings":"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"}

package/cjs/Table.css.js

@@ -0,0 +1,6 @@
+'use strict';
+
+var tableCss = ".vuuTable {\n  --vuu-table-footer-height: 0px;\n  --vuu-table-cell-outlineWidth: 1px;\n  --table-height: var(--measured-px-height);\n  --table-width: var(--measured-px-width);\n  --vuu-table-next-selection-bookend-width: 4px;\n  --vuu-table-embedded-control-height: calc(var(--row-height) - 3px);\n  --vuu-table-col-header-height: var(--vuuTableHeaderCell-height, 25px);\n  --vuu-table-col-heading-height: 25px;\n  --columnResizer-color: transparent;\n  --row-height: var(\n    --row-height-prop,\n    var(--vuu-table-row-height, var(--salt-size-base))\n  );\n\n  --cell-borderColor: transparent;\n  --row-borderColor: var(--row-background);\n  --table-background: var(--salt-container-primary-background);\n\n  background: var(--table-background);\n  font-family: var(\n    --vuuTable-fontFamily,\n    var(--salt-typography-fontFamily, sans-serif)\n  );\n  font-size: var(--vuuTable-fontSize, var(--salt-text-fontSize, 12px));\n  position: relative;\n  user-select: none;\n\n  &.vuuTable-viewportRowLimit {\n    height: fit-content;\n    /*  With a viewportRowLimit, table is content sized, not container sized. */\n    .vuuTable-contentContainer {\n      height: calc(var(--measured-px-height) + var(--total-header-height));\n    }\n    .vuuTable-scrollbarContainer {\n      height: calc(\n        var(--measured-px-height) + var(--horizontal-scrollbar-height)\n      );\n    }\n    .vuuTable-scrollbarFiller {\n      height: var(--horizontal-scrollbar-height);\n    }\n  }\n\n  &.vuuTable-maxViewportRowLimit {\n    /*  With a maxVviewportRowLimit, table is content sized, not container sized. */\n    height: fit-content;\n    padding-bottom: var(--horizontal-scrollbar-height);\n\n    .vuuTable-contentContainer {\n      height: min(\n        calc(var(--measured-px-height) + var(--total-header-height)),\n        calc(var(--content-height) + var(--total-header-height))\n      );\n    }\n    .vuuTable-scrollbarContainer {\n      height: min(\n        calc(var(--measured-px-height) + var(--horizontal-scrollbar-height)),\n        calc(var(--content-height) + var(--horizontal-scrollbar-height))\n      );\n    }\n\n    .vuuTable-scrollbarFiller {\n      height: var(--horizontal-scrollbar-height);\n    }\n  }\n}\n\n.vuuTable-zebra {\n  --row-background-even: var(--salt-palette-neutral-secondary-background);\n}\n\n.vuuTable-colLines {\n  --cell-borderColor: var(--salt-separable-tertiary-borderColor);\n}\n\n.vuuTable-rowLines {\n  --row-borderColor: var(--salt-separable-tertiary-borderColor);\n}\n\n.vuuTable-scrollbarContainer {\n  border-bottom: none !important;\n  border-top: none !important;\n  height: var(--viewport-body-height);\n  left: 0px;\n  overflow: auto;\n  position: absolute;\n  top: var(--total-header-height);\n  width: var(--table-width);\n}\n\n.vuuTable-scrollbarContainer::-webkit-scrollbar {\n  width: 10px;\n}\n\n.vuuTable-scrollbarContainer::-webkit-scrollbar:horizontal {\n  height: 10px;\n}\n\n.vuuTable-scrollbarContainer::-webkit-scrollbar-track {\n  background-color: transparent;\n}\n.vuuTable-scrollbarContainer::-webkit-scrollbar-thumb {\n  background-clip: padding-box;\n  border-radius: 10px;\n  border: 2px solid rgba(0, 0, 0, 0);\n  background-color: var(--vuu-color-gray-30);\n}\n\n.vuuTable-scrollbarContent {\n  height: calc(var(--content-height) + var(--horizontal-scrollbar-height));\n  position: absolute;\n  width: var(--content-width);\n}\n\n.vuuTable-contentContainer {\n  background: var(--table-background);\n  height: calc(\n    100% - var(--horizontal-scrollbar-height) - var(--vuu-table-footer-height)\n  );\n  position: relative;\n  overflow: auto;\n  overscroll-behavior: none;\n  width: calc(var(--table-width) - var(--vertical-scrollbar-width));\n}\n\n.vuuTable-contentContainer::-webkit-scrollbar {\n  display: none;\n}\n\n.vuuTable-table {\n  border: none;\n  border-collapse: separate;\n  border-spacing: 0;\n  left: 0;\n  margin: 0;\n  position: absolute;\n  top: 0;\n  table-layout: fixed;\n  width: var(--content-width);\n}\n\n.vuuTable-body {\n  height: var(--content-height);\n  position: relative;\n}\n\n.vuuTable-focusCellPlaceholder {\n  height: var(--row-height);\n  position: absolute;\n  width: 50px;\n  z-index: -1;\n}\n\n.vuuPinLeft,\n.vuuPinRight {\n  background-color: inherit;\n  position: sticky;\n  z-index: 1;\n}\n\n.vuuTable-col-headings {\n  background-color: var(\n    --vuuTableColHeadings-background,\n    var(--table-background)\n  );\n  padding: 0 var(--vuu-table-next-selection-bookend-width, 0);\n  position: sticky;\n  top: 0;\n  /* ensure header row sits atop everything else when scrolling down */\n  z-index: 1;\n}\n\n.vuuTable-col-headings:hover {\n  --columnResizer-height: var(--vuu-table-col-header-height);\n  --columnResizer-color: var(--salt-separable-tertiary-borderColor);\n}\n\n.vuuTable-heading {\n  height: var(--vuu-table-col-heading-height);\n}\n\n.vuuTable-col-headers {\n  background-color: var(\n    --vuuTableColHeadings-background,\n    var(--vuuTableColHeadings-background)\n  );\n  border-bottom: solid 1px\n    var(\n      --vuuTableColHeaders-borderColor,\n      var(--salt-separable-secondary-borderColor)\n    );\n  color: var(--salt-content-secondary-foreground);\n  height: var(--vuu-table-col-header-height);\n  white-space: nowrap;\n\n  .vuuDraggable-spacer {\n    border-bottom: solid 1px #ccc;\n    display: var(--vuuDraggable-display, inline-block);\n    height: var(--vuu-table-col-header-height);\n  }\n}\n\n.sizer-cell {\n  border: none !important;\n  height: 0px;\n}\n\n.vuuDraggable-vuuTable {\n  --cell-borderColor: transparent;\n  --vuu-table-col-header-height: var(--vuuTableHeaderCell-height, 25px);\n  --vuuTableHeaderCell-background: var(--salt-container-secondary-background);\n}\n.vuuDraggable-vuuTable {\n  --row-height: 25px;\n}\n\n.vuuTable-pagination {\n  --vuu-table-footer-height: 32px;\n  .vuuTable-col-headings {\n    position: relative;\n  }\n\n  .vuuTable-body {\n    height: calc(var(--content-height) - var(--total-header-height));\n    position: relative;\n  }\n\n  .vuuTableRow {\n    position: relative;\n    top: auto;\n  }\n}\n\n.vuuTable-footer {\n  align-items: center;\n  display: flex;\n  height: var(--vuu-table-footer-height);\n  justify-content: flex-end;\n  position: absolute;\n  left: 0;\n  right: 0;\n  bottom: 0;\n}\n\n.vuuHighlight {\n  color: blue;\n}\n\n.DragColumn {\n  box-shadow: var(--salt-overlayable-shadow-drag);\n}";
+
+module.exports = tableCss;
+//# sourceMappingURL=Table.css.js.map

package/cjs/Table.css.js.map

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