@adaptabletools/adaptable-cjs 23.0.0-canary.0 → 23.0.0-canary.10

package/src/View/DataChangeHistory/dataChangeHistoryHelpers.js

@@ -0,0 +1,46 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.formatChangeHistoryCellValue = exports.getChangeHistoryRowChangeInfo = exports.mapChangeHistoryRowData = exports.isValidChangeHistoryLogEntry = exports.getChangeTriggerLabel = exports.getColumnHeaderLabel = void 0;
+const headerMap = new Map();
+const getColumnHeaderLabel = (columnId, mainAdaptableInstance) => {
+    if (!headerMap.has(columnId)) {
+        headerMap.set(columnId, mainAdaptableInstance.api.columnApi.getColumnWithColumnId(columnId)?.friendlyName ?? columnId);
+    }
+    return headerMap.get(columnId);
+};
+exports.getColumnHeaderLabel = getColumnHeaderLabel;
+const getChangeTriggerLabel = (changeInfo) => {
+    return changeInfo.trigger === 'tick' ? 'Ticking' : 'User Edit';
+};
+exports.getChangeTriggerLabel = getChangeTriggerLabel;
+const isValidChangeHistoryLogEntry = (changeInfo) => {
+    return !!changeInfo?.column?.columnId && changeInfo.changedAt != null;
+};
+exports.isValidChangeHistoryLogEntry = isValidChangeHistoryLogEntry;
+const mapChangeHistoryRowData = (changeHistoryLog = {}, mainAdaptableInstance) => {
+    return Object.entries(changeHistoryLog)
+        .filter(([, changeInfo]) => (0, exports.isValidChangeHistoryLogEntry)(changeInfo))
+        .map(([changeKey, changeInfo]) => ({
+        primaryKey: `${changeKey}::${changeInfo.changedAt}`,
+        changeKey,
+        changeTriggerLabel: (0, exports.getChangeTriggerLabel)(changeInfo),
+        changedColumnLabel: (0, exports.getColumnHeaderLabel)(changeInfo.column.columnId, mainAdaptableInstance),
+        changeInfo,
+    }))
+        .sort((a, b) => b.changeInfo.changedAt - a.changeInfo.changedAt);
+};
+exports.mapChangeHistoryRowData = mapChangeHistoryRowData;
+const getChangeHistoryRowChangeInfo = (rowData) => {
+    if (!(0, exports.isValidChangeHistoryLogEntry)(rowData?.changeInfo)) {
+        return undefined;
+    }
+    return rowData.changeInfo;
+};
+exports.getChangeHistoryRowChangeInfo = getChangeHistoryRowChangeInfo;
+const formatChangeHistoryCellValue = (value) => {
+    if (value === null || value === undefined) {
+        return '';
+    }
+    return String(value);
+};
+exports.formatChangeHistoryCellValue = formatChangeHistoryCellValue;

package/src/View/DataImport/DataImportWizard/DataImportWizard.js

@@ -69,7 +69,7 @@ const DataImportWizard = (props) => {
         return columnsMap
             ? columnsMap.reduce((acc, colMap) => {
                 if (colMap.include && !colMap.abColumn) {
-                    acc[colMap.field] = `Field ${colMap.field} does not have a coresponding column.`;
+                    acc[colMap.field] = `Field ${colMap.field} does not have a corresponding column.`;
                 }
                 return acc;
             }, {})

package/src/View/DataImport/DataImportWizard/sections/ColumnsSection.js

@@ -5,16 +5,16 @@ const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
 const React = tslib_1.__importStar(require("react"));
 const CheckBox_1 = require("../../../../components/CheckBox");
-const DropdownButton_1 = tslib_1.__importDefault(require("../../../../components/DropdownButton"));
+const DropdownButton_1 = require("../../../../components/DropdownButton");
 const HelpBlock_1 = tslib_1.__importDefault(require("../../../../components/HelpBlock"));
 const icons_1 = require("../../../../components/icons");
 const InfiniteTable_1 = require("../../../../components/InfiniteTable");
-const Tabs_1 = require("../../../../components/Tabs");
 const Tag_1 = require("../../../../components/Tag");
 const AdaptableContext_1 = require("../../../AdaptableContext");
 const AdaptablePopover_1 = require("../../../AdaptablePopover");
 const UIHelper_1 = tslib_1.__importDefault(require("../../../UIHelper"));
 const Flex_1 = require("../../../../components/Flex");
+const Card_1 = require("../../../../components/Card");
 const tableDOMProps = {
     style: {
         height: '100%',
@@ -66,28 +66,40 @@ const ColumnsSection = (props) => {
             abColumn: {
                 header: 'AdapTable Column',
                 render: (params) => {
-                    // filter out used columns
-                    const availableColumns = allColumns
+                    console.log(params.data, allColumns);
+                    const columnItems = allColumns
                         .filter((c) => !props.columnsMap?.find((cm) => cm.abColumn === c.value))
-                        .map((col) => {
-                        return {
-                            ...col,
-                            onClick: () => {
-                                handleColumnMapChange({
-                                    ...params.data,
-                                    abColumn: col.value,
-                                    include: true,
-                                });
-                            },
-                        };
-                    });
-                    return ((0, jsx_runtime_1.jsx)(DropdownButton_1.default, { showClearButton: true, onClear: () => {
+                        .map((col) => ({
+                        label: col.label,
+                        onClick: () => {
                             handleColumnMapChange({
                                 ...params.data,
-                                abColumn: null,
-                                include: false,
+                                abColumn: col.value,
+                                include: true,
                             });
-                        }, className: "twa:w-full", columns: ['label'], items: availableColumns, children: params.data?.abColumn?.friendlyName ??
+                        },
+                    }));
+                    const items = params.data?.abColumn
+                        ? [
+                            {
+                                label: 'Clear',
+                                onClick: () => {
+                                    handleColumnMapChange({
+                                        ...params.data,
+                                        abColumn: null,
+                                        include: false,
+                                    });
+                                },
+                            },
+                            { separator: true },
+                            ...(columnItems.length
+                                ? columnItems
+                                : [{ label: 'No other columns available', disabled: true }]),
+                        ]
+                        : columnItems.length
+                            ? columnItems
+                            : [{ label: 'No other columns available', disabled: true }];
+                    return ((0, jsx_runtime_1.jsx)(DropdownButton_1.NewDropdownButton, { className: "twa:w-full", items: items, children: params.data?.abColumn?.friendlyName ??
                             params.data?.abColumn?.columnId ??
                             'Select Column' }));
                 },
@@ -108,17 +120,17 @@ const ColumnsSection = (props) => {
         };
     }, [props.columnsMap]);
     if (!props.columnsMap) {
-        return ((0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:p-2", children: (0, jsx_runtime_1.jsxs)(HelpBlock_1.default, { className: "twa:text-error", children: ["No Data has been Imported. Go to ", (0, jsx_runtime_1.jsx)(Tag_1.Tag, { children: "Upload" }), " step and provide Data"] }) }));
+        return ((0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:p-3", children: (0, jsx_runtime_1.jsxs)(HelpBlock_1.default, { className: "twa:text-destructive", children: ["No data has been imported. Go to the ", (0, jsx_runtime_1.jsx)(Tag_1.Tag, { children: "Upload" }), " step and provide data."] }) }));
     }
-    return ((0, jsx_runtime_1.jsx)(Flex_1.Flex, { flexDirection: "column", className: "twa:p-2 twa:h-full", children: (0, jsx_runtime_1.jsxs)(Tabs_1.Tabs, { className: "twa:mb-2 twa:h-full", children: [(0, jsx_runtime_1.jsx)(Tabs_1.Tabs.Tab, { children: "Columns" }), (0, jsx_runtime_1.jsx)(Tabs_1.Tabs.Content, { children: (0, jsx_runtime_1.jsx)(InfiniteTable_1.DataSource, { data: props.columnsMap, primaryKey: 'field', children: (0, jsx_runtime_1.jsx)(InfiniteTable_1.InfiniteTableGrid, { columnPinning: {
-                                valid: 'end',
-                                type: 'end',
-                            }, columnTypes: {
-                                default: {
-                                    minWidth: 100,
-                                    defaultFlex: 1,
-                                },
-                            }, domProps: tableDOMProps, columns: columns }) }) })] }) }));
+    return ((0, jsx_runtime_1.jsxs)(Flex_1.Flex, { flexDirection: "column", className: "twa:h-full", children: [(0, jsx_runtime_1.jsxs)(Flex_1.Flex, { flexDirection: "row", alignItems: "center", className: "twa:p-2 twa:gap-3 twa:border-b twa:mb-2 twa:border-b-foreground/20", children: [(0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:text-5 twa:font-medium", children: "Columns" }), (0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:text-xs twa:opacity-70 twa:max-w-[520px]", children: "Map imported fields to AdapTable columns and choose which to include" })] }), (0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:flex-1 twa:min-h-0 twa:overflow-auto twa:p-3", children: (0, jsx_runtime_1.jsxs)(Card_1.Card, { shadow: false, className: "twa:h-full twa:min-h-[300px]", children: [(0, jsx_runtime_1.jsxs)(Card_1.Card.Title, { children: [(0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:font-medium", children: "Column Mapping" }), (0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:text-xs twa:opacity-70 twa:font-normal twa:max-w-[520px]", children: "Match each data field to an AdapTable column. The primary key column cannot be excluded." })] }), (0, jsx_runtime_1.jsx)(Card_1.Card.Body, { className: "twa:flex-1 twa:min-h-0", children: (0, jsx_runtime_1.jsx)(InfiniteTable_1.DataSource, { data: props.columnsMap, primaryKey: 'field', children: (0, jsx_runtime_1.jsx)(InfiniteTable_1.InfiniteTableGrid, { columnPinning: {
+                                        valid: 'end',
+                                        type: 'end',
+                                    }, columnTypes: {
+                                        default: {
+                                            minWidth: 100,
+                                            defaultFlex: 1,
+                                        },
+                                    }, domProps: tableDOMProps, columns: columns }) }) })] }) })] }));
 };
 exports.ColumnsSection = ColumnsSection;
 exports.ColumnsSection.displayName = 'ColumnsSection';

package/src/View/DataImport/DataImportWizard/sections/DataPreview.js

@@ -3,7 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.DataPreview = void 0;
 const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
-const flatten_1 = tslib_1.__importDefault(require("../../../../Utilities/utils/flatten"));
+const ArrayExtensions_1 = require("../../../../Utilities/Extensions/ArrayExtensions");
 const React = tslib_1.__importStar(require("react"));
 const HelpBlock_1 = tslib_1.__importDefault(require("../../../../components/HelpBlock"));
 const icons_1 = require("../../../../components/icons");
@@ -36,7 +36,7 @@ const DataPreview = (props) => {
     const adaptable = (0, AdaptableContext_1.useAdaptable)();
     const dataImportOptions = adaptable.api.optionsApi.getDataImportOptions();
     if (!props.data) {
-        return ((0, jsx_runtime_1.jsxs)(HelpBlock_1.default, { color: 'var(--ab-color-error)', children: ["No Data has been Imported. Go to ", (0, jsx_runtime_1.jsx)(Tag_1.Tag, { children: "Upload" }), " step and provide Data"] }));
+        return ((0, jsx_runtime_1.jsxs)(HelpBlock_1.default, { color: 'var(--ab-color-destructive)', children: ["No Data has been Imported. Go to ", (0, jsx_runtime_1.jsx)(Tag_1.Tag, { children: "Upload" }), " step and provide Data"] }));
     }
     const primaryKey = adaptable.api.optionsApi.getPrimaryKey();
     const columns = React.useMemo(() => {
@@ -129,7 +129,7 @@ const DataPreview = (props) => {
     };
     return ((0, jsx_runtime_1.jsx)(InfiniteTable_1.DataSource, { data: props.data, primaryKey: primaryKey, onDataMutations: (params) => {
             const newRowData = [...props.data];
-            const mutationsList = (0, flatten_1.default)(Array.from(params.mutations.values()));
+            const mutationsList = (0, ArrayExtensions_1.flatten)(Array.from(params.mutations.values()));
             if (!mutationsList.length) {
                 return;
             }

package/src/View/DataImport/DataImportWizard/sections/UploadSection/UploadSection.js

@@ -1,14 +1,15 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.UploadSection = void 0;
-const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
-const index_1 = tslib_1.__importDefault(require("../../../../../components/Radio/index"));
-const index_2 = require("../../../../../components/Tabs/index");
 const UploadFileSection_1 = require("./UploadFileSection");
 const UploadTextSection_1 = require("./UploadTextSection");
 const Flex_1 = require("../../../../../components/Flex");
+const Card_1 = require("../../../../../components/Card");
+const TypeRadio_1 = require("../../../../Wizard/TypeRadio");
 const UploadSection = (props) => {
-    return ((0, jsx_runtime_1.jsxs)(Flex_1.Flex, { flexDirection: "column", className: "twa:p-2 twa:h-full", children: [(0, jsx_runtime_1.jsxs)(index_2.Tabs, { className: "twa:mb-2", children: [(0, jsx_runtime_1.jsx)(index_2.Tabs.Tab, { children: "Import Type" }), (0, jsx_runtime_1.jsx)(index_2.Tabs.Content, { children: (0, jsx_runtime_1.jsxs)(Flex_1.Flex, { flexDirection: "column", children: [(0, jsx_runtime_1.jsx)(index_1.default, { onClick: () => props.onImportTypeChange('file'), checked: props.importType === 'file', children: "File" }), (0, jsx_runtime_1.jsx)(index_1.default, { onClick: () => props.onImportTypeChange('text'), checked: props.importType === 'text', children: "Text" })] }) })] }), (0, jsx_runtime_1.jsxs)(index_2.Tabs, { className: "twa:flex-1", children: [(0, jsx_runtime_1.jsx)(index_2.Tabs.Tab, { children: props.importType === 'file' ? 'File Upload' : 'Text' }), (0, jsx_runtime_1.jsx)(index_2.Tabs.Content, { children: props.importType === 'file' ? ((0, jsx_runtime_1.jsx)(UploadFileSection_1.ImportFileSection, { readFile: props.readFile, supportedFileFormats: props.supportedFileFormats, message: props.fileMessage })) : ((0, jsx_runtime_1.jsx)(UploadTextSection_1.ImportTextSection, { message: props.textMessage, text: props.text, onTextChange: props.onTextChange })) })] })] }));
+    return ((0, jsx_runtime_1.jsxs)(Flex_1.Flex, { flexDirection: "column", className: "twa:h-full twa:gap-3 twa:p-3", children: [(0, jsx_runtime_1.jsxs)(Card_1.Card, { shadow: false, children: [(0, jsx_runtime_1.jsxs)(Card_1.Card.Title, { children: [(0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:font-medium", children: "Import Type" }), (0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:text-xs twa:opacity-70 twa:font-normal twa:max-w-[520px]", children: "Choose whether to import from a file or pasted text" })] }), (0, jsx_runtime_1.jsx)(Card_1.Card.Body, { children: (0, jsx_runtime_1.jsxs)(Flex_1.Flex, { flexDirection: "column", children: [(0, jsx_runtime_1.jsx)(TypeRadio_1.TypeRadio, { text: "File", description: "Upload a file in a supported format", checked: props.importType === 'file', onClick: () => props.onImportTypeChange('file') }), (0, jsx_runtime_1.jsx)(TypeRadio_1.TypeRadio, { text: "Text", description: "Paste CSV, JSON, or other supported text directly", checked: props.importType === 'text', onClick: () => props.onImportTypeChange('text') })] }) })] }), (0, jsx_runtime_1.jsxs)(Card_1.Card, { shadow: false, className: "twa:flex-1 twa:min-h-0", children: [(0, jsx_runtime_1.jsxs)(Card_1.Card.Title, { children: [(0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:font-medium", children: props.importType === 'file' ? 'File Upload' : 'Paste Text' }), (0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:text-xs twa:opacity-70 twa:font-normal twa:max-w-[520px]", children: props.importType === 'file'
+                                    ? 'Select or drag a file to load the data for import'
+                                    : 'Paste your data below — CSV or JSON is detected automatically' })] }), (0, jsx_runtime_1.jsx)(Card_1.Card.Body, { className: "twa:flex-1 twa:min-h-0", children: props.importType === 'file' ? ((0, jsx_runtime_1.jsx)(UploadFileSection_1.ImportFileSection, { readFile: props.readFile, supportedFileFormats: props.supportedFileFormats, message: props.fileMessage })) : ((0, jsx_runtime_1.jsx)(UploadTextSection_1.ImportTextSection, { message: props.textMessage, text: props.text, onTextChange: props.onTextChange })) })] })] }));
 };
 exports.UploadSection = UploadSection;

package/src/View/DataImport/DataImportWizard/sections/UploadSection/UploadTextSection.js

@@ -5,7 +5,8 @@ const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
 const index_1 = tslib_1.__importDefault(require("../../../../../components/HelpBlock/index"));
 const index_2 = tslib_1.__importDefault(require("../../../../../components/Textarea/index"));
+const Flex_1 = require("../../../../../components/Flex");
 const ImportTextSection = (props) => {
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(index_2.default, { value: props.text, onChange: (event) => props.onTextChange(event.target.value), className: "twa:h-full" }), props.message && (0, jsx_runtime_1.jsx)(index_1.default, { children: props.message })] }));
+    return ((0, jsx_runtime_1.jsxs)(Flex_1.Flex, { flexDirection: "column", className: "twa:h-full twa:min-h-[200px]", children: [(0, jsx_runtime_1.jsx)(index_2.default, { value: props.text, onChange: (event) => props.onTextChange(event.target.value), className: "twa:flex-1 twa:min-h-[200px]" }), props.message ? (0, jsx_runtime_1.jsx)(index_1.default, { className: "twa:mt-2", children: props.message }) : null] }));
 };
 exports.ImportTextSection = ImportTextSection;

package/src/View/DataImport/DataImportWizard/sections/ValidationSection.js

@@ -1,25 +1,14 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ValidationSection = void 0;
-const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
 const CheckBox_1 = require("../../../../components/CheckBox");
-const FormLayout_1 = tslib_1.__importStar(require("../../../../components/FormLayout"));
-const Tabs_1 = require("../../../../components/Tabs");
 const DataPreview_1 = require("./DataPreview");
 const Flex_1 = require("../../../../components/Flex");
-const getRowErrors = (errors, primaryKeyValue) => {
-    if (!errors) {
-        return null;
-    }
-    if (!errors[primaryKeyValue]) {
-        return null;
-    }
-    return errors[primaryKeyValue];
-};
+const Card_1 = require("../../../../components/Card");
 const ValidationSection = (props) => {
-    return ((0, jsx_runtime_1.jsxs)(Flex_1.Flex, { flexDirection: "column", className: "twa:p-2 twa:h-full", children: [(0, jsx_runtime_1.jsxs)(Tabs_1.Tabs, { className: "twa:mb-2", children: [(0, jsx_runtime_1.jsx)(Tabs_1.Tabs.Tab, { children: "Import Options" }), (0, jsx_runtime_1.jsx)(Tabs_1.Tabs.Content, { children: (0, jsx_runtime_1.jsx)(FormLayout_1.default, { children: (0, jsx_runtime_1.jsx)(FormLayout_1.FormRow, { label: "Exclude Invalid Rows", children: (0, jsx_runtime_1.jsx)(CheckBox_1.CheckBox, { onChange: () => {
-                                        props.onSkipInvalidRowsChange(!props.skipInvalidRows);
-                                    }, checked: props.skipInvalidRows }) }) }) })] }), (0, jsx_runtime_1.jsxs)(Tabs_1.Tabs, { className: "twa:flex-1", children: [(0, jsx_runtime_1.jsx)(Tabs_1.Tabs.Tab, { children: "Preview" }), (0, jsx_runtime_1.jsx)(Tabs_1.Tabs.Content, { children: (0, jsx_runtime_1.jsx)(DataPreview_1.DataPreview, { columnsMap: props.columnsMap, data: props.data, errors: props.errors, editable: true, onDataChange: props.onDataChange }) })] })] }));
+    return ((0, jsx_runtime_1.jsxs)(Flex_1.Flex, { flexDirection: "column", className: "twa:h-full twa:gap-3 twa:p-3", children: [(0, jsx_runtime_1.jsxs)(Card_1.Card, { shadow: false, children: [(0, jsx_runtime_1.jsxs)(Card_1.Card.Title, { children: [(0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:font-medium", children: "Import Options" }), (0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:text-xs twa:opacity-70 twa:font-normal twa:max-w-[520px]", children: "Choose how rows that fail validation should be handled" })] }), (0, jsx_runtime_1.jsx)(Card_1.Card.Body, { children: (0, jsx_runtime_1.jsx)(CheckBox_1.CheckBox, { onChange: () => {
+                                props.onSkipInvalidRowsChange(!props.skipInvalidRows);
+                            }, checked: props.skipInvalidRows, children: "Exclude invalid rows from import" }) })] }), (0, jsx_runtime_1.jsxs)(Card_1.Card, { shadow: false, className: "twa:flex-1 twa:min-h-0", children: [(0, jsx_runtime_1.jsxs)(Card_1.Card.Title, { children: [(0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:font-medium", children: "Preview" }), (0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:text-xs twa:opacity-70 twa:font-normal twa:max-w-[520px]", children: "Review imported data and fix any validation errors before importing" })] }), (0, jsx_runtime_1.jsx)(Card_1.Card.Body, { className: "twa:flex-1 twa:min-h-0", children: (0, jsx_runtime_1.jsx)(DataPreview_1.DataPreview, { columnsMap: props.columnsMap, data: props.data, errors: props.errors, editable: true, onDataChange: props.onDataChange }) })] })] }));
 };
 exports.ValidationSection = ValidationSection;

package/src/View/DataSet/DataSetViewPanel.d.ts

@@ -10,8 +10,8 @@ interface DataSetViewPanelComponentState {
     CurrentDataSet: DataSet;
 }
 declare class DataSetViewPanelComponent extends React.Component<DataSetViewPanelComponentProps, DataSetViewPanelComponentState> {
-    getCurrentDataSet(): DataSet;
-    getDataSets(): DataSet[];
+    getCurrentDataSet(): DataSet<any>;
+    getDataSets(): DataSet<any>[];
     render(): React.JSX.Element;
     onSelectedDataSetChanged(dataSetName: string): void;
 }

package/src/View/Export/ExportDestinationPicker.js

@@ -1,13 +1,12 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ExportDestinationPicker = void 0;
-const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
-const NewDropdownButton_1 = require("../../components/NewDropdownButton");
+const DropdownButton_1 = require("../../components/DropdownButton");
 const icons_1 = require("../../components/icons");
 const AdaptableContext_1 = require("../AdaptableContext");
 const ButtonExport_1 = require("../Components/Buttons/ButtonExport");
-const clsx_1 = tslib_1.__importDefault(require("clsx"));
+const utils_1 = require("../../lib/utils");
 const ExportDestinationPicker = ({ reportName, reportFormat, viewType, }) => {
     const adaptable = (0, AdaptableContext_1.useAdaptable)();
     const exportApi = adaptable.api.exportApi;
@@ -16,12 +15,12 @@ const ExportDestinationPicker = ({ reportName, reportFormat, viewType, }) => {
     };
     const supportedDestinations = exportApi.getSupportedExportDestinations(reportFormat);
     if (supportedDestinations.length === 0 || supportedDestinations.length === 1) {
-        return ((0, jsx_runtime_1.jsx)(ButtonExport_1.ButtonExport, { tooltip: 'Export Report', className: (0, clsx_1.default)(viewType !== 'StatusBar' ? '' : undefined, ''), onClick: () => handleExport(supportedDestinations[0]), disabled: reportName == undefined || reportFormat == undefined }));
+        return ((0, jsx_runtime_1.jsx)(ButtonExport_1.ButtonExport, { tooltip: 'Export Report', className: (0, utils_1.cn)(viewType !== 'StatusBar' ? '' : undefined, ''), onClick: () => handleExport(supportedDestinations[0]), disabled: reportName == undefined || reportFormat == undefined }));
     }
     const destinationItems = supportedDestinations.map((destination) => ({
         label: destination,
         onClick: () => handleExport(destination),
     }));
-    return ((0, jsx_runtime_1.jsx)(NewDropdownButton_1.NewDropdownButton, { "data-name": "report-export-selector", disabled: reportName == undefined || reportFormat == undefined, tooltip: "Export Report", variant: "text", items: destinationItems, children: (0, jsx_runtime_1.jsx)(icons_1.Icon, { name: "export" }) }));
+    return ((0, jsx_runtime_1.jsx)(DropdownButton_1.NewDropdownButton, { "data-name": "report-export-selector", disabled: reportName == undefined || reportFormat == undefined, tooltip: "Export Report", variant: "text", items: destinationItems, children: (0, jsx_runtime_1.jsx)(icons_1.Icon, { name: "export" }) }));
 };
 exports.ExportDestinationPicker = ExportDestinationPicker;

package/src/View/Export/ExportSchedulesTab.js

@@ -9,7 +9,7 @@ const ExportRedux = tslib_1.__importStar(require("../../Redux/ActionsReducers/Ex
 const formatScheduledReportSummary_1 = require("../../Strategy/Utilities/Export/formatScheduledReportSummary");
 const AdaptableContext_1 = require("../AdaptableContext");
 const AdaptableObjectList_1 = require("../Components/AdaptableObjectList/AdaptableObjectList");
-const ButtonDelete_1 = require("../Components/Buttons/ButtonDelete");
+const objectListActionButtonStyles_1 = require("../Components/AdaptableObjectList/objectListActionButtonStyles");
 const ButtonEdit_1 = require("../Components/Buttons/ButtonEdit");
 const EmptyContent_1 = tslib_1.__importDefault(require("../../components/EmptyContent"));
 const ScheduledReportWizard_1 = require("./Wizard/ScheduledReportWizard");
@@ -53,7 +53,6 @@ const ExportScheduleListItem = (props) => {
                 values: [(0, formatScheduledReportSummary_1.formatScheduledReportSummary)(reportSchedule)],
             },
         ], actions: [
-            (0, jsx_runtime_1.jsx)(ButtonEdit_1.ButtonEdit, { accessLevel: accessLevel, onClick: props.onEdit, tooltip: "Edit Schedule" }, "edit"),
-            (0, jsx_runtime_1.jsx)(ButtonDelete_1.ButtonDelete, { accessLevel: accessLevel, tooltip: "Delete Schedule", ConfirmationTitle: "Delete Schedule", ConfirmationMsg: "Are you sure you want to delete this schedule?", ConfirmAction: ExportRedux.ScheduledReportDelete(reportSchedule) }, "delete"),
-        ], suspendedEnabled: true, onSuspend: props.onSuspend, onUnSuspend: props.onUnSuspend }));
+            (0, jsx_runtime_1.jsx)(ButtonEdit_1.ButtonEdit, { accessLevel: accessLevel, onClick: props.onEdit, tooltip: "Edit Schedule", className: (0, objectListActionButtonStyles_1.objectListActionButtonClassName)('edit') }, "edit"),
+        ], deleteAction: ExportRedux.ScheduledReportDelete(reportSchedule), deleteConfirmationMsg: "Are you sure you want to delete this schedule?", suspendedEnabled: true, onSuspend: props.onSuspend, onUnSuspend: props.onUnSuspend }));
 };

package/src/View/Export/ExportViewPanel.js

@@ -19,7 +19,7 @@ const ReportNameSelector_1 = require("./ReportNameSelector");
 const ReportFormatSelector_1 = require("./ReportFormatSelector");
 const ExportDestinationPicker_1 = require("./ExportDestinationPicker");
 const Flex_1 = require("../../components/Flex");
-const clsx_1 = tslib_1.__importDefault(require("clsx"));
+const utils_1 = require("../../lib/utils");
 const ExportViewPanel = (props) => {
     const dispatch = (0, react_redux_1.useDispatch)();
     const exportApi = props.api.exportApi;
@@ -38,7 +38,7 @@ const ExportViewPanel = (props) => {
         : 'Are you sure you want to delete this report?';
     const isToolbar = props.viewType === 'Toolbar';
     const elementType = isToolbar ? 'DashboardToolbar' : 'ToolPanel';
-    return ((0, jsx_runtime_1.jsxs)(Flex_1.Flex, { flexDirection: "row", className: (0, clsx_1.default)(`ab-${elementType}__CellSummary__wrap twa:gap-1 twa:flex-row`, {
+    return ((0, jsx_runtime_1.jsxs)(Flex_1.Flex, { flexDirection: "row", className: (0, utils_1.cn)(`ab-${elementType}__CellSummary__wrap twa:gap-1 twa:flex-row`, {
             'twa:min-w-[486px] twa:flex-nowrap': isToolbar,
             'twa:flex-1 twa:flex-wrap': !isToolbar,
         }), children: [(0, jsx_runtime_1.jsx)(ReportNameSelector_1.ReportNameSelector, { viewType: props.viewType, reportName: currentReportName, userReports: userReports, onReportNameSelected: (reportName) => exportApi.selectReport(reportName) }), (0, jsx_runtime_1.jsx)(ReportFormatSelector_1.ReportFormatSelector, { viewType: props.viewType, reportName: currentReportName, reportFormat: currentFormat, onReportFormatSelected: (reportFormat) => exportApi.selectFormat(reportFormat) }), (0, jsx_runtime_1.jsxs)(Flex_1.Flex, { className: (0, join_1.default)(accessLevel == GeneralConstants.ACCESS_LEVEL_READ_ONLY

package/src/View/Export/Wizard/ExportPopupWizardRouter.js

@@ -4,8 +4,17 @@ exports.ExportPopupWizardRouter = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const NewReportWizard_1 = require("./NewReportWizard");
 const ScheduledReportWizard_1 = require("./ScheduledReportWizard");
-const ExportPopupWizardRouter = (props) => {
+const isScheduledReportWizard = (props) => {
     if (props.popupParams?.action === 'NewSchedule') {
+        return true;
+    }
+    if (props.data != null && 'Schedule' in props.data) {
+        return true;
+    }
+    return props.abObjectType?.name === 'Schedule';
+};
+const ExportPopupWizardRouter = (props) => {
+    if (isScheduledReportWizard(props)) {
         const scheduleProps = props;
         return (0, jsx_runtime_1.jsx)(ScheduledReportWizard_1.ScheduledReportWizard, { ...scheduleProps });
     }

package/src/View/Export/Wizard/ReportColumnsWizardSection.d.ts

@@ -1,8 +1,9 @@
 import * as React from 'react';
 import { Report } from '../../../AdaptableState/ExportState';
+import { AdaptableApi } from '../../../types';
 export type ReportColumnsWizardSectionProps = {
     onChange: (data: Report) => void;
 };
 export declare const isValidReportColumnsScope: (report: Report) => true | "Column scope is not defined";
-export declare const renderReportColumnsSummary: (report: Report) => React.JSX.Element;
+export declare const renderReportColumnsSummary: (report: Report, api: AdaptableApi) => React.ReactNode;
 export declare const ReportColumnsWizardSection: (props: ReportColumnsWizardSectionProps) => React.JSX.Element;

package/src/View/Export/Wizard/ReportColumnsWizardSection.js

@@ -1,13 +1,13 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ReportColumnsWizardSection = exports.renderReportColumnsSummary = exports.isValidReportColumnsScope = void 0;
-const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
-const Radio_1 = tslib_1.__importDefault(require("../../../components/Radio"));
-const Tabs_1 = require("../../../components/Tabs");
 const NewScopeComponent_1 = require("../../Components/NewScopeComponent");
+const getExportColumnsViewItems_1 = require("../../../Strategy/Utilities/Export/getExportColumnsViewItems");
 const OnePageAdaptableWizard_1 = require("../../Wizard/OnePageAdaptableWizard");
 const Flex_1 = require("../../../components/Flex");
+const Card_1 = require("../../../components/Card");
+const TypeRadio_1 = require("../../Wizard/TypeRadio");
 const isValidReportColumnsScope = (report) => {
     if (report.ReportColumnScope === 'ScopeColumns') {
         return report.Scope != null ? true : 'Column scope is not defined';
@@ -15,38 +15,30 @@ const isValidReportColumnsScope = (report) => {
     return true;
 };
 exports.isValidReportColumnsScope = isValidReportColumnsScope;
-const renderReportColumnsSummary = (report) => {
-    return ((0, jsx_runtime_1.jsxs)(Flex_1.Box, { className: "twa:text-2", children: [report.ReportColumnScope === 'AllColumns' ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: ["Include ", (0, jsx_runtime_1.jsx)("b", { children: "all Columns" }), " in the Report"] })) : null, report.ReportColumnScope === 'VisibleColumns' ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: ["Include ", (0, jsx_runtime_1.jsx)("b", { children: "only visible Columns" }), " in the Report"] })) : null, report.ReportColumnScope === 'ScopeColumns' ? ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, NewScopeComponent_1.renderScopeSummary)(report.Scope, {
-                    scopeColumns: 'Report Columns',
-                    scopeWholeRow: 'not available',
-                    scopeDataTypes: 'Report will include columns with the following types',
-                }) })) : null] }));
-};
+const renderReportColumnsSummary = (report, api) => (0, getExportColumnsViewItems_1.renderExportColumnsView)(report, api);
 exports.renderReportColumnsSummary = renderReportColumnsSummary;
 const ReportColumnsWizardSection = (props) => {
-    const { api, data } = (0, OnePageAdaptableWizard_1.useOnePageAdaptableWizardContext)();
-    return ((0, jsx_runtime_1.jsxs)(Flex_1.Flex, { flexDirection: "column", className: "twa:h-full", children: [(0, jsx_runtime_1.jsxs)(Tabs_1.Tabs, { className: "twa:m-2", value: data.ReportColumnScope, onValueChange: (ReportColumnScope) => {
-                    const report = {
-                        ...data,
-                        ReportColumnScope,
-                    };
-                    if (report.ReportColumnScope !== 'ScopeColumns') {
-                        delete report.Scope;
-                    }
-                    else {
-                        if (!report.Scope) {
-                            report.Scope = {
-                                ColumnIds: [],
-                            };
-                        }
-                    }
-                    props.onChange(report);
-                }, children: [(0, jsx_runtime_1.jsx)(Tabs_1.Tabs.Tab, { value: "AllColumns", children: (0, jsx_runtime_1.jsx)(Radio_1.default, { className: "twa:m-0", checked: data.ReportColumnScope == 'AllColumns', tabIndex: -1, children: "All Columns" }) }), (0, jsx_runtime_1.jsx)(Tabs_1.Tabs.Tab, { value: "VisibleColumns", children: (0, jsx_runtime_1.jsx)(Radio_1.default, { className: "twa:m-0", checked: data.ReportColumnScope == 'VisibleColumns', tabIndex: -1, children: "Visible Columns" }) }), (0, jsx_runtime_1.jsx)(Tabs_1.Tabs.Tab, { value: "ScopeColumns", children: (0, jsx_runtime_1.jsx)(Radio_1.default, { className: "twa:m-0", checked: data.ReportColumnScope == 'ScopeColumns', tabIndex: -1, children: "Bespoke Columns" }) }), (0, jsx_runtime_1.jsx)(Tabs_1.Tabs.Content, { value: "AllColumns", children: (0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:p-2 twa:text-2", children: "All Columns in the datasource will be included in the Report, whether visible or not at time of export" }) }), (0, jsx_runtime_1.jsx)(Tabs_1.Tabs.Content, { value: "VisibleColumns", children: (0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:p-2 twa:text-2", children: "Only Columns that are visible at the time the Report is exported will be included" }) }), (0, jsx_runtime_1.jsx)(Tabs_1.Tabs.Content, { value: "BespokeColumns", children: (0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:p-2 twa:text-2", children: "Only selected Columns (which you will choose in the next step) will be exported - whether visible or not" }) })] }), data.ReportColumnScope === 'ScopeColumns' ? ((0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:p-2 twa:flex-1 twa:overflow-auto", children: (0, jsx_runtime_1.jsx)(NewScopeComponent_1.NewScopeComponent, { hideWholeRow: true, isColumnAvailable: (column) => Boolean(column.exportable), descriptions: {
-                        rowScope: 'Apply Scope for: Row, or one or more Columns, or one or more Data Types',
-                        columnScope: 'Selected columns will be included in the report',
-                    }, scope: data.Scope, updateScope: (Scope) => {
-                        const report = { ...data, Scope };
-                        props.onChange(report);
-                    } }) })) : null] }));
+    const { data } = (0, OnePageAdaptableWizard_1.useOnePageAdaptableWizardContext)();
+    const handleColumnScopeChange = (ReportColumnScope) => {
+        const report = {
+            ...data,
+            ReportColumnScope,
+        };
+        if (report.ReportColumnScope !== 'ScopeColumns') {
+            delete report.Scope;
+        }
+        else if (!report.Scope) {
+            report.Scope = {
+                ColumnIds: [],
+            };
+        }
+        props.onChange(report);
+    };
+    return ((0, jsx_runtime_1.jsxs)(Flex_1.Flex, { flexDirection: "column", className: "twa:h-full", children: [(0, jsx_runtime_1.jsx)(Flex_1.Flex, { flexDirection: "column", className: "twa:gap-3 twa:p-3 twa:shrink-0", children: (0, jsx_runtime_1.jsxs)(Card_1.Card, { shadow: false, children: [(0, jsx_runtime_1.jsxs)(Card_1.Card.Title, { children: [(0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:font-medium", children: "Columns" }), (0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:text-xs twa:opacity-70 twa:font-normal twa:max-w-[520px]", children: "Choose which columns to include in the Report" })] }), (0, jsx_runtime_1.jsx)(Card_1.Card.Body, { children: (0, jsx_runtime_1.jsxs)(Flex_1.Flex, { flexDirection: "column", children: [(0, jsx_runtime_1.jsx)(TypeRadio_1.TypeRadio, { text: "All Columns", description: "All columns in the datasource will be included, whether visible or not at time of export", checked: data.ReportColumnScope === 'AllColumns', onClick: () => handleColumnScopeChange('AllColumns') }), (0, jsx_runtime_1.jsx)(TypeRadio_1.TypeRadio, { text: "Visible Columns", description: "Only columns that are visible at the time the Report is exported will be included", checked: data.ReportColumnScope === 'VisibleColumns', onClick: () => handleColumnScopeChange('VisibleColumns') }), (0, jsx_runtime_1.jsx)(TypeRadio_1.TypeRadio, { text: "Bespoke Columns", description: "Only selected columns will be exported \u2014 whether visible or not", checked: data.ReportColumnScope === 'ScopeColumns', onClick: () => handleColumnScopeChange('ScopeColumns') })] }) })] }) }), data.ReportColumnScope === 'ScopeColumns' ? ((0, jsx_runtime_1.jsxs)(Flex_1.Flex, { flexDirection: "column", className: "twa:flex-1 twa:min-h-0", children: [(0, jsx_runtime_1.jsxs)(Flex_1.Flex, { flexDirection: "row", alignItems: "center", className: "twa:p-2 twa:gap-3 twa:border-b twa:mb-2 twa:border-b-foreground/20", children: [(0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:text-5 twa:font-medium", children: "Column Selection" }), (0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:text-xs twa:opacity-70 twa:max-w-[520px]", children: "Select the columns to include in the Report" })] }), (0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:flex-1 twa:min-h-0 twa:overflow-auto twa:p-2", children: (0, jsx_runtime_1.jsx)(NewScopeComponent_1.NewScopeComponent, { hideWholeRow: true, isColumnAvailable: (column) => Boolean(column.exportable), descriptions: {
+                                rowScope: 'Apply Scope for: Row, or one or more Columns, or one or more Data Types',
+                                columnScope: 'Selected columns will be included in the report',
+                            }, scope: data.Scope, updateScope: (Scope) => {
+                                props.onChange({ ...data, Scope });
+                            } }) })] })) : null] }));
 };
 exports.ReportColumnsWizardSection = ReportColumnsWizardSection;

package/src/View/Export/Wizard/ReportNameWizardSection.js

@@ -3,12 +3,11 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.ReportNameWizardSection = exports.isValidReportName = exports.renderReportNameSummary = void 0;
 const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
-const ErrorBox_1 = tslib_1.__importDefault(require("../../../components/ErrorBox"));
-const FormLayout_1 = tslib_1.__importStar(require("../../../components/FormLayout"));
 const Input_1 = tslib_1.__importDefault(require("../../../components/Input"));
 const Tag_1 = require("../../../components/Tag");
 const OnePageAdaptableWizard_1 = require("../../Wizard/OnePageAdaptableWizard");
 const Flex_1 = require("../../../components/Flex");
+const Card_1 = require("../../../components/Card");
 const renderReportNameSummary = (report) => {
     return ((0, jsx_runtime_1.jsxs)(Flex_1.Box, { className: "twa:text-2", children: [' ', "Report Name: ", (0, jsx_runtime_1.jsx)(Tag_1.Tag, { children: report.Name })] }));
 };
@@ -27,14 +26,12 @@ const isValidReportName = (report, api) => {
 };
 exports.isValidReportName = isValidReportName;
 const ReportNameWizardSection = (props) => {
-    const { api, data } = (0, OnePageAdaptableWizard_1.useOnePageAdaptableWizardContext)();
-    const validCheck = (0, exports.isValidReportName)(data, api);
-    const ErrorMessage = validCheck === true ? null : validCheck;
-    return ((0, jsx_runtime_1.jsx)(Flex_1.Box, { children: (0, jsx_runtime_1.jsxs)(FormLayout_1.default, { columns: [1, 2], children: [(0, jsx_runtime_1.jsxs)(FormLayout_1.FormRow, { children: [(0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:mr-2", children: "Name:" }), (0, jsx_runtime_1.jsx)(Input_1.default, { "data-name": "export-name", className: "twa:w-full", type: "text", autoFocus: true, placeholder: "Name", value: data.Name, onChange: (e) => {
-                                props.onChange({
-                                    ...data,
-                                    Name: e.target.value,
-                                });
-                            } })] }), (0, jsx_runtime_1.jsxs)(FormLayout_1.FormRow, { children: [(0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}), ErrorMessage ? (0, jsx_runtime_1.jsx)(ErrorBox_1.default, { children: ErrorMessage }) : null] })] }) }));
+    const { data } = (0, OnePageAdaptableWizard_1.useOnePageAdaptableWizardContext)();
+    return ((0, jsx_runtime_1.jsx)(Flex_1.Flex, { flexDirection: "column", className: "twa:gap-3 twa:p-3", children: (0, jsx_runtime_1.jsxs)(Card_1.Card, { shadow: false, children: [(0, jsx_runtime_1.jsxs)(Card_1.Card.Title, { children: [(0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:font-medium", children: "Name" }), (0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:text-xs twa:opacity-70 twa:font-normal twa:max-w-[520px]", children: "Provide a unique name for the Report" })] }), (0, jsx_runtime_1.jsx)(Card_1.Card.Body, { className: "twa:p-1", children: (0, jsx_runtime_1.jsx)(Input_1.default, { "data-name": "export-name", className: "twa:max-w-[300px] twa:w-full", type: "text", autoFocus: true, placeholder: "Enter Name", value: data.Name, onChange: (e) => {
+                            props.onChange({
+                                ...data,
+                                Name: e.target.value,
+                            });
+                        } }) })] }) }));
 };
 exports.ReportNameWizardSection = ReportNameWizardSection;

package/src/View/Export/Wizard/ReportRowsWizardSection.d.ts

@@ -1,8 +1,9 @@
 import * as React from 'react';
 import { Report } from '../../../AdaptableState/ExportState';
+import { AdaptableApi } from '../../../types';
 export type ReportRowsWizardSectionProps = {
     onChange: (data: Report) => void;
 };
 export declare const isValidReportRowsQuery: (report: Report) => true | "Rows query cannot be empty";
-export declare const renderReportRowsSummary: (report: Report) => React.JSX.Element;
+export declare const renderReportRowsSummary: (report: Report, api: AdaptableApi) => React.ReactNode;
 export declare const ReportRowsWizardSection: (props: ReportRowsWizardSectionProps) => React.JSX.Element;