@vuu-ui/vuu-table 2.1.10 → 2.1.11

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

@@ -1 +1 @@
-{"version":3,"file":"InputCell.js","sources":["../../../../../packages/vuu-table/src/cell-renderers/input-cell/InputCell.tsx"],"sourcesContent":["import { Input, Tooltip } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { TableCellRendererProps } from \"@vuu-ui/vuu-table-types\";\nimport { Icon, useEditableText } from \"@vuu-ui/vuu-ui-controls\";\nimport {\n  dataDescriptorTypeToVuuRowDataItemType,\n  registerComponent,\n} from \"@vuu-ui/vuu-utils\";\nimport cx from \"clsx\";\n\nimport inputCellCss from \"./InputCell.css\";\n\nconst classBase = \"vuuTableInputCell\";\n\nexport const InputCell = ({\n  column,\n  dataRow,\n  onEdit,\n}: TableCellRendererProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-input-cell\",\n    css: inputCellCss,\n    window: targetWindow,\n  });\n\n  const dataValue = dataRow[column.name] as number | string;\n  const { align = \"left\" } = column;\n\n  const { edited, warningMessage, ...editProps } = useEditableText({\n    column,\n    onEdit,\n    type: dataDescriptorTypeToVuuRowDataItemType(column),\n    value: dataValue,\n  });\n\n  const endAdornment =\n    warningMessage && align === \"left\" ? (\n      <Tooltip content={warningMessage} placement=\"right\">\n        <Icon className={`${classBase}-icon`} name=\"error\" />\n      </Tooltip>\n    ) : undefined;\n\n  const startAdornment =\n    warningMessage && align === \"right\" ? (\n      <Tooltip content={warningMessage} placement=\"left\">\n        <Icon className={`${classBase}-icon`} name=\"error\" />\n      </Tooltip>\n    ) : undefined;\n\n  return (\n    <Input\n      {...editProps}\n      bordered\n      className={cx(classBase, {\n        [`${classBase}-edited`]: edited,\n        [`${classBase}-error`]: warningMessage !== undefined,\n      })}\n      endAdornment={endAdornment}\n      startAdornment={startAdornment}\n    />\n  );\n};\n\nregisterComponent(\"input-cell\", InputCell, \"cell-renderer\", {\n  userCanAssign: false,\n});\n"],"names":[],"mappings":";;;;;;;;;AAaA,MAAM,SAAY,GAAA,mBAAA;AAEX,MAAM,YAAY,CAAC;AAAA,EACxB,MAAA;AAAA,EACA,OAAA;AAAA,EACA;AACF,CAA8B,KAAA;AAC5B,EAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,gBAAA;AAAA,IACR,GAAK,EAAA,YAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EAAM,MAAA,SAAA,GAAY,OAAQ,CAAA,MAAA,CAAO,IAAI,CAAA;AACrC,EAAM,MAAA,EAAE,KAAQ,GAAA,MAAA,EAAW,GAAA,MAAA;AAE3B,EAAA,MAAM,EAAE,MAAQ,EAAA,cAAA,EAAgB,GAAG,SAAA,KAAc,eAAgB,CAAA;AAAA,IAC/D,MAAA;AAAA,IACA,MAAA;AAAA,IACA,IAAA,EAAM,uCAAuC,MAAM,CAAA;AAAA,IACnD,KAAO,EAAA;AAAA,GACR,CAAA;AAED,EAAA,MAAM,eACJ,cAAkB,IAAA,KAAA,KAAU,yBACzB,GAAA,CAAA,OAAA,EAAA,EAAQ,SAAS,cAAgB,EAAA,SAAA,EAAU,SAC1C,QAAC,kBAAA,GAAA,CAAA,IAAA,EAAA,EAAK,WAAW,CAAG,EAAA,SAAS,SAAS,IAAK,EAAA,OAAA,EAAQ,GACrD,CACE,GAAA,KAAA,CAAA;AAEN,EAAA,MAAM,iBACJ,cAAkB,IAAA,KAAA,KAAU,0BACzB,GAAA,CAAA,OAAA,EAAA,EAAQ,SAAS,cAAgB,EAAA,SAAA,EAAU,QAC1C,QAAC,kBAAA,GAAA,CAAA,IAAA,EAAA,EAAK,WAAW,CAAG,EAAA,SAAS,SAAS,IAAK,EAAA,OAAA,EAAQ,GACrD,CACE,GAAA,KAAA,CAAA;AAEN,EACE,uBAAA,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACE,GAAG,SAAA;AAAA,MACJ,QAAQ,EAAA,IAAA;AAAA,MACR,SAAA,EAAW,GAAG,SAAW,EAAA;AAAA,QACvB,CAAC,CAAA,EAAG,SAAS,CAAA,OAAA,CAAS,GAAG,MAAA;AAAA,QACzB,CAAC,CAAA,EAAG,SAAS,CAAA,MAAA,CAAQ,GAAG,cAAmB,KAAA,KAAA;AAAA,OAC5C,CAAA;AAAA,MACD,YAAA;AAAA,MACA;AAAA;AAAA,GACF;AAEJ;AAEA,iBAAkB,CAAA,YAAA,EAAc,WAAW,eAAiB,EAAA;AAAA,EAC1D,aAAe,EAAA;AACjB,CAAC,CAAA;;;;"}
+{"version":3,"file":"InputCell.js","sources":["../../../../../packages/vuu-table/src/cell-renderers/input-cell/InputCell.tsx"],"sourcesContent":["import { Input, Tooltip } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { TableCellRendererProps } from \"@vuu-ui/vuu-table-types\";\nimport { Icon, useEditableText } from \"@vuu-ui/vuu-ui-controls\";\nimport {\n  dataDescriptorTypeToVuuRowDataItemType,\n  getVuuEditMessage,\n  registerComponent,\n} from \"@vuu-ui/vuu-utils\";\nimport cx from \"clsx\";\n\nimport inputCellCss from \"./InputCell.css\";\n\nconst classBase = \"vuuTableInputCell\";\n\nexport const InputCell = ({\n  column,\n  dataRow,\n  onEdit,\n}: TableCellRendererProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-input-cell\",\n    css: inputCellCss,\n    window: targetWindow,\n  });\n\n  const dataValue = dataRow[column.name] as number | string;\n\n  const { align = \"left\" } = column;\n\n  const {\n    edited,\n    editing,\n    warningMessage,\n    previousValue = \"\",\n    ...editProps\n  } = useEditableText({\n    column,\n    onEdit,\n    type: dataDescriptorTypeToVuuRowDataItemType(column),\n    value: dataValue,\n  });\n\n  // TODO can this move into useEdtableText ?\n  const editRejected = getVuuEditMessage(dataRow, column, previousValue);\n\n  const endAdornment =\n    editRejected && align === \"left\" ? (\n      <Tooltip content={editRejected} placement=\"right\">\n        <Icon className={`${classBase}-icon`} name=\"error\" />\n      </Tooltip>\n    ) : warningMessage && align === \"left\" ? (\n      <Tooltip content={warningMessage} placement=\"right\">\n        <Icon className={`${classBase}-icon`} name=\"error\" />\n      </Tooltip>\n    ) : undefined;\n\n  const startAdornment =\n    editRejected && align === \"right\" ? (\n      <Tooltip content={editRejected} placement=\"right\">\n        <Icon className={`${classBase}-icon`} name=\"error\" />\n      </Tooltip>\n    ) : warningMessage && align === \"right\" ? (\n      <Tooltip content={warningMessage} placement=\"left\">\n        <Icon className={`${classBase}-icon`} name=\"error\" />\n      </Tooltip>\n    ) : undefined;\n\n  return (\n    <Input\n      {...editProps}\n      bordered\n      className={cx(classBase, {\n        [`${classBase}-edited`]: edited,\n        [`${classBase}-error`]: warningMessage !== undefined,\n        [`${classBase}-warning`]: editRejected !== undefined,\n        vuuEditing: editing,\n      })}\n      endAdornment={endAdornment}\n      startAdornment={startAdornment}\n    />\n  );\n};\n\nregisterComponent(\"input-cell\", InputCell, \"cell-renderer\", {\n  userCanAssign: false,\n});\n"],"names":[],"mappings":";;;;;;;;;AAcA,MAAM,SAAY,GAAA,mBAAA;AAEX,MAAM,YAAY,CAAC;AAAA,EACxB,MAAA;AAAA,EACA,OAAA;AAAA,EACA;AACF,CAA8B,KAAA;AAC5B,EAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,gBAAA;AAAA,IACR,GAAK,EAAA,YAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EAAM,MAAA,SAAA,GAAY,OAAQ,CAAA,MAAA,CAAO,IAAI,CAAA;AAErC,EAAM,MAAA,EAAE,KAAQ,GAAA,MAAA,EAAW,GAAA,MAAA;AAE3B,EAAM,MAAA;AAAA,IACJ,MAAA;AAAA,IACA,OAAA;AAAA,IACA,cAAA;AAAA,IACA,aAAgB,GAAA,EAAA;AAAA,IAChB,GAAG;AAAA,MACD,eAAgB,CAAA;AAAA,IAClB,MAAA;AAAA,IACA,MAAA;AAAA,IACA,IAAA,EAAM,uCAAuC,MAAM,CAAA;AAAA,IACnD,KAAO,EAAA;AAAA,GACR,CAAA;AAGD,EAAA,MAAM,YAAe,GAAA,iBAAA,CAAkB,OAAS,EAAA,MAAA,EAAQ,aAAa,CAAA;AAErE,EAAA,MAAM,eACJ,YAAgB,IAAA,KAAA,KAAU,MACxB,mBAAA,GAAA,CAAC,WAAQ,OAAS,EAAA,YAAA,EAAc,SAAU,EAAA,OAAA,EACxC,8BAAC,IAAK,EAAA,EAAA,SAAA,EAAW,GAAG,SAAS,CAAA,KAAA,CAAA,EAAS,MAAK,OAAQ,EAAA,CAAA,EACrD,CACE,GAAA,cAAA,IAAkB,UAAU,MAC9B,mBAAA,GAAA,CAAC,OAAQ,EAAA,EAAA,OAAA,EAAS,gBAAgB,SAAU,EAAA,OAAA,EAC1C,QAAC,kBAAA,GAAA,CAAA,IAAA,EAAA,EAAK,WAAW,CAAG,EAAA,SAAS,SAAS,IAAK,EAAA,OAAA,EAAQ,GACrD,CACE,GAAA,KAAA,CAAA;AAEN,EAAA,MAAM,iBACJ,YAAgB,IAAA,KAAA,KAAU,OACxB,mBAAA,GAAA,CAAC,WAAQ,OAAS,EAAA,YAAA,EAAc,SAAU,EAAA,OAAA,EACxC,8BAAC,IAAK,EAAA,EAAA,SAAA,EAAW,GAAG,SAAS,CAAA,KAAA,CAAA,EAAS,MAAK,OAAQ,EAAA,CAAA,EACrD,CACE,GAAA,cAAA,IAAkB,UAAU,OAC9B,mBAAA,GAAA,CAAC,OAAQ,EAAA,EAAA,OAAA,EAAS,gBAAgB,SAAU,EAAA,MAAA,EAC1C,QAAC,kBAAA,GAAA,CAAA,IAAA,EAAA,EAAK,WAAW,CAAG,EAAA,SAAS,SAAS,IAAK,EAAA,OAAA,EAAQ,GACrD,CACE,GAAA,KAAA,CAAA;AAEN,EACE,uBAAA,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACE,GAAG,SAAA;AAAA,MACJ,QAAQ,EAAA,IAAA;AAAA,MACR,SAAA,EAAW,GAAG,SAAW,EAAA;AAAA,QACvB,CAAC,CAAA,EAAG,SAAS,CAAA,OAAA,CAAS,GAAG,MAAA;AAAA,QACzB,CAAC,CAAA,EAAG,SAAS,CAAA,MAAA,CAAQ,GAAG,cAAmB,KAAA,KAAA,CAAA;AAAA,QAC3C,CAAC,CAAA,EAAG,SAAS,CAAA,QAAA,CAAU,GAAG,YAAiB,KAAA,KAAA,CAAA;AAAA,QAC3C,UAAY,EAAA;AAAA,OACb,CAAA;AAAA,MACD,YAAA;AAAA,MACA;AAAA;AAAA,GACF;AAEJ;AAEA,iBAAkB,CAAA,YAAA,EAAc,WAAW,eAAiB,EAAA;AAAA,EAC1D,aAAe,EAAA;AACjB,CAAC,CAAA;;;;"}

package/esm/data-row/DataRow.js

@@ -135,7 +135,7 @@ function createColumnMap(columns, schemaColumns) {
   const columnMap = {
     ...ColumnMapIntrinsicColumns
   };
-  columns.forEach((name, i) => {
+  columns.forEach((name, i, cols) => {
     const schemaColumn = schemaColumns.find((col) => col.name === name);
     if (schemaColumn) {
       const serverDataType = getServerDataType(schemaColumn, true);
@@ -149,11 +149,20 @@ function createColumnMap(columns, schemaColumns) {
           `[DataRow] calculated column with invalid serverDataType ${name}`
         );
       }
+    } else if (name === "vuuMsg" && i === cols.length - 1) {
+      columnMap[name] = { index: i + 10, type: "string" };
     } else {
       throw Error(`[DataRow] dataRowFactory column not in schema ${name}`);
     }
   });
-  return columnMap;
+  if (columnMap.vuuMsg === void 0) {
+    return {
+      ...columnMap,
+      vuuMsg: { index: columns.length + 10, type: "string" }
+    };
+  } else {
+    return columnMap;
+  }
 }
 const dataRowFactory = (columns, schemaColumns) => {
   let columnMap = createColumnMap(columns, schemaColumns);

package/esm/data-row/DataRow.js.map

@@ -1 +1 @@
-{"version":3,"file":"DataRow.js","sources":["../../../../packages/vuu-table/src/data-row/DataRow.ts"],"sourcesContent":["import { DataSourceRow, SchemaColumn } from \"@vuu-ui/vuu-data-types\";\nimport {\n  StringNumericType,\n  VuuColumnDataType,\n  VuuDataRow,\n  VuuRowDataItemType,\n} from \"@vuu-ui/vuu-protocol-types\";\nimport {\n  DataRow,\n  DataRowIntrinsicAttribute,\n  DataRowOperation,\n  DataRowOperations,\n} from \"@vuu-ui/vuu-table-types\";\nimport {\n  getCalculatedColumnDetails,\n  getServerDataType,\n  isCalculatedColumn,\n  isVuuColumnDataType,\n} from \"@vuu-ui/vuu-utils\";\n\ntype ColumnMapEntry = {\n  index: number;\n  type: VuuColumnDataType;\n};\n\nconst dataRowSymbol = Symbol(\"DataRow\");\n\n/**\n * We allow undefined to allow us to null out rather than delete entries, for\n * performance reasons.\n */\ntype DataRowColumnMap = Record<string, ColumnMapEntry | undefined>;\n\nconst dataRowIntrinsicAttributes: Record<DataRowIntrinsicAttribute, true> = {\n  childCount: true,\n  depth: true,\n  index: true,\n  isExpanded: true,\n  isSelected: true,\n  isLeaf: true,\n  key: true,\n  renderIndex: true,\n};\n\nconst dataRowOperations: Record<DataRowOperation, true> = {\n  hasColumn: true,\n};\n\nconst isDataRowIntrinsicAttribute = (\n  attrName: string,\n): attrName is DataRowIntrinsicAttribute =>\n  dataRowIntrinsicAttributes[attrName as DataRowIntrinsicAttribute] === true;\n\nconst isDataRowOperation = (attrName: string): attrName is DataRowOperation =>\n  dataRowOperations[attrName as DataRowOperation] === true;\n\nconst stringNumericTypes: Record<StringNumericType, true> = {\n  long: true,\n  scaleddecimal2: true,\n  scaleddecimal4: true,\n  scaleddecimal6: true,\n  scaleddecimal8: true,\n};\n\nconst isStringNumericType = (\n  type: VuuColumnDataType,\n): type is StringNumericType =>\n  stringNumericTypes[type as StringNumericType] === true;\n\nconst MAX_DECIMALS = \"0000000\";\n\nconst injectDecimalPoint = (value: string, decimal: 2 | 4 | 6 | 8) => {\n  if (value === \"0\" || value === \"-0\" || value === \"\") {\n    return value;\n  } else {\n    if (value[0] === \"-\") {\n      const digits = value.slice(1);\n      if (digits.length < decimal) {\n        return `-0.${(MAX_DECIMALS + digits).slice(-decimal)}`;\n      } else if (digits.length === decimal) {\n        return `-0.${value}`;\n      } else {\n        return `-${digits.slice(0, -decimal)}.${digits.slice(-decimal)}`;\n      }\n    } else {\n      if (value.length < decimal) {\n        return `0.${(MAX_DECIMALS + value).slice(-decimal)}`;\n      } else if (value.length === decimal) {\n        return `0.${value}`;\n      } else {\n        return `${value.slice(0, -decimal)}.${value.slice(-decimal)}`;\n      }\n    }\n  }\n};\n\nconst formatStringNumeric = (value: string, type: StringNumericType) => {\n  switch (type) {\n    case \"long\":\n      return value;\n    case \"scaleddecimal2\":\n      return injectDecimalPoint(value, 2);\n    case \"scaleddecimal4\":\n      return injectDecimalPoint(value, 4);\n    case \"scaleddecimal6\":\n      return injectDecimalPoint(value, 6);\n    case \"scaleddecimal8\":\n      return injectDecimalPoint(value, 8);\n  }\n};\n/**\n * DataRow wraps a vuu DataSourceRow and a columnMap to provide a more convenient\n * API for manipulating rows from server. It is now used internally by Table. This\n * removes the need to always provide a columnMap to any componnet that must work with\n * data rows. It also removes a category of timing bugs which cause the columnMap\n * to get out of sync with data.\n * Because properties are provided via a proxy, and the DataRow has the Schema, there is\n * flexibility to enhance handling for specific properties. This is used now to insert\n * decimal point in scaleddecimal values.\n * @param data\n * @param columnMap\n * @returns\n */\nfunction DataRowImpl(data: VuuDataRow, columnMap: DataRowColumnMap): DataRow {\n  const target: Record<string, VuuRowDataItemType> = {};\n\n  const getPropertyNames = () => {\n    return Object.keys(columnMap);\n  };\n\n  const jsonSerializer = () => {\n    return Object.entries(columnMap).reduce<Record<string, VuuRowDataItemType>>(\n      (json, [name, mapEntry]) => {\n        if (mapEntry) {\n          json[name] = data[mapEntry.index];\n        }\n        return json;\n      },\n      {},\n    );\n  };\n\n  const DataRowOperations: DataRowOperations = {\n    hasColumn: (name: string) => columnMap[name] !== undefined,\n  };\n\n  return new Proxy(target, {\n    get(_obj, prop: string | symbol) {\n      if (typeof prop === \"symbol\") {\n        if (prop === dataRowSymbol) return true;\n        // TODO what does React use this for\n        return undefined;\n      } else if (prop === \"toJSON\") {\n        return jsonSerializer;\n      } else if (prop === \"toString\") {\n        return \"DataRow\";\n      } else if (prop === \"$$typeof\") {\n        // some react internal weirdness\n        return undefined;\n      } else if (isDataRowOperation(prop)) {\n        return DataRowOperations[prop];\n      } else if (prop === \"getPropertyNames\") {\n        return getPropertyNames;\n      }\n      const columnMapEntry = columnMap[prop];\n\n      if (columnMapEntry === undefined) {\n        if (prop !== \"\") {\n          // System columns like the selection checkbox column\n          console.warn(`[DataRow:Proxy] unknown column ${prop}`);\n        }\n        return undefined;\n      }\n\n      if (isDataRowIntrinsicAttribute(prop)) {\n        return data[columnMapEntry.index];\n      }\n\n      if (isStringNumericType(columnMapEntry.type)) {\n        return formatStringNumeric(\n          data[columnMapEntry.index] as string,\n          columnMapEntry.type,\n        );\n      }\n\n      return data[columnMapEntry.index];\n\n      // throw new Error(`Unknown column: ${prop}`);\n    },\n    set() {\n      throw new TypeError(\"DataRow is readonly\");\n    },\n  }) as DataRow;\n}\n\nexport type DataRowFunc = (data: DataSourceRow) => DataRow;\n\nconst ColumnMapIntrinsicColumns: DataRowColumnMap = {\n  index: { index: 0, type: \"int\" },\n  renderIndex: { index: 1, type: \"int\" },\n  isLeaf: { index: 2, type: \"boolean\" },\n  isExpanded: { index: 3, type: \"boolean\" },\n  depth: { index: 4, type: \"int\" },\n  childCount: { index: 5, type: \"int\" },\n  key: { index: 6, type: \"string\" },\n  isSelected: { index: 7, type: \"boolean\" },\n};\n\nfunction createColumnMap(\n  columns: string[],\n  schemaColumns: readonly SchemaColumn[],\n) {\n  const columnMap: DataRowColumnMap = {\n    ...ColumnMapIntrinsicColumns,\n  };\n\n  columns.forEach((name, i) => {\n    const schemaColumn = schemaColumns.find((col) => col.name === name);\n    if (schemaColumn) {\n      const serverDataType = getServerDataType(schemaColumn, true);\n      columnMap[name] = { index: i + 10, type: serverDataType };\n    } else if (isCalculatedColumn(name)) {\n      const { serverDataType } = getCalculatedColumnDetails(name);\n      if (isVuuColumnDataType(serverDataType)) {\n        columnMap[name] = { index: i + 10, type: serverDataType };\n      } else {\n        throw Error(\n          `[DataRow] calculated column with invalid serverDataType ${name}`,\n        );\n      }\n    } else {\n      throw Error(`[DataRow] dataRowFactory column not in schema ${name}`);\n    }\n  });\n  return columnMap;\n}\n\n/**\n *\n * @param columns the names of columns included in subscription\n * @param schemaColumns full schema definitions for all available columns,\n * the serverDataTypes are used.\n * @returns a tuple containing:\n * - factory function that will create a DataRow instance from a DataSourceRow\n * array.\n * - a function that can be used to reset the columns, which will be used for all\n * subsequently created DataRows. Used by Table when user adds or removes columns\n * at runtime.\n */\nexport const dataRowFactory = (\n  columns: string[],\n  schemaColumns: readonly SchemaColumn[],\n): [DataRowFunc, (columns: string[]) => void] => {\n  let columnMap = createColumnMap(columns, schemaColumns);\n\n  const setColumns = (columns: string[]) => {\n    // new columnMap will be used for all subsequently created DataRows\n    columnMap = createColumnMap(columns, schemaColumns);\n  };\n\n  const DataRow = function (data: DataSourceRow) {\n    return DataRowImpl(data, columnMap);\n  };\n\n  return [DataRow, setColumns];\n};\n\nif (process.env.NODE_ENV !== \"production\") {\n  // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n  //@ts-ignore\n  window.devtoolsFormatters = [\n    {\n      // eslint-disable-next-line @typescript-eslint/no-explicit-any\n      header: function (obj: any) {\n        if (obj[dataRowSymbol]) {\n          return [\n            \"div\",\n            {\n              style: \"display: flex; gap: 4px; justify-content: space-between\",\n            },\n            [\"span\", {}, \"Vuu DataRow\"],\n            [\"span\", { style: \"font-weight: bold;\" }, `[${obj.index}]`],\n            [\n              \"span\",\n              { style: \"font-weight: bold; color: blue;\" },\n              `#${obj.key}`,\n            ],\n          ];\n        }\n        return null;\n      },\n      hasBody: function () {\n        return true;\n      },\n      // eslint-disable-next-line @typescript-eslint/no-explicit-any\n      body: function (obj: any) {\n        return [\n          \"div\",\n          {},\n          [\n            \"div\",\n            {\n              style: \"display: flex; gap: 4px;\",\n            },\n            [\"span\", {}, \"index\"],\n            [\"span\", {}, obj.index],\n          ],\n          [\n            \"div\",\n            {\n              style: \"display: flex; gap: 4px;\",\n            },\n            [\"span\", {}, \"key\"],\n            [\"span\", {}, obj.key],\n          ],\n          [\n            \"div\",\n            {\n              style: \"display: flex; gap: 4px;\",\n            },\n            [\"span\", {}, \"renderIndex\"],\n            [\"span\", {}, obj.renderIndex],\n          ],\n          [\n            \"div\",\n            {\n              style: \"display: flex; gap: 4px;\",\n            },\n            [\"span\", {}, \"isSelected\"],\n            [\"span\", {}, obj.isSelected],\n          ],\n          ...obj.getPropertyNames().map((name: string) => {\n            return [\n              \"div\",\n              {\n                style: \"display: flex; gap: 4px;\",\n              },\n              [\"span\", {}, name],\n              [\"span\", {}, obj[name]],\n            ];\n          }),\n        ];\n      },\n    },\n  ];\n}\n"],"names":["DataRowOperations","columns","DataRow"],"mappings":"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"}
+{"version":3,"file":"DataRow.js","sources":["../../../../packages/vuu-table/src/data-row/DataRow.ts"],"sourcesContent":["import { DataSourceRow, SchemaColumn } from \"@vuu-ui/vuu-data-types\";\nimport {\n  StringNumericType,\n  VuuColumnDataType,\n  VuuDataRow,\n  VuuRowDataItemType,\n} from \"@vuu-ui/vuu-protocol-types\";\nimport {\n  DataRow,\n  DataRowIntrinsicAttribute,\n  DataRowOperation,\n  DataRowOperations,\n} from \"@vuu-ui/vuu-table-types\";\nimport {\n  getCalculatedColumnDetails,\n  getServerDataType,\n  isCalculatedColumn,\n  isVuuColumnDataType,\n} from \"@vuu-ui/vuu-utils\";\n\ntype ColumnMapEntry = {\n  index: number;\n  type: VuuColumnDataType;\n};\n\nconst dataRowSymbol = Symbol(\"DataRow\");\n\n/**\n * We allow undefined to allow us to null out rather than delete entries, for\n * performance reasons.\n */\ntype DataRowColumnMap = Record<string, ColumnMapEntry | undefined>;\n\nconst dataRowIntrinsicAttributes: Record<DataRowIntrinsicAttribute, true> = {\n  childCount: true,\n  depth: true,\n  index: true,\n  isExpanded: true,\n  isSelected: true,\n  isLeaf: true,\n  key: true,\n  renderIndex: true,\n};\n\nconst dataRowOperations: Record<DataRowOperation, true> = {\n  hasColumn: true,\n};\n\nconst isDataRowIntrinsicAttribute = (\n  attrName: string,\n): attrName is DataRowIntrinsicAttribute =>\n  dataRowIntrinsicAttributes[attrName as DataRowIntrinsicAttribute] === true;\n\nconst isDataRowOperation = (attrName: string): attrName is DataRowOperation =>\n  dataRowOperations[attrName as DataRowOperation] === true;\n\nconst stringNumericTypes: Record<StringNumericType, true> = {\n  long: true,\n  scaleddecimal2: true,\n  scaleddecimal4: true,\n  scaleddecimal6: true,\n  scaleddecimal8: true,\n};\n\nconst isStringNumericType = (\n  type: VuuColumnDataType,\n): type is StringNumericType =>\n  stringNumericTypes[type as StringNumericType] === true;\n\nconst MAX_DECIMALS = \"0000000\";\n\nconst injectDecimalPoint = (value: string, decimal: 2 | 4 | 6 | 8) => {\n  if (value === \"0\" || value === \"-0\" || value === \"\") {\n    return value;\n  } else {\n    if (value[0] === \"-\") {\n      const digits = value.slice(1);\n      if (digits.length < decimal) {\n        return `-0.${(MAX_DECIMALS + digits).slice(-decimal)}`;\n      } else if (digits.length === decimal) {\n        return `-0.${value}`;\n      } else {\n        return `-${digits.slice(0, -decimal)}.${digits.slice(-decimal)}`;\n      }\n    } else {\n      if (value.length < decimal) {\n        return `0.${(MAX_DECIMALS + value).slice(-decimal)}`;\n      } else if (value.length === decimal) {\n        return `0.${value}`;\n      } else {\n        return `${value.slice(0, -decimal)}.${value.slice(-decimal)}`;\n      }\n    }\n  }\n};\n\nconst formatStringNumeric = (value: string, type: StringNumericType) => {\n  switch (type) {\n    case \"long\":\n      return value;\n    case \"scaleddecimal2\":\n      return injectDecimalPoint(value, 2);\n    case \"scaleddecimal4\":\n      return injectDecimalPoint(value, 4);\n    case \"scaleddecimal6\":\n      return injectDecimalPoint(value, 6);\n    case \"scaleddecimal8\":\n      return injectDecimalPoint(value, 8);\n  }\n};\n/**\n * DataRow wraps a vuu DataSourceRow and a columnMap to provide a more convenient\n * API for manipulating rows from server. It is now used internally by Table. This\n * removes the need to always provide a columnMap to any component that must work with\n * data rows. It also removes a category of timing bugs which cause the columnMap\n * to get out of sync with data.\n * Because properties are provided via a proxy, and the DataRow has the Schema, there is\n * flexibility to enhance handling for specific properties. This is used now to insert\n * decimal point in scaleddecimal values.\n * @param data\n * @param columnMap\n * @returns\n */\nfunction DataRowImpl(data: VuuDataRow, columnMap: DataRowColumnMap): DataRow {\n  const target: Record<string, VuuRowDataItemType> = {};\n\n  const getPropertyNames = () => {\n    return Object.keys(columnMap);\n  };\n\n  const jsonSerializer = () => {\n    return Object.entries(columnMap).reduce<Record<string, VuuRowDataItemType>>(\n      (json, [name, mapEntry]) => {\n        if (mapEntry) {\n          json[name] = data[mapEntry.index];\n        }\n        return json;\n      },\n      {},\n    );\n  };\n\n  const DataRowOperations: DataRowOperations = {\n    hasColumn: (name: string) => columnMap[name] !== undefined,\n  };\n\n  return new Proxy(target, {\n    get(_obj, prop: string | symbol) {\n      if (typeof prop === \"symbol\") {\n        if (prop === dataRowSymbol) return true;\n        // TODO what does React use this for\n        return undefined;\n      } else if (prop === \"toJSON\") {\n        return jsonSerializer;\n      } else if (prop === \"toString\") {\n        return \"DataRow\";\n      } else if (prop === \"$$typeof\") {\n        // some react internal weirdness\n        return undefined;\n      } else if (isDataRowOperation(prop)) {\n        return DataRowOperations[prop];\n      } else if (prop === \"getPropertyNames\") {\n        return getPropertyNames;\n      }\n      const columnMapEntry = columnMap[prop];\n\n      if (columnMapEntry === undefined) {\n        if (prop !== \"\") {\n          // System columns like the selection checkbox column\n          console.warn(`[DataRow:Proxy] unknown column ${prop}`);\n        }\n        return undefined;\n      }\n\n      if (isDataRowIntrinsicAttribute(prop)) {\n        return data[columnMapEntry.index];\n      }\n\n      if (isStringNumericType(columnMapEntry.type)) {\n        return formatStringNumeric(\n          data[columnMapEntry.index] as string,\n          columnMapEntry.type,\n        );\n      }\n\n      return data[columnMapEntry.index];\n\n      // throw new Error(`Unknown column: ${prop}`);\n    },\n    set() {\n      throw new TypeError(\"DataRow is readonly\");\n    },\n  }) as DataRow;\n}\n\nexport type DataRowFunc = (data: DataSourceRow) => DataRow;\n\nconst ColumnMapIntrinsicColumns: DataRowColumnMap = {\n  index: { index: 0, type: \"int\" },\n  renderIndex: { index: 1, type: \"int\" },\n  isLeaf: { index: 2, type: \"boolean\" },\n  isExpanded: { index: 3, type: \"boolean\" },\n  depth: { index: 4, type: \"int\" },\n  childCount: { index: 5, type: \"int\" },\n  key: { index: 6, type: \"string\" },\n  isSelected: { index: 7, type: \"boolean\" },\n};\n\nfunction createColumnMap(\n  columns: string[],\n  schemaColumns: readonly SchemaColumn[],\n) {\n  const columnMap: DataRowColumnMap = {\n    ...ColumnMapIntrinsicColumns,\n  };\n\n  columns.forEach((name, i, cols) => {\n    const schemaColumn = schemaColumns.find((col) => col.name === name);\n    if (schemaColumn) {\n      const serverDataType = getServerDataType(schemaColumn, true);\n      columnMap[name] = { index: i + 10, type: serverDataType };\n    } else if (isCalculatedColumn(name)) {\n      const { serverDataType } = getCalculatedColumnDetails(name);\n      if (isVuuColumnDataType(serverDataType)) {\n        columnMap[name] = { index: i + 10, type: serverDataType };\n      } else {\n        throw Error(\n          `[DataRow] calculated column with invalid serverDataType ${name}`,\n        );\n      }\n    } else if (name === \"vuuMsg\" && i === cols.length - 1) {\n      // Mag column on a session table, always in last place\n      columnMap[name] = { index: i + 10, type: \"string\" };\n    } else {\n      throw Error(`[DataRow] dataRowFactory column not in schema ${name}`);\n    }\n  });\n\n  if (columnMap.vuuMsg === undefined) {\n    // We will always check for vuuMsg, even if it isn't explicitly included in the subscribed columns\n    return {\n      ...columnMap,\n      vuuMsg: { index: columns.length + 10, type: \"string\" },\n    } as DataRowColumnMap;\n  } else {\n    return columnMap;\n  }\n}\n\n/**\n *\n * @param columns the names of columns included in subscription\n * @param schemaColumns full schema definitions for all available columns,\n * the serverDataTypes are used.\n * @returns a tuple containing:\n * - factory function that will create a DataRow instance from a DataSourceRow\n * array.\n * - a function that can be used to reset the columns, which will be used for all\n * subsequently created DataRows. Used by Table when user adds or removes columns\n * at runtime.\n */\nexport const dataRowFactory = (\n  columns: string[],\n  schemaColumns: readonly SchemaColumn[],\n): [DataRowFunc, (columns: string[]) => void] => {\n  let columnMap = createColumnMap(columns, schemaColumns);\n\n  const setColumns = (columns: string[]) => {\n    // new columnMap will be used for all subsequently created DataRows\n    columnMap = createColumnMap(columns, schemaColumns);\n  };\n\n  const DataRow = function (data: DataSourceRow) {\n    return DataRowImpl(data, columnMap);\n  };\n\n  return [DataRow, setColumns];\n};\n\nif (process.env.NODE_ENV !== \"production\") {\n  // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n  //@ts-ignore\n  window.devtoolsFormatters = [\n    {\n      // eslint-disable-next-line @typescript-eslint/no-explicit-any\n      header: function (obj: any) {\n        if (obj[dataRowSymbol]) {\n          return [\n            \"div\",\n            {\n              style: \"display: flex; gap: 4px; justify-content: space-between\",\n            },\n            [\"span\", {}, \"Vuu DataRow\"],\n            [\"span\", { style: \"font-weight: bold;\" }, `[${obj.index}]`],\n            [\n              \"span\",\n              { style: \"font-weight: bold; color: blue;\" },\n              `#${obj.key}`,\n            ],\n          ];\n        }\n        return null;\n      },\n      hasBody: function () {\n        return true;\n      },\n      // eslint-disable-next-line @typescript-eslint/no-explicit-any\n      body: function (obj: any) {\n        return [\n          \"div\",\n          {},\n          [\n            \"div\",\n            {\n              style: \"display: flex; gap: 4px;\",\n            },\n            [\"span\", {}, \"index\"],\n            [\"span\", {}, obj.index],\n          ],\n          [\n            \"div\",\n            {\n              style: \"display: flex; gap: 4px;\",\n            },\n            [\"span\", {}, \"key\"],\n            [\"span\", {}, obj.key],\n          ],\n          [\n            \"div\",\n            {\n              style: \"display: flex; gap: 4px;\",\n            },\n            [\"span\", {}, \"renderIndex\"],\n            [\"span\", {}, obj.renderIndex],\n          ],\n          [\n            \"div\",\n            {\n              style: \"display: flex; gap: 4px;\",\n            },\n            [\"span\", {}, \"isSelected\"],\n            [\"span\", {}, obj.isSelected],\n          ],\n          ...obj.getPropertyNames().map((name: string) => {\n            return [\n              \"div\",\n              {\n                style: \"display: flex; gap: 4px;\",\n              },\n              [\"span\", {}, name],\n              [\"span\", {}, obj[name]],\n            ];\n          }),\n        ];\n      },\n    },\n  ];\n}\n"],"names":["DataRowOperations","columns","DataRow"],"mappings":"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"}

package/esm/index.js

@@ -1,6 +1,4 @@
 export { BulkEditPanel } from './bulk-edit/BulkEditPanel.js';
-export { useBulkEditPanel } from './bulk-edit/useBulkEditPanel.js';
-export { useBulkEditRow } from './bulk-edit/useBulkEditRow.js';
 export { CheckboxCell } from './cell-renderers/checkbox-cell/CheckboxCell.js';
 export { CheckboxRowSelectorCell } from './cell-renderers/checkbox-row-selector/CheckboxRowSelectorCell.js';
 export { InputCell } from './cell-renderers/input-cell/InputCell.js';

package/esm/index.js.map

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

package/esm/table-cell/TableCell.css.js

@@ -1,4 +1,4 @@
-var tableCellCss = ".vuuTableCell {\n  border-right-color: var(--cell-borderColor);\n  border-right-style: solid;\n  border-right-width: 1px;\n  /* unfortunately inline-flex doesn't play nice with text-overflow ellipsis */\n  display: inline-block;\n  white-space: nowrap;\n  height: 100%;\n  outline-offset: -2px;\n  overflow: hidden;\n  padding: var(--vuuTableCell-padding, 0 11px 0 8px);\n  text-overflow: ellipsis;\n  vertical-align: top;\n\n\n    &:has(.vuuCheckboxRowSelector) {\n      text-overflow: unset;\n    }\n\n}\n\n.vuuTableCell-right {\n  text-align: right;\n}\n\n.vuuTableCell-editable {\n  align-items: center;\n  display: inline-flex;\n  padding: var(--vuuTableCell-padding-editable, 0px 1px 0 2px);\n}\n\n.vuuTableCell:focus-visible {\n  outline: none;\n}\n\n.vuuTableCell-editable:focus-within,\n.vuuTableCell:focus {\n  /** This is to achieve a white background to outline dashes */\n  /* box-shadow: inset 0 0 0 var(--cell-outline-width) white; */\n  border-bottom: none;\n  .saltInput-bordered {\n    border-color: transparent;\n    outline: solid var(--salt-editable-borderColor-active) 2px;\n    outline-offset: -1px;\n  }\n\n  &.vuuEditing {\n    .saltInput-bordered {\n      outline: dashed var(--salt-editable-borderColor-active) 2px;\n      outline-offset: -1px;\n    }\n\n    .vuuTableInputCell-error.saltInput-bordered {\n        outline: dashed var(--salt-status-error-borderColor) 2px;\n    }\n  }\n\n}\n\n.vuuTableRow-selected .vuuTableCell:not(.vuuTableCell-editable):focus {\n  outline: var(\n    --vuuTableCell-outline,\n    solid var(--salt-focused-outlineColor) 2px\n  );\n\n  &:has(.vuuCheckboxRowSelector) {\n    outline: none;\n  }\n}\n/* .vuuTableCell-editable:focus {\n  outline: none;\n} */\n\n.vuuTableCell.ContextOpen {\n  outline: var(\n    --vuuTableCell-outline,\n    solid var(--vuuTableCell-contextOpen-outlineColor, var(--salt-focused-outlineColor)) 2px\n  );\n}\n";
+var tableCellCss = ".vuuTableCell {\n  border-right-color: var(--cell-borderColor);\n  border-right-style: solid;\n  border-right-width: 1px;\n  /* unfortunately inline-flex doesn't play nice with text-overflow ellipsis */\n  display: inline-block;\n  white-space: nowrap;\n  height: 100%;\n  outline-offset: -2px;\n  overflow: hidden;\n  padding: var(--vuuTableCell-padding, 0 11px 0 8px);\n  text-overflow: ellipsis;\n  vertical-align: top;\n\n\n    &:has(.vuuCheckboxRowSelector) {\n      text-overflow: unset;\n    }\n\n}\n\n.vuuTableCell-right {\n  text-align: right;\n}\n\n.vuuTableCell-editable {\n  align-items: center;\n  display: inline-flex;\n  padding: var(--vuuTableCell-padding-editable, 0px 1px 0 2px);\n}\n\n.vuuTableCell:focus-visible {\n  outline: none;\n}\n\n.vuuTableCell-editable:focus-within,\n.vuuTableCell:focus {\n  /** This is to achieve a white background to outline dashes */\n  /* box-shadow: inset 0 0 0 var(--cell-outline-width) white; */\n  border-bottom: none;\n  .saltInput-bordered {\n    border-color: transparent;\n    outline: solid var(--salt-editable-borderColor-active) 2px;\n    outline-offset: -1px;\n  }\n\n    .saltInput-bordered.vuuEditing{\n      outline: dashed var(--salt-editable-borderColor-active) 2px;\n      outline-offset: -1px;\n    }\n\n    .vuuTableInputCell-error.saltInput-bordered {\n        outline: dashed var(--salt-status-error-borderColor) 2px;\n    }\n\n}\n\n.vuuTableRow-selected .vuuTableCell:not(.vuuTableCell-editable):focus {\n  outline: var(\n    --vuuTableCell-outline,\n    solid var(--salt-focused-outlineColor) 2px\n  );\n\n  &:has(.vuuCheckboxRowSelector) {\n    outline: none;\n  }\n}\n/* .vuuTableCell-editable:focus {\n  outline: none;\n} */\n\n.vuuTableCell.ContextOpen {\n  outline: var(\n    --vuuTableCell-outline,\n    solid var(--vuuTableCell-contextOpen-outlineColor, var(--salt-focused-outlineColor)) 2px\n  );\n}\n";
 
 export { tableCellCss as default };
 //# sourceMappingURL=TableCell.css.js.map

package/esm/table-cell/TableCell.js

@@ -1,18 +1,17 @@
 import { jsx } from 'react/jsx-runtime';
 import { useComponentCssInjection } from '@salt-ds/styles';
 import { useWindow } from '@salt-ds/window';
-import { getTypedValue } from '@vuu-ui/vuu-utils';
-import { useState, useCallback } from 'react';
+import { useCallback } from 'react';
 import { useCell } from '../useCell.js';
 import { useHighlighting } from '../useHighlighting.js';
 import tableCellCss from './TableCell.css.js';
+import { useEditSession } from '@vuu-ui/vuu-utils';
 
 const classBase = "vuuTableCell";
 const TableCell = ({
   column,
   dataRow,
   onClick,
-  onDataEdited,
   searchPattern = ""
 }) => {
   const targetWindow = useWindow();
@@ -21,41 +20,26 @@ const TableCell = ({
     css: tableCellCss,
     window: targetWindow
   });
-  const [hasError, setHasError] = useState(false);
-  const { className, style } = useCell(column, classBase, false, hasError);
-  const { ariaColIndex, CellRenderer, valueFormatter } = column;
+  const editSession = useEditSession();
+  const { className, style } = useCell(column, classBase, false);
+  const { ariaColIndex, CellRenderer, name, valueFormatter } = column;
   const handleDataItemEdited = useCallback(
     (editState, editPhase) => {
+      const { isValid = true, previousValue = "", value: value2 } = editState;
       if (editPhase === "commit") {
-        const { serverDataType = "string" } = column;
-        const typedValue = getTypedValue(
-          String(editState.value),
-          serverDataType,
-          true
-        );
-        return onDataEdited?.(
-          {
-            ...editState,
-            dataRow,
-            columnName: column.name,
-            value: typedValue
-          },
-          editPhase
+        return editSession?.commit(
+          dataRow.key,
+          name,
+          previousValue,
+          value2,
+          isValid
         );
       } else {
-        setHasError(editState.isValid === false);
-        onDataEdited?.(
-          {
-            ...editState,
-            dataRow,
-            columnName: column.name
-          },
-          editPhase
-        );
+        editSession?.edit(dataRow.key, name, previousValue, value2);
         return void 0;
       }
     },
-    [column, dataRow, onDataEdited]
+    [dataRow.key, editSession, name]
   );
   const handleClick = useCallback(
     (evt) => {

package/esm/table-cell/TableCell.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableCell.js","sources":["../../../../packages/vuu-table/src/table-cell/TableCell.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport type {\n  TableCellEditHandler,\n  TableCellProps,\n} from \"@vuu-ui/vuu-table-types\";\nimport { getTypedValue } from \"@vuu-ui/vuu-utils\";\nimport { MouseEventHandler, useCallback, useState } from \"react\";\nimport { useCell } from \"../useCell\";\nimport { useHighlighting } from \"../useHighlighting\";\n\nimport tableCellCss from \"./TableCell.css\";\n\nconst classBase = \"vuuTableCell\";\n\nexport const TableCell = ({\n  column,\n  dataRow,\n  onClick,\n  onDataEdited,\n  searchPattern = \"\",\n}: TableCellProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-table-cell\",\n    css: tableCellCss,\n    window: targetWindow,\n  });\n\n  const [hasError, setHasError] = useState(false);\n\n  const { className, style } = useCell(column, classBase, false, hasError);\n  const { ariaColIndex, CellRenderer, valueFormatter } = column;\n  // const dataIdx = columnMap[column.name];\n\n  const handleDataItemEdited = useCallback<TableCellEditHandler>(\n    (editState, editPhase) => {\n      if (editPhase === \"commit\") {\n        const { serverDataType = \"string\" } = column;\n        const typedValue = getTypedValue(\n          String(editState.value),\n          serverDataType,\n          true,\n        );\n        return onDataEdited?.(\n          {\n            ...editState,\n            dataRow,\n            columnName: column.name,\n            value: typedValue,\n          },\n          editPhase,\n        );\n      } else {\n        setHasError(editState.isValid === false);\n        onDataEdited?.(\n          {\n            ...editState,\n            dataRow,\n            columnName: column.name,\n          },\n          editPhase,\n        );\n        return undefined;\n      }\n    },\n    [column, dataRow, onDataEdited],\n  );\n\n  const handleClick = useCallback<MouseEventHandler>(\n    (evt) => {\n      onClick?.(evt, column);\n    },\n    [column, onClick],\n  );\n\n  const value = valueFormatter(dataRow[column.name]);\n  const valueWithHighlighting = useHighlighting(value, searchPattern);\n\n  return (\n    <div\n      aria-colindex={ariaColIndex}\n      className={className}\n      onClick={onClick ? handleClick : undefined}\n      role=\"cell\"\n      style={style}\n    >\n      {CellRenderer ? (\n        <CellRenderer\n          column={column}\n          dataRow={dataRow}\n          onEdit={handleDataItemEdited}\n          searchPattern={searchPattern}\n        />\n      ) : (\n        valueWithHighlighting\n      )}\n    </div>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;AAaA,MAAM,SAAY,GAAA,cAAA;AAEX,MAAM,YAAY,CAAC;AAAA,EACxB,MAAA;AAAA,EACA,OAAA;AAAA,EACA,OAAA;AAAA,EACA,YAAA;AAAA,EACA,aAAgB,GAAA;AAClB,CAAsB,KAAA;AACpB,EAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,gBAAA;AAAA,IACR,GAAK,EAAA,YAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EAAA,MAAM,CAAC,QAAA,EAAU,WAAW,CAAA,GAAI,SAAS,KAAK,CAAA;AAE9C,EAAM,MAAA,EAAE,WAAW,KAAM,EAAA,GAAI,QAAQ,MAAQ,EAAA,SAAA,EAAW,OAAO,QAAQ,CAAA;AACvE,EAAA,MAAM,EAAE,YAAA,EAAc,YAAc,EAAA,cAAA,EAAmB,GAAA,MAAA;AAGvD,EAAA,MAAM,oBAAuB,GAAA,WAAA;AAAA,IAC3B,CAAC,WAAW,SAAc,KAAA;AACxB,MAAA,IAAI,cAAc,QAAU,EAAA;AAC1B,QAAM,MAAA,EAAE,cAAiB,GAAA,QAAA,EAAa,GAAA,MAAA;AACtC,QAAA,MAAM,UAAa,GAAA,aAAA;AAAA,UACjB,MAAA,CAAO,UAAU,KAAK,CAAA;AAAA,UACtB,cAAA;AAAA,UACA;AAAA,SACF;AACA,QAAO,OAAA,YAAA;AAAA,UACL;AAAA,YACE,GAAG,SAAA;AAAA,YACH,OAAA;AAAA,YACA,YAAY,MAAO,CAAA,IAAA;AAAA,YACnB,KAAO,EAAA;AAAA,WACT;AAAA,UACA;AAAA,SACF;AAAA,OACK,MAAA;AACL,QAAY,WAAA,CAAA,SAAA,CAAU,YAAY,KAAK,CAAA;AACvC,QAAA,YAAA;AAAA,UACE;AAAA,YACE,GAAG,SAAA;AAAA,YACH,OAAA;AAAA,YACA,YAAY,MAAO,CAAA;AAAA,WACrB;AAAA,UACA;AAAA,SACF;AACA,QAAO,OAAA,KAAA,CAAA;AAAA;AACT,KACF;AAAA,IACA,CAAC,MAAQ,EAAA,OAAA,EAAS,YAAY;AAAA,GAChC;AAEA,EAAA,MAAM,WAAc,GAAA,WAAA;AAAA,IAClB,CAAC,GAAQ,KAAA;AACP,MAAA,OAAA,GAAU,KAAK,MAAM,CAAA;AAAA,KACvB;AAAA,IACA,CAAC,QAAQ,OAAO;AAAA,GAClB;AAEA,EAAA,MAAM,KAAQ,GAAA,cAAA,CAAe,OAAQ,CAAA,MAAA,CAAO,IAAI,CAAC,CAAA;AACjD,EAAM,MAAA,qBAAA,GAAwB,eAAgB,CAAA,KAAA,EAAO,aAAa,CAAA;AAElE,EACE,uBAAA,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,eAAe,EAAA,YAAA;AAAA,MACf,SAAA;AAAA,MACA,OAAA,EAAS,UAAU,WAAc,GAAA,KAAA,CAAA;AAAA,MACjC,IAAK,EAAA,MAAA;AAAA,MACL,KAAA;AAAA,MAEC,QACC,EAAA,YAAA,mBAAA,GAAA;AAAA,QAAC,YAAA;AAAA,QAAA;AAAA,UACC,MAAA;AAAA,UACA,OAAA;AAAA,UACA,MAAQ,EAAA,oBAAA;AAAA,UACR;AAAA;AAAA,OAGF,GAAA;AAAA;AAAA,GAEJ;AAEJ;;;;"}
+{"version":3,"file":"TableCell.js","sources":["../../../../packages/vuu-table/src/table-cell/TableCell.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport type {\n  TableCellEditHandler,\n  TableCellProps,\n} from \"@vuu-ui/vuu-table-types\";\nimport { MouseEventHandler, useCallback } from \"react\";\nimport { useCell } from \"../useCell\";\nimport { useHighlighting } from \"../useHighlighting\";\n\nimport tableCellCss from \"./TableCell.css\";\nimport { useEditSession } from \"@vuu-ui/vuu-utils\";\n\nconst classBase = \"vuuTableCell\";\n\nexport const TableCell = ({\n  column,\n  dataRow,\n  onClick,\n  searchPattern = \"\",\n}: TableCellProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-table-cell\",\n    css: tableCellCss,\n    window: targetWindow,\n  });\n\n  const editSession = useEditSession();\n\n  const { className, style } = useCell(column, classBase, false);\n  const { ariaColIndex, CellRenderer, name, valueFormatter } = column;\n\n  const handleDataItemEdited = useCallback<TableCellEditHandler>(\n    (editState, editPhase) => {\n      const { isValid = true, previousValue = \"\", value } = editState;\n      if (editPhase === \"commit\") {\n        return editSession?.commit(\n          dataRow.key,\n          name,\n          previousValue,\n          value,\n          isValid,\n        );\n      } else {\n        editSession?.edit(dataRow.key, name, previousValue, value);\n        return undefined;\n      }\n    },\n    [dataRow.key, editSession, name],\n  );\n\n  const handleClick = useCallback<MouseEventHandler>(\n    (evt) => {\n      onClick?.(evt, column);\n    },\n    [column, onClick],\n  );\n\n  const value = valueFormatter(dataRow[column.name]);\n  const valueWithHighlighting = useHighlighting(value, searchPattern);\n\n  return (\n    <div\n      aria-colindex={ariaColIndex}\n      className={className}\n      onClick={onClick ? handleClick : undefined}\n      role=\"cell\"\n      style={style}\n    >\n      {CellRenderer ? (\n        <CellRenderer\n          column={column}\n          dataRow={dataRow}\n          onEdit={handleDataItemEdited}\n          searchPattern={searchPattern}\n        />\n      ) : (\n        valueWithHighlighting\n      )}\n    </div>\n  );\n};\n"],"names":["value"],"mappings":";;;;;;;;;AAaA,MAAM,SAAY,GAAA,cAAA;AAEX,MAAM,YAAY,CAAC;AAAA,EACxB,MAAA;AAAA,EACA,OAAA;AAAA,EACA,OAAA;AAAA,EACA,aAAgB,GAAA;AAClB,CAAsB,KAAA;AACpB,EAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,gBAAA;AAAA,IACR,GAAK,EAAA,YAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EAAA,MAAM,cAAc,cAAe,EAAA;AAEnC,EAAA,MAAM,EAAE,SAAW,EAAA,KAAA,KAAU,OAAQ,CAAA,MAAA,EAAQ,WAAW,KAAK,CAAA;AAC7D,EAAA,MAAM,EAAE,YAAA,EAAc,YAAc,EAAA,IAAA,EAAM,gBAAmB,GAAA,MAAA;AAE7D,EAAA,MAAM,oBAAuB,GAAA,WAAA;AAAA,IAC3B,CAAC,WAAW,SAAc,KAAA;AACxB,MAAA,MAAM,EAAE,OAAU,GAAA,IAAA,EAAM,gBAAgB,EAAI,EAAA,KAAA,EAAAA,QAAU,GAAA,SAAA;AACtD,MAAA,IAAI,cAAc,QAAU,EAAA;AAC1B,QAAA,OAAO,WAAa,EAAA,MAAA;AAAA,UAClB,OAAQ,CAAA,GAAA;AAAA,UACR,IAAA;AAAA,UACA,aAAA;AAAA,UACAA,MAAAA;AAAA,UACA;AAAA,SACF;AAAA,OACK,MAAA;AACL,QAAA,WAAA,EAAa,IAAK,CAAA,OAAA,CAAQ,GAAK,EAAA,IAAA,EAAM,eAAeA,MAAK,CAAA;AACzD,QAAO,OAAA,KAAA,CAAA;AAAA;AACT,KACF;AAAA,IACA,CAAC,OAAA,CAAQ,GAAK,EAAA,WAAA,EAAa,IAAI;AAAA,GACjC;AAEA,EAAA,MAAM,WAAc,GAAA,WAAA;AAAA,IAClB,CAAC,GAAQ,KAAA;AACP,MAAA,OAAA,GAAU,KAAK,MAAM,CAAA;AAAA,KACvB;AAAA,IACA,CAAC,QAAQ,OAAO;AAAA,GAClB;AAEA,EAAA,MAAM,KAAQ,GAAA,cAAA,CAAe,OAAQ,CAAA,MAAA,CAAO,IAAI,CAAC,CAAA;AACjD,EAAM,MAAA,qBAAA,GAAwB,eAAgB,CAAA,KAAA,EAAO,aAAa,CAAA;AAElE,EACE,uBAAA,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,eAAe,EAAA,YAAA;AAAA,MACf,SAAA;AAAA,MACA,OAAA,EAAS,UAAU,WAAc,GAAA,KAAA,CAAA;AAAA,MACjC,IAAK,EAAA,MAAA;AAAA,MACL,KAAA;AAAA,MAEC,QACC,EAAA,YAAA,mBAAA,GAAA;AAAA,QAAC,YAAA;AAAA,QAAA;AAAA,UACC,MAAA;AAAA,UACA,OAAA;AAAA,UACA,MAAQ,EAAA,oBAAA;AAAA,UACR;AAAA;AAAA,OAGF,GAAA;AAAA;AAAA,GAEJ;AAEJ;;;;"}

package/esm/table-data-source/useDataSource.js.map

@@ -1 +1 @@
-{"version":3,"file":"useDataSource.js","sources":["../../../../packages/vuu-table/src/table-data-source/useDataSource.ts"],"sourcesContent":["import type {\n  DataSourceConfigChangeHandler,\n  DataSourceRow,\n  DataSourceSubscribeCallback,\n  DataSourceSubscribedMessage,\n  DataSourceSuspenseProps,\n  SchemaColumn,\n} from \"@vuu-ui/vuu-data-types\";\nimport { SelectRowRequest, VuuRange } from \"@vuu-ui/vuu-protocol-types\";\nimport { Range } from \"@vuu-ui/vuu-utils\";\nimport { useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport { TableProps } from \"../Table\";\nimport {\n  DataRow,\n  TableRowSelectHandlerInternal,\n} from \"@vuu-ui/vuu-table-types\";\nimport { MovingDataRowWindow } from \"./DataRowMovingWindow\";\nimport { dataRowFactory, DataRowFunc } from \"../data-row/DataRow\";\n\nconst NullDataRow = () => ({}) as DataRow;\n\nexport interface DataSourceHookProps\n  extends Pick<\n    TableProps,\n    | \"autoSelectFirstRow\"\n    | \"autoSelectRowKey\"\n    | \"dataSource\"\n    | \"renderBufferSize\"\n    | \"revealSelected\"\n    | \"selectionModel\"\n  > {\n  suspenseProps?: DataSourceSuspenseProps;\n  onSelect: TableRowSelectHandlerInternal;\n  onSizeChange: (size: number) => void;\n  onSubscribed: (subscription: DataSourceSubscribedMessage) => void;\n}\n\nexport const useDataSource = ({\n  autoSelectFirstRow,\n  autoSelectRowKey,\n  dataSource,\n  onSizeChange,\n  onSubscribed,\n  renderBufferSize = 0,\n  revealSelected,\n  onSelect,\n  selectionModel,\n  suspenseProps,\n}: DataSourceHookProps) => {\n  const [, forceUpdate] = useState<unknown>(null);\n  const dataRows = useRef<DataRow[]>([]);\n  const isMounted = useRef(true);\n  const hasUpdated = useRef(false);\n  const rangeRef = useRef<Range>(dataSource.range);\n  const dataRowRef = useRef<DataRowFunc>(NullDataRow);\n  const setColumnsRef = useRef<undefined | ((columns: string[]) => void)>(\n    undefined,\n  );\n  const totalRowCountRef = useRef(0);\n  const rowAutoSelected = useRef(false);\n\n  const autoSelect =\n    autoSelectRowKey ??\n    (autoSelectFirstRow || selectionModel === \"single-no-deselect\");\n\n  const handleConfigChange = useCallback<DataSourceConfigChangeHandler>(\n    (_config, _range, _confirmed, configChanges) => {\n      if (configChanges?.filterChanged) {\n        rowAutoSelected.current = false;\n      }\n    },\n    [],\n  );\n\n  useEffect(() => {\n    if (autoSelect) {\n      dataSource.on(\"config\", handleConfigChange);\n    }\n    return () => {\n      if (autoSelect) {\n        dataSource.removeListener(\"config\", handleConfigChange);\n      }\n    };\n  }, [autoSelect, dataSource, handleConfigChange]);\n\n  const dataRowWindow = useMemo(\n    () => new MovingDataRowWindow(rangeRef.current.withBuffer),\n    [],\n  );\n\n  const handleResume = useCallback(() => {\n    // When we resume a dataSource (after switching tabs etc)\n    // client will receive rows. We may not have received any\n    // setRange calls at this point so dataWindow range will\n    //not yet be set. If the dataWindow range is already set,\n    // this is a no-op.\n    const { range } = dataSource;\n    if (range.to !== 0) {\n      dataRowWindow.setRange(dataSource.range.withBuffer);\n    }\n  }, [dataRowWindow, dataSource]);\n\n  useEffect(() => {\n    return () => {\n      dataSource.removeListener(\"resumed\", handleResume);\n    };\n  }, [dataSource, handleResume]);\n\n  const setData = useCallback(\n    (updates: DataSourceRow[]) => {\n      const { current: DataRow } = dataRowRef;\n      for (const row of updates) {\n        // for now, we create a new DataRow each time\n        dataRowWindow.add(DataRow(row));\n      }\n      dataRows.current = dataRowWindow.data;\n      if (isMounted.current) {\n        // TODO do we ever need to worry about missing updates here ?\n        forceUpdate({});\n      }\n    },\n    [dataRowWindow],\n  );\n\n  const selectRow = useCallback(\n    (dataRow: DataRow) => {\n      const rowKey = dataRow.key;\n      dataSource.select?.({\n        preserveExistingSelection: false,\n        rowKey,\n        type: \"SELECT_ROW\",\n      } as SelectRowRequest);\n      onSelect?.(dataRow);\n    },\n    [dataSource, onSelect],\n  );\n\n  const createDataRow = useCallback(\n    (columns: string[], schemaColumns: readonly SchemaColumn[]) => {\n      const [DataRow, setColumns] = dataRowFactory(columns, schemaColumns);\n      dataRowRef.current = DataRow;\n      setColumnsRef.current = setColumns;\n    },\n    [],\n  );\n\n  const datasourceMessageHandler: DataSourceSubscribeCallback = useCallback(\n    (message) => {\n      if (message.type === \"subscribed\") {\n        createDataRow(message.columns, message.tableSchema.columns);\n        onSubscribed?.(message);\n      } else if (message.type === \"viewport-update\") {\n        if (typeof message.size === \"number\") {\n          onSizeChange?.(message.size);\n          // const size = dataRowWindow.data.length;\n          dataRowWindow.setRowCount(message.size);\n          totalRowCountRef.current = message.size;\n\n          // if (dataRowWindow.data.length < size) {\n          //   if (isMounted.current === false) {\n          //     console.log(\"setting state whilst unmounted\");\n          //   }\n\n          //   forceUpdate({});\n          // }\n        }\n        if (message.rows) {\n          setData(message.rows);\n          if (autoSelect && rowAutoSelected.current === false) {\n            // OR if no selected row in message.rows, e.g after a filter\n            rowAutoSelected.current = true;\n            if (typeof autoSelect === \"string\") {\n              const dataRow = dataRowWindow.getByKey(autoSelect);\n              if (dataRow) {\n                selectRow(dataRow);\n              } else {\n                console.warn(\n                  `[useDataSource] autoSelect row key ${autoSelect} not in viewport`,\n                );\n              }\n            } else if (dataRowWindow.hasData) {\n              selectRow(dataRowWindow.firstRow);\n            }\n          }\n        } else if (message.size === 0) {\n          setData([]);\n        } else if (typeof message.size === \"number\") {\n          dataRows.current = dataRowWindow.data;\n          hasUpdated.current = true;\n        }\n      } else if (message.type === \"viewport-clear\") {\n        onSizeChange?.(0);\n        dataRowWindow.setRowCount(0);\n        setData([]);\n        forceUpdate({});\n      } else {\n        console.log(`useDataSource unexpected message ${message.type}`);\n      }\n    },\n    [\n      autoSelect,\n      createDataRow,\n      dataRowWindow,\n      onSizeChange,\n      onSubscribed,\n      selectRow,\n      setData,\n    ],\n  );\n\n  const getSelectedRows = useCallback(() => {\n    return dataRowWindow.getSelectedRows();\n  }, [dataRowWindow]);\n\n  useEffect(() => {\n    if (dataSource.status === \"disabled\") {\n      dataSource.enable?.(datasourceMessageHandler);\n    }\n  }, [dataSource, datasourceMessageHandler]);\n\n  useMemo(() => {\n    setColumnsRef.current?.(dataSource.columns);\n  }, [dataSource.columns]);\n\n  const setRange = useCallback(\n    (viewportRange: VuuRange) => {\n      if (!rangeRef.current.equals(viewportRange)) {\n        const range = Range(\n          viewportRange.from,\n          viewportRange.to,\n          renderBufferSize,\n        );\n\n        dataRowWindow.setRange(range.withBuffer);\n\n        if (\n          dataSource.status !== \"subscribed\" &&\n          dataSource.status !== \"subscribing\" &&\n          dataSource.status !== \"enabling\"\n        ) {\n          dataSource?.subscribe(\n            {\n              range,\n              revealSelected,\n              selectedKeyValues: autoSelectRowKey\n                ? [autoSelectRowKey]\n                : undefined,\n            },\n            datasourceMessageHandler,\n          );\n        } else {\n          dataSource.range = rangeRef.current = range;\n        }\n      }\n    },\n    [\n      autoSelectRowKey,\n      dataRowWindow,\n      dataSource,\n      datasourceMessageHandler,\n      renderBufferSize,\n      revealSelected,\n    ],\n  );\n\n  useEffect(() => {\n    if (dataSource.status !== \"initialising\") {\n      const { columns, tableSchema } = dataSource;\n      if (tableSchema) {\n        createDataRow(columns, tableSchema.columns);\n      } else {\n        throw Error(\n          `[useDataSource] a resumed dataSource must have a tableSchema`,\n        );\n      }\n      dataSource.resume?.(datasourceMessageHandler);\n\n      if (dataSource.range.from > 0) {\n        // UI does not currently restore scroll position, so always reset to top of dataset\n        const { from, to } = rangeRef.current.reset;\n        setRange({ from, to });\n      }\n    }\n    return () => {\n      dataSource.suspend?.(\n        suspenseProps?.escalateToDisable,\n        suspenseProps?.escalateDelay,\n      );\n    };\n  }, [\n    createDataRow,\n    dataSource,\n    datasourceMessageHandler,\n    setRange,\n    suspenseProps,\n  ]);\n\n  return {\n    dataRows: dataRows.current,\n    dataRowsRef: dataRows,\n    getSelectedRows,\n    range: rangeRef.current,\n    setRange,\n  };\n};\n"],"names":["DataRow"],"mappings":"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"}
+{"version":3,"file":"useDataSource.js","sources":["../../../../packages/vuu-table/src/table-data-source/useDataSource.ts"],"sourcesContent":["import type {\n  DataSourceConfigChangeHandler,\n  DataSourceRow,\n  DataSourceSubscribeCallback,\n  DataSourceSubscribedMessage,\n  DataSourceSuspenseProps,\n  SchemaColumn,\n} from \"@vuu-ui/vuu-data-types\";\nimport { SelectRowRequest, VuuRange } from \"@vuu-ui/vuu-protocol-types\";\nimport { Range } from \"@vuu-ui/vuu-utils\";\nimport { useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport { TableProps } from \"../Table\";\nimport {\n  DataRow,\n  TableRowSelectHandlerInternal,\n} from \"@vuu-ui/vuu-table-types\";\nimport { MovingDataRowWindow } from \"./DataRowMovingWindow\";\nimport { dataRowFactory, DataRowFunc } from \"../data-row/DataRow\";\n\nconst NullDataRow = () => ({}) as DataRow;\n\nexport interface DataSourceHookProps\n  extends Pick<\n    TableProps,\n    | \"autoSelectFirstRow\"\n    | \"autoSelectRowKey\"\n    | \"dataSource\"\n    | \"renderBufferSize\"\n    | \"revealSelected\"\n    | \"selectionModel\"\n  > {\n  suspenseProps?: DataSourceSuspenseProps;\n  onSelect: TableRowSelectHandlerInternal;\n  onSizeChange: (size: number) => void;\n  onSubscribed: (subscription: DataSourceSubscribedMessage) => void;\n}\n\nexport const useDataSource = ({\n  autoSelectFirstRow,\n  autoSelectRowKey,\n  dataSource,\n  onSizeChange,\n  onSubscribed,\n  renderBufferSize = 0,\n  revealSelected,\n  onSelect,\n  selectionModel,\n  suspenseProps,\n}: DataSourceHookProps) => {\n  const [, forceUpdate] = useState<unknown>(null);\n  const dataRows = useRef<DataRow[]>([]);\n  const isMounted = useRef(true);\n  const hasUpdated = useRef(false);\n  const rangeRef = useRef<Range>(dataSource.range);\n  const dataRowRef = useRef<DataRowFunc>(NullDataRow);\n  const setColumnsRef = useRef<undefined | ((columns: string[]) => void)>(\n    undefined,\n  );\n  const totalRowCountRef = useRef(0);\n  const rowAutoSelected = useRef(false);\n\n  const autoSelect =\n    autoSelectRowKey ??\n    (autoSelectFirstRow || selectionModel === \"single-no-deselect\");\n\n  const handleConfigChange = useCallback<DataSourceConfigChangeHandler>(\n    (_config, _range, _confirmed, configChanges) => {\n      if (configChanges?.filterChanged) {\n        rowAutoSelected.current = false;\n      }\n    },\n    [],\n  );\n\n  useEffect(() => {\n    if (autoSelect) {\n      dataSource.on(\"config\", handleConfigChange);\n    }\n    return () => {\n      if (autoSelect) {\n        dataSource.removeListener(\"config\", handleConfigChange);\n      }\n    };\n  }, [autoSelect, dataSource, handleConfigChange]);\n\n  const dataRowWindow = useMemo(\n    () => new MovingDataRowWindow(rangeRef.current.withBuffer),\n    [],\n  );\n\n  const handleResume = useCallback(() => {\n    // When we resume a dataSource (after switching tabs etc)\n    // client will receive rows. We may not have received any\n    // setRange calls at this point so dataWindow range will\n    //not yet be set. If the dataWindow range is already set,\n    // this is a no-op.\n    const { range } = dataSource;\n    if (range.to !== 0) {\n      dataRowWindow.setRange(dataSource.range.withBuffer);\n    }\n  }, [dataRowWindow, dataSource]);\n\n  useEffect(() => {\n    return () => {\n      dataSource.removeListener(\"resumed\", handleResume);\n    };\n  }, [dataSource, handleResume]);\n\n  const setData = useCallback(\n    (updates: DataSourceRow[]) => {\n      const { current: DataRow } = dataRowRef;\n      for (const row of updates) {\n        // for now, we create a new DataRow each time\n        dataRowWindow.add(DataRow(row));\n      }\n      dataRows.current = dataRowWindow.data;\n      if (isMounted.current) {\n        // TODO do we ever need to worry about missing updates here ?\n        forceUpdate({});\n      }\n    },\n    [dataRowWindow],\n  );\n\n  const selectRow = useCallback(\n    (dataRow: DataRow) => {\n      const rowKey = dataRow.key;\n      dataSource.select?.({\n        preserveExistingSelection: false,\n        rowKey,\n        type: \"SELECT_ROW\",\n      } as SelectRowRequest);\n      onSelect?.(dataRow);\n    },\n    [dataSource, onSelect],\n  );\n\n  const createDataRow = useCallback(\n    (columns: string[], schemaColumns: readonly SchemaColumn[]) => {\n      const [DataRow, setColumns] = dataRowFactory(columns, schemaColumns);\n      dataRowRef.current = DataRow;\n      setColumnsRef.current = setColumns;\n    },\n    [],\n  );\n\n  const datasourceMessageHandler: DataSourceSubscribeCallback = useCallback(\n    (message) => {\n      if (message.type === \"subscribed\") {\n        createDataRow(message.columns, message.tableSchema.columns);\n        onSubscribed?.(message);\n      } else if (message.type === \"viewport-update\") {\n        if (typeof message.size === \"number\") {\n          onSizeChange?.(message.size);\n          // const size = dataRowWindow.data.length;\n          dataRowWindow.setRowCount(message.size);\n          totalRowCountRef.current = message.size;\n        }\n        if (message.rows) {\n          setData(message.rows);\n          if (autoSelect && rowAutoSelected.current === false) {\n            // OR if no selected row in message.rows, e.g after a filter\n            rowAutoSelected.current = true;\n            if (typeof autoSelect === \"string\") {\n              const dataRow = dataRowWindow.getByKey(autoSelect);\n              if (dataRow) {\n                selectRow(dataRow);\n              } else {\n                console.warn(\n                  `[useDataSource] autoSelect row key ${autoSelect} not in viewport`,\n                );\n              }\n            } else if (dataRowWindow.hasData) {\n              selectRow(dataRowWindow.firstRow);\n            }\n          }\n        } else if (message.size === 0) {\n          setData([]);\n        } else if (typeof message.size === \"number\") {\n          dataRows.current = dataRowWindow.data;\n          hasUpdated.current = true;\n        }\n      } else if (message.type === \"viewport-clear\") {\n        onSizeChange?.(0);\n        dataRowWindow.setRowCount(0);\n        setData([]);\n        forceUpdate({});\n      } else {\n        console.log(`useDataSource unexpected message ${message.type}`);\n      }\n    },\n    [\n      autoSelect,\n      createDataRow,\n      dataRowWindow,\n      onSizeChange,\n      onSubscribed,\n      selectRow,\n      setData,\n    ],\n  );\n\n  const getSelectedRows = useCallback(() => {\n    return dataRowWindow.getSelectedRows();\n  }, [dataRowWindow]);\n\n  useEffect(() => {\n    if (dataSource.status === \"disabled\") {\n      dataSource.enable?.(datasourceMessageHandler);\n    }\n  }, [dataSource, datasourceMessageHandler]);\n\n  useMemo(() => {\n    setColumnsRef.current?.(dataSource.columns);\n  }, [dataSource.columns]);\n\n  const setRange = useCallback(\n    (viewportRange: VuuRange) => {\n      if (!rangeRef.current.equals(viewportRange)) {\n        const range = Range(\n          viewportRange.from,\n          viewportRange.to,\n          renderBufferSize,\n        );\n\n        dataRowWindow.setRange(range.withBuffer);\n\n        if (\n          dataSource.status !== \"subscribed\" &&\n          dataSource.status !== \"subscribing\" &&\n          dataSource.status !== \"enabling\"\n        ) {\n          dataSource?.subscribe(\n            {\n              range,\n              revealSelected,\n              selectedKeyValues: autoSelectRowKey\n                ? [autoSelectRowKey]\n                : undefined,\n            },\n            datasourceMessageHandler,\n          );\n        } else {\n          dataSource.range = rangeRef.current = range;\n        }\n      }\n    },\n    [\n      autoSelectRowKey,\n      dataRowWindow,\n      dataSource,\n      datasourceMessageHandler,\n      renderBufferSize,\n      revealSelected,\n    ],\n  );\n\n  useEffect(() => {\n    if (dataSource.status !== \"initialising\") {\n      const { columns, tableSchema } = dataSource;\n      if (tableSchema) {\n        createDataRow(columns, tableSchema.columns);\n      } else {\n        throw Error(\n          `[useDataSource] a resumed dataSource must have a tableSchema`,\n        );\n      }\n      dataSource.resume?.(datasourceMessageHandler);\n\n      if (dataSource.range.from > 0) {\n        // UI does not currently restore scroll position, so always reset to top of dataset\n        const { from, to } = rangeRef.current.reset;\n        setRange({ from, to });\n      }\n    }\n    return () => {\n      dataSource.suspend?.(\n        suspenseProps?.escalateToDisable,\n        suspenseProps?.escalateDelay,\n      );\n    };\n  }, [\n    createDataRow,\n    dataSource,\n    datasourceMessageHandler,\n    setRange,\n    suspenseProps,\n  ]);\n\n  return {\n    dataRows: dataRows.current,\n    dataRowsRef: dataRows,\n    getSelectedRows,\n    range: rangeRef.current,\n    setRange,\n  };\n};\n"],"names":["DataRow"],"mappings":"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"}

package/esm/table-dom-utils.js

@@ -20,9 +20,12 @@ const getLevelUp = (containerRef, cellPos) => {
   }
   return cellPos;
 };
-const getTableCell = (containerRef, [rowIdx, colIdx]) => {
+const getTableCellElement = (containerRef, [rowIdx, colIdx]) => {
   const cssQuery = dataCellQuery(rowIdx, colIdx);
-  const cell = containerRef.current?.querySelector(cssQuery);
+  return containerRef.current?.querySelector(cssQuery);
+};
+const getTableCell = (containerRef, cellPos) => {
+  const cell = getTableCellElement(containerRef, cellPos);
   if (cellIsEditable(cell)) {
     const focusableContent = cell.querySelector(
       `button,input[type="checkbox"]`
@@ -115,6 +118,25 @@ function getNextCellPos(key, [rowIdx, colIdx], columnCount, maxRowIndex) {
   }
   return [rowIdx, colIdx];
 }
+const getNextEditableCellPos = (containerRef, key, cellPos, columnCount, maxRowIndex) => {
+  let [lastRowIdx, lastColIdx] = cellPos;
+  do {
+    const [nextRowIdx, nextColIdx] = getNextCellPos(
+      key,
+      [lastRowIdx, lastColIdx],
+      columnCount,
+      maxRowIndex
+    );
+    if (nextRowIdx === lastRowIdx && nextColIdx === lastColIdx) {
+      return cellPos;
+    }
+    const cell = getTableCellElement(containerRef, [nextRowIdx, nextColIdx]);
+    if (cellIsEditable(cell)) {
+      return [nextRowIdx, nextColIdx];
+    }
+    [lastRowIdx, lastColIdx] = [nextRowIdx, nextColIdx];
+  } while (true);
+};
 const getTreeNodeOperation = (containerRef, navigationStyle, cellPos, key, shiftKey) => {
   const cell = getTableCell(containerRef, cellPos);
   if (navigationStyle === "cell" && !cellIsGroupCell(cell)) {
@@ -162,5 +184,5 @@ const howFarIsRowOutsideViewport = (rowEl, totalHeaderHeight, contentContainer =
   }
 };
 
-export { cellDropdownShowing, cellIsEditable, cellIsTextInput, closestRowIndex, dataCellQuery, getAriaCellPos, getFocusedCell, getHeaderCell, getLevelUp, getNextCellPos, getRowElementByAriaIndex, getTableCell, getTreeNodeOperation, headerCellQuery, howFarIsRowOutsideViewport };
+export { cellDropdownShowing, cellIsEditable, cellIsTextInput, closestRowIndex, dataCellQuery, getAriaCellPos, getFocusedCell, getHeaderCell, getLevelUp, getNextCellPos, getNextEditableCellPos, getRowElementByAriaIndex, getTableCell, getTableCellElement, getTreeNodeOperation, headerCellQuery, howFarIsRowOutsideViewport };
 //# sourceMappingURL=table-dom-utils.js.map

package/esm/table-dom-utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"table-dom-utils.js","sources":["../../../packages/vuu-table/src/table-dom-utils.ts"],"sourcesContent":["import { RefObject } from \"react\";\nimport { ScrollDirection } from \"./useTableScroll\";\nimport {\n  getAriaColIndex,\n  getAriaRowIndex,\n  type ArrowKey,\n  type PageKey,\n} from \"@vuu-ui/vuu-utils\";\nimport type { CellPos } from \"@vuu-ui/vuu-table-types\";\n\nexport type NavigationKey = PageKey | ArrowKey;\n\nexport const headerCellQuery = (colIdx: number) =>\n  `.vuuTable-col-headers .vuuTableHeaderCell[aria-colindex='${colIdx}']`;\n\nexport const dataCellQuery = (ariaRowIdx: number, ariaColIdx: number) =>\n  `.vuuTable-table [aria-rowindex='${ariaRowIdx}'] > [aria-colindex='${ariaColIdx}']`;\n\nexport const getLevelUp = (\n  containerRef: RefObject<HTMLElement | null>,\n  cellPos: CellPos,\n): CellPos => {\n  const cell = getTableCell(containerRef, cellPos);\n  let row = cell?.parentElement;\n  const level = parseInt(row?.ariaLevel ?? \"1\");\n  if (level > 1) {\n    const targetLevel = `${level - 1}`;\n    while (row !== null && row.ariaLevel !== targetLevel) {\n      row = row.previousElementSibling as HTMLElement;\n    }\n    if (row) {\n      const nextRowIndex = parseInt(row.ariaRowIndex ?? \"- 1\");\n      if (nextRowIndex !== -1) {\n        return [nextRowIndex, 1];\n      }\n    }\n  }\n  return cellPos;\n};\nexport const getTableCell = (\n  containerRef: RefObject<HTMLElement | null>,\n  [rowIdx, colIdx]: CellPos,\n) => {\n  const cssQuery = dataCellQuery(rowIdx, colIdx);\n  const cell = containerRef.current?.querySelector(cssQuery) as HTMLDivElement;\n\n  if (cellIsEditable(cell)) {\n    // Dropdown gets focus, Input does not\n    const focusableContent = cell.querySelector(\n      `button,input[type=\"checkbox\"]`,\n    ) as HTMLElement;\n    return focusableContent || cell;\n  } else {\n    return cell;\n  }\n};\n\nexport const getHeaderCell = (\n  containerRef: RefObject<HTMLElement | null>,\n  columnName: string,\n) =>\n  containerRef.current?.querySelector(\n    `.vuuTableHeaderCell[data-column-name=\"${columnName}\"]`,\n  ) as HTMLDivElement | null;\n\nexport const getFocusedCell = (el: HTMLElement | Element | null) => {\n  if (el?.role == \"cell\" || el?.role === \"columnheader\") {\n    return el as HTMLDivElement;\n  } else {\n    return el?.closest(\n      \"[role='columnHeader'],[role='cell']\",\n    ) as HTMLDivElement | null;\n  }\n};\n\nexport const cellIsEditable = (cell: HTMLDivElement | null) =>\n  cell?.classList.contains(\"vuuTableCell-editable\");\n\nexport const cellDropdownShowing = (cell: HTMLDivElement | null) => {\n  if (cellIsEditable(cell)) {\n    return cell?.querySelector('.saltDropdown[aria-expanded=\"true\"]') !== null;\n  }\n  return false;\n};\n\nconst cellIsGroupCell = (cell: HTMLElement | null) =>\n  cell?.classList.contains(\"vuuTableGroupCell\");\n\nconst rowIsExpanded = (cell: HTMLElement) => {\n  switch (cell.parentElement?.ariaExpanded) {\n    case \"true\":\n      return true;\n    case \"false\":\n      return false;\n    default:\n      return undefined;\n  }\n};\n\nexport const cellIsTextInput = (cell: HTMLElement) =>\n  cell.querySelector(\".vuuTableInputCell\") !== null;\n\nexport const getRowElementByAriaIndex = (\n  container: HTMLDivElement | EventTarget,\n  rowIndex: number,\n) => {\n  if (rowIndex === -1) {\n    return null;\n  } else {\n    const activeRow = (container as HTMLElement).querySelector(\n      `[aria-rowindex=\"${rowIndex}\"]`,\n    ) as HTMLElement;\n\n    if (activeRow) {\n      return activeRow;\n    } else {\n      throw Error(\n        `getRowElementAtIndex no row found for index index ${rowIndex}`,\n      );\n    }\n  }\n};\n\nexport const getIndexFromCellElement = (cellElement: HTMLElement | null) =>\n  getAriaColIndex(cellElement);\n\nexport const getAriaCellPos = (tableCell: HTMLDivElement): CellPos => {\n  const focusedRow = tableCell.closest(\"[role='row']\") as HTMLElement;\n  return [getAriaRowIndex(focusedRow), getAriaColIndex(tableCell)];\n};\n\nconst closestRow = (el: HTMLElement) =>\n  el.closest('[role=\"row\"]') as HTMLElement;\n\nexport const closestRowIndex = (el: HTMLElement) =>\n  getAriaRowIndex(closestRow(el));\n\nexport function getNextCellPos(\n  key: ArrowKey,\n  [rowIdx, colIdx]: CellPos,\n  columnCount: number,\n  maxRowIndex: number,\n): CellPos {\n  if (key === \"ArrowUp\") {\n    if (rowIdx > -1) {\n      return [rowIdx - 1, colIdx];\n    } else {\n      return [rowIdx, colIdx];\n    }\n  } else if (key === \"ArrowDown\") {\n    if (rowIdx === -1) {\n      return [1, colIdx];\n    } else if (rowIdx === maxRowIndex) {\n      return [rowIdx, colIdx];\n    } else {\n      return [rowIdx + 1, colIdx];\n    }\n  } else if (key === \"ArrowRight\") {\n    if (colIdx < columnCount) {\n      return [rowIdx, colIdx + 1];\n    } else {\n      return [rowIdx, colIdx];\n    }\n  } else if (key === \"ArrowLeft\") {\n    if (colIdx > 1) {\n      return [rowIdx, colIdx - 1];\n    } else {\n      return [rowIdx, colIdx];\n    }\n  }\n  return [rowIdx, colIdx];\n}\n\nexport type TreeNodeOperation = \"expand\" | \"collapse\" | \"level-up\";\n\nexport const getTreeNodeOperation = (\n  containerRef: RefObject<HTMLElement | null>,\n  navigationStyle: \"cell\" | \"tree\",\n  cellPos: CellPos,\n  key: NavigationKey,\n  shiftKey: boolean,\n): TreeNodeOperation | undefined => {\n  const cell = getTableCell(containerRef, cellPos);\n  if (navigationStyle === \"cell\" && !cellIsGroupCell(cell)) {\n    return undefined;\n  }\n  if (navigationStyle == \"cell\" && !shiftKey) {\n    return undefined;\n  }\n  if (cellIsGroupCell(cell)) {\n    const isExpanded = rowIsExpanded(cell);\n    if (isExpanded === true) {\n      if (key === \"ArrowLeft\") {\n        return \"collapse\";\n      }\n    } else if (isExpanded === false) {\n      if (key === \"ArrowRight\") {\n        return \"expand\";\n      } else if (key === \"ArrowLeft\") {\n        return \"level-up\";\n      }\n    } else if (key === \"ArrowLeft\") {\n      return \"level-up\";\n    }\n  }\n};\n\nconst NO_SCROLL_NECESSARY = [undefined, undefined] as const;\n\nexport const howFarIsRowOutsideViewport = (\n  rowEl: HTMLElement,\n  totalHeaderHeight: number,\n  contentContainer = rowEl.closest(\".vuuTable-contentContainer\"),\n): readonly [ScrollDirection | undefined, number | undefined] => {\n  //TODO lots of scope for optimisation here\n  if (contentContainer) {\n    // TODO take totalHeaderHeight into consideration\n    const viewport = contentContainer?.getBoundingClientRect();\n    const upperBoundary = viewport.top + totalHeaderHeight;\n    const row = rowEl.getBoundingClientRect();\n    if (row) {\n      if (row.bottom > viewport.bottom) {\n        return [\"down\", row.bottom - viewport.bottom];\n      } else if (row.top < upperBoundary) {\n        return [\"up\", row.top - upperBoundary];\n      } else {\n        return NO_SCROLL_NECESSARY;\n      }\n    } else {\n      throw Error(\"Whats going on, row not found\");\n    }\n  } else {\n    throw Error(\"Whats going on, scrollbar container not found\");\n  }\n};\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"table-dom-utils.js","sources":["../../../packages/vuu-table/src/table-dom-utils.ts"],"sourcesContent":["import { RefObject } from \"react\";\nimport { ScrollDirection } from \"./useTableScroll\";\nimport {\n  getAriaColIndex,\n  getAriaRowIndex,\n  type ArrowKey,\n  type PageKey,\n} from \"@vuu-ui/vuu-utils\";\nimport type { CellPos } from \"@vuu-ui/vuu-table-types\";\n\nexport type NavigationKey = PageKey | ArrowKey;\n\nexport const headerCellQuery = (colIdx: number) =>\n  `.vuuTable-col-headers .vuuTableHeaderCell[aria-colindex='${colIdx}']`;\n\nexport const dataCellQuery = (ariaRowIdx: number, ariaColIdx: number) =>\n  `.vuuTable-table [aria-rowindex='${ariaRowIdx}'] > [aria-colindex='${ariaColIdx}']`;\n\nexport const getLevelUp = (\n  containerRef: RefObject<HTMLElement | null>,\n  cellPos: CellPos,\n): CellPos => {\n  const cell = getTableCell(containerRef, cellPos);\n  let row = cell?.parentElement;\n  const level = parseInt(row?.ariaLevel ?? \"1\");\n  if (level > 1) {\n    const targetLevel = `${level - 1}`;\n    while (row !== null && row.ariaLevel !== targetLevel) {\n      row = row.previousElementSibling as HTMLElement;\n    }\n    if (row) {\n      const nextRowIndex = parseInt(row.ariaRowIndex ?? \"- 1\");\n      if (nextRowIndex !== -1) {\n        return [nextRowIndex, 1];\n      }\n    }\n  }\n  return cellPos;\n};\n\nexport const getTableCellElement = (\n  containerRef: RefObject<HTMLElement | null>,\n  [rowIdx, colIdx]: CellPos,\n) => {\n  const cssQuery = dataCellQuery(rowIdx, colIdx);\n  return containerRef.current?.querySelector(cssQuery) as HTMLDivElement;\n};\n\nexport const getTableCell = (\n  containerRef: RefObject<HTMLElement | null>,\n  cellPos: CellPos,\n) => {\n  const cell = getTableCellElement(containerRef, cellPos);\n\n  if (cellIsEditable(cell)) {\n    // Dropdown gets focus, Input does not\n    const focusableContent = cell.querySelector(\n      `button,input[type=\"checkbox\"]`,\n    ) as HTMLElement;\n    return focusableContent || cell;\n  } else {\n    return cell;\n  }\n};\n\nexport const getHeaderCell = (\n  containerRef: RefObject<HTMLElement | null>,\n  columnName: string,\n) =>\n  containerRef.current?.querySelector(\n    `.vuuTableHeaderCell[data-column-name=\"${columnName}\"]`,\n  ) as HTMLDivElement | null;\n\nexport const getFocusedCell = (el: HTMLElement | Element | null) => {\n  if (el?.role == \"cell\" || el?.role === \"columnheader\") {\n    return el as HTMLDivElement;\n  } else {\n    return el?.closest(\n      \"[role='columnHeader'],[role='cell']\",\n    ) as HTMLDivElement | null;\n  }\n};\n\nexport const cellIsEditable = (cell: HTMLDivElement | null) =>\n  cell?.classList.contains(\"vuuTableCell-editable\");\n\nexport const cellDropdownShowing = (cell: HTMLDivElement | null) => {\n  if (cellIsEditable(cell)) {\n    return cell?.querySelector('.saltDropdown[aria-expanded=\"true\"]') !== null;\n  }\n  return false;\n};\n\nconst cellIsGroupCell = (cell: HTMLElement | null) =>\n  cell?.classList.contains(\"vuuTableGroupCell\");\n\nconst rowIsExpanded = (cell: HTMLElement) => {\n  switch (cell.parentElement?.ariaExpanded) {\n    case \"true\":\n      return true;\n    case \"false\":\n      return false;\n    default:\n      return undefined;\n  }\n};\n\nexport const cellIsTextInput = (cell: HTMLElement) =>\n  cell.querySelector(\".vuuTableInputCell\") !== null;\n\nexport const getRowElementByAriaIndex = (\n  container: HTMLDivElement | EventTarget,\n  rowIndex: number,\n) => {\n  if (rowIndex === -1) {\n    return null;\n  } else {\n    const activeRow = (container as HTMLElement).querySelector(\n      `[aria-rowindex=\"${rowIndex}\"]`,\n    ) as HTMLElement;\n\n    if (activeRow) {\n      return activeRow;\n    } else {\n      throw Error(\n        `getRowElementAtIndex no row found for index index ${rowIndex}`,\n      );\n    }\n  }\n};\n\nexport const getIndexFromCellElement = (cellElement: HTMLElement | null) =>\n  getAriaColIndex(cellElement);\n\nexport const getAriaCellPos = (tableCell: HTMLDivElement): CellPos => {\n  const focusedRow = tableCell.closest(\"[role='row']\") as HTMLElement;\n  return [getAriaRowIndex(focusedRow), getAriaColIndex(tableCell)];\n};\n\nconst closestRow = (el: HTMLElement) =>\n  el.closest('[role=\"row\"]') as HTMLElement;\n\nexport const closestRowIndex = (el: HTMLElement) =>\n  getAriaRowIndex(closestRow(el));\n\nexport function getNextCellPos(\n  key: ArrowKey,\n  [rowIdx, colIdx]: CellPos,\n  columnCount: number,\n  maxRowIndex: number,\n): CellPos {\n  if (key === \"ArrowUp\") {\n    if (rowIdx > -1) {\n      return [rowIdx - 1, colIdx];\n    } else {\n      return [rowIdx, colIdx];\n    }\n  } else if (key === \"ArrowDown\") {\n    if (rowIdx === -1) {\n      return [1, colIdx];\n    } else if (rowIdx === maxRowIndex) {\n      return [rowIdx, colIdx];\n    } else {\n      return [rowIdx + 1, colIdx];\n    }\n  } else if (key === \"ArrowRight\") {\n    if (colIdx < columnCount) {\n      return [rowIdx, colIdx + 1];\n    } else {\n      return [rowIdx, colIdx];\n    }\n  } else if (key === \"ArrowLeft\") {\n    if (colIdx > 1) {\n      return [rowIdx, colIdx - 1];\n    } else {\n      return [rowIdx, colIdx];\n    }\n  }\n  return [rowIdx, colIdx];\n}\n\nexport const getNextEditableCellPos = (\n  containerRef: RefObject<HTMLElement | null>,\n  key: ArrowKey,\n  cellPos: CellPos,\n  columnCount: number,\n  maxRowIndex: number,\n) => {\n  let [lastRowIdx, lastColIdx] = cellPos;\n  do {\n    const [nextRowIdx, nextColIdx] = getNextCellPos(\n      key,\n      [lastRowIdx, lastColIdx],\n      columnCount,\n      maxRowIndex,\n    );\n    if (nextRowIdx === lastRowIdx && nextColIdx === lastColIdx) {\n      // we have not moved, we never found a new editable cell, bail\n      return cellPos;\n    }\n\n    const cell = getTableCellElement(containerRef, [nextRowIdx, nextColIdx]);\n    if (cellIsEditable(cell)) {\n      return [nextRowIdx, nextColIdx];\n    }\n    // keep going\n    [lastRowIdx, lastColIdx] = [nextRowIdx, nextColIdx];\n    // eslint-disable-next-line no-constant-condition\n  } while (true);\n};\n\nexport type TreeNodeOperation = \"expand\" | \"collapse\" | \"level-up\";\n\nexport const getTreeNodeOperation = (\n  containerRef: RefObject<HTMLElement | null>,\n  navigationStyle: \"cell\" | \"tree\",\n  cellPos: CellPos,\n  key: NavigationKey,\n  shiftKey: boolean,\n): TreeNodeOperation | undefined => {\n  const cell = getTableCell(containerRef, cellPos);\n  if (navigationStyle === \"cell\" && !cellIsGroupCell(cell)) {\n    return undefined;\n  }\n  if (navigationStyle == \"cell\" && !shiftKey) {\n    return undefined;\n  }\n  if (cellIsGroupCell(cell)) {\n    const isExpanded = rowIsExpanded(cell);\n    if (isExpanded === true) {\n      if (key === \"ArrowLeft\") {\n        return \"collapse\";\n      }\n    } else if (isExpanded === false) {\n      if (key === \"ArrowRight\") {\n        return \"expand\";\n      } else if (key === \"ArrowLeft\") {\n        return \"level-up\";\n      }\n    } else if (key === \"ArrowLeft\") {\n      return \"level-up\";\n    }\n  }\n};\n\nconst NO_SCROLL_NECESSARY = [undefined, undefined] as const;\n\nexport const howFarIsRowOutsideViewport = (\n  rowEl: HTMLElement,\n  totalHeaderHeight: number,\n  contentContainer = rowEl.closest(\".vuuTable-contentContainer\"),\n): readonly [ScrollDirection | undefined, number | undefined] => {\n  //TODO lots of scope for optimisation here\n  if (contentContainer) {\n    // TODO take totalHeaderHeight into consideration\n    const viewport = contentContainer?.getBoundingClientRect();\n    const upperBoundary = viewport.top + totalHeaderHeight;\n    const row = rowEl.getBoundingClientRect();\n    if (row) {\n      if (row.bottom > viewport.bottom) {\n        return [\"down\", row.bottom - viewport.bottom];\n      } else if (row.top < upperBoundary) {\n        return [\"up\", row.top - upperBoundary];\n      } else {\n        return NO_SCROLL_NECESSARY;\n      }\n    } else {\n      throw Error(\"Whats going on, row not found\");\n    }\n  } else {\n    throw Error(\"Whats going on, scrollbar container not found\");\n  }\n};\n"],"names":[],"mappings":"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"}

package/esm/useCell.js

@@ -2,7 +2,7 @@ import { getColumnStyle } from '@vuu-ui/vuu-utils';
 import cx from 'clsx';
 import { useMemo } from 'react';
 
-const useCell = (column, classBase, isHeader, hasError) => (
+const useCell = (column, classBase, isHeader) => (
   // TODO measure perf without the memo, might not be worth the cost
   useMemo(() => {
     const className = cx(classBase, column.className, {
@@ -10,15 +10,14 @@ const useCell = (column, classBase, isHeader, hasError) => (
       vuuPinRight: column.pin === "right",
       vuuEndPin: isHeader && column.pinnedWidth,
       [`${classBase}-editable`]: column.editable,
-      [`${classBase}-right`]: column.align === "right",
-      [`${classBase}-error`]: hasError
+      [`${classBase}-right`]: column.align === "right"
     });
     const style = getColumnStyle(column);
     return {
       className,
       style
     };
-  }, [classBase, column, isHeader, hasError])
+  }, [classBase, column, isHeader])
 );
 
 export { useCell };

package/esm/useCell.js.map

@@ -1 +1 @@
-{"version":3,"file":"useCell.js","sources":["../../../packages/vuu-table/src/useCell.ts"],"sourcesContent":["import { RuntimeColumnDescriptor } from \"@vuu-ui/vuu-table-types\";\nimport { getColumnStyle } from \"@vuu-ui/vuu-utils\";\nimport cx from \"clsx\";\nimport { useMemo } from \"react\";\n\nexport const useCell = (\n  column: RuntimeColumnDescriptor,\n  classBase: string,\n  isHeader?: boolean,\n  hasError?: boolean,\n) =>\n  // TODO measure perf without the memo, might not be worth the cost\n  useMemo(() => {\n    const className = cx(classBase, column.className, {\n      vuuPinLeft: column.pin === \"left\",\n      vuuPinRight: column.pin === \"right\",\n      vuuEndPin: isHeader && column.pinnedWidth,\n      [`${classBase}-editable`]: column.editable,\n      [`${classBase}-right`]: column.align === \"right\",\n      [`${classBase}-error`]: hasError,\n    });\n\n    const style = getColumnStyle(column);\n    return {\n      className,\n      style,\n    };\n  }, [classBase, column, isHeader, hasError]);\n"],"names":[],"mappings":";;;;AAKO,MAAM,OAAU,GAAA,CACrB,MACA,EAAA,SAAA,EACA,QACA,EAAA,QAAA;AAAA;AAAA,EAGA,QAAQ,MAAM;AACZ,IAAA,MAAM,SAAY,GAAA,EAAA,CAAG,SAAW,EAAA,MAAA,CAAO,SAAW,EAAA;AAAA,MAChD,UAAA,EAAY,OAAO,GAAQ,KAAA,MAAA;AAAA,MAC3B,WAAA,EAAa,OAAO,GAAQ,KAAA,OAAA;AAAA,MAC5B,SAAA,EAAW,YAAY,MAAO,CAAA,WAAA;AAAA,MAC9B,CAAC,CAAA,EAAG,SAAS,CAAA,SAAA,CAAW,GAAG,MAAO,CAAA,QAAA;AAAA,MAClC,CAAC,CAAG,EAAA,SAAS,CAAQ,MAAA,CAAA,GAAG,OAAO,KAAU,KAAA,OAAA;AAAA,MACzC,CAAC,CAAA,EAAG,SAAS,CAAA,MAAA,CAAQ,GAAG;AAAA,KACzB,CAAA;AAED,IAAM,MAAA,KAAA,GAAQ,eAAe,MAAM,CAAA;AACnC,IAAO,OAAA;AAAA,MACL,SAAA;AAAA,MACA;AAAA,KACF;AAAA,KACC,CAAC,SAAA,EAAW,MAAQ,EAAA,QAAA,EAAU,QAAQ,CAAC;AAAA;;;;"}
+{"version":3,"file":"useCell.js","sources":["../../../packages/vuu-table/src/useCell.ts"],"sourcesContent":["import { RuntimeColumnDescriptor } from \"@vuu-ui/vuu-table-types\";\nimport { getColumnStyle } from \"@vuu-ui/vuu-utils\";\nimport cx from \"clsx\";\nimport { useMemo } from \"react\";\n\nexport const useCell = (\n  column: RuntimeColumnDescriptor,\n  classBase: string,\n  isHeader?: boolean,\n) =>\n  // TODO measure perf without the memo, might not be worth the cost\n  useMemo(() => {\n    const className = cx(classBase, column.className, {\n      vuuPinLeft: column.pin === \"left\",\n      vuuPinRight: column.pin === \"right\",\n      vuuEndPin: isHeader && column.pinnedWidth,\n      [`${classBase}-editable`]: column.editable,\n      [`${classBase}-right`]: column.align === \"right\",\n    });\n\n    const style = getColumnStyle(column);\n    return {\n      className,\n      style,\n    };\n  }, [classBase, column, isHeader]);\n"],"names":[],"mappings":";;;;AAKa,MAAA,OAAA,GAAU,CACrB,MAAA,EACA,SACA,EAAA,QAAA;AAAA;AAAA,EAGA,QAAQ,MAAM;AACZ,IAAA,MAAM,SAAY,GAAA,EAAA,CAAG,SAAW,EAAA,MAAA,CAAO,SAAW,EAAA;AAAA,MAChD,UAAA,EAAY,OAAO,GAAQ,KAAA,MAAA;AAAA,MAC3B,WAAA,EAAa,OAAO,GAAQ,KAAA,OAAA;AAAA,MAC5B,SAAA,EAAW,YAAY,MAAO,CAAA,WAAA;AAAA,MAC9B,CAAC,CAAA,EAAG,SAAS,CAAA,SAAA,CAAW,GAAG,MAAO,CAAA,QAAA;AAAA,MAClC,CAAC,CAAG,EAAA,SAAS,CAAQ,MAAA,CAAA,GAAG,OAAO,KAAU,KAAA;AAAA,KAC1C,CAAA;AAED,IAAM,MAAA,KAAA,GAAQ,eAAe,MAAM,CAAA;AACnC,IAAO,OAAA;AAAA,MACL,SAAA;AAAA,MACA;AAAA,KACF;AAAA,GACC,EAAA,CAAC,SAAW,EAAA,MAAA,EAAQ,QAAQ,CAAC;AAAA;;;;"}

package/esm/useCellEditing.js

@@ -1,38 +1,17 @@
-import { queryClosest, dispatchCustomEvent, isCharacterKey } from '@vuu-ui/vuu-utils';
+import { isCharacterKey } from '@vuu-ui/vuu-utils';
 import { useCallback } from 'react';
-import { getAriaCellPos, cellIsTextInput } from './table-dom-utils.js';
+import { cellIsTextInput } from './table-dom-utils.js';
 
-const useCellEditing = ({
-  focusCell,
-  navigate
-}) => {
+const useCellEditing = ({ navigate }) => {
   const commitHandler = useCallback(() => {
     navigate();
   }, [navigate]);
-  const editModeHandler = useCallback(
-    (e) => {
-      const tableCell = queryClosest(
-        e.target,
-        ".vuuTableCell",
-        true
-      );
-      if (e.type === "vuu-exit-edit-mode") {
-        tableCell.classList.remove("vuuEditing");
-        const cellPos = getAriaCellPos(tableCell);
-        focusCell(cellPos, true);
-      } else {
-        tableCell.classList.add("vuuEditing");
-      }
-    },
-    [focusCell]
-  );
   const editInput = useCallback(
     (evt) => {
       const cellEl = evt.target;
       const input = cellEl.matches("input") ? cellEl : cellEl.querySelector("input");
       if (input) {
         input.focus();
-        input.select();
       }
     },
     []
@@ -43,8 +22,6 @@ const useCellEditing = ({
       const input = cellEl.querySelector("input");
       if (input) {
         input.focus();
-        input.select();
-        dispatchCustomEvent(input, "vuu-begin-edit");
       }
     },
     []
@@ -76,19 +53,15 @@ const useCellEditing = ({
     (e) => {
       const el = e.target;
       el.removeEventListener("vuu-commit", commitHandler, true);
-      el.removeEventListener("vuu-enter-edit-mode", editModeHandler, true);
-      el.removeEventListener("vuu-exit-edit-mode", editModeHandler, true);
     },
-    [commitHandler, editModeHandler]
+    [commitHandler]
   );
   const handleFocus = useCallback(
     (e) => {
       const el = e.target;
       el.addEventListener("vuu-commit", commitHandler, true);
-      el.addEventListener("vuu-enter-edit-mode", editModeHandler, true);
-      el.addEventListener("vuu-exit-edit-mode", editModeHandler, true);
     },
-    [commitHandler, editModeHandler]
+    [commitHandler]
   );
   return {
     onBlur: handleBlur,

package/esm/useCellEditing.js.map

@@ -1 +1 @@
-{"version":3,"file":"useCellEditing.js","sources":["../../../packages/vuu-table/src/useCellEditing.ts"],"sourcesContent":["import {\n  dispatchCustomEvent,\n  isCharacterKey,\n  queryClosest,\n} from \"@vuu-ui/vuu-utils\";\nimport {\n  FocusEventHandler,\n  KeyboardEvent as ReactKeyboardEvent,\n  MouseEvent,\n  useCallback,\n} from \"react\";\nimport { cellIsTextInput, getAriaCellPos } from \"./table-dom-utils\";\nimport { FocusCell } from \"./useCellFocus\";\n\nexport interface CellEditingHookProps {\n  focusCell: FocusCell;\n  navigate: () => void;\n}\n\nexport const useCellEditing = ({\n  focusCell,\n  navigate,\n}: CellEditingHookProps) => {\n  const commitHandler = useCallback(() => {\n    navigate();\n  }, [navigate]);\n\n  const editModeHandler = useCallback(\n    (e: Event) => {\n      const tableCell = queryClosest<HTMLDivElement>(\n        e.target,\n        \".vuuTableCell\",\n        true,\n      );\n      if (e.type === \"vuu-exit-edit-mode\") {\n        tableCell.classList.remove(\"vuuEditing\");\n        const cellPos = getAriaCellPos(tableCell);\n        focusCell(cellPos, true);\n      } else {\n        tableCell.classList.add(\"vuuEditing\");\n      }\n    },\n    [focusCell],\n  );\n\n  const editInput = useCallback(\n    (evt: MouseEvent<HTMLElement> | ReactKeyboardEvent<HTMLElement>) => {\n      const cellEl = evt.target as HTMLDivElement;\n      const input = cellEl.matches(\"input\")\n        ? (cellEl as HTMLInputElement)\n        : cellEl.querySelector(\"input\");\n\n      if (input) {\n        input.focus();\n        input.select();\n      }\n    },\n    [],\n  );\n\n  const focusInput = useCallback(\n    (evt: MouseEvent<HTMLElement> | ReactKeyboardEvent<HTMLElement>) => {\n      const cellEl = evt.target as HTMLDivElement;\n      const input = cellEl.querySelector(\"input\");\n      if (input) {\n        input.focus();\n        input.select();\n        // need to put the input into edit mode\n        dispatchCustomEvent(input, \"vuu-begin-edit\");\n      }\n    },\n    [],\n  );\n\n  const handleKeyDown = useCallback(\n    (e: ReactKeyboardEvent<HTMLElement>) => {\n      const el = e.target as HTMLElement;\n      if (cellIsTextInput(el)) {\n        if (isCharacterKey(e.key)) {\n          editInput(e);\n        } else if (e.key === \"Enter\") {\n          focusInput(e);\n        }\n      }\n    },\n    [editInput, focusInput],\n  );\n\n  const handleDoubleClick = useCallback(\n    (e: MouseEvent<HTMLElement>) => {\n      const el = e.target as HTMLElement;\n      if (el.matches(\"input\") || el.querySelector(\"input\")) {\n        editInput(e);\n        e.stopPropagation();\n      }\n    },\n    [editInput],\n  );\n\n  const handleBlur = useCallback<FocusEventHandler>(\n    (e) => {\n      const el = e.target as HTMLElement;\n      el.removeEventListener(\"vuu-commit\", commitHandler, true);\n      el.removeEventListener(\"vuu-enter-edit-mode\", editModeHandler, true);\n      el.removeEventListener(\"vuu-exit-edit-mode\", editModeHandler, true);\n    },\n    [commitHandler, editModeHandler],\n  );\n\n  const handleFocus = useCallback<FocusEventHandler>(\n    (e) => {\n      const el = e.target as HTMLElement;\n      el.addEventListener(\"vuu-commit\", commitHandler, true);\n      el.addEventListener(\"vuu-enter-edit-mode\", editModeHandler, true);\n      el.addEventListener(\"vuu-exit-edit-mode\", editModeHandler, true);\n    },\n    [commitHandler, editModeHandler],\n  );\n\n  return {\n    onBlur: handleBlur,\n    onDoubleClick: handleDoubleClick,\n    onFocus: handleFocus,\n    onKeyDown: handleKeyDown,\n  };\n};\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"useCellEditing.js","sources":["../../../packages/vuu-table/src/useCellEditing.ts"],"sourcesContent":["import { isCharacterKey } from \"@vuu-ui/vuu-utils\";\nimport {\n  FocusEventHandler,\n  KeyboardEvent as ReactKeyboardEvent,\n  MouseEvent,\n  useCallback,\n} from \"react\";\nimport { cellIsTextInput } from \"./table-dom-utils\";\n\nexport interface CellEditingHookProps {\n  navigate: () => void;\n}\n\nexport const useCellEditing = ({ navigate }: CellEditingHookProps) => {\n  const commitHandler = useCallback(() => {\n    navigate();\n  }, [navigate]);\n\n  const editInput = useCallback(\n    (evt: MouseEvent<HTMLElement> | ReactKeyboardEvent<HTMLElement>) => {\n      const cellEl = evt.target as HTMLDivElement;\n      const input = cellEl.matches(\"input\")\n        ? (cellEl as HTMLInputElement)\n        : cellEl.querySelector(\"input\");\n\n      if (input) {\n        input.focus();\n      }\n    },\n    [],\n  );\n\n  const focusInput = useCallback(\n    (evt: MouseEvent<HTMLElement> | ReactKeyboardEvent<HTMLElement>) => {\n      const cellEl = evt.target as HTMLDivElement;\n      const input = cellEl.querySelector(\"input\");\n      if (input) {\n        input.focus();\n      }\n    },\n    [],\n  );\n\n  const handleKeyDown = useCallback(\n    (e: ReactKeyboardEvent<HTMLElement>) => {\n      const el = e.target as HTMLElement;\n      if (cellIsTextInput(el)) {\n        if (isCharacterKey(e.key)) {\n          editInput(e);\n        } else if (e.key === \"Enter\") {\n          focusInput(e);\n        }\n      }\n    },\n    [editInput, focusInput],\n  );\n\n  const handleDoubleClick = useCallback(\n    (e: MouseEvent<HTMLElement>) => {\n      const el = e.target as HTMLElement;\n      if (el.matches(\"input\") || el.querySelector(\"input\")) {\n        editInput(e);\n        e.stopPropagation();\n      }\n    },\n    [editInput],\n  );\n\n  const handleBlur = useCallback<FocusEventHandler>(\n    (e) => {\n      const el = e.target as HTMLElement;\n      el.removeEventListener(\"vuu-commit\", commitHandler, true);\n    },\n    [commitHandler],\n  );\n\n  const handleFocus = useCallback<FocusEventHandler>(\n    (e) => {\n      const el = e.target as HTMLElement;\n      el.addEventListener(\"vuu-commit\", commitHandler, true);\n    },\n    [commitHandler],\n  );\n\n  return {\n    onBlur: handleBlur,\n    onDoubleClick: handleDoubleClick,\n    onFocus: handleFocus,\n    onKeyDown: handleKeyDown,\n  };\n};\n"],"names":[],"mappings":";;;;AAaO,MAAM,cAAiB,GAAA,CAAC,EAAE,QAAA,EAAqC,KAAA;AACpE,EAAM,MAAA,aAAA,GAAgB,YAAY,MAAM;AACtC,IAAS,QAAA,EAAA;AAAA,GACX,EAAG,CAAC,QAAQ,CAAC,CAAA;AAEb,EAAA,MAAM,SAAY,GAAA,WAAA;AAAA,IAChB,CAAC,GAAmE,KAAA;AAClE,MAAA,MAAM,SAAS,GAAI,CAAA,MAAA;AACnB,MAAM,MAAA,KAAA,GAAQ,OAAO,OAAQ,CAAA,OAAO,IAC/B,MACD,GAAA,MAAA,CAAO,cAAc,OAAO,CAAA;AAEhC,MAAA,IAAI,KAAO,EAAA;AACT,QAAA,KAAA,CAAM,KAAM,EAAA;AAAA;AACd,KACF;AAAA,IACA;AAAC,GACH;AAEA,EAAA,MAAM,UAAa,GAAA,WAAA;AAAA,IACjB,CAAC,GAAmE,KAAA;AAClE,MAAA,MAAM,SAAS,GAAI,CAAA,MAAA;AACnB,MAAM,MAAA,KAAA,GAAQ,MAAO,CAAA,aAAA,CAAc,OAAO,CAAA;AAC1C,MAAA,IAAI,KAAO,EAAA;AACT,QAAA,KAAA,CAAM,KAAM,EAAA;AAAA;AACd,KACF;AAAA,IACA;AAAC,GACH;AAEA,EAAA,MAAM,aAAgB,GAAA,WAAA;AAAA,IACpB,CAAC,CAAuC,KAAA;AACtC,MAAA,MAAM,KAAK,CAAE,CAAA,MAAA;AACb,MAAI,IAAA,eAAA,CAAgB,EAAE,CAAG,EAAA;AACvB,QAAI,IAAA,cAAA,CAAe,CAAE,CAAA,GAAG,CAAG,EAAA;AACzB,UAAA,SAAA,CAAU,CAAC,CAAA;AAAA,SACb,MAAA,IAAW,CAAE,CAAA,GAAA,KAAQ,OAAS,EAAA;AAC5B,UAAA,UAAA,CAAW,CAAC,CAAA;AAAA;AACd;AACF,KACF;AAAA,IACA,CAAC,WAAW,UAAU;AAAA,GACxB;AAEA,EAAA,MAAM,iBAAoB,GAAA,WAAA;AAAA,IACxB,CAAC,CAA+B,KAAA;AAC9B,MAAA,MAAM,KAAK,CAAE,CAAA,MAAA;AACb,MAAA,IAAI,GAAG,OAAQ,CAAA,OAAO,KAAK,EAAG,CAAA,aAAA,CAAc,OAAO,CAAG,EAAA;AACpD,QAAA,SAAA,CAAU,CAAC,CAAA;AACX,QAAA,CAAA,CAAE,eAAgB,EAAA;AAAA;AACpB,KACF;AAAA,IACA,CAAC,SAAS;AAAA,GACZ;AAEA,EAAA,MAAM,UAAa,GAAA,WAAA;AAAA,IACjB,CAAC,CAAM,KAAA;AACL,MAAA,MAAM,KAAK,CAAE,CAAA,MAAA;AACb,MAAG,EAAA,CAAA,mBAAA,CAAoB,YAAc,EAAA,aAAA,EAAe,IAAI,CAAA;AAAA,KAC1D;AAAA,IACA,CAAC,aAAa;AAAA,GAChB;AAEA,EAAA,MAAM,WAAc,GAAA,WAAA;AAAA,IAClB,CAAC,CAAM,KAAA;AACL,MAAA,MAAM,KAAK,CAAE,CAAA,MAAA;AACb,MAAG,EAAA,CAAA,gBAAA,CAAiB,YAAc,EAAA,aAAA,EAAe,IAAI,CAAA;AAAA,KACvD;AAAA,IACA,CAAC,aAAa;AAAA,GAChB;AAEA,EAAO,OAAA;AAAA,IACL,MAAQ,EAAA,UAAA;AAAA,IACR,aAAe,EAAA,iBAAA;AAAA,IACf,OAAS,EAAA,WAAA;AAAA,IACT,SAAW,EAAA;AAAA,GACb;AACF;;;;"}