@vuu-ui/vuu-table-extras 2.2.1 → 3.0.0-beta.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (70) hide show
  1. package/cjs/packages/vuu-table-extras/src/cell-renderers/dropdown-cell/DropdownCell.js +3 -0
  2. package/cjs/packages/vuu-table-extras/src/cell-renderers/dropdown-cell/DropdownCell.js.map +1 -1
  3. package/cjs/packages/vuu-table-extras/src/column-picker/ColumnModel.js +1 -1
  4. package/cjs/packages/vuu-table-extras/src/column-picker/ColumnModel.js.map +1 -1
  5. package/cjs/packages/vuu-table-extras/src/csv-upload/CsvUpload.js +62 -48
  6. package/cjs/packages/vuu-table-extras/src/csv-upload/CsvUpload.js.map +1 -1
  7. package/cjs/packages/vuu-table-extras/src/csv-upload/data-upload-preview/DataUploadPreview.css.js +6 -0
  8. package/cjs/packages/vuu-table-extras/src/csv-upload/data-upload-preview/DataUploadPreview.css.js.map +1 -0
  9. package/cjs/packages/vuu-table-extras/src/csv-upload/data-upload-preview/DataUploadPreview.js +118 -0
  10. package/cjs/packages/vuu-table-extras/src/csv-upload/data-upload-preview/DataUploadPreview.js.map +1 -0
  11. package/cjs/packages/vuu-table-extras/src/csv-upload/data-upload-preview/useDataUploadPreview.js +76 -0
  12. package/cjs/packages/vuu-table-extras/src/csv-upload/data-upload-preview/useDataUploadPreview.js.map +1 -0
  13. package/cjs/packages/vuu-table-extras/src/csv-upload/parse/csv-upload-utils.js +1 -44
  14. package/cjs/packages/vuu-table-extras/src/csv-upload/parse/csv-upload-utils.js.map +1 -1
  15. package/cjs/packages/vuu-table-extras/src/csv-upload/useCsvUpload.js +154 -66
  16. package/cjs/packages/vuu-table-extras/src/csv-upload/useCsvUpload.js.map +1 -1
  17. package/cjs/packages/vuu-table-extras/src/index.js +6 -2
  18. package/cjs/packages/vuu-table-extras/src/index.js.map +1 -1
  19. package/cjs/packages/vuu-table-extras/src/inline-add-row/InlineAddRow.css.js +6 -0
  20. package/cjs/packages/vuu-table-extras/src/inline-add-row/InlineAddRow.css.js.map +1 -0
  21. package/cjs/packages/vuu-table-extras/src/inline-add-row/InlineAddRow.js +44 -0
  22. package/cjs/packages/vuu-table-extras/src/inline-add-row/InlineAddRow.js.map +1 -0
  23. package/cjs/packages/vuu-table-extras/src/inline-add-row/useInlineAddRow.js +137 -0
  24. package/cjs/packages/vuu-table-extras/src/inline-add-row/useInlineAddRow.js.map +1 -0
  25. package/cjs/packages/vuu-table-extras/src/table-footer/TableFooter.css.js +1 -1
  26. package/cjs/packages/vuu-table-extras/src/table-footer/TableFooter.js +5 -2
  27. package/cjs/packages/vuu-table-extras/src/table-footer/TableFooter.js.map +1 -1
  28. package/esm/packages/vuu-table-extras/src/cell-renderers/dropdown-cell/DropdownCell.js +3 -0
  29. package/esm/packages/vuu-table-extras/src/cell-renderers/dropdown-cell/DropdownCell.js.map +1 -1
  30. package/esm/packages/vuu-table-extras/src/column-picker/ColumnModel.js +2 -2
  31. package/esm/packages/vuu-table-extras/src/column-picker/ColumnModel.js.map +1 -1
  32. package/esm/packages/vuu-table-extras/src/csv-upload/CsvUpload.js +63 -49
  33. package/esm/packages/vuu-table-extras/src/csv-upload/CsvUpload.js.map +1 -1
  34. package/esm/packages/vuu-table-extras/src/csv-upload/data-upload-preview/DataUploadPreview.css.js +4 -0
  35. package/esm/packages/vuu-table-extras/src/csv-upload/data-upload-preview/DataUploadPreview.css.js.map +1 -0
  36. package/esm/packages/vuu-table-extras/src/csv-upload/data-upload-preview/DataUploadPreview.js +116 -0
  37. package/esm/packages/vuu-table-extras/src/csv-upload/data-upload-preview/DataUploadPreview.js.map +1 -0
  38. package/esm/packages/vuu-table-extras/src/csv-upload/data-upload-preview/useDataUploadPreview.js +73 -0
  39. package/esm/packages/vuu-table-extras/src/csv-upload/data-upload-preview/useDataUploadPreview.js.map +1 -0
  40. package/esm/packages/vuu-table-extras/src/csv-upload/parse/csv-upload-utils.js +2 -43
  41. package/esm/packages/vuu-table-extras/src/csv-upload/parse/csv-upload-utils.js.map +1 -1
  42. package/esm/packages/vuu-table-extras/src/csv-upload/useCsvUpload.js +157 -69
  43. package/esm/packages/vuu-table-extras/src/csv-upload/useCsvUpload.js.map +1 -1
  44. package/esm/packages/vuu-table-extras/src/index.js +3 -1
  45. package/esm/packages/vuu-table-extras/src/index.js.map +1 -1
  46. package/esm/packages/vuu-table-extras/src/inline-add-row/InlineAddRow.css.js +4 -0
  47. package/esm/packages/vuu-table-extras/src/inline-add-row/InlineAddRow.css.js.map +1 -0
  48. package/esm/packages/vuu-table-extras/src/inline-add-row/InlineAddRow.js +42 -0
  49. package/esm/packages/vuu-table-extras/src/inline-add-row/InlineAddRow.js.map +1 -0
  50. package/esm/packages/vuu-table-extras/src/inline-add-row/useInlineAddRow.js +135 -0
  51. package/esm/packages/vuu-table-extras/src/inline-add-row/useInlineAddRow.js.map +1 -0
  52. package/esm/packages/vuu-table-extras/src/table-footer/TableFooter.css.js +1 -1
  53. package/esm/packages/vuu-table-extras/src/table-footer/TableFooter.js +5 -2
  54. package/esm/packages/vuu-table-extras/src/table-footer/TableFooter.js.map +1 -1
  55. package/package.json +12 -11
  56. package/types/csv-upload/CsvUpload.d.ts +9 -1
  57. package/types/csv-upload/data-upload-preview/DataUploadPreview.d.ts +10 -0
  58. package/types/csv-upload/data-upload-preview/useDataUploadPreview.d.ts +17 -0
  59. package/types/csv-upload/index.d.ts +2 -2
  60. package/types/csv-upload/useCsvUpload.d.ts +6 -3
  61. package/types/index.d.ts +1 -0
  62. package/types/inline-add-row/InlineAddRow.d.ts +3 -0
  63. package/types/inline-add-row/index.d.ts +2 -0
  64. package/types/inline-add-row/useInlineAddRow.d.ts +57 -0
  65. package/types/table-footer/TableFooter.d.ts +3 -2
  66. package/cjs/packages/vuu-table-extras/src/csv-upload/useCsvUploadSessionPreview.js +0 -73
  67. package/cjs/packages/vuu-table-extras/src/csv-upload/useCsvUploadSessionPreview.js.map +0 -1
  68. package/esm/packages/vuu-table-extras/src/csv-upload/useCsvUploadSessionPreview.js +0 -71
  69. package/esm/packages/vuu-table-extras/src/csv-upload/useCsvUploadSessionPreview.js.map +0 -1
  70. package/types/csv-upload/useCsvUploadSessionPreview.d.ts +0 -10
@@ -3,6 +3,7 @@
3
3
  var jsxRuntime = require('react/jsx-runtime');
4
4
  var vuuDataReact = require('@vuu-ui/vuu-data-react');
5
5
  var vuuUtils = require('@vuu-ui/vuu-utils');
6
+ var vuuDataEditing = require('@vuu-ui/vuu-data-editing');
6
7
  var cx = require('clsx');
7
8
  var core = require('@salt-ds/core');
8
9
  var styles = require('@salt-ds/styles');
@@ -29,6 +30,7 @@ const DropdownCell = react.memo(
29
30
  }
30
31
  const [open, setOpen] = react.useState(false);
31
32
  const dataValue = dataRow[column.name];
33
+ const readOnly = vuuDataEditing.isEditRowReadOnly(dataRow);
32
34
  const { values } = vuuDataReact.useLookupValues(column, dataValue);
33
35
  const valueRef = react.useRef(void 0);
34
36
  react.useMemo(() => {
@@ -87,6 +89,7 @@ const DropdownCell = react.memo(
87
89
  onOpenChange: handleOpenChange,
88
90
  onSelectionChange: handleSelectionChange,
89
91
  open,
92
+ readOnly,
90
93
  selected: selectedOption ? [selectedOption] : [],
91
94
  value: selectedOption?.label,
92
95
  children: values.map((listOption, i) => /* @__PURE__ */ jsxRuntime.jsx(core.Option, { value: listOption, children: listOption.label }, i))
@@ -1 +1 @@
1
- {"version":3,"file":"DropdownCell.js","sources":["../../../../../../../../packages/vuu-table-extras/src/cell-renderers/dropdown-cell/DropdownCell.tsx"],"sourcesContent":["import { useLookupValues } from \"@vuu-ui/vuu-data-react\";\nimport type { VuuColumnDataType } from \"@vuu-ui/vuu-protocol-types\";\nimport { ListOption, TableCellRendererProps } from \"@vuu-ui/vuu-table-types\";\nimport {\n dataColumnAndKeyUnchanged,\n dispatchCustomEvent,\n getSelectedOption,\n isRpcSuccess,\n registerComponent,\n} from \"@vuu-ui/vuu-utils\";\nimport cx from \"clsx\";\nimport { Dropdown, Option } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport {\n KeyboardEventHandler,\n MouseEventHandler,\n SyntheticEvent,\n memo,\n useCallback,\n useMemo,\n useRef,\n useState,\n} from \"react\";\n\nimport dropdownCellCss from \"./DropdownCell.css\";\n\nconst classBase = \"vuuTableDropdownCell\";\n\nexport const DropdownCell = memo(\n function DropdownCell({\n column,\n dataRow,\n editedDuringCurrentSession,\n onEdit,\n }: TableCellRendererProps) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"vuu-dropdown-cell\",\n css: dropdownCellCss,\n window: targetWindow,\n });\n\n if (editedDuringCurrentSession) {\n console.log(`${column.name} edited ${editedDuringCurrentSession}`);\n }\n\n const [open, setOpen] = useState(false);\n const dataValue = dataRow[column.name] as string | number;\n const { values } = useLookupValues(column, dataValue);\n const valueRef = useRef<ListOption>(undefined);\n\n useMemo(() => {\n valueRef.current = getSelectedOption(values, dataValue);\n }, [dataValue, values]);\n\n const handleOpenChange = useCallback((isOpen: boolean) => {\n console.log(`handleOpenChange ${isOpen}`);\n if (isOpen === false) {\n setOpen(false);\n }\n }, []);\n\n const handleSelectionChange = useCallback(\n async (evt: SyntheticEvent, [selectedOption]: ListOption[]) => {\n if (selectedOption) {\n // Note, we do not setState locally when a selection is made, we just send the update\n // to the server. We rely on the update coming back in from a server response which\n // we handle in the useMemo above. If we worry that server repsonses might be too slow\n // we can extend this logic with some kind of pending update state.\n const response = await onEdit?.(\n {\n editType: \"commit\",\n isValid: true,\n previousValue: valueRef.current?.value,\n value: selectedOption.value as VuuColumnDataType,\n },\n \"commit\",\n );\n if (isRpcSuccess(response)) {\n // TODO this should be done in TableCell\n dispatchCustomEvent(evt.target as HTMLElement, \"vuu-commit\");\n }\n }\n },\n [onEdit],\n );\n\n const handleClick = useCallback<\n MouseEventHandler<HTMLButtonElement>\n >(() => {\n if (!open) {\n setOpen(true);\n }\n }, [open]);\n\n const handleKeyDown = useCallback<KeyboardEventHandler>(\n (e) => {\n if (e.key === \"Enter\" && !open) {\n e.preventDefault();\n e.stopPropagation();\n setOpen(true);\n }\n },\n [open],\n );\n\n const { current: selectedOption } = valueRef;\n return (\n <Dropdown<ListOption>\n className={cx(classBase, {\n [`${classBase}-edited`]: editedDuringCurrentSession === true,\n })}\n data-icon=\"triangle-down\"\n onClick={handleClick}\n onKeyDownCapture={handleKeyDown}\n onOpenChange={handleOpenChange}\n onSelectionChange={handleSelectionChange}\n open={open}\n selected={selectedOption ? [selectedOption] : []}\n value={selectedOption?.label}\n >\n {values.map((listOption, i) => (\n <Option key={i} value={listOption}>\n {listOption.label}\n </Option>\n ))}\n </Dropdown>\n );\n },\n (p: TableCellRendererProps, p1: TableCellRendererProps) =>\n p.editedDuringCurrentSession !== p1.editedDuringCurrentSession &&\n dataColumnAndKeyUnchanged(p, p1),\n);\nregisterComponent(\"dropdown-cell\", DropdownCell, \"cell-renderer\", {\n userCanAssign: false,\n});\n"],"names":["memo","DropdownCell","useWindow","useComponentCssInjection","dropdownCellCss","useState","useLookupValues","useRef","useMemo","getSelectedOption","useCallback","selectedOption","isRpcSuccess","dispatchCustomEvent","jsx","Dropdown","Option","dataColumnAndKeyUnchanged","registerComponent"],"mappings":"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"}
1
+ {"version":3,"file":"DropdownCell.js","sources":["../../../../../../../../packages/vuu-table-extras/src/cell-renderers/dropdown-cell/DropdownCell.tsx"],"sourcesContent":["import { useLookupValues } from \"@vuu-ui/vuu-data-react\";\nimport type { VuuColumnDataType } from \"@vuu-ui/vuu-protocol-types\";\nimport { ListOption, TableCellRendererProps } from \"@vuu-ui/vuu-table-types\";\nimport {\n dataColumnAndKeyUnchanged,\n dispatchCustomEvent,\n getSelectedOption,\n isRpcSuccess,\n registerComponent,\n} from \"@vuu-ui/vuu-utils\";\nimport { isEditRowReadOnly } from \"@vuu-ui/vuu-data-editing\";\nimport cx from \"clsx\";\nimport { Dropdown, Option } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport {\n KeyboardEventHandler,\n MouseEventHandler,\n SyntheticEvent,\n memo,\n useCallback,\n useMemo,\n useRef,\n useState,\n} from \"react\";\n\nimport dropdownCellCss from \"./DropdownCell.css\";\n\nconst classBase = \"vuuTableDropdownCell\";\n\nexport const DropdownCell = memo(\n function DropdownCell({\n column,\n dataRow,\n editedDuringCurrentSession,\n onEdit,\n }: TableCellRendererProps) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"vuu-dropdown-cell\",\n css: dropdownCellCss,\n window: targetWindow,\n });\n\n if (editedDuringCurrentSession) {\n console.log(`${column.name} edited ${editedDuringCurrentSession}`);\n }\n\n const [open, setOpen] = useState(false);\n const dataValue = dataRow[column.name] as string | number;\n const readOnly = isEditRowReadOnly(dataRow);\n const { values } = useLookupValues(column, dataValue);\n const valueRef = useRef<ListOption>(undefined);\n\n useMemo(() => {\n valueRef.current = getSelectedOption(values, dataValue);\n }, [dataValue, values]);\n\n const handleOpenChange = useCallback((isOpen: boolean) => {\n console.log(`handleOpenChange ${isOpen}`);\n if (isOpen === false) {\n setOpen(false);\n }\n }, []);\n\n const handleSelectionChange = useCallback(\n async (evt: SyntheticEvent, [selectedOption]: ListOption[]) => {\n if (selectedOption) {\n // Note, we do not setState locally when a selection is made, we just send the update\n // to the server. We rely on the update coming back in from a server response which\n // we handle in the useMemo above. If we worry that server repsonses might be too slow\n // we can extend this logic with some kind of pending update state.\n const response = await onEdit?.(\n {\n editType: \"commit\",\n isValid: true,\n previousValue: valueRef.current?.value,\n value: selectedOption.value as VuuColumnDataType,\n },\n \"commit\",\n );\n if (isRpcSuccess(response)) {\n // TODO this should be done in TableCell\n dispatchCustomEvent(evt.target as HTMLElement, \"vuu-commit\");\n }\n }\n },\n [onEdit],\n );\n\n const handleClick = useCallback<\n MouseEventHandler<HTMLButtonElement>\n >(() => {\n if (!open) {\n setOpen(true);\n }\n }, [open]);\n\n const handleKeyDown = useCallback<KeyboardEventHandler>(\n (e) => {\n if (e.key === \"Enter\" && !open) {\n e.preventDefault();\n e.stopPropagation();\n setOpen(true);\n }\n },\n [open],\n );\n\n const { current: selectedOption } = valueRef;\n return (\n <Dropdown<ListOption>\n className={cx(classBase, {\n [`${classBase}-edited`]: editedDuringCurrentSession === true,\n })}\n data-icon=\"triangle-down\"\n onClick={handleClick}\n onKeyDownCapture={handleKeyDown}\n onOpenChange={handleOpenChange}\n onSelectionChange={handleSelectionChange}\n open={open}\n readOnly={readOnly}\n selected={selectedOption ? [selectedOption] : []}\n value={selectedOption?.label}\n >\n {values.map((listOption, i) => (\n <Option key={i} value={listOption}>\n {listOption.label}\n </Option>\n ))}\n </Dropdown>\n );\n },\n (p: TableCellRendererProps, p1: TableCellRendererProps) =>\n p.editedDuringCurrentSession !== p1.editedDuringCurrentSession &&\n dataColumnAndKeyUnchanged(p, p1),\n);\nregisterComponent(\"dropdown-cell\", DropdownCell, \"cell-renderer\", {\n userCanAssign: false,\n});\n"],"names":["memo","DropdownCell","useWindow","useComponentCssInjection","dropdownCellCss","useState","isEditRowReadOnly","useLookupValues","useRef","useMemo","getSelectedOption","useCallback","selectedOption","isRpcSuccess","dispatchCustomEvent","jsx","Dropdown","Option","dataColumnAndKeyUnchanged","registerComponent"],"mappings":"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"}
@@ -111,7 +111,7 @@ class ColumnModel extends vuuUtils.EventEmitter {
111
111
  }
112
112
  reorderSelectedColumns(orderedColumnNames, source) {
113
113
  this.setSelectedColumns(
114
- vuuUtils.reorderColumnItems(__privateGet(this, _selectedColumns), orderedColumnNames),
114
+ vuuUtils.reorderItems(__privateGet(this, _selectedColumns), orderedColumnNames),
115
115
  source,
116
116
  { type: SelectedColumnChangeType.ColumnsReordered }
117
117
  );
@@ -1 +1 @@
1
- {"version":3,"file":"ColumnModel.js","sources":["../../../../../../../packages/vuu-table-extras/src/column-picker/ColumnModel.ts"],"sourcesContent":["import { ColumnDescriptor } from \"@vuu-ui/vuu-table-types\";\nimport { EventEmitter, reorderColumnItems, ValueOf } from \"@vuu-ui/vuu-utils\";\n\nexport const ColumnChangeSource = {\n ColumnPicker: \"column-picker\",\n ColumnSettings: \"column-settings\",\n Table: \"table\",\n} as const;\nexport type ColumnChangeSource = ValueOf<typeof ColumnChangeSource>;\n\nexport const SelectedColumnChangeType = {\n CalculatedColumnAdded: \"calculated-column-added\",\n ColumnAdded: \"column-added\",\n ColumnRemoved: \"column-removed\",\n ColumnUpdated: \"column-updated\",\n ColumnsReordered: \"columns-reordered\",\n} as const;\nexport type SelectedColumnChangeType = ValueOf<typeof SelectedColumnChangeType>;\n\nexport interface SelectedColumnChangeColumnAdded {\n type: Extract<SelectedColumnChangeType, \"column-added\">;\n column: ColumnDescriptor;\n}\nexport interface SelectedColumnChangeCalculatedColumnAdded {\n type: Extract<SelectedColumnChangeType, \"calculated-column-added\">;\n column: ColumnDescriptor;\n}\nexport interface SelectedColumnChangeColumnUpdated {\n type: Extract<SelectedColumnChangeType, \"column-updated\">;\n column: ColumnDescriptor;\n}\n\nexport interface SelectedColumnChangeColumnRemoved {\n type: Extract<SelectedColumnChangeType, \"column-removed\">;\n column: ColumnDescriptor;\n}\n\nexport interface SelectedColumnChangeColumnsReordered {\n type: Extract<SelectedColumnChangeType, \"columns-reordered\">;\n}\n\nexport type SelectedColumnChangeDescriptor =\n | SelectedColumnChangeCalculatedColumnAdded\n | SelectedColumnChangeColumnAdded\n | SelectedColumnChangeColumnRemoved\n | SelectedColumnChangeColumnUpdated\n | SelectedColumnChangeColumnsReordered;\n\nexport const isColumnAdded = (\n change?: SelectedColumnChangeDescriptor,\n): change is SelectedColumnChangeColumnAdded =>\n change?.type === SelectedColumnChangeType.ColumnAdded;\nexport const isColumnRemoved = (\n change?: SelectedColumnChangeDescriptor,\n): change is SelectedColumnChangeColumnRemoved =>\n change?.type === SelectedColumnChangeType.ColumnRemoved;\nexport const isColumnUpdated = (\n change?: SelectedColumnChangeDescriptor,\n): change is SelectedColumnChangeColumnUpdated =>\n change?.type === SelectedColumnChangeType.ColumnUpdated;\nexport const isColumnsReordered = (\n change?: SelectedColumnChangeDescriptor,\n): change is SelectedColumnChangeColumnsReordered =>\n change?.type === SelectedColumnChangeType.ColumnsReordered;\n\nexport type ColumnsChangeHandler = (\n columns: readonly ColumnDescriptor[],\n changeSource: ColumnChangeSource,\n changeDescriptor?: SelectedColumnChangeDescriptor,\n) => void;\nexport type ColumnEvents = {\n change: ColumnsChangeHandler;\n render: (o: object) => void;\n};\n\nconst byColumnName = (\n { name: n1, label: l1 = n1 }: ColumnDescriptor,\n { name: n2, label: l2 = n2 }: ColumnDescriptor,\n) => (l1 > l2 ? 1 : l2 > l1 ? -1 : 0);\n\nconst filterColumns = (\n columns: readonly ColumnDescriptor[],\n pattern: string,\n) => {\n if (pattern) {\n const lowerCasePattern = pattern.toLowerCase();\n return columns.filter(\n ({ name, label = name }) =>\n label.toLowerCase().indexOf(lowerCasePattern) !== -1,\n );\n } else {\n return columns;\n }\n};\n\nexport class ColumnModel extends EventEmitter<ColumnEvents> {\n #searchPattern = \"\";\n #selectedColumns: readonly ColumnDescriptor[];\n constructor(\n /**\n * All available columns, including selected columns.\n */\n public allColumns: readonly ColumnDescriptor[],\n /**\n * Columns already selected and rendered in Table.\n */\n selectedColumns: readonly ColumnDescriptor[],\n ) {\n super();\n this.#selectedColumns = selectedColumns;\n }\n\n get availableColumns(): ColumnDescriptor[] {\n return filterColumns(this.allColumns, this.#searchPattern)\n .filter(\n ({ name }) =>\n this.#selectedColumns.findIndex((c) => c.name === name) === -1,\n )\n .toSorted(byColumnName);\n }\n\n set searchPattern(pattern: string) {\n const searchPattern = pattern;\n if (searchPattern !== this.#searchPattern) {\n this.#searchPattern = searchPattern;\n this.emit(\"render\", {});\n }\n }\n\n get searchPattern() {\n return this.#searchPattern ?? \"\";\n }\n\n get selectedColumns() {\n return filterColumns(this.#selectedColumns, this.#searchPattern);\n }\n setSelectedColumns(\n selectedColumns: ColumnDescriptor[],\n source: ColumnChangeSource,\n changeDescriptor?: SelectedColumnChangeDescriptor,\n ) {\n this.#selectedColumns = selectedColumns;\n this.notifyListeners(selectedColumns, source, changeDescriptor);\n }\n\n getColumn(name: string) {\n const col = this.#selectedColumns.find((col) => col.name === name);\n if (col) {\n return col;\n }\n throw Error(`[ColumnModel] columns does not contain column ${name}`);\n }\n\n addItemToSelectedColumns(name: string, source: ColumnChangeSource) {\n const column = this.allColumns.find((col) => col.name === name);\n if (column) {\n this.#selectedColumns = this.#selectedColumns.concat(column);\n this.notifyListeners(this.#selectedColumns, source, {\n type: SelectedColumnChangeType.ColumnAdded,\n column,\n });\n } else {\n throw Error(\n `[ColumnModel] addItemToSelectedColumns, column '${name}' not found`,\n );\n }\n }\n removeItemFromSelectedColumns(name: string, source: ColumnChangeSource) {\n const column = this.#selectedColumns.find((col) => col.name === name);\n if (column) {\n const index = this.#selectedColumns.indexOf(column);\n this.#selectedColumns = this.#selectedColumns.toSpliced(index, 1);\n this.notifyListeners(this.#selectedColumns, source, {\n type: SelectedColumnChangeType.ColumnRemoved,\n column,\n });\n } else {\n throw Error(\n `[ColumnModel] removeItemFromSelectedColumns, column '${name}' not found`,\n );\n }\n }\n\n reorderSelectedColumns(\n orderedColumnNames: string[],\n source: ColumnChangeSource,\n ) {\n this.setSelectedColumns(\n reorderColumnItems(this.#selectedColumns, orderedColumnNames),\n source,\n { type: SelectedColumnChangeType.ColumnsReordered },\n );\n }\n\n updateColumn(\n currentColumn: ColumnDescriptor,\n newColumn: ColumnDescriptor,\n ): void;\n updateColumn(column: ColumnDescriptor): void;\n updateColumn(column: ColumnDescriptor, newColumn: ColumnDescriptor = column) {\n const allIndex = this.allColumns.findIndex(\n (col) => col.name === column.name,\n );\n const selectedIndex = this.#selectedColumns.findIndex(\n (col) => col.name === column.name,\n );\n\n if (selectedIndex !== -1) {\n if (allIndex === -1) {\n throw Error(\n `[ColumnModel] updateColumn, selected column not in allColumns collection`,\n );\n }\n\n this.#selectedColumns = this.#selectedColumns.toSpliced(\n selectedIndex,\n 1,\n newColumn,\n );\n this.allColumns = this.allColumns.toSpliced(allIndex, 1, newColumn);\n\n this.notifyListeners(this.#selectedColumns, \"column-settings\", {\n type: SelectedColumnChangeType.ColumnUpdated,\n column,\n });\n } else {\n throw Error(\n `[ColumnModel] updateColumn, column ${column.name} not found`,\n );\n }\n }\n\n /**\n * Used when adding a calculated column\n *\n * @param column\n *\n * @param addToSelectedColumns\n */\n addColumn(column: ColumnDescriptor, addToSelectedColumns = false) {\n console.log(`[ColumnModel] add column ${JSON.stringify(column)}`);\n if (addToSelectedColumns) {\n console.log(`add it to selected coliumns`);\n }\n\n this.allColumns = this.allColumns.concat(column);\n this.#selectedColumns = this.#selectedColumns.concat(column);\n\n this.notifyListeners(this.#selectedColumns, \"column-picker\", {\n type: SelectedColumnChangeType.CalculatedColumnAdded,\n column,\n });\n }\n\n private notifyListeners: ColumnsChangeHandler = (\n columns,\n source,\n changeType,\n ) => {\n this.emit(\"change\", columns, source, changeType);\n this.emit(\"render\", {});\n };\n}\n"],"names":["EventEmitter","col","reorderColumnItems"],"mappings":"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"}
1
+ {"version":3,"file":"ColumnModel.js","sources":["../../../../../../../packages/vuu-table-extras/src/column-picker/ColumnModel.ts"],"sourcesContent":["import { ColumnDescriptor } from \"@vuu-ui/vuu-table-types\";\nimport { EventEmitter, reorderItems, ValueOf } from \"@vuu-ui/vuu-utils\";\n\nexport const ColumnChangeSource = {\n ColumnPicker: \"column-picker\",\n ColumnSettings: \"column-settings\",\n Table: \"table\",\n} as const;\nexport type ColumnChangeSource = ValueOf<typeof ColumnChangeSource>;\n\nexport const SelectedColumnChangeType = {\n CalculatedColumnAdded: \"calculated-column-added\",\n ColumnAdded: \"column-added\",\n ColumnRemoved: \"column-removed\",\n ColumnUpdated: \"column-updated\",\n ColumnsReordered: \"columns-reordered\",\n} as const;\nexport type SelectedColumnChangeType = ValueOf<typeof SelectedColumnChangeType>;\n\nexport interface SelectedColumnChangeColumnAdded {\n type: Extract<SelectedColumnChangeType, \"column-added\">;\n column: ColumnDescriptor;\n}\nexport interface SelectedColumnChangeCalculatedColumnAdded {\n type: Extract<SelectedColumnChangeType, \"calculated-column-added\">;\n column: ColumnDescriptor;\n}\nexport interface SelectedColumnChangeColumnUpdated {\n type: Extract<SelectedColumnChangeType, \"column-updated\">;\n column: ColumnDescriptor;\n}\n\nexport interface SelectedColumnChangeColumnRemoved {\n type: Extract<SelectedColumnChangeType, \"column-removed\">;\n column: ColumnDescriptor;\n}\n\nexport interface SelectedColumnChangeColumnsReordered {\n type: Extract<SelectedColumnChangeType, \"columns-reordered\">;\n}\n\nexport type SelectedColumnChangeDescriptor =\n | SelectedColumnChangeCalculatedColumnAdded\n | SelectedColumnChangeColumnAdded\n | SelectedColumnChangeColumnRemoved\n | SelectedColumnChangeColumnUpdated\n | SelectedColumnChangeColumnsReordered;\n\nexport const isColumnAdded = (\n change?: SelectedColumnChangeDescriptor,\n): change is SelectedColumnChangeColumnAdded =>\n change?.type === SelectedColumnChangeType.ColumnAdded;\nexport const isColumnRemoved = (\n change?: SelectedColumnChangeDescriptor,\n): change is SelectedColumnChangeColumnRemoved =>\n change?.type === SelectedColumnChangeType.ColumnRemoved;\nexport const isColumnUpdated = (\n change?: SelectedColumnChangeDescriptor,\n): change is SelectedColumnChangeColumnUpdated =>\n change?.type === SelectedColumnChangeType.ColumnUpdated;\nexport const isColumnsReordered = (\n change?: SelectedColumnChangeDescriptor,\n): change is SelectedColumnChangeColumnsReordered =>\n change?.type === SelectedColumnChangeType.ColumnsReordered;\n\nexport type ColumnsChangeHandler = (\n columns: readonly ColumnDescriptor[],\n changeSource: ColumnChangeSource,\n changeDescriptor?: SelectedColumnChangeDescriptor,\n) => void;\nexport type ColumnEvents = {\n change: ColumnsChangeHandler;\n render: (o: object) => void;\n};\n\nconst byColumnName = (\n { name: n1, label: l1 = n1 }: ColumnDescriptor,\n { name: n2, label: l2 = n2 }: ColumnDescriptor,\n) => (l1 > l2 ? 1 : l2 > l1 ? -1 : 0);\n\nconst filterColumns = (\n columns: readonly ColumnDescriptor[],\n pattern: string,\n) => {\n if (pattern) {\n const lowerCasePattern = pattern.toLowerCase();\n return columns.filter(\n ({ name, label = name }) =>\n label.toLowerCase().indexOf(lowerCasePattern) !== -1,\n );\n } else {\n return columns;\n }\n};\n\nexport class ColumnModel extends EventEmitter<ColumnEvents> {\n #searchPattern = \"\";\n #selectedColumns: readonly ColumnDescriptor[];\n constructor(\n /**\n * All available columns, including selected columns.\n */\n public allColumns: readonly ColumnDescriptor[],\n /**\n * Columns already selected and rendered in Table.\n */\n selectedColumns: readonly ColumnDescriptor[],\n ) {\n super();\n this.#selectedColumns = selectedColumns;\n }\n\n get availableColumns(): ColumnDescriptor[] {\n return filterColumns(this.allColumns, this.#searchPattern)\n .filter(\n ({ name }) =>\n this.#selectedColumns.findIndex((c) => c.name === name) === -1,\n )\n .toSorted(byColumnName);\n }\n\n set searchPattern(pattern: string) {\n const searchPattern = pattern;\n if (searchPattern !== this.#searchPattern) {\n this.#searchPattern = searchPattern;\n this.emit(\"render\", {});\n }\n }\n\n get searchPattern() {\n return this.#searchPattern ?? \"\";\n }\n\n get selectedColumns() {\n return filterColumns(this.#selectedColumns, this.#searchPattern);\n }\n setSelectedColumns(\n selectedColumns: ColumnDescriptor[],\n source: ColumnChangeSource,\n changeDescriptor?: SelectedColumnChangeDescriptor,\n ) {\n this.#selectedColumns = selectedColumns;\n this.notifyListeners(selectedColumns, source, changeDescriptor);\n }\n\n getColumn(name: string) {\n const col = this.#selectedColumns.find((col) => col.name === name);\n if (col) {\n return col;\n }\n throw Error(`[ColumnModel] columns does not contain column ${name}`);\n }\n\n addItemToSelectedColumns(name: string, source: ColumnChangeSource) {\n const column = this.allColumns.find((col) => col.name === name);\n if (column) {\n this.#selectedColumns = this.#selectedColumns.concat(column);\n this.notifyListeners(this.#selectedColumns, source, {\n type: SelectedColumnChangeType.ColumnAdded,\n column,\n });\n } else {\n throw Error(\n `[ColumnModel] addItemToSelectedColumns, column '${name}' not found`,\n );\n }\n }\n removeItemFromSelectedColumns(name: string, source: ColumnChangeSource) {\n const column = this.#selectedColumns.find((col) => col.name === name);\n if (column) {\n const index = this.#selectedColumns.indexOf(column);\n this.#selectedColumns = this.#selectedColumns.toSpliced(index, 1);\n this.notifyListeners(this.#selectedColumns, source, {\n type: SelectedColumnChangeType.ColumnRemoved,\n column,\n });\n } else {\n throw Error(\n `[ColumnModel] removeItemFromSelectedColumns, column '${name}' not found`,\n );\n }\n }\n\n reorderSelectedColumns(\n orderedColumnNames: string[],\n source: ColumnChangeSource,\n ) {\n this.setSelectedColumns(\n reorderItems(this.#selectedColumns, orderedColumnNames),\n source,\n { type: SelectedColumnChangeType.ColumnsReordered },\n );\n }\n\n updateColumn(\n currentColumn: ColumnDescriptor,\n newColumn: ColumnDescriptor,\n ): void;\n updateColumn(column: ColumnDescriptor): void;\n updateColumn(column: ColumnDescriptor, newColumn: ColumnDescriptor = column) {\n const allIndex = this.allColumns.findIndex(\n (col) => col.name === column.name,\n );\n const selectedIndex = this.#selectedColumns.findIndex(\n (col) => col.name === column.name,\n );\n\n if (selectedIndex !== -1) {\n if (allIndex === -1) {\n throw Error(\n `[ColumnModel] updateColumn, selected column not in allColumns collection`,\n );\n }\n\n this.#selectedColumns = this.#selectedColumns.toSpliced(\n selectedIndex,\n 1,\n newColumn,\n );\n this.allColumns = this.allColumns.toSpliced(allIndex, 1, newColumn);\n\n this.notifyListeners(this.#selectedColumns, \"column-settings\", {\n type: SelectedColumnChangeType.ColumnUpdated,\n column,\n });\n } else {\n throw Error(\n `[ColumnModel] updateColumn, column ${column.name} not found`,\n );\n }\n }\n\n /**\n * Used when adding a calculated column\n *\n * @param column\n *\n * @param addToSelectedColumns\n */\n addColumn(column: ColumnDescriptor, addToSelectedColumns = false) {\n console.log(`[ColumnModel] add column ${JSON.stringify(column)}`);\n if (addToSelectedColumns) {\n console.log(`add it to selected coliumns`);\n }\n\n this.allColumns = this.allColumns.concat(column);\n this.#selectedColumns = this.#selectedColumns.concat(column);\n\n this.notifyListeners(this.#selectedColumns, \"column-picker\", {\n type: SelectedColumnChangeType.CalculatedColumnAdded,\n column,\n });\n }\n\n private notifyListeners: ColumnsChangeHandler = (\n columns,\n source,\n changeType,\n ) => {\n this.emit(\"change\", columns, source, changeType);\n this.emit(\"render\", {});\n };\n}\n"],"names":["EventEmitter","col","reorderItems"],"mappings":"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"}
@@ -13,18 +13,13 @@ const CsvUpload = (props) => {
13
13
  const {
14
14
  children,
15
15
  dialogTitle = "Import CSV",
16
+ embedded = false,
16
17
  onCancel,
17
18
  onClose,
18
19
  open
19
20
  } = props;
20
21
  const isControlledOpen = open !== void 0;
21
22
  const [internalOpen, setInternalOpen] = react.useState(open ?? true);
22
- const handleCancel = react.useCallback(() => {
23
- if (!isControlledOpen) {
24
- setInternalOpen(false);
25
- }
26
- onCancel?.();
27
- }, [isControlledOpen, onCancel]);
28
23
  const dialogOpen = isControlledOpen ? open : internalOpen;
29
24
  const targetWindow = window.useWindow();
30
25
  styles.useComponentCssInjection({
@@ -34,6 +29,7 @@ const CsvUpload = (props) => {
34
29
  });
35
30
  const {
36
31
  canImport,
32
+ cancelImport,
37
33
  isProcessingFile,
38
34
  isImporting,
39
35
  importData,
@@ -42,52 +38,70 @@ const CsvUpload = (props) => {
42
38
  schema,
43
39
  validation
44
40
  } = useCsvUpload.useCsvUpload(props);
41
+ const handleCancel = react.useCallback(async () => {
42
+ await cancelImport();
43
+ if (!isControlledOpen) {
44
+ setInternalOpen(false);
45
+ }
46
+ onCancel?.();
47
+ }, [cancelImport, isControlledOpen, onCancel]);
45
48
  const handleImport = react.useCallback(async () => {
46
- await importData();
47
- onClose?.();
49
+ if (await importData()) {
50
+ onClose?.();
51
+ }
48
52
  }, [importData, onClose]);
53
+ const content = /* @__PURE__ */ jsxRuntime.jsxs("div", { className: classBase, children: [
54
+ /* @__PURE__ */ jsxRuntime.jsxs(
55
+ core.FileDropZone,
56
+ {
57
+ className: `${classBase}-dropZone`,
58
+ disabled: schema === void 0 || isProcessingFile || isImporting,
59
+ onDrop,
60
+ status: validation && validation.errors.length > 0 ? "error" : void 0,
61
+ children: [
62
+ /* @__PURE__ */ jsxRuntime.jsx(core.FileDropZoneIcon, {}),
63
+ validation && validation.errors.length > 0 ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
64
+ /* @__PURE__ */ jsxRuntime.jsx("div", { children: "Your file contains errors" }),
65
+ /* @__PURE__ */ jsxRuntime.jsx("div", { children: " Please rectify and reupload" })
66
+ ] }) : /* @__PURE__ */ jsxRuntime.jsx("div", { children: "Drop a file here or" }),
67
+ /* @__PURE__ */ jsxRuntime.jsx(core.FileDropZoneTrigger, { accept: ".csv,text/csv", onChange: onTriggerChange, children: "BROWSE FILES" })
68
+ ]
69
+ }
70
+ ),
71
+ children
72
+ ] });
73
+ const actions = /* @__PURE__ */ jsxRuntime.jsxs(core.DialogActions, { children: [
74
+ /* @__PURE__ */ jsxRuntime.jsx(
75
+ core.Button,
76
+ {
77
+ appearance: "solid",
78
+ disabled: isImporting,
79
+ sentiment: "negative",
80
+ onClick: handleCancel,
81
+ children: "Cancel"
82
+ }
83
+ ),
84
+ /* @__PURE__ */ jsxRuntime.jsx(
85
+ core.Button,
86
+ {
87
+ disabled: !canImport,
88
+ appearance: "solid",
89
+ sentiment: "accented",
90
+ onClick: handleImport,
91
+ children: isProcessingFile ? "Validating..." : isImporting ? "Importing..." : "Import"
92
+ }
93
+ )
94
+ ] });
95
+ if (embedded) {
96
+ return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
97
+ content,
98
+ actions
99
+ ] });
100
+ }
49
101
  return /* @__PURE__ */ jsxRuntime.jsxs(core.Dialog, { open: dialogOpen, children: [
50
102
  /* @__PURE__ */ jsxRuntime.jsx(core.DialogHeader, { header: dialogTitle }),
51
- /* @__PURE__ */ jsxRuntime.jsx(core.DialogContent, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: classBase, children: [
52
- /* @__PURE__ */ jsxRuntime.jsxs(
53
- core.FileDropZone,
54
- {
55
- className: `${classBase}-dropZone`,
56
- disabled: schema === void 0 || isProcessingFile || isImporting,
57
- onDrop,
58
- status: validation && validation.errors.length > 0 ? "error" : void 0,
59
- children: [
60
- /* @__PURE__ */ jsxRuntime.jsx(core.FileDropZoneIcon, {}),
61
- validation && validation.errors.length > 0 ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
62
- /* @__PURE__ */ jsxRuntime.jsx("div", { children: "Your file contains errors" }),
63
- /* @__PURE__ */ jsxRuntime.jsx("div", { children: " Please rectify and reupload" })
64
- ] }) : /* @__PURE__ */ jsxRuntime.jsx("div", { children: "Drop a file here or" }),
65
- /* @__PURE__ */ jsxRuntime.jsx(
66
- core.FileDropZoneTrigger,
67
- {
68
- accept: ".csv,text/csv",
69
- onChange: onTriggerChange,
70
- children: "BROWSE FILES"
71
- }
72
- )
73
- ]
74
- }
75
- ),
76
- children
77
- ] }) }),
78
- /* @__PURE__ */ jsxRuntime.jsxs(core.DialogActions, { children: [
79
- /* @__PURE__ */ jsxRuntime.jsx(core.Button, { appearance: "solid", sentiment: "negative", onClick: handleCancel, children: "Cancel" }),
80
- /* @__PURE__ */ jsxRuntime.jsx(
81
- core.Button,
82
- {
83
- disabled: !canImport,
84
- appearance: "solid",
85
- sentiment: "accented",
86
- onClick: handleImport,
87
- children: isProcessingFile ? "Validating..." : isImporting ? "Importing..." : "Import"
88
- }
89
- )
90
- ] })
103
+ /* @__PURE__ */ jsxRuntime.jsx(core.DialogContent, { children: content }),
104
+ actions
91
105
  ] });
92
106
  };
93
107
 
@@ -1 +1 @@
1
- {"version":3,"file":"CsvUpload.js","sources":["../../../../../../../packages/vuu-table-extras/src/csv-upload/CsvUpload.tsx"],"sourcesContent":["import {\n Button,\n Dialog,\n DialogActions,\n DialogContent,\n DialogHeader,\n FileDropZone,\n FileDropZoneIcon,\n FileDropZoneTrigger,\n} from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { type ReactNode, useCallback, useState } from \"react\";\nimport type { DataSource } from \"@vuu-ui/vuu-data-types\";\nimport type { VuuTable } from \"@vuu-ui/vuu-protocol-types\";\nimport type { CsvParseError, CsvParseOptions } from \"./parse/csv-parse\";\nimport type { CsvValidationStructuredError } from \"./parse/csv-schema-validation\";\nimport type { CsvUploadTableData } from \"./parse/csv-upload-utils\";\nimport { useCsvUpload } from \"./useCsvUpload\";\nimport css from \"./CsvUpload.css\";\n\nexport type CsvUploadImportedResult = {\n rpcResult: unknown;\n tableData: CsvUploadTableData;\n};\n\nexport type CsvUploadErrors = {\n schemaError?: CsvUploadError;\n validationError?: CsvUploadError;\n importError?: CsvUploadError;\n};\n\nexport type CsvUploadError = {\n message: string;\n parseError?: CsvParseError;\n validationError?: CsvValidationStructuredError;\n source: \"schema\" | \"validation\" | \"import\";\n};\n\nexport type CsvUploadErrorResult = {\n errors: CsvUploadErrors;\n};\n\nexport type CsvUploadSessionTable = VuuTable;\n\nexport type CsvUploadSessionEndReason = \"saved\" | \"discarded\" | \"failed\";\n\nexport type CsvUploadSessionEndResult = {\n reason: CsvUploadSessionEndReason;\n sessionTable?: CsvUploadSessionTable;\n};\n\nexport type CsvUploadPhase =\n | \"idle\"\n | \"processing\"\n | \"preview-ready\"\n | \"importing\"\n | \"imported\"\n | \"failed\";\n\nexport interface CsvUploadProps {\n children?: ReactNode;\n dataSource: DataSource;\n onImportSessionStarted?: (dataSource: DataSource) => void;\n onImportSessionEnded?: (result: CsvUploadSessionEndResult) => void;\n onError?: (result: CsvUploadErrorResult | undefined) => void;\n onImported?: (result: CsvUploadImportedResult) => void;\n onProcessingStarted?: () => void;\n dialogTitle?: string;\n maxRows?: number;\n onCancel?: () => void;\n onClose?: () => void;\n open?: boolean;\n parseOptions?: CsvParseOptions;\n}\n\nconst classBase = \"vuuCsvUpload\";\n\nexport const CsvUpload = (props: CsvUploadProps) => {\n const {\n children,\n dialogTitle = \"Import CSV\",\n onCancel,\n onClose,\n open,\n } = props;\n const isControlledOpen = open !== undefined;\n const [internalOpen, setInternalOpen] = useState(open ?? true);\n\n const handleCancel = useCallback(() => {\n if (!isControlledOpen) {\n setInternalOpen(false);\n }\n onCancel?.();\n }, [isControlledOpen, onCancel]);\n\n const dialogOpen = isControlledOpen ? open : internalOpen;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"vuu-csv-upload\",\n css,\n window: targetWindow,\n });\n\n const {\n canImport,\n isProcessingFile,\n isImporting,\n importData,\n onDrop,\n onTriggerChange,\n schema,\n validation,\n } = useCsvUpload(props);\n\n const handleImport = useCallback(async () => {\n await importData();\n onClose?.();\n }, [importData, onClose]);\n\n return (\n <Dialog open={dialogOpen}>\n <DialogHeader header={dialogTitle} />\n <DialogContent>\n <div className={classBase}>\n <FileDropZone\n className={`${classBase}-dropZone`}\n disabled={schema === undefined || isProcessingFile || isImporting}\n onDrop={onDrop}\n status={\n validation && validation.errors.length > 0 ? \"error\" : undefined\n }\n >\n <FileDropZoneIcon />\n {validation && validation.errors.length > 0 ? (\n <>\n <div>Your file contains errors</div>\n <div> Please rectify and reupload</div>\n </>\n ) : (\n <div>Drop a file here or</div>\n )}\n <FileDropZoneTrigger\n accept=\".csv,text/csv\"\n onChange={onTriggerChange}\n >\n BROWSE FILES\n </FileDropZoneTrigger>\n </FileDropZone>\n {children}\n </div>\n </DialogContent>\n <DialogActions>\n <Button appearance=\"solid\" sentiment=\"negative\" onClick={handleCancel}>\n Cancel\n </Button>\n <Button\n disabled={!canImport}\n appearance=\"solid\"\n sentiment=\"accented\"\n onClick={handleImport}\n >\n {isProcessingFile\n ? \"Validating...\"\n : isImporting\n ? \"Importing...\"\n : \"Import\"}\n </Button>\n </DialogActions>\n </Dialog>\n );\n};\n"],"names":["useState","useCallback","useWindow","useComponentCssInjection","css","useCsvUpload","jsxs","Dialog","jsx","DialogHeader","DialogContent","FileDropZone","FileDropZoneIcon","Fragment","FileDropZoneTrigger","DialogActions","Button"],"mappings":";;;;;;;;;;AA4EA,MAAM,SAAY,GAAA,cAAA;AAEL,MAAA,SAAA,GAAY,CAAC,KAA0B,KAAA;AAClD,EAAM,MAAA;AAAA,IACJ,QAAA;AAAA,IACA,WAAc,GAAA,YAAA;AAAA,IACd,QAAA;AAAA,IACA,OAAA;AAAA,IACA;AAAA,GACE,GAAA,KAAA;AACJ,EAAA,MAAM,mBAAmB,IAAS,KAAA,KAAA,CAAA;AAClC,EAAA,MAAM,CAAC,YAAc,EAAA,eAAe,CAAI,GAAAA,cAAA,CAAS,QAAQ,IAAI,CAAA;AAE7D,EAAM,MAAA,YAAA,GAAeC,kBAAY,MAAM;AACrC,IAAA,IAAI,CAAC,gBAAkB,EAAA;AACrB,MAAA,eAAA,CAAgB,KAAK,CAAA;AAAA;AAEvB,IAAW,QAAA,IAAA;AAAA,GACV,EAAA,CAAC,gBAAkB,EAAA,QAAQ,CAAC,CAAA;AAE/B,EAAM,MAAA,UAAA,GAAa,mBAAmB,IAAO,GAAA,YAAA;AAE7C,EAAA,MAAM,eAAeC,gBAAU,EAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,gBAAA;AAAA,SACRC,WAAA;AAAA,IACA,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EAAM,MAAA;AAAA,IACJ,SAAA;AAAA,IACA,gBAAA;AAAA,IACA,WAAA;AAAA,IACA,UAAA;AAAA,IACA,MAAA;AAAA,IACA,eAAA;AAAA,IACA,MAAA;AAAA,IACA;AAAA,GACF,GAAIC,0BAAa,KAAK,CAAA;AAEtB,EAAM,MAAA,YAAA,GAAeJ,kBAAY,YAAY;AAC3C,IAAA,MAAM,UAAW,EAAA;AACjB,IAAU,OAAA,IAAA;AAAA,GACT,EAAA,CAAC,UAAY,EAAA,OAAO,CAAC,CAAA;AAExB,EACE,uBAAAK,eAAA,CAACC,WAAO,EAAA,EAAA,IAAA,EAAM,UACZ,EAAA,QAAA,EAAA;AAAA,oBAACC,cAAA,CAAAC,iBAAA,EAAA,EAAa,QAAQ,WAAa,EAAA,CAAA;AAAA,oBAClCD,cAAA,CAAAE,kBAAA,EAAA,EACC,QAAC,kBAAAJ,eAAA,CAAA,KAAA,EAAA,EAAI,WAAW,SACd,EAAA,QAAA,EAAA;AAAA,sBAAAA,eAAA;AAAA,QAACK,iBAAA;AAAA,QAAA;AAAA,UACC,SAAA,EAAW,GAAG,SAAS,CAAA,SAAA,CAAA;AAAA,UACvB,QAAA,EAAU,MAAW,KAAA,KAAA,CAAA,IAAa,gBAAoB,IAAA,WAAA;AAAA,UACtD,MAAA;AAAA,UACA,QACE,UAAc,IAAA,UAAA,CAAW,MAAO,CAAA,MAAA,GAAS,IAAI,OAAU,GAAA,KAAA,CAAA;AAAA,UAGzD,QAAA,EAAA;AAAA,4BAAAH,cAAA,CAACI,qBAAiB,EAAA,EAAA,CAAA;AAAA,YACjB,UAAc,IAAA,UAAA,CAAW,MAAO,CAAA,MAAA,GAAS,oBAEtCN,eAAA,CAAAO,mBAAA,EAAA,EAAA,QAAA,EAAA;AAAA,8BAAAL,cAAA,CAAC,SAAI,QAAyB,EAAA,2BAAA,EAAA,CAAA;AAAA,8BAC9BA,cAAA,CAAC,SAAI,QAA4B,EAAA,8BAAA,EAAA;AAAA,aACnC,EAAA,CAAA,mBAECA,cAAA,CAAA,KAAA,EAAA,EAAI,QAAmB,EAAA,qBAAA,EAAA,CAAA;AAAA,4BAE1BA,cAAA;AAAA,cAACM,wBAAA;AAAA,cAAA;AAAA,gBACC,MAAO,EAAA,eAAA;AAAA,gBACP,QAAU,EAAA,eAAA;AAAA,gBACX,QAAA,EAAA;AAAA;AAAA;AAED;AAAA;AAAA,OACF;AAAA,MACC;AAAA,KAAA,EACH,CACF,EAAA,CAAA;AAAA,oCACCC,kBACC,EAAA,EAAA,QAAA,EAAA;AAAA,sBAAAP,cAAA,CAACQ,eAAO,UAAW,EAAA,OAAA,EAAQ,WAAU,UAAW,EAAA,OAAA,EAAS,cAAc,QAEvE,EAAA,QAAA,EAAA,CAAA;AAAA,sBACAR,cAAA;AAAA,QAACQ,WAAA;AAAA,QAAA;AAAA,UACC,UAAU,CAAC,SAAA;AAAA,UACX,UAAW,EAAA,OAAA;AAAA,UACX,SAAU,EAAA,UAAA;AAAA,UACV,OAAS,EAAA,YAAA;AAAA,UAER,QAAA,EAAA,gBAAA,GACG,eACA,GAAA,WAAA,GACE,cACA,GAAA;AAAA;AAAA;AACR,KACF,EAAA;AAAA,GACF,EAAA,CAAA;AAEJ;;;;"}
1
+ {"version":3,"file":"CsvUpload.js","sources":["../../../../../../../packages/vuu-table-extras/src/csv-upload/CsvUpload.tsx"],"sourcesContent":["import {\n Button,\n Dialog,\n DialogActions,\n DialogContent,\n DialogHeader,\n FileDropZone,\n FileDropZoneIcon,\n FileDropZoneTrigger,\n} from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { type ReactNode, useCallback, useState } from \"react\";\nimport type { DataSource } from \"@vuu-ui/vuu-data-types\";\nimport type { EditSession } from \"@vuu-ui/vuu-data-editing\";\nimport type { VuuTable } from \"@vuu-ui/vuu-protocol-types\";\nimport type { CsvParseError, CsvParseOptions } from \"./parse/csv-parse\";\nimport type { CsvValidationStructuredError } from \"./parse/csv-schema-validation\";\nimport type { CsvUploadTableData } from \"./parse/csv-upload-utils\";\nimport { useCsvUpload } from \"./useCsvUpload\";\nimport css from \"./CsvUpload.css\";\n\nexport type CsvUploadImportedResult = {\n tableData: CsvUploadTableData;\n};\n\nexport type CsvUploadPreviewResult = {\n dataSource: DataSource;\n editSession: EditSession;\n tableData: CsvUploadTableData;\n};\n\nexport type CsvUploadErrors = {\n schemaError?: CsvUploadError;\n validationError?: CsvUploadError;\n importError?: CsvUploadError;\n};\n\nexport type CsvUploadError = {\n message: string;\n parseError?: CsvParseError;\n validationError?: CsvValidationStructuredError;\n source: \"schema\" | \"validation\" | \"import\";\n};\n\nexport type CsvUploadErrorResult = {\n errors: CsvUploadErrors;\n};\n\nexport type CsvUploadSessionTable = VuuTable;\n\nexport type CsvUploadSessionEndReason = \"saved\" | \"discarded\" | \"failed\";\n\nexport type CsvUploadSessionEndResult = {\n reason: CsvUploadSessionEndReason;\n sessionTable?: CsvUploadSessionTable;\n};\n\nexport type CsvUploadPhase =\n | \"idle\"\n | \"processing\"\n | \"preview-ready\"\n | \"importing\"\n | \"imported\"\n | \"failed\";\n\nexport interface CsvUploadProps {\n children?: ReactNode;\n dataSource: DataSource;\n embedded?: boolean;\n onImportSessionStarted?: (dataSource: DataSource) => void;\n onImportSessionEnded?: (result: CsvUploadSessionEndResult) => void;\n onError?: (result: CsvUploadErrorResult | undefined) => void;\n onImported?: (result: CsvUploadImportedResult) => void;\n onPreview?: (result: CsvUploadPreviewResult) => void;\n onProcessingStarted?: () => void;\n dialogTitle?: string;\n maxRows?: number;\n onCancel?: () => void;\n onClose?: () => void;\n open?: boolean;\n parseOptions?: CsvParseOptions;\n importMode?: \"direct\" | \"preview\";\n}\n\nconst classBase = \"vuuCsvUpload\";\n\nexport const CsvUpload = (props: CsvUploadProps) => {\n const {\n children,\n dialogTitle = \"Import CSV\",\n embedded = false,\n onCancel,\n onClose,\n open,\n } = props;\n const isControlledOpen = open !== undefined;\n const [internalOpen, setInternalOpen] = useState(open ?? true);\n\n const dialogOpen = isControlledOpen ? open : internalOpen;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"vuu-csv-upload\",\n css,\n window: targetWindow,\n });\n\n const {\n canImport,\n cancelImport,\n isProcessingFile,\n isImporting,\n importData,\n onDrop,\n onTriggerChange,\n schema,\n validation,\n } = useCsvUpload(props);\n\n const handleCancel = useCallback(async () => {\n await cancelImport();\n if (!isControlledOpen) {\n setInternalOpen(false);\n }\n onCancel?.();\n }, [cancelImport, isControlledOpen, onCancel]);\n\n const handleImport = useCallback(async () => {\n if (await importData()) {\n onClose?.();\n }\n }, [importData, onClose]);\n\n const content = (\n <div className={classBase}>\n <FileDropZone\n className={`${classBase}-dropZone`}\n disabled={schema === undefined || isProcessingFile || isImporting}\n onDrop={onDrop}\n status={\n validation && validation.errors.length > 0 ? \"error\" : undefined\n }\n >\n <FileDropZoneIcon />\n {validation && validation.errors.length > 0 ? (\n <>\n <div>Your file contains errors</div>\n <div> Please rectify and reupload</div>\n </>\n ) : (\n <div>Drop a file here or</div>\n )}\n <FileDropZoneTrigger accept=\".csv,text/csv\" onChange={onTriggerChange}>\n BROWSE FILES\n </FileDropZoneTrigger>\n </FileDropZone>\n {children}\n </div>\n );\n\n const actions = (\n <DialogActions>\n <Button\n appearance=\"solid\"\n disabled={isImporting}\n sentiment=\"negative\"\n onClick={handleCancel}\n >\n Cancel\n </Button>\n <Button\n disabled={!canImport}\n appearance=\"solid\"\n sentiment=\"accented\"\n onClick={handleImport}\n >\n {isProcessingFile\n ? \"Validating...\"\n : isImporting\n ? \"Importing...\"\n : \"Import\"}\n </Button>\n </DialogActions>\n );\n\n if (embedded) {\n return (\n <>\n {content}\n {actions}\n </>\n );\n }\n\n return (\n <Dialog open={dialogOpen}>\n <DialogHeader header={dialogTitle} />\n <DialogContent>{content}</DialogContent>\n {actions}\n </Dialog>\n );\n};\n"],"names":["useState","useWindow","useComponentCssInjection","css","useCsvUpload","useCallback","jsxs","FileDropZone","jsx","FileDropZoneIcon","Fragment","FileDropZoneTrigger","DialogActions","Button","Dialog","DialogHeader","DialogContent"],"mappings":"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"}
@@ -0,0 +1,6 @@
1
+ 'use strict';
2
+
3
+ var css = ".vuuDataUploadPreview {\n display: flex;\n flex-direction: column;\n height: 420px;\n width: 900px;\n\n .vuuDataUploadPreview-content {\n flex: 1 1 auto;\n }\n}\n";
4
+
5
+ module.exports = css;
6
+ //# sourceMappingURL=DataUploadPreview.css.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"DataUploadPreview.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}
@@ -0,0 +1,118 @@
1
+ 'use strict';
2
+
3
+ var jsxRuntime = require('react/jsx-runtime');
4
+ var styles = require('@salt-ds/styles');
5
+ var window = require('@salt-ds/window');
6
+ var vuuDataEditing = require('@vuu-ui/vuu-data-editing');
7
+ var vuuTable = require('@vuu-ui/vuu-table');
8
+ var cx = require('clsx');
9
+ var react = require('react');
10
+ var TableFooter = require('../../table-footer/TableFooter.js');
11
+ var DataUploadPreview$1 = require('./DataUploadPreview.css.js');
12
+ var useDataUploadPreview = require('./useDataUploadPreview.js');
13
+
14
+ const classBase = "vuuDataUploadPreview";
15
+ const undoColumn = {
16
+ name: "undo",
17
+ source: "client",
18
+ width: 80,
19
+ type: {
20
+ name: "string",
21
+ renderer: {
22
+ name: vuuDataEditing.UNDO_CELL_RENDERER
23
+ }
24
+ }
25
+ };
26
+ const rowClassNameGenerators = [vuuDataEditing.EDIT_ACTION_ROW_CLASS_NAME_GENERATOR];
27
+ const DataUploadPreview = ({
28
+ className,
29
+ editSession,
30
+ onClose,
31
+ saveLabel = "Submit",
32
+ tableSchema,
33
+ ...htmlAttributes
34
+ }) => {
35
+ const dataSource = react.useMemo(
36
+ () => useDataUploadPreview.getSessionDataSource(editSession),
37
+ [editSession]
38
+ );
39
+ const targetWindow = window.useWindow();
40
+ styles.useComponentCssInjection({
41
+ testId: "vuu-data-upload-preview",
42
+ css: DataUploadPreview$1,
43
+ window: targetWindow
44
+ });
45
+ const {
46
+ canCancel,
47
+ canSave,
48
+ hasSelection,
49
+ onCancel,
50
+ onDelete,
51
+ onSave,
52
+ sessionError
53
+ } = useDataUploadPreview.useDataUploadPreview({ dataSource, editSession, onClose });
54
+ const isRowSelectable = react.useCallback(
55
+ (dataRow) => dataRow.vuu_action !== "deleteRow",
56
+ []
57
+ );
58
+ const config = react.useMemo(() => {
59
+ const columns = tableSchema.columns.map(
60
+ (column) => column.name === "vuuMsg" ? {
61
+ ...column,
62
+ editable: false,
63
+ hidden: false,
64
+ label: "Error",
65
+ width: 300
66
+ } : {
67
+ ...column,
68
+ editable: true
69
+ }
70
+ );
71
+ if (!columns.some(({ name }) => name === "vuuMsg")) {
72
+ columns.push({
73
+ editable: false,
74
+ label: "Error",
75
+ name: "vuuMsg",
76
+ serverDataType: "string",
77
+ width: 300
78
+ });
79
+ }
80
+ return {
81
+ columns: columns.concat({ hidden: true, name: "vuu_action" }, undoColumn),
82
+ columnDefaultWidth: 150,
83
+ rowClassNameGenerators,
84
+ rowSeparators: true,
85
+ zebraStripes: true
86
+ };
87
+ }, [tableSchema.columns]);
88
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { ...htmlAttributes, className: cx(classBase, className), children: [
89
+ sessionError ? /* @__PURE__ */ jsxRuntime.jsx("div", { role: "alert", children: sessionError }) : null,
90
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: `${classBase}-content`, children: /* @__PURE__ */ jsxRuntime.jsx(vuuDataEditing.DataEditingProvider, { editSession, children: /* @__PURE__ */ jsxRuntime.jsx(
91
+ vuuTable.Table,
92
+ {
93
+ config,
94
+ "data-viewport": dataSource.viewport,
95
+ dataSource,
96
+ isRowSelectable,
97
+ renderBufferSize: 10,
98
+ selectionModel: "checkbox"
99
+ }
100
+ ) }) }),
101
+ /* @__PURE__ */ jsxRuntime.jsx(TableFooter.TableFooter, { children: /* @__PURE__ */ jsxRuntime.jsx(TableFooter.TableFooterTray, { position: "center", children: /* @__PURE__ */ jsxRuntime.jsx(
102
+ vuuDataEditing.EditButtons,
103
+ {
104
+ canCancel,
105
+ canSave,
106
+ editSession,
107
+ hasSelection,
108
+ onCancel,
109
+ onDelete,
110
+ onSave,
111
+ saveLabel
112
+ }
113
+ ) }) })
114
+ ] });
115
+ };
116
+
117
+ exports.DataUploadPreview = DataUploadPreview;
118
+ //# sourceMappingURL=DataUploadPreview.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"DataUploadPreview.js","sources":["../../../../../../../../packages/vuu-table-extras/src/csv-upload/data-upload-preview/DataUploadPreview.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport type { TableSchema } from \"@vuu-ui/vuu-data-types\";\nimport {\n DataEditingProvider,\n EDIT_ACTION_ROW_CLASS_NAME_GENERATOR,\n EditButtons,\n type EditSession,\n UNDO_CELL_RENDERER,\n} from \"@vuu-ui/vuu-data-editing\";\nimport { Table } from \"@vuu-ui/vuu-table\";\nimport type {\n ColumnDescriptor,\n DataRow,\n TableConfig,\n} from \"@vuu-ui/vuu-table-types\";\nimport cx from \"clsx\";\nimport type { HTMLAttributes } from \"react\";\nimport { useCallback, useMemo } from \"react\";\nimport { TableFooter, TableFooterTray } from \"../../table-footer/TableFooter\";\nimport css from \"./DataUploadPreview.css\";\nimport {\n getSessionDataSource,\n useDataUploadPreview,\n} from \"./useDataUploadPreview\";\n\nconst classBase = \"vuuDataUploadPreview\";\n\nconst undoColumn: ColumnDescriptor = {\n name: \"undo\",\n source: \"client\",\n width: 80,\n type: {\n name: \"string\",\n renderer: {\n name: UNDO_CELL_RENDERER,\n },\n },\n};\n\nconst rowClassNameGenerators = [EDIT_ACTION_ROW_CLASS_NAME_GENERATOR];\n\nexport interface DataUploadPreviewProps\n extends Omit<HTMLAttributes<HTMLDivElement>, \"onSelect\"> {\n editSession: EditSession;\n onClose: () => void;\n saveLabel?: string;\n tableSchema: TableSchema;\n}\n\nexport const DataUploadPreview = ({\n className,\n editSession,\n onClose,\n saveLabel = \"Submit\",\n tableSchema,\n ...htmlAttributes\n}: DataUploadPreviewProps) => {\n const dataSource = useMemo(\n () => getSessionDataSource(editSession),\n [editSession],\n );\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"vuu-data-upload-preview\",\n css,\n window: targetWindow,\n });\n\n const {\n canCancel,\n canSave,\n hasSelection,\n onCancel,\n onDelete,\n onSave,\n sessionError,\n } = useDataUploadPreview({ dataSource, editSession, onClose });\n\n const isRowSelectable = useCallback(\n (dataRow: DataRow) => dataRow.vuu_action !== \"deleteRow\",\n [],\n );\n const config = useMemo<TableConfig>(() => {\n const columns = tableSchema.columns.map<ColumnDescriptor>((column) =>\n column.name === \"vuuMsg\"\n ? {\n ...column,\n editable: false,\n hidden: false,\n label: \"Error\",\n width: 300,\n }\n : {\n ...column,\n editable: true,\n },\n );\n if (!columns.some(({ name }) => name === \"vuuMsg\")) {\n columns.push({\n editable: false,\n label: \"Error\",\n name: \"vuuMsg\",\n serverDataType: \"string\",\n width: 300,\n });\n }\n\n return {\n columns: columns.concat({ hidden: true, name: \"vuu_action\" }, undoColumn),\n columnDefaultWidth: 150,\n rowClassNameGenerators,\n rowSeparators: true,\n zebraStripes: true,\n };\n }, [tableSchema.columns]);\n\n return (\n <div {...htmlAttributes} className={cx(classBase, className)}>\n {sessionError ? <div role=\"alert\">{sessionError}</div> : null}\n <div className={`${classBase}-content`}>\n <DataEditingProvider editSession={editSession}>\n <Table\n config={config}\n data-viewport={dataSource.viewport}\n dataSource={dataSource}\n isRowSelectable={isRowSelectable}\n renderBufferSize={10}\n selectionModel=\"checkbox\"\n />\n </DataEditingProvider>\n </div>\n <TableFooter>\n <TableFooterTray position=\"center\">\n <EditButtons\n canCancel={canCancel}\n canSave={canSave}\n editSession={editSession}\n hasSelection={hasSelection}\n onCancel={onCancel}\n onDelete={onDelete}\n onSave={onSave}\n saveLabel={saveLabel}\n />\n </TableFooterTray>\n </TableFooter>\n </div>\n );\n};\n"],"names":["UNDO_CELL_RENDERER","EDIT_ACTION_ROW_CLASS_NAME_GENERATOR","useMemo","getSessionDataSource","useWindow","useComponentCssInjection","css","useDataUploadPreview","useCallback","jsxs","jsx","DataEditingProvider","Table","TableFooter","TableFooterTray","EditButtons"],"mappings":"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"}
@@ -0,0 +1,76 @@
1
+ 'use strict';
2
+
3
+ var react = require('react');
4
+
5
+ const getSessionDataSource = (editSession) => {
6
+ const dataSource = editSession.sessionDataSource;
7
+ if (!dataSource) {
8
+ throw new Error("[DataUploadPreview] requires an active edit session");
9
+ }
10
+ return dataSource;
11
+ };
12
+ const useDataUploadPreview = ({
13
+ dataSource,
14
+ editSession,
15
+ onClose
16
+ }) => {
17
+ const [editState, setEditState] = react.useState(editSession.editState);
18
+ const [lifecycle, setLifecycle] = react.useState(
19
+ editSession.lifecycle
20
+ );
21
+ const [selectionCount, setSelectionCount] = react.useState(0);
22
+ const [sessionError, setSessionError] = react.useState();
23
+ const endSession = react.useCallback(
24
+ async (save, force = false) => {
25
+ try {
26
+ await editSession.end(save, force);
27
+ onClose();
28
+ } catch (error) {
29
+ setSessionError(
30
+ error instanceof Error ? error.message : "Unable to end edit session"
31
+ );
32
+ }
33
+ },
34
+ [editSession, onClose]
35
+ );
36
+ const onCancel = react.useCallback(() => endSession(false), [endSession]);
37
+ const onDelete = react.useCallback(
38
+ () => editSession.deleteSelectedRows(),
39
+ [editSession]
40
+ );
41
+ const onSave = react.useCallback(
42
+ (force = false) => endSession(true, force),
43
+ [endSession]
44
+ );
45
+ react.useEffect(() => {
46
+ const handleEditState = (nextEditState) => {
47
+ setEditState(nextEditState);
48
+ };
49
+ const handleLifecycle = (nextLifecycle) => {
50
+ setLifecycle(nextLifecycle);
51
+ };
52
+ editSession.on("editState", handleEditState);
53
+ editSession.on("lifecycle", handleLifecycle);
54
+ dataSource.on("row-selection", setSelectionCount);
55
+ return () => {
56
+ editSession.removeListener("editState", handleEditState);
57
+ editSession.removeListener("lifecycle", handleLifecycle);
58
+ dataSource.removeListener("row-selection", setSelectionCount);
59
+ };
60
+ }, [dataSource, editSession]);
61
+ const canCancel = lifecycle.status === "active" || lifecycle.status === "error" && lifecycle.operation === "end";
62
+ const canSave = canCancel && (editState === "dirty" || editState === "stale") && editSession.invalidCount === 0;
63
+ return {
64
+ canCancel,
65
+ canSave,
66
+ hasSelection: selectionCount > 0,
67
+ onCancel,
68
+ onDelete,
69
+ onSave,
70
+ sessionError
71
+ };
72
+ };
73
+
74
+ exports.getSessionDataSource = getSessionDataSource;
75
+ exports.useDataUploadPreview = useDataUploadPreview;
76
+ //# sourceMappingURL=useDataUploadPreview.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useDataUploadPreview.js","sources":["../../../../../../../../packages/vuu-table-extras/src/csv-upload/data-upload-preview/useDataUploadPreview.ts"],"sourcesContent":["import type { DataSource } from \"@vuu-ui/vuu-data-types\";\nimport type {\n EditLifecycle,\n EditSession,\n EditState,\n} from \"@vuu-ui/vuu-data-editing\";\nimport { useCallback, useEffect, useState } from \"react\";\n\nexport interface UseDataUploadPreviewProps {\n dataSource: DataSource;\n editSession: EditSession;\n onClose: () => void;\n}\n\nexport const getSessionDataSource = (editSession: EditSession): DataSource => {\n const dataSource = editSession.sessionDataSource;\n if (!dataSource) {\n throw new Error(\"[DataUploadPreview] requires an active edit session\");\n }\n return dataSource;\n};\n\nexport const useDataUploadPreview = ({\n dataSource,\n editSession,\n onClose,\n}: UseDataUploadPreviewProps) => {\n const [editState, setEditState] = useState<EditState>(editSession.editState);\n const [lifecycle, setLifecycle] = useState<EditLifecycle>(\n editSession.lifecycle,\n );\n const [selectionCount, setSelectionCount] = useState(0);\n const [sessionError, setSessionError] = useState<string>();\n\n const endSession = useCallback(\n async (save: boolean, force = false) => {\n try {\n await editSession.end(save, force);\n onClose();\n } catch (error) {\n setSessionError(\n error instanceof Error ? error.message : \"Unable to end edit session\",\n );\n }\n },\n [editSession, onClose],\n );\n\n const onCancel = useCallback(() => endSession(false), [endSession]);\n const onDelete = useCallback(\n () => editSession.deleteSelectedRows(),\n [editSession],\n );\n const onSave = useCallback(\n (force = false) => endSession(true, force),\n [endSession],\n );\n\n useEffect(() => {\n const handleEditState = (nextEditState: EditState) => {\n setEditState(nextEditState);\n };\n const handleLifecycle = (nextLifecycle: EditLifecycle) => {\n setLifecycle(nextLifecycle);\n };\n editSession.on(\"editState\", handleEditState);\n editSession.on(\"lifecycle\", handleLifecycle);\n dataSource.on(\"row-selection\", setSelectionCount);\n return () => {\n editSession.removeListener(\"editState\", handleEditState);\n editSession.removeListener(\"lifecycle\", handleLifecycle);\n dataSource.removeListener(\"row-selection\", setSelectionCount);\n };\n }, [dataSource, editSession]);\n\n const canCancel =\n lifecycle.status === \"active\" ||\n (lifecycle.status === \"error\" && lifecycle.operation === \"end\");\n const canSave =\n canCancel &&\n (editState === \"dirty\" || editState === \"stale\") &&\n editSession.invalidCount === 0;\n\n return {\n canCancel,\n canSave,\n hasSelection: selectionCount > 0,\n onCancel,\n onDelete,\n onSave,\n sessionError,\n };\n};\n"],"names":["useState","useCallback","useEffect"],"mappings":"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"}
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var vuuUtils = require('@vuu-ui/vuu-utils');
3
+ require('@vuu-ui/vuu-utils');
4
4
  var csvConstants = require('./csv-constants.js');
5
5
 
6
6
  const isRecord = (value) => typeof value === "object" && value !== null;
@@ -32,55 +32,12 @@ const toValidationErrorsFromParseRowErrors = (parseError) => {
32
32
  (error) => error.rowNum >= csvConstants.CSV_FIRST_DATA_ROW_NUMBER
33
33
  );
34
34
  };
35
- const normalizeTableData = (value, fallback) => {
36
- const tableData = isRecord(value) && "data" in value ? value.data : value;
37
- if (!isRecord(tableData)) {
38
- return fallback;
39
- }
40
- const columns = tableData.columns;
41
- const rows = tableData.rows;
42
- if (!Array.isArray(columns) || columns.some((column) => typeof column !== "string") || !Array.isArray(rows)) {
43
- return fallback;
44
- }
45
- return {
46
- columns,
47
- rows: rows.map((row) => {
48
- if (Array.isArray(row)) {
49
- return row;
50
- }
51
- if (!isRecord(row)) {
52
- return columns.map(() => "");
53
- }
54
- return columns.map((column) => row[column] ?? "");
55
- })
56
- };
57
- };
58
- const executeBatchRpcCalls = async (items, executor, errorFormatter) => {
59
- const errors = [];
60
- const results = [];
61
- for (const item of items) {
62
- try {
63
- const result = await executor(item);
64
- const rpcResult = result;
65
- if (vuuUtils.isRpcError(rpcResult)) {
66
- errors.push(errorFormatter(item, rpcResult.errorMessage));
67
- } else {
68
- results.push(result);
69
- }
70
- } catch (err) {
71
- errors.push(errorFormatter(item, toErrorMessage(err)));
72
- }
73
- }
74
- return { errors, results };
75
- };
76
35
 
77
36
  exports.buildRowErrorMessage = buildRowErrorMessage;
78
37
  exports.createUploadError = createUploadError;
79
- exports.executeBatchRpcCalls = executeBatchRpcCalls;
80
38
  exports.hasFileParseErrors = hasFileParseErrors;
81
39
  exports.isCsvParseError = isCsvParseError;
82
40
  exports.mergeValidationWithParseErrors = mergeValidationWithParseErrors;
83
- exports.normalizeTableData = normalizeTableData;
84
41
  exports.toErrorMessage = toErrorMessage;
85
42
  exports.toValidationErrorsFromParseRowErrors = toValidationErrorsFromParseRowErrors;
86
43
  //# sourceMappingURL=csv-upload-utils.js.map