fuse-importer 0.23.8 → 0.24.0

package/lib/esm/Importer/Stepper/index.js

@@ -0,0 +1,97 @@
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useState } from "react";
+import styled, { css } from "styled-components";
+import { Button, closeIconCondensed, ChevronRightIcon } from "../../common";
+import { Div } from "../../styled/utils";
+import { contentWidth } from "../common";
+import { useImporterContext } from "../contexts/ImporterContextProvider";
+import { useReviewContext } from "../Review/ReviewContextProvider";
+import { ColumnType } from "../Matcher/common/types";
+import { getEnumFieldValueMatchingsInitialValue } from "./common/getEnumFieldValueMatchingsInitialValue";
+import { Step } from "./Step";
+import { StepperSubmitModal } from "./StepperSubmitModal";
+import { UnmatchedHeadersModal } from "./UnmatchedHeadersModal";
+var StepperWrapper = styled(Div)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  background-color: ", ";\n  border-bottom: 1px solid ", ";\n  user-select: none;\n"], ["\n  background-color: ", ";\n  border-bottom: 1px solid ", ";\n  user-select: none;\n"])), function (p) { return p.theme.colors.white; }, function (p) { return p.theme.colors.gray300; });
+var Logo = styled.img(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  max-height: 70px;\n  max-width: 300px;\n  position: absolute;\n  left: 41px;\n"], ["\n  max-height: 70px;\n  max-width: 300px;\n  position: absolute;\n  left: 41px;\n"])));
+var CloseIcon = styled(Div)(function () { return css(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n    position: absolute;\n    right: 41px;\n  "], ["\n    position: absolute;\n    right: 41px;\n  "]))); });
+export var Stepper = function (_a) {
+    var stepLabels = _a.stepLabels, logoURL = _a.logoURL;
+    var _b = useState(false), isUnmatchedHeadersModalOpen = _b[0], setIsUnmatchedHeadersModalOpen = _b[1];
+    var _c = useState(false), isSubmitModalOpen = _c[0], setIsSubmitModalOpen = _c[1];
+    var _d = useReviewContext(), appResponse = _d.appResponse, isSubmitDisabled = _d.isSubmitDisabled, onSubmit = _d.onSubmit;
+    var _e = useImporterContext(), currentStepIndex = _e.currentStepIndex, templateHeaderMatchings = _e.templateHeaderMatchings, matcherSubstep = _e.matcherSubstep, templateHeaders = _e.templateHeaders, uploadedDataEnumFieldValues = _e.uploadedDataEnumFieldValues, setEnumFieldValueMatchings = _e.setEnumFieldValueMatchings, setMatcherSubstep = _e.setMatcherSubstep, setCurrentStepIndex = _e.setCurrentStepIndex, onClose = _e.onClose;
+    var templateHeaderLabels = Object.keys(templateHeaderMatchings || []);
+    var unmatchedHeadersCount = templateHeaderLabels.filter(function (templateHeaderLabel) { return !templateHeaderMatchings[templateHeaderLabel]; }).length;
+    var isLastSubMatchStep = matcherSubstep === 1;
+    var setStep = function () {
+        var templateHasEnumFields = !!(templateHeaders === null || templateHeaders === void 0 ? void 0 : templateHeaders.find(function (header) { return header.column_type === ColumnType.enum; }));
+        if (templateHasEnumFields) {
+            var _enumFieldValueMatchings = getEnumFieldValueMatchingsInitialValue({
+                uploadedDataEnumFieldValues: uploadedDataEnumFieldValues,
+                templateHeaders: templateHeaders,
+            });
+            var anyTemplateEnumFieldsMatched = Object.keys(_enumFieldValueMatchings).length > 0;
+            if (anyTemplateEnumFieldsMatched) {
+                setEnumFieldValueMatchings(_enumFieldValueMatchings);
+                setMatcherSubstep(1);
+            }
+            else {
+                setCurrentStepIndex(2);
+            }
+        }
+        else {
+            setCurrentStepIndex(2);
+        }
+    };
+    var openUnmatchedModal = function () {
+        unmatchedHeadersCount ? setIsUnmatchedHeadersModalOpen(true) : setStep();
+    };
+    var continueToNextStep = function () {
+        if (isLastSubMatchStep) {
+            setIsUnmatchedHeadersModalOpen(false);
+            setCurrentStepIndex(2);
+        }
+        else {
+            openUnmatchedModal();
+        }
+    };
+    var goBack = function () {
+        var isMatchingColumnValues = matcherSubstep === 1;
+        var isInMachStep = currentStepIndex === 1;
+        var shouldBackOnlyMatcherSubStep = isMatchingColumnValues && isInMachStep;
+        if (shouldBackOnlyMatcherSubStep) {
+            setMatcherSubstep(matcherSubstep - 1);
+        }
+        else {
+            setCurrentStepIndex(currentStepIndex - 1);
+        }
+    };
+    var isMatchStep = currentStepIndex === 1;
+    var isReviewStep = currentStepIndex === 2;
+    var stepsUI = (_jsx(Div, __assign({ dflex: true, centered: true }, { children: stepLabels.map(function (label, index) {
+            var isLast = index === stepLabels.length - 1;
+            var isCompleted = index < currentStepIndex;
+            return (_jsxs(Div, __assign({ centered: true }, { children: [_jsx(Step, { index: index, label: label, isCompleted: isCompleted, isSelected: index === currentStepIndex }), !isLast && (_jsx(Div, __assign({ ml: 18, mr: 18, dflex: true }, { children: _jsx(ChevronRightIcon, {}) })))] }), index));
+        }) })));
+    var leftButtonUI = (_jsx(Div, __assign({ w: 100 }, { children: currentStepIndex > 0 && !appResponse && (_jsx(Button, __assign({ variant: "secondary", onClick: goBack }, { children: "Go back" }))) })));
+    var rightButtonUI = (_jsxs(Div, __assign({ w: 100 }, { children: [isMatchStep && (_jsx(Button, __assign({ variant: "primary", onClick: continueToNextStep }, { children: "Continue" }))), isReviewStep && (_jsx(Button, __assign({ variant: "primary", isDisabled: isSubmitDisabled, onClick: function () { return setIsSubmitModalOpen(true); } }, { children: "Submit" })))] })));
+    return (_jsxs(_Fragment, { children: [_jsxs(StepperWrapper, __assign({ pRelative: true, alignCenter: true, w100: true, h: 96, centered: true }, { children: [logoURL && _jsx(Logo, { src: logoURL, alt: "" }), _jsxs(Div, __assign({ spaceBetween: true, w: contentWidth }, { children: [leftButtonUI, _jsx(Div, __assign({ alignCenter: true }, { children: stepsUI })), rightButtonUI] })), _jsx(CloseIcon, __assign({ "data-test-id": "close-importer", centered: true, clickable: true, onClick: onClose }, { children: closeIconCondensed }))] })), _jsx(UnmatchedHeadersModal, { isUnmatchedHeadersModalOpen: isUnmatchedHeadersModalOpen, unmatchedHeadersCount: unmatchedHeadersCount, onSetStep: function () { return setStep(); }, onCloseUnmatchedHeadersModal: function () {
+                    return setIsUnmatchedHeadersModalOpen(false);
+                } }), _jsx(StepperSubmitModal, { isSubmitModalOpen: isSubmitModalOpen, onCloseModal: function () { return setIsSubmitModalOpen(false); }, onSubmit: onSubmit })] }));
+};
+var templateObject_1, templateObject_2, templateObject_3;

package/lib/esm/Importer/TrialModeBanner.js

@@ -11,13 +11,12 @@ var __assign = (this && this.__assign) || function () {
 };
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { Button } from "../common";
-import { theme } from "../styled/theme";
-import { Div, Span } from "../styled/utils";
-import { useImporterContext } from "./ImporterContextProvider";
+import { Div, Span, theme } from "../styled";
+import { exclamationPointIcon } from "./common/icons";
+import { useImporterContext } from "./contexts/ImporterContextProvider";
 export var TrialModeBanner = function () {
     var inTrialMode = useImporterContext().inTrialMode;
     return (_jsx(_Fragment, { children: inTrialMode && (_jsxs(Div, __assign({ bg: theme.colors.orange100, h: 80, dflex: true, alignCenter: true, justifyCenter: true }, { children: [_jsx(Div, __assign({ ml: 33, mr: 8 }, { children: exclamationPointIcon })), _jsx(Span, __assign({ mr: 16 }, { children: "You're currently in Trial mode. Subscribe to a plan to deploy to your website." })), _jsx(Button, __assign({ w: 120, br: 8, variant: "secondary", onClick: function () {
                         window.location.href = "".concat(process.env.REACT_APP_API_BASE_URL, "/account/billing");
                     } }, { children: "Select plan" }))] }))) }));
 };
-var exclamationPointIcon = (_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: "#FF9A34" }) })));

package/lib/esm/Importer/Uploader/DragAndDropImporter/ImporterDropzone.js

@@ -18,7 +18,7 @@ import { useDropzone } from "react-dropzone";
 import styled, { css } from "styled-components";
 import XLSX from "xlsx";
 import { useUploaderContext } from "../UploaderContextProvider";
-import { useImporterContext } from "../../ImporterContextProvider";
+import { useImporterContext } from "../../contexts/ImporterContextProvider";
 import { Div } from "../../../styled/utils";
 import { theme } from "../../../styled/theme";
 import { addToast } from "../../../common/Toast";

package/lib/esm/Importer/Uploader/DragAndDropImporter/index.js

@@ -26,13 +26,13 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import styled from "styled-components";
-import { closeIconWithCircle, errorIcon, fileExtensionIcon, } from "../../common/icons";
-import { ImporterDropzone } from "./ImporterDropzone";
-import { useUploaderContext } from "../UploaderContextProvider";
-import { useImporterContext, } from "../../ImporterContextProvider";
 import { theme } from "../../../styled/theme";
 import { colors } from "../../../styled/theme/colorPalette";
 import { Div } from "../../../styled/utils";
+import { closeIconWithCircle, errorIcon, fileExtensionIcon, } from "../../common/icons";
+import { useImporterContext } from "../../contexts/ImporterContextProvider";
+import { useUploaderContext } from "../UploaderContextProvider";
+import { ImporterDropzone } from "./ImporterDropzone";
 var HeaderCardWrapper = styled(Div)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  border: 1px solid ", ";\n  border-radius: 8px;\n  padding: 24px;\n  box-sizing: border-box;\n  width: 256px;\n  overflow-y: auto;\n  ", ";\n  background: ", ";\n  max-height: 530px;\n"], ["\n  border: 1px solid ", ";\n  border-radius: 8px;\n  padding: 24px;\n  box-sizing: border-box;\n  width: 256px;\n  overflow-y: auto;\n  ", ";\n  background: ", ";\n  max-height: 530px;\n"])), theme.colors.gray200, function (p) { return p.theme.css.scrollbarDark; }, function (p) { return p.theme.colors.white; });
 var ErrorCardContainer = styled(Div)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  border-radius: 8px;\n  width: 1120px;\n  height: 550px;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  background: ", ";\n  border: 1px dashed ", ";\n  justify-content: center;\n"], ["\n  border-radius: 8px;\n  width: 1120px;\n  height: 550px;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  background: ", ";\n  border: 1px dashed ", ";\n  justify-content: center;\n"])), theme.colors.blue100, theme.colors.blue500);
 export var ErrorCard = function () {

package/lib/esm/Importer/Uploader/HeaderButtons.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare const HeaderButtons: () => JSX.Element;

package/lib/esm/Importer/Uploader/HeaderButtons.js

@@ -0,0 +1,29 @@
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import styled from "styled-components";
+import { Button } from "../../common/buttons";
+import { Div } from "../../styled/utils";
+import { useImporterContext } from "../contexts/ImporterContextProvider";
+var HeaderButtonsWrapper = styled(Div)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  > div {\n    margin-left: 8px;\n    margin-right: 8px;\n  }\n"], ["\n  > div {\n    margin-left: 8px;\n    margin-right: 8px;\n  }\n"])));
+export var HeaderButtons = function () {
+    var _a = useImporterContext(), setCurrentStepIndex = _a.setCurrentStepIndex, resetImport = _a.resetImport;
+    var onClick = function () {
+        setCurrentStepIndex(1);
+    };
+    return (_jsxs(HeaderButtonsWrapper, __assign({ dflex: true, spaceBetween: true, mb: 12 }, { children: [_jsx(Button, __assign({ w: 180, isSmall: true, variant: "secondary", onClick: resetImport }, { children: "No, Re-upload file" })), _jsx(Button, __assign({ w: 142, isSmall: true, onClick: onClick }, { children: "Yes, continue" }))] })));
+};
+var templateObject_1;

package/lib/esm/Importer/Uploader/HeadersPreview.js

@@ -1,7 +1,3 @@
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-    return cooked;
-};
 var __assign = (this && this.__assign) || function () {
     __assign = Object.assign || function(t) {
         for (var s, i = 1, n = arguments.length; i < n; i++) {
@@ -13,68 +9,14 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
-var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
-    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
-        if (ar || !(i in from)) {
-            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
-            ar[i] = from[i];
-        }
-    }
-    return to.concat(ar || Array.prototype.slice.call(from));
-};
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { Button } from "../../common/buttons";
-import styled from "styled-components";
-import { Spreadsheet } from "../common/Spreadsheet";
-import { useImporterContext } from "../ImporterContextProvider";
-import { FieldTypes } from "../../types";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Div } from "../../styled/utils";
+import Spreadsheet from "../common/Spreadsheet";
 import { getSpreadsheetRowWidth } from "../common/utils";
-import { useMemo } from "react";
-var HeaderButtonsWrapper = styled(Div)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  > div {\n    margin-left: 8px;\n    margin-right: 8px;\n  }\n"], ["\n  > div {\n    margin-left: 8px;\n    margin-right: 8px;\n  }\n"])));
-var HeaderButtons = function () {
-    var _a = useImporterContext(), setCurrentStepIndex = _a.setCurrentStepIndex, resetImport = _a.resetImport;
-    var onClick = function () {
-        setCurrentStepIndex(1);
-    };
-    return (_jsxs(HeaderButtonsWrapper, __assign({ dflex: true, spaceBetween: true, mb: 12 }, { children: [_jsx(Button, __assign({ w: 180, isSmall: true, variant: "secondary", onClick: resetImport }, { children: "No, Re-upload file" })), _jsx(Button, __assign({ w: 142, isSmall: true, onClick: onClick }, { children: "Yes, continue" }))] })));
-};
+import { useReviewContext } from "../Review/ReviewContextProvider";
+import { HeaderButtons } from "./HeaderButtons";
 var HeadersPreview = function () {
-    var uploadedData = useImporterContext().uploadedData;
-    var formattedData = useMemo(function () {
-        var firstRowLen = 0;
-        if (uploadedData.length > 0 && Array.isArray(uploadedData[0])) {
-            firstRowLen = uploadedData[0].length;
-        }
-        var placeholderHeaders = new Array(firstRowLen)
-            .fill(null)
-            .map(function (_, i) { return String.fromCharCode(65 + i); });
-        var getDataRows = function () {
-            var emptyRows = [];
-            if (uploadedData.length < 20)
-                while (emptyRows.length < 20 - uploadedData.length)
-                    emptyRows.push(Array(firstRowLen).fill(""));
-            return __spreadArray(__spreadArray([], uploadedData, true), emptyRows, true).map(function (row) {
-                var entry = {};
-                placeholderHeaders.forEach(function (placeholderHeader, index) {
-                    entry[placeholderHeader] = row[index];
-                });
-                return entry;
-            });
-        };
-        return getDataRows();
-    }, [uploadedData]);
-    var readonlyFields = useMemo(function () {
-        return Object.keys(formattedData[0]).map(function (key) {
-            return {
-                label: key,
-                name: key,
-                type: FieldTypes.string,
-                isRequired: false,
-            };
-        });
-    }, []);
-    return (_jsx(_Fragment, { children: _jsxs(Div, __assign({ flexColumn: true, centered: true, pt: 40 }, { children: [_jsx(Div, __assign({ h2: true, mb: 16 }, { children: "Verify Your Column Headers" })), _jsx(Div, __assign({ body1: true, mb: 24, textAlignCenter: true }, { children: "File must contain column headers to proceed." })), _jsx(HeaderButtons, {}), _jsx(Div, __assign({ w100: true, centered: true, mb: 36 }, { children: _jsx(Spreadsheet, { rowWidth: getSpreadsheetRowWidth(readonlyFields, 6), isReadOnly: true, initialData: formattedData, fields: readonlyFields, highlightFirstRow: true }) }))] })) }));
+    var _a = useReviewContext(), fields = _a.previewFields, initialDataSet = _a.previewInitialDataSet;
+    return (_jsxs(Div, __assign({ flexColumn: true, centered: true, pt: 40 }, { children: [_jsx(Div, __assign({ h2: true, mb: 16 }, { children: "Verify Your Column Headers" })), _jsx(Div, __assign({ body1: true, mb: 24, textAlignCenter: true }, { children: "File must contain column headers to proceed." })), _jsx(HeaderButtons, {}), _jsx(Div, __assign({ w100: true, centered: true, mb: 36 }, { children: initialDataSet && (_jsx(Spreadsheet, { rowWidth: getSpreadsheetRowWidth(fields, 6), isReadOnly: true, initialDataSet: initialDataSet, fields: fields, highlightFirstRow: true })) }))] })));
 };
 export default HeadersPreview;
-var templateObject_1;

package/lib/esm/Importer/Uploader/UploaderContextProvider.d.ts

@@ -5,9 +5,9 @@ declare type State = {
     fileName: string;
     setFileName: React.Dispatch<string>;
 };
-declare type Props = {
+declare type UploaderContextProviderProps = {
     children: JSX.Element;
 };
-export declare const UploaderContextProvider: ({ children }: Props) => JSX.Element;
+export declare const UploaderContextProvider: ({ children, }: UploaderContextProviderProps) => JSX.Element;
 export declare const useUploaderContext: () => State;
 export {};

package/lib/esm/Importer/Uploader/index.d.ts

@@ -1,3 +1,3 @@
-/// <reference types="react" />
-declare const Uploader: () => JSX.Element;
-export { Uploader };
+import React from "react";
+declare const _default: React.MemoExoticComponent<() => JSX.Element>;
+export default _default;

package/lib/esm/Importer/Uploader/index.js

@@ -1,13 +1,13 @@
 import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
-import HeadersPreview from "./HeadersPreview";
+import React from "react";
+import { areEqual } from "react-window";
+import { useImporterContext } from "../contexts/ImporterContextProvider";
 import { DragAndDropImporter } from "./DragAndDropImporter";
+import HeadersPreview from "./HeadersPreview";
 import { UploaderContextProvider } from "./UploaderContextProvider";
-import { useImporterContext } from "../ImporterContextProvider";
 var UploaderWithContext = function () {
     var uploadedData = useImporterContext().uploadedData;
     return _jsx(_Fragment, { children: uploadedData ? _jsx(HeadersPreview, {}) : _jsx(DragAndDropImporter, {}) });
 };
-var Uploader = function () {
-    return (_jsx(UploaderContextProvider, { children: _jsx(UploaderWithContext, {}) }));
-};
-export { Uploader };
+var Uploader = function () { return (_jsx(UploaderContextProvider, { children: _jsx(UploaderWithContext, {}) })); };
+export default React.memo(Uploader, areEqual);

package/lib/esm/Importer/common/AppLoading.js

@@ -15,8 +15,8 @@ var __assign = (this && this.__assign) || function () {
 };
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import styled from "styled-components";
-import { Spinner } from "../../common/Spinner";
-import { Div } from "../../styled/utils";
+import { Div } from "../../styled";
+import { Spinner } from "../../common";
 var LoadingBackdrop = styled(Div)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  position: fixed;\n  top: 0px;\n  left: 0px;\n  margin: 0px;\n  width: 100vw;\n  height: 100vh;\n  z-index: 99999999;\n  background: ", ";\n  opacity: 0.6;\n"], ["\n  position: fixed;\n  top: 0px;\n  left: 0px;\n  margin: 0px;\n  width: 100vw;\n  height: 100vh;\n  z-index: 99999999;\n  background: ", ";\n  opacity: 0.6;\n"])), function (props) { return props.theme.colors.white; });
 var ModalContainer = styled(Div)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  top: 0px;\n  left: 0px;\n  margin: 0px;\n  position: fixed;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  z-index: 10000000000;\n  width: 100vw;\n  height: 100vh;\n  pointer-events: none;\n  div {\n    pointer-events: auto;\n  }\n"], ["\n  top: 0px;\n  left: 0px;\n  margin: 0px;\n  position: fixed;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  z-index: 10000000000;\n  width: 100vw;\n  height: 100vh;\n  pointer-events: none;\n  div {\n    pointer-events: auto;\n  }\n"])));
 var LoaderContainer = styled(ModalContainer)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  pointer-events: none;\n"], ["\n  pointer-events: none;\n"])));

package/lib/esm/Importer/common/Footer.js

@@ -0,0 +1,17 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import { colors } from "../../styled/theme/colorPalette";
+import { Div } from "../../styled/utils";
+import { logoIcon } from "./icons";
+var Footer = function () { return (_jsx(Div, __assign({ centered: true, c: colors.gray600, pt: 65, pb: 50 }, { children: logoIcon }))); };
+export { Footer };

package/lib/esm/Importer/{FuseApi.d.ts → common/FuseApi.d.ts}

@@ -1,4 +1,4 @@
-import { EnvironmentType } from "../types";
+import { EnvironmentType } from "../../types";
 import { AxiosRequestConfig, AxiosResponse } from "axios";
 export declare class FuseApi {
     environment: EnvironmentType;

package/lib/esm/Importer/{FuseApi.js → common/FuseApi.js}

@@ -9,8 +9,8 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
-import { api } from "../api";
-import { baseUrls } from "./common/index";
+import { api } from "../../api";
+import { baseUrls } from "./index";
 // copies the axios request config from axios.AxiosInstance type and adds
 // baseUrl based on environment and api key
 var FuseApi = /** @class */ (function () {

package/lib/esm/Importer/common/GlobalStyle.js

@@ -0,0 +1,7 @@
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+import { createGlobalStyle } from "styled-components";
+export var GlobalStyle = createGlobalStyle(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n #fuse-importer-root > * {\n    font-size: 17px;\n    margin: 0;\n    padding: 0;\n    top: 0;\n    left: 0;\n    font-family: DM Sans;\n    color-scheme: normal;\n    color: black;\n  }\n"], ["\n #fuse-importer-root > * {\n    font-size: 17px;\n    margin: 0;\n    padding: 0;\n    top: 0;\n    left: 0;\n    font-family: DM Sans;\n    color-scheme: normal;\n    color: black;\n  }\n"])));
+var templateObject_1;

package/lib/esm/Importer/common/Spreadsheet/SpreadsheetContextProvider.d.ts

@@ -1,46 +1,33 @@
 import React from "react";
-import { AppResponse, SpreadsheetOptions } from "../../..";
-import { BatchValidationErrors, Field, OnValidateBatch, OnValidateRecord, Record } from "../../../types";
-export declare const getBatchErrors: (records: Record[], onValidateRecord: OnValidateRecord) => Promise<BatchValidationErrors>;
+import { SpreadsheetOptions } from "../../..";
+import { Field, OnValidateRecord, Record, RecordDataSet } from "../../../types";
+import { ValidationState } from "./hooks";
+export declare type OnDataSetChanged = (dataSet: RecordDataSet) => void;
+export declare type OnValidationStateChanged = (state: ValidationState) => void;
 declare type State = {
     rowWidth?: number;
-    dataRef: React.MutableRefObject<Record[]>;
     data: Record[];
     fields: Field[];
     isLoading: boolean;
-    setIsLoading: React.Dispatch<React.SetStateAction<boolean>>;
-    isScrollingEnabled: boolean;
-    isValidationComplete: boolean;
-    submittedData: Record[];
-    columnErrorCounts: {
-        [column: string]: number;
-    };
     isReadOnly?: boolean;
-    batchValidationErrors: BatchValidationErrors;
-    batchValidationPercentage: number;
-    totalErrors: number;
-    validateRenderedRecords: (renderedData: Record[]) => Promise<void>;
-    setData: React.Dispatch<React.SetStateAction<Record[]>>;
-    onValidateRecord?: OnValidateRecord;
-    setIsScrollingEnabled: React.Dispatch<boolean>;
     highlightFirstRow: boolean;
     sortByFieldErrors: string;
+    updateRecord: (record: Record) => void;
+    setIsLoading: React.Dispatch<React.SetStateAction<boolean>>;
     setSortByFieldErrors: React.Dispatch<React.SetStateAction<string>>;
-};
+} & ValidationState;
 declare type Props = {
+    initialDataSet: RecordDataSet;
     rowWidth?: number;
-    initialData: any;
     isReadOnly?: boolean;
-    appResponse?: AppResponse;
-    onValidateRecord: OnValidateRecord;
-    onValidateBatch?: OnValidateBatch;
     children: JSX.Element;
     fields: Field[];
     options: SpreadsheetOptions;
     highlightFirstRow: boolean;
-    submittedData?: Record[];
-    setReviewedData?: React.Dispatch<React.SetStateAction<Record[]>>;
+    onValidationStateChanged?: OnValidationStateChanged;
+    onValidateRecord?: OnValidateRecord;
+    onDataSetChanged?: OnDataSetChanged;
 };
-export declare const SpreadsheetContextProvider: ({ initialData, rowWidth, onValidateRecord, onValidateBatch, appResponse, fields, options, isReadOnly, highlightFirstRow, submittedData, setReviewedData, children, }: Props) => JSX.Element;
+export declare const SpreadsheetContextProvider: ({ initialDataSet, rowWidth, fields, options, isReadOnly, highlightFirstRow, children, onValidateRecord, onDataSetChanged, onValidationStateChanged, }: Props) => JSX.Element;
 export declare const useSpreadsheetContext: () => State;
 export {};