@wix/patterns 1.358.0 → 1.360.0

package/dist/cjs/components/ImportButton/ImportStepConfiguration.js

@@ -0,0 +1,220 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports.ImportStepConfiguration = void 0;
+var _designSystem = require("@wix/design-system");
+var _wixUiIconsCommon = require("@wix/wix-ui-icons-common");
+var _react = _interopRequireDefault(require("react"));
+var _mobxReactLite = require("mobx-react-lite");
+var _jsxFileName = "/home/builduser/work/843658b9f44192f0/packages/cairo/dist/cjs/components/ImportButton/ImportStepConfiguration.tsx";
+const COLUMN_WIDTHS = {
+  title: 'minmax(0, 150px)',
+  arrow: '1fr',
+  field: 'minmax(0, 250px)'
+};
+function _ImportStepConfiguration({
+  state
+}) {
+  const {
+    csvHeaders,
+    fields,
+    translate: t
+  } = state;
+  const dropdownOptions = fields.filter(field => field.id != null).map(field => (0, _designSystem.listItemSelectBuilder)({
+    id: field.id,
+    label: field.header,
+    title: field.header
+  }));
+  return /*#__PURE__*/_react.default.createElement(_designSystem.Box, {
+    direction: "vertical",
+    dataHook: "import-mapping-step",
+    __self: this,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 39,
+      columnNumber: 5
+    }
+  }, /*#__PURE__*/_react.default.createElement(_designSystem.Box, {
+    direction: "horizontal",
+    gap: "SP2",
+    verticalAlign: "middle",
+    paddingLeft: "SP4",
+    paddingRight: "SP4",
+    paddingTop: "SP1",
+    paddingBottom: "SP2",
+    __self: this,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 40,
+      columnNumber: 7
+    }
+  }, /*#__PURE__*/_react.default.createElement(_designSystem.Heading, {
+    size: "small",
+    __self: this,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 49,
+      columnNumber: 9
+    }
+  }, t('cairo.import.columnsFound')), /*#__PURE__*/_react.default.createElement(_designSystem.CounterBadge, {
+    size: "medium",
+    skin: "neutralLight",
+    dataHook: "import-columns-found-counter",
+    __self: this,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 50,
+      columnNumber: 9
+    }
+  }, csvHeaders.length)), /*#__PURE__*/_react.default.createElement("div", {
+    style: {
+      overflowY: 'auto',
+      maxHeight: '340px'
+    },
+    __self: this,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 59,
+      columnNumber: 7
+    }
+  }, /*#__PURE__*/_react.default.createElement(_designSystem.Box, {
+    display: "grid",
+    direction: "horizontal",
+    gap: "SP4",
+    padding: "SP2 SP4",
+    backgroundColor: "var(--wds-color-fill-surface-neutral,var(--wsr-color-D75, #F7F8F8))",
+    boxShadow: "inset 0 1px 0 0 var(--wds-color-border-dark-secondary, var(--wsr-color-D60, #DFE5EB)), inset 0 -1px 0 0 var(--wds-color-border-dark-secondary, var(--wsr-color-D60, #DFE5EB))",
+    gridTemplateColumns: `${COLUMN_WIDTHS.title} ${COLUMN_WIDTHS.arrow} ${COLUMN_WIDTHS.field}`,
+    style: {
+      position: 'sticky',
+      top: 0,
+      zIndex: 1
+    },
+    __self: this,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 60,
+      columnNumber: 9
+    }
+  }, /*#__PURE__*/_react.default.createElement(_designSystem.Box, {
+    minWidth: 0,
+    direction: "vertical",
+    __self: this,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 70,
+      columnNumber: 11
+    }
+  }, /*#__PURE__*/_react.default.createElement(_designSystem.Text, {
+    size: "small",
+    weight: "thin",
+    ellipsis: true,
+    __self: this,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 71,
+      columnNumber: 13
+    }
+  }, t('cairo.import.columnTitle'))), /*#__PURE__*/_react.default.createElement(_designSystem.Box, {
+    minWidth: 0,
+    direction: "vertical",
+    __self: this,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 76,
+      columnNumber: 11
+    }
+  }), /*#__PURE__*/_react.default.createElement(_designSystem.Box, {
+    minWidth: 0,
+    direction: "vertical",
+    __self: this,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 78,
+      columnNumber: 11
+    }
+  }, /*#__PURE__*/_react.default.createElement(_designSystem.Text, {
+    size: "small",
+    weight: "thin",
+    ellipsis: true,
+    __self: this,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 79,
+      columnNumber: 13
+    }
+  }, t('cairo.import.collectionField')))), csvHeaders.map(header => /*#__PURE__*/_react.default.createElement(_designSystem.TableListItem, {
+    key: header,
+    showDivider: true,
+    options: [{
+      value: /*#__PURE__*/_react.default.createElement(_designSystem.Text, {
+        ellipsis: true,
+        size: "small",
+        __self: this,
+        __source: {
+          fileName: _jsxFileName,
+          lineNumber: 92,
+          columnNumber: 19
+        }
+      }, header),
+      width: COLUMN_WIDTHS.title
+    }, {
+      value: /*#__PURE__*/_react.default.createElement(_designSystem.Box, {
+        align: "center",
+        __self: this,
+        __source: {
+          fileName: _jsxFileName,
+          lineNumber: 100,
+          columnNumber: 19
+        }
+      }, /*#__PURE__*/_react.default.createElement(_wixUiIconsCommon.ArrowRight, {
+        __self: this,
+        __source: {
+          fileName: _jsxFileName,
+          lineNumber: 101,
+          columnNumber: 21
+        }
+      })),
+      width: COLUMN_WIDTHS.arrow
+    }, {
+      value: /*#__PURE__*/_react.default.createElement(_designSystem.Dropdown, {
+        dataHook: `import-mapping-${header}`,
+        clearButton: true,
+        onClear: () => {
+          state.setMapping(header, null);
+        },
+        placeholder: t('cairo.import.skipColumn'),
+        selectedId: state.mappingByHeader[header] ?? undefined,
+        onSelect: ({
+          id
+        }) => {
+          state.setMapping(header, id);
+        },
+        popoverProps: {
+          appendTo: 'window',
+          zIndex: 5001,
+          flip: true,
+          fixed: false
+        },
+        options: dropdownOptions,
+        size: "small",
+        __self: this,
+        __source: {
+          fileName: _jsxFileName,
+          lineNumber: 108,
+          columnNumber: 19
+        }
+      }),
+      width: COLUMN_WIDTHS.field
+    }],
+    __self: this,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 86,
+      columnNumber: 11
+    }
+  }))));
+}
+const ImportStepConfiguration = exports.ImportStepConfiguration = (0, _mobxReactLite.observer)(_ImportStepConfiguration);
+//# sourceMappingURL=ImportStepConfiguration.js.map

package/dist/cjs/components/ImportButton/ImportStepConfiguration.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_designSystem","require","_wixUiIconsCommon","_react","_interopRequireDefault","_mobxReactLite","_jsxFileName","COLUMN_WIDTHS","title","arrow","field","_ImportStepConfiguration","state","csvHeaders","fields","translate","t","dropdownOptions","filter","id","map","listItemSelectBuilder","label","header","default","createElement","Box","direction","dataHook","__self","__source","fileName","lineNumber","columnNumber","gap","verticalAlign","paddingLeft","paddingRight","paddingTop","paddingBottom","Heading","size","CounterBadge","skin","length","style","overflowY","maxHeight","display","padding","backgroundColor","boxShadow","gridTemplateColumns","position","top","zIndex","minWidth","Text","weight","ellipsis","TableListItem","key","showDivider","options","value","width","align","ArrowRight","Dropdown","clearButton","onClear","setMapping","placeholder","selectedId","mappingByHeader","undefined","onSelect","popoverProps","appendTo","flip","fixed","ImportStepConfiguration","exports","observer"],"sources":["../../../../src/components/ImportButton/ImportStepConfiguration.tsx"],"sourcesContent":["import {\n  Box,\n  CounterBadge,\n  Dropdown,\n  Heading,\n  Text,\n  TableListItem,\n  listItemSelectBuilder,\n} from '@wix/design-system';\nimport { ArrowRight } from '@wix/wix-ui-icons-common';\nimport { ImportState } from '@wix/bex-core';\nimport React from 'react';\nimport { observer } from 'mobx-react-lite';\n\nexport interface ImportStepConfigurationProps {\n  state: ImportState;\n}\n\nconst COLUMN_WIDTHS = {\n  title: 'minmax(0, 150px)',\n  arrow: '1fr',\n  field: 'minmax(0, 250px)',\n};\n\nfunction _ImportStepConfiguration({ state }: ImportStepConfigurationProps) {\n  const { csvHeaders, fields, translate: t } = state;\n\n  const dropdownOptions = fields\n    .filter((field) => field.id != null)\n    .map((field) =>\n      listItemSelectBuilder({\n        id: field.id!,\n        label: field.header,\n        title: field.header,\n      }),\n    );\n\n  return (\n    <Box direction=\"vertical\" dataHook=\"import-mapping-step\">\n      <Box\n        direction=\"horizontal\"\n        gap=\"SP2\"\n        verticalAlign=\"middle\"\n        paddingLeft=\"SP4\"\n        paddingRight=\"SP4\"\n        paddingTop=\"SP1\"\n        paddingBottom=\"SP2\"\n      >\n        <Heading size=\"small\">{t('cairo.import.columnsFound')}</Heading>\n        <CounterBadge\n          size=\"medium\"\n          skin=\"neutralLight\"\n          dataHook=\"import-columns-found-counter\"\n        >\n          {csvHeaders.length}\n        </CounterBadge>\n      </Box>\n\n      <div style={{ overflowY: 'auto', maxHeight: '340px' }}>\n        <Box\n          display=\"grid\"\n          direction=\"horizontal\"\n          gap=\"SP4\"\n          padding=\"SP2 SP4\"\n          backgroundColor=\"var(--wds-color-fill-surface-neutral,var(--wsr-color-D75, #F7F8F8))\"\n          boxShadow=\"inset 0 1px 0 0 var(--wds-color-border-dark-secondary, var(--wsr-color-D60, #DFE5EB)), inset 0 -1px 0 0 var(--wds-color-border-dark-secondary, var(--wsr-color-D60, #DFE5EB))\"\n          gridTemplateColumns={`${COLUMN_WIDTHS.title} ${COLUMN_WIDTHS.arrow} ${COLUMN_WIDTHS.field}`}\n          style={{ position: 'sticky', top: 0, zIndex: 1 }}\n        >\n          <Box minWidth={0} direction=\"vertical\">\n            <Text size=\"small\" weight=\"thin\" ellipsis>\n              {t('cairo.import.columnTitle')}\n            </Text>\n          </Box>\n\n          <Box minWidth={0} direction=\"vertical\" />\n\n          <Box minWidth={0} direction=\"vertical\">\n            <Text size=\"small\" weight=\"thin\" ellipsis>\n              {t('cairo.import.collectionField')}\n            </Text>\n          </Box>\n        </Box>\n\n        {csvHeaders.map((header) => (\n          <TableListItem\n            key={header}\n            showDivider\n            options={[\n              {\n                value: (\n                  <Text ellipsis size=\"small\">\n                    {header}\n                  </Text>\n                ),\n                width: COLUMN_WIDTHS.title,\n              },\n              {\n                value: (\n                  <Box align=\"center\">\n                    <ArrowRight />\n                  </Box>\n                ),\n                width: COLUMN_WIDTHS.arrow,\n              },\n              {\n                value: (\n                  <Dropdown\n                    dataHook={`import-mapping-${header}`}\n                    clearButton\n                    onClear={() => {\n                      state.setMapping(header, null);\n                    }}\n                    placeholder={t('cairo.import.skipColumn')}\n                    selectedId={state.mappingByHeader[header] ?? undefined}\n                    onSelect={({ id }) => {\n                      state.setMapping(header, id as string);\n                    }}\n                    popoverProps={{\n                      appendTo: 'window',\n                      zIndex: 5001,\n                      flip: true,\n                      fixed: false,\n                    }}\n                    options={dropdownOptions}\n                    size=\"small\"\n                  />\n                ),\n                width: COLUMN_WIDTHS.field,\n              },\n            ]}\n          />\n        ))}\n      </div>\n    </Box>\n  );\n}\n\nexport const ImportStepConfiguration = observer(_ImportStepConfiguration);\n"],"mappings":"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","ignoreList":[]}

package/dist/cjs/components/ImportButton/ImportStepError.js

@@ -0,0 +1,39 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports.ImportStepError = void 0;
+var _designSystem = require("@wix/design-system");
+var _react = _interopRequireDefault(require("react"));
+var _mobxReactLite = require("mobx-react-lite");
+var _jsxFileName = "/home/builduser/work/843658b9f44192f0/packages/cairo/dist/cjs/components/ImportButton/ImportStepError.tsx";
+function _ImportStepError({
+  state
+}) {
+  const {
+    importStatus,
+    translate: t
+  } = state;
+  const errorMessage = importStatus.isError && importStatus.error instanceof Error ? importStatus.error.message : t('cairo.import.genericError');
+  return /*#__PURE__*/_react.default.createElement(_designSystem.Box, {
+    direction: "vertical",
+    gap: "SP2",
+    __self: this,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 18,
+      columnNumber: 5
+    }
+  }, /*#__PURE__*/_react.default.createElement(_designSystem.Text, {
+    size: "small",
+    skin: "error",
+    __self: this,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 19,
+      columnNumber: 7
+    }
+  }, errorMessage));
+}
+const ImportStepError = exports.ImportStepError = (0, _mobxReactLite.observer)(_ImportStepError);
+//# sourceMappingURL=ImportStepError.js.map

package/dist/cjs/components/ImportButton/ImportStepError.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_designSystem","require","_react","_interopRequireDefault","_mobxReactLite","_jsxFileName","_ImportStepError","state","importStatus","translate","t","errorMessage","isError","error","Error","message","default","createElement","Box","direction","gap","__self","__source","fileName","lineNumber","columnNumber","Text","size","skin","ImportStepError","exports","observer"],"sources":["../../../../src/components/ImportButton/ImportStepError.tsx"],"sourcesContent":["import { Box, Text } from '@wix/design-system';\nimport { ImportState } from '@wix/bex-core';\nimport React from 'react';\nimport { observer } from 'mobx-react-lite';\n\nexport interface ImportStepErrorProps {\n  state: ImportState;\n}\n\nfunction _ImportStepError({ state }: ImportStepErrorProps) {\n  const { importStatus, translate: t } = state;\n  const errorMessage =\n    importStatus.isError && importStatus.error instanceof Error\n      ? importStatus.error.message\n      : t('cairo.import.genericError');\n\n  return (\n    <Box direction=\"vertical\" gap=\"SP2\">\n      <Text size=\"small\" skin=\"error\">\n        {errorMessage}\n      </Text>\n    </Box>\n  );\n}\n\nexport const ImportStepError = observer(_ImportStepError);\n"],"mappings":";;;;;AAAA,IAAAA,aAAA,GAAAC,OAAA;AAEA,IAAAC,MAAA,GAAAC,sBAAA,CAAAF,OAAA;AACA,IAAAG,cAAA,GAAAH,OAAA;AAA2C,IAAAI,YAAA;AAM3C,SAASC,gBAAgBA,CAAC;EAAEC;AAA4B,CAAC,EAAE;EACzD,MAAM;IAAEC,YAAY;IAAEC,SAAS,EAAEC;EAAE,CAAC,GAAGH,KAAK;EAC5C,MAAMI,YAAY,GAChBH,YAAY,CAACI,OAAO,IAAIJ,YAAY,CAACK,KAAK,YAAYC,KAAK,GACvDN,YAAY,CAACK,KAAK,CAACE,OAAO,GAC1BL,CAAC,CAAC,2BAA2B,CAAC;EAEpC,oBACER,MAAA,CAAAc,OAAA,CAAAC,aAAA,CAACjB,aAAA,CAAAkB,GAAG;IAACC,SAAS,EAAC,UAAU;IAACC,GAAG,EAAC,KAAK;IAAAC,MAAA;IAAAC,QAAA;MAAAC,QAAA,EAAAlB,YAAA;MAAAmB,UAAA;MAAAC,YAAA;IAAA;EAAA,gBACjCvB,MAAA,CAAAc,OAAA,CAAAC,aAAA,CAACjB,aAAA,CAAA0B,IAAI;IAACC,IAAI,EAAC,OAAO;IAACC,IAAI,EAAC,OAAO;IAAAP,MAAA;IAAAC,QAAA;MAAAC,QAAA,EAAAlB,YAAA;MAAAmB,UAAA;MAAAC,YAAA;IAAA;EAAA,GAC5Bd,YACG,CACH,CAAC;AAEV;AAEO,MAAMkB,eAAe,GAAAC,OAAA,CAAAD,eAAA,GAAG,IAAAE,uBAAQ,EAACzB,gBAAgB,CAAC","ignoreList":[]}

package/dist/cjs/components/ImportButton/ImportStepProgress.js

@@ -0,0 +1,86 @@
+"use strict";
+
+exports.__esModule = true;
+exports.ImportStepProgress = void 0;
+var _designSystem = require("@wix/design-system");
+var _react = _interopRequireWildcard(require("react"));
+var _mobxReactLite = require("mobx-react-lite");
+var _jsxFileName = "/home/builduser/work/843658b9f44192f0/packages/cairo/dist/cjs/components/ImportButton/ImportStepProgress.tsx";
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+function _ImportStepProgress({
+  state
+}) {
+  const {
+    processedCount,
+    totalCount,
+    isBackingUp,
+    result,
+    translate: t,
+    importStatus,
+    errorHandler
+  } = state;
+  const progress = totalCount > 0 ? Math.min(100, Math.round(processedCount / totalCount * 100)) : 0;
+  const hasFailures = result != null && result.failed > 0;
+  const errorMessage = (0, _react.useMemo)(() => {
+    var _errorHandler$getReso;
+    return importStatus.error ? errorHandler.getResolvedError == null || (_errorHandler$getReso = errorHandler.getResolvedError(importStatus.error)) == null ? void 0 : _errorHandler$getReso.message : null;
+  }, [importStatus.error, errorHandler]);
+  return /*#__PURE__*/_react.default.createElement(_designSystem.Box, {
+    direction: "vertical",
+    gap: "SP2",
+    width: "100%",
+    __self: this,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 36,
+      columnNumber: 5
+    }
+  }, /*#__PURE__*/_react.default.createElement(_designSystem.LinearProgressBar, {
+    value: progress,
+    showProgressIndication: true,
+    dataHook: "import-progress-bar",
+    __self: this,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 37,
+      columnNumber: 7
+    }
+  }), /*#__PURE__*/_react.default.createElement(_designSystem.Text, {
+    size: "small",
+    dataHook: "import-progress-label",
+    __self: this,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 42,
+      columnNumber: 7
+    }
+  }, isBackingUp && !errorMessage ? t('cairo.import.backupDescription') : t('cairo.import.progressLabel', {
+    processed: processedCount,
+    total: totalCount
+  })), hasFailures && /*#__PURE__*/_react.default.createElement(_designSystem.Text, {
+    size: "small",
+    skin: "error",
+    dataHook: "import-partial-error",
+    __self: this,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 51,
+      columnNumber: 9
+    }
+  }, t('cairo.import.partialSuccess', {
+    succeeded: result.succeeded,
+    failed: result.failed
+  })), errorMessage && /*#__PURE__*/_react.default.createElement(_designSystem.Text, {
+    size: "small",
+    skin: "error",
+    dataHook: "import-error-message",
+    __self: this,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 59,
+      columnNumber: 9
+    }
+  }, errorMessage));
+}
+const ImportStepProgress = exports.ImportStepProgress = (0, _mobxReactLite.observer)(_ImportStepProgress);
+//# sourceMappingURL=ImportStepProgress.js.map

package/dist/cjs/components/ImportButton/ImportStepProgress.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_designSystem","require","_react","_interopRequireWildcard","_mobxReactLite","_jsxFileName","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","_ImportStepProgress","state","processedCount","totalCount","isBackingUp","result","translate","importStatus","errorHandler","progress","Math","min","round","hasFailures","failed","errorMessage","useMemo","_errorHandler$getReso","error","getResolvedError","message","createElement","Box","direction","gap","width","__self","__source","fileName","lineNumber","columnNumber","LinearProgressBar","value","showProgressIndication","dataHook","Text","size","processed","total","skin","succeeded","ImportStepProgress","exports","observer"],"sources":["../../../../src/components/ImportButton/ImportStepProgress.tsx"],"sourcesContent":["import { Box, LinearProgressBar, Text } from '@wix/design-system';\nimport { ImportState } from '@wix/bex-core';\nimport React, { useMemo } from 'react';\nimport { observer } from 'mobx-react-lite';\n\nexport interface ImportStepProgressProps {\n  state: ImportState;\n}\n\nfunction _ImportStepProgress({ state }: ImportStepProgressProps) {\n  const {\n    processedCount,\n    totalCount,\n    isBackingUp,\n    result,\n    translate: t,\n    importStatus,\n    errorHandler,\n  } = state;\n  const progress =\n    totalCount > 0\n      ? Math.min(100, Math.round((processedCount / totalCount) * 100))\n      : 0;\n\n  const hasFailures = result != null && result.failed > 0;\n\n  const errorMessage = useMemo(\n    () =>\n      importStatus.error\n        ? errorHandler.getResolvedError?.(importStatus.error)?.message\n        : null,\n    [importStatus.error, errorHandler],\n  );\n\n  return (\n    <Box direction=\"vertical\" gap=\"SP2\" width=\"100%\">\n      <LinearProgressBar\n        value={progress}\n        showProgressIndication\n        dataHook=\"import-progress-bar\"\n      />\n      <Text size=\"small\" dataHook=\"import-progress-label\">\n        {isBackingUp && !errorMessage\n          ? t('cairo.import.backupDescription')\n          : t('cairo.import.progressLabel', {\n              processed: processedCount,\n              total: totalCount,\n            })}\n      </Text>\n      {hasFailures && (\n        <Text size=\"small\" skin=\"error\" dataHook=\"import-partial-error\">\n          {t('cairo.import.partialSuccess', {\n            succeeded: result.succeeded,\n            failed: result.failed,\n          })}\n        </Text>\n      )}\n      {errorMessage && (\n        <Text size=\"small\" skin=\"error\" dataHook=\"import-error-message\">\n          {errorMessage}\n        </Text>\n      )}\n    </Box>\n  );\n}\n\nexport const ImportStepProgress = observer(_ImportStepProgress);\n"],"mappings":"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","ignoreList":[]}

package/dist/cjs/components/ImportButton/ImportStepUpload.js

@@ -0,0 +1,76 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports.ImportStepUpload = void 0;
+var _designSystem = require("@wix/design-system");
+var _react = _interopRequireDefault(require("react"));
+var _mobxReactLite = require("mobx-react-lite");
+var _ImportStepUploadStCss = require("./ImportStepUpload.st.css.js");
+var _jsxFileName = "/home/builduser/work/843658b9f44192f0/packages/cairo/dist/cjs/components/ImportButton/ImportStepUpload.tsx";
+function _ImportStepUpload({
+  state
+}) {
+  const {
+    parseError,
+    translate: t
+  } = state;
+  return /*#__PURE__*/_react.default.createElement(_designSystem.Box, {
+    direction: "vertical",
+    gap: "SP2",
+    __self: this,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 15,
+      columnNumber: 5
+    }
+  }, /*#__PURE__*/_react.default.createElement(_designSystem.Box, {
+    height: "280px",
+    __self: this,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 16,
+      columnNumber: 7
+    }
+  }, /*#__PURE__*/_react.default.createElement(_designSystem.FileUpload, {
+    dataHook: "import-file-input",
+    className: (0, _ImportStepUploadStCss.st)(_ImportStepUploadStCss.classes.fileUpload),
+    accept: ".csv,text/csv",
+    onChange: files => {
+      const file = files == null ? void 0 : files[0];
+      if (file) {
+        state.onFileSelected(file);
+      }
+    },
+    __self: this,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 17,
+      columnNumber: 9
+    }
+  }, ({
+    openFileUploadDialog
+  }) => /*#__PURE__*/_react.default.createElement(_designSystem.AddItem, {
+    size: "large",
+    skin: "filled",
+    onClick: openFileUploadDialog,
+    __self: this,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 29,
+      columnNumber: 13
+    }
+  }, t('cairo.import.uploadButtonLabel')))), parseError ? /*#__PURE__*/_react.default.createElement(_designSystem.Text, {
+    size: "small",
+    skin: "error",
+    dataHook: "import-upload-error",
+    __self: this,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 36,
+      columnNumber: 9
+    }
+  }, parseError) : null);
+}
+const ImportStepUpload = exports.ImportStepUpload = (0, _mobxReactLite.observer)(_ImportStepUpload);
+//# sourceMappingURL=ImportStepUpload.js.map

package/dist/cjs/components/ImportButton/ImportStepUpload.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_designSystem","require","_react","_interopRequireDefault","_mobxReactLite","_ImportStepUploadStCss","_jsxFileName","_ImportStepUpload","state","parseError","translate","t","default","createElement","Box","direction","gap","__self","__source","fileName","lineNumber","columnNumber","height","FileUpload","dataHook","className","st","classes","fileUpload","accept","onChange","files","file","onFileSelected","openFileUploadDialog","AddItem","size","skin","onClick","Text","ImportStepUpload","exports","observer"],"sources":["../../../../src/components/ImportButton/ImportStepUpload.tsx"],"sourcesContent":["import { Box, Text, FileUpload, AddItem } from '@wix/design-system';\nimport { ImportState } from '@wix/bex-core';\nimport React from 'react';\nimport { observer } from 'mobx-react-lite';\nimport { st, classes } from './ImportStepUpload.st.css.js';\n\nexport interface ImportStepUploadProps {\n  state: ImportState;\n}\n\nfunction _ImportStepUpload({ state }: ImportStepUploadProps) {\n  const { parseError, translate: t } = state;\n\n  return (\n    <Box direction=\"vertical\" gap=\"SP2\">\n      <Box height=\"280px\">\n        <FileUpload\n          dataHook=\"import-file-input\"\n          className={st(classes.fileUpload)}\n          accept=\".csv,text/csv\"\n          onChange={(files) => {\n            const file = files?.[0];\n            if (file) {\n              state.onFileSelected(file);\n            }\n          }}\n        >\n          {({ openFileUploadDialog }) => (\n            <AddItem size=\"large\" skin=\"filled\" onClick={openFileUploadDialog}>\n              {t('cairo.import.uploadButtonLabel')}\n            </AddItem>\n          )}\n        </FileUpload>\n      </Box>\n      {parseError ? (\n        <Text size=\"small\" skin=\"error\" dataHook=\"import-upload-error\">\n          {parseError}\n        </Text>\n      ) : null}\n    </Box>\n  );\n}\n\nexport const ImportStepUpload = observer(_ImportStepUpload);\n"],"mappings":";;;;;AAAA,IAAAA,aAAA,GAAAC,OAAA;AAEA,IAAAC,MAAA,GAAAC,sBAAA,CAAAF,OAAA;AACA,IAAAG,cAAA,GAAAH,OAAA;AACA,IAAAI,sBAAA,GAAAJ,OAAA;AAA2D,IAAAK,YAAA;AAM3D,SAASC,iBAAiBA,CAAC;EAAEC;AAA6B,CAAC,EAAE;EAC3D,MAAM;IAAEC,UAAU;IAAEC,SAAS,EAAEC;EAAE,CAAC,GAAGH,KAAK;EAE1C,oBACEN,MAAA,CAAAU,OAAA,CAAAC,aAAA,CAACb,aAAA,CAAAc,GAAG;IAACC,SAAS,EAAC,UAAU;IAACC,GAAG,EAAC,KAAK;IAAAC,MAAA;IAAAC,QAAA;MAAAC,QAAA,EAAAb,YAAA;MAAAc,UAAA;MAAAC,YAAA;IAAA;EAAA,gBACjCnB,MAAA,CAAAU,OAAA,CAAAC,aAAA,CAACb,aAAA,CAAAc,GAAG;IAACQ,MAAM,EAAC,OAAO;IAAAL,MAAA;IAAAC,QAAA;MAAAC,QAAA,EAAAb,YAAA;MAAAc,UAAA;MAAAC,YAAA;IAAA;EAAA,gBACjBnB,MAAA,CAAAU,OAAA,CAAAC,aAAA,CAACb,aAAA,CAAAuB,UAAU;IACTC,QAAQ,EAAC,mBAAmB;IAC5BC,SAAS,EAAE,IAAAC,yBAAE,EAACC,8BAAO,CAACC,UAAU,CAAE;IAClCC,MAAM,EAAC,eAAe;IACtBC,QAAQ,EAAGC,KAAK,IAAK;MACnB,MAAMC,IAAI,GAAGD,KAAK,oBAALA,KAAK,CAAG,CAAC,CAAC;MACvB,IAAIC,IAAI,EAAE;QACRxB,KAAK,CAACyB,cAAc,CAACD,IAAI,CAAC;MAC5B;IACF,CAAE;IAAAf,MAAA;IAAAC,QAAA;MAAAC,QAAA,EAAAb,YAAA;MAAAc,UAAA;MAAAC,YAAA;IAAA;EAAA,GAED,CAAC;IAAEa;EAAqB,CAAC,kBACxBhC,MAAA,CAAAU,OAAA,CAAAC,aAAA,CAACb,aAAA,CAAAmC,OAAO;IAACC,IAAI,EAAC,OAAO;IAACC,IAAI,EAAC,QAAQ;IAACC,OAAO,EAAEJ,oBAAqB;IAAAjB,MAAA;IAAAC,QAAA;MAAAC,QAAA,EAAAb,YAAA;MAAAc,UAAA;MAAAC,YAAA;IAAA;EAAA,GAC/DV,CAAC,CAAC,gCAAgC,CAC5B,CAED,CACT,CAAC,EACLF,UAAU,gBACTP,MAAA,CAAAU,OAAA,CAAAC,aAAA,CAACb,aAAA,CAAAuC,IAAI;IAACH,IAAI,EAAC,OAAO;IAACC,IAAI,EAAC,OAAO;IAACb,QAAQ,EAAC,qBAAqB;IAAAP,MAAA;IAAAC,QAAA;MAAAC,QAAA,EAAAb,YAAA;MAAAc,UAAA;MAAAC,YAAA;IAAA;EAAA,GAC3DZ,UACG,CAAC,GACL,IACD,CAAC;AAEV;AAEO,MAAM+B,gBAAgB,GAAAC,OAAA,CAAAD,gBAAA,GAAG,IAAAE,uBAAQ,EAACnC,iBAAiB,CAAC","ignoreList":[]}

package/dist/cjs/components/ImportButton/ImportStepUpload.st.css

@@ -0,0 +1,3 @@
+.fileUpload {
+  width: 100%;
+}

package/dist/cjs/components/ImportButton/ImportStepUpload.st.css.js

@@ -0,0 +1,23 @@
+"use strict";
+
+exports.__esModule = true;
+exports.vars = exports.style = exports.stVars = exports.st = exports.namespace = exports.layers = exports.keyframes = exports.cssStates = exports.containers = exports.classes = void 0;
+var _stylableEsmRuntime = require("../../stylable-esm-runtime.js");
+// @ts-nocheck
+
+var _namespace_ = "ImportStepUpload3823422815";
+var _style_ = _stylableEsmRuntime.classesRuntime.bind(null, _namespace_);
+var cssStates = exports.cssStates = _stylableEsmRuntime.statesRuntime.bind(null, _namespace_);
+var style = exports.style = _style_;
+var st = exports.st = _style_;
+var namespace = exports.namespace = _namespace_;
+var classes = exports.classes = {
+  "root": "ImportStepUpload3823422815__root",
+  "fileUpload": "ImportStepUpload3823422815__fileUpload"
+};
+var keyframes = exports.keyframes = {};
+var layers = exports.layers = {};
+var containers = exports.containers = {};
+var stVars = exports.stVars = {};
+var vars = exports.vars = {};
+//# sourceMappingURL=ImportStepUpload.st.css.js.map

package/dist/cjs/components/ImportButton/ImportStepUpload.st.css.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_stylableEsmRuntime","require","_namespace_","_style_","classesRuntime","bind","cssStates","exports","statesRuntime","style","st","namespace","classes","keyframes","layers","containers","stVars","vars"],"sources":["../../../../src/components/ImportButton/ImportStepUpload.st.css.ts"],"sourcesContent":["// @ts-nocheck\n\n\nimport { classesRuntime, statesRuntime } from \"../../stylable-esm-runtime.js\";\n\n\n\nvar _namespace_ = \"ImportStepUpload3823422815\";\nvar _style_ = classesRuntime.bind(null, _namespace_);\n\nexport var cssStates = statesRuntime.bind(null, _namespace_);\nexport var style = _style_;\nexport var st: import(\"@stylable/runtime\").STFunction = _style_;\n\nexport var namespace = _namespace_;\nexport var classes = {\"root\":\"ImportStepUpload3823422815__root\",\"fileUpload\":\"ImportStepUpload3823422815__fileUpload\"};\nexport var keyframes = {}; \nexport var layers = {};\nexport var containers = {};\nexport var stVars = {}; \nexport var vars = {}; \n\n\n\n\n"],"mappings":";;;;AAGA,IAAAA,mBAAA,GAAAC,OAAA;AAHA;;AAOA,IAAIC,WAAW,GAAG,4BAA4B;AAC9C,IAAIC,OAAO,GAAGC,kCAAc,CAACC,IAAI,CAAC,IAAI,EAAEH,WAAW,CAAC;AAE7C,IAAII,SAAS,GAAAC,OAAA,CAAAD,SAAA,GAAGE,iCAAa,CAACH,IAAI,CAAC,IAAI,EAAEH,WAAW,CAAC;AACrD,IAAIO,KAAK,GAAAF,OAAA,CAAAE,KAAA,GAAGN,OAAO;AACnB,IAAIO,EAA0C,GAAAH,OAAA,CAAAG,EAAA,GAAGP,OAAO;AAExD,IAAIQ,SAAS,GAAAJ,OAAA,CAAAI,SAAA,GAAGT,WAAW;AAC3B,IAAIU,OAAO,GAAAL,OAAA,CAAAK,OAAA,GAAG;EAAC,MAAM,EAAC,kCAAkC;EAAC,YAAY,EAAC;AAAwC,CAAC;AAC/G,IAAIC,SAAS,GAAAN,OAAA,CAAAM,SAAA,GAAG,CAAC,CAAC;AAClB,IAAIC,MAAM,GAAAP,OAAA,CAAAO,MAAA,GAAG,CAAC,CAAC;AACf,IAAIC,UAAU,GAAAR,OAAA,CAAAQ,UAAA,GAAG,CAAC,CAAC;AACnB,IAAIC,MAAM,GAAAT,OAAA,CAAAS,MAAA,GAAG,CAAC,CAAC;AACf,IAAIC,IAAI,GAAAV,OAAA,CAAAU,IAAA,GAAG,CAAC,CAAC","ignoreList":[]}

package/dist/cjs/components/ImportButton/ImportStepper.js

@@ -0,0 +1,54 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports.ImportStepper = void 0;
+var _designSystem = require("@wix/design-system");
+var _react = _interopRequireDefault(require("react"));
+var _mobxReactLite = require("mobx-react-lite");
+var _jsxFileName = "/home/builduser/work/843658b9f44192f0/packages/cairo/dist/cjs/components/ImportButton/ImportStepper.tsx";
+const STEPPER_INDEX = {
+  upload: 0,
+  configuration: 1,
+  progress: 2
+};
+function getStepperSteps(currentStep, t) {
+  const activeIndex = STEPPER_INDEX[currentStep];
+  return [{
+    text: t('cairo.import.stepper.upload')
+  }, {
+    text: t('cairo.import.stepper.matchFields')
+  }].map((step, index) => ({
+    ...step,
+    type: index < activeIndex ? 'completed' : index > activeIndex ? 'disabled' : 'normal'
+  }));
+}
+function _ImportStepper({
+  state,
+  removeContentPadding
+}) {
+  const activeStep = STEPPER_INDEX[state.currentStep];
+  const steps = getStepperSteps(state.currentStep, state.translate);
+  const contentPadding = removeContentPadding ? undefined : 'SP4';
+  return /*#__PURE__*/_react.default.createElement(_designSystem.Box, {
+    paddingLeft: contentPadding,
+    paddingRight: contentPadding,
+    __self: this,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 42,
+      columnNumber: 5
+    }
+  }, /*#__PURE__*/_react.default.createElement(_designSystem.Stepper, {
+    activeStep: activeStep,
+    steps: steps,
+    __self: this,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 43,
+      columnNumber: 7
+    }
+  }));
+}
+const ImportStepper = exports.ImportStepper = (0, _mobxReactLite.observer)(_ImportStepper);
+//# sourceMappingURL=ImportStepper.js.map

package/dist/cjs/components/ImportButton/ImportStepper.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_designSystem","require","_react","_interopRequireDefault","_mobxReactLite","_jsxFileName","STEPPER_INDEX","upload","configuration","progress","getStepperSteps","currentStep","t","activeIndex","text","map","step","index","type","_ImportStepper","state","removeContentPadding","activeStep","steps","translate","contentPadding","undefined","default","createElement","Box","paddingLeft","paddingRight","__self","__source","fileName","lineNumber","columnNumber","Stepper","ImportStepper","exports","observer"],"sources":["../../../../src/components/ImportButton/ImportStepper.tsx"],"sourcesContent":["import { Stepper, Box } from '@wix/design-system';\nimport { ImportState, ImportStep } from '@wix/bex-core';\nimport React from 'react';\nimport { observer } from 'mobx-react-lite';\n\nconst STEPPER_INDEX: Record<ImportStep, number> = {\n  upload: 0,\n  configuration: 1,\n  progress: 2,\n};\n\nfunction getStepperSteps(currentStep: ImportStep, t: ImportState['translate']) {\n  const activeIndex = STEPPER_INDEX[currentStep];\n\n  return [\n    { text: t('cairo.import.stepper.upload') },\n    { text: t('cairo.import.stepper.matchFields') },\n  ].map((step, index) => ({\n    ...step,\n    type: (\n      index < activeIndex\n        ? 'completed'\n        : index > activeIndex\n          ? 'disabled'\n          : 'normal'\n    ) as 'completed' | 'disabled' | 'normal',\n  }));\n}\n\nexport interface ImportStepperProps {\n  state: ImportState;\n  removeContentPadding?: boolean;\n}\n\nfunction _ImportStepper({ state, removeContentPadding }: ImportStepperProps) {\n  const activeStep = STEPPER_INDEX[state.currentStep];\n  const steps = getStepperSteps(state.currentStep, state.translate);\n\n  const contentPadding = removeContentPadding ? undefined : 'SP4';\n\n  return (\n    <Box paddingLeft={contentPadding} paddingRight={contentPadding}>\n      <Stepper activeStep={activeStep} steps={steps} />\n    </Box>\n  );\n}\n\nexport const ImportStepper = observer(_ImportStepper);\n"],"mappings":";;;;;AAAA,IAAAA,aAAA,GAAAC,OAAA;AAEA,IAAAC,MAAA,GAAAC,sBAAA,CAAAF,OAAA;AACA,IAAAG,cAAA,GAAAH,OAAA;AAA2C,IAAAI,YAAA;AAE3C,MAAMC,aAAyC,GAAG;EAChDC,MAAM,EAAE,CAAC;EACTC,aAAa,EAAE,CAAC;EAChBC,QAAQ,EAAE;AACZ,CAAC;AAED,SAASC,eAAeA,CAACC,WAAuB,EAAEC,CAA2B,EAAE;EAC7E,MAAMC,WAAW,GAAGP,aAAa,CAACK,WAAW,CAAC;EAE9C,OAAO,CACL;IAAEG,IAAI,EAAEF,CAAC,CAAC,6BAA6B;EAAE,CAAC,EAC1C;IAAEE,IAAI,EAAEF,CAAC,CAAC,kCAAkC;EAAE,CAAC,CAChD,CAACG,GAAG,CAAC,CAACC,IAAI,EAAEC,KAAK,MAAM;IACtB,GAAGD,IAAI;IACPE,IAAI,EACFD,KAAK,GAAGJ,WAAW,GACf,WAAW,GACXI,KAAK,GAAGJ,WAAW,GACjB,UAAU,GACV;EAEV,CAAC,CAAC,CAAC;AACL;AAOA,SAASM,cAAcA,CAAC;EAAEC,KAAK;EAAEC;AAAyC,CAAC,EAAE;EAC3E,MAAMC,UAAU,GAAGhB,aAAa,CAACc,KAAK,CAACT,WAAW,CAAC;EACnD,MAAMY,KAAK,GAAGb,eAAe,CAACU,KAAK,CAACT,WAAW,EAAES,KAAK,CAACI,SAAS,CAAC;EAEjE,MAAMC,cAAc,GAAGJ,oBAAoB,GAAGK,SAAS,GAAG,KAAK;EAE/D,oBACExB,MAAA,CAAAyB,OAAA,CAAAC,aAAA,CAAC5B,aAAA,CAAA6B,GAAG;IAACC,WAAW,EAAEL,cAAe;IAACM,YAAY,EAAEN,cAAe;IAAAO,MAAA;IAAAC,QAAA;MAAAC,QAAA,EAAA7B,YAAA;MAAA8B,UAAA;MAAAC,YAAA;IAAA;EAAA,gBAC7DlC,MAAA,CAAAyB,OAAA,CAAAC,aAAA,CAAC5B,aAAA,CAAAqC,OAAO;IAACf,UAAU,EAAEA,UAAW;IAACC,KAAK,EAAEA,KAAM;IAAAS,MAAA;IAAAC,QAAA;MAAAC,QAAA,EAAA7B,YAAA;MAAA8B,UAAA;MAAAC,YAAA;IAAA;EAAA,CAAE,CAC7C,CAAC;AAEV;AAEO,MAAME,aAAa,GAAAC,OAAA,CAAAD,aAAA,GAAG,IAAAE,uBAAQ,EAACrB,cAAc,CAAC","ignoreList":[]}