@vuu-ui/vuu-table-extras 2.1.17 → 2.1.19-beta.1

package/cjs/column-settings-panel/ColumnNameLabel.css.js

@@ -1,6 +0,0 @@
-'use strict';
-
-var columnNameLabelCss = ".vuuColumnNameLabel-calculated {\n    cursor: pointer;\n    display: flex;\n    gap: 2px;\n}\n\n.vuuColumnNameLabel-edit {\n    margin-left: auto;\n}\n\n.vuuColumnNameLabel-placeholder {\n    color: var(--vuu-color-gray-35);\n}";
-
-module.exports = columnNameLabelCss;
-//# sourceMappingURL=ColumnNameLabel.css.js.map

package/cjs/column-settings-panel/ColumnNameLabel.css.js.map

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

package/cjs/column-settings-panel/ColumnNameLabel.js

@@ -1,45 +0,0 @@
-'use strict';
-
-var jsxRuntime = require('react/jsx-runtime');
-var cx = require('clsx');
-var styles = require('@salt-ds/styles');
-var window = require('@salt-ds/window');
-var vuuUtils = require('@vuu-ui/vuu-utils');
-var ColumnNameLabel$1 = require('./ColumnNameLabel.css.js');
-
-const classBase = "vuuColumnNameLabel";
-const ColumnNameLabel = ({ column, onClick }) => {
-  const targetWindow = window.useWindow();
-  styles.useComponentCssInjection({
-    testId: "vuu-column-label",
-    css: ColumnNameLabel$1,
-    window: targetWindow
-  });
-  if (vuuUtils.isCalculatedColumn(column.name)) {
-    const { name, serverDataType, expression } = vuuUtils.getCalculatedColumnDetails(column);
-    const displayName = name || "name";
-    const displayExpression = "=expression";
-    const nameClass = displayName === "name" ? `${classBase}-placeholder` : void 0;
-    const expressionClass = expression === "" ? `${classBase}-placeholder` : void 0;
-    return /* @__PURE__ */ jsxRuntime.jsxs(
-      "div",
-      {
-        className: cx(classBase, `${classBase}-calculated`),
-        onClick,
-        children: [
-          /* @__PURE__ */ jsxRuntime.jsx("span", { className: nameClass, children: displayName }),
-          /* @__PURE__ */ jsxRuntime.jsx("span", { children: ":" }),
-          /* @__PURE__ */ jsxRuntime.jsx("span", { children: serverDataType || "string" }),
-          /* @__PURE__ */ jsxRuntime.jsx("span", { children: ":" }),
-          /* @__PURE__ */ jsxRuntime.jsx("span", { className: expressionClass, children: displayExpression }),
-          /* @__PURE__ */ jsxRuntime.jsx("span", { className: `${classBase}-edit`, "data-icon": "edit" })
-        ]
-      }
-    );
-  } else {
-    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: classBase, children: column.name });
-  }
-};
-
-exports.ColumnNameLabel = ColumnNameLabel;
-//# sourceMappingURL=ColumnNameLabel.js.map

package/cjs/column-settings-panel/ColumnNameLabel.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ColumnNameLabel.js","sources":["../../../../packages/vuu-table-extras/src/column-settings-panel/ColumnNameLabel.tsx"],"sourcesContent":["import { ColumnDescriptor } from \"@vuu-ui/vuu-table-types\";\nimport cx from \"clsx\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport {\n  getCalculatedColumnDetails,\n  isCalculatedColumn,\n} from \"@vuu-ui/vuu-utils\";\nimport { MouseEventHandler } from \"react\";\n\nimport columnNameLabelCss from \"./ColumnNameLabel.css\";\n\nconst classBase = \"vuuColumnNameLabel\";\n\nexport interface ColumnNameLabelProps {\n  column: ColumnDescriptor;\n  onClick?: MouseEventHandler;\n}\n\nexport const ColumnNameLabel = ({ column, onClick }: ColumnNameLabelProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-column-label\",\n    css: columnNameLabelCss,\n    window: targetWindow,\n  });\n\n  if (isCalculatedColumn(column.name)) {\n    const { name, serverDataType, expression } =\n      getCalculatedColumnDetails(column);\n    const displayName = name || \"name\";\n    const displayExpression = \"=expression\";\n\n    const nameClass =\n      displayName === \"name\" ? `${classBase}-placeholder` : undefined;\n    const expressionClass =\n      expression === \"\" ? `${classBase}-placeholder` : undefined;\n    return (\n      <div\n        className={cx(classBase, `${classBase}-calculated`)}\n        onClick={onClick}\n      >\n        <span className={nameClass}>{displayName}</span>\n        <span>:</span>\n        <span>{serverDataType || \"string\"}</span>\n        <span>:</span>\n        <span className={expressionClass}>{displayExpression}</span>\n        <span className={`${classBase}-edit`} data-icon=\"edit\" />\n      </div>\n    );\n  } else {\n    return <div className={classBase}>{column.name}</div>;\n  }\n};\n"],"names":["useWindow","useComponentCssInjection","columnNameLabelCss","isCalculatedColumn","getCalculatedColumnDetails","jsxs","jsx"],"mappings":";;;;;;;;;AAYA,MAAM,SAAY,GAAA,oBAAA;AAOX,MAAM,eAAkB,GAAA,CAAC,EAAE,MAAA,EAAQ,SAAoC,KAAA;AAC5E,EAAA,MAAM,eAAeA,gBAAU,EAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,kBAAA;AAAA,IACR,GAAK,EAAAC,iBAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EAAI,IAAAC,2BAAA,CAAmB,MAAO,CAAA,IAAI,CAAG,EAAA;AACnC,IAAA,MAAM,EAAE,IAAM,EAAA,cAAA,EAAgB,UAAW,EAAA,GACvCC,oCAA2B,MAAM,CAAA;AACnC,IAAA,MAAM,cAAc,IAAQ,IAAA,MAAA;AAC5B,IAAA,MAAM,iBAAoB,GAAA,aAAA;AAE1B,IAAA,MAAM,SACJ,GAAA,WAAA,KAAgB,MAAS,GAAA,CAAA,EAAG,SAAS,CAAiB,YAAA,CAAA,GAAA,KAAA,CAAA;AACxD,IAAA,MAAM,eACJ,GAAA,UAAA,KAAe,EAAK,GAAA,CAAA,EAAG,SAAS,CAAiB,YAAA,CAAA,GAAA,KAAA,CAAA;AACnD,IACE,uBAAAC,eAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,SAAW,EAAA,EAAA,CAAG,SAAW,EAAA,CAAA,EAAG,SAAS,CAAa,WAAA,CAAA,CAAA;AAAA,QAClD,OAAA;AAAA,QAEA,QAAA,EAAA;AAAA,0BAACC,cAAA,CAAA,MAAA,EAAA,EAAK,SAAW,EAAA,SAAA,EAAY,QAAY,EAAA,WAAA,EAAA,CAAA;AAAA,0BACzCA,cAAA,CAAC,UAAK,QAAC,EAAA,GAAA,EAAA,CAAA;AAAA,0BACPA,cAAA,CAAC,MAAM,EAAA,EAAA,QAAA,EAAA,cAAA,IAAkB,QAAS,EAAA,CAAA;AAAA,0BAClCA,cAAA,CAAC,UAAK,QAAC,EAAA,GAAA,EAAA,CAAA;AAAA,0BACNA,cAAA,CAAA,MAAA,EAAA,EAAK,SAAW,EAAA,eAAA,EAAkB,QAAkB,EAAA,iBAAA,EAAA,CAAA;AAAA,yCACpD,MAAK,EAAA,EAAA,SAAA,EAAW,GAAG,SAAS,CAAA,KAAA,CAAA,EAAS,aAAU,MAAO,EAAA;AAAA;AAAA;AAAA,KACzD;AAAA,GAEG,MAAA;AACL,IAAA,uBAAQA,cAAA,CAAA,KAAA,EAAA,EAAI,SAAW,EAAA,SAAA,EAAY,iBAAO,IAAK,EAAA,CAAA;AAAA;AAEnD;;;;"}

package/cjs/column-settings-panel/ColumnSettingsPanel.css.js

@@ -1,6 +0,0 @@
-'use strict';
-
-var colunSettingsPanelCss = ".vuuColumnSettingsPanel {\n    --vuu-svg-align-left: url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 16 16\"><path d=\"M9.33333 10H2.66667C2.3 10 2 10.3 2 10.6667C2 11.0333 2.3 11.3333 2.66667 11.3333H9.33333C9.7 11.3333 10 11.0333 10 10.6667C10 10.3 9.7 10 9.33333 10ZM9.33333 4.66667H2.66667C2.3 4.66667 2 4.96667 2 5.33333C2 5.7 2.3 6 2.66667 6H9.33333C9.7 6 10 5.7 10 5.33333C10 4.96667 9.7 4.66667 9.33333 4.66667ZM2.66667 8.66667H13.3333C13.7 8.66667 14 8.36667 14 8C14 7.63333 13.7 7.33333 13.3333 7.33333H2.66667C2.3 7.33333 2 7.63333 2 8C2 8.36667 2.3 8.66667 2.66667 8.66667ZM2.66667 14H13.3333C13.7 14 14 13.7 14 13.3333C14 12.9667 13.7 12.6667 13.3333 12.6667H2.66667C2.3 12.6667 2 12.9667 2 13.3333C2 13.7 2.3 14 2.66667 14ZM2 2.66667C2 3.03333 2.3 3.33333 2.66667 3.33333H13.3333C13.7 3.33333 14 3.03333 14 2.66667C14 2.3 13.7 2 13.3333 2H2.66667C2.3 2 2 2.3 2 2.66667Z\" /></svg>');\n    --vuu-svg-align-right: url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 16 16\"><path d=\"M2.66667 14H13.3333C13.7 14 14 13.7 14 13.3333C14 12.9667 13.7 12.6667 13.3333 12.6667H2.66667C2.3 12.6667 2 12.9667 2 13.3333C2 13.7 2.3 14 2.66667 14ZM6.66667 11.3333H13.3333C13.7 11.3333 14 11.0333 14 10.6667C14 10.3 13.7 10 13.3333 10H6.66667C6.3 10 6 10.3 6 10.6667C6 11.0333 6.3 11.3333 6.66667 11.3333ZM2.66667 8.66667H13.3333C13.7 8.66667 14 8.36667 14 8C14 7.63333 13.7 7.33333 13.3333 7.33333H2.66667C2.3 7.33333 2 7.63333 2 8C2 8.36667 2.3 8.66667 2.66667 8.66667ZM6.66667 6H13.3333C13.7 6 14 5.7 14 5.33333C14 4.96667 13.7 4.66667 13.3333 4.66667H6.66667C6.3 4.66667 6 4.96667 6 5.33333C6 5.7 6.3 6 6.66667 6ZM2 2.66667C2 3.03333 2.3 3.33333 2.66667 3.33333H13.3333C13.7 3.33333 14 3.03333 14 2.66667C14 2.3 13.7 2 13.3333 2H2.66667C2.3 2 2 2.3 2 2.66667Z\" /></svg>');\n    --vuu-svg-pin-left: url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 16 16\"><path d=\"M7.33333 9.86V8.66666H13.3333C13.7 8.66666 14 8.36666 14 8C14 7.63333 13.7 7.33333 13.3333 7.33333L7.33333 7.33333V6.14C7.33333 5.84 6.97333 5.69333 6.76667 5.90666L4.90667 7.76666C4.77333 7.89999 4.77333 8.10666 4.90667 8.24L6.76667 10.1C6.97333 10.3067 7.33333 10.16 7.33333 9.86ZM2.66667 13.3333C3.03333 13.3333 3.33333 13.0333 3.33333 12.6667L3.33333 3.33333C3.33333 2.96666 3.03333 2.66666 2.66667 2.66666C2.3 2.66666 2 2.96666 2 3.33333L2 12.6667C2 13.0333 2.3 13.3333 2.66667 13.3333Z\" /></svg>');\n    --vuu-svg-pin-float: url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 16 16\"><path d=\"M6 4.66667H4.66667V6H6V4.66667ZM6 7.33333H4.66667V8.66667H6V7.33333ZM6 2C5.26 2 4.66667 2.6 4.66667 3.33333H6V2ZM8.66667 10H7.33333V11.3333H8.66667V10ZM12.6667 2V3.33333H14C14 2.6 13.4 2 12.6667 2ZM8.66667 2H7.33333V3.33333H8.66667V2ZM6 11.3333V10H4.66667C4.66667 10.7333 5.26 11.3333 6 11.3333ZM12.6667 8.66667H14V7.33333H12.6667V8.66667ZM12.6667 6H14V4.66667H12.6667V6ZM12.6667 11.3333C13.4 11.3333 14 10.7333 14 10H12.6667V11.3333ZM2.66667 4.66667C2.3 4.66667 2 4.96667 2 5.33333V12.6667C2 13.4 2.6 14 3.33333 14H10.6667C11.0333 14 11.3333 13.7 11.3333 13.3333C11.3333 12.9667 11.0333 12.6667 10.6667 12.6667H4C3.63333 12.6667 3.33333 12.3667 3.33333 12V5.33333C3.33333 4.96667 3.03333 4.66667 2.66667 4.66667ZM10 3.33333H11.3333V2H10V3.33333ZM10 11.3333H11.3333V10H10V11.3333Z\" /></svg>');\n    --vuu-svg-pin-right: url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 16 16\"><path d=\"M8.66667 6.14V7.33333H2.66667C2.3 7.33333 2 7.63333 2 8C2 8.36666 2.3 8.66666 2.66667 8.66666H8.66667V9.86C8.66667 10.16 9.02667 10.3067 9.23333 10.0933L11.0933 8.23333C11.2267 8.1 11.2267 7.89333 11.0933 7.76L9.23333 5.9C9.02667 5.69333 8.66667 5.84 8.66667 6.14ZM13.3333 13.3333C13.7 13.3333 14 13.0333 14 12.6667V3.33333C14 2.96666 13.7 2.66666 13.3333 2.66666C12.9667 2.66666 12.6667 2.96666 12.6667 3.33333V12.6667C12.6667 13.0333 12.9667 13.3333 13.3333 13.3333Z\"/></svg>');\n    --vuuDropdown-height: 24px;\n    --vuuDropdown-width: 100%;\n    \n    display: flex;\n    flex-direction: column;\n    gap: 24px;\n    height: 100%;\n}\n\n.vuuColumnSettingsPanel-header {\n  font-size: 14px;\n  font-weight: 600;\n  padding: 24px 2px 0 2px;\n}\n\n\n.vuuColumnSettingsPanel-buttonBar {\n  align-items: center;\n  display: flex;\n  justify-content: space-between;\n  margin-top: auto;\n}\n\n.vuuColumnSettingsPanel-buttonBar[data-align=\"right\"]{\n  gap: 6px;\n  justify-content: flex-end;\n}\n\n.vuuColumnSettingsPanel-buttonNavPrev {\n  --vuu-icon-left: 6px;\n  padding-left: 24px\n}\n\n.vuuColumnSettingsPanel-buttonNavNext {\n  --vuu-icon-left: calc(100% - 18px);\n  padding-right: 24px\n}\n\n\n\n[data-icon='align-left'] {\n    --vuu-icon-svg: var(--vuu-svg-align-left);\n  }\n\n  [data-icon='align-right'] {\n    --vuu-icon-svg: var(--vuu-svg-align-right);\n  }\n\n  [data-icon='pin-left'] {\n    --vuu-icon-svg: var(--vuu-svg-pin-left);\n  }\n  [data-icon='pin-float'] {\n    --vuu-icon-svg: var(--vuu-svg-pin-float);\n  }\n  [data-icon='pin-right'] {\n    --vuu-icon-svg: var(--vuu-svg-pin-right);\n  }\n\n  .vuuColumnSettingsPanel-editing .vuuColumnNameLabel-edit {\n    display: none;\n  }\n  \n\n\n  \n  \n  \n  \n  \n";
-
-module.exports = colunSettingsPanelCss;
-//# sourceMappingURL=ColumnSettingsPanel.css.js.map

package/cjs/column-settings-panel/ColumnSettingsPanel.css.js.map

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

package/cjs/column-settings-panel/ColumnSettingsPanel.js

@@ -1,161 +0,0 @@
-'use strict';
-
-var jsxRuntime = require('react/jsx-runtime');
-var core = require('@salt-ds/core');
-var styles = require('@salt-ds/styles');
-var window = require('@salt-ds/window');
-var vuuUiControls = require('@vuu-ui/vuu-ui-controls');
-var vuuUtils = require('@vuu-ui/vuu-utils');
-var ColumnFormattingPanel = require('../column-formatting-settings/ColumnFormattingPanel.js');
-require('react');
-var ColumnNameLabel = require('./ColumnNameLabel.js');
-var useColumnSettings = require('./useColumnSettings.js');
-var ColumnSettingsPanel$1 = require('./ColumnSettingsPanel.css.js');
-
-const classBase = "vuuColumnSettingsPanel";
-const getColumnLabel = (column) => {
-  const { name, label } = column;
-  if (vuuUtils.isCalculatedColumn(name)) {
-    return label ?? vuuUtils.getCalculatedColumnDetails(column).name;
-  } else {
-    return label ?? name;
-  }
-};
-const ColumnSettingsPanel = ({
-  column: columnProp,
-  columnModel,
-  onClickEditCalculatedColumn,
-  onConfigChange
-}) => {
-  const targetWindow = window.useWindow();
-  styles.useComponentCssInjection({
-    testId: "vuu-column-settings-panel",
-    css: ColumnSettingsPanel$1,
-    window: targetWindow
-  });
-  const isNewCalculatedColumn = columnProp.name === "::";
-  const {
-    availableRenderers,
-    column,
-    navigateNextColumn,
-    navigatePrevColumn,
-    onChange,
-    onChangeFormatting,
-    onChangeRendering,
-    onChangeToggleButton,
-    onChangeType,
-    onInputCommit
-  } = useColumnSettings.useColumnSettings({
-    column: columnProp,
-    columnModel,
-    onConfigChange
-  });
-  const {
-    serverDataType,
-    align = vuuUtils.getDefaultAlignment(serverDataType),
-    pin,
-    width = ""
-  } = column;
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: classBase, children: [
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: `${classBase}-header`, children: /* @__PURE__ */ jsxRuntime.jsx(
-      ColumnNameLabel.ColumnNameLabel,
-      {
-        column,
-        onClick: onClickEditCalculatedColumn
-      }
-    ) }),
-    /* @__PURE__ */ jsxRuntime.jsxs(core.FormField, { "data-field": "column-label", children: [
-      /* @__PURE__ */ jsxRuntime.jsx(core.FormFieldLabel, { children: "Column Label" }),
-      /* @__PURE__ */ jsxRuntime.jsx(
-        vuuUiControls.VuuInput,
-        {
-          bordered: true,
-          className: "vuuInput",
-          "data-embedded": true,
-          onChange,
-          onCommit: onInputCommit,
-          value: getColumnLabel(column)
-        }
-      )
-    ] }),
-    /* @__PURE__ */ jsxRuntime.jsxs(core.FormField, { "data-field": "column-width", children: [
-      /* @__PURE__ */ jsxRuntime.jsx(core.FormFieldLabel, { children: "Column Width" }),
-      /* @__PURE__ */ jsxRuntime.jsx(
-        vuuUiControls.VuuInput,
-        {
-          bordered: true,
-          className: "vuuInput",
-          "data-embedded": true,
-          onChange,
-          value: width,
-          onCommit: onInputCommit
-        }
-      )
-    ] }),
-    /* @__PURE__ */ jsxRuntime.jsxs(core.FormField, { "data-field": "column-alignment", children: [
-      /* @__PURE__ */ jsxRuntime.jsx(core.FormFieldLabel, { children: "Alignment" }),
-      /* @__PURE__ */ jsxRuntime.jsxs(core.ToggleButtonGroup, { onChange: onChangeToggleButton, value: align, children: [
-        /* @__PURE__ */ jsxRuntime.jsx(core.ToggleButton, { value: "left", children: /* @__PURE__ */ jsxRuntime.jsx(vuuUiControls.Icon, { name: "align-left", size: 16 }) }),
-        /* @__PURE__ */ jsxRuntime.jsx(core.ToggleButton, { value: "right", children: /* @__PURE__ */ jsxRuntime.jsx(vuuUiControls.Icon, { name: "align-right", size: 16 }) })
-      ] })
-    ] }),
-    /* @__PURE__ */ jsxRuntime.jsxs(core.FormField, { "data-field": "column-pin", children: [
-      /* @__PURE__ */ jsxRuntime.jsx(core.FormFieldLabel, { children: "Pin Column" }),
-      /* @__PURE__ */ jsxRuntime.jsxs(
-        core.ToggleButtonGroup,
-        {
-          onChange: onChangeToggleButton,
-          value: pin || "false",
-          children: [
-            /* @__PURE__ */ jsxRuntime.jsx(core.ToggleButton, { value: "left", children: /* @__PURE__ */ jsxRuntime.jsx(vuuUiControls.Icon, { name: "pin-left", size: 16 }) }),
-            /* @__PURE__ */ jsxRuntime.jsx(core.ToggleButton, { value: "floating", children: /* @__PURE__ */ jsxRuntime.jsx(vuuUiControls.Icon, { name: "pin-float", size: 16 }) }),
-            /* @__PURE__ */ jsxRuntime.jsx(core.ToggleButton, { value: "right", children: /* @__PURE__ */ jsxRuntime.jsx(vuuUiControls.Icon, { name: "pin-right", size: 16 }) }),
-            /* @__PURE__ */ jsxRuntime.jsx(core.ToggleButton, { value: "", children: /* @__PURE__ */ jsxRuntime.jsx(vuuUiControls.Icon, { name: "cross-circle", size: 16 }) })
-          ]
-        }
-      )
-    ] }),
-    /* @__PURE__ */ jsxRuntime.jsx(
-      ColumnFormattingPanel.ColumnFormattingPanel,
-      {
-        availableRenderers,
-        column,
-        onChangeFormatting,
-        onChangeRendering,
-        onChangeColumnType: onChangeType
-      }
-    ),
-    /* @__PURE__ */ jsxRuntime.jsxs(
-      "div",
-      {
-        className: `${classBase}-buttonBar`,
-        "data-align": isNewCalculatedColumn ? "right" : void 0,
-        children: [
-          /* @__PURE__ */ jsxRuntime.jsx(
-            core.Button,
-            {
-              className: `${classBase}-buttonNavPrev`,
-              variant: "secondary",
-              "data-icon": "arrow-left",
-              onClick: navigatePrevColumn,
-              children: "PREVIOUS"
-            }
-          ),
-          /* @__PURE__ */ jsxRuntime.jsx(
-            core.Button,
-            {
-              className: `${classBase}-buttonNavNext`,
-              variant: "secondary",
-              "data-icon": "arrow-right",
-              onClick: navigateNextColumn,
-              children: "NEXT"
-            }
-          )
-        ]
-      }
-    )
-  ] });
-};
-
-exports.ColumnSettingsPanel = ColumnSettingsPanel;
-//# sourceMappingURL=ColumnSettingsPanel.js.map

package/cjs/column-settings-panel/ColumnSettingsPanel.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ColumnSettingsPanel.js","sources":["../../../../packages/vuu-table-extras/src/column-settings-panel/ColumnSettingsPanel.tsx"],"sourcesContent":["import {\n  Button,\n  FormField,\n  FormFieldLabel,\n  ToggleButton,\n  ToggleButtonGroup,\n} from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { ColumnDescriptor } from \"@vuu-ui/vuu-table-types\";\nimport { Icon, VuuInput } from \"@vuu-ui/vuu-ui-controls\";\nimport {\n  getCalculatedColumnDetails,\n  getDefaultAlignment,\n  isCalculatedColumn,\n} from \"@vuu-ui/vuu-utils\";\nimport { ColumnFormattingPanel } from \"../column-formatting-settings\";\nimport { ColumnNameLabel } from \"./ColumnNameLabel\";\nimport { ColumnSettingsProps, useColumnSettings } from \"./useColumnSettings\";\n\nimport colunSettingsPanelCss from \"./ColumnSettingsPanel.css\";\n\nconst classBase = \"vuuColumnSettingsPanel\";\n\nconst getColumnLabel = (column: ColumnDescriptor) => {\n  const { name, label } = column;\n  if (isCalculatedColumn(name)) {\n    return label ?? getCalculatedColumnDetails(column).name;\n  } else {\n    return label ?? name;\n  }\n};\n\nexport interface ColumnSettinsPanelProps extends ColumnSettingsProps {\n  onClickEditCalculatedColumn?: () => void;\n}\n\nexport const ColumnSettingsPanel = ({\n  column: columnProp,\n  columnModel,\n  onClickEditCalculatedColumn,\n  onConfigChange,\n}: ColumnSettinsPanelProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-column-settings-panel\",\n    css: colunSettingsPanelCss,\n    window: targetWindow,\n  });\n\n  const isNewCalculatedColumn = columnProp.name === \"::\";\n  const {\n    availableRenderers,\n    column,\n    navigateNextColumn,\n    navigatePrevColumn,\n    onChange,\n    onChangeFormatting,\n    onChangeRendering,\n    onChangeToggleButton,\n    onChangeType,\n    onInputCommit,\n  } = useColumnSettings({\n    column: columnProp,\n    columnModel,\n    onConfigChange,\n  });\n\n  const {\n    serverDataType,\n    align = getDefaultAlignment(serverDataType),\n    pin,\n    width = \"\",\n  } = column;\n\n  return (\n    <div className={classBase}>\n      <div className={`${classBase}-header`}>\n        <ColumnNameLabel\n          column={column}\n          onClick={onClickEditCalculatedColumn}\n        />\n      </div>\n\n      <FormField data-field=\"column-label\">\n        <FormFieldLabel>Column Label</FormFieldLabel>\n        <VuuInput\n          bordered\n          className=\"vuuInput\"\n          data-embedded\n          onChange={onChange}\n          onCommit={onInputCommit}\n          value={getColumnLabel(column)}\n        />\n      </FormField>\n\n      <FormField data-field=\"column-width\">\n        <FormFieldLabel>Column Width</FormFieldLabel>\n        <VuuInput\n          bordered\n          className=\"vuuInput\"\n          data-embedded\n          onChange={onChange}\n          value={width}\n          onCommit={onInputCommit}\n        />\n      </FormField>\n      <FormField data-field=\"column-alignment\">\n        <FormFieldLabel>Alignment</FormFieldLabel>\n        <ToggleButtonGroup onChange={onChangeToggleButton} value={align}>\n          <ToggleButton value=\"left\">\n            <Icon name=\"align-left\" size={16} />\n          </ToggleButton>\n          <ToggleButton value=\"right\">\n            <Icon name=\"align-right\" size={16} />\n          </ToggleButton>\n        </ToggleButtonGroup>\n      </FormField>\n      <FormField data-field=\"column-pin\">\n        <FormFieldLabel>Pin Column</FormFieldLabel>\n        <ToggleButtonGroup\n          onChange={onChangeToggleButton}\n          value={pin || \"false\"}\n        >\n          <ToggleButton value=\"left\">\n            <Icon name=\"pin-left\" size={16} />\n          </ToggleButton>\n          <ToggleButton value=\"floating\">\n            <Icon name=\"pin-float\" size={16} />\n          </ToggleButton>\n          <ToggleButton value=\"right\">\n            <Icon name=\"pin-right\" size={16} />\n          </ToggleButton>\n          <ToggleButton value=\"\">\n            <Icon name=\"cross-circle\" size={16} />\n          </ToggleButton>\n        </ToggleButtonGroup>\n      </FormField>\n      <ColumnFormattingPanel\n        availableRenderers={availableRenderers}\n        column={column}\n        onChangeFormatting={onChangeFormatting}\n        onChangeRendering={onChangeRendering}\n        onChangeColumnType={onChangeType}\n      />\n\n      <div\n        className={`${classBase}-buttonBar`}\n        data-align={isNewCalculatedColumn ? \"right\" : undefined}\n      >\n        <Button\n          className={`${classBase}-buttonNavPrev`}\n          variant=\"secondary\"\n          data-icon=\"arrow-left\"\n          onClick={navigatePrevColumn}\n        >\n          PREVIOUS\n        </Button>\n        <Button\n          className={`${classBase}-buttonNavNext`}\n          variant=\"secondary\"\n          data-icon=\"arrow-right\"\n          onClick={navigateNextColumn}\n        >\n          NEXT\n        </Button>\n      </div>\n    </div>\n  );\n};\n"],"names":["isCalculatedColumn","getCalculatedColumnDetails","useWindow","useComponentCssInjection","colunSettingsPanelCss","useColumnSettings","getDefaultAlignment","jsxs","jsx","ColumnNameLabel","FormField","FormFieldLabel","VuuInput","ToggleButtonGroup","ToggleButton","Icon","ColumnFormattingPanel","Button"],"mappings":"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"}

package/cjs/column-settings-panel/useColumnSettings.js

@@ -1,203 +0,0 @@
-'use strict';
-
-var vuuUtils = require('@vuu-ui/vuu-utils');
-var react = require('react');
-
-const integerCellRenderers = [
-  {
-    description: "Default formatter for columns with data type integer",
-    label: "Default Renderer (int, long)",
-    name: "default-int"
-  }
-];
-const doubleCellRenderers = [
-  {
-    description: "Default formatter for columns with data type double",
-    label: "Default Renderer (double)",
-    name: "default-double"
-  }
-];
-const decimalCellRenderers = [
-  {
-    description: "Default formatter for columns with data type decimal (2,4,6 or 8)",
-    label: "Default Renderer (decimal)",
-    name: "default-decimal"
-  }
-];
-const stringCellRenderers = [
-  {
-    description: "Default formatter for columns with data type string",
-    label: "Default Renderer (string)",
-    name: "default-string"
-  }
-];
-const booleanCellRenderers = [];
-const getAvailableCellRenderers = (column) => {
-  const serverDataType = vuuUtils.getServerDataType(column);
-  switch (serverDataType) {
-    case "char":
-    case "string":
-      return stringCellRenderers.concat(vuuUtils.getRegisteredCellRenderers("string"));
-    case "int":
-    case "long":
-      return integerCellRenderers.concat(vuuUtils.getRegisteredCellRenderers("int"));
-    case "double":
-      return doubleCellRenderers.concat(
-        vuuUtils.getRegisteredCellRenderers(column.serverDataType)
-      );
-    case "scaleddecimal2":
-    case "scaleddecimal4":
-    case "scaleddecimal6":
-    case "scaleddecimal8":
-      return decimalCellRenderers.concat(
-        vuuUtils.getRegisteredCellRenderers(column.serverDataType)
-      );
-    case "boolean":
-      return booleanCellRenderers.concat(vuuUtils.getRegisteredCellRenderers("boolean"));
-    default:
-      return stringCellRenderers;
-  }
-};
-const useColumnSettings = ({
-  column: columnProp,
-  columnModel
-}) => {
-  const [column, setColumn] = react.useState(
-    columnModel.getColumn(columnProp.name)
-  );
-  react.useEffect(() => {
-    setColumn(columnProp);
-  }, [columnProp]);
-  const availableRenderers = react.useMemo(() => {
-    return getAvailableCellRenderers(column);
-  }, [column]);
-  const handleChangeToggleButton = react.useCallback(
-    (evt) => {
-      const button = vuuUtils.queryClosest(evt.target, "button");
-      if (button) {
-        const fieldName = vuuUtils.getFieldName(button);
-        const { value } = button;
-        switch (fieldName) {
-          case "column-alignment":
-            if (vuuUtils.isValidColumnAlignment(value)) {
-              const newColumn = {
-                ...column,
-                align: value
-              };
-              setColumn(newColumn);
-              columnModel.updateColumn(newColumn);
-            }
-            break;
-          case "column-pin":
-            if (vuuUtils.isValidPinLocation(value)) {
-              const newColumn = {
-                ...column,
-                pin: value || void 0
-              };
-              setColumn(newColumn);
-              columnModel.updateColumn(newColumn);
-              break;
-            }
-        }
-      }
-    },
-    [column, columnModel]
-  );
-  const handleChange = react.useCallback((evt) => {
-    const input = evt.target;
-    const fieldName = vuuUtils.getFieldName(input);
-    const { value } = input;
-    switch (fieldName) {
-      case "column-label":
-        setColumn((state) => ({ ...state, label: value }));
-        break;
-      case "column-name":
-        setColumn((state) => vuuUtils.setCalculatedColumnName(state, value));
-        break;
-      case "column-width":
-        {
-          const numericValue = parseInt(value, 10);
-          if (isNaN(numericValue)) {
-            setColumn((state) => ({ ...state, width: void 0 }));
-          } else {
-            setColumn((state) => ({ ...state, width: numericValue }));
-          }
-        }
-        break;
-    }
-  }, []);
-  const handleInputCommit = react.useCallback(() => {
-    columnModel.updateColumn(column);
-  }, [column, columnModel]);
-  const handleChangeCalculatedColumnName = react.useCallback((name) => {
-    setColumn((state) => ({ ...state, name }));
-  }, []);
-  const handleChangeRendering = react.useCallback(
-    (renderProps) => {
-      if (renderProps) {
-        const newColumn = vuuUtils.updateColumnRenderProps(
-          column,
-          renderProps
-        );
-        setColumn(newColumn);
-        columnModel.updateColumn(newColumn);
-      }
-    },
-    [column, columnModel]
-  );
-  const handleChangeFormatting = react.useCallback(
-    (formatting) => {
-      const newColumn = vuuUtils.updateColumnFormatting(column, formatting);
-      setColumn(newColumn);
-      columnModel.updateColumn(newColumn);
-    },
-    [column, columnModel]
-  );
-  const handleChangeType = react.useCallback(
-    (type) => {
-      const updatedColumn = vuuUtils.updateColumnType(column, type);
-      setColumn(updatedColumn);
-      columnModel.updateColumn(updatedColumn);
-    },
-    [column, columnModel]
-  );
-  const handleChangeServerDataType = react.useCallback(
-    (serverDataType) => {
-      setColumn((col) => ({ ...col, serverDataType }));
-    },
-    []
-  );
-  const navigateColumn = react.useCallback(
-    ({ moveBy }) => {
-      const index = columnModel.selectedColumns.indexOf(column) + moveBy;
-      const newColumn = columnModel.selectedColumns[index];
-      if (newColumn) {
-        setColumn(newColumn);
-      }
-    },
-    [column, columnModel]
-  );
-  const navigateNextColumn = react.useCallback(() => {
-    navigateColumn({ moveBy: 1 });
-  }, [navigateColumn]);
-  const navigatePrevColumn = react.useCallback(() => {
-    navigateColumn({ moveBy: -1 });
-  }, [navigateColumn]);
-  return {
-    availableRenderers,
-    column,
-    navigateNextColumn,
-    navigatePrevColumn,
-    onChange: handleChange,
-    onChangeCalculatedColumnName: handleChangeCalculatedColumnName,
-    onChangeFormatting: handleChangeFormatting,
-    onChangeRendering: handleChangeRendering,
-    onChangeServerDataType: handleChangeServerDataType,
-    onChangeToggleButton: handleChangeToggleButton,
-    onChangeType: handleChangeType,
-    onInputCommit: handleInputCommit
-  };
-};
-
-exports.useColumnSettings = useColumnSettings;
-//# sourceMappingURL=useColumnSettings.js.map

package/cjs/column-settings-panel/useColumnSettings.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"useColumnSettings.js","sources":["../../../../packages/vuu-table-extras/src/column-settings-panel/useColumnSettings.ts"],"sourcesContent":["import {\n  ColumnDescriptor,\n  TableConfig,\n  ColumnTypeFormatting,\n} from \"@vuu-ui/vuu-table-types\";\n\nimport {\n  CellRendererDescriptor,\n  ColumnRenderPropsChangeHandler,\n  getFieldName,\n  getRegisteredCellRenderers,\n  isValidColumnAlignment,\n  isValidPinLocation,\n  setCalculatedColumnName,\n  updateColumnRenderProps,\n  updateColumnFormatting,\n  updateColumnType,\n  queryClosest,\n  getServerDataType,\n} from \"@vuu-ui/vuu-utils\";\nimport { VuuColumnDataType, VuuTable } from \"@vuu-ui/vuu-protocol-types\";\nimport {\n  FormEventHandler,\n  useCallback,\n  useEffect,\n  useMemo,\n  useState,\n} from \"react\";\nimport { DataValueTypeSimple } from \"@vuu-ui/vuu-data-types\";\nimport { ColumnModel } from \"../column-picker/ColumnModel\";\n\n/**\n * Describes the props for a Column Configuration Editor, for which\n * an implementation is provided in vuu-table-extras\n */\nexport interface ColumnSettingsProps {\n  column: ColumnDescriptor;\n  columnModel: ColumnModel;\n  onConfigChange?: (config: TableConfig) => void;\n  vuuTable?: VuuTable;\n}\n\nconst integerCellRenderers: CellRendererDescriptor[] = [\n  {\n    description: \"Default formatter for columns with data type integer\",\n    label: \"Default Renderer (int, long)\",\n    name: \"default-int\",\n  },\n];\nconst doubleCellRenderers: CellRendererDescriptor[] = [\n  {\n    description: \"Default formatter for columns with data type double\",\n    label: \"Default Renderer (double)\",\n    name: \"default-double\",\n  },\n];\nconst decimalCellRenderers: CellRendererDescriptor[] = [\n  {\n    description:\n      \"Default formatter for columns with data type decimal (2,4,6 or 8)\",\n    label: \"Default Renderer (decimal)\",\n    name: \"default-decimal\",\n  },\n];\n\nconst stringCellRenderers: CellRendererDescriptor[] = [\n  {\n    description: \"Default formatter for columns with data type string\",\n    label: \"Default Renderer (string)\",\n    name: \"default-string\",\n  },\n];\n\nconst booleanCellRenderers: CellRendererDescriptor[] = [];\n\nconst getAvailableCellRenderers = (\n  column: ColumnDescriptor,\n): CellRendererDescriptor[] => {\n  const serverDataType = getServerDataType(column);\n  switch (serverDataType) {\n    case \"char\":\n    case \"string\":\n      return stringCellRenderers.concat(getRegisteredCellRenderers(\"string\"));\n    case \"int\":\n    case \"long\":\n      return integerCellRenderers.concat(getRegisteredCellRenderers(\"int\"));\n    case \"double\":\n      return doubleCellRenderers.concat(\n        getRegisteredCellRenderers(column.serverDataType),\n      );\n    case \"scaleddecimal2\":\n    case \"scaleddecimal4\":\n    case \"scaleddecimal6\":\n    case \"scaleddecimal8\":\n      return decimalCellRenderers.concat(\n        getRegisteredCellRenderers(column.serverDataType),\n      );\n    case \"boolean\":\n      return booleanCellRenderers.concat(getRegisteredCellRenderers(\"boolean\"));\n    default:\n      return stringCellRenderers;\n  }\n};\n\nexport const useColumnSettings = ({\n  column: columnProp,\n  columnModel,\n}: Omit<ColumnSettingsProps, \"vuuTable\">) => {\n  const [column, setColumn] = useState<ColumnDescriptor>(\n    columnModel.getColumn(columnProp.name),\n  );\n\n  useEffect(() => {\n    setColumn(columnProp);\n  }, [columnProp]);\n\n  const availableRenderers = useMemo(() => {\n    return getAvailableCellRenderers(column);\n  }, [column]);\n\n  const handleChangeToggleButton = useCallback<FormEventHandler>(\n    (evt) => {\n      const button = queryClosest<HTMLButtonElement>(evt.target, \"button\");\n      if (button) {\n        const fieldName = getFieldName(button);\n        const { value } = button;\n        switch (fieldName) {\n          case \"column-alignment\":\n            if (isValidColumnAlignment(value)) {\n              const newColumn: ColumnDescriptor = {\n                ...column,\n                align: value,\n              };\n              setColumn(newColumn);\n              columnModel.updateColumn(newColumn);\n            }\n            break;\n          case \"column-pin\":\n            if (isValidPinLocation(value)) {\n              const newColumn: ColumnDescriptor = {\n                ...column,\n                pin: value || undefined,\n              };\n              setColumn(newColumn);\n              columnModel.updateColumn(newColumn);\n\n              break;\n            }\n        }\n      }\n    },\n    [column, columnModel],\n  );\n\n  const handleChange = useCallback<FormEventHandler>((evt) => {\n    const input = evt.target as HTMLInputElement;\n    const fieldName = getFieldName(input);\n    const { value } = input;\n    switch (fieldName) {\n      case \"column-label\":\n        setColumn((state) => ({ ...state, label: value }));\n        break;\n      case \"column-name\":\n        setColumn((state) => setCalculatedColumnName(state, value));\n        break;\n      case \"column-width\":\n        {\n          const numericValue = parseInt(value, 10);\n          if (isNaN(numericValue)) {\n            setColumn((state) => ({ ...state, width: undefined }));\n          } else {\n            setColumn((state) => ({ ...state, width: numericValue }));\n          }\n        }\n        break;\n    }\n  }, []);\n\n  const handleInputCommit = useCallback(() => {\n    columnModel.updateColumn(column);\n  }, [column, columnModel]);\n\n  const handleChangeCalculatedColumnName = useCallback((name: string) => {\n    setColumn((state) => ({ ...state, name }));\n  }, []);\n\n  const handleChangeRendering = useCallback<ColumnRenderPropsChangeHandler>(\n    (renderProps) => {\n      if (renderProps) {\n        const newColumn: ColumnDescriptor = updateColumnRenderProps(\n          column,\n          renderProps,\n        );\n        setColumn(newColumn);\n        columnModel.updateColumn(newColumn);\n      }\n    },\n    [column, columnModel],\n  );\n\n  const handleChangeFormatting = useCallback(\n    (formatting: ColumnTypeFormatting) => {\n      const newColumn = updateColumnFormatting(column, formatting);\n      setColumn(newColumn);\n      columnModel.updateColumn(newColumn);\n    },\n    [column, columnModel],\n  );\n\n  const handleChangeType = useCallback(\n    (type: DataValueTypeSimple) => {\n      const updatedColumn = updateColumnType(column, type);\n      setColumn(updatedColumn);\n      columnModel.updateColumn(updatedColumn);\n    },\n    [column, columnModel],\n  );\n\n  // Changing the server data type applies only to calculated columns\n  const handleChangeServerDataType = useCallback(\n    (serverDataType: VuuColumnDataType) => {\n      setColumn((col) => ({ ...col, serverDataType }));\n    },\n    [],\n  );\n\n  const navigateColumn = useCallback(\n    ({ moveBy }: { moveBy: number }) => {\n      const index = columnModel.selectedColumns.indexOf(column) + moveBy;\n      const newColumn = columnModel.selectedColumns[index];\n      if (newColumn) {\n        setColumn(newColumn);\n      }\n    },\n    [column, columnModel],\n  );\n  const navigateNextColumn = useCallback(() => {\n    navigateColumn({ moveBy: 1 });\n  }, [navigateColumn]);\n\n  const navigatePrevColumn = useCallback(() => {\n    navigateColumn({ moveBy: -1 });\n  }, [navigateColumn]);\n\n  return {\n    availableRenderers,\n    column,\n    navigateNextColumn,\n    navigatePrevColumn,\n    onChange: handleChange,\n    onChangeCalculatedColumnName: handleChangeCalculatedColumnName,\n    onChangeFormatting: handleChangeFormatting,\n    onChangeRendering: handleChangeRendering,\n    onChangeServerDataType: handleChangeServerDataType,\n    onChangeToggleButton: handleChangeToggleButton,\n    onChangeType: handleChangeType,\n    onInputCommit: handleInputCommit,\n  };\n};\n"],"names":["getServerDataType","getRegisteredCellRenderers","useState","useEffect","useMemo","useCallback","queryClosest","getFieldName","isValidColumnAlignment","isValidPinLocation","setCalculatedColumnName","updateColumnRenderProps","updateColumnFormatting","updateColumnType"],"mappings":"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"}

package/cjs/datasource-stats/DatasourceStats.css.js

@@ -1,6 +0,0 @@
-'use strict';
-
-var dataSourceStats = ".vuuDatasourceStats {\n  --datasourceStats-background: var(--vuuDatasourceStats-background);\n  align-items: center;\n  background: var(--datasourceStats-background, var(--salt-container-secondary-background));\n  display: grid;\n  font-size: var(--vuuDatasourceStats-fontSize, 10px);\n  gap: var(--vuuDatasourceStats-gap, var(--salt-spacing-100));\n  grid-template-areas: \"panel-start panel-center panel-end\";\n  grid-template-columns: 1fr 1fr 1fr;\n  grid-template-rows: auto;\n  height: var(--vuuDatasourceStats-height, 100%);\n  padding: 0 var(--salt-spacing-200);\n\n  &.vuuDatasourceStats-withSelection {\n    --datasourceStats-background: var(--vuuDatasourceStats-withSelection-background, var(--vuuDatasourceStats-background));\n  }\n\n  .vuuDatasourceStats-statsPanel {\n    align-items: center;\n    display: flex;\n    gap: var(--salt-spacing-100);\n    width: fit-content;\n  }\n\n  .vuuDatasourceStats-rowStats {\n    justify-self: flex-start;\n    grid-area: panel-start;\n  }\n  .vuuDatasourceStats-selected {\n    margin-left: var(--salt-spacing-100);\n  }\n\n  .vuuDatasourceStats-range {\n    white-space: nowrap;\n  }\n\n  .vuuDatasourceStats-label {\n    color: var(--salt-content-secondary-foreground);\n    white-space: nowrap;\n  }\n  .vuuDatasourceStats-range {\n    white-space: nowrap;\n  }\n\n  .vuuDatasourceStats-value {\n    color: var(--salt-content-primary-foreground);\n  }\n  .vuuDatasourceStats-tooltray {\n    justify-self: end;;\n    margin: 0 var(--salt-spacing-200);\n    grid-area: panel-end;\n  }\n\n}\n\n";
-
-module.exports = dataSourceStats;
-//# sourceMappingURL=DatasourceStats.css.js.map

package/cjs/datasource-stats/DatasourceStats.css.js.map

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

package/cjs/datasource-stats/DatasourceStats.js

@@ -1,76 +0,0 @@
-'use strict';
-
-var jsxRuntime = require('react/jsx-runtime');
-var cx = require('clsx');
-var styles = require('@salt-ds/styles');
-var window = require('@salt-ds/window');
-var useDatasourceStats = require('./useDatasourceStats.js');
-var DatasourceStats = require('./DatasourceStats.css.js');
-
-const classBase = "vuuDatasourceStats";
-const numberFormatter = new Intl.NumberFormat();
-const DataSourceStats = ({
-  children,
-  className,
-  dataSource,
-  showRowStats = true,
-  tooltrayActions,
-  ...htmlAttributes
-}) => {
-  const targetWindow = window.useWindow();
-  styles.useComponentCssInjection({
-    testId: "vuu-datasource-stats",
-    css: DatasourceStats,
-    window: targetWindow
-  });
-  const { range, selectedCount, size } = useDatasourceStats.useDatasourceStats({
-    dataSource,
-    showRowStats
-  });
-  const from = numberFormatter.format(range.from + 1);
-  const to = numberFormatter.format(Math.min(range.to, size));
-  const value = numberFormatter.format(size);
-  if (size === 0) {
-    return /* @__PURE__ */ jsxRuntime.jsx("div", { ...htmlAttributes, className: cx(classBase, className), children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: `${classBase}-label`, children: "No Rows to display" }) });
-  } else {
-    return /* @__PURE__ */ jsxRuntime.jsxs(
-      "div",
-      {
-        ...htmlAttributes,
-        className: cx(classBase, className, {
-          [`${classBase}-withSelection`]: selectedCount > 0
-        }),
-        children: [
-          showRowStats ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `${classBase}-statsPanel ${classBase}-rowStats`, children: [
-            /* @__PURE__ */ jsxRuntime.jsx("span", { className: `${classBase}-label`, children: "Row count" }),
-            /* @__PURE__ */ jsxRuntime.jsxs("span", { className: `${classBase}-range`, children: [
-              /* @__PURE__ */ jsxRuntime.jsx("span", { className: `${classBase}-value`, children: from }),
-              /* @__PURE__ */ jsxRuntime.jsx("span", { className: `${classBase}-label`, children: "-" }),
-              /* @__PURE__ */ jsxRuntime.jsx("span", { className: `${classBase}-value`, children: to })
-            ] }),
-            /* @__PURE__ */ jsxRuntime.jsx("span", { className: `${classBase}-label`, children: "of" }),
-            /* @__PURE__ */ jsxRuntime.jsx("span", { className: `${classBase}-value`, children: value }),
-            selectedCount > 0 ? /* @__PURE__ */ jsxRuntime.jsx(
-              "span",
-              {
-                className: cx(`${classBase}-label`, `${classBase}-selected`),
-                children: `${selectedCount.toLocaleString()} selected`
-              }
-            ) : null
-          ] }) : null,
-          selectedCount > 0 ? /* @__PURE__ */ jsxRuntime.jsx(
-            "div",
-            {
-              className: `${classBase}-statsPanel ${classBase}-selectionActions`,
-              children
-            }
-          ) : null,
-          tooltrayActions ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: `${classBase}-statsPanel ${classBase}-tooltray`, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: `${classBase}-actions`, children: tooltrayActions }) }) : null
-        ]
-      }
-    );
-  }
-};
-
-exports.DataSourceStats = DataSourceStats;
-//# sourceMappingURL=DatasourceStats.js.map

package/cjs/datasource-stats/DatasourceStats.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"DatasourceStats.js","sources":["../../../../packages/vuu-table-extras/src/datasource-stats/DatasourceStats.tsx"],"sourcesContent":["import cx from \"clsx\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { HTMLAttributes, ReactNode } from \"react\";\nimport {\n  DatasourceStatsHookProps,\n  useDatasourceStats,\n} from \"./useDatasourceStats\";\n\nimport dataSourceStats from \"./DatasourceStats.css\";\n\nexport type ItemLabel =\n  | string\n  | {\n      singlular: string;\n      plural: string;\n    };\n\nexport interface DataSourceStatsProps\n  extends DatasourceStatsHookProps,\n    Omit<HTMLAttributes<HTMLDivElement>, \"children\"> {\n  /**\n   * children will be displayed when selection present. Intended\n   * use case is display of action button(s) that will operate on\n   * selected rows.\n   */\n  children?: ReactNode;\n  selectionActions?: ReactNode;\n  tooltrayActions?: ReactNode;\n}\n\nconst classBase = \"vuuDatasourceStats\";\n\nconst numberFormatter = new Intl.NumberFormat();\n\nexport const DataSourceStats = ({\n  children,\n  className,\n  dataSource,\n  showRowStats = true,\n  tooltrayActions,\n  ...htmlAttributes\n}: DataSourceStatsProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-datasource-stats\",\n    css: dataSourceStats,\n    window: targetWindow,\n  });\n\n  const { range, selectedCount, size } = useDatasourceStats({\n    dataSource,\n    showRowStats,\n  });\n\n  const from = numberFormatter.format(range.from + 1);\n  const to = numberFormatter.format(Math.min(range.to, size));\n  const value = numberFormatter.format(size);\n\n  if (size === 0) {\n    return (\n      <div {...htmlAttributes} className={cx(classBase, className)}>\n        <span className={`${classBase}-label`}>No Rows to display</span>\n      </div>\n    );\n  } else {\n    return (\n      <div\n        {...htmlAttributes}\n        className={cx(classBase, className, {\n          [`${classBase}-withSelection`]: selectedCount > 0,\n        })}\n      >\n        {showRowStats ? (\n          <div className={`${classBase}-statsPanel ${classBase}-rowStats`}>\n            <span className={`${classBase}-label`}>Row count</span>\n            <span className={`${classBase}-range`}>\n              <span className={`${classBase}-value`}>{from}</span>\n              <span className={`${classBase}-label`}>-</span>\n              <span className={`${classBase}-value`}>{to}</span>\n            </span>\n            <span className={`${classBase}-label`}>of</span>\n            <span className={`${classBase}-value`}>{value}</span>\n            {selectedCount > 0 ? (\n              <span\n                className={cx(`${classBase}-label`, `${classBase}-selected`)}\n              >{`${selectedCount.toLocaleString()} selected`}</span>\n            ) : null}\n          </div>\n        ) : null}\n        {selectedCount > 0 ? (\n          <div\n            className={`${classBase}-statsPanel ${classBase}-selectionActions`}\n          >\n            {children}\n          </div>\n        ) : null}\n        {tooltrayActions ? (\n          <div className={`${classBase}-statsPanel ${classBase}-tooltray`}>\n            <span className={`${classBase}-actions`}>{tooltrayActions}</span>\n          </div>\n        ) : null}\n      </div>\n    );\n  }\n};\n"],"names":["useWindow","useComponentCssInjection","dataSourceStats","useDatasourceStats","jsx","jsxs"],"mappings":"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"}