@vuu-ui/vuu-table 0.8.85 → 0.8.87

package/cjs/Row.css.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var rowCss = ".vuuTableRow {\n    background: var(--row-background,var(--table-background));\n    color: var(--salt-content-secondary-foreground);\n    border-bottom: 1px solid var(--row-borderColor, var(--table-background));\n    box-sizing: border-box;\n    height: var(--row-height);\n    line-height: calc(var(--row-height) - 1px);\n    position: absolute;\n    top:0;\n    white-space: nowrap;\n}\n    \n.vuuTableRow-proxy {\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\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  --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    \n    .vuuTableRow-selectedStart:after {\n        content: '';\n        position: absolute;\n        top: -1px;\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(--vuuTableRow-selectionBlock-borderColor, var(--row-borderColor));\n      }\n    \n      .vuuTableRow-selectionDecorator {\n        background: var(--table-background);\n        display: inline-block;\n        position: relative;\n        height: var(--row-height);\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-expanded {\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}";
+var rowCss = ".vuuTableRow {\n  background: var(--row-background, var(--table-background));\n  color: var(--salt-content-secondary-foreground);\n  border-bottom: 1px solid var(--row-borderColor, var(--table-background));\n  box-sizing: border-box;\n  height: var(--row-height);\n  line-height: var(--row-height);\n  position: absolute;\n  top: 0;\n  white-space: nowrap;\n}\n\n.vuuTableRow-proxy {\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  --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: -1px;\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-selectionDecorator {\n  background: var(--table-background);\n  display: inline-block;\n  position: relative;\n  height: var(--row-height);\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-expanded {\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.js.map

@@ -1 +1 @@
-{"version":3,"file":"Row.js","sources":["../src/Row.tsx"],"sourcesContent":["import { RowProps, RuntimeColumnDescriptor } from \"@vuu-ui/vuu-table-types\";\nimport {\n  isGroupColumn,\n  isJsonColumn,\n  isJsonGroup,\n  isNotHidden,\n  metadataKeys,\n  RowSelected,\n} from \"@vuu-ui/vuu-utils\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport cx from \"clsx\";\nimport { forwardRef, memo, MouseEvent, useCallback } from \"react\";\nimport { TableCell, TableGroupCell } from \"./table-cell\";\n\nimport rowCss from \"./Row.css\";\nimport { VirtualColSpan } from \"./VirtualColSpan\";\n\nconst { IDX, IS_EXPANDED, 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    highlighted,\n    row,\n    offset,\n    onClick,\n    onDataEdited,\n    onToggleGroup,\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      [IDX]: rowIndex,\n      [IS_EXPANDED]: isExpanded,\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}-expanded`]: isExpanded,\n        [`${classBase}-highlighted`]: highlighted,\n        [`${classBase}-selected`]: selectionStatus & True,\n        [`${classBase}-selectedStart`]: selectionStatus & First,\n        [`${classBase}-selectedEnd`]: selectionStatus & Last,\n      },\n    );\n\n    const style = { transform: `translate3d(0px, ${offset}px, 0px)` };\n\n    const handleGroupCellClick = useCallback(\n      (evt: MouseEvent, column: RuntimeColumnDescriptor) => {\n        if (isGroupColumn(column) || isJsonGroup(column, row, columnMap)) {\n          evt.stopPropagation();\n          onToggleGroup?.(row, column);\n        }\n      },\n      [columnMap, onToggleGroup, row],\n    );\n\n    return (\n      <div\n        {...htmlAttributes}\n        role=\"row\"\n        className={className}\n        onClick={handleRowClick}\n        style={style}\n      >\n        <span className={`${classBase}-selectionDecorator vuuStickyLeft`} />\n        <VirtualColSpan width={virtualColSpan} />\n        {columns.filter(isNotHidden).map((column) => {\n          const isGroup = isGroupColumn(column);\n          const isJsonCell = isJsonColumn(column);\n          const Cell = isGroup ? 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            />\n          );\n        })}\n        <span className={`${classBase}-selectionDecorator vuuStickyRight`} />\n      </div>\n    );\n  },\n);\nRow.displayName = \"Row\";\n"],"names":["metadataKeys","forwardRef","RowProxy","useWindow","useComponentCssInjection","rowCss","jsx","memo","useCallback","RowSelected","isGroupColumn","isJsonGroup","jsxs","VirtualColSpan","isNotHidden","isJsonColumn","TableGroupCell","TableCell"],"mappings":"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"}
+{"version":3,"file":"Row.js","sources":["../src/Row.tsx"],"sourcesContent":["import { RowProps, RuntimeColumnDescriptor } from \"@vuu-ui/vuu-table-types\";\nimport {\n  isGroupColumn,\n  isJsonColumn,\n  isJsonGroup,\n  isNotHidden,\n  metadataKeys,\n  RowSelected\n} from \"@vuu-ui/vuu-utils\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport cx from \"clsx\";\nimport { forwardRef, memo, MouseEvent, useCallback } from \"react\";\nimport { TableCell, TableGroupCell } from \"./table-cell\";\n\nimport rowCss from \"./Row.css\";\nimport { VirtualColSpan } from \"./VirtualColSpan\";\n\nconst { IDX, IS_EXPANDED, 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    highlighted,\n    row,\n    offset,\n    onClick,\n    onDataEdited,\n    onToggleGroup,\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      [IDX]: rowIndex,\n      [IS_EXPANDED]: isExpanded,\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}-expanded`]: isExpanded,\n        [`${classBase}-highlighted`]: highlighted,\n        [`${classBase}-selected`]: selectionStatus & True,\n        [`${classBase}-selectedStart`]: selectionStatus & First,\n        [`${classBase}-selectedEnd`]: selectionStatus & Last\n      }\n    );\n\n    const style = { transform: `translate3d(0px, ${offset}px, 0px)` };\n\n    const handleGroupCellClick = useCallback(\n      (evt: MouseEvent, column: RuntimeColumnDescriptor) => {\n        if (isGroupColumn(column) || isJsonGroup(column, row, columnMap)) {\n          evt.stopPropagation();\n          onToggleGroup?.(row, column);\n        }\n      },\n      [columnMap, onToggleGroup, row]\n    );\n\n    return (\n      <div\n        {...htmlAttributes}\n        role=\"row\"\n        className={className}\n        onClick={handleRowClick}\n        style={style}\n      >\n        <span className={`${classBase}-selectionDecorator vuuStickyLeft`} />\n        <VirtualColSpan width={virtualColSpan} />\n        {columns.filter(isNotHidden).map((column) => {\n          const isGroup = isGroupColumn(column);\n          const isJsonCell = isJsonColumn(column);\n          const Cell = isGroup ? 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            />\n          );\n        })}\n        <span className={`${classBase}-selectionDecorator vuuStickyRight`} />\n      </div>\n    );\n  }\n);\nRow.displayName = \"Row\";\n"],"names":["metadataKeys","forwardRef","RowProxy","useWindow","useComponentCssInjection","rowCss","jsx","memo","useCallback","RowSelected","isGroupColumn","isJsonGroup","jsxs","VirtualColSpan","isNotHidden","isJsonColumn","TableGroupCell","TableCell"],"mappings":"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"}

package/cjs/Table.css.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var tableCss = ".vuuTable {\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\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  border-left: solid 1px var(--salt-container-primary-borderColor);\n  /*  a top border */\n  /** creates a border to top od scrollbar */\n  /* box-shadow: 0px -1px 0px 0px var(--salt-container-primary-borderColor); */\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(var(--table-height) - var(--horizontal-scrollbar-height));\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  position: absolute;\n  top: 0;\n  left: 0;\n  table-layout: fixed;\n  width: var(--content-width);\n  margin: 0;\n  border: none;\n  border-collapse: separate;\n  border-spacing: 0;\n}\n\n.vuuTable-body {\n  height: var(--content-height);\n  position: relative;\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  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    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";
+var tableCss = ".vuuTable {\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\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  border-left: solid 1px var(--salt-container-primary-borderColor);\n  /*  a top border */\n  /** creates a border to top od scrollbar */\n  /* box-shadow: 0px -1px 0px 0px var(--salt-container-primary-borderColor); */\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(var(--table-height) - var(--horizontal-scrollbar-height));\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  position: absolute;\n  top: 0;\n  left: 0;\n  table-layout: fixed;\n  width: var(--content-width);\n  margin: 0;\n  border: none;\n  border-collapse: separate;\n  border-spacing: 0;\n}\n\n.vuuTable-body {\n  height: var(--content-height);\n  position: relative;\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    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";
 
 module.exports = tableCss;
 //# sourceMappingURL=Table.css.js.map

package/cjs/Table.js

@@ -20,6 +20,7 @@ const classBase = "vuuTable";
 const { IDX, RENDER_IDX } = vuuUtils.metadataKeys;
 const TableCore = ({
   Row: Row$1 = Row.Row,
+  allowDragColumnHeader = true,
   allowDragDrop,
   availableColumns,
   config,
@@ -146,6 +147,7 @@ const TableCore = ({
                   showColumnHeaders ? /* @__PURE__ */ jsxRuntime.jsx(
                     TableHeader.TableHeader,
                     {
+                      allowDragColumnHeader,
                       columns: scrollProps.columnsWithinViewport,
                       customHeader,
                       headings,
@@ -191,6 +193,7 @@ const TableCore = ({
 };
 const Table = react.forwardRef(function Table2({
   Row: Row$1,
+  allowDragColumnHeader,
   allowDragDrop,
   availableColumns,
   className: classNameProp,
@@ -253,6 +256,7 @@ const Table = react.forwardRef(function Table2({
           TableCore,
           {
             Row: Row$1,
+            allowDragColumnHeader,
             allowDragDrop,
             availableColumns,
             config,

package/cjs/Table.js.map

@@ -1 +1 @@
-{"version":3,"file":"Table.js","sources":["../src/Table.tsx"],"sourcesContent":["import {\n  DataSource,\n  SchemaColumn,\n  SelectionChangeHandler,\n  VuuFeatureInvocationMessage,\n} from \"@vuu-ui/vuu-data-types\";\nimport { ContextMenuProvider } from \"@vuu-ui/vuu-popups\";\nimport {\n  CustomHeader,\n  RowProps,\n  TableConfig,\n  TableConfigChangeHandler,\n  TableRowClickHandler,\n  TableRowSelectHandler,\n  TableSelectionModel,\n} from \"@vuu-ui/vuu-table-types\";\nimport type { DragDropState } from \"@vuu-ui/vuu-ui-controls\";\nimport {\n  DragStartHandler,\n  MeasuredContainer,\n  MeasuredContainerProps,\n  MeasuredSize,\n  dragStrategy,\n} from \"@vuu-ui/vuu-ui-controls\";\nimport { metadataKeys, useId } from \"@vuu-ui/vuu-utils\";\nimport { useForkRef } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport cx from \"clsx\";\nimport {\n  CSSProperties,\n  FC,\n  ForwardedRef,\n  RefObject,\n  forwardRef,\n  useRef,\n  useState,\n} from \"react\";\nimport { Row as DefaultRow, RowProxy } from \"./Row\";\nimport { TableHeader } from \"./table-header\";\nimport { useMeasuredHeight } from \"./useMeasuredHeight\";\nimport { useTable } from \"./useTable\";\nimport { ScrollingAPI } from \"./useTableScroll\";\n\nimport tableCss from \"./Table.css\";\n\nconst classBase = \"vuuTable\";\n\nconst { IDX, RENDER_IDX } = metadataKeys;\n\nexport type TableNavigationStyle = \"none\" | \"cell\" | \"row\";\n\nexport interface TableProps\n  extends Omit<MeasuredContainerProps, \"onDragStart\" | \"onDrop\" | \"onSelect\"> {\n  Row?: FC<RowProps>;\n  allowConfigEditing?: boolean;\n  allowDragDrop?: boolean | dragStrategy;\n  /**\n   * required if a fully featured column picker is to be available\n   */\n  availableColumns?: SchemaColumn[];\n  /**\n   * Provide configuration settings for Table. At minimun, column\n   * descriptors must be provided.\n   */\n  config: TableConfig;\n  dataSource: DataSource;\n  disableFocus?: boolean;\n  /**\n   * Allows additional custom element(s) to be embedded immediately below column headers.\n   * Could be used to present inline filters for example.\n   */\n  customHeader?: CustomHeader | CustomHeader[];\n  /**\n   * Defined how focus navigation within data cells will be handled by table.\n   * Default is cell.\n   */\n  highlightedIndex?: number;\n  navigationStyle?: TableNavigationStyle;\n  /**\n   * required if a fully featured column picker is to be available.\n   * Available columns can be changed by the addition or removal of\n   * one or more calculated columns.\n   */\n  onAvailableColumnsChange?: (columns: SchemaColumn[]) => void;\n  /**\n   * This callback will be invoked any time a config attribute of TableConfig\n   * is changed. By persisting this value and providing it to the Table as a\n   * prop, table state can be persisted across sessions.\n   */\n  onConfigChange?: TableConfigChangeHandler;\n  onDragStart?: DragStartHandler;\n  onDrop?: (dragDropState: DragDropState) => void;\n  /**\n   * When a Vuu feature e.g. context menu action, has been invoked, the Vuu server\n   * response must be handled. This callback provides that response.\n   */\n  onFeatureInvocation?: (message: VuuFeatureInvocationMessage) => void;\n\n  onHighlight?: (idx: number) => void;\n  /**\n   * callback invoked when user 'clicks' a table row. CLick triggered either\n   * via mouse click or keyboard (default ENTER);\n   */\n  onRowClick?: TableRowClickHandler;\n  onSelect?: TableRowSelectHandler;\n  onSelectionChange?: SelectionChangeHandler;\n  renderBufferSize?: number;\n  /**\n   * Pixel height of rows. If specified here, this will take precedence over CSS\n   * values and Table will not respond to density changes.\n   */\n  rowHeight?: number;\n  /**\n   * imperative API for scrolling table\n   */\n  scrollingApiRef?: ForwardedRef<ScrollingAPI>;\n\n  /**\n   * Selection Bookends style the left and right edge of a selection block.\n   * They are optional, value defaults to zero.\n   * TODO this should just live in CSS\n   */\n  selectionBookendWidth?: number;\n  /**\n   * Selection behaviour for Table:\n   * `none` selection disabled\n   * `single` no more than one row may be selected\n   * `extended` (default) multiple rows can be selected\n   * `checkbox` same behaviour as extended, with checkbox column for selection\n   */\n  selectionModel?: TableSelectionModel;\n  /**\n   * if false, table rendered without headers. Useful when table is being included in a\n   * composite component.\n   */\n  showColumnHeaders?: boolean;\n  /**\n   * if false, column headers will not display menu icon. Menu items are still available\n   * from contexct menu\n   */\n  showColumnHeaderMenus?: boolean;\n}\n\nconst TableCore = ({\n  Row = DefaultRow,\n  allowDragDrop,\n  availableColumns,\n  config,\n  containerRef,\n  customHeader,\n  dataSource,\n  disableFocus = false,\n  highlightedIndex: highlightedIndexProp,\n  id: idProp,\n  navigationStyle = \"cell\",\n  onAvailableColumnsChange,\n  onConfigChange,\n  onDragStart,\n  onDrop,\n  onFeatureInvocation,\n  onHighlight,\n  onRowClick: onRowClickProp,\n  onSelect,\n  onSelectionChange,\n  renderBufferSize = 5,\n  rowHeight,\n  scrollingApiRef,\n  selectionModel = \"extended\",\n  showColumnHeaders = true,\n  showColumnHeaderMenus = true,\n  size,\n}: Omit<TableProps, \"rowHeight\"> & {\n  containerRef: RefObject<HTMLDivElement>;\n  rowHeight: number;\n  size: MeasuredSize;\n}) => {\n  const id = useId(idProp);\n  const {\n    columnMap,\n    columns,\n    data,\n    draggableRow,\n    getRowOffset,\n    handleContextMenuAction,\n    headerHeight,\n    headings,\n    highlightedIndex,\n    menuBuilder,\n    onDataEdited,\n    onHeaderHeightMeasured,\n    onMoveColumn,\n    onMoveGroupColumn,\n    onRemoveGroupColumn,\n    onResizeColumn,\n    onRowClick,\n    onSortColumn,\n    onToggleGroup,\n    rowClassNameGenerator,\n    scrollProps,\n    tableAttributes,\n    tableConfig,\n    viewportMeasurements,\n    ...tableProps\n  } = useTable({\n    allowDragDrop,\n    availableColumns,\n    config,\n    containerRef,\n    dataSource,\n    disableFocus,\n    highlightedIndex: highlightedIndexProp,\n    id,\n    navigationStyle,\n    onAvailableColumnsChange,\n    onConfigChange,\n    onDragStart,\n    onDrop,\n    onFeatureInvocation,\n    onHighlight,\n    onRowClick: onRowClickProp,\n    onSelect,\n    onSelectionChange,\n    renderBufferSize: Math.max(5, renderBufferSize),\n    rowHeight,\n    scrollingApiRef,\n    selectionModel,\n    size,\n  });\n\n  const contentContainerClassName = cx(`${classBase}-contentContainer`, {\n    [`${classBase}-colLines`]: tableAttributes.columnSeparators,\n    [`${classBase}-rowLines`]: tableAttributes.rowSeparators,\n    [`${classBase}-zebra`]: tableAttributes.zebraStripes,\n  });\n\n  const cssVariables = {\n    \"--content-height\": `${viewportMeasurements.contentHeight}px`,\n    \"--content-width\": `${viewportMeasurements.contentWidth}px`,\n    \"--horizontal-scrollbar-height\": `${viewportMeasurements.horizontalScrollbarHeight}px`,\n    \"--pinned-width-left\": `${viewportMeasurements.pinnedWidthLeft}px`,\n    \"--pinned-width-right\": `${viewportMeasurements.pinnedWidthRight}px`,\n    \"--total-header-height\": `${headerHeight}px`,\n    \"--vertical-scrollbar-width\": `${viewportMeasurements.verticalScrollbarWidth}px`,\n    \"--viewport-body-height\": `${viewportMeasurements.viewportBodyHeight}px`,\n  } as CSSProperties;\n\n  return (\n    <ContextMenuProvider\n      menuActionHandler={handleContextMenuAction}\n      menuBuilder={menuBuilder}\n    >\n      <div\n        className={`${classBase}-scrollbarContainer`}\n        ref={scrollProps.scrollbarContainerRef}\n        style={cssVariables}\n      >\n        <div className={`${classBase}-scrollbarContent`} />\n      </div>\n      <div\n        className={contentContainerClassName}\n        ref={scrollProps.contentContainerRef}\n        style={cssVariables}\n      >\n        <div\n          {...tableProps}\n          className={`${classBase}-table`}\n          role=\"table\"\n          tabIndex={disableFocus ? undefined : -1}\n        >\n          {showColumnHeaders ? (\n            <TableHeader\n              columns={scrollProps.columnsWithinViewport}\n              customHeader={customHeader}\n              headings={headings}\n              onHeightMeasured={onHeaderHeightMeasured}\n              onMoveColumn={onMoveColumn}\n              onMoveGroupColumn={onMoveGroupColumn}\n              onRemoveGroupColumn={onRemoveGroupColumn}\n              onResizeColumn={onResizeColumn}\n              onSortColumn={onSortColumn}\n              showColumnHeaderMenus={showColumnHeaderMenus}\n              tableConfig={tableConfig}\n              tableId={id}\n              virtualColSpan={scrollProps.virtualColSpan}\n            />\n          ) : null}\n          {showColumnHeaders === false || headerHeight > 0 ? (\n            <div className={`${classBase}-body`}>\n              {data.map((data) => (\n                <Row\n                  aria-rowindex={data[0] + 1}\n                  classNameGenerator={rowClassNameGenerator}\n                  columnMap={columnMap}\n                  columns={scrollProps.columnsWithinViewport}\n                  highlighted={highlightedIndex === data[IDX]}\n                  key={data[RENDER_IDX]}\n                  onClick={onRowClick}\n                  onDataEdited={onDataEdited}\n                  row={data}\n                  offset={getRowOffset(data)}\n                  onToggleGroup={onToggleGroup}\n                  virtualColSpan={scrollProps.virtualColSpan}\n                  zebraStripes={tableAttributes.zebraStripes}\n                />\n              ))}\n            </div>\n          ) : null}\n        </div>\n      </div>\n      {draggableRow}\n    </ContextMenuProvider>\n  );\n};\n\nexport const Table = forwardRef(function Table(\n  {\n    Row,\n    allowDragDrop,\n    availableColumns,\n    className: classNameProp,\n    config,\n    customHeader,\n    dataSource,\n    disableFocus,\n    highlightedIndex,\n    id,\n    navigationStyle,\n    onAvailableColumnsChange,\n    onConfigChange,\n    onDragStart,\n    onDrop,\n    onFeatureInvocation,\n    onHighlight,\n    onRowClick,\n    onSelect,\n    onSelectionChange,\n    renderBufferSize,\n    rowHeight: rowHeightProp,\n    scrollingApiRef,\n    selectionModel,\n    showColumnHeaders,\n    showColumnHeaderMenus,\n    style: styleProp,\n    ...htmlAttributes\n  }: TableProps,\n  forwardedRef: ForwardedRef<HTMLDivElement>,\n) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-table\",\n    css: tableCss,\n    window: targetWindow,\n  });\n\n  const containerRef = useRef<HTMLDivElement>(null);\n\n  const [size, setSize] = useState<MeasuredSize>();\n\n  const { rowHeight, rowRef } = useMeasuredHeight({ height: rowHeightProp });\n\n  if (config === undefined) {\n    throw Error(\n      \"vuu Table requires config prop. Minimum config is list of Column Descriptors\",\n    );\n  }\n  if (dataSource === undefined) {\n    throw Error(\"vuu Table requires dataSource prop\");\n  }\n\n  // TODO render TableHeader here and measure before row construction begins\n  // TODO we could have MeasuredContainer render a Provider and make size available via a context hook ?\n  return (\n    <MeasuredContainer\n      {...htmlAttributes}\n      className={cx(classBase, classNameProp)}\n      id={id}\n      onResize={setSize}\n      ref={useForkRef(containerRef, forwardedRef)}\n      style={\n        {\n          \"--row-height-prop\": rowHeight > 0 ? `${rowHeight}px` : undefined,\n        } as CSSProperties\n      }\n    >\n      <RowProxy ref={rowRef} height={rowHeightProp} />\n\n      {size && rowHeight ? (\n        <TableCore\n          Row={Row}\n          allowDragDrop={allowDragDrop}\n          availableColumns={availableColumns}\n          config={config}\n          containerRef={containerRef}\n          customHeader={customHeader}\n          dataSource={dataSource}\n          disableFocus={disableFocus}\n          highlightedIndex={highlightedIndex}\n          id={id}\n          navigationStyle={navigationStyle}\n          onAvailableColumnsChange={onAvailableColumnsChange}\n          onConfigChange={onConfigChange}\n          onDragStart={onDragStart}\n          onDrop={onDrop}\n          onFeatureInvocation={onFeatureInvocation}\n          onHighlight={onHighlight}\n          onRowClick={onRowClick}\n          onSelect={onSelect}\n          onSelectionChange={onSelectionChange}\n          renderBufferSize={renderBufferSize}\n          rowHeight={rowHeight}\n          scrollingApiRef={scrollingApiRef}\n          selectionModel={selectionModel}\n          showColumnHeaders={showColumnHeaders}\n          showColumnHeaderMenus={showColumnHeaderMenus}\n          size={size}\n        />\n      ) : null}\n    </MeasuredContainer>\n  );\n});\n"],"names":["metadataKeys","Row","DefaultRow","useId","useTable","jsxs","ContextMenuProvider","jsx","TableHeader","data","forwardRef","Table","useWindow","useComponentCssInjection","tableCss","useRef","useState","useMeasuredHeight","MeasuredContainer","useForkRef","RowProxy"],"mappings":";;;;;;;;;;;;;;;;;;AA8CA,MAAM,SAAY,GAAA,UAAA,CAAA;AAElB,MAAM,EAAE,GAAK,EAAA,UAAA,EAAe,GAAAA,qBAAA,CAAA;AAgG5B,MAAM,YAAY,CAAC;AAAA,OACjBC,KAAM,GAAAC,OAAA;AAAA,EACN,aAAA;AAAA,EACA,gBAAA;AAAA,EACA,MAAA;AAAA,EACA,YAAA;AAAA,EACA,YAAA;AAAA,EACA,UAAA;AAAA,EACA,YAAe,GAAA,KAAA;AAAA,EACf,gBAAkB,EAAA,oBAAA;AAAA,EAClB,EAAI,EAAA,MAAA;AAAA,EACJ,eAAkB,GAAA,MAAA;AAAA,EAClB,wBAAA;AAAA,EACA,cAAA;AAAA,EACA,WAAA;AAAA,EACA,MAAA;AAAA,EACA,mBAAA;AAAA,EACA,WAAA;AAAA,EACA,UAAY,EAAA,cAAA;AAAA,EACZ,QAAA;AAAA,EACA,iBAAA;AAAA,EACA,gBAAmB,GAAA,CAAA;AAAA,EACnB,SAAA;AAAA,EACA,eAAA;AAAA,EACA,cAAiB,GAAA,UAAA;AAAA,EACjB,iBAAoB,GAAA,IAAA;AAAA,EACpB,qBAAwB,GAAA,IAAA;AAAA,EACxB,IAAA;AACF,CAIM,KAAA;AACJ,EAAM,MAAA,EAAA,GAAKC,eAAM,MAAM,CAAA,CAAA;AACvB,EAAM,MAAA;AAAA,IACJ,SAAA;AAAA,IACA,OAAA;AAAA,IACA,IAAA;AAAA,IACA,YAAA;AAAA,IACA,YAAA;AAAA,IACA,uBAAA;AAAA,IACA,YAAA;AAAA,IACA,QAAA;AAAA,IACA,gBAAA;AAAA,IACA,WAAA;AAAA,IACA,YAAA;AAAA,IACA,sBAAA;AAAA,IACA,YAAA;AAAA,IACA,iBAAA;AAAA,IACA,mBAAA;AAAA,IACA,cAAA;AAAA,IACA,UAAA;AAAA,IACA,YAAA;AAAA,IACA,aAAA;AAAA,IACA,qBAAA;AAAA,IACA,WAAA;AAAA,IACA,eAAA;AAAA,IACA,WAAA;AAAA,IACA,oBAAA;AAAA,IACA,GAAG,UAAA;AAAA,MACDC,iBAAS,CAAA;AAAA,IACX,aAAA;AAAA,IACA,gBAAA;AAAA,IACA,MAAA;AAAA,IACA,YAAA;AAAA,IACA,UAAA;AAAA,IACA,YAAA;AAAA,IACA,gBAAkB,EAAA,oBAAA;AAAA,IAClB,EAAA;AAAA,IACA,eAAA;AAAA,IACA,wBAAA;AAAA,IACA,cAAA;AAAA,IACA,WAAA;AAAA,IACA,MAAA;AAAA,IACA,mBAAA;AAAA,IACA,WAAA;AAAA,IACA,UAAY,EAAA,cAAA;AAAA,IACZ,QAAA;AAAA,IACA,iBAAA;AAAA,IACA,gBAAkB,EAAA,IAAA,CAAK,GAAI,CAAA,CAAA,EAAG,gBAAgB,CAAA;AAAA,IAC9C,SAAA;AAAA,IACA,eAAA;AAAA,IACA,cAAA;AAAA,IACA,IAAA;AAAA,GACD,CAAA,CAAA;AAED,EAAA,MAAM,yBAA4B,GAAA,EAAA,CAAG,CAAG,EAAA,SAAS,CAAqB,iBAAA,CAAA,EAAA;AAAA,IACpE,CAAC,CAAA,EAAG,SAAS,CAAA,SAAA,CAAW,GAAG,eAAgB,CAAA,gBAAA;AAAA,IAC3C,CAAC,CAAA,EAAG,SAAS,CAAA,SAAA,CAAW,GAAG,eAAgB,CAAA,aAAA;AAAA,IAC3C,CAAC,CAAA,EAAG,SAAS,CAAA,MAAA,CAAQ,GAAG,eAAgB,CAAA,YAAA;AAAA,GACzC,CAAA,CAAA;AAED,EAAA,MAAM,YAAe,GAAA;AAAA,IACnB,kBAAA,EAAoB,CAAG,EAAA,oBAAA,CAAqB,aAAa,CAAA,EAAA,CAAA;AAAA,IACzD,iBAAA,EAAmB,CAAG,EAAA,oBAAA,CAAqB,YAAY,CAAA,EAAA,CAAA;AAAA,IACvD,+BAAA,EAAiC,CAAG,EAAA,oBAAA,CAAqB,yBAAyB,CAAA,EAAA,CAAA;AAAA,IAClF,qBAAA,EAAuB,CAAG,EAAA,oBAAA,CAAqB,eAAe,CAAA,EAAA,CAAA;AAAA,IAC9D,sBAAA,EAAwB,CAAG,EAAA,oBAAA,CAAqB,gBAAgB,CAAA,EAAA,CAAA;AAAA,IAChE,uBAAA,EAAyB,GAAG,YAAY,CAAA,EAAA,CAAA;AAAA,IACxC,4BAAA,EAA8B,CAAG,EAAA,oBAAA,CAAqB,sBAAsB,CAAA,EAAA,CAAA;AAAA,IAC5E,wBAAA,EAA0B,CAAG,EAAA,oBAAA,CAAqB,kBAAkB,CAAA,EAAA,CAAA;AAAA,GACtE,CAAA;AAEA,EACE,uBAAAC,eAAA;AAAA,IAACC,6BAAA;AAAA,IAAA;AAAA,MACC,iBAAmB,EAAA,uBAAA;AAAA,MACnB,WAAA;AAAA,MAEA,QAAA,EAAA;AAAA,wBAAAC,cAAA;AAAA,UAAC,KAAA;AAAA,UAAA;AAAA,YACC,SAAA,EAAW,GAAG,SAAS,CAAA,mBAAA,CAAA;AAAA,YACvB,KAAK,WAAY,CAAA,qBAAA;AAAA,YACjB,KAAO,EAAA,YAAA;AAAA,YAEP,QAAC,kBAAAA,cAAA,CAAA,KAAA,EAAA,EAAI,SAAW,EAAA,CAAA,EAAG,SAAS,CAAqB,iBAAA,CAAA,EAAA,CAAA;AAAA,WAAA;AAAA,SACnD;AAAA,wBACAA,cAAA;AAAA,UAAC,KAAA;AAAA,UAAA;AAAA,YACC,SAAW,EAAA,yBAAA;AAAA,YACX,KAAK,WAAY,CAAA,mBAAA;AAAA,YACjB,KAAO,EAAA,YAAA;AAAA,YAEP,QAAA,kBAAAF,eAAA;AAAA,cAAC,KAAA;AAAA,cAAA;AAAA,gBACE,GAAG,UAAA;AAAA,gBACJ,SAAA,EAAW,GAAG,SAAS,CAAA,MAAA,CAAA;AAAA,gBACvB,IAAK,EAAA,OAAA;AAAA,gBACL,QAAA,EAAU,eAAe,KAAY,CAAA,GAAA,CAAA,CAAA;AAAA,gBAEpC,QAAA,EAAA;AAAA,kBACC,iBAAA,mBAAAE,cAAA;AAAA,oBAACC,uBAAA;AAAA,oBAAA;AAAA,sBACC,SAAS,WAAY,CAAA,qBAAA;AAAA,sBACrB,YAAA;AAAA,sBACA,QAAA;AAAA,sBACA,gBAAkB,EAAA,sBAAA;AAAA,sBAClB,YAAA;AAAA,sBACA,iBAAA;AAAA,sBACA,mBAAA;AAAA,sBACA,cAAA;AAAA,sBACA,YAAA;AAAA,sBACA,qBAAA;AAAA,sBACA,WAAA;AAAA,sBACA,OAAS,EAAA,EAAA;AAAA,sBACT,gBAAgB,WAAY,CAAA,cAAA;AAAA,qBAAA;AAAA,mBAE5B,GAAA,IAAA;AAAA,kBACH,iBAAsB,KAAA,KAAA,IAAS,YAAe,GAAA,CAAA,mBAC5CD,cAAA,CAAA,KAAA,EAAA,EAAI,SAAW,EAAA,CAAA,EAAG,SAAS,CAAA,KAAA,CAAA,EACzB,QAAK,EAAA,IAAA,CAAA,GAAA,CAAI,CAACE,KACT,qBAAAF,cAAA;AAAA,oBAACN,KAAA;AAAA,oBAAA;AAAA,sBACC,eAAA,EAAeQ,KAAK,CAAA,CAAC,CAAI,GAAA,CAAA;AAAA,sBACzB,kBAAoB,EAAA,qBAAA;AAAA,sBACpB,SAAA;AAAA,sBACA,SAAS,WAAY,CAAA,qBAAA;AAAA,sBACrB,WAAA,EAAa,gBAAqBA,KAAAA,KAAAA,CAAK,GAAG,CAAA;AAAA,sBAE1C,OAAS,EAAA,UAAA;AAAA,sBACT,YAAA;AAAA,sBACA,GAAKA,EAAAA,KAAAA;AAAA,sBACL,MAAA,EAAQ,aAAaA,KAAI,CAAA;AAAA,sBACzB,aAAA;AAAA,sBACA,gBAAgB,WAAY,CAAA,cAAA;AAAA,sBAC5B,cAAc,eAAgB,CAAA,YAAA;AAAA,qBAAA;AAAA,oBAPzBA,MAAK,UAAU,CAAA;AAAA,mBASvB,GACH,CACE,GAAA,IAAA;AAAA,iBAAA;AAAA,eAAA;AAAA,aACN;AAAA,WAAA;AAAA,SACF;AAAA,QACC,YAAA;AAAA,OAAA;AAAA,KAAA;AAAA,GACH,CAAA;AAEJ,CAAA,CAAA;AAEa,MAAA,KAAA,GAAQC,gBAAW,CAAA,SAASC,MACvC,CAAA;AAAA,OACEV,KAAA;AAAA,EACA,aAAA;AAAA,EACA,gBAAA;AAAA,EACA,SAAW,EAAA,aAAA;AAAA,EACX,MAAA;AAAA,EACA,YAAA;AAAA,EACA,UAAA;AAAA,EACA,YAAA;AAAA,EACA,gBAAA;AAAA,EACA,EAAA;AAAA,EACA,eAAA;AAAA,EACA,wBAAA;AAAA,EACA,cAAA;AAAA,EACA,WAAA;AAAA,EACA,MAAA;AAAA,EACA,mBAAA;AAAA,EACA,WAAA;AAAA,EACA,UAAA;AAAA,EACA,QAAA;AAAA,EACA,iBAAA;AAAA,EACA,gBAAA;AAAA,EACA,SAAW,EAAA,aAAA;AAAA,EACX,eAAA;AAAA,EACA,cAAA;AAAA,EACA,iBAAA;AAAA,EACA,qBAAA;AAAA,EACA,KAAO,EAAA,SAAA;AAAA,EACP,GAAG,cAAA;AACL,CAAA,EACA,YACA,EAAA;AACA,EAAA,MAAM,eAAeW,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,WAAA;AAAA,IACR,GAAK,EAAAC,OAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAM,MAAA,YAAA,GAAeC,aAAuB,IAAI,CAAA,CAAA;AAEhD,EAAA,MAAM,CAAC,IAAA,EAAM,OAAO,CAAA,GAAIC,cAAuB,EAAA,CAAA;AAE/C,EAAM,MAAA,EAAE,WAAW,MAAO,EAAA,GAAIC,oCAAkB,EAAE,MAAA,EAAQ,eAAe,CAAA,CAAA;AAEzE,EAAA,IAAI,WAAW,KAAW,CAAA,EAAA;AACxB,IAAM,MAAA,KAAA;AAAA,MACJ,8EAAA;AAAA,KACF,CAAA;AAAA,GACF;AACA,EAAA,IAAI,eAAe,KAAW,CAAA,EAAA;AAC5B,IAAA,MAAM,MAAM,oCAAoC,CAAA,CAAA;AAAA,GAClD;AAIA,EACE,uBAAAZ,eAAA;AAAA,IAACa,+BAAA;AAAA,IAAA;AAAA,MACE,GAAG,cAAA;AAAA,MACJ,SAAA,EAAW,EAAG,CAAA,SAAA,EAAW,aAAa,CAAA;AAAA,MACtC,EAAA;AAAA,MACA,QAAU,EAAA,OAAA;AAAA,MACV,GAAA,EAAKC,eAAW,CAAA,YAAA,EAAc,YAAY,CAAA;AAAA,MAC1C,KACE,EAAA;AAAA,QACE,mBAAqB,EAAA,SAAA,GAAY,CAAI,GAAA,CAAA,EAAG,SAAS,CAAO,EAAA,CAAA,GAAA,KAAA,CAAA;AAAA,OAC1D;AAAA,MAGF,QAAA,EAAA;AAAA,wBAAAZ,cAAA,CAACa,YAAS,EAAA,EAAA,GAAA,EAAK,MAAQ,EAAA,MAAA,EAAQ,aAAe,EAAA,CAAA;AAAA,QAE7C,QAAQ,SACP,mBAAAb,cAAA;AAAA,UAAC,SAAA;AAAA,UAAA;AAAA,iBACCN,KAAA;AAAA,YACA,aAAA;AAAA,YACA,gBAAA;AAAA,YACA,MAAA;AAAA,YACA,YAAA;AAAA,YACA,YAAA;AAAA,YACA,UAAA;AAAA,YACA,YAAA;AAAA,YACA,gBAAA;AAAA,YACA,EAAA;AAAA,YACA,eAAA;AAAA,YACA,wBAAA;AAAA,YACA,cAAA;AAAA,YACA,WAAA;AAAA,YACA,MAAA;AAAA,YACA,mBAAA;AAAA,YACA,WAAA;AAAA,YACA,UAAA;AAAA,YACA,QAAA;AAAA,YACA,iBAAA;AAAA,YACA,gBAAA;AAAA,YACA,SAAA;AAAA,YACA,eAAA;AAAA,YACA,cAAA;AAAA,YACA,iBAAA;AAAA,YACA,qBAAA;AAAA,YACA,IAAA;AAAA,WAAA;AAAA,SAEA,GAAA,IAAA;AAAA,OAAA;AAAA,KAAA;AAAA,GACN,CAAA;AAEJ,CAAC;;;;"}
+{"version":3,"file":"Table.js","sources":["../src/Table.tsx"],"sourcesContent":["import {\n  DataSource,\n  SchemaColumn,\n  SelectionChangeHandler,\n  VuuFeatureInvocationMessage\n} from \"@vuu-ui/vuu-data-types\";\nimport { ContextMenuProvider } from \"@vuu-ui/vuu-popups\";\nimport {\n  CustomHeader,\n  RowProps,\n  TableConfig,\n  TableConfigChangeHandler,\n  TableRowClickHandler,\n  TableRowSelectHandler,\n  TableSelectionModel\n} from \"@vuu-ui/vuu-table-types\";\nimport type { DragDropState } from \"@vuu-ui/vuu-ui-controls\";\nimport {\n  DragStartHandler,\n  MeasuredContainer,\n  MeasuredContainerProps,\n  MeasuredSize,\n  dragStrategy\n} from \"@vuu-ui/vuu-ui-controls\";\nimport { metadataKeys, useId } from \"@vuu-ui/vuu-utils\";\nimport { useForkRef } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport cx from \"clsx\";\nimport {\n  CSSProperties,\n  FC,\n  ForwardedRef,\n  RefObject,\n  forwardRef,\n  useRef,\n  useState\n} from \"react\";\nimport { Row as DefaultRow, RowProxy } from \"./Row\";\nimport { TableHeader } from \"./table-header\";\nimport { useMeasuredHeight } from \"./useMeasuredHeight\";\nimport { useTable } from \"./useTable\";\nimport { ScrollingAPI } from \"./useTableScroll\";\n\nimport tableCss from \"./Table.css\";\n\nconst classBase = \"vuuTable\";\n\nconst { IDX, RENDER_IDX } = metadataKeys;\n\nexport type TableNavigationStyle = \"none\" | \"cell\" | \"row\";\n\nexport interface TableProps\n  extends Omit<MeasuredContainerProps, \"onDragStart\" | \"onDrop\" | \"onSelect\"> {\n  Row?: FC<RowProps>;\n  allowConfigEditing?: boolean;\n  /**\n   * Allow column headers to be dragged to re-arrange\n   */\n  allowDragColumnHeader?: boolean;\n  /**\n   * Allow rows to be draggable\n   */\n  allowDragDrop?: boolean | dragStrategy;\n  /**\n   * required if a fully featured column picker is to be available\n   */\n  availableColumns?: SchemaColumn[];\n  /**\n   * Provide configuration settings for Table. At minimun, column\n   * descriptors must be provided.\n   */\n  config: TableConfig;\n  dataSource: DataSource;\n  disableFocus?: boolean;\n  /**\n   * Allows additional custom element(s) to be embedded immediately below column headers.\n   * Could be used to present inline filters for example.\n   * Accepts either a React Element or a Function Component or an array of these. If a React\n   * Function Component is used, it will be passed the props described in BaseRowProps.\n   */\n  customHeader?: CustomHeader | CustomHeader[];\n  /**\n   * Defined how focus navigation within data cells will be handled by table.\n   * Default is cell.\n   */\n  highlightedIndex?: number;\n  navigationStyle?: TableNavigationStyle;\n  /**\n   * required if a fully featured column picker is to be available.\n   * Available columns can be changed by the addition or removal of\n   * one or more calculated columns.\n   */\n  onAvailableColumnsChange?: (columns: SchemaColumn[]) => void;\n  /**\n   * This callback will be invoked any time a config attribute of TableConfig\n   * is changed. By persisting this value and providing it to the Table as a\n   * prop, table state can be persisted across sessions.\n   */\n  onConfigChange?: TableConfigChangeHandler;\n  onDragStart?: DragStartHandler;\n  onDrop?: (dragDropState: DragDropState) => void;\n  /**\n   * When a Vuu feature e.g. context menu action, has been invoked, the Vuu server\n   * response must be handled. This callback provides that response.\n   */\n  onFeatureInvocation?: (message: VuuFeatureInvocationMessage) => void;\n\n  onHighlight?: (idx: number) => void;\n  /**\n   * callback invoked when user 'clicks' a table row. CLick triggered either\n   * via mouse click or keyboard (default ENTER);\n   */\n  onRowClick?: TableRowClickHandler;\n  onSelect?: TableRowSelectHandler;\n  onSelectionChange?: SelectionChangeHandler;\n  renderBufferSize?: number;\n  /**\n   * Pixel height of rows. If specified here, this will take precedence over CSS\n   * values and Table will not respond to density changes.\n   */\n  rowHeight?: number;\n  /**\n   * imperative API for scrolling table\n   */\n  scrollingApiRef?: ForwardedRef<ScrollingAPI>;\n\n  /**\n   * Selection Bookends style the left and right edge of a selection block.\n   * They are optional, value defaults to zero.\n   * TODO this should just live in CSS\n   */\n  selectionBookendWidth?: number;\n  /**\n   * Selection behaviour for Table:\n   * `none` selection disabled\n   * `single` no more than one row may be selected\n   * `extended` (default) multiple rows can be selected\n   * `checkbox` same behaviour as extended, with checkbox column for selection\n   */\n  selectionModel?: TableSelectionModel;\n  /**\n   * if false, table rendered without headers. Useful when table is being included in a\n   * composite component.\n   */\n  showColumnHeaders?: boolean;\n  /**\n   * if false, column headers will not display menu icon. Menu items are still available\n   * from contexct menu\n   */\n  showColumnHeaderMenus?: boolean;\n}\n\nconst TableCore = ({\n  Row = DefaultRow,\n  allowDragColumnHeader = true,\n  allowDragDrop,\n  availableColumns,\n  config,\n  containerRef,\n  customHeader,\n  dataSource,\n  disableFocus = false,\n  highlightedIndex: highlightedIndexProp,\n  id: idProp,\n  navigationStyle = \"cell\",\n  onAvailableColumnsChange,\n  onConfigChange,\n  onDragStart,\n  onDrop,\n  onFeatureInvocation,\n  onHighlight,\n  onRowClick: onRowClickProp,\n  onSelect,\n  onSelectionChange,\n  renderBufferSize = 5,\n  rowHeight,\n  scrollingApiRef,\n  selectionModel = \"extended\",\n  showColumnHeaders = true,\n  showColumnHeaderMenus = true,\n  size\n}: Omit<TableProps, \"rowHeight\"> & {\n  containerRef: RefObject<HTMLDivElement>;\n  rowHeight: number;\n  size: MeasuredSize;\n}) => {\n  const id = useId(idProp);\n  const {\n    columnMap,\n    columns,\n    data,\n    draggableRow,\n    getRowOffset,\n    handleContextMenuAction,\n    headerHeight,\n    headings,\n    highlightedIndex,\n    menuBuilder,\n    onDataEdited,\n    onHeaderHeightMeasured,\n    onMoveColumn,\n    onMoveGroupColumn,\n    onRemoveGroupColumn,\n    onResizeColumn,\n    onRowClick,\n    onSortColumn,\n    onToggleGroup,\n    rowClassNameGenerator,\n    scrollProps,\n    tableAttributes,\n    tableConfig,\n    viewportMeasurements,\n    ...tableProps\n  } = useTable({\n    allowDragDrop,\n    availableColumns,\n    config,\n    containerRef,\n    dataSource,\n    disableFocus,\n    highlightedIndex: highlightedIndexProp,\n    id,\n    navigationStyle,\n    onAvailableColumnsChange,\n    onConfigChange,\n    onDragStart,\n    onDrop,\n    onFeatureInvocation,\n    onHighlight,\n    onRowClick: onRowClickProp,\n    onSelect,\n    onSelectionChange,\n    renderBufferSize: Math.max(5, renderBufferSize),\n    rowHeight,\n    scrollingApiRef,\n    selectionModel,\n    size\n  });\n\n  const contentContainerClassName = cx(`${classBase}-contentContainer`, {\n    [`${classBase}-colLines`]: tableAttributes.columnSeparators,\n    [`${classBase}-rowLines`]: tableAttributes.rowSeparators,\n    [`${classBase}-zebra`]: tableAttributes.zebraStripes\n  });\n\n  const cssVariables = {\n    \"--content-height\": `${viewportMeasurements.contentHeight}px`,\n    \"--content-width\": `${viewportMeasurements.contentWidth}px`,\n    \"--horizontal-scrollbar-height\": `${viewportMeasurements.horizontalScrollbarHeight}px`,\n    \"--pinned-width-left\": `${viewportMeasurements.pinnedWidthLeft}px`,\n    \"--pinned-width-right\": `${viewportMeasurements.pinnedWidthRight}px`,\n    \"--total-header-height\": `${headerHeight}px`,\n    \"--vertical-scrollbar-width\": `${viewportMeasurements.verticalScrollbarWidth}px`,\n    \"--viewport-body-height\": `${viewportMeasurements.viewportBodyHeight}px`\n  } as CSSProperties;\n\n  return (\n    <ContextMenuProvider\n      menuActionHandler={handleContextMenuAction}\n      menuBuilder={menuBuilder}\n    >\n      <div\n        className={`${classBase}-scrollbarContainer`}\n        ref={scrollProps.scrollbarContainerRef}\n        style={cssVariables}\n      >\n        <div className={`${classBase}-scrollbarContent`} />\n      </div>\n      <div\n        className={contentContainerClassName}\n        ref={scrollProps.contentContainerRef}\n        style={cssVariables}\n      >\n        <div\n          {...tableProps}\n          className={`${classBase}-table`}\n          role=\"table\"\n          tabIndex={disableFocus ? undefined : -1}\n        >\n          {showColumnHeaders ? (\n            <TableHeader\n              allowDragColumnHeader={allowDragColumnHeader}\n              columns={scrollProps.columnsWithinViewport}\n              customHeader={customHeader}\n              headings={headings}\n              onHeightMeasured={onHeaderHeightMeasured}\n              onMoveColumn={onMoveColumn}\n              onMoveGroupColumn={onMoveGroupColumn}\n              onRemoveGroupColumn={onRemoveGroupColumn}\n              onResizeColumn={onResizeColumn}\n              onSortColumn={onSortColumn}\n              showColumnHeaderMenus={showColumnHeaderMenus}\n              tableConfig={tableConfig}\n              tableId={id}\n              virtualColSpan={scrollProps.virtualColSpan}\n            />\n          ) : null}\n          {showColumnHeaders === false || headerHeight > 0 ? (\n            <div className={`${classBase}-body`}>\n              {data.map((data) => (\n                <Row\n                  aria-rowindex={data[0] + 1}\n                  classNameGenerator={rowClassNameGenerator}\n                  columnMap={columnMap}\n                  columns={scrollProps.columnsWithinViewport}\n                  highlighted={highlightedIndex === data[IDX]}\n                  key={data[RENDER_IDX]}\n                  onClick={onRowClick}\n                  onDataEdited={onDataEdited}\n                  row={data}\n                  offset={getRowOffset(data)}\n                  onToggleGroup={onToggleGroup}\n                  virtualColSpan={scrollProps.virtualColSpan}\n                  zebraStripes={tableAttributes.zebraStripes}\n                />\n              ))}\n            </div>\n          ) : null}\n        </div>\n      </div>\n      {draggableRow}\n    </ContextMenuProvider>\n  );\n};\n\nexport const Table = forwardRef(function Table(\n  {\n    Row,\n    allowDragColumnHeader,\n    allowDragDrop,\n    availableColumns,\n    className: classNameProp,\n    config,\n    customHeader,\n    dataSource,\n    disableFocus,\n    highlightedIndex,\n    id,\n    navigationStyle,\n    onAvailableColumnsChange,\n    onConfigChange,\n    onDragStart,\n    onDrop,\n    onFeatureInvocation,\n    onHighlight,\n    onRowClick,\n    onSelect,\n    onSelectionChange,\n    renderBufferSize,\n    rowHeight: rowHeightProp,\n    scrollingApiRef,\n    selectionModel,\n    showColumnHeaders,\n    showColumnHeaderMenus,\n    style: styleProp,\n    ...htmlAttributes\n  }: TableProps,\n  forwardedRef: ForwardedRef<HTMLDivElement>\n) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-table\",\n    css: tableCss,\n    window: targetWindow\n  });\n\n  const containerRef = useRef<HTMLDivElement>(null);\n\n  const [size, setSize] = useState<MeasuredSize>();\n\n  const { rowHeight, rowRef } = useMeasuredHeight({ height: rowHeightProp });\n\n  if (config === undefined) {\n    throw Error(\n      \"vuu Table requires config prop. Minimum config is list of Column Descriptors\"\n    );\n  }\n  if (dataSource === undefined) {\n    throw Error(\"vuu Table requires dataSource prop\");\n  }\n\n  // TODO render TableHeader here and measure before row construction begins\n  // TODO we could have MeasuredContainer render a Provider and make size available via a context hook ?\n  return (\n    <MeasuredContainer\n      {...htmlAttributes}\n      className={cx(classBase, classNameProp)}\n      id={id}\n      onResize={setSize}\n      ref={useForkRef(containerRef, forwardedRef)}\n      style={\n        {\n          \"--row-height-prop\": rowHeight > 0 ? `${rowHeight}px` : undefined\n        } as CSSProperties\n      }\n    >\n      <RowProxy ref={rowRef} height={rowHeightProp} />\n\n      {size && rowHeight ? (\n        <TableCore\n          Row={Row}\n          allowDragColumnHeader={allowDragColumnHeader}\n          allowDragDrop={allowDragDrop}\n          availableColumns={availableColumns}\n          config={config}\n          containerRef={containerRef}\n          customHeader={customHeader}\n          dataSource={dataSource}\n          disableFocus={disableFocus}\n          highlightedIndex={highlightedIndex}\n          id={id}\n          navigationStyle={navigationStyle}\n          onAvailableColumnsChange={onAvailableColumnsChange}\n          onConfigChange={onConfigChange}\n          onDragStart={onDragStart}\n          onDrop={onDrop}\n          onFeatureInvocation={onFeatureInvocation}\n          onHighlight={onHighlight}\n          onRowClick={onRowClick}\n          onSelect={onSelect}\n          onSelectionChange={onSelectionChange}\n          renderBufferSize={renderBufferSize}\n          rowHeight={rowHeight}\n          scrollingApiRef={scrollingApiRef}\n          selectionModel={selectionModel}\n          showColumnHeaders={showColumnHeaders}\n          showColumnHeaderMenus={showColumnHeaderMenus}\n          size={size}\n        />\n      ) : null}\n    </MeasuredContainer>\n  );\n});\n"],"names":["metadataKeys","Row","DefaultRow","useId","useTable","jsxs","ContextMenuProvider","jsx","TableHeader","data","forwardRef","Table","useWindow","useComponentCssInjection","tableCss","useRef","useState","useMeasuredHeight","MeasuredContainer","useForkRef","RowProxy"],"mappings":"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"}

package/cjs/bulk-edit/BulkEditPanel.css.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var bulkEditPanelCss = ".vuuBulkEditPanel {\n  display: flex;\n  flex-direction: column;\n}\n.vuuBulkEditPanel-table {\n  align-items: center;\n  flex: 1 1 auto;\n  padding: 10px;\n}\n";
+var bulkEditPanelCss = ".vuuBulkEditPanel {\n  background-color: var(--salt-container-secondary-background);\n  display: flex;\n  flex-direction: column;\n  padding-top: var(--salt-spacing-300);\n\n  .vuuTable {\n    --vuuTableCell-padding: 0;\n    --table-background: var(--salt-container-secondary-background);\n  }\n}\n\n.vuuBulkEditPanel-toolbar {\n  background: var(--salt-container-primary-background);\n  border: solid 1px var(--salt-separable-tertiary-borderColor);\n  border-radius: 2px;\n  display: flex;\n  height: 42px;\n}\n\n.vuuBulkEditPanel-table {\n  align-items: center;\n  flex: 1 1 auto;\n  padding: 10px;\n}\n";
 
 module.exports = bulkEditPanelCss;
 //# sourceMappingURL=BulkEditPanel.css.js.map

package/cjs/bulk-edit/BulkEditPanel.js

@@ -38,27 +38,32 @@ const BulkEditPanel = ({
         editable: true,
         name,
         serverDataType: "string"
-      }))
+      })),
+      rowSeparators: true
     };
   }, [dataSource]);
-  return /* @__PURE__ */ jsxRuntime.jsx(
+  return /* @__PURE__ */ jsxRuntime.jsxs(
     "div",
     {
       ...htmlAttributes,
       className: cx(classBase, className),
       style: { display: "flex", flexDirection: "column" },
-      children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: `${classBase}-table`, children: /* @__PURE__ */ jsxRuntime.jsx(
-        Table.Table,
-        {
-          config,
-          customHeader: bulkEditRow,
-          dataSource,
-          height: 400,
-          width: 600,
-          showColumnHeaderMenus: false,
-          selectionModel: "none"
-        }
-      ) })
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: `${classBase}-toolbar` }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: `${classBase}-table`, children: /* @__PURE__ */ jsxRuntime.jsx(
+          Table.Table,
+          {
+            allowDragColumnHeader: false,
+            config,
+            customHeader: bulkEditRow,
+            dataSource,
+            height: 400,
+            width: 600,
+            showColumnHeaderMenus: false,
+            selectionModel: "none"
+          }
+        ) })
+      ]
     }
   );
 };

package/cjs/bulk-edit/BulkEditPanel.js.map

@@ -1 +1 @@
-{"version":3,"file":"BulkEditPanel.js","sources":["../../src/bulk-edit/BulkEditPanel.tsx"],"sourcesContent":["import { DataSource, RpcResponse } from \"@vuu-ui/vuu-data-types\";\nimport { VuuRpcViewportRequest } from \"@vuu-ui/vuu-protocol-types\";\nimport type { TableConfig } from \"@vuu-ui/vuu-table-types\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport cx from \"clsx\";\nimport { HTMLAttributes, useMemo } from \"react\";\nimport { Table } from \"../Table\";\nimport { BulkEditRow, type EditValueChangeHandler } from \"./BulkEditRow\";\n\nimport bulkEditPanelCss from \"./BulkEditPanel.css\";\n\nconst classBase = \"vuuBulkEditPanel\";\n\nexport interface BulkEditPanelProps extends HTMLAttributes<HTMLDivElement> {\n  dataSource: DataSource;\n  response?: RpcResponse;\n  mainTableName?: string;\n}\n\nexport const BulkEditPanel = ({\n  className,\n  dataSource,\n  ...htmlAttributes\n}: BulkEditPanelProps): JSX.Element => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-checkbox-cell\",\n    css: bulkEditPanelCss,\n    window: targetWindow,\n  });\n\n  const bulkEditRow = useMemo(() => {\n    const onChange: EditValueChangeHandler = (column, value) => {\n      dataSource.rpcCall?.({\n        namedParams: { column: column.name, value },\n        params: [],\n        rpcName: \"VP_BULK_EDIT_COLUMN_CELLS_RPC\",\n        type: \"VIEW_PORT_RPC_CALL\",\n      } as Omit<VuuRpcViewportRequest, \"vpId\">);\n    };\n    return <BulkEditRow onChange={onChange} />;\n  }, [dataSource]);\n\n  const config: TableConfig = useMemo(() => {\n    return {\n      columns: dataSource.columns.map((name) => ({\n        editable: true,\n        name,\n        serverDataType: \"string\",\n      })),\n    };\n  }, [dataSource]);\n\n  return (\n    <div\n      {...htmlAttributes}\n      className={cx(classBase, className)}\n      style={{ display: \"flex\", flexDirection: \"column\" }}\n    >\n      <div className={`${classBase}-table`}>\n        <Table\n          config={config}\n          customHeader={bulkEditRow}\n          dataSource={dataSource}\n          height={400}\n          width={600}\n          showColumnHeaderMenus={false}\n          selectionModel=\"none\"\n        />\n      </div>\n    </div>\n  );\n};\n"],"names":["useWindow","useComponentCssInjection","bulkEditPanelCss","useMemo","jsx","BulkEditRow","Table"],"mappings":";;;;;;;;;;;AAYA,MAAM,SAAY,GAAA,kBAAA,CAAA;AAQX,MAAM,gBAAgB,CAAC;AAAA,EAC5B,SAAA;AAAA,EACA,UAAA;AAAA,EACA,GAAG,cAAA;AACL,CAAuC,KAAA;AACrC,EAAA,MAAM,eAAeA,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,mBAAA;AAAA,IACR,GAAK,EAAAC,eAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAM,MAAA,WAAA,GAAcC,cAAQ,MAAM;AAChC,IAAM,MAAA,QAAA,GAAmC,CAAC,MAAA,EAAQ,KAAU,KAAA;AAC1D,MAAA,UAAA,CAAW,OAAU,GAAA;AAAA,QACnB,WAAa,EAAA,EAAE,MAAQ,EAAA,MAAA,CAAO,MAAM,KAAM,EAAA;AAAA,QAC1C,QAAQ,EAAC;AAAA,QACT,OAAS,EAAA,+BAAA;AAAA,QACT,IAAM,EAAA,oBAAA;AAAA,OACgC,CAAA,CAAA;AAAA,KAC1C,CAAA;AACA,IAAO,uBAAAC,cAAA,CAACC,2BAAY,QAAoB,EAAA,CAAA,CAAA;AAAA,GAC1C,EAAG,CAAC,UAAU,CAAC,CAAA,CAAA;AAEf,EAAM,MAAA,MAAA,GAAsBF,cAAQ,MAAM;AACxC,IAAO,OAAA;AAAA,MACL,OAAS,EAAA,UAAA,CAAW,OAAQ,CAAA,GAAA,CAAI,CAAC,IAAU,MAAA;AAAA,QACzC,QAAU,EAAA,IAAA;AAAA,QACV,IAAA;AAAA,QACA,cAAgB,EAAA,QAAA;AAAA,OAChB,CAAA,CAAA;AAAA,KACJ,CAAA;AAAA,GACF,EAAG,CAAC,UAAU,CAAC,CAAA,CAAA;AAEf,EACE,uBAAAC,cAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACE,GAAG,cAAA;AAAA,MACJ,SAAA,EAAW,EAAG,CAAA,SAAA,EAAW,SAAS,CAAA;AAAA,MAClC,KAAO,EAAA,EAAE,OAAS,EAAA,MAAA,EAAQ,eAAe,QAAS,EAAA;AAAA,MAElD,QAAC,kBAAAA,cAAA,CAAA,KAAA,EAAA,EAAI,SAAW,EAAA,CAAA,EAAG,SAAS,CAC1B,MAAA,CAAA,EAAA,QAAA,kBAAAA,cAAA;AAAA,QAACE,WAAA;AAAA,QAAA;AAAA,UACC,MAAA;AAAA,UACA,YAAc,EAAA,WAAA;AAAA,UACd,UAAA;AAAA,UACA,MAAQ,EAAA,GAAA;AAAA,UACR,KAAO,EAAA,GAAA;AAAA,UACP,qBAAuB,EAAA,KAAA;AAAA,UACvB,cAAe,EAAA,MAAA;AAAA,SAAA;AAAA,OAEnB,EAAA,CAAA;AAAA,KAAA;AAAA,GACF,CAAA;AAEJ;;;;"}
+{"version":3,"file":"BulkEditPanel.js","sources":["../../src/bulk-edit/BulkEditPanel.tsx"],"sourcesContent":["import { DataSource, RpcResponse } from \"@vuu-ui/vuu-data-types\";\nimport { VuuRpcViewportRequest } from \"@vuu-ui/vuu-protocol-types\";\nimport type { TableConfig } from \"@vuu-ui/vuu-table-types\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport cx from \"clsx\";\nimport { HTMLAttributes, useMemo } from \"react\";\nimport { Table } from \"../Table\";\nimport { BulkEditRow, type EditValueChangeHandler } from \"./BulkEditRow\";\n\nimport bulkEditPanelCss from \"./BulkEditPanel.css\";\n\nconst classBase = \"vuuBulkEditPanel\";\n\nexport interface BulkEditPanelProps extends HTMLAttributes<HTMLDivElement> {\n  dataSource: DataSource;\n  response?: RpcResponse;\n  mainTableName?: string;\n}\n\nexport const BulkEditPanel = ({\n  className,\n  dataSource,\n  ...htmlAttributes\n}: BulkEditPanelProps): JSX.Element => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-checkbox-cell\",\n    css: bulkEditPanelCss,\n    window: targetWindow\n  });\n\n  const bulkEditRow = useMemo(() => {\n    const onChange: EditValueChangeHandler = (column, value) => {\n      dataSource.rpcCall?.({\n        namedParams: { column: column.name, value },\n        params: [],\n        rpcName: \"VP_BULK_EDIT_COLUMN_CELLS_RPC\",\n        type: \"VIEW_PORT_RPC_CALL\"\n      } as Omit<VuuRpcViewportRequest, \"vpId\">);\n    };\n    return <BulkEditRow onChange={onChange} />;\n  }, [dataSource]);\n\n  const config: TableConfig = useMemo(() => {\n    return {\n      columns: dataSource.columns.map((name) => ({\n        editable: true,\n        name,\n        serverDataType: \"string\"\n      })),\n      rowSeparators: true\n    };\n  }, [dataSource]);\n\n  return (\n    <div\n      {...htmlAttributes}\n      className={cx(classBase, className)}\n      style={{ display: \"flex\", flexDirection: \"column\" }}\n    >\n      <div className={`${classBase}-toolbar`} />\n      <div className={`${classBase}-table`}>\n        <Table\n          allowDragColumnHeader={false}\n          config={config}\n          customHeader={bulkEditRow}\n          dataSource={dataSource}\n          height={400}\n          width={600}\n          showColumnHeaderMenus={false}\n          selectionModel=\"none\"\n        />\n      </div>\n    </div>\n  );\n};\n"],"names":["useWindow","useComponentCssInjection","bulkEditPanelCss","useMemo","jsx","BulkEditRow","jsxs","Table"],"mappings":";;;;;;;;;;;AAYA,MAAM,SAAY,GAAA,kBAAA,CAAA;AAQX,MAAM,gBAAgB,CAAC;AAAA,EAC5B,SAAA;AAAA,EACA,UAAA;AAAA,EACA,GAAG,cAAA;AACL,CAAuC,KAAA;AACrC,EAAA,MAAM,eAAeA,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,mBAAA;AAAA,IACR,GAAK,EAAAC,eAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAM,MAAA,WAAA,GAAcC,cAAQ,MAAM;AAChC,IAAM,MAAA,QAAA,GAAmC,CAAC,MAAA,EAAQ,KAAU,KAAA;AAC1D,MAAA,UAAA,CAAW,OAAU,GAAA;AAAA,QACnB,WAAa,EAAA,EAAE,MAAQ,EAAA,MAAA,CAAO,MAAM,KAAM,EAAA;AAAA,QAC1C,QAAQ,EAAC;AAAA,QACT,OAAS,EAAA,+BAAA;AAAA,QACT,IAAM,EAAA,oBAAA;AAAA,OACgC,CAAA,CAAA;AAAA,KAC1C,CAAA;AACA,IAAO,uBAAAC,cAAA,CAACC,2BAAY,QAAoB,EAAA,CAAA,CAAA;AAAA,GAC1C,EAAG,CAAC,UAAU,CAAC,CAAA,CAAA;AAEf,EAAM,MAAA,MAAA,GAAsBF,cAAQ,MAAM;AACxC,IAAO,OAAA;AAAA,MACL,OAAS,EAAA,UAAA,CAAW,OAAQ,CAAA,GAAA,CAAI,CAAC,IAAU,MAAA;AAAA,QACzC,QAAU,EAAA,IAAA;AAAA,QACV,IAAA;AAAA,QACA,cAAgB,EAAA,QAAA;AAAA,OAChB,CAAA,CAAA;AAAA,MACF,aAAe,EAAA,IAAA;AAAA,KACjB,CAAA;AAAA,GACF,EAAG,CAAC,UAAU,CAAC,CAAA,CAAA;AAEf,EACE,uBAAAG,eAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACE,GAAG,cAAA;AAAA,MACJ,SAAA,EAAW,EAAG,CAAA,SAAA,EAAW,SAAS,CAAA;AAAA,MAClC,KAAO,EAAA,EAAE,OAAS,EAAA,MAAA,EAAQ,eAAe,QAAS,EAAA;AAAA,MAElD,QAAA,EAAA;AAAA,wBAAAF,cAAA,CAAC,KAAI,EAAA,EAAA,SAAA,EAAW,CAAG,EAAA,SAAS,CAAY,QAAA,CAAA,EAAA,CAAA;AAAA,wBACvCA,cAAA,CAAA,KAAA,EAAA,EAAI,SAAW,EAAA,CAAA,EAAG,SAAS,CAC1B,MAAA,CAAA,EAAA,QAAA,kBAAAA,cAAA;AAAA,UAACG,WAAA;AAAA,UAAA;AAAA,YACC,qBAAuB,EAAA,KAAA;AAAA,YACvB,MAAA;AAAA,YACA,YAAc,EAAA,WAAA;AAAA,YACd,UAAA;AAAA,YACA,MAAQ,EAAA,GAAA;AAAA,YACR,KAAO,EAAA,GAAA;AAAA,YACP,qBAAuB,EAAA,KAAA;AAAA,YACvB,cAAe,EAAA,MAAA;AAAA,WAAA;AAAA,SAEnB,EAAA,CAAA;AAAA,OAAA;AAAA,KAAA;AAAA,GACF,CAAA;AAEJ;;;;"}

package/cjs/bulk-edit/BulkEditRow.css.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var bulkEditRowCss = ".vuuBulkEditRow {\n  .vuuBulkEditRow-filter {\n    display: inline-block;\n    padding: 1px;\n  }\n\n  .vuuBulkEditRow-virtualColSpan {\n    display: inline-block;\n  }\n}\n";
+var bulkEditRowCss = ".vuuBulkEditRow {\n  height: 24px;\n\n  .vuuBulkEditRow-filter {\n    display: inline-block;\n    padding: 1px;\n\n    .saltInput-primary.vuuInput {\n      border-color: var(--salt-separable-secondary-borderColor);\n      height: 22px;\n      min-height: 22px;\n      input::placeholder {\n        color: var(--tar-color-gray-25);\n      }\n    }\n  }\n\n  .vuuBulkEditRow-virtualColSpan {\n    display: inline-block;\n  }\n}\n";
 
 module.exports = bulkEditRowCss;
 //# sourceMappingURL=BulkEditRow.css.js.map

package/cjs/bulk-edit/BulkEditRow.js

@@ -12,6 +12,10 @@ require('../table-header/TableHeader.js');
 var BulkEditRow$1 = require('./BulkEditRow.css.js');
 
 const classBase = "vuuBulkEditRow";
+const InputProps = {
+  placeholder: "Enter value",
+  variant: "primary"
+};
 const BulkEditRow = ({ onChange, ...htmlAttributes }) => {
   const targetWindow = window.useWindow();
   styles.useComponentCssInjection({
@@ -42,7 +46,7 @@ const BulkEditRow = ({ onChange, ...htmlAttributes }) => {
       {
         className: `${classBase}-filter`,
         style: { width: column.width },
-        children: vuuDataReact.getDataItemEditControl({ column, onCommit })
+        children: vuuDataReact.getDataItemEditControl({ InputProps, column, onCommit })
       },
       column.name
     ))

package/cjs/bulk-edit/BulkEditRow.js.map

@@ -1 +1 @@
-{"version":3,"file":"BulkEditRow.js","sources":["../../src/bulk-edit/BulkEditRow.tsx"],"sourcesContent":["import { getDataItemEditControl } from \"@vuu-ui/vuu-data-react\";\nimport { ColumnDescriptor } from \"@vuu-ui/vuu-table-types\";\nimport { CommitHandler, queryClosest } from \"@vuu-ui/vuu-utils\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { HTMLAttributes, useCallback } from \"react\";\nimport { VirtualColSpan } from \"../VirtualColSpan\";\nimport { useHeaderProps } from \"../table-header\";\n\nimport bulkEditRowCss from \"./BulkEditRow.css\";\n\nconst classBase = \"vuuBulkEditRow\";\n\nexport type EditValueChangeHandler = (\n  column: ColumnDescriptor,\n  value: string,\n) => void;\nexport interface BulkEditProps\n  extends Omit<HTMLAttributes<HTMLDivElement>, \"onChange\"> {\n  onChange: EditValueChangeHandler;\n}\n\nexport const BulkEditRow = ({ onChange, ...htmlAttributes }: BulkEditProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-bulk-edit-row\",\n    css: bulkEditRowCss,\n    window: targetWindow,\n  });\n\n  const { columns, virtualColSpan = 0 } = useHeaderProps();\n\n  const onCommit = useCallback<\n    CommitHandler<HTMLInputElement, string | undefined>\n  >(\n    (evt, value) => {\n      if (value !== undefined && String(value).trim() !== \"\") {\n        const field = queryClosest(evt.target, \"[data-field]\");\n        if (field) {\n          const columnName = field.dataset.field;\n          const column = columns.find((c) => c.name === columnName);\n          if (column) {\n            onChange(column, value);\n          }\n        }\n      }\n    },\n    [columns, onChange],\n  );\n\n  return (\n    <div {...htmlAttributes} className={classBase}>\n      <VirtualColSpan width={virtualColSpan} />\n      {columns.map((column) => (\n        <div\n          className={`${classBase}-filter`}\n          key={column.name}\n          style={{ width: column.width }}\n        >\n          {getDataItemEditControl({ column, onCommit })}\n        </div>\n      ))}\n    </div>\n  );\n};\n"],"names":["useWindow","useComponentCssInjection","bulkEditRowCss","useHeaderProps","useCallback","queryClosest","jsxs","jsx","VirtualColSpan","getDataItemEditControl"],"mappings":";;;;;;;;;;;;;AAWA,MAAM,SAAY,GAAA,gBAAA,CAAA;AAWX,MAAM,cAAc,CAAC,EAAE,QAAU,EAAA,GAAG,gBAAoC,KAAA;AAC7E,EAAA,MAAM,eAAeA,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,mBAAA;AAAA,IACR,GAAK,EAAAC,aAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,MAAM,EAAE,OAAA,EAAS,cAAiB,GAAA,CAAA,KAAMC,6BAAe,EAAA,CAAA;AAEvD,EAAA,MAAM,QAAW,GAAAC,iBAAA;AAAA,IAGf,CAAC,KAAK,KAAU,KAAA;AACd,MAAA,IAAI,UAAU,KAAa,CAAA,IAAA,MAAA,CAAO,KAAK,CAAE,CAAA,IAAA,OAAW,EAAI,EAAA;AACtD,QAAA,MAAM,KAAQ,GAAAC,qBAAA,CAAa,GAAI,CAAA,MAAA,EAAQ,cAAc,CAAA,CAAA;AACrD,QAAA,IAAI,KAAO,EAAA;AACT,UAAM,MAAA,UAAA,GAAa,MAAM,OAAQ,CAAA,KAAA,CAAA;AACjC,UAAA,MAAM,SAAS,OAAQ,CAAA,IAAA,CAAK,CAAC,CAAM,KAAA,CAAA,CAAE,SAAS,UAAU,CAAA,CAAA;AACxD,UAAA,IAAI,MAAQ,EAAA;AACV,YAAA,QAAA,CAAS,QAAQ,KAAK,CAAA,CAAA;AAAA,WACxB;AAAA,SACF;AAAA,OACF;AAAA,KACF;AAAA,IACA,CAAC,SAAS,QAAQ,CAAA;AAAA,GACpB,CAAA;AAEA,EAAA,uBACGC,eAAA,CAAA,KAAA,EAAA,EAAK,GAAG,cAAA,EAAgB,WAAW,SAClC,EAAA,QAAA,EAAA;AAAA,oBAACC,cAAA,CAAAC,6BAAA,EAAA,EAAe,OAAO,cAAgB,EAAA,CAAA;AAAA,IACtC,OAAA,CAAQ,GAAI,CAAA,CAAC,MACZ,qBAAAD,cAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAW,GAAG,SAAS,CAAA,OAAA,CAAA;AAAA,QAEvB,KAAO,EAAA,EAAE,KAAO,EAAA,MAAA,CAAO,KAAM,EAAA;AAAA,QAE5B,QAAuB,EAAAE,mCAAA,CAAA,EAAE,MAAQ,EAAA,QAAA,EAAU,CAAA;AAAA,OAAA;AAAA,MAHvC,MAAO,CAAA,IAAA;AAAA,KAKf,CAAA;AAAA,GACH,EAAA,CAAA,CAAA;AAEJ;;;;"}
+{"version":3,"file":"BulkEditRow.js","sources":["../../src/bulk-edit/BulkEditRow.tsx"],"sourcesContent":["import { getDataItemEditControl } from \"@vuu-ui/vuu-data-react\";\nimport { ColumnDescriptor } from \"@vuu-ui/vuu-table-types\";\nimport { CommitHandler, queryClosest } from \"@vuu-ui/vuu-utils\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { HTMLAttributes, useCallback } from \"react\";\nimport { VirtualColSpan } from \"../VirtualColSpan\";\nimport { useHeaderProps } from \"../table-header\";\n\nimport bulkEditRowCss from \"./BulkEditRow.css\";\nimport { InputProps } from \"@salt-ds/core\";\n\nconst classBase = \"vuuBulkEditRow\";\n\nexport type EditValueChangeHandler = (\n  column: ColumnDescriptor,\n  value: string\n) => void;\nexport interface BulkEditProps\n  extends Omit<HTMLAttributes<HTMLDivElement>, \"onChange\"> {\n  onChange: EditValueChangeHandler;\n}\n\nconst InputProps: Partial<InputProps> = {\n  placeholder: \"Enter value\",\n  variant: \"primary\"\n};\n\nexport const BulkEditRow = ({ onChange, ...htmlAttributes }: BulkEditProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-bulk-edit-row\",\n    css: bulkEditRowCss,\n    window: targetWindow\n  });\n\n  const { columns, virtualColSpan = 0 } = useHeaderProps();\n\n  const onCommit = useCallback<\n    CommitHandler<HTMLInputElement, string | undefined>\n  >(\n    (evt, value) => {\n      if (value !== undefined && String(value).trim() !== \"\") {\n        const field = queryClosest(evt.target, \"[data-field]\");\n        if (field) {\n          const columnName = field.dataset.field;\n          const column = columns.find((c) => c.name === columnName);\n          if (column) {\n            onChange(column, value);\n          }\n        }\n      }\n    },\n    [columns, onChange]\n  );\n\n  return (\n    <div {...htmlAttributes} className={classBase}>\n      <VirtualColSpan width={virtualColSpan} />\n      {columns.map((column) => (\n        <div\n          className={`${classBase}-filter`}\n          key={column.name}\n          style={{ width: column.width }}\n        >\n          {getDataItemEditControl({ InputProps, column, onCommit })}\n        </div>\n      ))}\n    </div>\n  );\n};\n"],"names":["useWindow","useComponentCssInjection","bulkEditRowCss","useHeaderProps","useCallback","queryClosest","jsxs","jsx","VirtualColSpan","getDataItemEditControl"],"mappings":";;;;;;;;;;;;;AAYA,MAAM,SAAY,GAAA,gBAAA,CAAA;AAWlB,MAAM,UAAkC,GAAA;AAAA,EACtC,WAAa,EAAA,aAAA;AAAA,EACb,OAAS,EAAA,SAAA;AACX,CAAA,CAAA;AAEO,MAAM,cAAc,CAAC,EAAE,QAAU,EAAA,GAAG,gBAAoC,KAAA;AAC7E,EAAA,MAAM,eAAeA,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,mBAAA;AAAA,IACR,GAAK,EAAAC,aAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,MAAM,EAAE,OAAA,EAAS,cAAiB,GAAA,CAAA,KAAMC,6BAAe,EAAA,CAAA;AAEvD,EAAA,MAAM,QAAW,GAAAC,iBAAA;AAAA,IAGf,CAAC,KAAK,KAAU,KAAA;AACd,MAAA,IAAI,UAAU,KAAa,CAAA,IAAA,MAAA,CAAO,KAAK,CAAE,CAAA,IAAA,OAAW,EAAI,EAAA;AACtD,QAAA,MAAM,KAAQ,GAAAC,qBAAA,CAAa,GAAI,CAAA,MAAA,EAAQ,cAAc,CAAA,CAAA;AACrD,QAAA,IAAI,KAAO,EAAA;AACT,UAAM,MAAA,UAAA,GAAa,MAAM,OAAQ,CAAA,KAAA,CAAA;AACjC,UAAA,MAAM,SAAS,OAAQ,CAAA,IAAA,CAAK,CAAC,CAAM,KAAA,CAAA,CAAE,SAAS,UAAU,CAAA,CAAA;AACxD,UAAA,IAAI,MAAQ,EAAA;AACV,YAAA,QAAA,CAAS,QAAQ,KAAK,CAAA,CAAA;AAAA,WACxB;AAAA,SACF;AAAA,OACF;AAAA,KACF;AAAA,IACA,CAAC,SAAS,QAAQ,CAAA;AAAA,GACpB,CAAA;AAEA,EAAA,uBACGC,eAAA,CAAA,KAAA,EAAA,EAAK,GAAG,cAAA,EAAgB,WAAW,SAClC,EAAA,QAAA,EAAA;AAAA,oBAACC,cAAA,CAAAC,6BAAA,EAAA,EAAe,OAAO,cAAgB,EAAA,CAAA;AAAA,IACtC,OAAA,CAAQ,GAAI,CAAA,CAAC,MACZ,qBAAAD,cAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAW,GAAG,SAAS,CAAA,OAAA,CAAA;AAAA,QAEvB,KAAO,EAAA,EAAE,KAAO,EAAA,MAAA,CAAO,KAAM,EAAA;AAAA,QAE5B,QAAuB,EAAAE,mCAAA,CAAA,EAAE,UAAY,EAAA,MAAA,EAAQ,UAAU,CAAA;AAAA,OAAA;AAAA,MAHnD,MAAO,CAAA,IAAA;AAAA,KAKf,CAAA;AAAA,GACH,EAAA,CAAA,CAAA;AAEJ;;;;"}

package/cjs/cell-renderers/checkbox-cell/CheckboxCell.js.map

@@ -1 +1 @@
-{"version":3,"file":"CheckboxCell.js","sources":["../../../src/cell-renderers/checkbox-cell/CheckboxCell.tsx"],"sourcesContent":["import { memo, useCallback } from \"react\";\nimport { TableCellRendererProps } from \"@vuu-ui/vuu-table-types\";\nimport { WarnCommit } from \"@vuu-ui/vuu-ui-controls\";\nimport { Checkbox } from \"@salt-ds/core\";\nimport {\n  dataColumnAndKeyUnchanged,\n  dispatchCustomEvent,\n  registerComponent,\n} from \"@vuu-ui/vuu-utils\";\n\nexport const CheckboxCell: React.FC<TableCellRendererProps> = memo(\n  ({ column, columnMap, onCommit = WarnCommit, row }) => {\n    const dataIdx = columnMap[column.name];\n    const isChecked = !!row[dataIdx];\n\n    const handleCommit = useCallback(\n      (value) => async (evt: React.MouseEvent) => {\n        const res = await onCommit(value);\n        if (res === true) {\n          dispatchCustomEvent(evt.target as HTMLElement, \"vuu-commit\");\n        }\n        return res;\n      },\n      [onCommit],\n    );\n\n    return column.editable ? (\n      <Checkbox checked={isChecked} onClick={handleCommit(!isChecked)} />\n    ) : (\n      <Checkbox checked={isChecked} disabled={true} />\n    );\n  },\n  dataColumnAndKeyUnchanged,\n);\nCheckboxCell.displayName = \"CheckboxCell\";\n\nregisterComponent(\"checkbox-cell\", CheckboxCell, \"cell-renderer\", {\n  serverDataType: \"boolean\",\n});\n"],"names":["memo","WarnCommit","useCallback","dispatchCustomEvent","jsx","Checkbox","dataColumnAndKeyUnchanged","registerComponent"],"mappings":";;;;;;;;AAUO,MAAM,YAAiD,GAAAA,UAAA;AAAA,EAC5D,CAAC,EAAE,MAAA,EAAQ,WAAW,QAAW,GAAAC,wBAAA,EAAY,KAAU,KAAA;AACrD,IAAM,MAAA,OAAA,GAAU,SAAU,CAAA,MAAA,CAAO,IAAI,CAAA,CAAA;AACrC,IAAA,MAAM,SAAY,GAAA,CAAC,CAAC,GAAA,CAAI,OAAO,CAAA,CAAA;AAE/B,IAAA,MAAM,YAAe,GAAAC,iBAAA;AAAA,MACnB,CAAC,KAAU,KAAA,OAAO,GAA0B,KAAA;AAC1C,QAAM,MAAA,GAAA,GAAM,MAAM,QAAA,CAAS,KAAK,CAAA,CAAA;AAChC,QAAA,IAAI,QAAQ,IAAM,EAAA;AAChB,UAAoBC,4BAAA,CAAA,GAAA,CAAI,QAAuB,YAAY,CAAA,CAAA;AAAA,SAC7D;AACA,QAAO,OAAA,GAAA,CAAA;AAAA,OACT;AAAA,MACA,CAAC,QAAQ,CAAA;AAAA,KACX,CAAA;AAEA,IAAA,OAAO,OAAO,QACZ,mBAAAC,cAAA,CAACC,aAAS,EAAA,EAAA,OAAA,EAAS,WAAW,OAAS,EAAA,YAAA,CAAa,CAAC,SAAS,GAAG,CAEjE,mBAAAD,cAAA,CAACC,iBAAS,OAAS,EAAA,SAAA,EAAW,UAAU,IAAM,EAAA,CAAA,CAAA;AAAA,GAElD;AAAA,EACAC,kCAAA;AACF,EAAA;AACA,YAAA,CAAa,WAAc,GAAA,cAAA,CAAA;AAE3BC,0BAAkB,CAAA,eAAA,EAAiB,cAAc,eAAiB,EAAA;AAAA,EAChE,cAAgB,EAAA,SAAA;AAClB,CAAC,CAAA;;;;"}
+{"version":3,"file":"CheckboxCell.js","sources":["../../../src/cell-renderers/checkbox-cell/CheckboxCell.tsx"],"sourcesContent":["import { memo, useCallback } from \"react\";\nimport { TableCellRendererProps } from \"@vuu-ui/vuu-table-types\";\nimport { WarnCommit } from \"@vuu-ui/vuu-ui-controls\";\nimport { Checkbox } from \"@salt-ds/core\";\nimport {\n  dataColumnAndKeyUnchanged,\n  dispatchCustomEvent,\n  registerComponent\n} from \"@vuu-ui/vuu-utils\";\n\nexport const CheckboxCell: React.FC<TableCellRendererProps> = memo(\n  ({ column, columnMap, onCommit = WarnCommit, row }) => {\n    const dataIdx = columnMap[column.name];\n    const isChecked = !!row[dataIdx];\n\n    const handleCommit = useCallback(\n      (value) => async (evt: React.MouseEvent) => {\n        const res = await onCommit(value);\n        if (res === true) {\n          dispatchCustomEvent(evt.target as HTMLElement, \"vuu-commit\");\n        }\n        return res;\n      },\n      [onCommit]\n    );\n\n    return column.editable ? (\n      <Checkbox checked={isChecked} onClick={handleCommit(!isChecked)} />\n    ) : (\n      <Checkbox checked={isChecked} disabled={true} />\n    );\n  },\n  dataColumnAndKeyUnchanged\n);\nCheckboxCell.displayName = \"CheckboxCell\";\n\nregisterComponent(\"checkbox-cell\", CheckboxCell, \"cell-renderer\", {\n  serverDataType: \"boolean\"\n});\n"],"names":["memo","WarnCommit","useCallback","dispatchCustomEvent","jsx","Checkbox","dataColumnAndKeyUnchanged","registerComponent"],"mappings":";;;;;;;;AAUO,MAAM,YAAiD,GAAAA,UAAA;AAAA,EAC5D,CAAC,EAAE,MAAA,EAAQ,WAAW,QAAW,GAAAC,wBAAA,EAAY,KAAU,KAAA;AACrD,IAAM,MAAA,OAAA,GAAU,SAAU,CAAA,MAAA,CAAO,IAAI,CAAA,CAAA;AACrC,IAAA,MAAM,SAAY,GAAA,CAAC,CAAC,GAAA,CAAI,OAAO,CAAA,CAAA;AAE/B,IAAA,MAAM,YAAe,GAAAC,iBAAA;AAAA,MACnB,CAAC,KAAU,KAAA,OAAO,GAA0B,KAAA;AAC1C,QAAM,MAAA,GAAA,GAAM,MAAM,QAAA,CAAS,KAAK,CAAA,CAAA;AAChC,QAAA,IAAI,QAAQ,IAAM,EAAA;AAChB,UAAoBC,4BAAA,CAAA,GAAA,CAAI,QAAuB,YAAY,CAAA,CAAA;AAAA,SAC7D;AACA,QAAO,OAAA,GAAA,CAAA;AAAA,OACT;AAAA,MACA,CAAC,QAAQ,CAAA;AAAA,KACX,CAAA;AAEA,IAAA,OAAO,OAAO,QACZ,mBAAAC,cAAA,CAACC,aAAS,EAAA,EAAA,OAAA,EAAS,WAAW,OAAS,EAAA,YAAA,CAAa,CAAC,SAAS,GAAG,CAEjE,mBAAAD,cAAA,CAACC,iBAAS,OAAS,EAAA,SAAA,EAAW,UAAU,IAAM,EAAA,CAAA,CAAA;AAAA,GAElD;AAAA,EACAC,kCAAA;AACF,EAAA;AACA,YAAA,CAAa,WAAc,GAAA,cAAA,CAAA;AAE3BC,0BAAkB,CAAA,eAAA,EAAiB,cAAc,eAAiB,EAAA;AAAA,EAChE,cAAgB,EAAA,SAAA;AAClB,CAAC,CAAA;;;;"}

package/cjs/cell-renderers/checkbox-row-selector/CheckboxRowSelectorCell.js.map

@@ -1 +1 @@
-{"version":3,"file":"CheckboxRowSelectorCell.js","sources":["../../../src/cell-renderers/checkbox-row-selector/CheckboxRowSelectorCell.tsx"],"sourcesContent":["import { TableCellRendererProps } from \"@vuu-ui/vuu-table-types\";\nimport { isRowSelected, registerComponent } from \"@vuu-ui/vuu-utils\";\nimport { Checkbox } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport checkboxRowSelectorCss from \"./CheckboxRowSelectorCell.css\";\n\nexport const CheckboxRowSelectorCell: React.FC<TableCellRendererProps> = ({\n  row,\n}) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-checkbox-row-selector-cell\",\n    css: checkboxRowSelectorCss,\n    window: targetWindow,\n  });\n\n  const isChecked = isRowSelected(row);\n\n  return <Checkbox checked={isChecked} className=\"vuuCheckboxRowSelector\" />;\n};\nCheckboxRowSelectorCell.displayName = \"CheckboxCell\";\n\nregisterComponent(\n  \"checkbox-row-selector-cell\",\n  CheckboxRowSelectorCell,\n  \"cell-renderer\",\n  {\n    serverDataType: \"boolean\",\n  },\n);\n"],"names":["useWindow","useComponentCssInjection","checkboxRowSelectorCss","isRowSelected","jsx","Checkbox","registerComponent"],"mappings":";;;;;;;;;AAQO,MAAM,0BAA4D,CAAC;AAAA,EACxE,GAAA;AACF,CAAM,KAAA;AACJ,EAAA,MAAM,eAAeA,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,gCAAA;AAAA,IACR,GAAK,EAAAC,yBAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAM,MAAA,SAAA,GAAYC,uBAAc,GAAG,CAAA,CAAA;AAEnC,EAAA,uBAAQC,cAAA,CAAAC,aAAA,EAAA,EAAS,OAAS,EAAA,SAAA,EAAW,WAAU,wBAAyB,EAAA,CAAA,CAAA;AAC1E,EAAA;AACA,uBAAA,CAAwB,WAAc,GAAA,cAAA,CAAA;AAEtCC,0BAAA;AAAA,EACE,4BAAA;AAAA,EACA,uBAAA;AAAA,EACA,eAAA;AAAA,EACA;AAAA,IACE,cAAgB,EAAA,SAAA;AAAA,GAClB;AACF,CAAA;;;;"}
+{"version":3,"file":"CheckboxRowSelectorCell.js","sources":["../../../src/cell-renderers/checkbox-row-selector/CheckboxRowSelectorCell.tsx"],"sourcesContent":["import { TableCellRendererProps } from \"@vuu-ui/vuu-table-types\";\nimport { isRowSelected, registerComponent } from \"@vuu-ui/vuu-utils\";\nimport { Checkbox } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport checkboxRowSelectorCss from \"./CheckboxRowSelectorCell.css\";\n\nexport const CheckboxRowSelectorCell: React.FC<TableCellRendererProps> = ({\n  row\n}) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-checkbox-row-selector-cell\",\n    css: checkboxRowSelectorCss,\n    window: targetWindow\n  });\n\n  const isChecked = isRowSelected(row);\n\n  return <Checkbox checked={isChecked} className=\"vuuCheckboxRowSelector\" />;\n};\nCheckboxRowSelectorCell.displayName = \"CheckboxCell\";\n\nregisterComponent(\n  \"checkbox-row-selector-cell\",\n  CheckboxRowSelectorCell,\n  \"cell-renderer\",\n  {\n    serverDataType: \"boolean\"\n  }\n);\n"],"names":["useWindow","useComponentCssInjection","checkboxRowSelectorCss","isRowSelected","jsx","Checkbox","registerComponent"],"mappings":";;;;;;;;;AAQO,MAAM,0BAA4D,CAAC;AAAA,EACxE,GAAA;AACF,CAAM,KAAA;AACJ,EAAA,MAAM,eAAeA,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,gCAAA;AAAA,IACR,GAAK,EAAAC,yBAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAM,MAAA,SAAA,GAAYC,uBAAc,GAAG,CAAA,CAAA;AAEnC,EAAA,uBAAQC,cAAA,CAAAC,aAAA,EAAA,EAAS,OAAS,EAAA,SAAA,EAAW,WAAU,wBAAyB,EAAA,CAAA,CAAA;AAC1E,EAAA;AACA,uBAAA,CAAwB,WAAc,GAAA,cAAA,CAAA;AAEtCC,0BAAA;AAAA,EACE,4BAAA;AAAA,EACA,uBAAA;AAAA,EACA,eAAA;AAAA,EACA;AAAA,IACE,cAAgB,EAAA,SAAA;AAAA,GAClB;AACF,CAAA;;;;"}

package/cjs/cell-renderers/input-cell/InputCell.js.map

@@ -1 +1 @@
-{"version":3,"file":"InputCell.js","sources":["../../../src/cell-renderers/input-cell/InputCell.tsx"],"sourcesContent":["import { TableCellRendererProps } from \"@vuu-ui/vuu-table-types\";\nimport { registerComponent } from \"@vuu-ui/vuu-utils\";\nimport { Input } from \"@salt-ds/core\";\nimport { useEditableText } from \"@vuu-ui/vuu-ui-controls\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport cx from \"clsx\";\n\nimport inputCellCss from \"./InputCell.css\";\n\nconst classBase = \"vuuTableInputCell\";\n\nconst WarnCommit = (): Promise<true> => {\n  console.warn(\n    \"onCommit handler has not been provided to InputCell cell renderer\",\n  );\n  return Promise.resolve(true);\n};\nexport const InputCell = ({\n  column,\n  columnMap,\n  onCommit = WarnCommit,\n  row,\n}: TableCellRendererProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-input-cell\",\n    css: inputCellCss,\n    window: targetWindow,\n  });\n\n  const dataIdx = columnMap[column.name];\n  const dataValue = row[dataIdx] as number | string;\n  const { align = \"left\", clientSideEditValidationCheck } = column;\n\n  const { warningMessage, ...editProps } = useEditableText({\n    initialValue: dataValue,\n    onCommit,\n    clientSideEditValidationCheck,\n  });\n\n  const endAdornment =\n    warningMessage && align === \"left\" ? (\n      <span className={`${classBase}-icon`} data-icon=\"error\" />\n    ) : undefined;\n\n  const startAdornment =\n    warningMessage && align === \"right\" ? (\n      <span className={`${classBase}-icon`} data-icon=\"error\" />\n    ) : undefined;\n\n  return (\n    <Input\n      {...editProps}\n      className={cx(classBase, {\n        [`${classBase}-error`]: warningMessage !== undefined,\n      })}\n      endAdornment={endAdornment}\n      startAdornment={startAdornment}\n    />\n  );\n};\n\nregisterComponent(\"input-cell\", InputCell, \"cell-renderer\", {\n  userCanAssign: false,\n});\n"],"names":["useWindow","useComponentCssInjection","inputCellCss","useEditableText","jsx","Input","registerComponent"],"mappings":";;;;;;;;;;;AAUA,MAAM,SAAY,GAAA,mBAAA,CAAA;AAElB,MAAM,aAAa,MAAqB;AACtC,EAAQ,OAAA,CAAA,IAAA;AAAA,IACN,mEAAA;AAAA,GACF,CAAA;AACA,EAAO,OAAA,OAAA,CAAQ,QAAQ,IAAI,CAAA,CAAA;AAC7B,CAAA,CAAA;AACO,MAAM,YAAY,CAAC;AAAA,EACxB,MAAA;AAAA,EACA,SAAA;AAAA,EACA,QAAW,GAAA,UAAA;AAAA,EACX,GAAA;AACF,CAA8B,KAAA;AAC5B,EAAA,MAAM,eAAeA,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,gBAAA;AAAA,IACR,GAAK,EAAAC,WAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAM,MAAA,OAAA,GAAU,SAAU,CAAA,MAAA,CAAO,IAAI,CAAA,CAAA;AACrC,EAAM,MAAA,SAAA,GAAY,IAAI,OAAO,CAAA,CAAA;AAC7B,EAAA,MAAM,EAAE,KAAA,GAAQ,MAAQ,EAAA,6BAAA,EAAkC,GAAA,MAAA,CAAA;AAE1D,EAAA,MAAM,EAAE,cAAA,EAAgB,GAAG,SAAA,KAAcC,6BAAgB,CAAA;AAAA,IACvD,YAAc,EAAA,SAAA;AAAA,IACd,QAAA;AAAA,IACA,6BAAA;AAAA,GACD,CAAA,CAAA;AAED,EAAA,MAAM,YACJ,GAAA,cAAA,IAAkB,KAAU,KAAA,MAAA,mBACzBC,cAAA,CAAA,MAAA,EAAA,EAAK,SAAW,EAAA,CAAA,EAAG,SAAS,CAAA,KAAA,CAAA,EAAS,WAAU,EAAA,OAAA,EAAQ,CACtD,GAAA,KAAA,CAAA,CAAA;AAEN,EAAA,MAAM,cACJ,GAAA,cAAA,IAAkB,KAAU,KAAA,OAAA,mBACzBA,cAAA,CAAA,MAAA,EAAA,EAAK,SAAW,EAAA,CAAA,EAAG,SAAS,CAAA,KAAA,CAAA,EAAS,WAAU,EAAA,OAAA,EAAQ,CACtD,GAAA,KAAA,CAAA,CAAA;AAEN,EACE,uBAAAA,cAAA;AAAA,IAACC,UAAA;AAAA,IAAA;AAAA,MACE,GAAG,SAAA;AAAA,MACJ,SAAA,EAAW,GAAG,SAAW,EAAA;AAAA,QACvB,CAAC,CAAA,EAAG,SAAS,CAAA,MAAA,CAAQ,GAAG,cAAmB,KAAA,KAAA,CAAA;AAAA,OAC5C,CAAA;AAAA,MACD,YAAA;AAAA,MACA,cAAA;AAAA,KAAA;AAAA,GACF,CAAA;AAEJ,EAAA;AAEAC,0BAAkB,CAAA,YAAA,EAAc,WAAW,eAAiB,EAAA;AAAA,EAC1D,aAAe,EAAA,KAAA;AACjB,CAAC,CAAA;;;;"}
+{"version":3,"file":"InputCell.js","sources":["../../../src/cell-renderers/input-cell/InputCell.tsx"],"sourcesContent":["import { TableCellRendererProps } from \"@vuu-ui/vuu-table-types\";\nimport { registerComponent } from \"@vuu-ui/vuu-utils\";\nimport { Input } from \"@salt-ds/core\";\nimport { useEditableText } from \"@vuu-ui/vuu-ui-controls\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport cx from \"clsx\";\n\nimport inputCellCss from \"./InputCell.css\";\n\nconst classBase = \"vuuTableInputCell\";\n\nconst WarnCommit = (): Promise<true> => {\n  console.warn(\n    \"onCommit handler has not been provided to InputCell cell renderer\"\n  );\n  return Promise.resolve(true);\n};\nexport const InputCell = ({\n  column,\n  columnMap,\n  onCommit = WarnCommit,\n  row\n}: TableCellRendererProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-input-cell\",\n    css: inputCellCss,\n    window: targetWindow\n  });\n\n  const dataIdx = columnMap[column.name];\n  const dataValue = row[dataIdx] as number | string;\n  const { align = \"left\", clientSideEditValidationCheck } = column;\n\n  const { warningMessage, ...editProps } = useEditableText({\n    initialValue: dataValue,\n    onCommit,\n    clientSideEditValidationCheck\n  });\n\n  const endAdornment =\n    warningMessage && align === \"left\" ? (\n      <span className={`${classBase}-icon`} data-icon=\"error\" />\n    ) : undefined;\n\n  const startAdornment =\n    warningMessage && align === \"right\" ? (\n      <span className={`${classBase}-icon`} data-icon=\"error\" />\n    ) : undefined;\n\n  return (\n    <Input\n      {...editProps}\n      className={cx(classBase, {\n        [`${classBase}-error`]: warningMessage !== undefined\n      })}\n      endAdornment={endAdornment}\n      startAdornment={startAdornment}\n    />\n  );\n};\n\nregisterComponent(\"input-cell\", InputCell, \"cell-renderer\", {\n  userCanAssign: false\n});\n"],"names":["useWindow","useComponentCssInjection","inputCellCss","useEditableText","jsx","Input","registerComponent"],"mappings":";;;;;;;;;;;AAUA,MAAM,SAAY,GAAA,mBAAA,CAAA;AAElB,MAAM,aAAa,MAAqB;AACtC,EAAQ,OAAA,CAAA,IAAA;AAAA,IACN,mEAAA;AAAA,GACF,CAAA;AACA,EAAO,OAAA,OAAA,CAAQ,QAAQ,IAAI,CAAA,CAAA;AAC7B,CAAA,CAAA;AACO,MAAM,YAAY,CAAC;AAAA,EACxB,MAAA;AAAA,EACA,SAAA;AAAA,EACA,QAAW,GAAA,UAAA;AAAA,EACX,GAAA;AACF,CAA8B,KAAA;AAC5B,EAAA,MAAM,eAAeA,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,gBAAA;AAAA,IACR,GAAK,EAAAC,WAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAM,MAAA,OAAA,GAAU,SAAU,CAAA,MAAA,CAAO,IAAI,CAAA,CAAA;AACrC,EAAM,MAAA,SAAA,GAAY,IAAI,OAAO,CAAA,CAAA;AAC7B,EAAA,MAAM,EAAE,KAAA,GAAQ,MAAQ,EAAA,6BAAA,EAAkC,GAAA,MAAA,CAAA;AAE1D,EAAA,MAAM,EAAE,cAAA,EAAgB,GAAG,SAAA,KAAcC,6BAAgB,CAAA;AAAA,IACvD,YAAc,EAAA,SAAA;AAAA,IACd,QAAA;AAAA,IACA,6BAAA;AAAA,GACD,CAAA,CAAA;AAED,EAAA,MAAM,YACJ,GAAA,cAAA,IAAkB,KAAU,KAAA,MAAA,mBACzBC,cAAA,CAAA,MAAA,EAAA,EAAK,SAAW,EAAA,CAAA,EAAG,SAAS,CAAA,KAAA,CAAA,EAAS,WAAU,EAAA,OAAA,EAAQ,CACtD,GAAA,KAAA,CAAA,CAAA;AAEN,EAAA,MAAM,cACJ,GAAA,cAAA,IAAkB,KAAU,KAAA,OAAA,mBACzBA,cAAA,CAAA,MAAA,EAAA,EAAK,SAAW,EAAA,CAAA,EAAG,SAAS,CAAA,KAAA,CAAA,EAAS,WAAU,EAAA,OAAA,EAAQ,CACtD,GAAA,KAAA,CAAA,CAAA;AAEN,EACE,uBAAAA,cAAA;AAAA,IAACC,UAAA;AAAA,IAAA;AAAA,MACE,GAAG,SAAA;AAAA,MACJ,SAAA,EAAW,GAAG,SAAW,EAAA;AAAA,QACvB,CAAC,CAAA,EAAG,SAAS,CAAA,MAAA,CAAQ,GAAG,cAAmB,KAAA,KAAA,CAAA;AAAA,OAC5C,CAAA;AAAA,MACD,YAAA;AAAA,MACA,cAAA;AAAA,KAAA;AAAA,GACF,CAAA;AAEJ,EAAA;AAEAC,0BAAkB,CAAA,YAAA,EAAc,WAAW,eAAiB,EAAA;AAAA,EAC1D,aAAe,EAAA,KAAA;AACjB,CAAC,CAAA;;;;"}

package/cjs/cell-renderers/toggle-cell/ToggleCell.js.map

@@ -1 +1 @@
-{"version":3,"file":"ToggleCell.js","sources":["../../../src/cell-renderers/toggle-cell/ToggleCell.tsx"],"sourcesContent":["import {\n  ColumnDescriptor,\n  TableCellRendererProps,\n} from \"@vuu-ui/vuu-table-types\";\nimport { CycleStateCommitHandler, WarnCommit } from \"@vuu-ui/vuu-ui-controls\";\nimport {\n  dataColumnAndKeyUnchanged,\n  dispatchCustomEvent,\n  isTypeDescriptor,\n  isValueListRenderer,\n  registerComponent,\n} from \"@vuu-ui/vuu-utils\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport cx from \"clsx\";\n\nimport { memo, useCallback } from \"react\";\nimport { CycleStateButton } from \"@vuu-ui/vuu-ui-controls\";\n\nimport toggleCellCss from \"./ToggleCell.css\";\n\nconst classBase = \"vuuTableToggleCell\";\n\nconst getValueList = ({ name, type }: ColumnDescriptor) => {\n  if (isTypeDescriptor(type) && isValueListRenderer(type.renderer)) {\n    return type.renderer.values;\n  } else {\n    throw Error(\n      `useLookupValues column ${name} has not been configured with a values list`,\n    );\n  }\n};\n\nexport const ToggleCell = memo(function ToggleCell({\n  column,\n  columnMap,\n  onCommit = WarnCommit,\n  row,\n}: TableCellRendererProps) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-toggle-cell\",\n    css: toggleCellCss,\n    window: targetWindow,\n  });\n\n  const values = getValueList(column);\n  const dataIdx = columnMap[column.name];\n  const value = row[dataIdx] as string;\n\n  const handleCommit = useCallback<CycleStateCommitHandler>(\n    (evt, value) => {\n      return onCommit(value).then((response) => {\n        if (response === true) {\n          dispatchCustomEvent(evt.target as HTMLElement, \"vuu-commit\");\n        }\n        return response;\n      });\n    },\n    [onCommit],\n  );\n\n  return (\n    <CycleStateButton\n      className={cx(classBase, `${classBase}-${column.name}`)}\n      onCommit={handleCommit}\n      value={value}\n      values={values}\n      variant=\"cta\"\n    >\n      {value}\n    </CycleStateButton>\n  );\n}, dataColumnAndKeyUnchanged);\n\nregisterComponent(\"toggle-cell\", ToggleCell, \"cell-renderer\", {\n  userCanAssign: false,\n});\n"],"names":["isTypeDescriptor","isValueListRenderer","memo","ToggleCell","WarnCommit","useWindow","useComponentCssInjection","toggleCellCss","useCallback","value","dispatchCustomEvent","jsx","CycleStateButton","dataColumnAndKeyUnchanged","registerComponent"],"mappings":";;;;;;;;;;;AAqBA,MAAM,SAAY,GAAA,oBAAA,CAAA;AAElB,MAAM,YAAe,GAAA,CAAC,EAAE,IAAA,EAAM,MAA6B,KAAA;AACzD,EAAA,IAAIA,0BAAiB,IAAI,CAAA,IAAKC,4BAAoB,CAAA,IAAA,CAAK,QAAQ,CAAG,EAAA;AAChE,IAAA,OAAO,KAAK,QAAS,CAAA,MAAA,CAAA;AAAA,GAChB,MAAA;AACL,IAAM,MAAA,KAAA;AAAA,MACJ,0BAA0B,IAAI,CAAA,2CAAA,CAAA;AAAA,KAChC,CAAA;AAAA,GACF;AACF,CAAA,CAAA;AAEa,MAAA,UAAA,GAAaC,UAAK,CAAA,SAASC,WAAW,CAAA;AAAA,EACjD,MAAA;AAAA,EACA,SAAA;AAAA,EACA,QAAW,GAAAC,wBAAA;AAAA,EACX,GAAA;AACF,CAA2B,EAAA;AACzB,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,iBAAA;AAAA,IACR,GAAK,EAAAC,YAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAM,MAAA,MAAA,GAAS,aAAa,MAAM,CAAA,CAAA;AAClC,EAAM,MAAA,OAAA,GAAU,SAAU,CAAA,MAAA,CAAO,IAAI,CAAA,CAAA;AACrC,EAAM,MAAA,KAAA,GAAQ,IAAI,OAAO,CAAA,CAAA;AAEzB,EAAA,MAAM,YAAe,GAAAC,iBAAA;AAAA,IACnB,CAAC,KAAKC,MAAU,KAAA;AACd,MAAA,OAAO,QAASA,CAAAA,MAAK,CAAE,CAAA,IAAA,CAAK,CAAC,QAAa,KAAA;AACxC,QAAA,IAAI,aAAa,IAAM,EAAA;AACrB,UAAoBC,4BAAA,CAAA,GAAA,CAAI,QAAuB,YAAY,CAAA,CAAA;AAAA,SAC7D;AACA,QAAO,OAAA,QAAA,CAAA;AAAA,OACR,CAAA,CAAA;AAAA,KACH;AAAA,IACA,CAAC,QAAQ,CAAA;AAAA,GACX,CAAA;AAEA,EACE,uBAAAC,cAAA;AAAA,IAACC,8BAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAW,GAAG,SAAW,EAAA,CAAA,EAAG,SAAS,CAAI,CAAA,EAAA,MAAA,CAAO,IAAI,CAAE,CAAA,CAAA;AAAA,MACtD,QAAU,EAAA,YAAA;AAAA,MACV,KAAA;AAAA,MACA,MAAA;AAAA,MACA,OAAQ,EAAA,KAAA;AAAA,MAEP,QAAA,EAAA,KAAA;AAAA,KAAA;AAAA,GACH,CAAA;AAEJ,CAAA,EAAGC,kCAAyB,EAAA;AAE5BC,0BAAkB,CAAA,aAAA,EAAe,YAAY,eAAiB,EAAA;AAAA,EAC5D,aAAe,EAAA,KAAA;AACjB,CAAC,CAAA;;;;"}
+{"version":3,"file":"ToggleCell.js","sources":["../../../src/cell-renderers/toggle-cell/ToggleCell.tsx"],"sourcesContent":["import {\n  ColumnDescriptor,\n  TableCellRendererProps\n} from \"@vuu-ui/vuu-table-types\";\nimport { CycleStateCommitHandler, WarnCommit } from \"@vuu-ui/vuu-ui-controls\";\nimport {\n  dataColumnAndKeyUnchanged,\n  dispatchCustomEvent,\n  isTypeDescriptor,\n  isValueListRenderer,\n  registerComponent\n} from \"@vuu-ui/vuu-utils\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport cx from \"clsx\";\n\nimport { memo, useCallback } from \"react\";\nimport { CycleStateButton } from \"@vuu-ui/vuu-ui-controls\";\n\nimport toggleCellCss from \"./ToggleCell.css\";\n\nconst classBase = \"vuuTableToggleCell\";\n\nconst getValueList = ({ name, type }: ColumnDescriptor) => {\n  if (isTypeDescriptor(type) && isValueListRenderer(type.renderer)) {\n    return type.renderer.values;\n  } else {\n    throw Error(\n      `useLookupValues column ${name} has not been configured with a values list`\n    );\n  }\n};\n\nexport const ToggleCell = memo(function ToggleCell({\n  column,\n  columnMap,\n  onCommit = WarnCommit,\n  row\n}: TableCellRendererProps) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-toggle-cell\",\n    css: toggleCellCss,\n    window: targetWindow\n  });\n\n  const values = getValueList(column);\n  const dataIdx = columnMap[column.name];\n  const value = row[dataIdx] as string;\n\n  const handleCommit = useCallback<CycleStateCommitHandler>(\n    (evt, value) => {\n      return onCommit(value).then((response) => {\n        if (response === true) {\n          dispatchCustomEvent(evt.target as HTMLElement, \"vuu-commit\");\n        }\n        return response;\n      });\n    },\n    [onCommit]\n  );\n\n  return (\n    <CycleStateButton\n      className={cx(classBase, `${classBase}-${column.name}`)}\n      onCommit={handleCommit}\n      value={value}\n      values={values}\n      variant=\"cta\"\n    >\n      {value}\n    </CycleStateButton>\n  );\n}, dataColumnAndKeyUnchanged);\n\nregisterComponent(\"toggle-cell\", ToggleCell, \"cell-renderer\", {\n  userCanAssign: false\n});\n"],"names":["isTypeDescriptor","isValueListRenderer","memo","ToggleCell","WarnCommit","useWindow","useComponentCssInjection","toggleCellCss","useCallback","value","dispatchCustomEvent","jsx","CycleStateButton","dataColumnAndKeyUnchanged","registerComponent"],"mappings":";;;;;;;;;;;AAqBA,MAAM,SAAY,GAAA,oBAAA,CAAA;AAElB,MAAM,YAAe,GAAA,CAAC,EAAE,IAAA,EAAM,MAA6B,KAAA;AACzD,EAAA,IAAIA,0BAAiB,IAAI,CAAA,IAAKC,4BAAoB,CAAA,IAAA,CAAK,QAAQ,CAAG,EAAA;AAChE,IAAA,OAAO,KAAK,QAAS,CAAA,MAAA,CAAA;AAAA,GAChB,MAAA;AACL,IAAM,MAAA,KAAA;AAAA,MACJ,0BAA0B,IAAI,CAAA,2CAAA,CAAA;AAAA,KAChC,CAAA;AAAA,GACF;AACF,CAAA,CAAA;AAEa,MAAA,UAAA,GAAaC,UAAK,CAAA,SAASC,WAAW,CAAA;AAAA,EACjD,MAAA;AAAA,EACA,SAAA;AAAA,EACA,QAAW,GAAAC,wBAAA;AAAA,EACX,GAAA;AACF,CAA2B,EAAA;AACzB,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,iBAAA;AAAA,IACR,GAAK,EAAAC,YAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAM,MAAA,MAAA,GAAS,aAAa,MAAM,CAAA,CAAA;AAClC,EAAM,MAAA,OAAA,GAAU,SAAU,CAAA,MAAA,CAAO,IAAI,CAAA,CAAA;AACrC,EAAM,MAAA,KAAA,GAAQ,IAAI,OAAO,CAAA,CAAA;AAEzB,EAAA,MAAM,YAAe,GAAAC,iBAAA;AAAA,IACnB,CAAC,KAAKC,MAAU,KAAA;AACd,MAAA,OAAO,QAASA,CAAAA,MAAK,CAAE,CAAA,IAAA,CAAK,CAAC,QAAa,KAAA;AACxC,QAAA,IAAI,aAAa,IAAM,EAAA;AACrB,UAAoBC,4BAAA,CAAA,GAAA,CAAI,QAAuB,YAAY,CAAA,CAAA;AAAA,SAC7D;AACA,QAAO,OAAA,QAAA,CAAA;AAAA,OACR,CAAA,CAAA;AAAA,KACH;AAAA,IACA,CAAC,QAAQ,CAAA;AAAA,GACX,CAAA;AAEA,EACE,uBAAAC,cAAA;AAAA,IAACC,8BAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAW,GAAG,SAAW,EAAA,CAAA,EAAG,SAAS,CAAI,CAAA,EAAA,MAAA,CAAO,IAAI,CAAE,CAAA,CAAA;AAAA,MACtD,QAAU,EAAA,YAAA;AAAA,MACV,KAAA;AAAA,MACA,MAAA;AAAA,MACA,OAAQ,EAAA,KAAA;AAAA,MAEP,QAAA,EAAA,KAAA;AAAA,KAAA;AAAA,GACH,CAAA;AAEJ,CAAA,EAAGC,kCAAyB,EAAA;AAE5BC,0BAAkB,CAAA,aAAA,EAAe,YAAY,eAAiB,EAAA;AAAA,EAC5D,aAAe,EAAA,KAAA;AACjB,CAAC,CAAA;;;;"}

package/cjs/column-header-pill/ColumnHeaderPill.js.map

@@ -1 +1 @@
-{"version":3,"file":"ColumnHeaderPill.js","sources":["../../src/column-header-pill/ColumnHeaderPill.tsx"],"sourcesContent":["import cx from \"clsx\";\nimport { RuntimeColumnDescriptor } from \"@vuu-ui/vuu-table-types\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { HTMLAttributes, MouseEvent, useCallback } from \"react\";\n\nimport columnHeaderPillCss from \"./ColumnHeaderPill.css\";\n\nexport interface ColumnHeaderPillProps extends HTMLAttributes<HTMLDivElement> {\n  column: RuntimeColumnDescriptor;\n  removable?: boolean;\n  onRemove?: (column: RuntimeColumnDescriptor) => void;\n}\n\nconst classBase = \"vuuColumnHeaderPill\";\n\nexport const ColumnHeaderPill = ({\n  children,\n  className,\n  column,\n  onRemove,\n  removable,\n  ...htmlAttributes\n}: ColumnHeaderPillProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-column-header-pill\",\n    css: columnHeaderPillCss,\n    window: targetWindow,\n  });\n\n  if (removable && typeof onRemove !== \"function\") {\n    throw Error(\n      \"ColumnHeaderPill onRemove prop must be provided if Pill is removable\",\n    );\n  }\n\n  const handleClickRemove = useCallback(\n    (evt: MouseEvent<HTMLSpanElement>) => {\n      evt.preventDefault();\n      evt.stopPropagation();\n      onRemove?.(column);\n    },\n    [column, onRemove],\n  );\n\n  return (\n    <div {...htmlAttributes} className={cx(classBase, className)}>\n      {children}\n      {removable ? (\n        <span\n          className={`${classBase}-removeButton`}\n          role=\"button\"\n          data-icon=\"cross\"\n          onClick={handleClickRemove}\n        />\n      ) : null}\n    </div>\n  );\n};\n"],"names":["useWindow","useComponentCssInjection","columnHeaderPillCss","useCallback","jsxs","jsx"],"mappings":";;;;;;;;;AAcA,MAAM,SAAY,GAAA,qBAAA,CAAA;AAEX,MAAM,mBAAmB,CAAC;AAAA,EAC/B,QAAA;AAAA,EACA,SAAA;AAAA,EACA,MAAA;AAAA,EACA,QAAA;AAAA,EACA,SAAA;AAAA,EACA,GAAG,cAAA;AACL,CAA6B,KAAA;AAC3B,EAAA,MAAM,eAAeA,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,wBAAA;AAAA,IACR,GAAK,EAAAC,kBAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAI,IAAA,SAAA,IAAa,OAAO,QAAA,KAAa,UAAY,EAAA;AAC/C,IAAM,MAAA,KAAA;AAAA,MACJ,sEAAA;AAAA,KACF,CAAA;AAAA,GACF;AAEA,EAAA,MAAM,iBAAoB,GAAAC,iBAAA;AAAA,IACxB,CAAC,GAAqC,KAAA;AACpC,MAAA,GAAA,CAAI,cAAe,EAAA,CAAA;AACnB,MAAA,GAAA,CAAI,eAAgB,EAAA,CAAA;AACpB,MAAA,QAAA,GAAW,MAAM,CAAA,CAAA;AAAA,KACnB;AAAA,IACA,CAAC,QAAQ,QAAQ,CAAA;AAAA,GACnB,CAAA;AAEA,EACE,uBAAAC,eAAA,CAAC,SAAK,GAAG,cAAA,EAAgB,WAAW,EAAG,CAAA,SAAA,EAAW,SAAS,CACxD,EAAA,QAAA,EAAA;AAAA,IAAA,QAAA;AAAA,IACA,SACC,mBAAAC,cAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAW,GAAG,SAAS,CAAA,aAAA,CAAA;AAAA,QACvB,IAAK,EAAA,QAAA;AAAA,QACL,WAAU,EAAA,OAAA;AAAA,QACV,OAAS,EAAA,iBAAA;AAAA,OAAA;AAAA,KAET,GAAA,IAAA;AAAA,GACN,EAAA,CAAA,CAAA;AAEJ;;;;"}
+{"version":3,"file":"ColumnHeaderPill.js","sources":["../../src/column-header-pill/ColumnHeaderPill.tsx"],"sourcesContent":["import cx from \"clsx\";\nimport { RuntimeColumnDescriptor } from \"@vuu-ui/vuu-table-types\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { HTMLAttributes, MouseEvent, useCallback } from \"react\";\n\nimport columnHeaderPillCss from \"./ColumnHeaderPill.css\";\n\nexport interface ColumnHeaderPillProps extends HTMLAttributes<HTMLDivElement> {\n  column: RuntimeColumnDescriptor;\n  removable?: boolean;\n  onRemove?: (column: RuntimeColumnDescriptor) => void;\n}\n\nconst classBase = \"vuuColumnHeaderPill\";\n\nexport const ColumnHeaderPill = ({\n  children,\n  className,\n  column,\n  onRemove,\n  removable,\n  ...htmlAttributes\n}: ColumnHeaderPillProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-column-header-pill\",\n    css: columnHeaderPillCss,\n    window: targetWindow\n  });\n\n  if (removable && typeof onRemove !== \"function\") {\n    throw Error(\n      \"ColumnHeaderPill onRemove prop must be provided if Pill is removable\"\n    );\n  }\n\n  const handleClickRemove = useCallback(\n    (evt: MouseEvent<HTMLSpanElement>) => {\n      evt.preventDefault();\n      evt.stopPropagation();\n      onRemove?.(column);\n    },\n    [column, onRemove]\n  );\n\n  return (\n    <div {...htmlAttributes} className={cx(classBase, className)}>\n      {children}\n      {removable ? (\n        <span\n          className={`${classBase}-removeButton`}\n          role=\"button\"\n          data-icon=\"cross\"\n          onClick={handleClickRemove}\n        />\n      ) : null}\n    </div>\n  );\n};\n"],"names":["useWindow","useComponentCssInjection","columnHeaderPillCss","useCallback","jsxs","jsx"],"mappings":";;;;;;;;;AAcA,MAAM,SAAY,GAAA,qBAAA,CAAA;AAEX,MAAM,mBAAmB,CAAC;AAAA,EAC/B,QAAA;AAAA,EACA,SAAA;AAAA,EACA,MAAA;AAAA,EACA,QAAA;AAAA,EACA,SAAA;AAAA,EACA,GAAG,cAAA;AACL,CAA6B,KAAA;AAC3B,EAAA,MAAM,eAAeA,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,wBAAA;AAAA,IACR,GAAK,EAAAC,kBAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAI,IAAA,SAAA,IAAa,OAAO,QAAA,KAAa,UAAY,EAAA;AAC/C,IAAM,MAAA,KAAA;AAAA,MACJ,sEAAA;AAAA,KACF,CAAA;AAAA,GACF;AAEA,EAAA,MAAM,iBAAoB,GAAAC,iBAAA;AAAA,IACxB,CAAC,GAAqC,KAAA;AACpC,MAAA,GAAA,CAAI,cAAe,EAAA,CAAA;AACnB,MAAA,GAAA,CAAI,eAAgB,EAAA,CAAA;AACpB,MAAA,QAAA,GAAW,MAAM,CAAA,CAAA;AAAA,KACnB;AAAA,IACA,CAAC,QAAQ,QAAQ,CAAA;AAAA,GACnB,CAAA;AAEA,EACE,uBAAAC,eAAA,CAAC,SAAK,GAAG,cAAA,EAAgB,WAAW,EAAG,CAAA,SAAA,EAAW,SAAS,CACxD,EAAA,QAAA,EAAA;AAAA,IAAA,QAAA;AAAA,IACA,SACC,mBAAAC,cAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAW,GAAG,SAAS,CAAA,aAAA,CAAA;AAAA,QACvB,IAAK,EAAA,QAAA;AAAA,QACL,WAAU,EAAA,OAAA;AAAA,QACV,OAAS,EAAA,iBAAA;AAAA,OAAA;AAAA,KAET,GAAA,IAAA;AAAA,GACN,EAAA,CAAA,CAAA;AAEJ;;;;"}

package/cjs/column-header-pill/GroupColumnPill.js.map

@@ -1 +1 @@
-{"version":3,"file":"GroupColumnPill.js","sources":["../../src/column-header-pill/GroupColumnPill.tsx"],"sourcesContent":["import { RuntimeColumnDescriptor } from \"@vuu-ui/vuu-table-types\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport { ColumnHeaderPill, ColumnHeaderPillProps } from \"./ColumnHeaderPill\";\n\nimport groupColumnPillCss from \"./GroupColumnPill.css\";\n\nexport interface GroupColumnPillProps extends ColumnHeaderPillProps {\n  column: RuntimeColumnDescriptor;\n}\n\nexport const GroupColumnPill = ({\n  column,\n  ...columnHeaderProps\n}: GroupColumnPillProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-group-column-pill\",\n    css: groupColumnPillCss,\n    window: targetWindow,\n  });\n\n  const { name, sorted } = column;\n  const icon =\n    typeof sorted === \"number\"\n      ? sorted < 0\n        ? \"arrow-down\"\n        : \"arrow-up\"\n      : sorted === \"A\"\n        ? \"arrow-up\"\n        : sorted === \"D\"\n          ? \"arrow-down\"\n          : undefined;\n\n  return (\n    <ColumnHeaderPill {...columnHeaderProps} column={column}>\n      <span className=\"vuuGroupColumnPill-label\">{name}</span>\n      {icon !== undefined ? <span data-icon={icon} /> : null}\n      {typeof sorted === \"number\" ? (\n        <span className={\"vuuSortPosition\"}>{Math.abs(sorted)}</span>\n      ) : null}\n    </ColumnHeaderPill>\n  );\n};\n"],"names":["useWindow","useComponentCssInjection","groupColumnPillCss","jsxs","ColumnHeaderPill","jsx"],"mappings":";;;;;;;;AAYO,MAAM,kBAAkB,CAAC;AAAA,EAC9B,MAAA;AAAA,EACA,GAAG,iBAAA;AACL,CAA4B,KAAA;AAC1B,EAAA,MAAM,eAAeA,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,uBAAA;AAAA,IACR,GAAK,EAAAC,iBAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAM,MAAA,EAAE,IAAM,EAAA,MAAA,EAAW,GAAA,MAAA,CAAA;AACzB,EAAA,MAAM,IACJ,GAAA,OAAO,MAAW,KAAA,QAAA,GACd,MAAS,GAAA,CAAA,GACP,YACA,GAAA,UAAA,GACF,MAAW,KAAA,GAAA,GACT,UACA,GAAA,MAAA,KAAW,MACT,YACA,GAAA,KAAA,CAAA,CAAA;AAEV,EAAA,uBACGC,eAAA,CAAAC,iCAAA,EAAA,EAAkB,GAAG,iBAAA,EAAmB,MACvC,EAAA,QAAA,EAAA;AAAA,oBAACC,cAAA,CAAA,MAAA,EAAA,EAAK,SAAU,EAAA,0BAAA,EAA4B,QAAK,EAAA,IAAA,EAAA,CAAA;AAAA,IAChD,SAAS,KAAY,CAAA,mBAAAA,cAAA,CAAC,MAAK,EAAA,EAAA,WAAA,EAAW,MAAM,CAAK,GAAA,IAAA;AAAA,IACjD,OAAO,MAAW,KAAA,QAAA,mBAChBA,cAAA,CAAA,MAAA,EAAA,EAAK,SAAW,EAAA,iBAAA,EAAoB,QAAK,EAAA,IAAA,CAAA,GAAA,CAAI,MAAM,CAAA,EAAE,CACpD,GAAA,IAAA;AAAA,GACN,EAAA,CAAA,CAAA;AAEJ;;;;"}
+{"version":3,"file":"GroupColumnPill.js","sources":["../../src/column-header-pill/GroupColumnPill.tsx"],"sourcesContent":["import { RuntimeColumnDescriptor } from \"@vuu-ui/vuu-table-types\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport { ColumnHeaderPill, ColumnHeaderPillProps } from \"./ColumnHeaderPill\";\n\nimport groupColumnPillCss from \"./GroupColumnPill.css\";\n\nexport interface GroupColumnPillProps extends ColumnHeaderPillProps {\n  column: RuntimeColumnDescriptor;\n}\n\nexport const GroupColumnPill = ({\n  column,\n  ...columnHeaderProps\n}: GroupColumnPillProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-group-column-pill\",\n    css: groupColumnPillCss,\n    window: targetWindow\n  });\n\n  const { name, sorted } = column;\n  const icon =\n    typeof sorted === \"number\"\n      ? sorted < 0\n        ? \"arrow-down\"\n        : \"arrow-up\"\n      : sorted === \"A\"\n        ? \"arrow-up\"\n        : sorted === \"D\"\n          ? \"arrow-down\"\n          : undefined;\n\n  return (\n    <ColumnHeaderPill {...columnHeaderProps} column={column}>\n      <span className=\"vuuGroupColumnPill-label\">{name}</span>\n      {icon !== undefined ? <span data-icon={icon} /> : null}\n      {typeof sorted === \"number\" ? (\n        <span className={\"vuuSortPosition\"}>{Math.abs(sorted)}</span>\n      ) : null}\n    </ColumnHeaderPill>\n  );\n};\n"],"names":["useWindow","useComponentCssInjection","groupColumnPillCss","jsxs","ColumnHeaderPill","jsx"],"mappings":";;;;;;;;AAYO,MAAM,kBAAkB,CAAC;AAAA,EAC9B,MAAA;AAAA,EACA,GAAG,iBAAA;AACL,CAA4B,KAAA;AAC1B,EAAA,MAAM,eAAeA,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,uBAAA;AAAA,IACR,GAAK,EAAAC,iBAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAM,MAAA,EAAE,IAAM,EAAA,MAAA,EAAW,GAAA,MAAA,CAAA;AACzB,EAAA,MAAM,IACJ,GAAA,OAAO,MAAW,KAAA,QAAA,GACd,MAAS,GAAA,CAAA,GACP,YACA,GAAA,UAAA,GACF,MAAW,KAAA,GAAA,GACT,UACA,GAAA,MAAA,KAAW,MACT,YACA,GAAA,KAAA,CAAA,CAAA;AAEV,EAAA,uBACGC,eAAA,CAAAC,iCAAA,EAAA,EAAkB,GAAG,iBAAA,EAAmB,MACvC,EAAA,QAAA,EAAA;AAAA,oBAACC,cAAA,CAAA,MAAA,EAAA,EAAK,SAAU,EAAA,0BAAA,EAA4B,QAAK,EAAA,IAAA,EAAA,CAAA;AAAA,IAChD,SAAS,KAAY,CAAA,mBAAAA,cAAA,CAAC,MAAK,EAAA,EAAA,WAAA,EAAW,MAAM,CAAK,GAAA,IAAA;AAAA,IACjD,OAAO,MAAW,KAAA,QAAA,mBAChBA,cAAA,CAAA,MAAA,EAAA,EAAK,SAAW,EAAA,iBAAA,EAAoB,QAAK,EAAA,IAAA,CAAA,GAAA,CAAI,MAAM,CAAA,EAAE,CACpD,GAAA,IAAA;AAAA,GACN,EAAA,CAAA,CAAA;AAEJ;;;;"}

package/cjs/column-header-pill/SortIndicator.js.map

@@ -1 +1 @@
-{"version":3,"file":"SortIndicator.js","sources":["../../src/column-header-pill/SortIndicator.tsx"],"sourcesContent":["import { RuntimeColumnDescriptor } from \"@vuu-ui/vuu-table-types\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { ColumnHeaderPill } from \"./ColumnHeaderPill\";\n\nimport sortIndicatorCss from \"./SortIndicator.css\";\n\nexport interface SortIndicatorProps {\n  column: RuntimeColumnDescriptor;\n}\n\nexport const SortIndicator = ({ column }: SortIndicatorProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-table-sort-indicator\",\n    css: sortIndicatorCss,\n    window: targetWindow,\n  });\n\n  if (!column.sorted) {\n    return null;\n  }\n\n  const icon =\n    typeof column.sorted === \"number\"\n      ? column.sorted < 0\n        ? \"arrow-down\"\n        : \"arrow-up\"\n      : column.sorted === \"A\"\n        ? \"arrow-up\"\n        : \"arrow-down\";\n\n  return (\n    <ColumnHeaderPill column={column}>\n      <span data-icon={icon} />\n      {typeof column.sorted === \"number\" ? (\n        <span className={\"vuuSortPosition\"}>{Math.abs(column.sorted)}</span>\n      ) : null}\n    </ColumnHeaderPill>\n  );\n};\n"],"names":["useWindow","useComponentCssInjection","sortIndicatorCss","jsxs","ColumnHeaderPill","jsx"],"mappings":";;;;;;;;AAWO,MAAM,aAAgB,GAAA,CAAC,EAAE,MAAA,EAAiC,KAAA;AAC/D,EAAA,MAAM,eAAeA,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,0BAAA;AAAA,IACR,GAAK,EAAAC,eAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAI,IAAA,CAAC,OAAO,MAAQ,EAAA;AAClB,IAAO,OAAA,IAAA,CAAA;AAAA,GACT;AAEA,EAAA,MAAM,IACJ,GAAA,OAAO,MAAO,CAAA,MAAA,KAAW,QACrB,GAAA,MAAA,CAAO,MAAS,GAAA,CAAA,GACd,YACA,GAAA,UAAA,GACF,MAAO,CAAA,MAAA,KAAW,MAChB,UACA,GAAA,YAAA,CAAA;AAER,EACE,uBAAAC,eAAA,CAACC,qCAAiB,MAChB,EAAA,QAAA,EAAA;AAAA,oBAACC,cAAA,CAAA,MAAA,EAAA,EAAK,aAAW,IAAM,EAAA,CAAA;AAAA,IACtB,OAAO,MAAA,CAAO,MAAW,KAAA,QAAA,mBACvBA,cAAA,CAAA,MAAA,EAAA,EAAK,SAAW,EAAA,iBAAA,EAAoB,QAAK,EAAA,IAAA,CAAA,GAAA,CAAI,MAAO,CAAA,MAAM,GAAE,CAC3D,GAAA,IAAA;AAAA,GACN,EAAA,CAAA,CAAA;AAEJ;;;;"}
+{"version":3,"file":"SortIndicator.js","sources":["../../src/column-header-pill/SortIndicator.tsx"],"sourcesContent":["import { RuntimeColumnDescriptor } from \"@vuu-ui/vuu-table-types\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { ColumnHeaderPill } from \"./ColumnHeaderPill\";\n\nimport sortIndicatorCss from \"./SortIndicator.css\";\n\nexport interface SortIndicatorProps {\n  column: RuntimeColumnDescriptor;\n}\n\nexport const SortIndicator = ({ column }: SortIndicatorProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-table-sort-indicator\",\n    css: sortIndicatorCss,\n    window: targetWindow\n  });\n\n  if (!column.sorted) {\n    return null;\n  }\n\n  const icon =\n    typeof column.sorted === \"number\"\n      ? column.sorted < 0\n        ? \"arrow-down\"\n        : \"arrow-up\"\n      : column.sorted === \"A\"\n        ? \"arrow-up\"\n        : \"arrow-down\";\n\n  return (\n    <ColumnHeaderPill column={column}>\n      <span data-icon={icon} />\n      {typeof column.sorted === \"number\" ? (\n        <span className={\"vuuSortPosition\"}>{Math.abs(column.sorted)}</span>\n      ) : null}\n    </ColumnHeaderPill>\n  );\n};\n"],"names":["useWindow","useComponentCssInjection","sortIndicatorCss","jsxs","ColumnHeaderPill","jsx"],"mappings":";;;;;;;;AAWO,MAAM,aAAgB,GAAA,CAAC,EAAE,MAAA,EAAiC,KAAA;AAC/D,EAAA,MAAM,eAAeA,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,0BAAA;AAAA,IACR,GAAK,EAAAC,eAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAI,IAAA,CAAC,OAAO,MAAQ,EAAA;AAClB,IAAO,OAAA,IAAA,CAAA;AAAA,GACT;AAEA,EAAA,MAAM,IACJ,GAAA,OAAO,MAAO,CAAA,MAAA,KAAW,QACrB,GAAA,MAAA,CAAO,MAAS,GAAA,CAAA,GACd,YACA,GAAA,UAAA,GACF,MAAO,CAAA,MAAA,KAAW,MAChB,UACA,GAAA,YAAA,CAAA;AAER,EACE,uBAAAC,eAAA,CAACC,qCAAiB,MAChB,EAAA,QAAA,EAAA;AAAA,oBAACC,cAAA,CAAA,MAAA,EAAA,EAAK,aAAW,IAAM,EAAA,CAAA;AAAA,IACtB,OAAO,MAAA,CAAO,MAAW,KAAA,QAAA,mBACvBA,cAAA,CAAA,MAAA,EAAA,EAAK,SAAW,EAAA,iBAAA,EAAoB,QAAK,EAAA,IAAA,CAAA,GAAA,CAAI,MAAO,CAAA,MAAM,GAAE,CAC3D,GAAA,IAAA;AAAA,GACN,EAAA,CAAA,CAAA;AAEJ;;;;"}

package/cjs/column-menu/ColumnMenu.js.map

@@ -1 +1 @@
-{"version":3,"file":"ColumnMenu.js","sources":["../../src/column-menu/ColumnMenu.tsx"],"sourcesContent":["import { RuntimeColumnDescriptor } from \"@vuu-ui/vuu-table-types\";\nimport { PopupMenu } from \"@vuu-ui/vuu-popups\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { HTMLAttributes } from \"react\";\nimport cx from \"clsx\";\n\nimport columnMenuCss from \"./ColumnMenu.css\";\n\nconst classBase = \"vuuColumnMenu\";\nexport interface ColumnMenuProps extends HTMLAttributes<HTMLSpanElement> {\n  column: RuntimeColumnDescriptor;\n}\n\nexport const ColumnMenu = ({ className, column }: ColumnMenuProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-column-menu\",\n    css: columnMenuCss,\n    window: targetWindow,\n  });\n\n  return (\n    <PopupMenu\n      className={cx(classBase, className)}\n      data-embedded\n      menuLocation=\"column-menu\"\n      menuOptions={{ column }}\n    />\n  );\n};\n"],"names":["useWindow","useComponentCssInjection","columnMenuCss","jsx","PopupMenu"],"mappings":";;;;;;;;;AASA,MAAM,SAAY,GAAA,eAAA,CAAA;AAKX,MAAM,UAAa,GAAA,CAAC,EAAE,SAAA,EAAW,QAA8B,KAAA;AACpE,EAAA,MAAM,eAAeA,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,iBAAA;AAAA,IACR,GAAK,EAAAC,YAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EACE,uBAAAC,cAAA;AAAA,IAACC,mBAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAW,EAAG,CAAA,SAAA,EAAW,SAAS,CAAA;AAAA,MAClC,eAAa,EAAA,IAAA;AAAA,MACb,YAAa,EAAA,aAAA;AAAA,MACb,WAAA,EAAa,EAAE,MAAO,EAAA;AAAA,KAAA;AAAA,GACxB,CAAA;AAEJ;;;;"}
+{"version":3,"file":"ColumnMenu.js","sources":["../../src/column-menu/ColumnMenu.tsx"],"sourcesContent":["import { RuntimeColumnDescriptor } from \"@vuu-ui/vuu-table-types\";\nimport { PopupMenu } from \"@vuu-ui/vuu-popups\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { HTMLAttributes } from \"react\";\nimport cx from \"clsx\";\n\nimport columnMenuCss from \"./ColumnMenu.css\";\n\nconst classBase = \"vuuColumnMenu\";\nexport interface ColumnMenuProps extends HTMLAttributes<HTMLSpanElement> {\n  column: RuntimeColumnDescriptor;\n}\n\nexport const ColumnMenu = ({ className, column }: ColumnMenuProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-column-menu\",\n    css: columnMenuCss,\n    window: targetWindow\n  });\n\n  return (\n    <PopupMenu\n      className={cx(classBase, className)}\n      data-embedded\n      menuLocation=\"column-menu\"\n      menuOptions={{ column }}\n    />\n  );\n};\n"],"names":["useWindow","useComponentCssInjection","columnMenuCss","jsx","PopupMenu"],"mappings":";;;;;;;;;AASA,MAAM,SAAY,GAAA,eAAA,CAAA;AAKX,MAAM,UAAa,GAAA,CAAC,EAAE,SAAA,EAAW,QAA8B,KAAA;AACpE,EAAA,MAAM,eAAeA,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,iBAAA;AAAA,IACR,GAAK,EAAAC,YAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EACE,uBAAAC,cAAA;AAAA,IAACC,mBAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAW,EAAG,CAAA,SAAA,EAAW,SAAS,CAAA;AAAA,MAClC,eAAa,EAAA,IAAA;AAAA,MACb,YAAa,EAAA,aAAA;AAAA,MACb,WAAA,EAAa,EAAE,MAAO,EAAA;AAAA,KAAA;AAAA,GACxB,CAAA;AAEJ;;;;"}

package/cjs/column-resizing/useTableColumnResize.js.map

@@ -1 +1 @@
-{"version":3,"file":"useTableColumnResize.js","sources":["../../src/column-resizing/useTableColumnResize.tsx"],"sourcesContent":["import {\n  Heading,\n  ResizePhase,\n  RuntimeColumnDescriptor,\n} from \"@vuu-ui/vuu-table-types\";\nimport { RefObject, useCallback, useRef, useState } from \"react\";\n\nexport type ResizeHandler = (evt: MouseEvent, moveBy: number) => void;\nexport interface CellResizeHookProps {\n  column: RuntimeColumnDescriptor | Heading;\n  onResize?: (phase: ResizePhase, columnName: string, width?: number) => void;\n  rootRef: RefObject<HTMLDivElement>;\n}\n\nexport interface CellResizeHookResult {\n  isResizing: boolean;\n  onDrag: (evt: MouseEvent, moveBy: number, totalDistanceMoved: number) => void;\n  onDragStart: (evt: React.MouseEvent) => void;\n  onDragEnd: (evt: MouseEvent) => void;\n}\n\nexport const useTableColumnResize = ({\n  column,\n  onResize,\n  rootRef,\n}: CellResizeHookProps): CellResizeHookResult => {\n  const widthRef = useRef({ start: 0, now: 0 });\n\n  const [isResizing, setResizing] = useState(false);\n  const { name } = column;\n\n  const handleResizeStart = useCallback(() => {\n    if (onResize && rootRef.current) {\n      const { current: width } = widthRef;\n      const { width: measuredWidth } = rootRef.current.getBoundingClientRect();\n      width.start = width.now = Math.round(measuredWidth);\n      setResizing(true);\n      onResize?.(\"begin\", name);\n    }\n  }, [name, onResize, rootRef]);\n\n  const handleResize = useCallback(\n    (_evt: MouseEvent, moveBy: number, totalDistanceMoved) => {\n      if (rootRef.current) {\n        if (onResize) {\n          const { current: width } = widthRef;\n          const newWidth = width.start + totalDistanceMoved;\n          if (newWidth !== width.now && newWidth > 0) {\n            onResize(\"resize\", name, newWidth);\n            width.now = newWidth;\n          }\n        }\n      }\n    },\n    [name, onResize, rootRef],\n  );\n\n  const handleResizeEnd = useCallback(() => {\n    if (onResize) {\n      const { current: width } = widthRef;\n      onResize(\"end\", name, width.now);\n      setTimeout(() => {\n        // clickHandler in HeaderCell checks isResizing before firing. Because onMouseUp\n        // fires before click, we need to delay setting isResizing back to false, just\n        // long enough that the click ghandler will have fired.\n        setResizing(false);\n      }, 80);\n    }\n  }, [name, onResize]);\n\n  return {\n    isResizing,\n    onDrag: handleResize,\n    onDragStart: handleResizeStart,\n    onDragEnd: handleResizeEnd,\n  };\n};\n"],"names":["useRef","useState","useCallback"],"mappings":";;;;AAqBO,MAAM,uBAAuB,CAAC;AAAA,EACnC,MAAA;AAAA,EACA,QAAA;AAAA,EACA,OAAA;AACF,CAAiD,KAAA;AAC/C,EAAA,MAAM,WAAWA,YAAO,CAAA,EAAE,OAAO,CAAG,EAAA,GAAA,EAAK,GAAG,CAAA,CAAA;AAE5C,EAAA,MAAM,CAAC,UAAA,EAAY,WAAW,CAAA,GAAIC,eAAS,KAAK,CAAA,CAAA;AAChD,EAAM,MAAA,EAAE,MAAS,GAAA,MAAA,CAAA;AAEjB,EAAM,MAAA,iBAAA,GAAoBC,kBAAY,MAAM;AAC1C,IAAI,IAAA,QAAA,IAAY,QAAQ,OAAS,EAAA;AAC/B,MAAM,MAAA,EAAE,OAAS,EAAA,KAAA,EAAU,GAAA,QAAA,CAAA;AAC3B,MAAA,MAAM,EAAE,KAAO,EAAA,aAAA,EAAkB,GAAA,OAAA,CAAQ,QAAQ,qBAAsB,EAAA,CAAA;AACvE,MAAA,KAAA,CAAM,KAAQ,GAAA,KAAA,CAAM,GAAM,GAAA,IAAA,CAAK,MAAM,aAAa,CAAA,CAAA;AAClD,MAAA,WAAA,CAAY,IAAI,CAAA,CAAA;AAChB,MAAA,QAAA,GAAW,SAAS,IAAI,CAAA,CAAA;AAAA,KAC1B;AAAA,GACC,EAAA,CAAC,IAAM,EAAA,QAAA,EAAU,OAAO,CAAC,CAAA,CAAA;AAE5B,EAAA,MAAM,YAAe,GAAAA,iBAAA;AAAA,IACnB,CAAC,IAAkB,EAAA,MAAA,EAAgB,kBAAuB,KAAA;AACxD,MAAA,IAAI,QAAQ,OAAS,EAAA;AACnB,QAAA,IAAI,QAAU,EAAA;AACZ,UAAM,MAAA,EAAE,OAAS,EAAA,KAAA,EAAU,GAAA,QAAA,CAAA;AAC3B,UAAM,MAAA,QAAA,GAAW,MAAM,KAAQ,GAAA,kBAAA,CAAA;AAC/B,UAAA,IAAI,QAAa,KAAA,KAAA,CAAM,GAAO,IAAA,QAAA,GAAW,CAAG,EAAA;AAC1C,YAAS,QAAA,CAAA,QAAA,EAAU,MAAM,QAAQ,CAAA,CAAA;AACjC,YAAA,KAAA,CAAM,GAAM,GAAA,QAAA,CAAA;AAAA,WACd;AAAA,SACF;AAAA,OACF;AAAA,KACF;AAAA,IACA,CAAC,IAAM,EAAA,QAAA,EAAU,OAAO,CAAA;AAAA,GAC1B,CAAA;AAEA,EAAM,MAAA,eAAA,GAAkBA,kBAAY,MAAM;AACxC,IAAA,IAAI,QAAU,EAAA;AACZ,MAAM,MAAA,EAAE,OAAS,EAAA,KAAA,EAAU,GAAA,QAAA,CAAA;AAC3B,MAAS,QAAA,CAAA,KAAA,EAAO,IAAM,EAAA,KAAA,CAAM,GAAG,CAAA,CAAA;AAC/B,MAAA,UAAA,CAAW,MAAM;AAIf,QAAA,WAAA,CAAY,KAAK,CAAA,CAAA;AAAA,SAChB,EAAE,CAAA,CAAA;AAAA,KACP;AAAA,GACC,EAAA,CAAC,IAAM,EAAA,QAAQ,CAAC,CAAA,CAAA;AAEnB,EAAO,OAAA;AAAA,IACL,UAAA;AAAA,IACA,MAAQ,EAAA,YAAA;AAAA,IACR,WAAa,EAAA,iBAAA;AAAA,IACb,SAAW,EAAA,eAAA;AAAA,GACb,CAAA;AACF;;;;"}
+{"version":3,"file":"useTableColumnResize.js","sources":["../../src/column-resizing/useTableColumnResize.tsx"],"sourcesContent":["import {\n  Heading,\n  ResizePhase,\n  RuntimeColumnDescriptor\n} from \"@vuu-ui/vuu-table-types\";\nimport { RefObject, useCallback, useRef, useState } from \"react\";\n\nexport type ResizeHandler = (evt: MouseEvent, moveBy: number) => void;\nexport interface CellResizeHookProps {\n  column: RuntimeColumnDescriptor | Heading;\n  onResize?: (phase: ResizePhase, columnName: string, width?: number) => void;\n  rootRef: RefObject<HTMLDivElement>;\n}\n\nexport interface CellResizeHookResult {\n  isResizing: boolean;\n  onDrag: (evt: MouseEvent, moveBy: number, totalDistanceMoved: number) => void;\n  onDragStart: (evt: React.MouseEvent) => void;\n  onDragEnd: (evt: MouseEvent) => void;\n}\n\nexport const useTableColumnResize = ({\n  column,\n  onResize,\n  rootRef\n}: CellResizeHookProps): CellResizeHookResult => {\n  const widthRef = useRef({ start: 0, now: 0 });\n\n  const [isResizing, setResizing] = useState(false);\n  const { name } = column;\n\n  const handleResizeStart = useCallback(() => {\n    if (onResize && rootRef.current) {\n      const { current: width } = widthRef;\n      const { width: measuredWidth } = rootRef.current.getBoundingClientRect();\n      width.start = width.now = Math.round(measuredWidth);\n      setResizing(true);\n      onResize?.(\"begin\", name);\n    }\n  }, [name, onResize, rootRef]);\n\n  const handleResize = useCallback(\n    (_evt: MouseEvent, moveBy: number, totalDistanceMoved) => {\n      if (rootRef.current) {\n        if (onResize) {\n          const { current: width } = widthRef;\n          const newWidth = width.start + totalDistanceMoved;\n          if (newWidth !== width.now && newWidth > 0) {\n            onResize(\"resize\", name, newWidth);\n            width.now = newWidth;\n          }\n        }\n      }\n    },\n    [name, onResize, rootRef]\n  );\n\n  const handleResizeEnd = useCallback(() => {\n    if (onResize) {\n      const { current: width } = widthRef;\n      onResize(\"end\", name, width.now);\n      setTimeout(() => {\n        // clickHandler in HeaderCell checks isResizing before firing. Because onMouseUp\n        // fires before click, we need to delay setting isResizing back to false, just\n        // long enough that the click ghandler will have fired.\n        setResizing(false);\n      }, 80);\n    }\n  }, [name, onResize]);\n\n  return {\n    isResizing,\n    onDrag: handleResize,\n    onDragStart: handleResizeStart,\n    onDragEnd: handleResizeEnd\n  };\n};\n"],"names":["useRef","useState","useCallback"],"mappings":";;;;AAqBO,MAAM,uBAAuB,CAAC;AAAA,EACnC,MAAA;AAAA,EACA,QAAA;AAAA,EACA,OAAA;AACF,CAAiD,KAAA;AAC/C,EAAA,MAAM,WAAWA,YAAO,CAAA,EAAE,OAAO,CAAG,EAAA,GAAA,EAAK,GAAG,CAAA,CAAA;AAE5C,EAAA,MAAM,CAAC,UAAA,EAAY,WAAW,CAAA,GAAIC,eAAS,KAAK,CAAA,CAAA;AAChD,EAAM,MAAA,EAAE,MAAS,GAAA,MAAA,CAAA;AAEjB,EAAM,MAAA,iBAAA,GAAoBC,kBAAY,MAAM;AAC1C,IAAI,IAAA,QAAA,IAAY,QAAQ,OAAS,EAAA;AAC/B,MAAM,MAAA,EAAE,OAAS,EAAA,KAAA,EAAU,GAAA,QAAA,CAAA;AAC3B,MAAA,MAAM,EAAE,KAAO,EAAA,aAAA,EAAkB,GAAA,OAAA,CAAQ,QAAQ,qBAAsB,EAAA,CAAA;AACvE,MAAA,KAAA,CAAM,KAAQ,GAAA,KAAA,CAAM,GAAM,GAAA,IAAA,CAAK,MAAM,aAAa,CAAA,CAAA;AAClD,MAAA,WAAA,CAAY,IAAI,CAAA,CAAA;AAChB,MAAA,QAAA,GAAW,SAAS,IAAI,CAAA,CAAA;AAAA,KAC1B;AAAA,GACC,EAAA,CAAC,IAAM,EAAA,QAAA,EAAU,OAAO,CAAC,CAAA,CAAA;AAE5B,EAAA,MAAM,YAAe,GAAAA,iBAAA;AAAA,IACnB,CAAC,IAAkB,EAAA,MAAA,EAAgB,kBAAuB,KAAA;AACxD,MAAA,IAAI,QAAQ,OAAS,EAAA;AACnB,QAAA,IAAI,QAAU,EAAA;AACZ,UAAM,MAAA,EAAE,OAAS,EAAA,KAAA,EAAU,GAAA,QAAA,CAAA;AAC3B,UAAM,MAAA,QAAA,GAAW,MAAM,KAAQ,GAAA,kBAAA,CAAA;AAC/B,UAAA,IAAI,QAAa,KAAA,KAAA,CAAM,GAAO,IAAA,QAAA,GAAW,CAAG,EAAA;AAC1C,YAAS,QAAA,CAAA,QAAA,EAAU,MAAM,QAAQ,CAAA,CAAA;AACjC,YAAA,KAAA,CAAM,GAAM,GAAA,QAAA,CAAA;AAAA,WACd;AAAA,SACF;AAAA,OACF;AAAA,KACF;AAAA,IACA,CAAC,IAAM,EAAA,QAAA,EAAU,OAAO,CAAA;AAAA,GAC1B,CAAA;AAEA,EAAM,MAAA,eAAA,GAAkBA,kBAAY,MAAM;AACxC,IAAA,IAAI,QAAU,EAAA;AACZ,MAAM,MAAA,EAAE,OAAS,EAAA,KAAA,EAAU,GAAA,QAAA,CAAA;AAC3B,MAAS,QAAA,CAAA,KAAA,EAAO,IAAM,EAAA,KAAA,CAAM,GAAG,CAAA,CAAA;AAC/B,MAAA,UAAA,CAAW,MAAM;AAIf,QAAA,WAAA,CAAY,KAAK,CAAA,CAAA;AAAA,SAChB,EAAE,CAAA,CAAA;AAAA,KACP;AAAA,GACC,EAAA,CAAC,IAAM,EAAA,QAAQ,CAAC,CAAA,CAAA;AAEnB,EAAO,OAAA;AAAA,IACL,UAAA;AAAA,IACA,MAAQ,EAAA,YAAA;AAAA,IACR,WAAa,EAAA,iBAAA;AAAA,IACb,SAAW,EAAA,eAAA;AAAA,GACb,CAAA;AACF;;;;"}