npm - @vuu-ui/vuu-table-extras - Versions diffs - 0.13.113 → 0.13.115-alpha.1 - Mend

@vuu-ui/vuu-table-extras 0.13.113 → 0.13.115-alpha.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (53) hide show

package/cjs/cell-renderers/background-cell/BackgroundCell.css.js CHANGED Viewed

@@ -1,6 +1,6 @@
 'use strict';
-var backgroundCellCss = "\n.vuuBackgroundCell {\n  --background-animation-duration: 10s;\n  color: var(--vuuBackgroundCell-color, var(--vuu-color-gray-80));\n  padding-right: var(--salt-size-unit);\n  position: relative;\n  z-index: -1;\n}\n\n.vuuBackgroundCell-arrowBackground,\n.vuuBackgroundCell-arrowOnly {\n  padding-left: 14px;\n}\n\n.vuuBackgroundCell-arrow {\n  background-color: var(--background-cell-background);\n  position: absolute;\n  left: 0;\n  right: 0;\n  top: 0;\n  bottom: 0;\n  z-index: -1;\n}\n\n.vuuBackgroundCell-arrow {\n  text-align: left;\n}\n.vuuBackgroundCell-arrow + .num {\n  padding-left: 8px;\n}\n\n.right .vuuBackgroundCell-arrow {\n  text-align: right;\n}\n.right .vuuBackgroundCell-arrow + .num {\n  padding-right: 8px;\n}\n\n.vuuBackgroundCell-arrowOnly > .vuuBackgroundCell-arrow {\n  background-color: transparent;\n}\n\n.vuuBackgroundCell-backgroundOnly.up1,\n.vuuBackgroundCell-arrowBackground.up1 {\n  animation-duration: var(--background-animation-duration);\n  animation-name: vuubgup1;\n}\n\n.vuuBackgroundCell-backgroundOnly.up2,\n.vuuBackgroundCell-arrowBackground.up2 {\n  animation-duration: var(--background-animation-duration);\n  animation-name: vuubgup2;\n}\n\n.vuuBackgroundCell-backgroundOnly.down1,\n.vuuBackgroundCell-arrowBackground.down1 {\n  animation-duration: var(--background-animation-duration);\n  animation-name: vuubgdown1;\n}\n\n.vuuBackgroundCell-backgroundOnly.down2,\n.vuuBackgroundCell-arrowBackground.down2 {\n  animation-duration: var(--background-animation-duration);\n  animation-name: vuubgdown2;\n}\n\n.up1.vuuBackgroundCell-arrowOnly > .vuuBackgroundCell-arrow {\n  animation-duration: 30s;\n  animation-name: vuuarrowup1;\n}\n\n.up2.vuuBackgroundCell-arrowOnly > .vuuBackgroundCell-arrow {\n  animation-duration: 30s;\n  animation-name: vuuarrowup2;\n}\n\n.down1.vuuBackgroundCell-arrowOnly > .vuuBackgroundCell-arrow {\n  animation-duration: 30s;\n  animation-name: vuuarrowdown1;\n}\n\n.down2.vuuBackgroundCell-arrowOnly > .vuuBackgroundCell-arrow {\n  animation-duration: 30s;\n  animation-name: vuuarrowdown2;\n}\n\n.up1.vuuBackgroundCell-arrowBackground > .vuuBackgroundCell-arrow {\n  animation-duration: 30s;\n  animation-name: vuubgarrowup1;\n}\n\n.up2.vuuBackgroundCell-arrowBackground > .vuuBackgroundCell-arrow {\n  animation-duration: 30s;\n  animation-name: vuubgarrowup2;\n}\n\n.down1.vuuBackgroundCell-arrowBackground > .vuuBackgroundCell-arrow {\n  animation-duration: 30s;\n  animation-name: vuubgarrowdown1;\n}\n\n.down2.vuuBackgroundCell-arrowBackground > .vuuBackgroundCell-arrow {\n  animation-duration: 30s;\n  animation-name: vuubgarrowdown2;\n}\n";
+var backgroundCellCss = "\n.vuuBackgroundCell {\n  --background-animation-duration: 10s;\n  color: var(--vuuBackgroundCell-color, var(--salt-content-primary-foreground));\n  padding-right: var(--salt-size-unit);\n  position: relative;\n}\n\n.vuuBackgroundCell-arrowBackground,\n.vuuBackgroundCell-arrowOnly {\n  padding-left: 14px;\n}\n\n.vuuBackgroundCell-value {\n  position: relative;\n  z-index: 1;\n}\n\n.vuuBackgroundCell-arrow {\n  background-color: var(--background-cell-background);\n  position: absolute;\n  left: 0;\n  right: 0;\n  top: 0;\n  bottom: 0;\n}\n\n.vuuBackgroundCell-arrow {\n  text-align: left;\n}\n.vuuBackgroundCell-arrow + .num {\n  padding-left: 8px;\n}\n\n.right .vuuBackgroundCell-arrow {\n  text-align: right;\n}\n.right .vuuBackgroundCell-arrow + .num {\n  padding-right: 8px;\n}\n\n.vuuBackgroundCell-arrowOnly > .vuuBackgroundCell-arrow {\n  background-color: transparent;\n}\n\n.vuuBackgroundCell-backgroundOnly.up1,\n.vuuBackgroundCell-arrowBackground.up1 {\n  animation-duration: var(--background-animation-duration);\n  animation-name: vuubgup1;\n}\n\n.vuuBackgroundCell-backgroundOnly.up2,\n.vuuBackgroundCell-arrowBackground.up2 {\n  animation-duration: var(--background-animation-duration);\n  animation-name: vuubgup2;\n}\n\n.vuuBackgroundCell-backgroundOnly.down1,\n.vuuBackgroundCell-arrowBackground.down1 {\n  animation-duration: var(--background-animation-duration);\n  animation-name: vuubgdown1;\n}\n\n.vuuBackgroundCell-backgroundOnly.down2,\n.vuuBackgroundCell-arrowBackground.down2 {\n  animation-duration: var(--background-animation-duration);\n  animation-name: vuubgdown2;\n}\n\n.up1.vuuBackgroundCell-arrowOnly > .vuuBackgroundCell-arrow {\n  animation-duration: 30s;\n  animation-name: vuuarrowup1;\n}\n\n.up2.vuuBackgroundCell-arrowOnly > .vuuBackgroundCell-arrow {\n  animation-duration: 30s;\n  animation-name: vuuarrowup2;\n}\n\n.down1.vuuBackgroundCell-arrowOnly > .vuuBackgroundCell-arrow {\n  animation-duration: 30s;\n  animation-name: vuuarrowdown1;\n}\n\n.down2.vuuBackgroundCell-arrowOnly > .vuuBackgroundCell-arrow {\n  animation-duration: 30s;\n  animation-name: vuuarrowdown2;\n}\n\n.up1.vuuBackgroundCell-arrowBackground > .vuuBackgroundCell-arrow {\n  animation-duration: 30s;\n  animation-name: vuubgarrowup1;\n}\n\n.up2.vuuBackgroundCell-arrowBackground > .vuuBackgroundCell-arrow {\n  animation-duration: 30s;\n  animation-name: vuubgarrowup2;\n}\n\n.down1.vuuBackgroundCell-arrowBackground > .vuuBackgroundCell-arrow {\n  animation-duration: 30s;\n  animation-name: vuubgarrowdown1;\n}\n\n.down2.vuuBackgroundCell-arrowBackground > .vuuBackgroundCell-arrow {\n  animation-duration: 30s;\n  animation-name: vuubgarrowdown2;\n}\n";
 module.exports = backgroundCellCss;
 //# sourceMappingURL=BackgroundCell.css.js.map

package/cjs/cell-renderers/background-cell/BackgroundCell.js CHANGED Viewed

@@ -1,9 +1,9 @@
 'use strict';
 var jsxRuntime = require('react/jsx-runtime');
-var vuuUtils = require('@vuu-ui/vuu-utils');
 var styles = require('@salt-ds/styles');
 var window = require('@salt-ds/window');
+var vuuUtils = require('@vuu-ui/vuu-utils');
 var cx = require('clsx');
 var react = require('react');
 var useDirection = require('./useDirection.js');
@@ -12,7 +12,6 @@ var BackgroundKeyframes = require('./BackgroundKeyframes.css.js');
 const CHAR_ARROW_UP = String.fromCharCode(11014);
 const CHAR_ARROW_DOWN = String.fromCharCode(11015);
-const { KEY } = vuuUtils.metadataKeys;
 const classBase = "vuuBackgroundCell";
 const FlashStyle = {
   ArrowOnly: "arrow",
@@ -29,8 +28,7 @@ const getFlashStyle = (colType) => {
 };
 const BackgroundCell = react.memo(function BackgroundCell2({
   column,
-  columnMap,
-  row
+  dataRow
 }) {
   const targetWindow = window.useWindow();
   styles.useComponentCssInjection({
@@ -44,10 +42,9 @@ const BackgroundCell = react.memo(function BackgroundCell2({
     window: targetWindow
   });
   const { name, type, valueFormatter } = column;
-  const dataIdx = columnMap[name];
-  const value = row[dataIdx];
+  const value = dataRow[name];
   const flashStyle = getFlashStyle(type);
-  const direction = useDirection.useDirection(row[KEY], value, column);
+  const direction = useDirection.useDirection(dataRow.key, value, column);
   const arrow = flashStyle === FlashStyle.ArrowOnly || flashStyle === FlashStyle.ArrowBackground ? direction === vuuUtils.UP1 || direction === vuuUtils.UP2 ? CHAR_ARROW_UP : direction === vuuUtils.DOWN1 || direction === vuuUtils.DOWN2 ? CHAR_ARROW_DOWN : null : null;
   const dirClass = direction ? ` ` + direction : "";
   const className = cx(classBase, dirClass, {
@@ -57,7 +54,7 @@ const BackgroundCell = react.memo(function BackgroundCell2({
   });
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className, tabIndex: -1, children: [
     /* @__PURE__ */ jsxRuntime.jsx("div", { className: `${classBase}-arrow`, children: arrow }),
-    valueFormatter(row[dataIdx])
+    /* @__PURE__ */ jsxRuntime.jsx("span", { className: `${classBase}-value`, children: valueFormatter(dataRow[name]) })
   ] });
 }, vuuUtils.dataAndColumnUnchanged);
 vuuUtils.registerComponent(
@@ -68,7 +65,15 @@ vuuUtils.registerComponent(
     description: "Change background color of cell when value changes",
     configEditor: "BackgroundCellConfigurationEditor",
     label: "Background Flash",
-    serverDataType: ["long", "int", "double"]
+    serverDataType: [
+      "long",
+      "int",
+      "double",
+      "scaleddecimal2",
+      "scaleddecimal4",
+      "scaleddecimal6",
+      "scaleddecimal8"
+    ]
   }
 );

package/cjs/cell-renderers/background-cell/BackgroundCell.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"BackgroundCell.js","sources":["../../../../../packages/vuu-table-extras/src/cell-renderers/background-cell/BackgroundCell.tsx"],"sourcesContent":["import { TableCellRendererProps } from \"@vuu-ui/vuu-table-types\";\nimport {\n dataAndColumnUnchanged,\n DOWN1,\n DOWN2,\n isTypeDescriptor,\n ~~metadataKeys,\n~~ registerComponent,\n UP1,\n UP2,\n} from \"@vuu-ui/vuu-utils\";\nimport ~~{ useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport~~ cx from \"clsx\";\nimport { memo } from \"react\";\nimport { useDirection } from \"./useDirection\";\n\nimport { DataValueType } from \"@vuu-ui/vuu-data-types\";\nimport backgroundCellCss from \"./BackgroundCell.css\";\nimport backgroundKeyFramesCss from \"./BackgroundKeyframes.css\";\n\nconst CHAR_ARROW_UP = String.fromCharCode(11014);\nconst CHAR_ARROW_DOWN = String.fromCharCode(11015);\n\nconst ~~{ KEY } = metadataKeys;\n\nconst~~ classBase = \"vuuBackgroundCell\";\n\n// TODO these sre repeated from PriceFormatter - where shoud they live ?\nconst FlashStyle = {\n ArrowOnly: \"arrow\",\n BackgroundOnly: \"bg-only\",\n ArrowBackground: \"arrow-bg\",\n};\n\nconst getFlashStyle = (colType?: DataValueType) => {\n if (isTypeDescriptor(colType) && colType.renderer) {\n if (\"flashStyle\" in colType.renderer) {\n return colType.renderer[\"flashStyle\"];\n }\n }\n return FlashStyle.BackgroundOnly;\n};\n\nexport const BackgroundCell = memo(function BackgroundCell({\n column,\n ~~columnMap~~,\n ~~row,\n~~}: TableCellRendererProps) {\n //TODO what about click handling\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"vuu-background-cell\",\n css: backgroundCellCss,\n window: targetWindow,\n });\n useComponentCssInjection({\n testId: \"vuu-background-keyframes\",\n css: backgroundKeyFramesCss,\n window: targetWindow,\n });\n\n const { name, type, valueFormatter } = column;\n const ~~dataIdx~~ = ~~columnMap~~[name];\n const ~~value = row[dataIdx];\n const~~ flashStyle = getFlashStyle(type);\n const direction = useDirection(~~row[KEY]~~, value, column);\n const arrow =\n flashStyle === FlashStyle.ArrowOnly \|\|\n flashStyle === FlashStyle.ArrowBackground\n ? direction === UP1 \|\| direction === UP2\n ? CHAR_ARROW_UP\n : direction === DOWN1 \|\| direction === DOWN2\n ? CHAR_ARROW_DOWN\n : null\n : null;\n\n const dirClass = direction ? ` ` + direction : \"\";\n\n const className = cx(classBase, dirClass, {\n [`${classBase}-backgroundOnly`]: flashStyle === FlashStyle.BackgroundOnly,\n [`${classBase}-arrowOnly`]: flashStyle === FlashStyle.ArrowOnly,\n [`${classBase}-arrowBackground`]: flashStyle === FlashStyle.ArrowBackground,\n });\n\n return (\n <div className={className} tabIndex={-1}>\n <div className={`${classBase}-arrow`}>{arrow}</div>\n {valueFormatter(~~row~~[~~dataIdx~~])}\n </div>\n );\n}, dataAndColumnUnchanged);\n\nregisterComponent(\n \"vuu.price-move-background\",\n BackgroundCell,\n \"cell-renderer\",\n {\n description: \"Change background color of cell when value changes\",\n configEditor: \"BackgroundCellConfigurationEditor\",\n label: \"Background Flash\",\n serverDataType: [\"long\", \"int\", \"double\"],\n },\n);\n"],"names":["~~metadataKeys","~~isTypeDescriptor","memo","BackgroundCell","useWindow","useComponentCssInjection","backgroundCellCss","backgroundKeyFramesCss","useDirection","UP1","UP2","DOWN1","DOWN2","jsxs","jsx","dataAndColumnUnchanged","registerComponent"],"mappings":";;;;;;;;;;;;~~AAqBA~~,MAAM,aAAA,GAAgB,MAAO,CAAA,YAAA,CAAa,KAAK,CAAA;AAC/C,MAAM,eAAA,GAAkB,MAAO,CAAA,YAAA,CAAa,KAAK,CAAA;AAEjD,MAAM,~~EAAE,KAAQ,GAAAA,qBAAA;AAEhB,MAAM,~~SAAY,GAAA,mBAAA;AAGlB,MAAM,UAAa,GAAA;AAAA,EACjB,SAAW,EAAA,OAAA;AAAA,EACX,cAAgB,EAAA,SAAA;AAAA,EAChB,eAAiB,EAAA;AACnB,CAAA;AAEA,MAAM,aAAA,GAAgB,CAAC,OAA4B,KAAA;AACjD,EAAA,~~IAAIC~~,yBAAiB,CAAA,OAAO,CAAK,IAAA,OAAA,CAAQ,QAAU,EAAA;AACjD,IAAI,IAAA,YAAA,IAAgB,QAAQ,QAAU,EAAA;AACpC,MAAO,OAAA,OAAA,CAAQ,SAAS,YAAY,CAAA;AAAA;AACtC;AAEF,EAAA,OAAO,UAAW,CAAA,cAAA;AACpB,CAAA;AAEa,MAAA,cAAA,GAAiBC,UAAK,CAAA,SAASC,eAAe,CAAA;AAAA,EACzD,MAAA;AAAA,EACA~~,SAAA~~;~~AAAA,EACA;~~AACF,CAA2B,EAAA;AAGzB,EAAA,MAAM,eAAeC,gBAAU,EAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,qBAAA;AAAA,IACR,GAAK,EAAAC,gBAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AACD,EAAyBD,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,0BAAA;AAAA,IACR,GAAK,EAAAE,mBAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EAAA,MAAM,EAAE,IAAA,EAAM,IAAM,EAAA,cAAA,EAAmB,GAAA,MAAA;AACvC,EAAM,MAAA,~~OAAA,GAAU,UAAU,IAAI,CAAA;AAC9B,EAAM,MAAA,~~KAAA,GAAQ,IAAI,~~OAAO,~~CAAA;~~AACzB~~,EAAM,MAAA,UAAA,GAAa,cAAc,IAAI,CAAA;AACrC,EAAA,MAAM,~~YAAYC~~,~~yBAAa~~,~~CAAA~~,~~GAAA~~,~~CAAI~~,~~GAAG,~~CAAA,~~EAAG~~,OAAO,MAAM,CAAA;~~AACtD~~,EAAA,MAAM,QACJ,UAAe,KAAA,UAAA,CAAW,SAC1B,IAAA,UAAA,KAAe,WAAW,eACtB,GAAA,SAAA,KAAcC,YAAO,IAAA,SAAA,KAAcC,eACjC,aACA,GAAA,SAAA,KAAcC,kBAAS,SAAc,KAAAC,cAAA,GACnC,kBACA,IACJ,GAAA,IAAA;AAEN,EAAM,MAAA,QAAA,GAAW,SAAY,GAAA,CAAA,CAAA,CAAA,GAAM,SAAY,GAAA,EAAA;AAE/C,EAAM,MAAA,SAAA,GAAY,EAAG,CAAA,SAAA,EAAW,QAAU,EAAA;AAAA,IACxC,CAAC,CAAG,EAAA,SAAS,CAAiB,eAAA,CAAA,GAAG,eAAe,UAAW,CAAA,cAAA;AAAA,IAC3D,CAAC,CAAG,EAAA,SAAS,CAAY,UAAA,CAAA,GAAG,eAAe,UAAW,CAAA,SAAA;AAAA,IACtD,CAAC,CAAG,EAAA,SAAS,CAAkB,gBAAA,CAAA,GAAG,eAAe,UAAW,CAAA;AAAA,GAC7D,CAAA;AAED,EAAA,uBACGC,eAAA,CAAA,KAAA,EAAA,EAAI,SAAsB,EAAA,QAAA,EAAU,CACnC,CAAA,EAAA,QAAA,EAAA;AAAA,oBAAAC,cAAA,CAAC,KAAI,EAAA,EAAA,SAAA,EAAW,CAAG,EAAA,SAAS,UAAW,QAAM,EAAA,KAAA,EAAA,CAAA;AAAA,~~IAC5C~~,cAAA,~~CAAe~~,~~GAAI~~,CAAA,~~OAAO~~,CAAC;AAAA,~~GAC9B~~,EAAA,CAAA;AAEJ,CAAA,EAAGC,+BAAsB;AAEzBC,0BAAA;AAAA,EACE,2BAAA;AAAA,EACA,cAAA;AAAA,EACA,eAAA;AAAA,EACA;AAAA,IACE,WAAa,EAAA,oDAAA;AAAA,IACb,YAAc,EAAA,mCAAA;AAAA,IACd,KAAO,EAAA,kBAAA;AAAA,IACP,cAAgB,EAAA,~~CAAC~~,~~MAAQ~~,~~EAAA~~,KAAA,~~EAAO~~,~~QAAQ~~;AAAA;~~AAE5C~~,CAAA;;;;"}
1	+ {"version":3,"file":"BackgroundCell.js","sources":["../../../../../packages/vuu-table-extras/src/cell-renderers/background-cell/BackgroundCell.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { TableCellRendererProps } from \"@vuu-ui/vuu-table-types\";\nimport {\n dataAndColumnUnchanged,\n DOWN1,\n DOWN2,\n isTypeDescriptor,\n registerComponent,\n UP1,\n UP2,\n} from \"@vuu-ui/vuu-utils\";\nimport cx from \"clsx\";\nimport { memo } from \"react\";\nimport { useDirection } from \"./useDirection\";\n\nimport { DataValueType } from \"@vuu-ui/vuu-data-types\";\nimport backgroundCellCss from \"./BackgroundCell.css\";\nimport backgroundKeyFramesCss from \"./BackgroundKeyframes.css\";\n\nconst CHAR_ARROW_UP = String.fromCharCode(11014);\nconst CHAR_ARROW_DOWN = String.fromCharCode(11015);\n\nconst classBase = \"vuuBackgroundCell\";\n\n// TODO these sre repeated from PriceFormatter - where shoud they live ?\nconst FlashStyle = {\n ArrowOnly: \"arrow\",\n BackgroundOnly: \"bg-only\",\n ArrowBackground: \"arrow-bg\",\n};\n\nconst getFlashStyle = (colType?: DataValueType) => {\n if (isTypeDescriptor(colType) && colType.renderer) {\n if (\"flashStyle\" in colType.renderer) {\n return colType.renderer[\"flashStyle\"];\n }\n }\n return FlashStyle.BackgroundOnly;\n};\n\nexport const BackgroundCell = memo(function BackgroundCell({\n column,\n dataRow,\n}: TableCellRendererProps) {\n //TODO what about click handling\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"vuu-background-cell\",\n css: backgroundCellCss,\n window: targetWindow,\n });\n useComponentCssInjection({\n testId: \"vuu-background-keyframes\",\n css: backgroundKeyFramesCss,\n window: targetWindow,\n });\n\n const { name, type, valueFormatter } = column;\n const value = dataRow[name];\n const flashStyle = getFlashStyle(type);\n const direction = useDirection(dataRow.key, value, column);\n const arrow =\n flashStyle === FlashStyle.ArrowOnly \|\|\n flashStyle === FlashStyle.ArrowBackground\n ? direction === UP1 \|\| direction === UP2\n ? CHAR_ARROW_UP\n : direction === DOWN1 \|\| direction === DOWN2\n ? CHAR_ARROW_DOWN\n : null\n : null;\n\n const dirClass = direction ? ` ` + direction : \"\";\n\n const className = cx(classBase, dirClass, {\n [`${classBase}-backgroundOnly`]: flashStyle === FlashStyle.BackgroundOnly,\n [`${classBase}-arrowOnly`]: flashStyle === FlashStyle.ArrowOnly,\n [`${classBase}-arrowBackground`]: flashStyle === FlashStyle.ArrowBackground,\n });\n\n return (\n <div className={className} tabIndex={-1}>\n <div className={`${classBase}-arrow`}>{arrow}</div>\n <span className={`${classBase}-value`}>\n {valueFormatter(dataRow[name])}\n </span>\n </div>\n );\n}, dataAndColumnUnchanged);\n\nregisterComponent(\n \"vuu.price-move-background\",\n BackgroundCell,\n \"cell-renderer\",\n {\n description: \"Change background color of cell when value changes\",\n configEditor: \"BackgroundCellConfigurationEditor\",\n label: \"Background Flash\",\n serverDataType: [\n \"long\",\n \"int\",\n \"double\",\n \"scaleddecimal2\",\n \"scaleddecimal4\",\n \"scaleddecimal6\",\n \"scaleddecimal8\",\n ],\n },\n);\n"],"names":["isTypeDescriptor","memo","BackgroundCell","useWindow","useComponentCssInjection","backgroundCellCss","backgroundKeyFramesCss","useDirection","UP1","UP2","DOWN1","DOWN2","jsxs","jsx","dataAndColumnUnchanged","registerComponent"],"mappings":"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"}

package/cjs/cell-renderers/background-cell/BackgroundKeyframes.css.js CHANGED Viewed

@@ -1,6 +1,6 @@
 'use strict';
-var backgroundKeyFramesCss = "\n@keyframes vuubgup1 {\n    0% {\n      background-color: var(--vuu-color-green-50);\n      color: white;\n    }\n\n    30% {\n      color: white;\n    }  \n    33% {\n      color: var(--vuu-color-gray-80);\n    }  \n\n    100% {\n      background-color: transparent;\n      color: var(--vuu-color-gray-80);\n    }\n  }\n  \n  @keyframes vuubgup2 {\n    0% {\n      background-color: var(--vuu-color-green-50);\n      color: white;\n    }\n\n    30% {\n      color: white;\n    }  \n    33% {\n      color: var(--vuu-color-gray-80);\n    }  \n\n    100% {\n      background-color: transparent;\n      color: var(--vuu-color-gray-80);\n    }\n  }\n  \n  @keyframes vuubgdown1 {\n    0% {\n      background-color: var(--vuu-color-red-50);\n      color: white;\n    }\n    30% {\n      color: white;\n    }  \n    33% {\n      color: var(--vuu-color-gray-80);\n    }  \n    100% {\n      background-color: transparent;\n      color: var(--vuu-color-gray-80);\n    }\n  }\n  \n  @keyframes vuubgdown2 {\n    0% {\n      background-color: var(--vuu-color-red-50);\n      color: white;\n    }\n    30% {\n      color: white;\n    }  \n    33% {\n      color: var(--vuu-color-gray-80);\n    }  \n    100% {\n      background-color: transparent;\n      color: var(--vuu-color-gray-80);\n    }\n  }\n  \n  @keyframes vuuarrowup1 {\n    from {\n      color: var(--salt-differential-positive-foreground);\n    }\n    to {\n      color: transparent;\n    }\n  }\n  \n  @keyframes vuuarrowup2 {\n    from {\n      color: var(--salt-differential-positive-foreground);\n    }\n    to {\n      color: transparent;\n    }\n  }\n  \n  @keyframes vuuarrowdown1 {\n    from {\n      color: var(--salt-differential-negative-foreground);\n    }\n    to {\n      color: transparent;\n    }\n  }\n  \n  @keyframes vuuarrowdown2 {\n    from {\n      color: var(--salt-differential-negative-foreground);\n    }\n    to {\n      color: transparent;\n    }\n  }\n  \n  @keyframes vuubgarrowup1 {\n    0% {\n      color: var(--salt-differential-positive-foreground);\n      background-color: var(--vuu-color-green-50);\n    }\n    20% {\n      color: var(--salt-differential-positive-foreground);\n      background-color: transparent;\n    }\n    100% {\n      color: transparent;\n      background-color: transparent;\n    }\n  }\n  \n  @keyframes vuubgarrowup2 {\n    0% {\n      color: var(--salt-differential-positive-foreground);\n      background-color: var(--vuu-color-green-50);\n    }\n    20% {\n      color: var(--salt-differential-positive-foreground);\n      background-color: transparent;\n    }\n    100% {\n      color: transparent;\n      background-color: transparent;\n    }\n  }\n  \n  @keyframes vuubgarrowdown1 {\n    0% {\n      color: var(--salt-differential-negative-foreground);\n      background-color: var(--vuu-color-red-50);\n    }\n    20% {\n      color: var(--salt-differential-negative-foreground);\n      background-color: transparent;\n    }\n    100% {\n      color: transparent;\n      background-color: transparent;\n    }\n  }\n  \n  @keyframes vuubgarrowdown2 {\n    0% {\n      color: var(--salt-differential-negative-foreground);\n      background-color: var(--vuu-color-red-50);\n    }\n    20% {\n      color: var(--salt-differential-negative-foreground);\n      background-color: transparent;\n    }\n    100% {\n      color: transparent;\n      background-color: transparent;\n    }\n  }\n  ";
+var backgroundKeyFramesCss = "\n@keyframes vuubgup1 {\n    0% {\n      background-color: var(--salt-sentiment-positive-foreground-informative);\n      color: white;\n    }\n\n    40% {\n      color: white;\n    }  \n    60% {\n      color: var(--salt-content-primary-foreground);\n    }  \n\n    100% {\n      background-color: transparent;\n      color: var(--salt-content-primary-foreground);\n    }\n  }\n  \n  @keyframes vuubgup2 {\n    0% {\n      background-color: var(--salt-sentiment-positive-foreground-informative);\n      color: white;\n    }\n\n    30% {\n      color: white;\n    }  \n    33% {\n      color: var(--salt-content-primary-foreground);\n    }  \n\n    100% {\n      background-color: transparent;\n      color: var(--salt-content-primary-foreground);\n    }\n  }\n  \n  @keyframes vuubgdown1 {\n    0% {\n      background-color: var(--salt-sentiment-negative-foreground-informative);\n      color: white;\n    }\n    30% {\n      color: white;\n    }  \n    33% {\n      color: var(--salt-content-primary-foreground);\n    }  \n    100% {\n      background-color: transparent;\n      color: var(--salt-content-primary-foreground);\n    }\n  }\n  \n  @keyframes vuubgdown2 {\n    0% {\n      background-color: var(--salt-sentiment-negative-foreground-informative);\n      color: white;\n    }\n    30% {\n      color: white;\n    }  \n    33% {\n      color: var(--salt-content-primary-foreground);\n    }  \n    100% {\n      background-color: transparent;\n      color: var(--salt-content-primary-foreground);\n    }\n  }\n  \n  @keyframes vuuarrowup1 {\n    from {\n      color: var(--salt-sentiment-positive-foreground-informative);\n    }\n    to {\n      color: transparent;\n    }\n  }\n  \n  @keyframes vuuarrowup2 {\n    from {\n      color: var(--salt-sentiment-positive-foreground-informative);\n    }\n    to {\n      color: transparent;\n    }\n  }\n  \n  @keyframes vuuarrowdown1 {\n    from {\n      color: var(--salt-sentiment-negative-foreground-informative);\n    }\n    to {\n      color: transparent;\n    }\n  }\n  \n  @keyframes vuuarrowdown2 {\n    from {\n      color: var(--salt-sentiment-negative-foreground-informative);\n    }\n    to {\n      color: transparent;\n    }\n  }\n  \n  @keyframes vuubgarrowup1 {\n    0% {\n      color: var(--salt-sentiment-positive-foreground-informative);\n      background-color: var(--salt-sentiment-positive-foreground-informative);\n    }\n    20% {\n      color: var(--salt-sentiment-positive-foreground-informative);\n      background-color: transparent;\n    }\n    100% {\n      color: transparent;\n      background-color: transparent;\n    }\n  }\n  \n  @keyframes vuubgarrowup2 {\n    0% {\n      color: var(--salt-sentiment-positive-foreground-informative);\n      background-color: var(--salt-sentiment-positive-foreground-informative);\n    }\n    20% {\n      color: var(-salt-sentiment-positive-foreground-informative);\n      background-color: transparent;\n    }\n    100% {\n      color: transparent;\n      background-color: transparent;\n    }\n  }\n  \n  @keyframes vuubgarrowdown1 {\n    0% {\n      color: var(--salt-sentiment-negative-foreground-informative);\n      background-color: var(--salt-sentiment-negative-foreground-informative);\n    }\n    20% {\n      color: var(--salt-sentiment-negative-foreground-informative);\n      background-color: transparent;\n    }\n    100% {\n      color: transparent;\n      background-color: transparent;\n    }\n  }\n  \n  @keyframes vuubgarrowdown2 {\n    0% {\n      color: var(--salt-sentiment-negative-foreground-informative);\n      background-color: var(--salt-sentiment-negative-foreground-informative);\n    }\n    20% {\n      color: var(--salt-sentiment-negative-foreground-informative);\n      background-color: transparent;\n    }\n    100% {\n      color: transparent;\n      background-color: transparent;\n    }\n  }\n  ";
 module.exports = backgroundKeyFramesCss;
 //# sourceMappingURL=BackgroundKeyframes.css.js.map

package/cjs/cell-renderers/button-cell/IconButtonCell.js CHANGED Viewed

@@ -9,7 +9,7 @@ var TableProvider = require('../../table-provider/TableProvider.js');
 var core = require('@salt-ds/core');
 const classBase = "vuuIconButtonCell";
-const IconButtonCell = ({ column, row }) => {
+const IconButtonCell = ({ column, dataRow }) => {
   const targetWindow = window.useWindow();
   styles.useComponentCssInjection({
     testId: "vuu-iconbutton-cell",
@@ -20,9 +20,9 @@ const IconButtonCell = ({ column, row }) => {
   const handleClick = react.useCallback(
     (evt) => {
       evt.stopPropagation();
-      actionHandler(column.name, row);
+      actionHandler(column.name, dataRow);
     },
-    [actionHandler, column, row]
+    [actionHandler, column, dataRow]
   );
   return /* @__PURE__ */ jsxRuntime.jsx(
     core.Button,

package/cjs/cell-renderers/button-cell/IconButtonCell.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"IconButtonCell.js","sources":["../../../../../packages/vuu-table-extras/src/cell-renderers/button-cell/IconButtonCell.tsx"],"sourcesContent":["import { TableCellRendererProps } from \"@vuu-ui/vuu-table-types\";\nimport { MouseEventHandler, useCallback } from \"react\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport iconButtonCellCss from \"./IconButtonCell.css\";\nimport { useRowAction } from \"../../table-provider/TableProvider\";\nimport { Button } from \"@salt-ds/core\";\n\nconst classBase = \"vuuIconButtonCell\";\n\n/*\n To assign an icon to the cell, give the columndescriptor\n * a className. In css, assign an icon variable to --vuu-svg-icon.\n */\nexport const IconButtonCell = ({ column, ~~row~~ }: TableCellRendererProps) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"vuu-iconbutton-cell\",\n css: iconButtonCellCss,\n window: targetWindow,\n });\n\n const actionHandler = useRowAction(column.name);\n const handleClick = useCallback<MouseEventHandler<HTMLButtonElement>>(\n (evt) => {\n evt.stopPropagation();\n actionHandler(column.name, ~~row~~);\n },\n [actionHandler, column, ~~row~~],\n );\n\n return (\n <Button\n appearance=\"transparent\"\n className={classBase}\n data-embedded\n data-icon\n onClick={handleClick}\n />\n );\n};\n"],"names":["useWindow","useComponentCssInjection","iconButtonCellCss","useRowAction","useCallback","jsx","Button"],"mappings":";;;;;;;;;;AASA,MAAM,SAAY,GAAA,mBAAA;AAMX,MAAM,cAAiB,GAAA,CAAC,EAAE,MAAA,EAAQ,~~KAAkC~~,KAAA;~~AACzE~~,EAAA,MAAM,eAAeA,gBAAU,EAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,qBAAA;AAAA,IACR,GAAK,EAAAC,gBAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EAAM,MAAA,aAAA,GAAgBC,0BAAa,CAAA,MAAA,CAAO,IAAI,CAAA;AAC9C,EAAA,MAAM,WAAc,GAAAC,iBAAA;AAAA,IAClB,CAAC,GAAQ,KAAA;AACP,MAAA,GAAA,CAAI,eAAgB,EAAA;AACpB,MAAc,aAAA,CAAA,MAAA,CAAO,MAAM,~~GAAG~~,CAAA;AAAA,~~KAChC~~;AAAA,IACA,CAAC,aAAe,EAAA,MAAA,EAAQ,~~GAAG~~;AAAA,~~GAC7B~~;AAEA,EACE,uBAAAC,cAAA;AAAA,IAACC,WAAA;AAAA,IAAA;AAAA,MACC,UAAW,EAAA,aAAA;AAAA,MACX,SAAW,EAAA,SAAA;AAAA,MACX,eAAa,EAAA,IAAA;AAAA,MACb,WAAS,EAAA,IAAA;AAAA,MACT,OAAS,EAAA;AAAA;AAAA,GACX;AAEJ;;;;"}
1	+ {"version":3,"file":"IconButtonCell.js","sources":["../../../../../packages/vuu-table-extras/src/cell-renderers/button-cell/IconButtonCell.tsx"],"sourcesContent":["import { TableCellRendererProps } from \"@vuu-ui/vuu-table-types\";\nimport { MouseEventHandler, useCallback } from \"react\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport iconButtonCellCss from \"./IconButtonCell.css\";\nimport { useRowAction } from \"../../table-provider/TableProvider\";\nimport { Button } from \"@salt-ds/core\";\n\nconst classBase = \"vuuIconButtonCell\";\n\n/*\n To assign an icon to the cell, give the columndescriptor\n * a className. In css, assign an icon variable to --vuu-svg-icon.\n */\nexport const IconButtonCell = ({ column, dataRow }: TableCellRendererProps) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"vuu-iconbutton-cell\",\n css: iconButtonCellCss,\n window: targetWindow,\n });\n\n const actionHandler = useRowAction(column.name);\n const handleClick = useCallback<MouseEventHandler<HTMLButtonElement>>(\n (evt) => {\n evt.stopPropagation();\n actionHandler(column.name, dataRow);\n },\n [actionHandler, column, dataRow],\n );\n\n return (\n <Button\n appearance=\"transparent\"\n className={classBase}\n data-embedded\n data-icon\n onClick={handleClick}\n />\n );\n};\n"],"names":["useWindow","useComponentCssInjection","iconButtonCellCss","useRowAction","useCallback","jsx","Button"],"mappings":";;;;;;;;;;AASA,MAAM,SAAY,GAAA,mBAAA;AAMX,MAAM,cAAiB,GAAA,CAAC,EAAE,MAAA,EAAQ,SAAsC,KAAA;AAC7E,EAAA,MAAM,eAAeA,gBAAU,EAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,qBAAA;AAAA,IACR,GAAK,EAAAC,gBAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EAAM,MAAA,aAAA,GAAgBC,0BAAa,CAAA,MAAA,CAAO,IAAI,CAAA;AAC9C,EAAA,MAAM,WAAc,GAAAC,iBAAA;AAAA,IAClB,CAAC,GAAQ,KAAA;AACP,MAAA,GAAA,CAAI,eAAgB,EAAA;AACpB,MAAc,aAAA,CAAA,MAAA,CAAO,MAAM,OAAO,CAAA;AAAA,KACpC;AAAA,IACA,CAAC,aAAe,EAAA,MAAA,EAAQ,OAAO;AAAA,GACjC;AAEA,EACE,uBAAAC,cAAA;AAAA,IAACC,WAAA;AAAA,IAAA;AAAA,MACC,UAAW,EAAA,aAAA;AAAA,MACX,SAAW,EAAA,SAAA;AAAA,MACX,eAAa,EAAA,IAAA;AAAA,MACb,WAAS,EAAA,IAAA;AAAA,MACT,OAAS,EAAA;AAAA;AAAA,GACX;AAEJ;;;;"}

package/cjs/cell-renderers/dropdown-cell/DropdownCell.js CHANGED Viewed

@@ -12,9 +12,8 @@ var DropdownCell$1 = require('./DropdownCell.css.js');
 const classBase = "vuuTableDropdownCell";
 const DropdownCell = react.memo(function DropdownCell2({
   column,
-  columnMap,
-  onEdit,
-  row
+  dataRow,
+  onEdit
 }) {
   const targetWindow = window.useWindow();
   styles.useComponentCssInjection({
@@ -23,8 +22,7 @@ const DropdownCell = react.memo(function DropdownCell2({
     window: targetWindow
   });
   const [open, setOpen] = react.useState(false);
-  const dataIdx = columnMap[column.name];
-  const dataValue = row[dataIdx];
+  const dataValue = dataRow[column.name];
   const { values } = vuuDataReact.useLookupValues(column, dataValue);
   const valueRef = react.useRef(void 0);
   react.useMemo(() => {

package/cjs/cell-renderers/dropdown-cell/DropdownCell.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DropdownCell.js","sources":["../../../../../packages/vuu-table-extras/src/cell-renderers/dropdown-cell/DropdownCell.tsx"],"sourcesContent":["import { useLookupValues } from \"@vuu-ui/vuu-data-react\";\nimport type { VuuColumnDataType } from \"@vuu-ui/vuu-protocol-types\";\nimport { ListOption, TableCellRendererProps } from \"@vuu-ui/vuu-table-types\";\nimport {\n dataColumnAndKeyUnchanged,\n dispatchCustomEvent,\n getSelectedOption,\n isRpcSuccess,\n registerComponent,\n} from \"@vuu-ui/vuu-utils\";\nimport { Dropdown, Option } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport {\n KeyboardEventHandler,\n MouseEventHandler,\n SyntheticEvent,\n memo,\n useCallback,\n useMemo,\n useRef,\n useState,\n} from \"react\";\n\nimport dropdownCellCss from \"./DropdownCell.css\";\n\nconst classBase = \"vuuTableDropdownCell\";\n\nexport const DropdownCell = memo(function DropdownCell({\n column,\n ~~columnMap~~,\n onEdit,\n ~~row,\n~~}: TableCellRendererProps) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"vuu-dropdown-cell\",\n css: dropdownCellCss,\n window: targetWindow,\n });\n\n const [open, setOpen] = useState(false);\n const ~~dataIdx~~ = ~~columnMap~~[column.name]~~;\n const~~ ~~dataValue = row[dataIdx]~~ as string \| number;\n const { values } = useLookupValues(column, dataValue);\n const valueRef = useRef<ListOption>(undefined);\n\n useMemo(() => {\n valueRef.current = getSelectedOption(values, dataValue);\n }, [dataValue, values]);\n\n const handleOpenChange = useCallback((isOpen: boolean) => {\n console.log(`handleOpenChange ${isOpen}`);\n if (isOpen === false) {\n setOpen(false);\n }\n }, []);\n\n const handleSelectionChange = useCallback(\n async (evt: SyntheticEvent, [selectedOption]: ListOption[]) => {\n if (selectedOption) {\n // Note, we do not setState locally when a selection is made, we just send the update\n // to the server. We rely on the update coming back in from a server response which\n // we handle in the useMemo above. If we worry that server repsonses might be too slow\n // we can extend this logic with some kind of pending update state.\n const response = await onEdit?.(\n {\n editType: \"commit\",\n previousValue: valueRef.current?.value,\n value: selectedOption.value as VuuColumnDataType,\n },\n \"commit\",\n );\n if (isRpcSuccess(response)) {\n dispatchCustomEvent(evt.target as HTMLElement, \"vuu-commit\");\n }\n }\n },\n [onEdit],\n );\n\n const handleClick = useCallback<MouseEventHandler<HTMLButtonElement>>(() => {\n if (!open) {\n setOpen(true);\n }\n }, [open]);\n\n const handleKeyDown = useCallback<KeyboardEventHandler>(\n (e) => {\n if (e.key === \"Enter\" && !open) {\n e.preventDefault();\n e.stopPropagation();\n setOpen(true);\n }\n },\n [open],\n );\n\n const { current: selectedOption } = valueRef;\n return (\n <Dropdown<ListOption>\n className={classBase}\n data-icon=\"triangle-down\"\n onClick={handleClick}\n onKeyDownCapture={handleKeyDown}\n onOpenChange={handleOpenChange}\n onSelectionChange={handleSelectionChange}\n open={open}\n selected={selectedOption ? [selectedOption] : []}\n value={selectedOption?.label}\n >\n {values.map((listOption, i) => (\n <Option key={i} value={listOption}>\n {listOption.label}\n </Option>\n ))}\n </Dropdown>\n );\n}, dataColumnAndKeyUnchanged);\n\nregisterComponent(\"dropdown-cell\", DropdownCell, \"cell-renderer\", {\n userCanAssign: false,\n});\n"],"names":["memo","DropdownCell","useWindow","useComponentCssInjection","dropdownCellCss","useState","useLookupValues","useRef","useMemo","getSelectedOption","useCallback","selectedOption","isRpcSuccess","dispatchCustomEvent","jsx","Dropdown","Option","dataColumnAndKeyUnchanged","registerComponent"],"mappings":";;;;;;;;;;;AA0BA,MAAM,SAAY,GAAA,sBAAA;AAEL,MAAA,YAAA,GAAeA,UAAK,CAAA,SAASC,aAAa,CAAA;AAAA,EACrD,MAAA;AAAA,EACA,~~SAAA~~;AAAA,EACA~~,MAAA~~;~~AAAA,EACA;~~AACF,CAA2B,EAAA;AACzB,EAAA,MAAM,eAAeC,gBAAU,EAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,mBAAA;AAAA,IACR,GAAK,EAAAC,cAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EAAA,MAAM,CAAC,IAAA,EAAM,OAAO,CAAA,GAAIC,eAAS,KAAK,CAAA;AACtC,EAAM,MAAA,~~OAAA~~,~~GAAU~~,~~SAAU~~,CAAA,MAAA,CAAO,IAAI,CAAA;AACrC,~~EAAM,MAAA,SAAA,GAAY,IAAI,OAAO,CAAA;AAC7B,~~EAAA,MAAM,EAAE,MAAA,EAAW,GAAAC,4BAAA,CAAgB,QAAQ,SAAS,CAAA;AACpD,EAAM,MAAA,QAAA,GAAWC,aAAmB,KAAS,CAAA,CAAA;AAE7C,EAAAC,aAAA,CAAQ,MAAM;AACZ,IAAS,QAAA,CAAA,OAAA,GAAUC,0BAAkB,CAAA,MAAA,EAAQ,SAAS,CAAA;AAAA,GACrD,EAAA,CAAC,SAAW,EAAA,MAAM,CAAC,CAAA;AAEtB,EAAM,MAAA,gBAAA,GAAmBC,iBAAY,CAAA,CAAC,MAAoB,KAAA;AACxD,IAAQ,OAAA,CAAA,GAAA,CAAI,CAAoB,iBAAA,EAAA,MAAM,CAAE,CAAA,CAAA;AACxC,IAAA,IAAI,WAAW,KAAO,EAAA;AACpB,MAAA,OAAA,CAAQ,KAAK,CAAA;AAAA;AACf,GACF,EAAG,EAAE,CAAA;AAEL,EAAA,MAAM,qBAAwB,GAAAA,iBAAA;AAAA,IAC5B,OAAO,GAAA,EAAqB,CAACC,eAAc,CAAoB,KAAA;AAC7D,MAAA,IAAIA,eAAgB,EAAA;AAKlB,QAAA,MAAM,WAAW,MAAM,MAAA;AAAA,UACrB;AAAA,YACE,QAAU,EAAA,QAAA;AAAA,YACV,aAAA,EAAe,SAAS,OAAS,EAAA,KAAA;AAAA,YACjC,OAAOA,eAAe,CAAA;AAAA,WACxB;AAAA,UACA;AAAA,SACF;AACA,QAAI,IAAAC,qBAAA,CAAa,QAAQ,CAAG,EAAA;AAC1B,UAAoBC,4BAAA,CAAA,GAAA,CAAI,QAAuB,YAAY,CAAA;AAAA;AAC7D;AACF,KACF;AAAA,IACA,CAAC,MAAM;AAAA,GACT;AAEA,EAAM,MAAA,WAAA,GAAcH,kBAAkD,MAAM;AAC1E,IAAA,IAAI,CAAC,IAAM,EAAA;AACT,MAAA,OAAA,CAAQ,IAAI,CAAA;AAAA;AACd,GACF,EAAG,CAAC,IAAI,CAAC,CAAA;AAET,EAAA,MAAM,aAAgB,GAAAA,iBAAA;AAAA,IACpB,CAAC,CAAM,KAAA;AACL,MAAA,IAAI,CAAE,CAAA,GAAA,KAAQ,OAAW,IAAA,CAAC,IAAM,EAAA;AAC9B,QAAA,CAAA,CAAE,cAAe,EAAA;AACjB,QAAA,CAAA,CAAE,eAAgB,EAAA;AAClB,QAAA,OAAA,CAAQ,IAAI,CAAA;AAAA;AACd,KACF;AAAA,IACA,CAAC,IAAI;AAAA,GACP;AAEA,EAAM,MAAA,EAAE,OAAS,EAAA,cAAA,EAAmB,GAAA,QAAA;AACpC,EACE,uBAAAI,cAAA;AAAA,IAACC,aAAA;AAAA,IAAA;AAAA,MACC,SAAW,EAAA,SAAA;AAAA,MACX,WAAU,EAAA,eAAA;AAAA,MACV,OAAS,EAAA,WAAA;AAAA,MACT,gBAAkB,EAAA,aAAA;AAAA,MAClB,YAAc,EAAA,gBAAA;AAAA,MACd,iBAAmB,EAAA,qBAAA;AAAA,MACnB,IAAA;AAAA,MACA,QAAU,EAAA,cAAA,GAAiB,CAAC,cAAc,IAAI,EAAC;AAAA,MAC/C,OAAO,cAAgB,EAAA,KAAA;AAAA,MAEtB,QAAO,EAAA,MAAA,CAAA,GAAA,CAAI,CAAC,UAAA,EAAY,CACvB,qBAAAD,cAAA,CAACE,WAAe,EAAA,EAAA,KAAA,EAAO,UACpB,EAAA,QAAA,EAAA,UAAA,CAAW,KADD,EAAA,EAAA,CAEb,CACD;AAAA;AAAA,GACH;AAEJ,CAAA,EAAGC,kCAAyB;AAE5BC,0BAAkB,CAAA,eAAA,EAAiB,cAAc,eAAiB,EAAA;AAAA,EAChE,aAAe,EAAA;AACjB,CAAC,CAAA;;;;"}
1	+ {"version":3,"file":"DropdownCell.js","sources":["../../../../../packages/vuu-table-extras/src/cell-renderers/dropdown-cell/DropdownCell.tsx"],"sourcesContent":["import { useLookupValues } from \"@vuu-ui/vuu-data-react\";\nimport type { VuuColumnDataType } from \"@vuu-ui/vuu-protocol-types\";\nimport { ListOption, TableCellRendererProps } from \"@vuu-ui/vuu-table-types\";\nimport {\n dataColumnAndKeyUnchanged,\n dispatchCustomEvent,\n getSelectedOption,\n isRpcSuccess,\n registerComponent,\n} from \"@vuu-ui/vuu-utils\";\nimport { Dropdown, Option } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport {\n KeyboardEventHandler,\n MouseEventHandler,\n SyntheticEvent,\n memo,\n useCallback,\n useMemo,\n useRef,\n useState,\n} from \"react\";\n\nimport dropdownCellCss from \"./DropdownCell.css\";\n\nconst classBase = \"vuuTableDropdownCell\";\n\nexport const DropdownCell = memo(function DropdownCell({\n column,\n dataRow,\n onEdit,\n}: TableCellRendererProps) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"vuu-dropdown-cell\",\n css: dropdownCellCss,\n window: targetWindow,\n });\n\n const [open, setOpen] = useState(false);\n const dataValue = dataRow[column.name] as string \| number;\n const { values } = useLookupValues(column, dataValue);\n const valueRef = useRef<ListOption>(undefined);\n\n useMemo(() => {\n valueRef.current = getSelectedOption(values, dataValue);\n }, [dataValue, values]);\n\n const handleOpenChange = useCallback((isOpen: boolean) => {\n console.log(`handleOpenChange ${isOpen}`);\n if (isOpen === false) {\n setOpen(false);\n }\n }, []);\n\n const handleSelectionChange = useCallback(\n async (evt: SyntheticEvent, [selectedOption]: ListOption[]) => {\n if (selectedOption) {\n // Note, we do not setState locally when a selection is made, we just send the update\n // to the server. We rely on the update coming back in from a server response which\n // we handle in the useMemo above. If we worry that server repsonses might be too slow\n // we can extend this logic with some kind of pending update state.\n const response = await onEdit?.(\n {\n editType: \"commit\",\n previousValue: valueRef.current?.value,\n value: selectedOption.value as VuuColumnDataType,\n },\n \"commit\",\n );\n if (isRpcSuccess(response)) {\n dispatchCustomEvent(evt.target as HTMLElement, \"vuu-commit\");\n }\n }\n },\n [onEdit],\n );\n\n const handleClick = useCallback<MouseEventHandler<HTMLButtonElement>>(() => {\n if (!open) {\n setOpen(true);\n }\n }, [open]);\n\n const handleKeyDown = useCallback<KeyboardEventHandler>(\n (e) => {\n if (e.key === \"Enter\" && !open) {\n e.preventDefault();\n e.stopPropagation();\n setOpen(true);\n }\n },\n [open],\n );\n\n const { current: selectedOption } = valueRef;\n return (\n <Dropdown<ListOption>\n className={classBase}\n data-icon=\"triangle-down\"\n onClick={handleClick}\n onKeyDownCapture={handleKeyDown}\n onOpenChange={handleOpenChange}\n onSelectionChange={handleSelectionChange}\n open={open}\n selected={selectedOption ? [selectedOption] : []}\n value={selectedOption?.label}\n >\n {values.map((listOption, i) => (\n <Option key={i} value={listOption}>\n {listOption.label}\n </Option>\n ))}\n </Dropdown>\n );\n}, dataColumnAndKeyUnchanged);\n\nregisterComponent(\"dropdown-cell\", DropdownCell, \"cell-renderer\", {\n userCanAssign: false,\n});\n"],"names":["memo","DropdownCell","useWindow","useComponentCssInjection","dropdownCellCss","useState","useLookupValues","useRef","useMemo","getSelectedOption","useCallback","selectedOption","isRpcSuccess","dispatchCustomEvent","jsx","Dropdown","Option","dataColumnAndKeyUnchanged","registerComponent"],"mappings":"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"}

package/cjs/cell-renderers/lookup-cell/LookupCell.js CHANGED Viewed

@@ -7,11 +7,9 @@ var react = require('react');
 const LookupCell = react.memo(function LookupCell2({
   column,
-  columnMap,
-  row
+  dataRow
 }) {
-  const dataIdx = columnMap[column.name];
-  const dataValue = row[dataIdx];
+  const dataValue = dataRow[column.name];
   const { initialValue: value } = vuuDataReact.useLookupValues(column, dataValue);
   return /* @__PURE__ */ jsxRuntime.jsx("span", { children: value?.label });
 }, vuuUtils.dataAndColumnUnchanged);

package/cjs/cell-renderers/lookup-cell/LookupCell.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"LookupCell.js","sources":["../../../../../packages/vuu-table-extras/src/cell-renderers/lookup-cell/LookupCell.tsx"],"sourcesContent":["import { useLookupValues } from \"@vuu-ui/vuu-data-react\";\nimport { TableCellRendererProps } from \"@vuu-ui/vuu-table-types\";\nimport { dataAndColumnUnchanged, registerComponent } from \"@vuu-ui/vuu-utils\";\nimport { memo } from \"react\";\n\nexport const LookupCell = memo(function LookupCell({\n column,\n ~~columnMap~~,\n ~~row,\n~~}: TableCellRendererProps) {\n const ~~dataIdx~~ = ~~columnMap~~[column.name]~~;\n const~~ ~~dataValue = row[dataIdx]~~ as string \| number;\n const { initialValue: value } = useLookupValues(column, dataValue);\n return <span>{value?.label}</span>;\n}, dataAndColumnUnchanged);\n\nregisterComponent(\"lookup-cell\", LookupCell, \"cell-renderer\", {\n userCanAssign: false,\n});\n"],"names":["memo","LookupCell","useLookupValues","jsx","dataAndColumnUnchanged","registerComponent"],"mappings":";;;;;;;AAKa,MAAA,UAAA,GAAaA,UAAK,CAAA,SAASC,WAAW,CAAA;AAAA,EACjD,MAAA;AAAA,EACA~~,SAAA~~;~~AAAA,EACA;~~AACF,CAA2B,EAAA;AACzB,EAAM,MAAA,~~OAAA~~,~~GAAU~~,~~SAAU~~,CAAA,MAAA,CAAO,IAAI,CAAA;AACrC,~~EAAM,MAAA,SAAA,GAAY,IAAI,OAAO,CAAA;AAC7B,~~EAAA,MAAM,EAAE,YAAc,EAAA,KAAA,EAAU,GAAAC,4BAAA,CAAgB,QAAQ,SAAS,CAAA;AACjE,EAAO,uBAAAC,cAAA,CAAC,MAAM,EAAA,EAAA,QAAA,EAAA,KAAA,EAAO,KAAM,EAAA,CAAA;AAC7B,CAAA,EAAGC,+BAAsB;AAEzBC,0BAAkB,CAAA,aAAA,EAAe,YAAY,eAAiB,EAAA;AAAA,EAC5D,aAAe,EAAA;AACjB,CAAC,CAAA;;;;"}
1	+ {"version":3,"file":"LookupCell.js","sources":["../../../../../packages/vuu-table-extras/src/cell-renderers/lookup-cell/LookupCell.tsx"],"sourcesContent":["import { useLookupValues } from \"@vuu-ui/vuu-data-react\";\nimport { TableCellRendererProps } from \"@vuu-ui/vuu-table-types\";\nimport { dataAndColumnUnchanged, registerComponent } from \"@vuu-ui/vuu-utils\";\nimport { memo } from \"react\";\n\nexport const LookupCell = memo(function LookupCell({\n column,\n dataRow,\n}: TableCellRendererProps) {\n const dataValue = dataRow[column.name] as string \| number;\n const { initialValue: value } = useLookupValues(column, dataValue);\n return <span>{value?.label}</span>;\n}, dataAndColumnUnchanged);\n\nregisterComponent(\"lookup-cell\", LookupCell, \"cell-renderer\", {\n userCanAssign: false,\n});\n"],"names":["memo","LookupCell","useLookupValues","jsx","dataAndColumnUnchanged","registerComponent"],"mappings":";;;;;;;AAKa,MAAA,UAAA,GAAaA,UAAK,CAAA,SAASC,WAAW,CAAA;AAAA,EACjD,MAAA;AAAA,EACA;AACF,CAA2B,EAAA;AACzB,EAAM,MAAA,SAAA,GAAY,OAAQ,CAAA,MAAA,CAAO,IAAI,CAAA;AACrC,EAAA,MAAM,EAAE,YAAc,EAAA,KAAA,EAAU,GAAAC,4BAAA,CAAgB,QAAQ,SAAS,CAAA;AACjE,EAAO,uBAAAC,cAAA,CAAC,MAAM,EAAA,EAAA,QAAA,EAAA,KAAA,EAAO,KAAM,EAAA,CAAA;AAC7B,CAAA,EAAGC,+BAAsB;AAEzBC,0BAAkB,CAAA,aAAA,EAAe,YAAY,eAAiB,EAAA;AAAA,EAC5D,aAAe,EAAA;AACjB,CAAC,CAAA;;;;"}

package/cjs/cell-renderers/pct-progress-cell/PctProgressCell.js CHANGED Viewed

@@ -19,14 +19,14 @@ const getPercentageValue = (value) => {
     return 0;
   }
 };
-const PctProgressCell = ({ column, columnMap, row }) => {
+const PctProgressCell = ({ column, dataRow }) => {
   const targetWindow = window.useWindow();
   styles.useComponentCssInjection({
     testId: "vuu-pct-progress-cell",
     css: PctProgressCell$1,
     window: targetWindow
   });
-  const value = row[columnMap[column.name]];
+  const value = dataRow[column.name];
   const percentageValue = getPercentageValue(value);
   const className = cx(classBase, {});
   return /* @__PURE__ */ jsxRuntime.jsxs(

package/cjs/cell-renderers/pct-progress-cell/PctProgressCell.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PctProgressCell.js","sources":["../../../../../packages/vuu-table-extras/src/cell-renderers/pct-progress-cell/PctProgressCell.tsx"],"sourcesContent":["import { TableCellProps } from \"@vuu-ui/vuu-table-types\";\nimport { registerComponent } from \"@vuu-ui/vuu-utils\";\nimport cx from \"clsx\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { CSSProperties } from \"react\";\n\nimport pctProgressCellCss from \"./PctProgressCell.css\";\n\nconst classBase = \"vuuPctProgressCell\";\n\nconst getPercentageValue = (value: number) => {\n if (value >= 0 && value <= 1) {\n return value * 100;\n } else if (value > 2) {\n return 0;\n } else if (value > 1) {\n return 100;\n } else {\n return 0;\n }\n};\n\nexport const PctProgressCell = ({ column, ~~columnMap,~~ ~~row~~ }: TableCellProps) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"vuu-pct-progress-cell\",\n css: pctProgressCellCss,\n window: targetWindow,\n });\n\n const value = ~~row~~[~~columnMap[~~column.name]] as number;\n const percentageValue = getPercentageValue(value);\n const className = cx(classBase, {});\n\n return (\n <div\n className={cx(className, {\n [`${classBase}-zero`]: percentageValue === 0,\n [`${classBase}-complete`]: percentageValue >= 100,\n })}\n tabIndex={-1}\n >\n <span\n className={`${classBase}-progressBar`}\n style={{ \"--progress-bar-pct\": `${percentageValue}%` } as CSSProperties}\n />\n <span className={`${classBase}-text`}>{`${percentageValue.toFixed(\n 2,\n )} %`}</span>\n </div>\n );\n};\n\nregisterComponent(\"vuu.pct-progress\", PctProgressCell, \"cell-renderer\", {\n description: \"Percentage formatter\",\n label: \"Percentage formatter\",\n serverDataType: \"double\",\n});\n"],"names":["useWindow","useComponentCssInjection","pctProgressCellCss","jsxs","jsx","registerComponent"],"mappings":";;;;;;;;;AASA,MAAM,SAAY,GAAA,oBAAA;AAElB,MAAM,kBAAA,GAAqB,CAAC,KAAkB,KAAA;AAC5C,EAAI,IAAA,KAAA,IAAS,CAAK,IAAA,KAAA,IAAS,CAAG,EAAA;AAC5B,IAAA,OAAO,KAAQ,GAAA,GAAA;AAAA,GACjB,MAAA,IAAW,QAAQ,CAAG,EAAA;AACpB,IAAO,OAAA,CAAA;AAAA,GACT,MAAA,IAAW,QAAQ,CAAG,EAAA;AACpB,IAAO,OAAA,GAAA;AAAA,GACF,MAAA;AACL,IAAO,OAAA,CAAA;AAAA;AAEX,CAAA;AAEO,MAAM,~~kBAAkB~~,CAAC,EAAE,~~MAAQ~~,~~EAAA~~,~~SAAA~~,~~EAAW,KAA0B,~~KAAA;~~AAC7E~~,EAAA,MAAM,eAAeA,gBAAU,EAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,uBAAA;AAAA,IACR,GAAK,EAAAC,iBAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,~~EAAA~~,~~MAAM~~,~~KAAQ~~,~~GAAA~~,~~GAAA~~,~~CAAI,SAAU,~~CAAA,MAAA,CAAO,IAAI,~~CAAC,~~CAAA;~~AACxC~~,EAAM,MAAA,eAAA,GAAkB,mBAAmB,KAAK,CAAA;AAChD,EAAA,MAAM,SAAY,GAAA,EAAA,CAAG,SAAW,EAAA,EAAE,CAAA;AAElC,EACE,uBAAAC,eAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAW,GAAG,SAAW,EAAA;AAAA,QACvB,CAAC,CAAA,EAAG,SAAS,CAAA,KAAA,CAAO,GAAG,eAAoB,KAAA,CAAA;AAAA,QAC3C,CAAC,CAAA,EAAG,SAAS,CAAA,SAAA,CAAW,GAAG,eAAmB,IAAA;AAAA,OAC/C,CAAA;AAAA,MACD,QAAU,EAAA,CAAA,CAAA;AAAA,MAEV,QAAA,EAAA;AAAA,wBAAAC,cAAA;AAAA,UAAC,MAAA;AAAA,UAAA;AAAA,YACC,SAAA,EAAW,GAAG,SAAS,CAAA,YAAA,CAAA;AAAA,YACvB,KAAO,EAAA,EAAE,oBAAsB,EAAA,CAAA,EAAG,eAAe,CAAI,CAAA,CAAA;AAAA;AAAA,SACvD;AAAA,uCACC,MAAK,EAAA,EAAA,SAAA,EAAW,GAAG,SAAS,CAAA,KAAA,CAAA,EAAU,aAAG,eAAgB,CAAA,OAAA;AAAA,UACxD;AAAA,SACD,CAAK,EAAA,CAAA,EAAA;AAAA;AAAA;AAAA,GACR;AAEJ;AAEAC,0BAAkB,CAAA,kBAAA,EAAoB,iBAAiB,eAAiB,EAAA;AAAA,EACtE,WAAa,EAAA,sBAAA;AAAA,EACb,KAAO,EAAA,sBAAA;AAAA,EACP,cAAgB,EAAA;AAClB,CAAC,CAAA;;;;"}
1	+ {"version":3,"file":"PctProgressCell.js","sources":["../../../../../packages/vuu-table-extras/src/cell-renderers/pct-progress-cell/PctProgressCell.tsx"],"sourcesContent":["import { TableCellProps } from \"@vuu-ui/vuu-table-types\";\nimport { registerComponent } from \"@vuu-ui/vuu-utils\";\nimport cx from \"clsx\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { CSSProperties } from \"react\";\n\nimport pctProgressCellCss from \"./PctProgressCell.css\";\n\nconst classBase = \"vuuPctProgressCell\";\n\nconst getPercentageValue = (value: number) => {\n if (value >= 0 && value <= 1) {\n return value * 100;\n } else if (value > 2) {\n return 0;\n } else if (value > 1) {\n return 100;\n } else {\n return 0;\n }\n};\n\nexport const PctProgressCell = ({ column, dataRow }: TableCellProps) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"vuu-pct-progress-cell\",\n css: pctProgressCellCss,\n window: targetWindow,\n });\n\n const value = dataRow[column.name] as number;\n const percentageValue = getPercentageValue(value);\n const className = cx(classBase, {});\n\n return (\n <div\n className={cx(className, {\n [`${classBase}-zero`]: percentageValue === 0,\n [`${classBase}-complete`]: percentageValue >= 100,\n })}\n tabIndex={-1}\n >\n <span\n className={`${classBase}-progressBar`}\n style={{ \"--progress-bar-pct\": `${percentageValue}%` } as CSSProperties}\n />\n <span className={`${classBase}-text`}>{`${percentageValue.toFixed(\n 2,\n )} %`}</span>\n </div>\n );\n};\n\nregisterComponent(\"vuu.pct-progress\", PctProgressCell, \"cell-renderer\", {\n description: \"Percentage formatter\",\n label: \"Percentage formatter\",\n serverDataType: \"double\",\n});\n"],"names":["useWindow","useComponentCssInjection","pctProgressCellCss","jsxs","jsx","registerComponent"],"mappings":";;;;;;;;;AASA,MAAM,SAAY,GAAA,oBAAA;AAElB,MAAM,kBAAA,GAAqB,CAAC,KAAkB,KAAA;AAC5C,EAAI,IAAA,KAAA,IAAS,CAAK,IAAA,KAAA,IAAS,CAAG,EAAA;AAC5B,IAAA,OAAO,KAAQ,GAAA,GAAA;AAAA,GACjB,MAAA,IAAW,QAAQ,CAAG,EAAA;AACpB,IAAO,OAAA,CAAA;AAAA,GACT,MAAA,IAAW,QAAQ,CAAG,EAAA;AACpB,IAAO,OAAA,GAAA;AAAA,GACF,MAAA;AACL,IAAO,OAAA,CAAA;AAAA;AAEX,CAAA;AAEO,MAAM,eAAkB,GAAA,CAAC,EAAE,MAAA,EAAQ,SAA8B,KAAA;AACtE,EAAA,MAAM,eAAeA,gBAAU,EAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,uBAAA;AAAA,IACR,GAAK,EAAAC,iBAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EAAM,MAAA,KAAA,GAAQ,OAAQ,CAAA,MAAA,CAAO,IAAI,CAAA;AACjC,EAAM,MAAA,eAAA,GAAkB,mBAAmB,KAAK,CAAA;AAChD,EAAA,MAAM,SAAY,GAAA,EAAA,CAAG,SAAW,EAAA,EAAE,CAAA;AAElC,EACE,uBAAAC,eAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAW,GAAG,SAAW,EAAA;AAAA,QACvB,CAAC,CAAA,EAAG,SAAS,CAAA,KAAA,CAAO,GAAG,eAAoB,KAAA,CAAA;AAAA,QAC3C,CAAC,CAAA,EAAG,SAAS,CAAA,SAAA,CAAW,GAAG,eAAmB,IAAA;AAAA,OAC/C,CAAA;AAAA,MACD,QAAU,EAAA,CAAA,CAAA;AAAA,MAEV,QAAA,EAAA;AAAA,wBAAAC,cAAA;AAAA,UAAC,MAAA;AAAA,UAAA;AAAA,YACC,SAAA,EAAW,GAAG,SAAS,CAAA,YAAA,CAAA;AAAA,YACvB,KAAO,EAAA,EAAE,oBAAsB,EAAA,CAAA,EAAG,eAAe,CAAI,CAAA,CAAA;AAAA;AAAA,SACvD;AAAA,uCACC,MAAK,EAAA,EAAA,SAAA,EAAW,GAAG,SAAS,CAAA,KAAA,CAAA,EAAU,aAAG,eAAgB,CAAA,OAAA;AAAA,UACxD;AAAA,SACD,CAAK,EAAA,CAAA,EAAA;AAAA;AAAA;AAAA,GACR;AAEJ;AAEAC,0BAAkB,CAAA,kBAAA,EAAoB,iBAAiB,eAAiB,EAAA;AAAA,EACtE,WAAa,EAAA,sBAAA;AAAA,EACb,KAAO,EAAA,sBAAA;AAAA,EACP,cAAgB,EAAA;AAClB,CAAC,CAAA;;;;"}

package/cjs/cell-renderers/progress-cell/ProgressCell.js CHANGED Viewed

@@ -8,7 +8,7 @@ var window = require('@salt-ds/window');
 var ProgressCell$1 = require('./ProgressCell.css.js');
 const classBase = "vuuProgressCell";
-const ProgressCell = ({ column, columnMap, row }) => {
+const ProgressCell = ({ column, dataRow }) => {
   const targetWindow = window.useWindow();
   styles.useComponentCssInjection({
     testId: "vuu-progress-cell",
@@ -16,13 +16,13 @@ const ProgressCell = ({ column, columnMap, row }) => {
     window: targetWindow
   });
   const { name, type } = column;
-  const value = row[columnMap[name]];
+  const value = dataRow[name];
   let showProgress = false;
   let percentage = 0;
   if (vuuUtils.isTypeDescriptor(type) && vuuUtils.isColumnTypeRenderer(type.renderer)) {
     const { associatedField } = type.renderer;
     if (associatedField) {
-      const associatedValue = row[columnMap[associatedField]];
+      const associatedValue = dataRow[associatedField];
       if (vuuUtils.isValidNumber(value) && vuuUtils.isValidNumber(associatedValue)) {
         percentage = Math.min(Math.round(value / associatedValue * 100), 100);
         percentage = Math.min(Math.round(value / associatedValue * 100), 100);

package/cjs/cell-renderers/progress-cell/ProgressCell.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ProgressCell.js","sources":["../../../../../packages/vuu-table-extras/src/cell-renderers/progress-cell/ProgressCell.tsx"],"sourcesContent":["import { TableCellProps } from \"@vuu-ui/vuu-table-types\";\nimport {\n isColumnTypeRenderer,\n isTypeDescriptor,\n isValidNumber,\n registerComponent,\n} from \"@vuu-ui/vuu-utils\";\nimport cx from \"clsx\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { CSSProperties } from \"react\";\n\nimport progressCellCss from \"./ProgressCell.css\";\n\nconst classBase = \"vuuProgressCell\";\n\nconst ProgressCell = ({ column, ~~columnMap,~~ ~~row~~ }: TableCellProps) => {\n //TODO what about click handling\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"vuu-progress-cell\",\n css: progressCellCss,\n window: targetWindow,\n });\n\n const { name, type } = column;\n const value = ~~row~~[~~columnMap[~~name]];\n let showProgress = false;\n let percentage = 0;\n\n if (isTypeDescriptor(type) && isColumnTypeRenderer(type.renderer)) {\n const { associatedField } = type.renderer;\n if (associatedField) {\n const associatedValue = ~~row~~[~~columnMap[~~associatedField]];\n if (isValidNumber(value) && isValidNumber(associatedValue)) {\n percentage = Math.min(Math.round((value / associatedValue) * 100), 100);\n percentage = Math.min(Math.round((value / associatedValue) * 100), 100);\n showProgress = isFinite(percentage);\n } else {\n // Temp workaround for bug on server that sends aggregated values as strings\n const floatValue = parseFloat(value as string);\n if (Number.isFinite(floatValue)) {\n const floatOtherValue = parseFloat(associatedValue as string);\n if (Number.isFinite(floatOtherValue)) {\n percentage = Math.min(\n Math.round((floatValue / floatOtherValue) * 100),\n 100,\n );\n showProgress = isFinite(percentage);\n }\n }\n }\n } else {\n throw Error(\"ProgressCell associatedField is required to render\");\n }\n }\n\n const className = cx(classBase, {});\n\n return (\n <div className={className} tabIndex={-1}>\n {showProgress ? (\n <span className={`${classBase}-track`}>\n <span className={`${classBase}-bg`} />\n <span\n className={`${classBase}-bar`}\n style={\n { \"--progress-bar-pct\": `-${100 - percentage}%` } as CSSProperties\n }\n />\n </span>\n ) : null}\n <span className={`${classBase}-text`}>{`${percentage} %`}</span>\n </div>\n );\n};\n\nregisterComponent(\"vuu.progress\", ProgressCell, \"cell-renderer\", {\n description: \"Progress formatter\",\n label: \"Progress formatter\",\n serverDataType: [\"long\", \"int\", \"double\"],\n // Not until we provide settings for associaetd field\n userCanAssign: false,\n});\n"],"names":["useWindow","useComponentCssInjection","progressCellCss","isTypeDescriptor","isColumnTypeRenderer","isValidNumber","jsxs","jsx","registerComponent"],"mappings":";;;;;;;;;AAcA,MAAM,SAAY,GAAA,iBAAA;AAElB,MAAM,~~eAAe~~,CAAC,EAAE,~~MAAQ~~,~~EAAA~~,~~SAAA~~,~~EAAW,KAA0B,~~KAAA;~~AAEnE~~,EAAA,MAAM,eAAeA,gBAAU,EAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,mBAAA;AAAA,IACR,GAAK,EAAAC,cAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EAAM,MAAA,EAAE,IAAM,EAAA,IAAA,EAAS,GAAA,MAAA;AACvB,~~EAAA~~,~~MAAM~~,~~KAAQ~~,~~GAAA~~,~~GAAA~~,~~CAAI,SAAU,CAAA,~~IAAI,~~CAAC,~~CAAA;~~AACjC~~,EAAA,IAAI,YAAe,GAAA,KAAA;AACnB,EAAA,IAAI,UAAa,GAAA,CAAA;AAEjB,EAAA,IAAIC,0BAAiB,IAAI,CAAA,IAAKC,6BAAqB,CAAA,IAAA,CAAK,QAAQ,CAAG,EAAA;AACjE,IAAM,MAAA,EAAE,eAAgB,EAAA,GAAI,IAAK,CAAA,QAAA;AACjC,IAAA,IAAI,eAAiB,EAAA;AACnB,~~MAAA,~~MAAM,~~eAAkB~~,~~GAAA~~,~~GAAA~~,~~CAAI~~,~~SAAU,CAAA,~~eAAe,~~CAAC,~~CAAA;~~AACtD~~,MAAA,IAAIC,sBAAc,CAAA,KAAK,CAAK,IAAAA,sBAAA,CAAc,eAAe,CAAG,EAAA;AAC1D,QAAa,UAAA,GAAA,IAAA,CAAK,IAAI,IAAK,CAAA,KAAA,CAAO,QAAQ,eAAmB,GAAA,GAAG,GAAG,GAAG,CAAA;AACtE,QAAa,UAAA,GAAA,IAAA,CAAK,IAAI,IAAK,CAAA,KAAA,CAAO,QAAQ,eAAmB,GAAA,GAAG,GAAG,GAAG,CAAA;AACtE,QAAA,YAAA,GAAe,SAAS,UAAU,CAAA;AAAA,OAC7B,MAAA;AAEL,QAAM,MAAA,UAAA,GAAa,WAAW,KAAe,CAAA;AAC7C,QAAI,IAAA,MAAA,CAAO,QAAS,CAAA,UAAU,CAAG,EAAA;AAC/B,UAAM,MAAA,eAAA,GAAkB,WAAW,eAAyB,CAAA;AAC5D,UAAI,IAAA,MAAA,CAAO,QAAS,CAAA,eAAe,CAAG,EAAA;AACpC,YAAA,UAAA,GAAa,IAAK,CAAA,GAAA;AAAA,cAChB,IAAK,CAAA,KAAA,CAAO,UAAa,GAAA,eAAA,GAAmB,GAAG,CAAA;AAAA,cAC/C;AAAA,aACF;AACA,YAAA,YAAA,GAAe,SAAS,UAAU,CAAA;AAAA;AACpC;AACF;AACF,KACK,MAAA;AACL,MAAA,MAAM,MAAM,oDAAoD,CAAA;AAAA;AAClE;AAGF,EAAA,MAAM,SAAY,GAAA,EAAA,CAAG,SAAW,EAAA,EAAE,CAAA;AAElC,EAAA,uBACGC,eAAA,CAAA,KAAA,EAAA,EAAI,SAAsB,EAAA,QAAA,EAAU,CAClC,CAAA,EAAA,QAAA,EAAA;AAAA,IAAA,YAAA,mBACEA,eAAA,CAAA,MAAA,EAAA,EAAK,SAAW,EAAA,CAAA,EAAG,SAAS,CAC3B,MAAA,CAAA,EAAA,QAAA,EAAA;AAAA,sBAAAC,cAAA,CAAC,MAAK,EAAA,EAAA,SAAA,EAAW,CAAG,EAAA,SAAS,CAAO,GAAA,CAAA,EAAA,CAAA;AAAA,sBACpCA,cAAA;AAAA,QAAC,MAAA;AAAA,QAAA;AAAA,UACC,SAAA,EAAW,GAAG,SAAS,CAAA,IAAA,CAAA;AAAA,UACvB,OACE,EAAE,oBAAA,EAAsB,CAAI,CAAA,EAAA,GAAA,GAAM,UAAU,CAAI,CAAA,CAAA;AAAA;AAAA;AAEpD,KAAA,EACF,CACE,GAAA,IAAA;AAAA,oBACJA,cAAA,CAAC,UAAK,SAAW,EAAA,CAAA,EAAG,SAAS,CAAU,KAAA,CAAA,EAAA,QAAA,EAAA,CAAA,EAAG,UAAU,CAAK,EAAA,CAAA,EAAA;AAAA,GAC3D,EAAA,CAAA;AAEJ,CAAA;AAEAC,0BAAkB,CAAA,cAAA,EAAgB,cAAc,eAAiB,EAAA;AAAA,EAC/D,WAAa,EAAA,oBAAA;AAAA,EACb,KAAO,EAAA,oBAAA;AAAA,EACP,cAAgB,EAAA,CAAC,MAAQ,EAAA,KAAA,EAAO,QAAQ,CAAA;AAAA;AAAA,EAExC,aAAe,EAAA;AACjB,CAAC,CAAA;;"}
1	+ {"version":3,"file":"ProgressCell.js","sources":["../../../../../packages/vuu-table-extras/src/cell-renderers/progress-cell/ProgressCell.tsx"],"sourcesContent":["import { TableCellProps } from \"@vuu-ui/vuu-table-types\";\nimport {\n isColumnTypeRenderer,\n isTypeDescriptor,\n isValidNumber,\n registerComponent,\n} from \"@vuu-ui/vuu-utils\";\nimport cx from \"clsx\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { CSSProperties } from \"react\";\n\nimport progressCellCss from \"./ProgressCell.css\";\n\nconst classBase = \"vuuProgressCell\";\n\nconst ProgressCell = ({ column, dataRow }: TableCellProps) => {\n //TODO what about click handling\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"vuu-progress-cell\",\n css: progressCellCss,\n window: targetWindow,\n });\n\n const { name, type } = column;\n const value = dataRow[name];\n let showProgress = false;\n let percentage = 0;\n\n if (isTypeDescriptor(type) && isColumnTypeRenderer(type.renderer)) {\n const { associatedField } = type.renderer;\n if (associatedField) {\n const associatedValue = dataRow[associatedField];\n if (isValidNumber(value) && isValidNumber(associatedValue)) {\n percentage = Math.min(Math.round((value / associatedValue) * 100), 100);\n percentage = Math.min(Math.round((value / associatedValue) * 100), 100);\n showProgress = isFinite(percentage);\n } else {\n // Temp workaround for bug on server that sends aggregated values as strings\n const floatValue = parseFloat(value as string);\n if (Number.isFinite(floatValue)) {\n const floatOtherValue = parseFloat(associatedValue as string);\n if (Number.isFinite(floatOtherValue)) {\n percentage = Math.min(\n Math.round((floatValue / floatOtherValue) * 100),\n 100,\n );\n showProgress = isFinite(percentage);\n }\n }\n }\n } else {\n throw Error(\"ProgressCell associatedField is required to render\");\n }\n }\n\n const className = cx(classBase, {});\n\n return (\n <div className={className} tabIndex={-1}>\n {showProgress ? (\n <span className={`${classBase}-track`}>\n <span className={`${classBase}-bg`} />\n <span\n className={`${classBase}-bar`}\n style={\n { \"--progress-bar-pct\": `-${100 - percentage}%` } as CSSProperties\n }\n />\n </span>\n ) : null}\n <span className={`${classBase}-text`}>{`${percentage} %`}</span>\n </div>\n );\n};\n\nregisterComponent(\"vuu.progress\", ProgressCell, \"cell-renderer\", {\n description: \"Progress formatter\",\n label: \"Progress formatter\",\n serverDataType: [\"long\", \"int\", \"double\"],\n // Not until we provide settings for associaetd field\n userCanAssign: false,\n});\n"],"names":["useWindow","useComponentCssInjection","progressCellCss","isTypeDescriptor","isColumnTypeRenderer","isValidNumber","jsxs","jsx","registerComponent"],"mappings":";;;;;;;;;AAcA,MAAM,SAAY,GAAA,iBAAA;AAElB,MAAM,YAAe,GAAA,CAAC,EAAE,MAAA,EAAQ,SAA8B,KAAA;AAE5D,EAAA,MAAM,eAAeA,gBAAU,EAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,mBAAA;AAAA,IACR,GAAK,EAAAC,cAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EAAM,MAAA,EAAE,IAAM,EAAA,IAAA,EAAS,GAAA,MAAA;AACvB,EAAM,MAAA,KAAA,GAAQ,QAAQ,IAAI,CAAA;AAC1B,EAAA,IAAI,YAAe,GAAA,KAAA;AACnB,EAAA,IAAI,UAAa,GAAA,CAAA;AAEjB,EAAA,IAAIC,0BAAiB,IAAI,CAAA,IAAKC,6BAAqB,CAAA,IAAA,CAAK,QAAQ,CAAG,EAAA;AACjE,IAAM,MAAA,EAAE,eAAgB,EAAA,GAAI,IAAK,CAAA,QAAA;AACjC,IAAA,IAAI,eAAiB,EAAA;AACnB,MAAM,MAAA,eAAA,GAAkB,QAAQ,eAAe,CAAA;AAC/C,MAAA,IAAIC,sBAAc,CAAA,KAAK,CAAK,IAAAA,sBAAA,CAAc,eAAe,CAAG,EAAA;AAC1D,QAAa,UAAA,GAAA,IAAA,CAAK,IAAI,IAAK,CAAA,KAAA,CAAO,QAAQ,eAAmB,GAAA,GAAG,GAAG,GAAG,CAAA;AACtE,QAAa,UAAA,GAAA,IAAA,CAAK,IAAI,IAAK,CAAA,KAAA,CAAO,QAAQ,eAAmB,GAAA,GAAG,GAAG,GAAG,CAAA;AACtE,QAAA,YAAA,GAAe,SAAS,UAAU,CAAA;AAAA,OAC7B,MAAA;AAEL,QAAM,MAAA,UAAA,GAAa,WAAW,KAAe,CAAA;AAC7C,QAAI,IAAA,MAAA,CAAO,QAAS,CAAA,UAAU,CAAG,EAAA;AAC/B,UAAM,MAAA,eAAA,GAAkB,WAAW,eAAyB,CAAA;AAC5D,UAAI,IAAA,MAAA,CAAO,QAAS,CAAA,eAAe,CAAG,EAAA;AACpC,YAAA,UAAA,GAAa,IAAK,CAAA,GAAA;AAAA,cAChB,IAAK,CAAA,KAAA,CAAO,UAAa,GAAA,eAAA,GAAmB,GAAG,CAAA;AAAA,cAC/C;AAAA,aACF;AACA,YAAA,YAAA,GAAe,SAAS,UAAU,CAAA;AAAA;AACpC;AACF;AACF,KACK,MAAA;AACL,MAAA,MAAM,MAAM,oDAAoD,CAAA;AAAA;AAClE;AAGF,EAAA,MAAM,SAAY,GAAA,EAAA,CAAG,SAAW,EAAA,EAAE,CAAA;AAElC,EAAA,uBACGC,eAAA,CAAA,KAAA,EAAA,EAAI,SAAsB,EAAA,QAAA,EAAU,CAClC,CAAA,EAAA,QAAA,EAAA;AAAA,IAAA,YAAA,mBACEA,eAAA,CAAA,MAAA,EAAA,EAAK,SAAW,EAAA,CAAA,EAAG,SAAS,CAC3B,MAAA,CAAA,EAAA,QAAA,EAAA;AAAA,sBAAAC,cAAA,CAAC,MAAK,EAAA,EAAA,SAAA,EAAW,CAAG,EAAA,SAAS,CAAO,GAAA,CAAA,EAAA,CAAA;AAAA,sBACpCA,cAAA;AAAA,QAAC,MAAA;AAAA,QAAA;AAAA,UACC,SAAA,EAAW,GAAG,SAAS,CAAA,IAAA,CAAA;AAAA,UACvB,OACE,EAAE,oBAAA,EAAsB,CAAI,CAAA,EAAA,GAAA,GAAM,UAAU,CAAI,CAAA,CAAA;AAAA;AAAA;AAEpD,KAAA,EACF,CACE,GAAA,IAAA;AAAA,oBACJA,cAAA,CAAC,UAAK,SAAW,EAAA,CAAA,EAAG,SAAS,CAAU,KAAA,CAAA,EAAA,QAAA,EAAA,CAAA,EAAG,UAAU,CAAK,EAAA,CAAA,EAAA;AAAA,GAC3D,EAAA,CAAA;AAEJ,CAAA;AAEAC,0BAAkB,CAAA,cAAA,EAAgB,cAAc,eAAiB,EAAA;AAAA,EAC/D,WAAa,EAAA,oBAAA;AAAA,EACb,KAAO,EAAA,oBAAA;AAAA,EACP,cAAgB,EAAA,CAAC,MAAQ,EAAA,KAAA,EAAO,QAAQ,CAAA;AAAA;AAAA,EAExC,aAAe,EAAA;AACjB,CAAC,CAAA;;"}

package/cjs/column-expression-input/useColumnExpressionSuggestionProvider.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useColumnExpressionSuggestionProvider.js","sources":["../../../../packages/vuu-table-extras/src/column-expression-input/useColumnExpressionSuggestionProvider.ts"],"sourcesContent":["import {\n AnnotationType,\n Completion,\n EditorView,\n getRelationalOperators,\n numericOperators,\n stringOperators,\n toSuggestions,\n} from \"@vuu-ui/vuu-codemirror\";\nimport {\n getTypeaheadParams,\n useTypeaheadSuggestions,\n} from \"@vuu-ui/vuu-data-react\";\nimport { ColumnDescriptor } from \"@vuu-ui/vuu-table-types\";\nimport { VuuTable } from \"@vuu-ui/vuu-protocol-types\";\nimport { isNumericColumn, isTextColumn } from \"@vuu-ui/vuu-utils\";\nimport { useCallback, useRef } from \"react\";\nimport {\n ColumnFunctionDescriptor,\n columnFunctionDescriptors,\n} from \"./column-function-descriptors\";\nimport { functionDocInfo } from \"./functionDocInfo\";\nimport {\n ColumnExpressionOperator,\n ColumnExpressionSuggestionType,\n IExpressionSuggestionProvider,\n} from \"./useColumnExpressionEditor\";\n\nconst NO_OPERATORS = [] as Completion[];\n\nconst withApplySpace = (suggestions: Completion[]): Completion[] =>\n suggestions.map((suggestion) => ({\n ...suggestion,\n apply: (suggestion.apply ?? suggestion.label) + \" \",\n }));\n\ntype ColumnOptions = {\n functionName?: string;\n operator?: ColumnExpressionOperator;\n prefix?: string;\n};\n\nconst getValidColumns = (\n columns: ColumnDescriptor[],\n { functionName, operator }: ColumnOptions,\n) => {\n if (operator) {\n return columns.filter(isNumericColumn);\n } else if (functionName) {\n const fn = columnFunctionDescriptors.find((f) => f.name === functionName);\n if (fn) {\n switch (fn.accepts) {\n case \"string\":\n return columns.filter(isTextColumn);\n case \"number\":\n return columns.filter(isNumericColumn);\n default:\n return columns;\n }\n }\n }\n return columns;\n};\n\nconst getColumns = (columns: ColumnDescriptor[], options: ColumnOptions) => {\n const validColumns = getValidColumns(columns, options);\n return validColumns.map((column) => {\n const label = column.label ?? column.name;\n return {\n apply: options.prefix ? `${options.prefix}${column.name}` : column.name,\n label,\n boost: 5,\n type: \"column\",\n expressionType: column.serverDataType,\n };\n });\n};\n\n// prettier-ignore\nconst arithmeticOperators = [\n { apply: \"* \", boost: 2, label: \"\", type: \"operator\" },\n { apply: \"/ \", boost: 2, label: \"/\", type: \"operator\" },\n { apply: \"+ \", boost: 2, label: \"+\", type: \"operator\" },\n { apply: \"- \", boost: 2, label: \"-\", type: \"operator\" },\n];\n\nconst getOperators = (column?: ColumnDescriptor) => {\n if (column === undefined \|\| isNumericColumn(column)) {\n return arithmeticOperators;\n } else {\n return NO_OPERATORS;\n }\n};\n\nconst getConditionOperators = (column: ColumnDescriptor) => {\n switch (column.serverDataType) {\n case \"string\":\n case \"char\":\n return withApplySpace(stringOperators /, startsWith/);\n case \"int\":\n case \"long\":\n case \"double\":\n return withApplySpace(numericOperators);\n }\n};\n\nconst toFunctionCompletion = (\n functionDescriptor: ColumnFunctionDescriptor,\n) => ({\n apply: `${functionDescriptor.name}( `,\n boost: 2,\n expressionType: functionDescriptor.type,\n info: () => functionDocInfo(functionDescriptor),\n label: functionDescriptor.name,\n type: \"function\",\n});\n\nconst getAcceptedTypes = (fn?: ColumnFunctionDescriptor) => {\n if (fn) {\n if (typeof fn.accepts === \"string\") {\n return fn.accepts;\n } else if (Array.isArray(fn.accepts)) {\n if (fn.accepts.every((s) => s === \"string\")) {\n return \"string\";\n } else {\n return \"any\";\n }\n }\n }\n return \"any\";\n};\n\nconst functions: Completion[] =\n columnFunctionDescriptors.map(toFunctionCompletion);\n\nconst getFunctions = ({ functionName }: ColumnOptions) => {\n if (functionName) {\n const fn = columnFunctionDescriptors.find((f) => f.name === functionName);\n const acceptedTypes = getAcceptedTypes(fn);\n if (fn) {\n switch (acceptedTypes) {\n case \"string\":\n return columnFunctionDescriptors\n .filter((f) => f.type === \"string\" \|\| f.type === \"variable\")\n .map(toFunctionCompletion);\n case \"number\":\n return columnFunctionDescriptors\n .filter((f) => f.type === \"number\" \|\| f.type === \"variable\")\n .map(toFunctionCompletion);\n default:\n }\n }\n }\n return functions;\n};\n\nexport interface SuggestionProviderHookProps {\n columns: ColumnDescriptor[];\n table: VuuTable;\n}\n\nconst NONE = {};\n\nexport const useColumnExpressionSuggestionProvider = ({\n columns,\n table,\n}: SuggestionProviderHookProps): IExpressionSuggestionProvider => {\n const findColumn = useCallback(\n (name?: string) =>\n name ? columns.find((col) => col.name === name) : undefined,\n [columns],\n );\n\n const latestSuggestionsRef = useRef<Completion[]>(undefined);\n const getTypeaheadSuggestions = useTypeaheadSuggestions();\n\n const getSuggestions: IExpressionSuggestionProvider[\"getSuggestions\"] =\n useCallback(\n async (suggestionType, options = NONE): Promise<Completion[]> => {\n const { columnName, functionName, operator, prefix } = options;\n\n switch (suggestionType) {\n case \"expression\": {\n const suggestions = await withApplySpace(\n getColumns(columns, { functionName, prefix }),\n ).concat(getFunctions(options));\n return (latestSuggestionsRef.current = suggestions);\n }\n case \"column\": {\n const suggestions = await getColumns(columns, options);\n return (latestSuggestionsRef.current = withApplySpace(suggestions));\n }\n case \"operator\": {\n const suggestions = await getOperators(findColumn(columnName));\n return (latestSuggestionsRef.current = withApplySpace(suggestions));\n }\n case \"relational-operator\": {\n const suggestions = await getRelationalOperators(\n findColumn(columnName),\n );\n return (latestSuggestionsRef.current = withApplySpace(suggestions));\n }\n case \"condition-operator\":\n {\n const column = findColumn(columnName);\n if (column) {\n const suggestions = await getConditionOperators(column);\n if (suggestions) {\n return (latestSuggestionsRef.current =\n withApplySpace(suggestions));\n }\n }\n }\n break;\n case \"columnValue\":\n if (columnName && operator) {\n // const column = findColumn(columnName);\n const params = getTypeaheadParams(\n table,\n columnName /, startsWith*/,\n );\n const suggestions = await getTypeaheadSuggestions(params);\n if (suggestions) {\n latestSuggestionsRef.current = toSuggestions(suggestions, {\n suffix: \"\",\n });\n\n latestSuggestionsRef.current.forEach((suggestion) => {\n suggestion.apply = (\n view: EditorView,\n completion: Completion,\n from: number,\n ) => {\n const annotation = new AnnotationType<Completion>();\n const cursorPos = from + completion.label.length + 1;\n view.dispatch({\n changes: { from, insert: completion.label },\n selection: { anchor: cursorPos, head: cursorPos },\n annotations: annotation.of(completion),\n });\n };\n });\n }\n return latestSuggestionsRef.current \|\| [];\n }\n break;\n }\n\n return [];\n },\n [columns, findColumn, getTypeaheadSuggestions, table],\n );\n\n const isPartialMatch = useCallback(\n async (\n valueType: ColumnExpressionSuggestionType,\n columnName?: string,\n pattern?: string,\n ) => {\n const { current: latestSuggestions } = latestSuggestionsRef;\n let maybe = false;\n const suggestions =\n latestSuggestions \|\| (await getSuggestions(valueType, { columnName }));\n if (pattern && suggestions) {\n for (const option of suggestions) {\n if (option.label === pattern) {\n return false;\n } else if (option.label.startsWith(pattern)) {\n maybe = true;\n }\n }\n }\n return maybe;\n },\n [getSuggestions],\n );\n\n return {\n getSuggestions,\n isPartialMatch,\n };\n};\n"],"names":["isNumericColumn","columnFunctionDescriptors","isTextColumn","stringOperators","numericOperators","functionDocInfo","useCallback","useRef","useTypeaheadSuggestions","getRelationalOperators","getTypeaheadParams","toSuggestions","AnnotationType"],"mappings":"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"}
1	+ {"version":3,"file":"useColumnExpressionSuggestionProvider.js","sources":["../../../../packages/vuu-table-extras/src/column-expression-input/useColumnExpressionSuggestionProvider.ts"],"sourcesContent":["import {\n AnnotationType,\n Completion,\n EditorView,\n getRelationalOperators,\n numericOperators,\n stringOperators,\n toSuggestions,\n} from \"@vuu-ui/vuu-codemirror\";\nimport {\n getTypeaheadParams,\n useTypeaheadSuggestions,\n} from \"@vuu-ui/vuu-data-react\";\nimport { ColumnDescriptor } from \"@vuu-ui/vuu-table-types\";\nimport { VuuTable } from \"@vuu-ui/vuu-protocol-types\";\nimport { isNumericColumn, isTextColumn } from \"@vuu-ui/vuu-utils\";\nimport { useCallback, useRef } from \"react\";\nimport {\n ColumnFunctionDescriptor,\n columnFunctionDescriptors,\n} from \"./column-function-descriptors\";\nimport { functionDocInfo } from \"./functionDocInfo\";\nimport {\n ColumnExpressionOperator,\n ColumnExpressionSuggestionType,\n IExpressionSuggestionProvider,\n} from \"./useColumnExpressionEditor\";\n\nconst NO_OPERATORS = [] as Completion[];\n\nconst withApplySpace = (suggestions: Completion[]): Completion[] =>\n suggestions.map((suggestion) => ({\n ...suggestion,\n apply: (suggestion.apply ?? suggestion.label) + \" \",\n }));\n\ntype ColumnOptions = {\n functionName?: string;\n operator?: ColumnExpressionOperator;\n prefix?: string;\n};\n\nconst getValidColumns = (\n columns: readonly ColumnDescriptor[],\n { functionName, operator }: ColumnOptions,\n) => {\n if (operator) {\n return columns.filter(isNumericColumn);\n } else if (functionName) {\n const fn = columnFunctionDescriptors.find((f) => f.name === functionName);\n if (fn) {\n switch (fn.accepts) {\n case \"string\":\n return columns.filter(isTextColumn);\n case \"number\":\n return columns.filter(isNumericColumn);\n default:\n return columns;\n }\n }\n }\n return columns;\n};\n\nconst getColumns = (\n columns: readonly ColumnDescriptor[],\n options: ColumnOptions,\n) => {\n const validColumns = getValidColumns(columns, options);\n return validColumns.map((column) => {\n const label = column.label ?? column.name;\n return {\n apply: options.prefix ? `${options.prefix}${column.name}` : column.name,\n label,\n boost: 5,\n type: \"column\",\n expressionType: column.serverDataType,\n };\n });\n};\n\n// prettier-ignore\nconst arithmeticOperators = [\n { apply: \"* \", boost: 2, label: \"\", type: \"operator\" },\n { apply: \"/ \", boost: 2, label: \"/\", type: \"operator\" },\n { apply: \"+ \", boost: 2, label: \"+\", type: \"operator\" },\n { apply: \"- \", boost: 2, label: \"-\", type: \"operator\" },\n];\n\nconst getOperators = (column?: ColumnDescriptor) => {\n if (column === undefined \|\| isNumericColumn(column)) {\n return arithmeticOperators;\n } else {\n return NO_OPERATORS;\n }\n};\n\nconst getConditionOperators = (column: ColumnDescriptor) => {\n switch (column.serverDataType) {\n case \"string\":\n case \"char\":\n return withApplySpace(stringOperators /, startsWith/);\n case \"int\":\n case \"long\":\n case \"double\":\n return withApplySpace(numericOperators);\n }\n};\n\nconst toFunctionCompletion = (\n functionDescriptor: ColumnFunctionDescriptor,\n) => ({\n apply: `${functionDescriptor.name}( `,\n boost: 2,\n expressionType: functionDescriptor.type,\n info: () => functionDocInfo(functionDescriptor),\n label: functionDescriptor.name,\n type: \"function\",\n});\n\nconst getAcceptedTypes = (fn?: ColumnFunctionDescriptor) => {\n if (fn) {\n if (typeof fn.accepts === \"string\") {\n return fn.accepts;\n } else if (Array.isArray(fn.accepts)) {\n if (fn.accepts.every((s) => s === \"string\")) {\n return \"string\";\n } else {\n return \"any\";\n }\n }\n }\n return \"any\";\n};\n\nconst functions: Completion[] =\n columnFunctionDescriptors.map(toFunctionCompletion);\n\nconst getFunctions = ({ functionName }: ColumnOptions) => {\n if (functionName) {\n const fn = columnFunctionDescriptors.find((f) => f.name === functionName);\n const acceptedTypes = getAcceptedTypes(fn);\n if (fn) {\n switch (acceptedTypes) {\n case \"string\":\n return columnFunctionDescriptors\n .filter((f) => f.type === \"string\" \|\| f.type === \"variable\")\n .map(toFunctionCompletion);\n case \"number\":\n return columnFunctionDescriptors\n .filter((f) => f.type === \"number\" \|\| f.type === \"variable\")\n .map(toFunctionCompletion);\n default:\n }\n }\n }\n return functions;\n};\n\nexport interface SuggestionProviderHookProps {\n columns: readonly ColumnDescriptor[];\n table: VuuTable;\n}\n\nconst NONE = {};\n\nexport const useColumnExpressionSuggestionProvider = ({\n columns,\n table,\n}: SuggestionProviderHookProps): IExpressionSuggestionProvider => {\n const findColumn = useCallback(\n (name?: string) =>\n name ? columns.find((col) => col.name === name) : undefined,\n [columns],\n );\n\n const latestSuggestionsRef = useRef<Completion[]>(undefined);\n const getTypeaheadSuggestions = useTypeaheadSuggestions();\n\n const getSuggestions: IExpressionSuggestionProvider[\"getSuggestions\"] =\n useCallback(\n async (suggestionType, options = NONE): Promise<Completion[]> => {\n const { columnName, functionName, operator, prefix } = options;\n\n switch (suggestionType) {\n case \"expression\": {\n const suggestions = await withApplySpace(\n getColumns(columns, { functionName, prefix }),\n ).concat(getFunctions(options));\n return (latestSuggestionsRef.current = suggestions);\n }\n case \"column\": {\n const suggestions = await getColumns(columns, options);\n return (latestSuggestionsRef.current = withApplySpace(suggestions));\n }\n case \"operator\": {\n const suggestions = await getOperators(findColumn(columnName));\n return (latestSuggestionsRef.current = withApplySpace(suggestions));\n }\n case \"relational-operator\": {\n const suggestions = await getRelationalOperators(\n findColumn(columnName),\n );\n return (latestSuggestionsRef.current = withApplySpace(suggestions));\n }\n case \"condition-operator\":\n {\n const column = findColumn(columnName);\n if (column) {\n const suggestions = await getConditionOperators(column);\n if (suggestions) {\n return (latestSuggestionsRef.current =\n withApplySpace(suggestions));\n }\n }\n }\n break;\n case \"columnValue\":\n if (columnName && operator) {\n // const column = findColumn(columnName);\n const params = getTypeaheadParams(\n table,\n columnName /, startsWith*/,\n );\n const suggestions = await getTypeaheadSuggestions(params);\n if (suggestions) {\n latestSuggestionsRef.current = toSuggestions(suggestions, {\n suffix: \"\",\n });\n\n latestSuggestionsRef.current.forEach((suggestion) => {\n suggestion.apply = (\n view: EditorView,\n completion: Completion,\n from: number,\n ) => {\n const annotation = new AnnotationType<Completion>();\n const cursorPos = from + completion.label.length + 1;\n view.dispatch({\n changes: { from, insert: completion.label },\n selection: { anchor: cursorPos, head: cursorPos },\n annotations: annotation.of(completion),\n });\n };\n });\n }\n return latestSuggestionsRef.current \|\| [];\n }\n break;\n }\n\n return [];\n },\n [columns, findColumn, getTypeaheadSuggestions, table],\n );\n\n const isPartialMatch = useCallback(\n async (\n valueType: ColumnExpressionSuggestionType,\n columnName?: string,\n pattern?: string,\n ) => {\n const { current: latestSuggestions } = latestSuggestionsRef;\n let maybe = false;\n const suggestions =\n latestSuggestions \|\| (await getSuggestions(valueType, { columnName }));\n if (pattern && suggestions) {\n for (const option of suggestions) {\n if (option.label === pattern) {\n return false;\n } else if (option.label.startsWith(pattern)) {\n maybe = true;\n }\n }\n }\n return maybe;\n },\n [getSuggestions],\n );\n\n return {\n getSuggestions,\n isPartialMatch,\n };\n};\n"],"names":["isNumericColumn","columnFunctionDescriptors","isTextColumn","stringOperators","numericOperators","functionDocInfo","useCallback","useRef","useTypeaheadSuggestions","getRelationalOperators","getTypeaheadParams","toSuggestions","AnnotationType"],"mappings":"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"}

package/cjs/column-formatting-settings/ColumnFormattingPanel.js CHANGED Viewed

@@ -91,6 +91,10 @@ function getFormattingSettingsComponent(props) {
   const { column } = props;
   switch (column.serverDataType) {
     case "double":
+    case "scaleddecimal2":
+    case "scaleddecimal4":
+    case "scaleddecimal6":
+    case "scaleddecimal8":
     case "int":
       return /* @__PURE__ */ jsxRuntime.jsx(BaseNumericFormattingSettings.BaseNumericFormattingSettings, { ...props });
     case "long":

package/cjs/column-formatting-settings/ColumnFormattingPanel.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ColumnFormattingPanel.js","sources":["../../../../packages/vuu-table-extras/src/column-formatting-settings/ColumnFormattingPanel.tsx"],"sourcesContent":["import {\n ColumnDescriptor,\n ColumnDescriptorCustomRenderer,\n ColumnTypeRendering,\n FormattingSettingsProps,\n} from \"@vuu-ui/vuu-table-types\";\nimport {\n CellRendererDescriptor,\n ConfigurationEditorProps,\n getCellRendererOptions,\n getConfigurationEditor,\n isColumnTypeRenderer,\n isTypeDescriptor,\n} from \"@vuu-ui/vuu-utils\";\nimport { Dropdown, FormField, FormFieldLabel, Option } from \"@salt-ds/core\";\nimport cx from \"clsx\";\nimport { HTMLAttributes, SyntheticEvent, useCallback, useMemo } from \"react\";\nimport { BaseNumericFormattingSettings } from \"./BaseNumericFormattingSettings\";\nimport { LongTypeFormattingSettings } from \"./LongTypeFormattingSettings\";\nimport { DateTimeFormattingSettings } from \"./DateTimeFormattingSettings\";\n\nconst classBase = \"vuuColumnFormattingPanel\";\n\nexport interface ColumnFormattingPanelProps\n extends HTMLAttributes<HTMLDivElement>,\n FormattingSettingsProps {\n availableRenderers: CellRendererDescriptor[];\n column: ColumnDescriptor;\n onChangeRendering: (renderProps: ColumnTypeRendering) => void;\n}\n\nexport const ColumnFormattingPanel = ({\n availableRenderers,\n className,\n column,\n onChangeFormatting,\n onChangeColumnType,\n onChangeRendering,\n ...htmlAttributes\n}: ColumnFormattingPanelProps) => {\n const formattingSettingsComponent = useMemo(\n () =>\n getFormattingSettingsComponent({\n column,\n onChangeFormatting,\n onChangeColumnType,\n }),\n [column, onChangeColumnType, onChangeFormatting],\n );\n\n const ConfigEditor = useMemo<\n React.FC<ConfigurationEditorProps> \| undefined\n >(() => {\n const { type } = column;\n if (isTypeDescriptor(type) && isColumnTypeRenderer(type.renderer)) {\n const cellRendererOptions = getCellRendererOptions(type.renderer.name);\n return getConfigurationEditor(cellRendererOptions?.configEditor);\n }\n return undefined;\n }, [column]);\n\n const selectedCellRenderer = useMemo(() => {\n const { type } = column;\n const [defaultRenderer] = availableRenderers;\n const rendererName =\n isTypeDescriptor(type) && isColumnTypeRenderer(type.renderer)\n ? type.renderer.name\n : undefined;\n const configuredRenderer = availableRenderers.find(\n (renderer) => renderer.name === rendererName,\n );\n return configuredRenderer ?? defaultRenderer;\n }, [availableRenderers, column]);\n\n const handleChangeRenderer = useCallback(\n (\n _e: SyntheticEvent,\n [cellRendererDescriptor]: CellRendererDescriptor[],\n ) => {\n const renderProps: ColumnTypeRendering = {\n name: cellRendererDescriptor.name,\n };\n onChangeRendering?.(renderProps);\n },\n [onChangeRendering],\n );\n\n const { serverDataType = \"string\" } = column;\n\n return (\n <div {...htmlAttributes} className={`vuuColumnSettingsPanel-header`}>\n <div>Formatting</div>\n\n <FormField>\n <FormFieldLabel>\n {`Renderer (data type ${column.serverDataType})`}\n </FormFieldLabel>\n <Dropdown<CellRendererDescriptor>\n className={cx(`${classBase}-renderer`)}\n onSelectionChange={handleChangeRenderer}\n selected={selectedCellRenderer ? [selectedCellRenderer] : []}\n value={selectedCellRenderer?.label ?? selectedCellRenderer?.name}\n >\n {availableRenderers.map((cellRenderer, i) => (\n <Option key={i} value={cellRenderer}>\n {cellRenderer.label ?? cellRenderer.name}\n </Option>\n ))}\n </Dropdown>\n </FormField>\n <div\n className={cx(classBase, className, `${classBase}-${serverDataType}`)}\n >\n {formattingSettingsComponent}\n {ConfigEditor ? (\n <ConfigEditor\n column={column as ColumnDescriptorCustomRenderer}\n onChangeRendering={onChangeRendering}\n />\n ) : null}\n </div>\n </div>\n );\n};\n\nfunction getFormattingSettingsComponent(props: FormattingSettingsProps) {\n const { column } = props;\n\n switch (column.serverDataType) {\n case \"double\":\n case \"int\":\n return <BaseNumericFormattingSettings {...props} />;\n case \"long\":\n return <LongTypeFormattingSettings {...props} />;\n case \"epochtimestamp\":\n return <DateTimeFormattingSettings {...props} />;\n default:\n return null;\n }\n}\n"],"names":["useMemo","isTypeDescriptor","isColumnTypeRenderer","getCellRendererOptions","getConfigurationEditor","useCallback","jsxs","jsx","FormField","FormFieldLabel","Dropdown","Option","BaseNumericFormattingSettings","LongTypeFormattingSettings","DateTimeFormattingSettings"],"mappings":"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"}
1	+ {"version":3,"file":"ColumnFormattingPanel.js","sources":["../../../../packages/vuu-table-extras/src/column-formatting-settings/ColumnFormattingPanel.tsx"],"sourcesContent":["import {\n ColumnDescriptor,\n ColumnDescriptorCustomRenderer,\n ColumnTypeRendering,\n FormattingSettingsProps,\n} from \"@vuu-ui/vuu-table-types\";\nimport {\n CellRendererDescriptor,\n ConfigurationEditorProps,\n getCellRendererOptions,\n getConfigurationEditor,\n isColumnTypeRenderer,\n isTypeDescriptor,\n} from \"@vuu-ui/vuu-utils\";\nimport { Dropdown, FormField, FormFieldLabel, Option } from \"@salt-ds/core\";\nimport cx from \"clsx\";\nimport { HTMLAttributes, SyntheticEvent, useCallback, useMemo } from \"react\";\nimport { BaseNumericFormattingSettings } from \"./BaseNumericFormattingSettings\";\nimport { LongTypeFormattingSettings } from \"./LongTypeFormattingSettings\";\nimport { DateTimeFormattingSettings } from \"./DateTimeFormattingSettings\";\n\nconst classBase = \"vuuColumnFormattingPanel\";\n\nexport interface ColumnFormattingPanelProps\n extends HTMLAttributes<HTMLDivElement>,\n FormattingSettingsProps {\n availableRenderers: CellRendererDescriptor[];\n column: ColumnDescriptor;\n onChangeRendering: (renderProps: ColumnTypeRendering) => void;\n}\n\nexport const ColumnFormattingPanel = ({\n availableRenderers,\n className,\n column,\n onChangeFormatting,\n onChangeColumnType,\n onChangeRendering,\n ...htmlAttributes\n}: ColumnFormattingPanelProps) => {\n const formattingSettingsComponent = useMemo(\n () =>\n getFormattingSettingsComponent({\n column,\n onChangeFormatting,\n onChangeColumnType,\n }),\n [column, onChangeColumnType, onChangeFormatting],\n );\n\n const ConfigEditor = useMemo<\n React.FC<ConfigurationEditorProps> \| undefined\n >(() => {\n const { type } = column;\n if (isTypeDescriptor(type) && isColumnTypeRenderer(type.renderer)) {\n const cellRendererOptions = getCellRendererOptions(type.renderer.name);\n return getConfigurationEditor(cellRendererOptions?.configEditor);\n }\n return undefined;\n }, [column]);\n\n const selectedCellRenderer = useMemo(() => {\n const { type } = column;\n const [defaultRenderer] = availableRenderers;\n const rendererName =\n isTypeDescriptor(type) && isColumnTypeRenderer(type.renderer)\n ? type.renderer.name\n : undefined;\n const configuredRenderer = availableRenderers.find(\n (renderer) => renderer.name === rendererName,\n );\n return configuredRenderer ?? defaultRenderer;\n }, [availableRenderers, column]);\n\n const handleChangeRenderer = useCallback(\n (\n _e: SyntheticEvent,\n [cellRendererDescriptor]: CellRendererDescriptor[],\n ) => {\n const renderProps: ColumnTypeRendering = {\n name: cellRendererDescriptor.name,\n };\n onChangeRendering?.(renderProps);\n },\n [onChangeRendering],\n );\n\n const { serverDataType = \"string\" } = column;\n\n return (\n <div {...htmlAttributes} className={`vuuColumnSettingsPanel-header`}>\n <div>Formatting</div>\n\n <FormField>\n <FormFieldLabel>\n {`Renderer (data type ${column.serverDataType})`}\n </FormFieldLabel>\n <Dropdown<CellRendererDescriptor>\n className={cx(`${classBase}-renderer`)}\n onSelectionChange={handleChangeRenderer}\n selected={selectedCellRenderer ? [selectedCellRenderer] : []}\n value={selectedCellRenderer?.label ?? selectedCellRenderer?.name}\n >\n {availableRenderers.map((cellRenderer, i) => (\n <Option key={i} value={cellRenderer}>\n {cellRenderer.label ?? cellRenderer.name}\n </Option>\n ))}\n </Dropdown>\n </FormField>\n <div\n className={cx(classBase, className, `${classBase}-${serverDataType}`)}\n >\n {formattingSettingsComponent}\n {ConfigEditor ? (\n <ConfigEditor\n column={column as ColumnDescriptorCustomRenderer}\n onChangeRendering={onChangeRendering}\n />\n ) : null}\n </div>\n </div>\n );\n};\n\nfunction getFormattingSettingsComponent(props: FormattingSettingsProps) {\n const { column } = props;\n\n switch (column.serverDataType) {\n case \"double\":\n case \"scaleddecimal2\":\n case \"scaleddecimal4\":\n case \"scaleddecimal6\":\n case \"scaleddecimal8\":\n case \"int\":\n return <BaseNumericFormattingSettings {...props} />;\n case \"long\":\n return <LongTypeFormattingSettings {...props} />;\n case \"epochtimestamp\":\n return <DateTimeFormattingSettings {...props} />;\n default:\n return null;\n }\n}\n"],"names":["useMemo","isTypeDescriptor","isColumnTypeRenderer","getCellRendererOptions","getConfigurationEditor","useCallback","jsxs","jsx","FormField","FormFieldLabel","Dropdown","Option","BaseNumericFormattingSettings","LongTypeFormattingSettings","DateTimeFormattingSettings"],"mappings":"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"}

package/cjs/column-picker/ColumnModel.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ColumnModel.js","sources":["../../../../packages/vuu-table-extras/src/column-picker/ColumnModel.ts"],"sourcesContent":["import { ColumnDescriptor } from \"@vuu-ui/vuu-table-types\";\nimport { EventEmitter, reorderColumnItems, ValueOf } from \"@vuu-ui/vuu-utils\";\n\nexport const ColumnChangeSource = {\n ColumnPicker: \"column-picker\",\n Table: \"table\",\n} as const;\nexport type ColumnChangeSource = ValueOf<typeof ColumnChangeSource>;\n\nexport const SelectedColumnChangeType = {\n ColumnAdded: \"column-added\",\n ColumnRemoved: \"column-removed\",\n ColumnsReordered: \"columns-reordered\",\n} as const;\nexport type SelectedColumnChangeType = ValueOf<typeof SelectedColumnChangeType>;\n\nexport interface SelectedColumnChangeColumnAdded {\n type: Extract<SelectedColumnChangeType, \"column-added\">;\n column: ColumnDescriptor;\n}\n\nexport interface SelectedColumnChangeColumnRemoved {\n type: Extract<SelectedColumnChangeType, \"column-removed\">;\n column: ColumnDescriptor;\n}\n\nexport interface SelectedColumnChangeColumnsReordered {\n type: Extract<SelectedColumnChangeType, \"columns-reordered\">;\n}\n\nexport type SelectedColumnChangeDescriptor =\n \| SelectedColumnChangeColumnAdded\n \| SelectedColumnChangeColumnRemoved\n \| SelectedColumnChangeColumnsReordered;\n\nexport const isColumnAdded = (\n change?: SelectedColumnChangeDescriptor,\n): change is SelectedColumnChangeColumnAdded =>\n change?.type === SelectedColumnChangeType.ColumnAdded;\nexport const isColumnRemoved = (\n change?: SelectedColumnChangeDescriptor,\n): change is SelectedColumnChangeColumnRemoved =>\n change?.type === SelectedColumnChangeType.ColumnRemoved;\nexport const isColumnsReordered = (\n change?: SelectedColumnChangeDescriptor,\n): change is SelectedColumnChangeColumnsReordered =>\n change?.type === SelectedColumnChangeType.ColumnsReordered;\n\nexport type ColumnsChangeHandler = (\n columns: ColumnDescriptor[],\n changeSource: ColumnChangeSource,\n changeDescriptor?: SelectedColumnChangeDescriptor,\n) => void;\nexport type ColumnEvents = {\n change: ColumnsChangeHandler;\n render: (o: object) => void;\n};\n\nconst byColumnName = (\n { name: n1, label: l1 = n1 }: ColumnDescriptor,\n { name: n2, label: l2 = n2 }: ColumnDescriptor,\n) => (l1 > l2 ? 1 : l2 > l1 ? -1 : 0);\n\nconst filterColumns = (columns: ColumnDescriptor[], pattern: string) => {\n if (pattern) {\n const lowerCasePattern = pattern.toLowerCase();\n return columns.filter(\n ({ name, label = name }) =>\n label.toLowerCase().indexOf(lowerCasePattern) !== -1,\n );\n } else {\n return columns;\n }\n};\n\nexport class ColumnModel extends EventEmitter<ColumnEvents> {\n #searchPattern = \"\";\n #selectedColumns: ColumnDescriptor[];\n constructor(\n /*\n All available columns, including selected columns.\n /\n public readonly allColumns: ColumnDescriptor[],\n /\n Columns already selected and rendered in Table.\n */\n\n selectedColumns: ColumnDescriptor[],\n ) {\n super();\n this.#selectedColumns = selectedColumns;\n }\n\n get availableColumns(): ColumnDescriptor[] {\n return filterColumns(this.allColumns, this.#searchPattern)\n .filter(\n ({ name }) =>\n this.#selectedColumns.findIndex((c) => c.name === name) === -1,\n )\n .toSorted(byColumnName);\n }\n\n set searchPattern(pattern: string) {\n const searchPattern = pattern;\n if (searchPattern !== this.#searchPattern) {\n this.#searchPattern = searchPattern;\n this.emit(\"render\", {});\n }\n }\n\n get searchPattern() {\n return this.#searchPattern ?? \"\";\n }\n\n get selectedColumns() {\n return filterColumns(this.#selectedColumns, this.#searchPattern);\n }\n setSelectedColumns(\n selectedColumns: ColumnDescriptor[],\n source: ColumnChangeSource,\n changeDescriptor?: SelectedColumnChangeDescriptor,\n ) {\n this.#selectedColumns = selectedColumns;\n this.notifyListeners(selectedColumns, source, changeDescriptor);\n }\n\n addItemToSelectedColumns(name: string, source: ColumnChangeSource) {\n const column = this.allColumns.find((col) => col.name === name);\n if (column) {\n this.#selectedColumns = this.#selectedColumns.concat(column);\n this.notifyListeners(this.#selectedColumns, source, {\n type: SelectedColumnChangeType.ColumnAdded,\n column,\n });\n } else {\n throw Error(\n `[ColumnModel] addItemToSelectedColumns, column '${name}' not found`,\n );\n }\n }\n removeItemFromSelectedColumns(name: string, source: ColumnChangeSource) {\n const column = this.#selectedColumns.find((col) => col.name === name);\n if (column) {\n const index = this.#selectedColumns.indexOf(column);\n this.#selectedColumns = this.#selectedColumns.toSpliced(index, 1);\n this.notifyListeners(this.#selectedColumns, source, {\n type: SelectedColumnChangeType.ColumnRemoved,\n column,\n });\n } else {\n throw Error(\n `[ColumnModel] removeItemFromSelectedColumns, column '${name}' not found`,\n );\n }\n }\n\n reorderSelectedColumns(\n orderedColumnNames: string[],\n source: ColumnChangeSource,\n ) {\n this.setSelectedColumns(\n reorderColumnItems(this.#selectedColumns, orderedColumnNames),\n source,\n { type: SelectedColumnChangeType.ColumnsReordered },\n );\n }\n\n private notifyListeners: ColumnsChangeHandler = (\n columns,\n source,\n changeType,\n ) => {\n this.emit(\"change\", columns, source, changeType);\n this.emit(\"render\", {});\n };\n}\n"],"names":["EventEmitter","reorderColumnItems"],"mappings":";;;;;;;;;;;;;;AAAA,IAAA,cAAA,EAAA,gBAAA;AAGO,MAAM,kBAAqB,GAAA;AAAA,EAChC,YAAc,EAAA,eAAA;AAAA,EACd,KAAO,EAAA;AACT;AAGO,MAAM,wBAA2B,GAAA;AAAA,EACtC,WAAa,EAAA,cAAA;AAAA,EACb,aAAe,EAAA,gBAAA;AAAA,EACf,gBAAkB,EAAA;AACpB;AAsBO,MAAM,aAAgB,GAAA,CAC3B,MAEA,KAAA,MAAA,EAAQ,SAAS,wBAAyB,CAAA;AACrC,MAAM,eAAkB,GAAA,CAC7B,MAEA,KAAA,MAAA,EAAQ,SAAS,wBAAyB,CAAA;AACrC,MAAM,kBAAqB,GAAA,CAChC,MAEA,KAAA,MAAA,EAAQ,SAAS,wBAAyB,CAAA;AAY5C,MAAM,YAAA,GAAe,CACnB,EAAE,IAAA,EAAM,IAAI,KAAO,EAAA,EAAA,GAAK,IACxB,EAAA,EAAE,MAAM,EAAI,EAAA,KAAA,EAAO,KAAK,EAAG,EAAA,KACvB,KAAK,EAAK,GAAA,CAAA,GAAI,EAAK,GAAA,EAAA,GAAK,CAAK,CAAA,GAAA,CAAA;AAEnC,MAAM,aAAA,GAAgB,~~CAAC~~,OAAA,~~EAA6B~~,~~OAAoB~~,KAAA;~~AACtE~~,EAAA,IAAI,OAAS,EAAA;AACX,IAAM,MAAA,gBAAA,GAAmB,QAAQ,WAAY,EAAA;AAC7C,IAAA,OAAO,OAAQ,CAAA,MAAA;AAAA,MACb,CAAC,EAAE,IAAA,EAAM,KAAQ,GAAA,IAAA,EACf,KAAA,KAAA,CAAM,WAAY,EAAA,CAAE,OAAQ,CAAA,gBAAgB,CAAM,KAAA,CAAA;AAAA,KACtD;AAAA,GACK,MAAA;AACL,IAAO,OAAA,OAAA;AAAA;AAEX,CAAA;AAEO,MAAM,oBAAoBA,qBAA2B,CAAA;AAAA,EAG1D,WAAA,CAIkB,YAKhB,eACA,EAAA;AACA,IAAM,KAAA,EAAA;AAPU,IAAA,IAAA,CAAA,UAAA,GAAA,UAAA;AANlB,IAAiB,YAAA,CAAA,IAAA,EAAA,cAAA,EAAA,EAAA,CAAA;AACjB,IAAA,YAAA,CAAA,IAAA,EAAA,gBAAA,CAAA;AA0FA,IAAA,aAAA,CAAA,IAAA,EAAQ,iBAAwC,EAAA,CAC9C,OACA,EAAA,MAAA,EACA,UACG,KAAA;AACH,MAAA,IAAA,CAAK,IAAK,CAAA,QAAA,EAAU,OAAS,EAAA,MAAA,EAAQ,UAAU,CAAA;AAC/C,MAAK,IAAA,CAAA,IAAA,CAAK,QAAU,EAAA,EAAE,CAAA;AAAA,KACxB,CAAA;AApFE,IAAA,YAAA,CAAA,IAAA,EAAK,gBAAmB,EAAA,eAAA,CAAA;AAAA;AAC1B,EAEA,IAAI,gBAAuC,GAAA;AACzC,IAAA,OAAO,aAAc,CAAA,IAAA,CAAK,UAAY,EAAA,YAAA,CAAA,IAAA,EAAK,eAAc,CACtD,CAAA,MAAA;AAAA,MACC,CAAC,EAAE,IAAK,EAAA,KACN,YAAK,CAAA,IAAA,EAAA,gBAAA,CAAA,CAAiB,SAAU,CAAA,CAAC,CAAM,KAAA,CAAA,CAAE,IAAS,KAAA,IAAI,CAAM,KAAA,CAAA;AAAA,KAChE,CACC,SAAS,YAAY,CAAA;AAAA;AAC1B,EAEA,IAAI,cAAc,OAAiB,EAAA;AACjC,IAAA,MAAM,aAAgB,GAAA,OAAA;AACtB,IAAI,IAAA,aAAA,KAAkB,mBAAK,cAAgB,CAAA,EAAA;AACzC,MAAA,YAAA,CAAA,IAAA,EAAK,cAAiB,EAAA,aAAA,CAAA;AACtB,MAAK,IAAA,CAAA,IAAA,CAAK,QAAU,EAAA,EAAE,CAAA;AAAA;AACxB;AACF,EAEA,IAAI,aAAgB,GAAA;AAClB,IAAA,OAAO,mBAAK,cAAkB,CAAA,IAAA,EAAA;AAAA;AAChC,EAEA,IAAI,eAAkB,GAAA;AACpB,IAAA,OAAO,aAAc,CAAA,YAAA,CAAA,IAAA,EAAK,gBAAkB,CAAA,EAAA,YAAA,CAAA,IAAA,EAAK,cAAc,CAAA,CAAA;AAAA;AACjE,EACA,kBAAA,CACE,eACA,EAAA,MAAA,EACA,gBACA,EAAA;AACA,IAAA,YAAA,CAAA,IAAA,EAAK,gBAAmB,EAAA,eAAA,CAAA;AACxB,IAAK,IAAA,CAAA,eAAA,CAAgB,eAAiB,EAAA,MAAA,EAAQ,gBAAgB,CAAA;AAAA;AAChE,EAEA,wBAAA,CAAyB,MAAc,MAA4B,EAAA;AACjE,IAAM,MAAA,MAAA,GAAS,KAAK,UAAW,CAAA,IAAA,CAAK,CAAC,GAAQ,KAAA,GAAA,CAAI,SAAS,IAAI,CAAA;AAC9D,IAAA,IAAI,MAAQ,EAAA;AACV,MAAA,YAAA,CAAA,IAAA,EAAK,gBAAmB,EAAA,YAAA,CAAA,IAAA,EAAK,gBAAiB,CAAA,CAAA,MAAA,CAAO,MAAM,CAAA,CAAA;AAC3D,MAAK,IAAA,CAAA,eAAA,CAAgB,YAAK,CAAA,IAAA,EAAA,gBAAA,CAAA,EAAkB,MAAQ,EAAA;AAAA,QAClD,MAAM,wBAAyB,CAAA,WAAA;AAAA,QAC/B;AAAA,OACD,CAAA;AAAA,KACI,MAAA;AACL,MAAM,MAAA,KAAA;AAAA,QACJ,mDAAmD,IAAI,CAAA,WAAA;AAAA,OACzD;AAAA;AACF;AACF,EACA,6BAAA,CAA8B,MAAc,MAA4B,EAAA;AACtE,IAAM,MAAA,MAAA,GAAS,mBAAK,gBAAiB,CAAA,CAAA,IAAA,CAAK,CAAC,GAAQ,KAAA,GAAA,CAAI,SAAS,IAAI,CAAA;AACpE,IAAA,IAAI,MAAQ,EAAA;AACV,MAAA,MAAM,KAAQ,GAAA,YAAA,CAAA,IAAA,EAAK,gBAAiB,CAAA,CAAA,OAAA,CAAQ,MAAM,CAAA;AAClD,MAAA,YAAA,CAAA,IAAA,EAAK,gBAAmB,EAAA,YAAA,CAAA,IAAA,EAAK,gBAAiB,CAAA,CAAA,SAAA,CAAU,OAAO,CAAC,CAAA,CAAA;AAChE,MAAK,IAAA,CAAA,eAAA,CAAgB,YAAK,CAAA,IAAA,EAAA,gBAAA,CAAA,EAAkB,MAAQ,EAAA;AAAA,QAClD,MAAM,wBAAyB,CAAA,aAAA;AAAA,QAC/B;AAAA,OACD,CAAA;AAAA,KACI,MAAA;AACL,MAAM,MAAA,KAAA;AAAA,QACJ,wDAAwD,IAAI,CAAA,WAAA;AAAA,OAC9D;AAAA;AACF;AACF,EAEA,sBAAA,CACE,oBACA,MACA,EAAA;AACA,IAAK,IAAA,CAAA,kBAAA;AAAA,MACHC,2BAAA,CAAmB,YAAK,CAAA,IAAA,EAAA,gBAAA,CAAA,EAAkB,kBAAkB,CAAA;AAAA,MAC5D,MAAA;AAAA,MACA,EAAE,IAAM,EAAA,wBAAA,CAAyB,gBAAiB;AAAA,KACpD;AAAA;AAWJ;AAnGE,cAAA,GAAA,IAAA,OAAA,EAAA;AACA,gBAAA,GAAA,IAAA,OAAA,EAAA;;;;;;;;;"}
1	+ {"version":3,"file":"ColumnModel.js","sources":["../../../../packages/vuu-table-extras/src/column-picker/ColumnModel.ts"],"sourcesContent":["import { ColumnDescriptor } from \"@vuu-ui/vuu-table-types\";\nimport { EventEmitter, reorderColumnItems, ValueOf } from \"@vuu-ui/vuu-utils\";\n\nexport const ColumnChangeSource = {\n ColumnPicker: \"column-picker\",\n Table: \"table\",\n} as const;\nexport type ColumnChangeSource = ValueOf<typeof ColumnChangeSource>;\n\nexport const SelectedColumnChangeType = {\n ColumnAdded: \"column-added\",\n ColumnRemoved: \"column-removed\",\n ColumnsReordered: \"columns-reordered\",\n} as const;\nexport type SelectedColumnChangeType = ValueOf<typeof SelectedColumnChangeType>;\n\nexport interface SelectedColumnChangeColumnAdded {\n type: Extract<SelectedColumnChangeType, \"column-added\">;\n column: ColumnDescriptor;\n}\n\nexport interface SelectedColumnChangeColumnRemoved {\n type: Extract<SelectedColumnChangeType, \"column-removed\">;\n column: ColumnDescriptor;\n}\n\nexport interface SelectedColumnChangeColumnsReordered {\n type: Extract<SelectedColumnChangeType, \"columns-reordered\">;\n}\n\nexport type SelectedColumnChangeDescriptor =\n \| SelectedColumnChangeColumnAdded\n \| SelectedColumnChangeColumnRemoved\n \| SelectedColumnChangeColumnsReordered;\n\nexport const isColumnAdded = (\n change?: SelectedColumnChangeDescriptor,\n): change is SelectedColumnChangeColumnAdded =>\n change?.type === SelectedColumnChangeType.ColumnAdded;\nexport const isColumnRemoved = (\n change?: SelectedColumnChangeDescriptor,\n): change is SelectedColumnChangeColumnRemoved =>\n change?.type === SelectedColumnChangeType.ColumnRemoved;\nexport const isColumnsReordered = (\n change?: SelectedColumnChangeDescriptor,\n): change is SelectedColumnChangeColumnsReordered =>\n change?.type === SelectedColumnChangeType.ColumnsReordered;\n\nexport type ColumnsChangeHandler = (\n columns: readonly ColumnDescriptor[],\n changeSource: ColumnChangeSource,\n changeDescriptor?: SelectedColumnChangeDescriptor,\n) => void;\nexport type ColumnEvents = {\n change: ColumnsChangeHandler;\n render: (o: object) => void;\n};\n\nconst byColumnName = (\n { name: n1, label: l1 = n1 }: ColumnDescriptor,\n { name: n2, label: l2 = n2 }: ColumnDescriptor,\n) => (l1 > l2 ? 1 : l2 > l1 ? -1 : 0);\n\nconst filterColumns = (\n columns: readonly ColumnDescriptor[],\n pattern: string,\n) => {\n if (pattern) {\n const lowerCasePattern = pattern.toLowerCase();\n return columns.filter(\n ({ name, label = name }) =>\n label.toLowerCase().indexOf(lowerCasePattern) !== -1,\n );\n } else {\n return columns;\n }\n};\n\nexport class ColumnModel extends EventEmitter<ColumnEvents> {\n #searchPattern = \"\";\n #selectedColumns: readonly ColumnDescriptor[];\n constructor(\n /*\n All available columns, including selected columns.\n /\n public readonly allColumns: readonly ColumnDescriptor[],\n /\n Columns already selected and rendered in Table.\n */\n\n selectedColumns: ColumnDescriptor[],\n ) {\n super();\n this.#selectedColumns = selectedColumns;\n }\n\n get availableColumns(): ColumnDescriptor[] {\n return filterColumns(this.allColumns, this.#searchPattern)\n .filter(\n ({ name }) =>\n this.#selectedColumns.findIndex((c) => c.name === name) === -1,\n )\n .toSorted(byColumnName);\n }\n\n set searchPattern(pattern: string) {\n const searchPattern = pattern;\n if (searchPattern !== this.#searchPattern) {\n this.#searchPattern = searchPattern;\n this.emit(\"render\", {});\n }\n }\n\n get searchPattern() {\n return this.#searchPattern ?? \"\";\n }\n\n get selectedColumns() {\n return filterColumns(this.#selectedColumns, this.#searchPattern);\n }\n setSelectedColumns(\n selectedColumns: ColumnDescriptor[],\n source: ColumnChangeSource,\n changeDescriptor?: SelectedColumnChangeDescriptor,\n ) {\n this.#selectedColumns = selectedColumns;\n this.notifyListeners(selectedColumns, source, changeDescriptor);\n }\n\n addItemToSelectedColumns(name: string, source: ColumnChangeSource) {\n const column = this.allColumns.find((col) => col.name === name);\n if (column) {\n this.#selectedColumns = this.#selectedColumns.concat(column);\n this.notifyListeners(this.#selectedColumns, source, {\n type: SelectedColumnChangeType.ColumnAdded,\n column,\n });\n } else {\n throw Error(\n `[ColumnModel] addItemToSelectedColumns, column '${name}' not found`,\n );\n }\n }\n removeItemFromSelectedColumns(name: string, source: ColumnChangeSource) {\n const column = this.#selectedColumns.find((col) => col.name === name);\n if (column) {\n const index = this.#selectedColumns.indexOf(column);\n this.#selectedColumns = this.#selectedColumns.toSpliced(index, 1);\n this.notifyListeners(this.#selectedColumns, source, {\n type: SelectedColumnChangeType.ColumnRemoved,\n column,\n });\n } else {\n throw Error(\n `[ColumnModel] removeItemFromSelectedColumns, column '${name}' not found`,\n );\n }\n }\n\n reorderSelectedColumns(\n orderedColumnNames: string[],\n source: ColumnChangeSource,\n ) {\n this.setSelectedColumns(\n reorderColumnItems(this.#selectedColumns, orderedColumnNames),\n source,\n { type: SelectedColumnChangeType.ColumnsReordered },\n );\n }\n\n private notifyListeners: ColumnsChangeHandler = (\n columns,\n source,\n changeType,\n ) => {\n this.emit(\"change\", columns, source, changeType);\n this.emit(\"render\", {});\n };\n}\n"],"names":["EventEmitter","reorderColumnItems"],"mappings":"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"}

package/cjs/table-column-settings/useColumnSettings.js CHANGED Viewed

@@ -17,6 +17,13 @@ const doubleCellRenderers = [
     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",
@@ -34,7 +41,16 @@ const getAvailableCellRenderers = (column) => {
     case "long":
       return integerCellRenderers.concat(vuuUtils.getRegisteredCellRenderers("int"));
     case "double":
-      return doubleCellRenderers.concat(vuuUtils.getRegisteredCellRenderers("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: