fuse-importer 0.1.8-testing → 0.2.1-testing

package/lib/esm/Importer/hooks/useSubmitToServer.js

@@ -55,10 +55,10 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
     return to.concat(ar || Array.prototype.slice.call(from));
 };
 import { useState } from "react";
-import { useImporterContext, } from "../contexts/ImporterContextProvider";
 import { isRecordEmpty } from "../../Importer/common/Spreadsheet/common";
 import { sendRecordsToIntegrations } from "../../Importer/common/utils";
 import { getTemplateFields, recordListToDataSet } from "../../Importer/data";
+import { useImporterContext, } from "../contexts/ImporterContextProvider";
 var trackImportedRowsCount = function (fuseApi, templateSlug, rowCount) { return __awaiter(void 0, void 0, void 0, function () {
     var error_1, errorMessage;
     var _a, _b;
@@ -82,21 +82,41 @@ var trackImportedRowsCount = function (fuseApi, templateSlug, rowCount) { return
     });
 }); };
 var buildColumnMappingsFromHeaderMatchings = function (templateHeaders, templateHeaderMatchings) {
-    return templateHeaders.map(function (column) {
+    return templateHeaders
+        .filter(function (column) { return column.label && templateHeaderMatchings[column.label]; })
+        .map(function (column) {
         return {
             matched_column_name: templateHeaderMatchings[column.label],
             template_column_name: column.label,
         };
     });
 };
-var saveMappedColumns = function (columnMappings, fuseApi, templateSlug) { return __awaiter(void 0, void 0, void 0, function () {
+var buildValueMappingsFromHeaderValueMatchings = function (enumFieldValueMatchings) {
+    var mappings = Object.values(enumFieldValueMatchings).map(function (column) {
+        var valuesMappings = [];
+        for (var _i = 0, _a = Object.entries(column); _i < _a.length; _i++) {
+            var _b = _a[_i], key = _b[0], value = _b[1];
+            if (!value) {
+                continue;
+            }
+            valuesMappings.push({
+                matched_value: key,
+                template_value: value,
+            });
+        }
+        return valuesMappings;
+    });
+    return mappings.flat();
+};
+var saveMappedColumns = function (columnMappings, valueMappings, fuseApi, templateSlug) { return __awaiter(void 0, void 0, void 0, function () {
     var error_2;
     return __generator(this, function (_a) {
         switch (_a.label) {
             case 0:
                 _a.trys.push([0, 2, , 3]);
                 return [4 /*yield*/, fuseApi.patch("/api/v1/importer/templates/".concat(templateSlug), {
-                        column_mappings_attributes: columnMappings,
+                        column_mappings: columnMappings,
+                        value_mappings: valueMappings,
                     })];
             case 1:
                 _a.sent();
@@ -118,13 +138,13 @@ var filterAndMapWithBackendErrors = function (dataSet, errors) {
         return __assign(__assign({}, record), { _meta: __assign(__assign({}, meta), { isInvalid: true, backendErrors: errors[rId] }) });
     }, []);
 };
-export var useSubmitToServer = function (setIsTransformTooltipOpened) {
-    var _a = useImporterContext(), templateHeaderMatchings = _a.templateHeaderMatchings, templateHeaders = _a.templateHeaders, integrations = _a.integrations, templateSlug = _a.templateSlug, fuseApi = _a.fuseApi, previewMode = _a.importerOptions.previewMode, onSubmit = _a.onSubmit;
+export var useSubmitToServer = function (setHasTransformedRecords) {
+    var _a = useImporterContext(), enumFieldValueMatchings = _a.enumFieldValueMatchings, templateHeaderMatchings = _a.templateHeaderMatchings, templateHeaders = _a.templateHeaders, integrations = _a.integrations, templateSlug = _a.templateSlug, fuseApi = _a.fuseApi, previewMode = _a.importerOptions.previewMode, onSubmit = _a.onSubmit;
     var _b = useState(false), isSubmitting = _b[0], setIsSubmitting = _b[1];
     var _c = useState(false), importWasSuccessful = _c[0], setImportWasSuccessful = _c[1];
     var _d = useState(null), appResponse = _d[0], setAppResponse = _d[1];
     var onSubmitToServer = function (dataSet, afterSubmitCallback) { return __awaiter(void 0, void 0, void 0, function () {
-        var dataSetValues, reviewFields_1, validDataSetValues, validDataSetLength, invalidRecords_1, applicationResponse, isAppResponseSuccessful, _a, errors, isDataValid, recordsToDisplayFiltered, invalidDataSet, columnMappings, error_3;
+        var dataSetValues, reviewFields_1, validDataSetValues, validDataSetLength, invalidRecords_1, applicationResponse, isAppResponseSuccessful, _a, errors, isDataValid, recordsToDisplayFiltered, invalidDataSet, columnMappings, valueMappings, error_3;
         return __generator(this, function (_b) {
             switch (_b.label) {
                 case 0:
@@ -158,7 +178,7 @@ export var useSubmitToServer = function (setIsTransformTooltipOpened) {
                         invalidRecords_1 = __spreadArray(__spreadArray([], invalidRecords_1, true), (recordsToDisplayFiltered || []), true);
                     }
                     invalidDataSet = recordListToDataSet(invalidRecords_1, reviewFields_1, false).dataSet;
-                    setIsTransformTooltipOpened(false);
+                    setHasTransformedRecords(false);
                     afterSubmitCallback(invalidDataSet);
                     if (!!previewMode) return [3 /*break*/, 5];
                     return [4 /*yield*/, trackImportedRowsCount(fuseApi, templateSlug, validDataSetLength)];
@@ -168,7 +188,8 @@ export var useSubmitToServer = function (setIsTransformTooltipOpened) {
                 case 3:
                     _b.sent();
                     columnMappings = buildColumnMappingsFromHeaderMatchings(templateHeaders, templateHeaderMatchings);
-                    return [4 /*yield*/, saveMappedColumns(columnMappings, fuseApi, templateSlug)];
+                    valueMappings = buildValueMappingsFromHeaderValueMatchings(enumFieldValueMatchings);
+                    return [4 /*yield*/, saveMappedColumns(columnMappings, valueMappings, fuseApi, templateSlug)];
                 case 4:
                     _b.sent();
                     _b.label = 5;

package/lib/esm/common/CircleSpinner.d.ts

@@ -0,0 +1 @@
+export declare const CircleSpinner: () => JSX.Element;

package/lib/esm/common/CircleSpinner.js

@@ -0,0 +1,13 @@
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import styled from "styled-components";
+var SpinnerContainer = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  animation: spin 1s linear infinite;\n  background: transparent;\n  border-radius: 50%;\n  height: 24px;\n  overflow: hidden;\n  position: relative;\n  width: 24px;\n  z-index: 0;\n\n  @keyframes spin {\n    100% {\n      transform: rotate(360deg);\n    }\n  }\n"], ["\n  animation: spin 1s linear infinite;\n  background: transparent;\n  border-radius: 50%;\n  height: 24px;\n  overflow: hidden;\n  position: relative;\n  width: 24px;\n  z-index: 0;\n\n  @keyframes spin {\n    100% {\n      transform: rotate(360deg);\n    }\n  }\n"])));
+var SpinBlocker = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  background: black;\n  border-radius: 50%;\n  height: 80%;\n  left: 10%;\n  position: absolute;\n  top: 10%;\n  width: 80%;\n"], ["\n  background: black;\n  border-radius: 50%;\n  height: 80%;\n  left: 10%;\n  position: absolute;\n  top: 10%;\n  width: 80%;\n"])));
+var Spin = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  background: linear-gradient(\n    to bottom right,\n    rgba(255, 255, 255, 0.85) 50%,\n    rgba(0, 0, 0, 0) 150%\n  );\n  height: 50%;\n  left: 0;\n  position: absolute;\n  top: 50%;\n  width: 50%;\n  z-index: -1;\n"], ["\n  background: linear-gradient(\n    to bottom right,\n    rgba(255, 255, 255, 0.85) 50%,\n    rgba(0, 0, 0, 0) 150%\n  );\n  height: 50%;\n  left: 0;\n  position: absolute;\n  top: 50%;\n  width: 50%;\n  z-index: -1;\n"])));
+export var CircleSpinner = function () {
+    return (_jsxs(SpinnerContainer, { children: [_jsx(SpinBlocker, {}), _jsx(Spin, {})] }));
+};
+var templateObject_1, templateObject_2, templateObject_3;

package/lib/esm/common/FileUploadDropzone/ImporterDropzone.js

@@ -6,12 +6,19 @@ export var useDragAndDrop = function (_a) {
     var onComplete = _a.onComplete, saveFileName = _a.saveFileName, setIsLoading = _a.setIsLoading, validHeadersCount = _a.validHeadersCount;
     var onDrop = function (acceptedFiles) {
         acceptedFiles.forEach(function (file) {
+            if (file.size <= 0) {
+                addToast("Cannot upload an empty file.", "error");
+                return;
+            }
             setIsLoading && setIsLoading(true);
             saveFileName(file.name);
             var reader = new FileReader();
             var isCsvFile = file.type === "text/csv";
             reader.onabort = function () { return console.log("file reading was aborted"); };
-            reader.onerror = function () { return console.log("file reading has failed"); };
+            reader.onerror = function () {
+                addToast("An error occurred while reading the file.", "error");
+                setIsLoading && setIsLoading(false);
+            };
             reader.onload = function (event) {
                 var _a;
                 var results = event.target.result;
@@ -22,31 +29,59 @@ export var useDragAndDrop = function (_a) {
                             onComplete(parserResults.data);
                             setIsLoading && setIsLoading(false);
                         },
+                        error: function (error) {
+                            addToast("An error occurred while parsing the CSV: ".concat(error.message), "error");
+                            setIsLoading && setIsLoading(false);
+                        },
                     });
                     return;
                 }
-                var getDataFromFile = function (fileResults) {
-                    // rounded value to 20MB
-                    var isLargeFile = file.size > 20000000;
-                    var workBook = XLSX.read(fileResults, {
-                        type: "array",
-                        codepage: 65001,
-                        raw: true,
-                        dense: isLargeFile,
-                    });
-                    var workBookName = workBook.SheetNames[0];
-                    var sheet = workBook.Sheets[workBookName];
-                    return XLSX.utils.sheet_to_json(sheet, { header: 1, raw: false });
-                };
-                var fileData = getDataFromFile(results);
-                var headersCount = (_a = fileData[0]) === null || _a === void 0 ? void 0 : _a.length;
-                if (validHeadersCount) {
-                    validHeadersCount(headersCount) && onComplete(fileData);
+                var arr = new Uint8Array(event.target.result).subarray(0, 4);
+                var header = "";
+                for (var i = 0; i < arr.length; i++) {
+                    header += arr[i].toString(16);
                 }
-                else {
-                    onComplete(fileData);
+                // Check the file signature
+                var isExcelFile = header === "504b34" || header === "d0cf11e0"; // .xlsx or .xls
+                if (!isExcelFile) {
+                    addToast("The file is not a valid Excel file.", "error");
+                    setIsLoading && setIsLoading(false);
+                    return;
+                }
+                try {
+                    var getDataFromFile = function (fileResults) {
+                        // rounded value to 20MB
+                        var isLargeFile = file.size > 20000000;
+                        var workBook = XLSX.read(fileResults, {
+                            type: "array",
+                            codepage: 65001,
+                            raw: true,
+                            dense: isLargeFile,
+                        });
+                        var workBookName = workBook.SheetNames[0];
+                        var sheet = workBook.Sheets[workBookName];
+                        return XLSX.utils.sheet_to_json(sheet, { header: 1, raw: false });
+                    };
+                    var fileData = getDataFromFile(results);
+                    if (!fileData.length) {
+                        addToast("The file appears to be empty or cannot be parsed.", "error");
+                        setIsLoading && setIsLoading(false);
+                        return;
+                    }
+                    var headersCount = (_a = fileData[0]) === null || _a === void 0 ? void 0 : _a.length;
+                    if (validHeadersCount && !validHeadersCount(headersCount)) {
+                        addToast("Invalid header count in file.", "error");
+                        setIsLoading && setIsLoading(false);
+                    }
+                    else {
+                        onComplete(fileData);
+                        setIsLoading && setIsLoading(false);
+                    }
+                }
+                catch (error) {
+                    addToast("An error occurred while processing the file: ".concat(error.message), "error");
+                    setIsLoading && setIsLoading(false);
                 }
-                setIsLoading && setIsLoading(false);
             };
             if (isCsvFile) {
                 reader.readAsText(file);

package/lib/esm/common/Table/TableActions/CustomActions/CustomActions.js

@@ -105,30 +105,35 @@ export var CustomActions = function () {
     var handleCustomAction = function (actionKey) { return __awaiter(void 0, void 0, void 0, function () {
         var recordsToRunAction, action, processRecordsInBatches, toastMessage;
         return __generator(this, function (_a) {
-            recordsToRunAction = selectedRows.map(function (recordId) {
-                return getRecord(recordId);
-            });
-            action = customActions.find(function (action) { return action.name === actionKey; });
-            if (!action || Object.keys(action).length === 0) {
-                addToast(t("table_actions.custom_actions.general_error_toast"), "error");
-                return [2 /*return*/];
-            }
-            processRecordsInBatches = useBatchProcessing().processRecordsInBatches;
-            processRecordsInBatches(recordsToRunAction, function (batch) { return __awaiter(void 0, void 0, void 0, function () {
-                return __generator(this, function (_a) {
-                    switch (_a.label) {
-                        case 0: return [4 /*yield*/, processBatch(batch, action)];
-                        case 1:
-                            _a.sent();
-                            return [2 /*return*/];
+            switch (_a.label) {
+                case 0:
+                    recordsToRunAction = selectedRows.map(function (recordId) {
+                        return getRecord(recordId);
+                    });
+                    action = customActions.find(function (action) { return action.name === actionKey; });
+                    if (!action || Object.keys(action).length === 0) {
+                        addToast(t("table_actions.custom_actions.general_error_toast"), "error");
+                        return [2 /*return*/];
                     }
-                });
-            }); });
-            toastMessage = t("table_actions.custom_actions.success_toast", {
-                actionName: action.name,
-            });
-            addToast(toastMessage, "success");
-            return [2 /*return*/];
+                    processRecordsInBatches = useBatchProcessing().processRecordsInBatches;
+                    return [4 /*yield*/, processRecordsInBatches(recordsToRunAction, function (batch) { return __awaiter(void 0, void 0, void 0, function () {
+                            return __generator(this, function (_a) {
+                                switch (_a.label) {
+                                    case 0: return [4 /*yield*/, processBatch(batch, action)];
+                                    case 1:
+                                        _a.sent();
+                                        return [2 /*return*/];
+                                }
+                            });
+                        }); })];
+                case 1:
+                    _a.sent();
+                    toastMessage = t("table_actions.custom_actions.success_toast", {
+                        actionName: action.name,
+                    });
+                    addToast(toastMessage, "success");
+                    return [2 /*return*/];
+            }
         });
     }); };
     var onSelect = function (value) {

package/lib/esm/common/Table/TableActions/FilterByErrors/FilterByErrors.js

@@ -1,10 +1,10 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { useEffect, useState } from "react";
 import { useTranslation } from "react-i18next";
-import { addToast } from "../../../../common/Toast";
 import { useReviewContext, useSpreadsheetContext } from "../../../../Importer";
 import { useFilteredDataContext } from "../../../../Importer/common/Spreadsheet/FilteredDataContextProvider";
 import { useValidationContext } from "../../../../Importer/common/Spreadsheet/ValidationContextProvider";
+import { addToast } from "../../../../common/Toast";
 import { useEventManagerContext } from "../../../EventManagerContextProvider";
 import * as S from "./FilterByErrors.styles";
 export var FilterByErrors = function () {
@@ -12,7 +12,7 @@ export var FilterByErrors = function () {
     var _c = useFilteredDataContext(), spreadsheetFilter = _c.spreadsheetFilter, resetSpreadsheetFilter = _c.resetSpreadsheetFilter, filterRecordsByFieldErrors = _c.filterRecordsByFieldErrors;
     var _d = useEventManagerContext(), on = _d.on, off = _d.off, EVENTS = _d.EVENTS;
     var fields = useSpreadsheetContext().fields;
-    var isTransformTooltipOpened = useReviewContext().isTransformTooltipOpened;
+    var hasTransformedRecords = useReviewContext().hasTransformedRecords;
     var columnsWithErrorCounts = useValidationContext().columnsWithErrorCounts;
     var t = useTranslation("review").t;
     var _e = useState([]), errorArray = _e[0], setErrorArray = _e[1];
@@ -72,6 +72,6 @@ export var FilterByErrors = function () {
         : isMenuOpened
             ? search_or_select
             : prefix;
-    var isDisabled = errorArray.length === 0 || isTransformTooltipOpened;
+    var isDisabled = errorArray.length === 0 || hasTransformedRecords;
     return (_jsx(S.StyledAutocomplete, { placement: "bottom", placeholder: inputText, onToggle: function (v) { return !isDisabled && setIsMenuOpened(v); }, onChange: onChange, value: selectedErrorToFilter, options: errorArray, isDisabled: isDisabled, isInputDisabled: isDisabled, inputWidth: inputWidth, "data-testid": "ta-filter-by-errors", prefix: inputText }));
 };

package/lib/esm/common/Table/TableActions/RowFilters.js

@@ -45,7 +45,7 @@ export var RowFilters = function () {
     var _a = useFilteredDataContext(), spreadsheetFilter = _a.spreadsheetFilter, filterRecordsByRowType = _a.filterRecordsByRowType;
     var _b = useDuplicateDataContext(), duplicateRecordIds = _b.duplicateRecordIds, calculateDuplicateRecords = _b.calculateDuplicateRecords;
     var invalidRowsCountRef = useValidationContext().invalidRowsCountRef;
-    var isTransformTooltipOpened = useReviewContext().isTransformTooltipOpened;
+    var hasTransformedRecords = useReviewContext().hasTransformedRecords;
     var _c = useState(invalidRowsCountRef.current), invalidRowsCount = _c[0], setInvalidRowsCount = _c[1];
     var _d = useDataSetContext(), dataSetLength = _d.dataSetLength, emptyRecordIds = _d.emptyRecordIds;
     var _e = useEventManagerContext(), on = _e.on, off = _e.off, EVENTS = _e.EVENTS;
@@ -89,6 +89,6 @@ export var RowFilters = function () {
         }
         filterRecordsByRowType("invalid");
     };
-    return (_jsx(Wrapper, __assign({ isDisabled: isTransformTooltipOpened }, { children: _jsxs(Container, { children: [_jsx(Filter, { isSelected: spreadsheetFilter.byRow === "all", label: all_rows, count: recordsWithValuesCount, onClick: function () { return onAllSelected(); } }), _jsx(Filter, { isSelected: spreadsheetFilter.byRow === "invalid", label: invalid_rows, count: invalidRowsCount, onClick: function () { return onInvalidSelected(); } }), _jsx(Filter, { isSelected: spreadsheetFilter.byRow === "duplicates", label: duplicates, count: duplicateRecordIds.size, onClick: function () { return onDuplicatesSelected(); } })] }) })));
+    return (_jsx(Wrapper, __assign({ isDisabled: hasTransformedRecords }, { children: _jsxs(Container, { children: [_jsx(Filter, { isSelected: spreadsheetFilter.byRow === "all", label: all_rows, count: recordsWithValuesCount, onClick: function () { return onAllSelected(); }, "data-test-id": "all_rows_filter" }), _jsx(Filter, { isSelected: spreadsheetFilter.byRow === "invalid", label: invalid_rows, count: invalidRowsCount, onClick: function () { return onInvalidSelected(); }, "data-test-id": "invalid_filter" }), _jsx(Filter, { isSelected: spreadsheetFilter.byRow === "duplicates", label: duplicates, count: duplicateRecordIds.size, onClick: function () { return onDuplicatesSelected(); }, "data-test-id": "duplicates_filter" })] }) })));
 };
 var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6;

package/lib/esm/common/Table/TableActions/SearchRows.js

@@ -15,17 +15,17 @@ var __assign = (this && this.__assign) || function () {
 };
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useRef, useState } from "react";
+import { useTranslation } from "react-i18next";
 import styled, { css } from "styled-components";
-import { useDebounce } from "../../../hooks";
 import { useReviewContext } from "../../../Importer";
-import { colors } from "../../../styled/theme/colorPalette";
-import { textStyles } from "../../../styled/theme/textStyles";
-import { SearchIcon, ReplaceIcon } from "./icons";
-import { TooltipProvider } from "../../../common/TooltipProvider";
-import { useTranslation } from "react-i18next";
-import { Div } from "../../../styled";
 import { useFilteredDataContext } from "../../../Importer/common/Spreadsheet/FilteredDataContextProvider";
 import { FindAndReplaceModal } from "../../../Importer/common/Spreadsheet/components/FindAndReplace";
+import { TooltipProvider } from "../../../common/TooltipProvider";
+import { useDebounce } from "../../../hooks";
+import { Div } from "../../../styled";
+import { colors } from "../../../styled/theme/colorPalette";
+import { textStyles } from "../../../styled/theme/textStyles";
+import { ReplaceIcon, SearchIcon } from "./icons";
 var Wrapper = styled(Div)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  background: ", ";\n  border-radius: 4px;\n  cursor: pointer;\n  display: flex;\n  gap: 8px;\n  height: 24px;\n  overflow: hidden;\n  padding: 8px;\n  position: relative;\n  transition: width 0.25s ease-in-out;\n  width: ", ";\n"], ["\n  background: ", ";\n  border-radius: 4px;\n  cursor: pointer;\n  display: flex;\n  gap: 8px;\n  height: 24px;\n  overflow: hidden;\n  padding: 8px;\n  position: relative;\n  transition: width 0.25s ease-in-out;\n  width: ", ";\n"])), function (_a) {
     var isOpen = _a.isOpen;
     return (isOpen ? colors.orange50 : "none");
@@ -74,10 +74,10 @@ var SearchInput = function (_a) {
 export var SearchRows = function (_a) {
     var _b = _a.testId, testId = _b === void 0 ? "ta-search-rows" : _b;
     var _c = useFilteredDataContext(), filteredInputValue = _c.filteredInputValue, setFilteredInputValue = _c.setFilteredInputValue;
-    var isTransformTooltipOpened = useReviewContext().isTransformTooltipOpened;
+    var hasTransformedRecords = useReviewContext().hasTransformedRecords;
     var handleChangeInputValue = function (value) {
         setFilteredInputValue(value);
     };
-    return (_jsx(_Fragment, { children: _jsx(SearchInput, { testId: testId, value: filteredInputValue, onChange: handleChangeInputValue, isDisabled: isTransformTooltipOpened }) }));
+    return (_jsx(_Fragment, { children: _jsx(SearchInput, { testId: testId, value: filteredInputValue, onChange: handleChangeInputValue, isDisabled: hasTransformedRecords }) }));
 };
 var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6;

package/lib/esm/common/Table/TableActions/TableActions.js

@@ -22,7 +22,7 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useReviewContext } from "../../../Importer";
-import { defaultTableActionsHeightPx } from "./common";
+import { useValidationContext } from "../../../Importer/common/Spreadsheet/ValidationContextProvider";
 import { CustomActions } from "./CustomActions";
 import { DeleteSelectedRows } from "./DeleteSelectedRows";
 import { ExportData } from "./ExportData";
@@ -32,11 +32,14 @@ import { SearchRows } from "./SearchRows";
 import * as S from "./TableActions.styles";
 import { TransformedRecordsCount } from "./TransformedRecordsCount";
 import ValidationProgress from "./ValidationProgress";
+import { defaultTableActionsHeightPx } from "./common";
 export var TableActions = function (_a) {
     var _b = _a.tableActionsHeight, tableActionsHeight = _b === void 0 ? defaultTableActionsHeightPx : _b, props = __rest(_a, ["tableActionsHeight"]);
-    var _c = useReviewContext(), isTransformTooltipOpened = _c.isTransformTooltipOpened, setIsTransformTooltipOpened = _c.setIsTransformTooltipOpened;
+    var _c = useReviewContext(), hasTransformedRecords = _c.hasTransformedRecords, setHasTransformedRecords = _c.setHasTransformedRecords;
+    var isValidationCompleted = useValidationContext().isValidationCompleted;
     var onCloseTransformsTooltip = function () {
-        setIsTransformTooltipOpened(false);
+        setHasTransformedRecords(false);
     };
-    return (_jsxs(S.TableActionsContainer, __assign({ height: tableActionsHeight }, props, { children: [_jsxs(S.TableActionsContent, { children: [_jsx(SearchRows, {}), _jsx(RowFilters, {}), _jsx(FilterByErrors, {}), _jsxs(S.ButtonActionsContainer, { children: [_jsx(DeleteSelectedRows, {}), _jsx(ExportData, {}), _jsx(CustomActions, {})] })] }), _jsxs(S.TableActionsInformations, { children: [_jsx(ValidationProgress, {}), isTransformTooltipOpened && (_jsx(TransformedRecordsCount, { onClose: onCloseTransformsTooltip }))] })] })));
+    var shouldShowTransformedCount = hasTransformedRecords && isValidationCompleted;
+    return (_jsxs(S.TableActionsContainer, __assign({ height: tableActionsHeight }, props, { children: [_jsxs(S.TableActionsContent, { children: [_jsx(SearchRows, {}), _jsx(RowFilters, {}), _jsx(FilterByErrors, {}), _jsxs(S.ButtonActionsContainer, { children: [_jsx(DeleteSelectedRows, {}), _jsx(ExportData, {}), _jsx(CustomActions, {})] })] }), _jsxs(S.TableActionsInformations, { children: [_jsx(ValidationProgress, {}), shouldShowTransformedCount && (_jsx(TransformedRecordsCount, { onClose: onCloseTransformsTooltip }))] })] })));
 };

package/lib/esm/common/Table/TableActions/TableActions.styles.js

@@ -13,6 +13,6 @@ export var TableActionsContainer = styled(Div)(templateObject_1 || (templateObje
 });
 export var ButtonActionsContainer = styled(Div)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  align-items: center;\n  display: flex;\n  gap: 8px;\n"], ["\n  align-items: center;\n  display: flex;\n  gap: 8px;\n"])));
 export var TableActionsContent = styled(Div)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  align-items: center;\n  display: flex;\n  gap: 16px;\n"], ["\n  align-items: center;\n  display: flex;\n  gap: 16px;\n"])));
-export var TableActionsInformations = styled(Div)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  align-items: center;\n  display: flex;\n  gap: 16px;\n  position: relative;\n  z-index: 101;\n"], ["\n  align-items: center;\n  display: flex;\n  gap: 16px;\n  position: relative;\n  z-index: 101;\n"])));
+export var TableActionsInformations = styled(Div)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  align-items: center;\n  display: flex;\n  gap: 16px;\n  position: relative;\n"], ["\n  align-items: center;\n  display: flex;\n  gap: 16px;\n  position: relative;\n"])));
 export var ActionButton = styled.button(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  align-items: center;\n  background: transparent;\n  border-radius: 4px;\n  border: none;\n  cursor: pointer;\n  display: flex;\n  height: 36px;\n  justify-content: center;\n  padding: 0px;\n  width: 36px;\n\n  :disabled {\n    opacity: 0.6;\n\n    :hover {\n      background-color: transparent !important;\n      cursor: not-allowed;\n    }\n  }\n"], ["\n  align-items: center;\n  background: transparent;\n  border-radius: 4px;\n  border: none;\n  cursor: pointer;\n  display: flex;\n  height: 36px;\n  justify-content: center;\n  padding: 0px;\n  width: 36px;\n\n  :disabled {\n    opacity: 0.6;\n\n    :hover {\n      background-color: transparent !important;\n      cursor: not-allowed;\n    }\n  }\n"])));
 var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5;

package/lib/esm/common/Table/TableActions/TransformedRecordsCount.js

@@ -17,11 +17,11 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
 import { useEffect, useMemo, useState } from "react";
 import { useTranslation } from "react-i18next";
 import styled from "styled-components";
-import { Button } from "../../../common/buttons";
 import { useSpreadsheetContext } from "../../../Importer";
 import { useDataSetContext } from "../../../Importer/common/Spreadsheet/DataSetContextProvider";
 import { useFilteredDataContext } from "../../../Importer/common/Spreadsheet/FilteredDataContextProvider";
-import { colors, Div } from "../../../styled";
+import { Button } from "../../../common/buttons";
+import { Div, colors } from "../../../styled";
 import { truncateString } from "../../../utils";
 import { CheckIcon } from "./icons";
 var formatToLocaleString = function (number) {
@@ -30,7 +30,7 @@ var formatToLocaleString = function (number) {
         maximumFractionDigits: 0,
     });
 };
-var RecordsCountContainer = styled(Div)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  position: relative;\n  z-index: 2;\n\n  * {\n    box-sizing: border-box;\n  }\n"], ["\n  position: relative;\n  z-index: 2;\n\n  * {\n    box-sizing: border-box;\n  }\n"])));
+var RecordsCountContainer = styled(Div)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  position: relative;\n\n  * {\n    box-sizing: border-box;\n  }\n"], ["\n  position: relative;\n\n  * {\n    box-sizing: border-box;\n  }\n"])));
 var Counter = styled(Div)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  align-items: center;\n  background: ", ";\n  border-radius: 35px;\n  display: flex;\n  padding: 0px 18px;\n  position: relative;\n  user-select: none;\n  z-index: 101;\n"], ["\n  align-items: center;\n  background: ", ";\n  border-radius: 35px;\n  display: flex;\n  padding: 0px 18px;\n  position: relative;\n  user-select: none;\n  z-index: 101;\n"])), colors.blue100);
 var TooltipContainer = styled(Div)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  background: ", ";\n  border-radius: 8px;\n  box-shadow: 0px 3.53px 63.58px 0px #b7a6a640;\n  display: flex;\n  flex-direction: column;\n  gap: 18px;\n  padding: 16px 32px 24px 24px;\n  position: absolute;\n  right: 0px;\n  top: 66px;\n  width: clamp(150px, 379px, 379px);\n  z-index: 101;\n\n  &::before {\n    border-color: transparent transparent #ffffff transparent;\n    border-radius: 4px;\n    border-style: solid;\n    border-width: 0 14.5px 24px 14.5px;\n    content: \"\";\n    height: 0;\n    position: absolute;\n    right: -4px;\n    top: -6px;\n    transform: rotate(120deg);\n    width: 0;\n  }\n"], ["\n  background: ", ";\n  border-radius: 8px;\n  box-shadow: 0px 3.53px 63.58px 0px #b7a6a640;\n  display: flex;\n  flex-direction: column;\n  gap: 18px;\n  padding: 16px 32px 24px 24px;\n  position: absolute;\n  right: 0px;\n  top: 66px;\n  width: clamp(150px, 379px, 379px);\n  z-index: 101;\n\n  &::before {\n    border-color: transparent transparent #ffffff transparent;\n    border-radius: 4px;\n    border-style: solid;\n    border-width: 0 14.5px 24px 14.5px;\n    content: \"\";\n    height: 0;\n    position: absolute;\n    right: -4px;\n    top: -6px;\n    transform: rotate(120deg);\n    width: 0;\n  }\n"])), colors.white);
 var ExampleCode = styled(Div)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  align-items: center;\n  background: ", ";\n  border-radius: 4px;\n  display: flex;\n  justify-content: space-between;\n  padding: 4px;\n"], ["\n  align-items: center;\n  background: ", ";\n  border-radius: 4px;\n  display: flex;\n  justify-content: space-between;\n  padding: 4px;\n"])), colors.blue100);

package/lib/esm/common/Table/TableView/index.d.ts

@@ -8,4 +8,4 @@ type TableViewWrapperProps = {
     checkboxColumnWidth?: number;
 };
 export declare const TableViewWrapper: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, import("../../../styled/utils").CSSProps & TableViewWrapperProps, never>;
-export declare const TableView: React.MemoExoticComponent<({ data, dataRefIds, columns, pageSize, onRowClick, sortBy, isLoading, setSortBy, rowWidthScalingFactor, tableHeadersHeight, rowHeight, h, onTableScroll, getItemKey, isDraggable, checkboxColumnWidth, isFiltering, ...props }: TableViewProps) => JSX.Element>;
+export declare const TableView: React.MemoExoticComponent<({ data, dataRefIds, columns, pageSize, onRowClick, sortBy, isLoading, setSortBy, rowWidthScalingFactor, tableHeadersHeight, rowHeight, h, onTableScroll, getItemKey, isDraggable, checkboxColumnWidth, isFiltering, shouldHideTable, ...props }: TableViewProps) => JSX.Element>;

package/lib/esm/common/Table/TableView/index.js

@@ -66,7 +66,7 @@ var buildGridStyles = function (rowWidthScalingFactor) {
     return gridStyles;
 };
 export var TableView = React.memo(function (_a) {
-    var _b = _a.data, data = _b === void 0 ? null : _b, _c = _a.dataRefIds, dataRefIds = _c === void 0 ? null : _c, columns = _a.columns, pageSize = _a.pageSize, _d = _a.onRowClick, onRowClick = _d === void 0 ? null : _d, _e = _a.sortBy, sortBy = _e === void 0 ? { field: null, direction: null } : _e, _f = _a.isLoading, isLoading = _f === void 0 ? false : _f, _g = _a.setSortBy, setSortBy = _g === void 0 ? null : _g, _h = _a.rowWidthScalingFactor, rowWidthScalingFactor = _h === void 0 ? 1 : _h, _j = _a.tableHeadersHeight, tableHeadersHeight = _j === void 0 ? defaultTableHeaderHeightPx : _j, _k = _a.rowHeight, rowHeight = _k === void 0 ? defaultTableRowHeightPx : _k, _l = _a.h, h = _l === void 0 ? 500 : _l, _m = _a.onTableScroll, onTableScroll = _m === void 0 ? null : _m, _o = _a.getItemKey, getItemKey = _o === void 0 ? null : _o, _p = _a.isDraggable, isDraggable = _p === void 0 ? false : _p, checkboxColumnWidth = _a.checkboxColumnWidth, _q = _a.isFiltering, isFiltering = _q === void 0 ? false : _q, props = __rest(_a, ["data", "dataRefIds", "columns", "pageSize", "onRowClick", "sortBy", "isLoading", "setSortBy", "rowWidthScalingFactor", "tableHeadersHeight", "rowHeight", "h", "onTableScroll", "getItemKey", "isDraggable", "checkboxColumnWidth", "isFiltering"]);
+    var _b = _a.data, data = _b === void 0 ? null : _b, _c = _a.dataRefIds, dataRefIds = _c === void 0 ? null : _c, columns = _a.columns, pageSize = _a.pageSize, _d = _a.onRowClick, onRowClick = _d === void 0 ? null : _d, _e = _a.sortBy, sortBy = _e === void 0 ? { field: null, direction: null } : _e, _f = _a.isLoading, isLoading = _f === void 0 ? false : _f, _g = _a.setSortBy, setSortBy = _g === void 0 ? null : _g, _h = _a.rowWidthScalingFactor, rowWidthScalingFactor = _h === void 0 ? 1 : _h, _j = _a.tableHeadersHeight, tableHeadersHeight = _j === void 0 ? defaultTableHeaderHeightPx : _j, _k = _a.rowHeight, rowHeight = _k === void 0 ? defaultTableRowHeightPx : _k, _l = _a.h, h = _l === void 0 ? 500 : _l, _m = _a.onTableScroll, onTableScroll = _m === void 0 ? null : _m, _o = _a.getItemKey, getItemKey = _o === void 0 ? null : _o, _p = _a.isDraggable, isDraggable = _p === void 0 ? false : _p, checkboxColumnWidth = _a.checkboxColumnWidth, _q = _a.isFiltering, isFiltering = _q === void 0 ? false : _q, _r = _a.shouldHideTable, shouldHideTable = _r === void 0 ? false : _r, props = __rest(_a, ["data", "dataRefIds", "columns", "pageSize", "onRowClick", "sortBy", "isLoading", "setSortBy", "rowWidthScalingFactor", "tableHeadersHeight", "rowHeight", "h", "onTableScroll", "getItemKey", "isDraggable", "checkboxColumnWidth", "isFiltering", "shouldHideTable"]);
     var headerContainerRef = useRef();
     var rowCount = dataRefIds ? dataRefIds.ids.length : data.length;
     var onScroll = function (_a) {
@@ -106,7 +106,7 @@ export var TableView = React.memo(function (_a) {
                         width: autosizerWidth,
                         columnCount: 1,
                         onScroll: onScroll,
-                        columnWidth: rowWidth,
+                        columnWidth: shouldHideTable ? 0 : rowWidth,
                         height: autosizerHeight - tableHeadersHeight,
                         rowHeight: rowHeight,
                         rowCount: rowCount,

package/lib/esm/common/Table/TableView/types.d.ts

@@ -32,4 +32,5 @@ export type TableViewProps = {
     isDraggable?: boolean;
     checkboxColumnWidth?: number;
     isFiltering?: boolean;
+    shouldHideTable?: boolean;
 } & DivCSSProps;

package/lib/esm/common/Toast.d.ts

@@ -1,9 +1,12 @@
+import { CSSProperties } from "react";
 import { ToastOptions } from "react-hot-toast";
 type ToastProps = {
     zIndex?: number;
+    toastStyle?: CSSProperties;
 };
 type ToastTypes = keyof typeof toastTypeStyles;
 export declare const addToast: (msg: JSX.Element | string, type?: ToastTypes, toastOptions?: ToastOptions) => void;
+export declare const addLoadingToast: (msg: JSX.Element | string, helperMsg: JSX.Element | string, toastOptions?: ToastOptions, minW?: number) => void;
 declare const toastTypeStyles: {
     error: {
         color: string;
@@ -30,6 +33,11 @@ declare const toastTypeStyles: {
         backgroundColor: string;
         icon: JSX.Element;
     };
+    loadingNotification: {
+        color: string;
+        backgroundColor: string;
+        icon: JSX.Element;
+    };
 };
-declare const Toast: ({ zIndex }: ToastProps) => JSX.Element;
+declare const Toast: ({ zIndex, toastStyle }: ToastProps) => JSX.Element;
 export { Toast };

package/lib/esm/common/Toast.js

@@ -18,21 +18,37 @@ import toast, { ToastBar, Toaster, } from "react-hot-toast";
 import styled from "styled-components";
 import { colors } from "../styled/theme/colorPalette";
 import { Div } from "../styled/utils";
+import { CircleSpinner } from "./CircleSpinner";
 import { greenCheckIcon, infoIcon, notificationCheckIcon, redXIcon, warningIcon, } from "./icons";
 var defaultDuration = 5000;
 var defaultPosition = "bottom-right";
 var toastBorderRadius = 4;
 var toastMaxWidth = "85%";
-export var addToast = function (msg, type, toastOptions) {
-    if (type === void 0) { type = "notification"; }
-    if (toastOptions === void 0) { toastOptions = {}; }
+var LoadingNotifToastContainer = styled(Div)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  align-items: center;\n  display: flex;\n  gap: 16px;\n  justify-content: space-between;\n"], ["\n  align-items: center;\n  display: flex;\n  gap: 16px;\n  justify-content: space-between;\n"])));
+var genToastOptions = function (type, toastOptions) {
     var stylingByType = toastTypeStyles[type];
     var _toastOptions = __assign({ duration: defaultDuration, position: defaultPosition, style: {
             background: stylingByType.backgroundColor,
             color: stylingByType.color,
         }, icon: stylingByType.icon }, toastOptions);
+    return _toastOptions;
+};
+export var addToast = function (msg, type, toastOptions) {
+    if (type === void 0) { type = "notification"; }
+    if (toastOptions === void 0) { toastOptions = {}; }
+    var _toastOptions = genToastOptions(type, toastOptions);
     toast(msg, _toastOptions);
 };
+export var addLoadingToast = function (msg, helperMsg, toastOptions, minW) {
+    if (toastOptions === void 0) { toastOptions = {}; }
+    if (minW === void 0) { minW = 320; }
+    var _toastOptions = genToastOptions("loadingNotification", toastOptions);
+    var message = msg;
+    if (msg && helperMsg) {
+        message = (_jsxs(LoadingNotifToastContainer, __assign({ minw: minW }, { children: [_jsx("span", { children: msg }), " ", _jsx("span", { children: helperMsg })] })));
+    }
+    toast(message, _toastOptions);
+};
 var toastContainerCss = {
     padding: 0,
     marginRight: 72,
@@ -66,11 +82,16 @@ var toastTypeStyles = {
         backgroundColor: colors.black,
         icon: notificationCheckIcon,
     },
+    loadingNotification: {
+        color: colors.white,
+        backgroundColor: colors.black,
+        icon: _jsx(CircleSpinner, {}),
+    },
 };
-var ToastWrapper = styled(Div)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  padding: 10px;\n  box-shadow: 0px 2px 8px 1px rgba(0, 0, 0, 0.1);\n  border-radius: ", "px;\n  ", ";\n"], ["\n  padding: 10px;\n  box-shadow: 0px 2px 8px 1px rgba(0, 0, 0, 0.1);\n  border-radius: ", "px;\n  ", ";\n"])), toastBorderRadius, function (p) { return p.theme.css.alignCenter; });
-var IconWrapper = styled(Div)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  margin-right: 10px;\n"], ["\n  margin-right: 10px;\n"])));
+var ToastWrapper = styled(Div)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  padding: 10px;\n  box-shadow: 0px 2px 8px 1px rgba(0, 0, 0, 0.1);\n  border-radius: ", "px;\n  ", ";\n"], ["\n  padding: 10px;\n  box-shadow: 0px 2px 8px 1px rgba(0, 0, 0, 0.1);\n  border-radius: ", "px;\n  ", ";\n"])), toastBorderRadius, function (p) { return p.theme.css.alignCenter; });
+var IconWrapper = styled(Div)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  margin-right: 10px;\n"], ["\n  margin-right: 10px;\n"])));
 var Toast = function (_a) {
-    var zIndex = _a.zIndex;
+    var zIndex = _a.zIndex, toastStyle = _a.toastStyle;
     return (_jsx(Toaster, __assign({ toastOptions: {
             style: toastContainerCss,
         }, containerStyle: {
@@ -78,9 +99,9 @@ var Toast = function (_a) {
         } }, { children: function (t) { return (_jsx(ToastBar, __assign({ toast: t }, { children: function (_a) {
                 var message = _a.message, hotToastIcon = _a.icon;
                 var _b = toastTypeStyles[t.type] || {}, icon = _b.icon, color = _b.color, backgroundColor = _b.backgroundColor;
-                return (_jsxs(ToastWrapper, __assign({ c: color, bg: backgroundColor }, { children: [_jsx(IconWrapper, __assign({ alignCenter: true }, { children: icon || hotToastIcon })), _jsx(Div, __assign({ alignCenter: true }, { children: message })), _jsx(Div, __assign({ p: 5, clickable: true, onClick: function () { return toast.dismiss(t.id); } }, { children: closeIcon }))] })));
+                return (_jsxs(ToastWrapper, __assign({ c: color, bg: backgroundColor, style: toastStyle }, { children: [_jsx(IconWrapper, __assign({ alignCenter: true }, { children: icon || hotToastIcon })), _jsx(Div, __assign({ alignCenter: true }, { children: message })), _jsx(Div, __assign({ p: 5, clickable: true, onClick: function () { return toast.dismiss(t.id); } }, { children: closeIcon }))] })));
             } }))); } })));
 };
 export { Toast };
 var closeIcon = (_jsxs("svg", __assign({ width: "10", height: "10", viewBox: "0 0 10 10", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, { children: [_jsx("path", { d: "M2.5 2.5L7.82258 7.82258", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }), _jsx("path", { d: "M2.5 7.82251L7.82258 2.49993", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" })] })));
-var templateObject_1, templateObject_2;
+var templateObject_1, templateObject_2, templateObject_3;

package/lib/esm/common/icons/index.js

@@ -14,9 +14,9 @@ import { useTheme } from "styled-components";
 export var closeIcon = (_jsxs("svg", __assign({ width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, { children: [_jsx("path", { d: "M6 6.00003L18.7742 18.7742", stroke: "black", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }), _jsx("path", { d: "M6 18.7742L18.7742 6.00001", stroke: "black", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" })] })));
 export var closeIconCondensed = (_jsxs("svg", __assign({ width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, { children: [_jsx("path", { d: "M6 6.00003L18.7742 18.7742", stroke: "#333333", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }), _jsx("path", { d: "M6 18.7742L18.7742 6.00001", stroke: "#333333", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" })] })));
 export var checkIcon = (_jsx("svg", __assign({ width: "12", height: "10", viewBox: "0 0 12 10", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, { children: _jsx("path", { d: "M1.37805 5.80142L3.94469 8.28708L10.6827 1.52003", stroke: "white", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) })));
-export var greenCheckIcon = (_jsx("svg", __assign({ width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, { children: _jsx("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M12 23C18.0751 23 23 18.0751 23 12C23 5.92487 18.0751 1 12 1C5.92487 1 1 5.92487 1 12C1 18.0751 5.92487 23 12 23ZM9.70711 11.2426C9.31658 10.8521 8.68342 10.8521 8.29289 11.2426C7.90237 11.6331 7.90237 12.2663 8.29289 12.6568L10.4142 14.7781L11.1213 15.4852L11.8284 14.7781L16.0711 10.5355C16.4616 10.145 16.4616 9.5118 16.0711 9.12128C15.6805 8.73076 15.0474 8.73076 14.6569 9.12128L11.1213 12.6568L9.70711 11.2426Z", fill: "#025F40" }) })));
-export var redXIcon = (_jsx("svg", __assign({ width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, { children: _jsx("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M12 23C18.0751 23 23 18.0751 23 12C23 5.92487 18.0751 1 12 1C5.92487 1 1 5.92487 1 12C1 18.0751 5.92487 23 12 23ZM8.29289 15.7071C7.90237 15.3166 7.90237 14.6834 8.29289 14.2929L10.5858 12L8.29289 9.70711C7.90237 9.31658 7.90237 8.68342 8.29289 8.29289C8.68342 7.90237 9.31658 7.90237 9.70711 8.29289L12 10.5858L14.2929 8.29289C14.6834 7.90237 15.3166 7.90237 15.7071 8.29289C16.0976 8.68342 16.0976 9.31658 15.7071 9.70711L13.4142 12L15.7071 14.2929C16.0976 14.6834 16.0976 15.3166 15.7071 15.7071C15.3166 16.0976 14.6834 16.0976 14.2929 15.7071L12 13.4142L9.70711 15.7071C9.31658 16.0976 8.68342 16.0976 8.29289 15.7071Z", fill: "#5C1008" }) })));
-export var warningIcon = (_jsx("svg", __assign({ width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, { children: _jsx("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M12 23C18.0751 23 23 18.0751 23 12C23 5.92487 18.0751 1 12 1C5.92487 1 1 5.92487 1 12C1 18.0751 5.92487 23 12 23ZM12 6C12.5523 6 13 6.44772 13 7V12C13 12.5523 12.5523 13 12 13C11.4477 13 11 12.5523 11 12V7C11 6.44772 11.4477 6 12 6ZM12 15C12.5523 15 13 15.4477 13 16V16.5C13 17.0523 12.5523 17.5 12 17.5C11.4477 17.5 11 17.0523 11 16.5V16C11 15.4477 11.4477 15 12 15Z", fill: "#78430D" }) })));
+export var greenCheckIcon = (_jsx("svg", __assign({ width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, { children: _jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M12 23C18.0751 23 23 18.0751 23 12C23 5.92487 18.0751 1 12 1C5.92487 1 1 5.92487 1 12C1 18.0751 5.92487 23 12 23ZM9.70711 11.2426C9.31658 10.8521 8.68342 10.8521 8.29289 11.2426C7.90237 11.6331 7.90237 12.2663 8.29289 12.6568L10.4142 14.7781L11.1213 15.4852L11.8284 14.7781L16.0711 10.5355C16.4616 10.145 16.4616 9.5118 16.0711 9.12128C15.6805 8.73076 15.0474 8.73076 14.6569 9.12128L11.1213 12.6568L9.70711 11.2426Z", fill: "#025F40" }) })));
+export var redXIcon = (_jsx("svg", __assign({ width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, { children: _jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M12 23C18.0751 23 23 18.0751 23 12C23 5.92487 18.0751 1 12 1C5.92487 1 1 5.92487 1 12C1 18.0751 5.92487 23 12 23ZM8.29289 15.7071C7.90237 15.3166 7.90237 14.6834 8.29289 14.2929L10.5858 12L8.29289 9.70711C7.90237 9.31658 7.90237 8.68342 8.29289 8.29289C8.68342 7.90237 9.31658 7.90237 9.70711 8.29289L12 10.5858L14.2929 8.29289C14.6834 7.90237 15.3166 7.90237 15.7071 8.29289C16.0976 8.68342 16.0976 9.31658 15.7071 9.70711L13.4142 12L15.7071 14.2929C16.0976 14.6834 16.0976 15.3166 15.7071 15.7071C15.3166 16.0976 14.6834 16.0976 14.2929 15.7071L12 13.4142L9.70711 15.7071C9.31658 16.0976 8.68342 16.0976 8.29289 15.7071Z", fill: "#5C1008" }) })));
+export var warningIcon = (_jsx("svg", __assign({ width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, { children: _jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M12 23C18.0751 23 23 18.0751 23 12C23 5.92487 18.0751 1 12 1C5.92487 1 1 5.92487 1 12C1 18.0751 5.92487 23 12 23ZM12 6C12.5523 6 13 6.44772 13 7V12C13 12.5523 12.5523 13 12 13C11.4477 13 11 12.5523 11 12V7C11 6.44772 11.4477 6 12 6ZM12 15C12.5523 15 13 15.4477 13 16V16.5C13 17.0523 12.5523 17.5 12 17.5C11.4477 17.5 11 17.0523 11 16.5V16C11 15.4477 11.4477 15 12 15Z", fill: "#78430D" }) })));
 export var infoIcon = (_jsx("svg", __assign({ width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, { children: _jsx("path", { d: "M12 17.5C12.3117 17.5 12.5729 17.3946 12.7837 17.1838C12.9946 16.9729 13.1 16.7117 13.1 16.4V12C13.1 11.6883 12.9946 11.4271 12.7837 11.2163C12.5729 11.0054 12.3117 10.9 12 10.9C11.6883 10.9 11.4271 11.0054 11.2163 11.2163C11.0054 11.4271 10.9 11.6883 10.9 12V16.4C10.9 16.7117 11.0054 16.9729 11.2163 17.1838C11.4271 17.3946 11.6883 17.5 12 17.5ZM12 8.7C12.3117 8.7 12.5729 8.59458 12.7837 8.38375C12.9946 8.17292 13.1 7.91167 13.1 7.6C13.1 7.28833 12.9946 7.02708 12.7837 6.81625C12.5729 6.60542 12.3117 6.5 12 6.5C11.6883 6.5 11.4271 6.60542 11.2163 6.81625C11.0054 7.02708 10.9 7.28833 10.9 7.6C10.9 7.91167 11.0054 8.17292 11.2163 8.38375C11.4271 8.59458 11.6883 8.7 12 8.7ZM12 23C10.4783 23 9.04833 22.7113 7.71 22.1337C6.37167 21.5562 5.2075 20.7725 4.2175 19.7825C3.2275 18.7925 2.44375 17.6283 1.86625 16.29C1.28875 14.9517 1 13.5217 1 12C1 10.4783 1.28875 9.04833 1.86625 7.71C2.44375 6.37167 3.2275 5.2075 4.2175 4.2175C5.2075 3.2275 6.37167 2.44375 7.71 1.86625C9.04833 1.28875 10.4783 1 12 1C13.5217 1 14.9517 1.28875 16.29 1.86625C17.6283 2.44375 18.7925 3.2275 19.7825 4.2175C20.7725 5.2075 21.5562 6.37167 22.1337 7.71C22.7113 9.04833 23 10.4783 23 12C23 13.5217 22.7113 14.9517 22.1337 16.29C21.5562 17.6283 20.7725 18.7925 19.7825 19.7825C18.7925 20.7725 17.6283 21.5562 16.29 22.1337C14.9517 22.7113 13.5217 23 12 23Z", fill: "#025B5B" }) })));
 export var notificationCheckIcon = (_jsx("svg", __assign({ width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, { children: _jsx("path", { d: "M4 12.3137L9.65685 17.9706L20.9706 6.65687", stroke: "white", "stroke-width": "2", "stroke-linecap": "round" }) })));
 export var defaultCheckIcon = (_jsxs("svg", __assign({ width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, { children: [_jsx("circle", { cx: "12", cy: "12", r: "11", stroke: "currentColor", strokeWidth: "2" }), _jsx("path", { d: "M9 11.9497L11.1213 14.071L15.364 9.82839", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round" })] })));

package/lib/esm/common/inputs/Autocomplete.js

@@ -56,7 +56,7 @@ var Autocomplete = function (_a) {
     var _k = useState(false), isTyping = _k[0], setIsTyping = _k[1];
     var t = useTranslation().t;
     useEffect(function () {
-        if (value)
+        if (value !== null && value !== undefined)
             setText(selectedLabel);
         else
             setText("");