@vuu-ui/vuu-table-extras 0.8.34 → 0.8.35

package/esm/cell-renderers/background-cell/BackgroundCell.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"BackgroundCell.js","sources":["../../../src/cell-renderers/background-cell/BackgroundCell.tsx"],"sourcesContent":["import { ColumnType, TableCellProps } 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 cx from \"clsx\";\nimport { memo } from \"react\";\nimport { useDirection } from \"./useDirection\";\n\nimport \"./BackgroundCell.css\";\nimport \"./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?: ColumnType) => {\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}: TableCellProps) {\n  //TODO what about click handling\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},\ndataAndColumnUnchanged);\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":["BackgroundCell"],"mappings":"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"}

package/esm/cell-renderers/background-cell/BackgroundCellConfigurationEditor.css

@@ -1,4 +0,0 @@
-.vuuBackgroundCellConfiguration {
-    height: 50px;
-    background-color: red;
-}

package/esm/cell-renderers/background-cell/BackgroundCellConfigurationEditor.js

@@ -1,56 +0,0 @@
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { Dropdown } from '@vuu-ui/vuu-ui-controls';
-import { registerConfigurationEditor } from '@vuu-ui/vuu-utils';
-import { FormField, FormFieldLabel } from '@salt-ds/core';
-import { useState, useCallback } from 'react';
-
-const classBase = "vuuBackgroundCellConfiguration";
-const flashOptions = [
-  { label: "Background Only", value: "bg-only" },
-  { label: "Background and Arrow", value: "arrow-bg" },
-  { label: "Arrow Only", value: "arrow" }
-];
-const [defaultFlashOption] = flashOptions;
-const valueFromColumn = (column) => {
-  const { flashStyle } = column.type.renderer;
-  return flashOptions.find((o) => o.value === flashStyle) || defaultFlashOption;
-};
-const BackgroundCellConfigurationEditor = ({
-  column,
-  onChangeRendering
-}) => {
-  const [flashStyle, setFlashStyle] = useState(
-    valueFromColumn(column)
-  );
-  const handleSelectionChange = useCallback(
-    (_, flashOption) => {
-      setFlashStyle(flashOption);
-      const renderProps = column.type.renderer;
-      onChangeRendering({
-        ...renderProps,
-        flashStyle: flashOption?.value ?? defaultFlashOption.value
-      });
-    },
-    [column.type, onChangeRendering]
-  );
-  return /* @__PURE__ */ jsxs(FormField, { children: [
-    /* @__PURE__ */ jsx(FormFieldLabel, { children: "Flash Style" }),
-    /* @__PURE__ */ jsx(
-      Dropdown,
-      {
-        className: `${classBase}-flashStyle`,
-        onSelectionChange: handleSelectionChange,
-        selected: flashStyle,
-        source: flashOptions,
-        width: "100%"
-      }
-    )
-  ] });
-};
-registerConfigurationEditor(
-  "BackgroundCellConfigurationEditor",
-  BackgroundCellConfigurationEditor
-);
-
-export { BackgroundCellConfigurationEditor };
-//# sourceMappingURL=BackgroundCellConfigurationEditor.js.map

package/esm/cell-renderers/background-cell/BackgroundCellConfigurationEditor.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"BackgroundCellConfigurationEditor.js","sources":["../../../src/cell-renderers/background-cell/BackgroundCellConfigurationEditor.tsx"],"sourcesContent":["import type { ColumnDescriptorCustomRenderer } from \"@vuu-ui/vuu-table-types\";\nimport { Dropdown, SingleSelectionHandler } from \"@vuu-ui/vuu-ui-controls\";\nimport {\n  ConfigurationEditorProps,\n  registerConfigurationEditor,\n} from \"@vuu-ui/vuu-utils\";\nimport { FormField, FormFieldLabel } from \"@salt-ds/core\";\nimport { useCallback, useState } from \"react\";\n\nimport \"./BackgroundCellConfigurationEditor.css\";\n\nconst classBase = \"vuuBackgroundCellConfiguration\";\n\ntype FlashOption = {\n  label: string;\n  value: \"arrow\" | \"bg-only\" | \"arrow-bg\";\n};\n\nconst flashOptions: FlashOption[] = [\n  { label: \"Background Only\", value: \"bg-only\" },\n  { label: \"Background and Arrow\", value: \"arrow-bg\" },\n  { label: \"Arrow Only\", value: \"arrow\" },\n];\n\nconst [defaultFlashOption] = flashOptions;\n\nconst valueFromColumn = (column: ColumnDescriptorCustomRenderer) => {\n  const { flashStyle } = column.type.renderer;\n  return flashOptions.find((o) => o.value === flashStyle) || defaultFlashOption;\n};\n\nexport const BackgroundCellConfigurationEditor = ({\n  column,\n  onChangeRendering,\n}: ConfigurationEditorProps) => {\n  const [flashStyle, setFlashStyle] = useState<FlashOption | null>(\n    valueFromColumn(column)\n  );\n  const handleSelectionChange = useCallback<\n    SingleSelectionHandler<FlashOption>\n  >(\n    (_, flashOption) => {\n      setFlashStyle(flashOption);\n      const renderProps = column.type.renderer;\n      onChangeRendering({\n        ...renderProps,\n        flashStyle: flashOption?.value ?? defaultFlashOption.value,\n      });\n    },\n    [column.type, onChangeRendering]\n  );\n\n  return (\n    <FormField>\n      <FormFieldLabel>Flash Style</FormFieldLabel>\n      <Dropdown<FlashOption>\n        className={`${classBase}-flashStyle`}\n        onSelectionChange={handleSelectionChange}\n        selected={flashStyle}\n        source={flashOptions}\n        width=\"100%\"\n      />\n    </FormField>\n  );\n};\n\nregisterConfigurationEditor(\n  \"BackgroundCellConfigurationEditor\",\n  BackgroundCellConfigurationEditor\n);\n"],"names":[],"mappings":";;;;;;AAWA,MAAM,SAAY,GAAA,gCAAA,CAAA;AAOlB,MAAM,YAA8B,GAAA;AAAA,EAClC,EAAE,KAAA,EAAO,iBAAmB,EAAA,KAAA,EAAO,SAAU,EAAA;AAAA,EAC7C,EAAE,KAAA,EAAO,sBAAwB,EAAA,KAAA,EAAO,UAAW,EAAA;AAAA,EACnD,EAAE,KAAA,EAAO,YAAc,EAAA,KAAA,EAAO,OAAQ,EAAA;AACxC,CAAA,CAAA;AAEA,MAAM,CAAC,kBAAkB,CAAI,GAAA,YAAA,CAAA;AAE7B,MAAM,eAAA,GAAkB,CAAC,MAA2C,KAAA;AAClE,EAAA,MAAM,EAAE,UAAA,EAAe,GAAA,MAAA,CAAO,IAAK,CAAA,QAAA,CAAA;AACnC,EAAA,OAAO,aAAa,IAAK,CAAA,CAAC,MAAM,CAAE,CAAA,KAAA,KAAU,UAAU,CAAK,IAAA,kBAAA,CAAA;AAC7D,CAAA,CAAA;AAEO,MAAM,oCAAoC,CAAC;AAAA,EAChD,MAAA;AAAA,EACA,iBAAA;AACF,CAAgC,KAAA;AAC9B,EAAM,MAAA,CAAC,UAAY,EAAA,aAAa,CAAI,GAAA,QAAA;AAAA,IAClC,gBAAgB,MAAM,CAAA;AAAA,GACxB,CAAA;AACA,EAAA,MAAM,qBAAwB,GAAA,WAAA;AAAA,IAG5B,CAAC,GAAG,WAAgB,KAAA;AAClB,MAAA,aAAA,CAAc,WAAW,CAAA,CAAA;AACzB,MAAM,MAAA,WAAA,GAAc,OAAO,IAAK,CAAA,QAAA,CAAA;AAChC,MAAkB,iBAAA,CAAA;AAAA,QAChB,GAAG,WAAA;AAAA,QACH,UAAA,EAAY,WAAa,EAAA,KAAA,IAAS,kBAAmB,CAAA,KAAA;AAAA,OACtD,CAAA,CAAA;AAAA,KACH;AAAA,IACA,CAAC,MAAO,CAAA,IAAA,EAAM,iBAAiB,CAAA;AAAA,GACjC,CAAA;AAEA,EAAA,4BACG,SACC,EAAA,EAAA,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,kBAAe,QAAW,EAAA,aAAA,EAAA,CAAA;AAAA,oBAC3B,GAAA;AAAA,MAAC,QAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAW,GAAG,SAAS,CAAA,WAAA,CAAA;AAAA,QACvB,iBAAmB,EAAA,qBAAA;AAAA,QACnB,QAAU,EAAA,UAAA;AAAA,QACV,MAAQ,EAAA,YAAA;AAAA,QACR,KAAM,EAAA,MAAA;AAAA,OAAA;AAAA,KACR;AAAA,GACF,EAAA,CAAA,CAAA;AAEJ,EAAA;AAEA,2BAAA;AAAA,EACE,mCAAA;AAAA,EACA,iCAAA;AACF,CAAA;;;;"}

package/esm/cell-renderers/background-cell/BackgroundKeyframes.css

@@ -1,169 +0,0 @@
-
-@keyframes vuubgup1 {
-    0% {
-      background-color: var(--vuu-color-green-50);
-      color: white;
-    }
-
-    30% {
-      color: white;
-    }  
-    33% {
-      color: var(--vuu-color-gray-80);
-    }  
-
-    100% {
-      background-color: transparent;
-      color: var(--vuu-color-gray-80);
-    }
-  }
-  
-  @keyframes vuubgup2 {
-    0% {
-      background-color: var(--vuu-color-green-50);
-      color: white;
-    }
-
-    30% {
-      color: white;
-    }  
-    33% {
-      color: var(--vuu-color-gray-80);
-    }  
-
-    100% {
-      background-color: transparent;
-      color: var(--vuu-color-gray-80);
-    }
-  }
-  
-  @keyframes vuubgdown1 {
-    0% {
-      background-color: var(--vuu-color-red-50);
-      color: white;
-    }
-    30% {
-      color: white;
-    }  
-    33% {
-      color: var(--vuu-color-gray-80);
-    }  
-    100% {
-      background-color: transparent;
-      color: var(--vuu-color-gray-80);
-    }
-  }
-  
-  @keyframes vuubgdown2 {
-    0% {
-      background-color: var(--vuu-color-red-50);
-      color: white;
-    }
-    30% {
-      color: white;
-    }  
-    33% {
-      color: var(--vuu-color-gray-80);
-    }  
-    100% {
-      background-color: transparent;
-      color: var(--vuu-color-gray-80);
-    }
-  }
-  
-  @keyframes vuuarrowup1 {
-    from {
-      color: var(--salt-differential-positive-foreground);
-    }
-    to {
-      color: transparent;
-    }
-  }
-  
-  @keyframes vuuarrowup2 {
-    from {
-      color: var(--salt-differential-positive-foreground);
-    }
-    to {
-      color: transparent;
-    }
-  }
-  
-  @keyframes vuuarrowdown1 {
-    from {
-      color: var(--salt-differential-negative-foreground);
-    }
-    to {
-      color: transparent;
-    }
-  }
-  
-  @keyframes vuuarrowdown2 {
-    from {
-      color: var(--salt-differential-negative-foreground);
-    }
-    to {
-      color: transparent;
-    }
-  }
-  
-  @keyframes vuubgarrowup1 {
-    0% {
-      color: var(--salt-differential-positive-foreground);
-      background-color: var(--vuu-color-green-50);
-    }
-    20% {
-      color: var(--salt-differential-positive-foreground);
-      background-color: transparent;
-    }
-    100% {
-      color: transparent;
-      background-color: transparent;
-    }
-  }
-  
-  @keyframes vuubgarrowup2 {
-    0% {
-      color: var(--salt-differential-positive-foreground);
-      background-color: var(--vuu-color-green-50);
-    }
-    20% {
-      color: var(--salt-differential-positive-foreground);
-      background-color: transparent;
-    }
-    100% {
-      color: transparent;
-      background-color: transparent;
-    }
-  }
-  
-  @keyframes vuubgarrowdown1 {
-    0% {
-      color: var(--salt-differential-negative-foreground);
-      background-color: var(--vuu-color-red-50);
-    }
-    20% {
-      color: var(--salt-differential-negative-foreground);
-      background-color: transparent;
-    }
-    100% {
-      color: transparent;
-      background-color: transparent;
-    }
-  }
-  
-  @keyframes vuubgarrowdown2 {
-    0% {
-      color: var(--salt-differential-negative-foreground);
-      background-color: var(--vuu-color-red-50);
-    }
-    20% {
-      color: var(--salt-differential-negative-foreground);
-      background-color: transparent;
-    }
-    100% {
-      color: transparent;
-      background-color: transparent;
-    }
-  }
-  

package/esm/cell-renderers/background-cell/useDirection.js

@@ -1,18 +0,0 @@
-import { isTypeDescriptor, isValidNumber, getMovingValueDirection } from '@vuu-ui/vuu-utils';
-import { useRef, useEffect } from 'react';
-
-const INITIAL_VALUE = [void 0, void 0, void 0, void 0];
-function useDirection(key, value, column) {
-  const ref = useRef();
-  const [prevKey, prevValue, prevColumn, prevDirection] = ref.current || INITIAL_VALUE;
-  const { type: dataType } = column;
-  const decimals = isTypeDescriptor(dataType) ? dataType.formatting?.decimals : void 0;
-  const direction = key === prevKey && isValidNumber(value) && isValidNumber(prevValue) && column === prevColumn ? getMovingValueDirection(value, prevDirection, prevValue, decimals) : "";
-  useEffect(() => {
-    ref.current = [key, value, column, direction];
-  });
-  return direction;
-}
-
-export { useDirection };
-//# sourceMappingURL=useDirection.js.map

package/esm/cell-renderers/background-cell/useDirection.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"useDirection.js","sources":["../../../src/cell-renderers/background-cell/useDirection.ts"],"sourcesContent":["import { RuntimeColumnDescriptor } from \"@vuu-ui/vuu-table-types\";\nimport {\n  getMovingValueDirection,\n  isTypeDescriptor,\n  isValidNumber,\n  valueChangeDirection,\n} from \"@vuu-ui/vuu-utils\";\nimport { useEffect, useRef } from \"react\";\n\nconst INITIAL_VALUE = [undefined, undefined, undefined, undefined];\n\ntype State = [string, unknown, RuntimeColumnDescriptor, valueChangeDirection];\n\nexport function useDirection(\n  key: string,\n  value: unknown,\n  column: RuntimeColumnDescriptor\n) {\n  const ref = useRef<State>();\n  const [prevKey, prevValue, prevColumn, prevDirection] =\n    ref.current || INITIAL_VALUE;\n\n  const { type: dataType } = column;\n  const decimals = isTypeDescriptor(dataType)\n    ? dataType.formatting?.decimals\n    : undefined;\n\n  const direction =\n    key === prevKey &&\n    isValidNumber(value) &&\n    isValidNumber(prevValue) &&\n    column === prevColumn\n      ? getMovingValueDirection(value, prevDirection, prevValue, decimals)\n      : \"\";\n\n  useEffect(() => {\n    ref.current = [key, value, column, direction];\n  });\n\n  return direction;\n}\n"],"names":[],"mappings":";;;AASA,MAAM,aAAgB,GAAA,CAAC,KAAW,CAAA,EAAA,KAAA,CAAA,EAAW,QAAW,KAAS,CAAA,CAAA,CAAA;AAIjD,SAAA,YAAA,CACd,GACA,EAAA,KAAA,EACA,MACA,EAAA;AACA,EAAA,MAAM,MAAM,MAAc,EAAA,CAAA;AAC1B,EAAA,MAAM,CAAC,OAAS,EAAA,SAAA,EAAW,YAAY,aAAa,CAAA,GAClD,IAAI,OAAW,IAAA,aAAA,CAAA;AAEjB,EAAM,MAAA,EAAE,IAAM,EAAA,QAAA,EAAa,GAAA,MAAA,CAAA;AAC3B,EAAA,MAAM,WAAW,gBAAiB,CAAA,QAAQ,CACtC,GAAA,QAAA,CAAS,YAAY,QACrB,GAAA,KAAA,CAAA,CAAA;AAEJ,EAAA,MAAM,YACJ,GAAQ,KAAA,OAAA,IACR,aAAc,CAAA,KAAK,KACnB,aAAc,CAAA,SAAS,CACvB,IAAA,MAAA,KAAW,aACP,uBAAwB,CAAA,KAAA,EAAO,aAAe,EAAA,SAAA,EAAW,QAAQ,CACjE,GAAA,EAAA,CAAA;AAEN,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,GAAA,CAAI,OAAU,GAAA,CAAC,GAAK,EAAA,KAAA,EAAO,QAAQ,SAAS,CAAA,CAAA;AAAA,GAC7C,CAAA,CAAA;AAED,EAAO,OAAA,SAAA,CAAA;AACT;;;;"}

package/esm/cell-renderers/dropdown-cell/DropdownCell.css

@@ -1,18 +0,0 @@
-
-.vuuTableDropdownCell {
-    --vuu-icon-height: 15px;
-    --salt-focused-outlineStyle: none;
-
-    --saltButton-borderRadius: 4px;
-    font-weight: 500;
-
-    .vuuDropdownButton {
-        --saltButton-height: var(--vuu-table-embedded-control-height);
-    }
-}
-
-.vuuTableDropdownCell button:focus-visible {
-    --saltButton-borderColor: var(--salt-focused-outlineColor);
-    --saltButton-borderWidth: 2px;
-    padding-left: 7px;
-}

package/esm/cell-renderers/dropdown-cell/DropdownCell.js

@@ -1,54 +0,0 @@
-import { jsx } from 'react/jsx-runtime';
-import { useLookupValues, getSelectedOption } from '@vuu-ui/vuu-data-react';
-import { Dropdown, WarnCommit } from '@vuu-ui/vuu-ui-controls';
-import { dispatchCustomEvent, dataColumnAndKeyUnchanged, registerComponent } from '@vuu-ui/vuu-utils';
-import { memo, useRef, useMemo, useCallback } from 'react';
-
-const classBase = "vuuTableDropdownCell";
-const openKeys = ["Enter", " "];
-const DropdownCell = memo(
-  function DropdownCell2({
-    column,
-    columnMap,
-    onCommit = WarnCommit,
-    row
-  }) {
-    const dataIdx = columnMap[column.name];
-    const dataValue = row[dataIdx];
-    const { values } = useLookupValues(column, dataValue);
-    const valueRef = useRef(null);
-    useMemo(() => {
-      valueRef.current = getSelectedOption(values, dataValue);
-    }, [dataValue, values]);
-    const handleSelectionChange = useCallback(
-      (evt, selectedOption) => {
-        if (selectedOption) {
-          onCommit(selectedOption.value).then((response) => {
-            if (response === true && evt) {
-              dispatchCustomEvent(evt.target, "vuu-commit");
-            }
-          });
-        }
-      },
-      [onCommit]
-    );
-    return /* @__PURE__ */ jsx(
-      Dropdown,
-      {
-        className: classBase,
-        onSelectionChange: handleSelectionChange,
-        openKeys,
-        selected: valueRef.current,
-        source: values,
-        width: column.width - 17
-      }
-    );
-  },
-  dataColumnAndKeyUnchanged
-);
-registerComponent("dropdown-cell", DropdownCell, "cell-renderer", {
-  userCanAssign: false
-});
-
-export { DropdownCell };
-//# sourceMappingURL=DropdownCell.js.map

package/esm/cell-renderers/dropdown-cell/DropdownCell.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"DropdownCell.js","sources":["../../../src/cell-renderers/dropdown-cell/DropdownCell.tsx"],"sourcesContent":["import { getSelectedOption, 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  Dropdown,\n  DropdownOpenKey,\n  SingleSelectionHandler,\n  WarnCommit,\n} from \"@vuu-ui/vuu-ui-controls\";\nimport {\n  dataColumnAndKeyUnchanged,\n  dispatchCustomEvent,\n  registerComponent,\n} from \"@vuu-ui/vuu-utils\";\nimport { memo, useCallback, useMemo, useRef } from \"react\";\n\nimport \"./DropdownCell.css\";\n\nconst classBase = \"vuuTableDropdownCell\";\n\nconst openKeys: DropdownOpenKey[] = [\"Enter\", \" \"];\n\nexport const DropdownCell = memo(function DropdownCell({\n  column,\n  columnMap,\n  onCommit = WarnCommit,\n  row,\n}: TableCellRendererProps) {\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 | null>(null);\n\n  useMemo(() => {\n    valueRef.current = getSelectedOption(values, dataValue);\n  }, [dataValue, values]);\n\n  const handleSelectionChange = useCallback<SingleSelectionHandler<ListOption>>(\n    (evt, selectedOption) => {\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        onCommit(selectedOption.value as VuuColumnDataType).then((response) => {\n          if (response === true && evt) {\n            dispatchCustomEvent(evt.target as HTMLElement, \"vuu-commit\");\n          }\n        });\n      }\n    },\n    [onCommit]\n  );\n\n  return (\n    <Dropdown<ListOption>\n      className={classBase}\n      onSelectionChange={handleSelectionChange}\n      openKeys={openKeys}\n      selected={valueRef.current}\n      source={values}\n      width={column.width - 17} // temp hack\n    />\n  );\n},\ndataColumnAndKeyUnchanged);\n\nregisterComponent(\"dropdown-cell\", DropdownCell, \"cell-renderer\", {\n  userCanAssign: false,\n});\n"],"names":["DropdownCell"],"mappings":";;;;;;AAkBA,MAAM,SAAY,GAAA,sBAAA,CAAA;AAElB,MAAM,QAAA,GAA8B,CAAC,OAAA,EAAS,GAAG,CAAA,CAAA;AAE1C,MAAM,YAAe,GAAA,IAAA;AAAA,EAAK,SAASA,aAAa,CAAA;AAAA,IACrD,MAAA;AAAA,IACA,SAAA;AAAA,IACA,QAAW,GAAA,UAAA;AAAA,IACX,GAAA;AAAA,GACyB,EAAA;AACzB,IAAM,MAAA,OAAA,GAAU,SAAU,CAAA,MAAA,CAAO,IAAI,CAAA,CAAA;AACrC,IAAM,MAAA,SAAA,GAAY,IAAI,OAAO,CAAA,CAAA;AAC7B,IAAA,MAAM,EAAE,MAAA,EAAW,GAAA,eAAA,CAAgB,QAAQ,SAAS,CAAA,CAAA;AACpD,IAAM,MAAA,QAAA,GAAW,OAA0B,IAAI,CAAA,CAAA;AAE/C,IAAA,OAAA,CAAQ,MAAM;AACZ,MAAS,QAAA,CAAA,OAAA,GAAU,iBAAkB,CAAA,MAAA,EAAQ,SAAS,CAAA,CAAA;AAAA,KACrD,EAAA,CAAC,SAAW,EAAA,MAAM,CAAC,CAAA,CAAA;AAEtB,IAAA,MAAM,qBAAwB,GAAA,WAAA;AAAA,MAC5B,CAAC,KAAK,cAAmB,KAAA;AACvB,QAAA,IAAI,cAAgB,EAAA;AAKlB,UAAA,QAAA,CAAS,cAAe,CAAA,KAA0B,CAAE,CAAA,IAAA,CAAK,CAAC,QAAa,KAAA;AACrE,YAAI,IAAA,QAAA,KAAa,QAAQ,GAAK,EAAA;AAC5B,cAAoB,mBAAA,CAAA,GAAA,CAAI,QAAuB,YAAY,CAAA,CAAA;AAAA,aAC7D;AAAA,WACD,CAAA,CAAA;AAAA,SACH;AAAA,OACF;AAAA,MACA,CAAC,QAAQ,CAAA;AAAA,KACX,CAAA;AAEA,IACE,uBAAA,GAAA;AAAA,MAAC,QAAA;AAAA,MAAA;AAAA,QACC,SAAW,EAAA,SAAA;AAAA,QACX,iBAAmB,EAAA,qBAAA;AAAA,QACnB,QAAA;AAAA,QACA,UAAU,QAAS,CAAA,OAAA;AAAA,QACnB,MAAQ,EAAA,MAAA;AAAA,QACR,KAAA,EAAO,OAAO,KAAQ,GAAA,EAAA;AAAA,OAAA;AAAA,KACxB,CAAA;AAAA,GAEJ;AAAA,EACA,yBAAA;AAAyB,EAAA;AAEzB,iBAAkB,CAAA,eAAA,EAAiB,cAAc,eAAiB,EAAA;AAAA,EAChE,aAAe,EAAA,KAAA;AACjB,CAAC,CAAA;;;;"}

package/esm/cell-renderers/lookup-cell/LookupCell.js

@@ -1,24 +0,0 @@
-import { jsx } from 'react/jsx-runtime';
-import { useLookupValues } from '@vuu-ui/vuu-data-react';
-import { dataAndColumnUnchanged, registerComponent } from '@vuu-ui/vuu-utils';
-import { memo } from 'react';
-
-const LookupCell = memo(
-  function LookupCell2({
-    column,
-    columnMap,
-    row
-  }) {
-    const dataIdx = columnMap[column.name];
-    const dataValue = row[dataIdx];
-    const { initialValue: value } = useLookupValues(column, dataValue);
-    return /* @__PURE__ */ jsx("span", { children: value?.label });
-  },
-  dataAndColumnUnchanged
-);
-registerComponent("lookup-cell", LookupCell, "cell-renderer", {
-  userCanAssign: false
-});
-
-export { LookupCell };
-//# sourceMappingURL=LookupCell.js.map

package/esm/cell-renderers/lookup-cell/LookupCell.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"LookupCell.js","sources":["../../../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},\ndataAndColumnUnchanged);\n\nregisterComponent(\"lookup-cell\", LookupCell, \"cell-renderer\", {\n  userCanAssign: false,\n});\n"],"names":["LookupCell"],"mappings":";;;;;AAKO,MAAM,UAAa,GAAA,IAAA;AAAA,EAAK,SAASA,WAAW,CAAA;AAAA,IACjD,MAAA;AAAA,IACA,SAAA;AAAA,IACA,GAAA;AAAA,GACyB,EAAA;AACzB,IAAM,MAAA,OAAA,GAAU,SAAU,CAAA,MAAA,CAAO,IAAI,CAAA,CAAA;AACrC,IAAM,MAAA,SAAA,GAAY,IAAI,OAAO,CAAA,CAAA;AAC7B,IAAA,MAAM,EAAE,YAAc,EAAA,KAAA,EAAU,GAAA,eAAA,CAAgB,QAAQ,SAAS,CAAA,CAAA;AACjE,IAAO,uBAAA,GAAA,CAAC,MAAM,EAAA,EAAA,QAAA,EAAA,KAAA,EAAO,KAAM,EAAA,CAAA,CAAA;AAAA,GAC7B;AAAA,EACA,sBAAA;AAAsB,EAAA;AAEtB,iBAAkB,CAAA,aAAA,EAAe,YAAY,eAAiB,EAAA;AAAA,EAC5D,aAAe,EAAA,KAAA;AACjB,CAAC,CAAA;;;;"}

package/esm/cell-renderers/pct-progress-cell/PctProgressCell.css

@@ -1,30 +0,0 @@
-.vuuPctProgressCell {
-    --progress-bar-width: 2px;
-    position: relative;
-}
-
-.vuuPctProgressCell-zero {
-    --progress-bar-width: 0px;
-}
-.vuuPctProgressCell-complete {
-    --progress-bar-width: 0px;
-}
-
-.vuuPctProgressCell-progressBar {
-    background-color: var(--vuu-color-green-60-fade-30);
-    border-right: solid var(--progress-bar-width) var(--vuu-color-green-60);
-    display: inline-block;
-    height: 20px;
-    left: 0;
-    overflow: hidden;
-    position: absolute;
-    width: var(--progress-bar-pct, 0);
-}
-
-
-.vuuPctProgressCell-text {
-    display: inline-block;
-    text-align: left;
-    width: 80%;
-    z-index: 1;
-}

package/esm/cell-renderers/pct-progress-cell/PctProgressCell.js

@@ -1,51 +0,0 @@
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { registerComponent } from '@vuu-ui/vuu-utils';
-import cx from 'clsx';
-
-const classBase = "vuuPctProgressCell";
-const getPercentageValue = (value) => {
-  if (value >= 0 && value <= 1) {
-    return value * 100;
-  } else if (value > 2) {
-    return 0;
-  } else if (value > 1) {
-    return 100;
-  } else {
-    return 0;
-  }
-};
-const PctProgressCell = ({ column, columnMap, row }) => {
-  const value = row[columnMap[column.name]];
-  const percentageValue = getPercentageValue(value);
-  const className = cx(classBase, {});
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      className: cx(className, {
-        [`${classBase}-zero`]: percentageValue === 0,
-        [`${classBase}-complete`]: percentageValue >= 100
-      }),
-      tabIndex: -1,
-      children: [
-        /* @__PURE__ */ jsx(
-          "span",
-          {
-            className: `${classBase}-progressBar`,
-            style: { "--progress-bar-pct": `${percentageValue}%` }
-          }
-        ),
-        /* @__PURE__ */ jsx("span", { className: `${classBase}-text`, children: `${percentageValue.toFixed(
-          2
-        )} %` })
-      ]
-    }
-  );
-};
-registerComponent("vuu.pct-progress", PctProgressCell, "cell-renderer", {
-  description: "Percentage formatter",
-  label: "Percentage formatter",
-  serverDataType: "double"
-});
-
-export { PctProgressCell };
-//# sourceMappingURL=PctProgressCell.js.map

package/esm/cell-renderers/pct-progress-cell/PctProgressCell.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"PctProgressCell.js","sources":["../../../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 { CSSProperties } from \"react\";\n\nimport \"./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 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":[],"mappings":";;;;AAOA,MAAM,SAAY,GAAA,oBAAA,CAAA;AAElB,MAAM,kBAAA,GAAqB,CAAC,KAAkB,KAAA;AAC5C,EAAI,IAAA,KAAA,IAAS,CAAK,IAAA,KAAA,IAAS,CAAG,EAAA;AAC5B,IAAA,OAAO,KAAQ,GAAA,GAAA,CAAA;AAAA,GACjB,MAAA,IAAW,QAAQ,CAAG,EAAA;AACpB,IAAO,OAAA,CAAA,CAAA;AAAA,GACT,MAAA,IAAW,QAAQ,CAAG,EAAA;AACpB,IAAO,OAAA,GAAA,CAAA;AAAA,GACF,MAAA;AACL,IAAO,OAAA,CAAA,CAAA;AAAA,GACT;AACF,CAAA,CAAA;AAEO,MAAM,kBAAkB,CAAC,EAAE,MAAQ,EAAA,SAAA,EAAW,KAA0B,KAAA;AAC7E,EAAA,MAAM,KAAQ,GAAA,GAAA,CAAI,SAAU,CAAA,MAAA,CAAO,IAAI,CAAC,CAAA,CAAA;AACxC,EAAM,MAAA,eAAA,GAAkB,mBAAmB,KAAK,CAAA,CAAA;AAChD,EAAA,MAAM,SAAY,GAAA,EAAA,CAAG,SAAW,EAAA,EAAE,CAAA,CAAA;AAElC,EACE,uBAAA,IAAA;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,GAAA;AAAA,OAC/C,CAAA;AAAA,MACD,QAAU,EAAA,CAAA,CAAA;AAAA,MAEV,QAAA,EAAA;AAAA,wBAAA,GAAA;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,EAAA;AAAA,WAAA;AAAA,SACvD;AAAA,4BACC,MAAK,EAAA,EAAA,SAAA,EAAW,GAAG,SAAS,CAAA,KAAA,CAAA,EAAU,aAAG,eAAgB,CAAA,OAAA;AAAA,UACxD,CAAA;AAAA,SACD,CAAK,EAAA,CAAA,EAAA,CAAA;AAAA,OAAA;AAAA,KAAA;AAAA,GACR,CAAA;AAEJ,EAAA;AAEA,iBAAkB,CAAA,kBAAA,EAAoB,iBAAiB,eAAiB,EAAA;AAAA,EACtE,WAAa,EAAA,sBAAA;AAAA,EACb,KAAO,EAAA,sBAAA;AAAA,EACP,cAAgB,EAAA,QAAA;AAClB,CAAC,CAAA;;;;"}

package/esm/cell-renderers/progress-cell/ProgressCell.css

@@ -1,39 +0,0 @@
-.vuuProgressCell {
-   align-items: center;
-   display: flex;
-}
-
-.vuuProgressCell-track {
-    display: inline-block;
-    flex: auto 1 1;
-    height: 4px;
-    overflow: hidden;
-    position: relative;
-}
-
-.vuuProgressCell-bg {
-    background-color: var(--salt-measured-background);
-    display: inline-block;
-    height: 2px;
-    left: 0;
-    position: absolute;
-    top: 1px;
-    width: 100%;
-}
-
-
-.vuuProgressCell-bar {
-    background-color: var(--salt-measured-fill);
-    display: inline-block;
-    height: 100%;
-    left: 0;
-    position: absolute;
-    top:0;
-    transform: translateX(var(--progress-bar-pct, -100%));
-    width: 100%;
-}
-
-.vuuProgressCell-text {
-    flex: 35px 0 0;
-    text-align: right;
-}

package/esm/cell-renderers/progress-cell/ProgressCell.js

@@ -1,58 +0,0 @@
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { registerComponent, isTypeDescriptor, isColumnTypeRenderer, isValidNumber } from '@vuu-ui/vuu-utils';
-import cx from 'clsx';
-
-const classBase = "vuuProgressCell";
-const ProgressCell = ({ column, columnMap, row }) => {
-  const { name, type } = column;
-  const value = row[columnMap[name]];
-  let showProgress = false;
-  let percentage = 0;
-  if (isTypeDescriptor(type) && isColumnTypeRenderer(type.renderer)) {
-    const { associatedField } = type.renderer;
-    if (associatedField) {
-      const associatedValue = row[columnMap[associatedField]];
-      if (isValidNumber(value) && isValidNumber(associatedValue)) {
-        percentage = Math.min(Math.round(value / associatedValue * 100), 100);
-        percentage = Math.min(Math.round(value / associatedValue * 100), 100);
-        showProgress = isFinite(percentage);
-      } else {
-        const floatValue = parseFloat(value);
-        if (Number.isFinite(floatValue)) {
-          const floatOtherValue = parseFloat(associatedValue);
-          if (Number.isFinite(floatOtherValue)) {
-            percentage = Math.min(
-              Math.round(floatValue / floatOtherValue * 100),
-              100
-            );
-            showProgress = isFinite(percentage);
-          }
-        }
-      }
-    } else {
-      throw Error("ProgressCell associatedField is required to render");
-    }
-  }
-  const className = cx(classBase, {});
-  return /* @__PURE__ */ jsxs("div", { className, tabIndex: -1, children: [
-    showProgress ? /* @__PURE__ */ jsxs("span", { className: `${classBase}-track`, children: [
-      /* @__PURE__ */ jsx("span", { className: `${classBase}-bg` }),
-      /* @__PURE__ */ jsx(
-        "span",
-        {
-          className: `${classBase}-bar`,
-          style: { "--progress-bar-pct": `-${100 - percentage}%` }
-        }
-      )
-    ] }) : null,
-    /* @__PURE__ */ jsx("span", { className: `${classBase}-text`, children: `${percentage} %` })
-  ] });
-};
-registerComponent("vuu.progress", ProgressCell, "cell-renderer", {
-  description: "Progress formatter",
-  label: "Progress formatter",
-  serverDataType: ["long", "int", "double"],
-  // Not until we provide settings for associaetd field
-  userCanAssign: false
-});
-//# sourceMappingURL=ProgressCell.js.map

package/esm/cell-renderers/progress-cell/ProgressCell.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ProgressCell.js","sources":["../../../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 { CSSProperties } from \"react\";\n\nimport \"./ProgressCell.css\";\n\nconst classBase = \"vuuProgressCell\";\n\nconst ProgressCell = ({ column, columnMap, row }: TableCellProps) => {\n  //TODO what about click handling\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":[],"mappings":"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"}