@vuu-ui/vuu-table-extras 4.0.0-alpha.1 → 4.0.0-alpha.10

package/src/csv-upload/CsvUpload.js

@@ -1,13 +1,13 @@
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import { Button, Dialog, DialogActions, DialogContent, DialogHeader, FileDropZone, FileDropZoneIcon, FileDropZoneTrigger } from "@salt-ds/core";
+import { Button, Dialog, DialogActions, DialogContent, DialogHeader, FileDropZone, FileDropZoneIcon, FileDropZoneTrigger, Text } from "@salt-ds/core";
 import { useComponentCssInjection } from "@salt-ds/styles";
 import { useWindow } from "@salt-ds/window";
-import { useCallback, useState } from "react";
+import { useCallback, useMemo, useState } from "react";
 import { useCsvUpload } from "./useCsvUpload.js";
 import CsvUpload from "./CsvUpload.css";
 const classBase = "vuuCsvUpload";
 const CsvUpload_CsvUpload = (props)=>{
-    const { children, dialogTitle = "Import CSV", embedded = false, onCancel, onClose, open, renderError } = props;
+    const { children, dialogTitle = "Import CSV", embedded = false, onCancel, onClose, open } = props;
     const isControlledOpen = void 0 !== open;
     const [internalOpen, setInternalOpen] = useState(open ?? true);
     const dialogOpen = isControlledOpen ? open : internalOpen;
@@ -18,6 +18,26 @@ const CsvUpload_CsvUpload = (props)=>{
         window: targetWindow
     });
     const { canImport, cancelImport, isProcessingFile, isImporting, importData, onDrop, onTriggerChange, schema, validation, error } = useCsvUpload(props);
+    const errorsToRender = useMemo(()=>{
+        if (validation?.errors && validation.errors.length > 0) return validation.errors;
+        const parseErrors = error?.errors.schemaError?.parseError?.errors || error?.errors.validationError?.parseError?.errors;
+        if (parseErrors && parseErrors.length > 0) return parseErrors;
+        return [];
+    }, [
+        validation,
+        error
+    ]);
+    const parsedSchemaErrors = useMemo(()=>{
+        const schemaErrorMsg = error?.errors.schemaError?.message || error?.errors.validationError?.message;
+        if (!schemaErrorMsg) return [];
+        const cleanedMsg = schemaErrorMsg.replace(/^CSV validation failed:\s*/, "");
+        return cleanedMsg.split(";").map((item)=>item.trim()).filter((item)=>item.length > 0);
+    }, [
+        error
+    ]);
+    const hasErrors = !!error || validation && validation.errors.length > 0;
+    const isUploaded = canImport || isImporting;
+    const status = hasErrors ? "error" : isUploaded ? "success" : void 0;
     const handleCancel = useCallback(async ()=>{
         await cancelImport();
         if (!isControlledOpen) setInternalOpen(false);
@@ -33,57 +53,101 @@ const CsvUpload_CsvUpload = (props)=>{
         importData,
         onClose
     ]);
-    const content = /*#__PURE__*/ jsxs("div", {
+    const renderErrorsContent = useMemo(()=>{
+        if (error?.errors.importError) return /*#__PURE__*/ jsxs(Fragment, {
+            children: [
+                /*#__PURE__*/ jsx("strong", {
+                    children: "Import failed"
+                }),
+                /*#__PURE__*/ jsx("div", {
+                    className: `${classBase}-errorContainer`,
+                    children: /*#__PURE__*/ jsx("div", {
+                        className: `${classBase}-errorItem ${classBase}-importErrorItem`,
+                        children: error.errors.importError.message
+                    })
+                })
+            ]
+        });
+        if (hasErrors) {
+            const headingText = error ? "Validation failed" : "Your file contains errors";
+            return /*#__PURE__*/ jsxs(Fragment, {
+                children: [
+                    /*#__PURE__*/ jsx("strong", {
+                        children: headingText
+                    }),
+                    /*#__PURE__*/ jsx("div", {
+                        className: `${classBase}-errorContainer`,
+                        children: errorsToRender.length > 0 ? /*#__PURE__*/ jsx("ul", {
+                            className: `${classBase}-errorList`,
+                            children: errorsToRender.map((error, i)=>/*#__PURE__*/ jsxs("li", {
+                                    className: `${classBase}-errorItem`,
+                                    children: [
+                                        error.rowNum > 0 ? `Row ${error.rowNum}: ` : "",
+                                        "*" === error.column ? "" : `${error.column}: `,
+                                        error.message
+                                    ]
+                                }, `${error.column}-${error.message}-${i}`))
+                        }) : parsedSchemaErrors.length > 0 ? /*#__PURE__*/ jsx("ul", {
+                            className: `${classBase}-errorList`,
+                            children: parsedSchemaErrors.map((errMsg)=>/*#__PURE__*/ jsx("li", {
+                                    className: `${classBase}-errorItem`,
+                                    children: errMsg
+                                }, errMsg))
+                        }) : /*#__PURE__*/ jsx("div", {
+                            className: `${classBase}-errorItem ${classBase}-importErrorItem`,
+                            children: error?.errors.schemaError?.message || error?.errors.validationError?.message || "An unexpected error occurred during import"
+                        })
+                    })
+                ]
+            });
+        }
+        return /*#__PURE__*/ jsx("div", {
+            children: "Drop a file here or"
+        });
+    }, [
+        error,
+        hasErrors,
+        errorsToRender,
+        parsedSchemaErrors
+    ]);
+    const content = /*#__PURE__*/ jsx("div", {
         className: classBase,
-        children: [
-            /*#__PURE__*/ jsxs(FileDropZone, {
-                className: `${classBase}-dropZone`,
-                disabled: void 0 === schema || isProcessingFile || isImporting,
-                onDrop: onDrop,
-                status: validation && validation.errors.length > 0 || error ? "error" : void 0,
+        children: /*#__PURE__*/ jsx(FileDropZone, {
+            className: `${classBase}-dropZone`,
+            disabled: void 0 === schema || isProcessingFile || isImporting,
+            onDrop: onDrop,
+            status: status,
+            children: isUploaded ? /*#__PURE__*/ jsxs(Fragment, {
+                children: [
+                    /*#__PURE__*/ jsx(FileDropZoneIcon, {
+                        status: "success"
+                    }),
+                    /*#__PURE__*/ jsx("strong", {
+                        children: "Upload completed"
+                    })
+                ]
+            }) : /*#__PURE__*/ jsxs(Fragment, {
                 children: [
-                    /*#__PURE__*/ jsx(FileDropZoneIcon, {}),
-                    validation && validation.errors.length > 0 ? /*#__PURE__*/ jsxs(Fragment, {
-                        children: [
-                            /*#__PURE__*/ jsx("div", {
-                                children: "Your file contains errors"
-                            }),
-                            /*#__PURE__*/ jsx("ul", {
-                                className: `${classBase}-errorList`,
-                                children: validation.errors.filter((e)=>e.column in validation.errorMap.fileErrors).map((error, i)=>/*#__PURE__*/ jsx("li", {
-                                        className: `${classBase}-errorItem`,
-                                        children: error.message
-                                    }, `${error.column}-${error.message}-${i}`))
-                            }),
-                            /*#__PURE__*/ jsx("div", {
-                                children: "Please rectify and reupload"
-                            })
-                        ]
-                    }) : /*#__PURE__*/ jsx("div", {
-                        children: "Drop a file here or"
+                    /*#__PURE__*/ jsx(FileDropZoneIcon, {
+                        status: hasErrors ? "error" : void 0
+                    }),
+                    renderErrorsContent,
+                    hasErrors && /*#__PURE__*/ jsx(Text, {
+                        className: `${classBase}-rectifyPrompt`,
+                        children: "Please rectify and reupload"
                     }),
                     /*#__PURE__*/ jsx(FileDropZoneTrigger, {
                         accept: ".csv,text/csv",
                         onChange: onTriggerChange,
                         children: "BROWSE FILES"
-                    })
-                ]
-            }),
-            error && (renderError ? renderError(error) : /*#__PURE__*/ jsxs("div", {
-                className: `${classBase}-errors`,
-                children: [
-                    /*#__PURE__*/ jsx("div", {
-                        children: /*#__PURE__*/ jsx("strong", {
-                            children: "Import Error:"
-                        })
                     }),
-                    /*#__PURE__*/ jsx("div", {
-                        children: error.errors.importError?.message || error.errors.schemaError?.message || error.errors.validationError?.message || "An unexpected error occurred during import."
-                    })
+                    /*#__PURE__*/ jsx(Text, {
+                        children: "Only .csv files"
+                    }),
+                    children
                 ]
-            })),
-            children
-        ]
+            })
+        })
     });
     const actions = /*#__PURE__*/ jsxs(DialogActions, {
         children: [

package/src/csv-upload/parse/csv-constants.js

@@ -1,4 +1,4 @@
-const CSV_HEADER_ROW_NUMBER = 1;
-const CSV_FIRST_DATA_ROW_NUMBER = 2;
+const CSV_HEADER_ROW_NUMBER = 0;
+const CSV_FIRST_DATA_ROW_NUMBER = 1;
 const MAX_ROWS_IN_CSV = 10000;
 export { CSV_FIRST_DATA_ROW_NUMBER, CSV_HEADER_ROW_NUMBER, MAX_ROWS_IN_CSV };

package/src/csv-upload/parse/csv-errors.js

@@ -13,8 +13,9 @@ var csv_errors_CsvValidationErrorEnum = /*#__PURE__*/ function(CsvValidationErro
     CsvValidationErrorEnum["MISSING_KEY_COLUMN"] = "MISSING_KEY_COLUMN";
     CsvValidationErrorEnum["UNKNOWN_COLUMN"] = "UNKNOWN_COLUMN";
     CsvValidationErrorEnum["MAX_ROWS_EXCEEDED"] = "MAX_ROWS_EXCEEDED";
-    CsvValidationErrorEnum["EMPTY_NON_STRING_VALUE"] = "EMPTY_NON_STRING_VALUE";
+    CsvValidationErrorEnum["REQUIRED_FIELD_MISSING"] = "REQUIRED_FIELD_MISSING";
     CsvValidationErrorEnum["TYPE_MISMATCH"] = "TYPE_MISMATCH";
+    CsvValidationErrorEnum["CUSTOM_VALIDATION"] = "CUSTOM_VALIDATION";
     return CsvValidationErrorEnum;
 }({});
 const createCsvErrorState = ()=>({

package/src/csv-upload/parse/csv-parse.js

@@ -68,7 +68,7 @@ const parseCsv = (csvText, options)=>{
     }
     const rows = records.slice(1);
     rows.forEach((row, rowIndex)=>{
-        if (row.length !== header.length) addCsvRowError(errorState, rowIndex + CSV_FIRST_DATA_ROW_NUMBER, "*", CsvParseErrorEnum.ROW_COLUMN_COUNT_MISMATCH, "CSV rows must have the same number of columns as the header.", row.join(","));
+        if (row.length !== header.length) addCsvRowError(errorState, rowIndex + CSV_FIRST_DATA_ROW_NUMBER, "*", CsvParseErrorEnum.ROW_COLUMN_COUNT_MISMATCH, "This row has too many or too few columns compared to the header line. Check for extra or missing commas.", row.join(","));
     });
     if (hasCsvErrors(errorState.errorMap)) return withError("CSV rows must have the same number of columns as the header.", errorState.errorMap, errorState.errors, header, rows);
     return {

package/src/csv-upload/parse/csv-schema-validation.js

@@ -4,10 +4,44 @@ import { CSV_FIRST_DATA_ROW_NUMBER, MAX_ROWS_IN_CSV } from "./csv-constants.js";
 const INTERNAL_KEY_COLUMNS = new Set([
     "vuuRowNum"
 ]);
+const getFriendlyTypeName = (type)=>{
+    switch(type){
+        case "int":
+        case "long":
+            return "whole number";
+        case "double":
+        case "number":
+        case "decimal":
+        case "scaleddecimal":
+        case "scaleddecimal2":
+        case "scaleddecimal4":
+        case "scaleddecimal6":
+        case "scaleddecimal8":
+            return "decimal or number";
+        case "time":
+            return "time in 'HH:MM:SS' format";
+        case "epochtimestamp":
+        case "epochtimestampnano":
+        case "date/time":
+            return "date/time";
+        case "char":
+            return "single character";
+        case "boolean":
+            return "boolean (true/false)";
+        case "json":
+            return "JSON value";
+        default:
+            return type;
+    }
+};
+const getFriendlyErrorMessage = (errMessage, rawValue, toType)=>{
+    if (errMessage.includes("is not a valid")) return `'${rawValue}' is not a valid ${getFriendlyTypeName(toType)}`;
+    return errMessage;
+};
 const validateCsvAgainstSchema = (parsed, tableSchema, options)=>{
     const schemaColumns = new Map(tableSchema.columns.map((col)=>[
             col.name,
-            col.serverDataType
+            col
         ]));
     const maxRows = options?.maxRows ?? MAX_ROWS_IN_CSV;
     const errorState = createCsvErrorState();
@@ -20,19 +54,33 @@ const validateCsvAgainstSchema = (parsed, tableSchema, options)=>{
     parsed.rows.forEach((rowValues, rowIndex)=>{
         const rowNum = rowIndex + CSV_FIRST_DATA_ROW_NUMBER;
         const typedRow = {};
+        const rawRow = parsed.header.reduce((acc, headerCol, idx)=>{
+            acc[headerCol] = rowValues[idx] ?? "";
+            return acc;
+        }, {});
         parsed.header.forEach((columnName, columnIndex)=>{
-            const rawValue = rowValues[columnIndex];
-            const schemaType = schemaColumns.get(columnName);
-            if (0 === rawValue.length && "string" !== schemaType) return void addCsvRowError(errorState, rowNum, columnName, CsvValidationErrorEnum.EMPTY_NON_STRING_VALUE, "Empty value is not allowed for non-string columns.", rawValue);
+            const rawValue = rowValues[columnIndex] ?? "";
+            const schemaColumn = schemaColumns.get(columnName);
+            const schemaType = schemaColumn?.serverDataType;
+            const isRequired = schemaColumn?.required === true;
+            if (0 === rawValue.length) {
+                if (isRequired) addCsvRowError(errorState, rowNum, columnName, CsvValidationErrorEnum.REQUIRED_FIELD_MISSING, "This field is required and cannot be left blank", rawValue);
+                return;
+            }
             let value;
             const toType = schemaType ?? "string";
             try {
                 value = getTypedValue(rawValue, toType);
             } catch (err) {
-                addCsvRowError(errorState, rowNum, columnName, CsvValidationErrorEnum.TYPE_MISMATCH, err instanceof Error ? err.message : String(err), rawValue);
+                addCsvRowError(errorState, rowNum, columnName, CsvValidationErrorEnum.TYPE_MISMATCH, getFriendlyErrorMessage(err instanceof Error ? err.message : String(err), rawValue, toType), rawValue);
                 return;
             }
-            if (void 0 === value) return void addCsvRowError(errorState, rowNum, columnName, CsvValidationErrorEnum.TYPE_MISMATCH, `Value '${rawValue}' is not a valid ${toType}`, rawValue);
+            if (void 0 === value) return void addCsvRowError(errorState, rowNum, columnName, CsvValidationErrorEnum.TYPE_MISMATCH, `'${rawValue}' is not a valid ${getFriendlyTypeName(toType)}`, rawValue);
+            const customValidator = options?.validators?.[columnName];
+            if (customValidator) {
+                const validationResult = customValidator(rawValue, columnName, rawRow);
+                if (true !== validationResult) return void addCsvRowError(errorState, rowNum, columnName, CsvValidationErrorEnum.CUSTOM_VALIDATION, "string" == typeof validationResult ? validationResult : `Value '${rawValue}' failed custom validation.`, rawValue);
+            }
             typedRow[columnName] = value;
         });
         typedRows.push(typedRow);

package/src/csv-upload/useCsvUpload.js

@@ -5,7 +5,7 @@ import { parseCsv } from "./parse/csv-parse.js";
 import { validateCsvAgainstSchema } from "./parse/csv-schema-validation.js";
 import { buildRowErrorMessage, createUploadError, hasFileParseErrors, isCsvParseError, mergeValidationWithParseErrors, toErrorMessage } from "./parse/csv-upload-utils.js";
 import { CSV_FIRST_DATA_ROW_NUMBER } from "./parse/csv-constants.js";
-const useCsvUpload = ({ dataSource, importMode = "direct", importSchema, importTable, onImportSessionEnded, onImportSessionStarted, onError, onImported, onPreview, onProcessingStarted, maxRows, parseOptions, rowDefaults })=>{
+const useCsvUpload = ({ dataSource, importMode = "direct", importSchema, importTable, onImportSessionEnded, onImportSessionReady, onError, onImported, onPreview, onProcessingStarted, maxRows, parseOptions, rowDefaults, validators })=>{
     const { getServerAPI } = useData();
     const [validation, setValidation] = useState();
     const [sessionTable, setSessionTable] = useState();
@@ -120,7 +120,7 @@ const useCsvUpload = ({ dataSource, importMode = "direct", importSchema, importT
         try {
             await editSession.end(save);
         } finally{
-            if ("unsubscribed" !== sessionDataSource.status) sessionDataSource.unsubscribe();
+            if ("unsubscribed" !== sessionDataSource.status && "function" == typeof sessionDataSource.unsubscribe) sessionDataSource.unsubscribe();
             setActiveSessionDataSource(void 0);
         }
         onImportSessionEnded?.({
@@ -140,7 +140,7 @@ const useCsvUpload = ({ dataSource, importMode = "direct", importSchema, importT
             if (rowNum < CSV_FIRST_DATA_ROW_NUMBER) continue;
             const existing = vuuMsgByRow.get(rowNum);
             const columnError = `${column}: ${message}`;
-            vuuMsgByRow.set(rowNum, existing ? `${existing}; ${columnError}` : `Row ${rowNum}: ${columnError}`);
+            vuuMsgByRow.set(rowNum, existing ? `${existing}; ${columnError}` : columnError);
         }
         const parsedRowCount = mergedValidation.rows.length;
         const unparsedErrorRows = [
@@ -174,7 +174,7 @@ const useCsvUpload = ({ dataSource, importMode = "direct", importSchema, importT
                 if (isRpcError(result)) throw Error(result.errorMessage);
                 if ("string" == typeof result) throw Error(result);
             } catch (error) {
-                rpcErrors.push(`Row ${rowNum}: ${toErrorMessage(error)}`);
+                rpcErrors.push(`${0 === rowNum ? "Header" : `Row ${rowNum}`}: ${toErrorMessage(error)}`);
             }
         }
         if (rpcErrors.length > 0) throw Error(buildRowErrorMessage("Import failed", rpcErrors));
@@ -187,11 +187,9 @@ const useCsvUpload = ({ dataSource, importMode = "direct", importSchema, importT
         const sessionVuuTable = sessionDataSource?.table;
         if (void 0 === sessionDataSource || void 0 === sessionVuuTable || !isSessionTable(sessionVuuTable)) throw Error("CsvUpload createSessionDataSource returned no session datasource.");
         setActiveSessionDataSource(sessionDataSource);
-        onImportSessionStarted?.(sessionDataSource);
         return sessionDataSource;
     }, [
         editSession,
-        onImportSessionStarted,
         setActiveSessionDataSource
     ]);
     const closePendingEditSession = useCallback(async (save)=>{
@@ -240,17 +238,15 @@ const useCsvUpload = ({ dataSource, importMode = "direct", importSchema, importT
             return;
         }
         const schemaValidation = validateCsvAgainstSchema(parsedCsv, schema, {
-            maxRows
+            maxRows,
+            validators
         });
         if (Object.keys(schemaValidation.errorMap.fileErrors).length > 0) {
             setValidation(schemaValidation);
+            const detailedMessage = `CSV validation failed: ${schemaValidation.errors.map((e)=>"*" === e.column ? e.message : `${e.column}: ${e.message}`).join("; ")}`;
             handleError({
                 errors: {
-                    schemaError: createUploadError("schema", "CSV validation failed.", parsedCsv.error, {
-                        errorMap: schemaValidation.errorMap,
-                        errors: schemaValidation.errors,
-                        message: "CSV validation failed."
-                    })
+                    schemaError: createUploadError("schema", detailedMessage, parsedCsv.error, schemaValidation)
                 }
             });
             return;
@@ -258,10 +254,11 @@ const useCsvUpload = ({ dataSource, importMode = "direct", importSchema, importT
         const mergedValidation = mergeValidationWithParseErrors(schemaValidation, parsedCsv.error);
         setValidation(mergedValidation);
         if (mergedValidation.rows.length > 0) try {
-            await beginEditSession();
+            const sessionDataSource = await beginEditSession();
             if (operationId !== operationIdRef.current) return;
             const rowsAdded = await addAllRows(mergedValidation, operationId);
             if (!rowsAdded) return;
+            onImportSessionReady?.(sessionDataSource);
         } catch (error) {
             if (void 0 !== sessionDataSourceRef.current) await endEditSessionAndNotify(false, "failed");
             else try {
@@ -288,7 +285,9 @@ const useCsvUpload = ({ dataSource, importMode = "direct", importSchema, importT
         dataSource.table,
         table,
         endEditSessionAndNotify,
-        schema
+        schema,
+        validators,
+        onImportSessionReady
     ]);
     const handleFiles = useCallback(async (files)=>{
         const file = files[0];
@@ -331,10 +330,11 @@ const useCsvUpload = ({ dataSource, importMode = "direct", importSchema, importT
     }, [
         handleFiles
     ]);
-    const canImport = useMemo(()=>void 0 !== validation && 0 === validation.errors.length && validation.rows.length > 0 && !isProcessingFile && !isImporting, [
+    const canImport = useMemo(()=>void 0 !== validation && 0 === validation.errors.length && validation.rows.length > 0 && !isProcessingFile && !isImporting && void 0 === error, [
         isImporting,
         isProcessingFile,
-        validation
+        validation,
+        error
     ]);
     const importData = useCallback(async ()=>{
         if (!canImport || void 0 === validation) return false;

package/src/tabbed-table-config-panel/TabbedTableConfigPanel.js

@@ -1,5 +1,5 @@
-import { jsx, jsxs } from "react/jsx-runtime";
-import { Tab, TabBar, TabList, TabPanel, TabTrigger, Tabs } from "@salt-ds/core";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { Button, Tab, TabBar, TabList, TabPanel, TabTrigger, Tabs } from "@salt-ds/core";
 import { useComponentCssInjection } from "@salt-ds/styles";
 import { useWindow } from "@salt-ds/window";
 import clsx from "clsx";
@@ -78,12 +78,21 @@ const TabbedTableConfigPanel_TabbedTableConfigPanel = ({ allowCreateCalculatedCo
                 }),
                 /*#__PURE__*/ jsx(TabPanel, {
                     value: "table-columns",
-                    children: /*#__PURE__*/ jsx(ColumnPicker, {
-                        allowCreateCalculatedColumn: allowCreateCalculatedColumn,
-                        columnModel: columnModel,
-                        onClickCreateCalculatedColumn: onCreateCalculatedColumn,
-                        onSelectionChange: handleSelectionChange,
-                        selected: columns
+                    children: /*#__PURE__*/ jsxs(Fragment, {
+                        children: [
+                            /*#__PURE__*/ jsx(ColumnPicker, {
+                                columnModel: columnModel,
+                                onSelectionChange: handleSelectionChange,
+                                selected: columns
+                            }),
+                            allowCreateCalculatedColumn ? /*#__PURE__*/ jsx("div", {
+                                className: `${classBase}-column-buttons`,
+                                children: /*#__PURE__*/ jsx(Button, {
+                                    onClick: onCreateCalculatedColumn,
+                                    children: "Create calculated column"
+                                })
+                            }) : null
+                        ]
                     })
                 }),
                 /*#__PURE__*/ jsx(TabPanel, {

package/src/tabbed-table-config-panel/useTabbedTableConfigPanel.js

@@ -1,6 +1,6 @@
 import { jsx } from "react/jsx-runtime";
-import { useCallback, useRef } from "react";
 import { useContextPanel } from "@vuu-ui/vuu-ui-controls";
+import { useCallback, useRef } from "react";
 import { TabbedTableConfigPanel } from "./TabbedTableConfigPanel.js";
 const useTabbedTableConfigPanel = ({ allowCreateCalculatedColumn, columnModel, config, onDisplayAttributeChange, vuuTable })=>{
     const showContextPanel = useContextPanel();

package/types/calculated-column/CalculatedColumnPanel.d.ts

@@ -1,6 +1,6 @@
-import { HTMLAttributes } from "react";
-import { ColumnDescriptor } from "@vuu-ui/vuu-table-types";
 import { VuuColumnDataType, VuuTable } from "@vuu-ui/vuu-protocol-types";
+import { ColumnDescriptor } from "@vuu-ui/vuu-table-types";
+import { HTMLAttributes } from "react";
 import { ColumnModel } from "../column-picker/ColumnModel";
 export interface CalculatedColumnPanelProps extends HTMLAttributes<HTMLDivElement> {
     column: ColumnDescriptor;

package/types/column-picker/ColumnModel.d.ts

@@ -58,12 +58,13 @@ export declare class ColumnModel extends EventEmitter<ColumnEvents> {
      * Columns already selected and rendered in Table.
      */
     selectedColumns: readonly ColumnDescriptor[]);
-    get availableColumns(): ColumnDescriptor[];
-    set searchPattern(pattern: string);
-    get searchPattern(): string;
     get selectedColumns(): readonly ColumnDescriptor[];
     setSelectedColumns(selectedColumns: readonly ColumnDescriptor[], source: ColumnChangeSource, changeDescriptor?: SelectedColumnChangeDescriptor): void;
     getColumn(name: string): ColumnDescriptor;
+    /**
+     * Introduced for use by ColumnPicker
+     */
+    addRemoveOrReorderSelectedColumns(newSelectedColumns: readonly ColumnDescriptor[], source: ColumnChangeSource): void;
     addItemToSelectedColumns(name: string, source: ColumnChangeSource): void;
     removeItemFromSelectedColumns(name: string, source: ColumnChangeSource): void;
     reorderSelectedColumns(orderedColumnNames: string[], source: ColumnChangeSource): void;

package/types/column-picker/ColumnPicker.d.ts

@@ -1,10 +1,8 @@
-import { ColumnDescriptor } from "@vuu-ui/vuu-table-types";
-import { HTMLAttributes, MouseEventHandler } from "react";
-import { ListBoxProps } from "@salt-ds/core";
-import { ColumnPickerHookProps } from "./useColumnPicker";
+import type { ListBoxProps } from "@salt-ds/core";
+import type { ColumnDescriptor } from "@vuu-ui/vuu-table-types";
+import { type HTMLAttributes } from "react";
+import { type ColumnPickerHookProps } from "./useColumnPicker";
 export declare const classBaseListItem = "vuuColumnPickerListItem";
 export interface ColumnPickerProps extends ColumnPickerHookProps, Pick<ListBoxProps<ColumnDescriptor>, "selected" | "onSelectionChange">, HTMLAttributes<HTMLDivElement> {
-    allowCreateCalculatedColumn?: boolean;
-    onClickCreateCalculatedColumn?: MouseEventHandler<HTMLButtonElement>;
 }
 export declare const ColumnPicker: import("react").ForwardRefExoticComponent<ColumnPickerProps & import("react").RefAttributes<HTMLDivElement>>;

package/types/column-picker/useColumnPicker.d.ts

@@ -1,16 +1,13 @@
-import { ColumnDescriptor, TableSelectionModel } from "@vuu-ui/vuu-table-types";
-import { FormEventHandler, MouseEventHandler } from "react";
-import { ColumnModel, SelectedColumnChangeType } from "./ColumnModel";
+import { TableSelectionModel } from "@vuu-ui/vuu-table-types";
+import { ItemDescriptor } from "@vuu-ui/vuu-ui-controls";
+import { ColumnModel } from "./ColumnModel";
 export type ColumnSelectionModel = Extract<TableSelectionModel, "none" | "single">;
-export type SelectedColumnsChangeHandler = (columns: ColumnDescriptor[], changeType: SelectedColumnChangeType) => void;
 export interface ColumnPickerHookProps {
     columnModel: ColumnModel;
 }
 export declare const useColumnPicker: ({ columnModel: model, }: ColumnPickerHookProps) => {
-    availableColumns: ColumnDescriptor[];
-    onAddItemToSelectedList: MouseEventHandler<HTMLButtonElement>;
-    onRemoveItemFromSelectedList: MouseEventHandler<HTMLButtonElement>;
-    onChangeSearchInput: FormEventHandler;
-    searchText: string;
-    selectedColumns: readonly ColumnDescriptor[];
+    allItems: ItemDescriptor[];
+    selectedItems: ItemDescriptor[];
+    oneOrMoreColumnsIsCalculated: boolean;
+    handleSelectedItemsChange: (newSelectedItems: readonly ItemDescriptor[]) => void;
 };

package/types/column-settings-panel/useColumnSettings.d.ts

@@ -1,8 +1,8 @@
-import { ColumnDescriptor, TableConfig, ColumnTypeFormatting } from "@vuu-ui/vuu-table-types";
-import { CellRendererDescriptor, ColumnRenderPropsChangeHandler } from "@vuu-ui/vuu-utils";
+import { ColumnDescriptor, ColumnTypeFormatting, TableConfig } from "@vuu-ui/vuu-table-types";
+import { DataValueTypeSimple } from "@vuu-ui/vuu-data-types";
 import { VuuColumnDataType, VuuTable } from "@vuu-ui/vuu-protocol-types";
+import { CellRendererDescriptor, ColumnRenderPropsChangeHandler } from "@vuu-ui/vuu-utils";
 import { FormEventHandler } from "react";
-import { DataValueTypeSimple } from "@vuu-ui/vuu-data-types";
 import { ColumnModel } from "../column-picker/ColumnModel";
 /**
  * Describes the props for a Column Configuration Editor, for which

package/types/csv-upload/CsvUpload.d.ts

@@ -1,7 +1,7 @@
 import { type ReactNode } from "react";
 import type { RowDefaultDataItemValues, EditSession } from "@vuu-ui/vuu-data-editing";
 import type { CsvParseError, CsvParseOptions } from "./parse/csv-parse";
-import type { CsvValidationStructuredError } from "./parse/csv-schema-validation";
+import type { CsvValidationStructuredError, CsvColumnValidator } from "./parse/csv-schema-validation";
 import type { DataSource, TableSchema } from "@vuu-ui/vuu-data-types";
 import type { VuuTable } from "@vuu-ui/vuu-protocol-types";
 import type { CsvUploadTableData } from "./parse/csv-upload-utils";
@@ -46,7 +46,7 @@ export interface CsvUploadProps {
     importSchema?: TableSchema;
     /** Expected import table, used to validate the session table returned by the server. */
     importTable?: VuuTable;
-    onImportSessionStarted?: (dataSource: DataSource) => void;
+    onImportSessionReady?: (dataSource: DataSource) => void;
     onImportSessionEnded?: (result: CsvUploadSessionEndResult) => void;
     onError?: (result: CsvUploadErrorResult | undefined) => void;
     onImported?: (result: CsvUploadImportedResult) => void;
@@ -60,9 +60,6 @@ export interface CsvUploadProps {
     parseOptions?: CsvParseOptions;
     importMode?: "direct" | "preview";
     rowDefaults?: RowDefaultDataItemValues;
-    /**
-     * Custom renderer for the error panel.
-     */
-    renderError?: (error: CsvUploadErrorResult) => ReactNode;
+    validators?: Record<string, CsvColumnValidator>;
 }
 export declare const CsvUpload: (props: CsvUploadProps) => import("react").JSX.Element;

package/types/csv-upload/data-upload-preview/useDataUploadPreview.d.ts

@@ -11,7 +11,7 @@ export declare const useDataUploadPreview: ({ dataSource, editSession, onClose,
     canSave: boolean;
     hasSelection: boolean;
     onCancel: () => Promise<void>;
-    onDelete: () => Promise<void>;
+    onDelete: () => Promise<import("@vuu-ui/vuu-protocol-types").RpcResult>;
     onSave: (force?: boolean) => Promise<void>;
     sessionError: string | undefined;
 };

package/types/csv-upload/index.d.ts

@@ -1,7 +1,7 @@
 export { CsvUpload, type CsvUploadError, type CsvUploadProps, type CsvUploadErrorResult, type CsvUploadErrors, type CsvUploadPhase, type CsvUploadImportedResult, type CsvUploadPreviewResult, type CsvUploadSessionEndReason, type CsvUploadSessionEndResult, type CsvUploadSessionTable, } from "./CsvUpload";
 export { useCsvUpload, type CsvUploadHookProps, type UseCsvUploadReturn, } from "./useCsvUpload";
 export { DataUploadPreview, type DataUploadPreviewProps, } from "./data-upload-preview/DataUploadPreview";
-export { validateCsvAgainstSchema, type CsvValidationOptions, type CsvValidationResult, } from "./parse/csv-schema-validation";
+export { validateCsvAgainstSchema, type CsvColumnValidator, type CsvValidationOptions, type CsvValidationResult, } from "./parse/csv-schema-validation";
 export { parseCsv, type CsvParseOptions, type CsvParseResult, } from "./parse/csv-parse";
 export { CsvValidationErrorEnum, CsvParseErrorEnum, type CsvError, type CsvErrorMap, type CsvStructuredError, type CsvValidationError, type CsvValidationErrorMap, type CsvValidationErrorType, type CsvValidationStructuredError, type CsvParseError, type CsvParseErrorMap, } from "./parse/csv-errors";
 export { CSV_FIRST_DATA_ROW_NUMBER, CSV_HEADER_ROW_NUMBER, } from "./parse/csv-constants";

package/types/csv-upload/parse/csv-constants.d.ts

@@ -1,3 +1,3 @@
-export declare const CSV_HEADER_ROW_NUMBER = 1;
-export declare const CSV_FIRST_DATA_ROW_NUMBER = 2;
+export declare const CSV_HEADER_ROW_NUMBER = 0;
+export declare const CSV_FIRST_DATA_ROW_NUMBER = 1;
 export declare const MAX_ROWS_IN_CSV = 10000;

package/types/csv-upload/parse/csv-errors.d.ts

@@ -11,8 +11,9 @@ export declare enum CsvValidationErrorEnum {
     MISSING_KEY_COLUMN = "MISSING_KEY_COLUMN",
     UNKNOWN_COLUMN = "UNKNOWN_COLUMN",
     MAX_ROWS_EXCEEDED = "MAX_ROWS_EXCEEDED",
-    EMPTY_NON_STRING_VALUE = "EMPTY_NON_STRING_VALUE",
-    TYPE_MISMATCH = "TYPE_MISMATCH"
+    REQUIRED_FIELD_MISSING = "REQUIRED_FIELD_MISSING",
+    TYPE_MISMATCH = "TYPE_MISMATCH",
+    CUSTOM_VALIDATION = "CUSTOM_VALIDATION"
 }
 export type CsvErrorMap<TError extends string> = {
     rowErrors: Record<number, Record<string, TError[]>>;

package/types/csv-upload/parse/csv-schema-validation.d.ts

@@ -1,8 +1,15 @@
-import type { TableSchema } from "@vuu-ui/vuu-data-types";
+import type { TableSchema, SchemaColumn } from "@vuu-ui/vuu-data-types";
 import type { VuuRowDataItemType } from "@vuu-ui/vuu-protocol-types";
 import type { CsvValidationError, CsvValidationErrorMap, CsvParseError } from "./csv-errors";
 import type { CsvParseResult } from "./csv-parse";
 export { CsvValidationErrorEnum, type CsvValidationError, type CsvValidationErrorMap, type CsvValidationErrorType, type CsvValidationStructuredError, } from "./csv-errors";
+export interface ImportSchemaColumn extends SchemaColumn {
+    required?: boolean;
+}
+export interface ImportTableSchema extends Omit<TableSchema, "columns"> {
+    readonly columns: readonly ImportSchemaColumn[];
+}
+export type CsvColumnValidator = (value: string, columnName: string, row: Record<string, string>) => boolean | string;
 export type CsvValidationResult = {
     columns: string[];
     errorMap: CsvValidationErrorMap;
@@ -12,5 +19,6 @@ export type CsvValidationResult = {
 };
 export type CsvValidationOptions = {
     maxRows?: number;
+    validators?: Record<string, CsvColumnValidator>;
 };
-export declare const validateCsvAgainstSchema: (parsed: CsvParseResult, tableSchema: TableSchema, options?: CsvValidationOptions) => CsvValidationResult;
+export declare const validateCsvAgainstSchema: (parsed: CsvParseResult, tableSchema: TableSchema | ImportTableSchema, options?: CsvValidationOptions) => CsvValidationResult;