@commercetools-frontend-extensions/import-resources-modal 0.0.0-canary-20240529140709

package/dist/index-a4665b30.esm.js

@@ -0,0 +1,1854 @@
+import _Object$keys from '@babel/runtime-corejs3/core-js-stable/object/keys';
+import _Object$getOwnPropertySymbols from '@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols';
+import _filterInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/filter';
+import _Object$getOwnPropertyDescriptor from '@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor';
+import _forEachInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/for-each';
+import _Object$getOwnPropertyDescriptors from '@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors';
+import _Object$defineProperties from '@babel/runtime-corejs3/core-js-stable/object/define-properties';
+import _Object$defineProperty from '@babel/runtime-corejs3/core-js-stable/object/define-property';
+import _defineProperty from '@babel/runtime-corejs3/helpers/esm/defineProperty';
+import { defineMessages, useIntl, FormattedMessage, IntlProvider } from 'react-intl';
+import { useApplicationContext } from '@commercetools-frontend/application-shell-connectors';
+import _slicedToArray from '@babel/runtime-corejs3/helpers/esm/slicedToArray';
+import React, { useContext, lazy, useState, useEffect } from 'react';
+import { actions, useAsyncDispatch } from '@commercetools-frontend/sdk';
+import { MC_API_PROXY_TARGETS, DOMAINS } from '@commercetools-frontend/constants';
+import _everyInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/every';
+import _concatInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/concat';
+import { plural } from 'pluralize';
+import _Promise from '@babel/runtime-corejs3/core-js-stable/promise';
+import _Array$isArray from '@babel/runtime-corejs3/core-js-stable/array/is-array';
+import _flatMapInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/flat-map';
+import _mapInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/map';
+import _findInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/find';
+import _includesInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/includes';
+import Papa from 'papaparse';
+import _reduceInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/reduce';
+import _JSON$stringify from '@babel/runtime-corejs3/core-js-stable/json/stringify';
+import _someInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/some';
+import '@babel/runtime-corejs3/core-js-stable/instance/starts-with';
+import 'querystring';
+import 'ramda';
+import { executeHttpClientRequest, buildApiUrl } from '@commercetools-frontend/application-shell';
+import _Reflect$construct from '@babel/runtime-corejs3/core-js-stable/reflect/construct';
+import _createClass from '@babel/runtime-corejs3/helpers/esm/createClass';
+import _classCallCheck from '@babel/runtime-corejs3/helpers/esm/classCallCheck';
+import _inherits from '@babel/runtime-corejs3/helpers/esm/inherits';
+import _possibleConstructorReturn from '@babel/runtime-corejs3/helpers/esm/possibleConstructorReturn';
+import _getPrototypeOf from '@babel/runtime-corejs3/helpers/esm/getPrototypeOf';
+import _wrapNativeSuper from '@babel/runtime-corejs3/helpers/esm/wrapNativeSuper';
+import { jsx, jsxs, Fragment } from '@emotion/react/jsx-runtime';
+import { FormDialog, PageContentNarrow, ConfirmationDialog, InfoDialog } from '@commercetools-frontend/application-components';
+import { customProperties, Constraints, Spacings, Text, Link, Card, CheckBoldIcon, EyeCrossedIcon, usePaginationState, PageNavigator, Stamp, SecondaryButton, PrimaryButton, ImportIcon, ProgressBar } from '@commercetools-frontend/ui-kit';
+import { useShowNotification } from '@commercetools-frontend/actions-global';
+import { reportErrorToSentry } from '@commercetools-frontend/sentry';
+import { useDropzone } from 'react-dropzone';
+import _styled from '@emotion/styled/base';
+import { css } from '@emotion/react';
+import _sliceInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/slice';
+import DataTable from '@commercetools-uikit/data-table';
+import truncate$1 from 'lodash.truncate';
+import { parseChunkImport, mapLocaleToIntlLocale } from '@commercetools-frontend/i18n';
+
+const EnabledResourceType = {
+  category: true,
+  product: true
+};
+function isResourceType(maybeResourceType) {
+  return typeof maybeResourceType === 'string' && maybeResourceType in EnabledResourceType;
+}
+function assertResourceType(maybeResourceType) {
+  if (isResourceType(maybeResourceType)) return;
+  throw new Error("Invalid value: ".concat(maybeResourceType));
+}
+function isError(maybeError) {
+  if (maybeError instanceof Error) return true;
+  return false;
+}
+
+// eslint-disable-next-line @typescript-eslint/ban-types
+function hasOwnProperty(obj, prop) {
+  return typeof obj === 'object' && obj !== null && obj.hasOwnProperty(prop);
+}
+function hasRequiredFields(maybeValidObject, requiredFields) {
+  return typeof maybeValidObject === 'object' && maybeValidObject !== null && _everyInstanceProperty(requiredFields).call(requiredFields, property => hasOwnProperty(maybeValidObject, property));
+}
+
+var _context;
+const DEFAULT_DELIMITER = ',';
+const INITIAL_COLUMN_DISPLAY_COUNT = 8;
+const IMPORT_TAG_KEYS = {
+  source: 'source'
+};
+const IMPORT_TAG_VALUES = {
+  fileUpload: 'file-upload'
+};
+const TAG_KEY_SOURCE_FILE_UPLOAD = _concatInstanceProperty(_context = "".concat(IMPORT_TAG_KEYS.source, ":")).call(_context, IMPORT_TAG_VALUES.fileUpload);
+
+const FILE_SIZE_LIMITS_MB = {
+  category: 10,
+  product: 35
+};
+const ROW_LIMITS = {
+  category: 5000,
+  product: 70000
+};
+const RESOURCE_TYPE_TEMPLATE_DOWNLOAD_LINKS = {
+  category: 'https://docs.commercetools.com/merchant-center/downloads/category_import_template.csv',
+  product: 'https://docs.commercetools.com/merchant-center/import-data#create-a-csv-file'
+};
+const RESOURCE_TYPE_DOCUMENTATION_LINKS = {
+  category: 'https://docs.commercetools.com/merchant-center/import-categories#supported-headers-and-values',
+  product: 'https://docs.commercetools.com/merchant-center/import-products#supported-headers-and-values'
+};
+
+function ownKeys$f(e, r) { var t = _Object$keys(e); if (_Object$getOwnPropertySymbols) { var o = _Object$getOwnPropertySymbols(e); r && (o = _filterInstanceProperty(o).call(o, function (r) { return _Object$getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$f(e) { for (var r = 1; r < arguments.length; r++) { var _context2, _context3; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty(_context2 = ownKeys$f(Object(t), !0)).call(_context2, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(e, _Object$getOwnPropertyDescriptors(t)) : _forEachInstanceProperty(_context3 = ownKeys$f(Object(t))).call(_context3, function (r) { _Object$defineProperty(e, r, _Object$getOwnPropertyDescriptor(t, r)); }); } return e; }
+
+/**
+ * This function checks if the provided `expectedDelimiter` is used consistently in the first 10 lines of a CSV file.
+ * Returns a Promise that resolves to an object containing a boolean `isValid` property and the detected delimiter `delimiter`.
+ *
+ * @param {File} file - The CSV file to check.
+ * @param {string} [expectedDelimiter=DEFAULT_DELIMITER] - The expected delimiter to check for in the file.
+ * @returns {Promise<DelimiterCheck>} A Promise that resolves to a DelimiterCheck object.
+ */
+const checkDelimiter = function (file) {
+  let expectedDelimiter = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : DEFAULT_DELIMITER;
+  return new _Promise(resolve => {
+    let lineCount = 0;
+    let correctDelimiterCount = 0;
+    let detectedDelimiter = null;
+    Papa.parse(file, {
+      step: (results, parser) => {
+        lineCount++;
+        if (detectedDelimiter === null) {
+          detectedDelimiter = results.meta.delimiter;
+        }
+        if (results.meta.delimiter === expectedDelimiter) {
+          correctDelimiterCount++;
+        }
+        if (lineCount >= 10) {
+          parser.abort();
+        }
+      },
+      complete: () => {
+        const isValid = correctDelimiterCount === lineCount;
+        resolve({
+          isValid,
+          delimiter: detectedDelimiter
+        });
+      }
+    });
+  });
+};
+const mapUploadFileErrorsResponseToUploadFileErrorRows = uploadFileErrorsResponse => {
+  if (!uploadFileErrorsResponse || !_Array$isArray(uploadFileErrorsResponse)) return [];
+  let idCounter = 1;
+  return _flatMapInstanceProperty(uploadFileErrorsResponse).call(uploadFileErrorsResponse, rowErrorsResponse => {
+    var _context;
+    return _mapInstanceProperty(_context = rowErrorsResponse.errors).call(_context, rowError => ({
+      // DataTable component requires unique `id` field
+      id: String(idCounter++),
+      row: rowErrorsResponse.row,
+      field: rowError.field,
+      code: rowError.code,
+      validationMessage: rowError.message
+    }));
+  });
+};
+const mapUploadFileClientSideErrorsToUploadFileErrorRows = uploadFileClientSideErrors => {
+  let idCounter = 1;
+  return _mapInstanceProperty(uploadFileClientSideErrors).call(uploadFileClientSideErrors, uploadFileClientSideError => _objectSpread$f(_objectSpread$f({}, uploadFileClientSideError), {}, {
+    id: String(idCounter++)
+  }));
+};
+const extractErrorDescriptionFromValidationMessage = message => {
+  return message.split('"').pop();
+};
+
+/**
+ * Returns the number of rows in a CSV file excluding the header
+ * @param file The CSV file to process.
+ * @returns A promise that resolves to the number of rows
+ */
+const getRowCount = file => {
+  return new _Promise(resolve => {
+    let lineCount = 0;
+    Papa.parse(file, {
+      step: _ref => {
+        let data = _ref.data;
+        // empty lines at the end of the file should not be counted
+        if (_Array$isArray(data) && _findInstanceProperty(data).call(data, Boolean)) lineCount++;
+      },
+      complete: () => {
+        // Subtract 1 for the header row
+        // We use Math.max to make sure the count is not less than 0, this is needed for empty files
+        resolve(Math.max(0, lineCount - 1));
+      }
+    });
+  });
+};
+const toBytes = megabytes => megabytes * 1024 * 1024;
+
+/**
+ * Returns columns from the provided `columns` excluding those specified in the `ignoredColumns`
+ */
+const getValidatedColumns = (columns, ignoredColumns) => {
+  return _filterInstanceProperty(columns).call(columns, column => !_includesInstanceProperty(ignoredColumns).call(ignoredColumns, column));
+};
+
+function getFileUploadErrorsCount(errors) {
+  if (!errors || !_Array$isArray(errors)) return 0;
+  return _reduceInstanceProperty(errors).call(errors, (acc, curr) => acc += curr.errors.length, 0);
+}
+function convertFileSizeToKB(sizeInBytes) {
+  return sizeInBytes / 1000;
+}
+function isAbortError(error) {
+  return error instanceof DOMException && error.name === 'AbortError';
+}
+
+const encodeFileNameWithTimestampToContainerKey = fileName => {
+  return btoa(_JSON$stringify({
+    timestamp: new Date().getTime(),
+    fileName
+  })).replace(/=+$/g, '');
+};
+
+function getCreateImportContainerURL(projectKey) {
+  return "/".concat(projectKey, "/import-containers");
+}
+function getDeleteImportContainerURL(projectKey, containerKey) {
+  var _context6;
+  return _concatInstanceProperty(_context6 = "/".concat(projectKey, "/import-containers/")).call(_context6, containerKey);
+}
+function getFileUploadURL(projectKey, resourceType, containerKey) {
+  var _context8, _context9;
+  return _concatInstanceProperty(_context8 = _concatInstanceProperty(_context9 = "/".concat(projectKey, "/")).call(_context9, plural(resourceType), "/import-containers/")).call(_context8, containerKey, "/file-upload");
+}
+function getProccessFileURL(projectKey, resourceType, containerKey) {
+  var _context10, _context11;
+  return _concatInstanceProperty(_context10 = _concatInstanceProperty(_context11 = "/".concat(projectKey, "/")).call(_context11, plural(resourceType), "/import-containers/")).call(_context10, containerKey, "/process-file");
+}
+
+function _createSuper$3(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$3(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = _Reflect$construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
+function _isNativeReflectConstruct$3() { try { var t = !Boolean.prototype.valueOf.call(_Reflect$construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct$3 = function () { return !!t; })(); }
+let UnexpectedResourceTypeError = /*#__PURE__*/function (_Error) {
+  _inherits(UnexpectedResourceTypeError, _Error);
+  var _super = _createSuper$3(UnexpectedResourceTypeError);
+  function UnexpectedResourceTypeError(resourceType) {
+    var _this;
+    _classCallCheck(this, UnexpectedResourceTypeError);
+    _this = _super.call(this, "Unexpected resource type \"".concat(resourceType, "\""));
+    _this.name = 'UnexpectedResourceTypeError';
+    return _this;
+  }
+  return _createClass(UnexpectedResourceTypeError);
+}( /*#__PURE__*/_wrapNativeSuper(Error));
+
+function _createSuper$2(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$2(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = _Reflect$construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
+function _isNativeReflectConstruct$2() { try { var t = !Boolean.prototype.valueOf.call(_Reflect$construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct$2 = function () { return !!t; })(); }
+let MissingImportResourceProviderError = /*#__PURE__*/function (_Error) {
+  _inherits(MissingImportResourceProviderError, _Error);
+  var _super = _createSuper$2(MissingImportResourceProviderError);
+  function MissingImportResourceProviderError() {
+    var _this;
+    _classCallCheck(this, MissingImportResourceProviderError);
+    _this = _super.call(this, 'useImportResourcesContext must be used within ImportResourcesProvider');
+    _this.name = 'MissingImportResourceProviderError';
+    return _this;
+  }
+  return _createClass(MissingImportResourceProviderError);
+}( /*#__PURE__*/_wrapNativeSuper(Error));
+
+function _createSuper$1(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = _Reflect$construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
+function _isNativeReflectConstruct$1() { try { var t = !Boolean.prototype.valueOf.call(_Reflect$construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct$1 = function () { return !!t; })(); }
+let UnexpectedColumnError = /*#__PURE__*/function (_Error) {
+  _inherits(UnexpectedColumnError, _Error);
+  var _super = _createSuper$1(UnexpectedColumnError);
+  function UnexpectedColumnError(columnName) {
+    var _this;
+    _classCallCheck(this, UnexpectedColumnError);
+    _this = _super.call(this, "Unexpected column \"".concat(columnName, "\""));
+    _this.name = 'UnexpectedColumnError';
+    return _this;
+  }
+  return _createClass(UnexpectedColumnError);
+}( /*#__PURE__*/_wrapNativeSuper(Error));
+
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = _Reflect$construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
+function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(_Reflect$construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function () { return !!t; })(); }
+let HttpError = /*#__PURE__*/function (_Error) {
+  _inherits(HttpError, _Error);
+  var _super = _createSuper(HttpError);
+  function HttpError(statusCode, statusText, errorData) {
+    var _context;
+    var _this;
+    _classCallCheck(this, HttpError);
+    _this = _super.call(this, _concatInstanceProperty(_context = "HTTP Error! Status code: ".concat(statusCode, ", message: \"")).call(_context, statusText ? statusText : '', "\""));
+    _this.statusCode = void 0;
+    _this.errorData = void 0;
+    _this.name = 'HttpError';
+    _this.statusCode = statusCode;
+    _this.errorData = errorData;
+    return _this;
+  }
+  return _createClass(HttpError);
+}( /*#__PURE__*/_wrapNativeSuper(Error));
+
+function ownKeys$e(e, r) { var t = _Object$keys(e); if (_Object$getOwnPropertySymbols) { var o = _Object$getOwnPropertySymbols(e); r && (o = _filterInstanceProperty(o).call(o, function (r) { return _Object$getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$e(e) { for (var r = 1; r < arguments.length; r++) { var _context2, _context3; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty(_context2 = ownKeys$e(Object(t), !0)).call(_context2, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(e, _Object$getOwnPropertyDescriptors(t)) : _forEachInstanceProperty(_context3 = ownKeys$e(Object(t))).call(_context3, function (r) { _Object$defineProperty(e, r, _Object$getOwnPropertyDescriptor(t, r)); }); } return e; }
+const addProxyPrefixToUrl = (uri, proxy) => {
+  var _context;
+  return proxy ? _concatInstanceProperty(_context = "/proxy/".concat(proxy)).call(_context, uri) : uri;
+};
+const fetcher = async _ref => {
+  let url = _ref.url,
+    payload = _ref.payload,
+    config = _ref.config;
+  const data = await executeHttpClientRequest(async options => {
+    const res = await fetch(buildApiUrl(addProxyPrefixToUrl(url, config === null || config === void 0 ? void 0 : config.proxy)), _objectSpread$e(_objectSpread$e({}, options), {}, {
+      method: config === null || config === void 0 ? void 0 : config.method,
+      body: payload,
+      signal: config === null || config === void 0 ? void 0 : config.abortSignal
+    }));
+    if (!res.ok) {
+      const errorData = await res.json();
+      throw new HttpError(res.status, res.statusText, errorData);
+    }
+    const data = res.json();
+    return {
+      data,
+      statusCode: res.status,
+      getHeader: key => res.headers.get(key)
+    };
+  }, {
+    headers: _objectSpread$e({
+      'Content-Type': 'application/json'
+    }, config === null || config === void 0 ? void 0 : config.headers)
+  });
+  return data;
+};
+
+async function uploadFileForImport(_ref) {
+  let projectKey = _ref.projectKey,
+    containerKey = _ref.containerKey,
+    resourceType = _ref.resourceType,
+    file = _ref.file,
+    abortSignal = _ref.abortSignal;
+  const uri = getFileUploadURL(projectKey, resourceType, containerKey);
+  const formData = new FormData();
+  formData.append('file', file, file.name);
+  const response = await fetcher({
+    url: uri,
+    payload: formData,
+    config: {
+      abortSignal,
+      proxy: MC_API_PROXY_TARGETS.IMPORT,
+      method: 'POST',
+      headers: {
+        'Content-Type': null
+      }
+    }
+  });
+  return response;
+}
+
+function ownKeys$d(e, r) { var t = _Object$keys(e); if (_Object$getOwnPropertySymbols) { var o = _Object$getOwnPropertySymbols(e); r && (o = _filterInstanceProperty(o).call(o, function (r) { return _Object$getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$d(e) { for (var r = 1; r < arguments.length; r++) { var _context2, _context3; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty(_context2 = ownKeys$d(Object(t), !0)).call(_context2, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(e, _Object$getOwnPropertyDescriptors(t)) : _forEachInstanceProperty(_context3 = ownKeys$d(Object(t))).call(_context3, function (r) { _Object$defineProperty(e, r, _Object$getOwnPropertyDescriptor(t, r)); }); } return e; }
+function createImportContainerForFileUpload(importContainerDraft, projectKey, asyncDispatch) {
+  return asyncDispatch(actions.post({
+    mcApiProxyTarget: MC_API_PROXY_TARGETS.IMPORT,
+    uri: getCreateImportContainerURL(projectKey),
+    headers: {
+      accept: 'application/json',
+      'Content-Type': 'application/json'
+    },
+    payload: _JSON$stringify(_objectSpread$d(_objectSpread$d({}, importContainerDraft), {}, {
+      tags: [TAG_KEY_SOURCE_FILE_UPLOAD]
+    }))
+  }));
+}
+function deleteImportContainer(projectKey, containerKey, asyncDispatch) {
+  return asyncDispatch(actions.del({
+    mcApiProxyTarget: MC_API_PROXY_TARGETS.IMPORT,
+    uri: getDeleteImportContainerURL(projectKey, containerKey),
+    headers: {
+      accept: 'application/json'
+    }
+  }));
+}
+
+async function processUploadedFile(_ref) {
+  let projectKey = _ref.projectKey,
+    containerKey = _ref.containerKey,
+    resourceType = _ref.resourceType,
+    asyncDispatch = _ref.asyncDispatch;
+  const uri = getProccessFileURL(projectKey, resourceType, containerKey);
+  const response = await asyncDispatch(actions.post({
+    mcApiProxyTarget: MC_API_PROXY_TARGETS.IMPORT,
+    uri: uri,
+    headers: {
+      accept: 'application/json',
+      'Content-Type': 'application/json'
+    },
+    payload: {}
+  }));
+  assertProcessFileResponse(response);
+  return response;
+}
+function assertProcessFileResponse(maybeProcessFileResponse) {
+  const requiredFields = ['message'];
+  if (hasRequiredFields(maybeProcessFileResponse, requiredFields)) return;
+  throw new Error('Invalid response');
+}
+
+function ownKeys$c(e, r) { var t = _Object$keys(e); if (_Object$getOwnPropertySymbols) { var o = _Object$getOwnPropertySymbols(e); r && (o = _filterInstanceProperty(o).call(o, function (r) { return _Object$getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$c(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty(_context = ownKeys$c(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(e, _Object$getOwnPropertyDescriptors(t)) : _forEachInstanceProperty(_context2 = ownKeys$c(Object(t))).call(_context2, function (r) { _Object$defineProperty(e, r, _Object$getOwnPropertyDescriptor(t, r)); }); } return e; }
+function reducer(state, action) {
+  if (action.type === 'setCurrentStep') return _objectSpread$c(_objectSpread$c({}, state), {}, {
+    currentStep: action.currentStep
+  });
+  if (action.type === 'setUploadFileResponse') return _objectSpread$c(_objectSpread$c({}, state), {}, {
+    uploadFileResponse: action.uploadFileResponse
+  });
+  if (action.type === 'setResourceType') return _objectSpread$c(_objectSpread$c({}, state), {}, {
+    resourceType: action.resourceType
+  });
+  if (action.type === 'setContainerKey') return _objectSpread$c(_objectSpread$c({}, state), {}, {
+    containerKey: action.containerKey
+  });
+  if (action.type === 'cancelImport') return _objectSpread$c(_objectSpread$c({}, state), {}, {
+    currentStep: 1,
+    containerKey: undefined,
+    fileUploadClientSideErrors: [],
+    uploadFileResponse: undefined,
+    droppedFile: undefined,
+    dropAreaState: 'disabled'
+  });
+  if (action.type === 'uploadNewFile') return _objectSpread$c(_objectSpread$c({}, state), {}, {
+    currentStep: 1,
+    containerKey: undefined,
+    fileUploadClientSideErrors: [],
+    uploadFileResponse: undefined,
+    droppedFile: undefined,
+    dropAreaState: 'ready-for-drop'
+  });
+  if (action.type === 'setDroppedFile') {
+    return _objectSpread$c(_objectSpread$c({}, state), {}, {
+      droppedFile: action.droppedFile
+    });
+  }
+  if (action.type === 'setFileUploadClientSideErrors') {
+    return _objectSpread$c(_objectSpread$c({}, state), {}, {
+      fileUploadClientSideErrors: action.fileUploadClientSideErrors
+    });
+  }
+  if (action.type === 'setAbortController') {
+    return _objectSpread$c(_objectSpread$c({}, state), {}, {
+      abortController: action.abortController
+    });
+  }
+  throw new Error(getUnknownActionError(action));
+}
+function getUnknownActionError(actionType) {
+  return "Unkown type: ".concat(actionType);
+}
+const initialState = {
+  currentStep: 1,
+  abortController: new AbortController(),
+  dropAreaState: 'disabled',
+  uploadFileResponse: undefined,
+  fileUploadClientSideErrors: [],
+  resourceType: 'category',
+  containerKey: undefined
+};
+
+function ownKeys$b(e, r) { var t = _Object$keys(e); if (_Object$getOwnPropertySymbols) { var o = _Object$getOwnPropertySymbols(e); r && (o = _filterInstanceProperty(o).call(o, function (r) { return _Object$getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$b(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty(_context = ownKeys$b(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(e, _Object$getOwnPropertyDescriptors(t)) : _forEachInstanceProperty(_context2 = ownKeys$b(Object(t))).call(_context2, function (r) { _Object$defineProperty(e, r, _Object$getOwnPropertyDescriptor(t, r)); }); } return e; }
+const ImportResourcesContext = /*#__PURE__*/React.createContext();
+const ImportResourcesProvider = props => {
+  const _useApplicationContex = useApplicationContext(context => {
+      var _context$project;
+      return {
+        projectKey: (_context$project = context.project) === null || _context$project === void 0 ? void 0 : _context$project.key
+      };
+    }),
+    projectKey = _useApplicationContex.projectKey;
+  const asyncDispatch = useAsyncDispatch();
+  const _React$useReducer = React.useReducer(reducer, _objectSpread$b(_objectSpread$b({}, initialState), {}, {
+      resourceType: props.resourceType
+    })),
+    _React$useReducer2 = _slicedToArray(_React$useReducer, 2),
+    state = _React$useReducer2[0],
+    dispatch = _React$useReducer2[1];
+  const setCurrentStep = currentStep => dispatch({
+    type: 'setCurrentStep',
+    currentStep
+  });
+  const setUploadFileResponse = _uploadFileResponse => dispatch({
+    type: 'setUploadFileResponse',
+    uploadFileResponse: _uploadFileResponse
+  });
+  const setResourceType = nextResourceType => dispatch({
+    type: 'setResourceType',
+    resourceType: nextResourceType
+  });
+  const setContainerKey = containerKey => dispatch({
+    type: 'setContainerKey',
+    containerKey
+  });
+  const cancelImport = () => dispatch({
+    type: 'cancelImport'
+  });
+  const uploadNewFile = () => dispatch({
+    type: 'uploadNewFile'
+  });
+  const setDroppedFile = nextDroppedFile => dispatch({
+    type: 'setDroppedFile',
+    droppedFile: nextDroppedFile
+  });
+  const setAbortController = nextAbortController => dispatch({
+    type: 'setAbortController',
+    abortController: nextAbortController
+  });
+  const setFileUploadClientSideErrors = nextFileUploadClientSideErrors => dispatch({
+    type: 'setFileUploadClientSideErrors',
+    fileUploadClientSideErrors: nextFileUploadClientSideErrors
+  });
+  const handleClose = function () {
+    let _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
+      shouldDeleteImportContainer = _ref.shouldDeleteImportContainer;
+    if (state.abortController) state.abortController.abort();
+    if (typeof props.onClose === 'function') props.onClose();
+    // Removes the associated import container when the import is closed
+    if (shouldDeleteImportContainer && projectKey && state.containerKey) deleteImportContainer(projectKey, state.containerKey, asyncDispatch);
+  };
+  const handleStartImportSuccess = () => {
+    if (typeof props.onStartImportSuccess === 'function') props.onStartImportSuccess();
+  };
+  return jsx(ImportResourcesContext.Provider, {
+    value: {
+      state,
+      onClose: handleClose,
+      onStartImportSuccess: handleStartImportSuccess,
+      actions: {
+        setCurrentStep,
+        cancelImport,
+        uploadNewFile,
+        setUploadFileResponse,
+        setResourceType,
+        setDroppedFile,
+        setContainerKey,
+        setAbortController,
+        setFileUploadClientSideErrors
+      }
+    },
+    children: props.children
+  });
+};
+
+function useImportResourcesContext() {
+  const context = useContext(ImportResourcesContext);
+  if (!context) {
+    throw new MissingImportResourceProviderError();
+  }
+  return context;
+}
+
+var messages$3 = defineMessages({
+  fileSizeExceededTitle: {
+    id: 'ImportResourcesModal.sizeExceededTitle',
+    defaultMessage: 'File size exceeded'
+  },
+  fileSizeExceededDescription: {
+    id: 'ImportResourcesModal.sizeExceededDescription',
+    description: 'Error description when the file size exceeds the allowable limit',
+    defaultMessage: 'The file exceeds the maximum allowed size of {fileSizeLimit} MB'
+  },
+  rowLimitExceededTitle: {
+    id: 'ImportResourcesModal.rowLimitExceededTitle',
+    defaultMessage: 'Row limit exceeded'
+  },
+  rowLimitExceededDescription: {
+    id: 'ImportResourcesModal.rowLimitExceededDescription',
+    description: 'Error description when the file contains more rows than the allowable maximum',
+    defaultMessage: 'The file contains more than the allowable maximum of {rowLimit} rows'
+  },
+  dropAreaWrongDelimiterTitle: {
+    id: 'ImportResourcesModal.wrongDelimiterTitle',
+    defaultMessage: 'Wrong delimiter'
+  },
+  dropAreaWrongDelimiterDescription: {
+    id: 'ImportResourcesModal.wrongDelimiterDescription',
+    description: 'Message within the drop area when a CSV file uses an unexpected delimiter',
+    defaultMessage: 'The file is using the wrong delimiter "{delimiter}"'
+  },
+  dropAreaNotEnoughRowsTitle: {
+    id: 'ImportResourcesModal.dropAreaNotEnoughRowsTitle',
+    description: 'Error title shown when the uploaded CSV file does not contain a header and at least one row of data',
+    defaultMessage: 'Invalid CSV file'
+  },
+  dropAreaNotEnoughRowsDescription: {
+    id: 'ImportResourcesModal.dropAreaNotEnoughRowsDescription',
+    description: 'Error description shown when the uploaded CSV file does not contain a header and at least one row of data',
+    defaultMessage: 'Make sure the file contains a header and at least one row of data'
+  },
+  unexpectedError: {
+    id: 'ImportResourcesModal.unexpectedError',
+    description: 'Generic notification message when file upload fails',
+    defaultMessage: 'An unexpected error occurred during the file upload. Please try again, or contact support if this error occurs again.'
+  }
+});
+
+const useUpload = () => {
+  const intl = useIntl();
+  const projectKey = useApplicationContext(context => {
+    var _context$project;
+    return (_context$project = context.project) === null || _context$project === void 0 ? void 0 : _context$project.key;
+  });
+  const _useImportResourcesCo = useImportResourcesContext(),
+    state = _useImportResourcesCo.state,
+    actions = _useImportResourcesCo.actions;
+  const asyncDispatch = useAsyncDispatch();
+  const showNotification = useShowNotification();
+  React.useEffect(() => {
+    return () => {
+      if (state.abortController) state.abortController.abort();
+    };
+  }, [state.abortController]);
+  const isFileValid = async file => {
+    const errors = [];
+    const delimiterCheck = await checkDelimiter(file);
+    if (!delimiterCheck.isValid) errors.push({
+      title: intl.formatMessage(messages$3.dropAreaWrongDelimiterTitle),
+      description: intl.formatMessage(messages$3.dropAreaWrongDelimiterDescription, {
+        delimiter: delimiterCheck.delimiter
+      })
+    });
+    const rowCount = await getRowCount(file);
+    if (rowCount < 1) errors.push({
+      title: intl.formatMessage(messages$3.dropAreaNotEnoughRowsTitle),
+      description: intl.formatMessage(messages$3.dropAreaNotEnoughRowsDescription)
+    });
+    if (state.resourceType && file.size > toBytes(FILE_SIZE_LIMITS_MB[state.resourceType])) errors.push({
+      title: intl.formatMessage(messages$3.fileSizeExceededTitle),
+      description: intl.formatMessage(messages$3.fileSizeExceededDescription, {
+        fileSizeLimit: intl.formatNumber(FILE_SIZE_LIMITS_MB[state.resourceType])
+      })
+    });
+    if (state.resourceType && rowCount > ROW_LIMITS[state.resourceType]) errors.push({
+      title: intl.formatMessage(messages$3.rowLimitExceededTitle),
+      description: intl.formatMessage(messages$3.rowLimitExceededDescription, {
+        rowLimit: intl.formatNumber(ROW_LIMITS[state.resourceType])
+      })
+    });
+    if (errors.length > 0) {
+      actions.setFileUploadClientSideErrors(errors);
+      actions.setCurrentStep(3);
+      return false;
+    }
+    return true;
+  };
+  const handleUploadError = error => {
+    if (isAbortError(error)) {
+      actions.cancelImport();
+      return;
+    }
+    if (error instanceof HttpError) {
+      var _error$errorData, _error$errorData2;
+      if (((_error$errorData = error.errorData) === null || _error$errorData === void 0 ? void 0 : _error$errorData.code) === 'MISSING_KEY_ERROR') {
+        actions.cancelImport();
+        showNotification({
+          kind: 'error',
+          domain: DOMAINS.PAGE,
+          text: error.errorData.message
+        });
+      } else if (((_error$errorData2 = error.errorData) === null || _error$errorData2 === void 0 ? void 0 : _error$errorData2.invalid) > 0) {
+        actions.setUploadFileResponse(error.errorData);
+      } else {
+        actions.cancelImport();
+        showNotification({
+          kind: 'error',
+          domain: DOMAINS.PAGE,
+          text: intl.formatMessage(messages$3.unexpectedError)
+        });
+      }
+    } else {
+      var _state$droppedFile;
+      actions.cancelImport();
+      showNotification({
+        kind: 'error',
+        domain: DOMAINS.PAGE,
+        text: isError(error) ? error.toString() : String(error)
+      });
+      reportErrorToSentry(new Error('Upload File Error: An unexpected issue occurred while uploading the file'), {
+        extra: {
+          error,
+          projectKey,
+          containerKey: state.containerKey,
+          resourceType: state.resourceType,
+          fileSizeInBytes: (_state$droppedFile = state.droppedFile) === null || _state$droppedFile === void 0 ? void 0 : _state$droppedFile.size
+        }
+      });
+    }
+  };
+  const handleUploadAndValidation = async () => {
+    if (!projectKey || !state.droppedFile || !state.resourceType) return;
+    const canUpload = await isFileValid(state.droppedFile);
+    if (!canUpload) return;
+    actions.setCurrentStep(2);
+    const containerKey = encodeFileNameWithTimestampToContainerKey(state.droppedFile.name);
+    actions.setContainerKey(containerKey);
+    const newAbortController = new AbortController();
+    actions.setAbortController(newAbortController);
+    try {
+      await createImportContainerForFileUpload({
+        key: containerKey,
+        resourceType: state.resourceType
+      }, projectKey, asyncDispatch);
+      const fileUploadResponse = await uploadFileForImport({
+        projectKey,
+        containerKey,
+        resourceType: state.resourceType,
+        file: state.droppedFile,
+        abortSignal: newAbortController.signal
+      });
+      actions.setUploadFileResponse(fileUploadResponse);
+    } catch (error) {
+      deleteImportContainer(projectKey, containerKey, asyncDispatch);
+      handleUploadError(error);
+    } finally {
+      actions.setCurrentStep(3);
+    }
+  };
+  return {
+    handleUploadAndValidation
+  };
+};
+
+function resourceTypeToDisplayName(_ref) {
+  let resourceType = _ref.resourceType,
+    _ref$isUpperCase = _ref.isUpperCase,
+    isUpperCase = _ref$isUpperCase === void 0 ? false : _ref$isUpperCase,
+    _ref$isPlural = _ref.isPlural,
+    isPlural = _ref$isPlural === void 0 ? false : _ref$isPlural;
+  let displayName;
+  switch (resourceType) {
+    case 'category':
+      displayName = isPlural ? 'Categories' : 'Category';
+      break;
+    case 'product':
+      displayName = isPlural ? 'Products' : 'Product';
+      break;
+    default:
+      throw new UnexpectedResourceTypeError(resourceType);
+  }
+  return isUpperCase ? displayName : displayName.toLowerCase();
+}
+
+const getBorderColor = state => {
+  const borderColors = {
+    default: '#909dbc',
+    error: '#e60050',
+    active: customProperties.colorPrimary
+  };
+  return borderColors[state] || borderColors.default;
+};
+const getDashedBorder = function () {
+  let state = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'default';
+  const color = getBorderColor(state);
+  const svgContent = "\n    <svg width=\"100%\" height=\"100%\" xmlns=\"http://www.w3.org/2000/svg\">\n      <rect width=\"100%\" height=\"100%\" fill=\"none\" stroke=\"".concat(color, "\" stroke-width=\"2px\" stroke-dasharray=\"6,6\" stroke-dashoffset=\"0\" stroke-linecap=\"square\"/>\n    </svg>\n  ");
+  return "data:image/svg+xml,".concat(encodeURIComponent(svgContent));
+};
+const base = /*#__PURE__*/css("border-radius:", customProperties.borderRadius6, ";min-height:136px;display:flex;justify-content:center;align-items:center;" + (process.env.NODE_ENV === "production" ? "" : ";label:base;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUF5QmdCIiwiZmlsZSI6InN0eWxlcy50cyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0J1xuaW1wb3J0IHsgY3VzdG9tUHJvcGVydGllcyB9IGZyb20gJ0Bjb21tZXJjZXRvb2xzLWZyb250ZW5kL3VpLWtpdCdcblxudHlwZSBEcm9wQXJlYVN0YXRlID0gJ2RlZmF1bHQnIHwgJ2Vycm9yJyB8ICdhY3RpdmUnXG5cbmNvbnN0IGdldEJvcmRlckNvbG9yID0gKHN0YXRlOiBEcm9wQXJlYVN0YXRlKSA9PiB7XG4gIGNvbnN0IGJvcmRlckNvbG9ycyA9IHtcbiAgICBkZWZhdWx0OiAnIzkwOWRiYycsXG4gICAgZXJyb3I6ICcjZTYwMDUwJyxcbiAgICBhY3RpdmU6IGN1c3RvbVByb3BlcnRpZXMuY29sb3JQcmltYXJ5LFxuICB9XG5cbiAgcmV0dXJuIGJvcmRlckNvbG9yc1tzdGF0ZV0gfHwgYm9yZGVyQ29sb3JzLmRlZmF1bHRcbn1cblxuY29uc3QgZ2V0RGFzaGVkQm9yZGVyID0gKHN0YXRlOiBEcm9wQXJlYVN0YXRlID0gJ2RlZmF1bHQnKSA9PiB7XG4gIGNvbnN0IGNvbG9yID0gZ2V0Qm9yZGVyQ29sb3Ioc3RhdGUpXG4gIGNvbnN0IHN2Z0NvbnRlbnQgPSBgXG4gICAgPHN2ZyB3aWR0aD1cIjEwMCVcIiBoZWlnaHQ9XCIxMDAlXCIgeG1sbnM9XCJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2Z1wiPlxuICAgICAgPHJlY3Qgd2lkdGg9XCIxMDAlXCIgaGVpZ2h0PVwiMTAwJVwiIGZpbGw9XCJub25lXCIgc3Ryb2tlPVwiJHtjb2xvcn1cIiBzdHJva2Utd2lkdGg9XCIycHhcIiBzdHJva2UtZGFzaGFycmF5PVwiNiw2XCIgc3Ryb2tlLWRhc2hvZmZzZXQ9XCIwXCIgc3Ryb2tlLWxpbmVjYXA9XCJzcXVhcmVcIi8+XG4gICAgPC9zdmc+XG4gIGBcbiAgcmV0dXJuIGBkYXRhOmltYWdlL3N2Zyt4bWwsJHtlbmNvZGVVUklDb21wb25lbnQoc3ZnQ29udGVudCl9YFxufVxuXG5jb25zdCBiYXNlID0gY3NzYFxuICBib3JkZXItcmFkaXVzOiAke2N1c3RvbVByb3BlcnRpZXMuYm9yZGVyUmFkaXVzNn07XG4gIG1pbi1oZWlnaHQ6IDEzNnB4O1xuICBkaXNwbGF5OiBmbGV4O1xuICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjtcbiAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbmBcbmNvbnN0IGRpc2FibGVkID0gY3NzYGBcbmNvbnN0IHJlYWR5Rm9yRHJvcCA9IGNzc2BcbiAgYmFja2dyb3VuZC1pbWFnZTogdXJsKFxcXCIke2dldERhc2hlZEJvcmRlcigpfVxcXCIpO1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAke2N1c3RvbVByb3BlcnRpZXMuY29sb3JTdXJmYWNlfTtcbmBcbmNvbnN0IGFjdGl2ZURyYWcgPSBjc3NgXG4gIGJhY2tncm91bmQtaW1hZ2U6IHVybChcXFwiJHtnZXREYXNoZWRCb3JkZXIoJ2FjdGl2ZScpfVxcXCIpO1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAke2N1c3RvbVByb3BlcnRpZXMuY29sb3JQcmltYXJ5OTV9O1xuICBwYWRkaW5nOiAke2N1c3RvbVByb3BlcnRpZXMuc3BhY2luZzUwfSAxMDBweDtcbmBcbmNvbnN0IGZpbGVEcm9wcGVkID0gY3NzYFxuICBiYWNrZ3JvdW5kLWltYWdlOiB1cmwoXFxcIiR7Z2V0RGFzaGVkQm9yZGVyKCl9XFxcIik7XG4gIGJhY2tncm91bmQtY29sb3I6ICR7Y3VzdG9tUHJvcGVydGllcy5jb2xvclN1cmZhY2V9O1xuICBwYWRkaW5nOiAke2N1c3RvbVByb3BlcnRpZXMuc3BhY2luZzUwfSAxMDBweDtcbmBcblxuZXhwb3J0IGNvbnN0IHN0eWxlcyA9IHtcbiAgYmFzZSxcbiAgcmVhZHlGb3JEcm9wLFxuICBmaWxlRHJvcHBlZCxcbiAgZGlzYWJsZWQsXG4gIGFjdGl2ZURyYWcsXG59XG4iXX0= */");
+const disabled = /*#__PURE__*/css(process.env.NODE_ENV === "production" ? "" : ";label:disabled;", process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFnQ29CIiwiZmlsZSI6InN0eWxlcy50cyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0J1xuaW1wb3J0IHsgY3VzdG9tUHJvcGVydGllcyB9IGZyb20gJ0Bjb21tZXJjZXRvb2xzLWZyb250ZW5kL3VpLWtpdCdcblxudHlwZSBEcm9wQXJlYVN0YXRlID0gJ2RlZmF1bHQnIHwgJ2Vycm9yJyB8ICdhY3RpdmUnXG5cbmNvbnN0IGdldEJvcmRlckNvbG9yID0gKHN0YXRlOiBEcm9wQXJlYVN0YXRlKSA9PiB7XG4gIGNvbnN0IGJvcmRlckNvbG9ycyA9IHtcbiAgICBkZWZhdWx0OiAnIzkwOWRiYycsXG4gICAgZXJyb3I6ICcjZTYwMDUwJyxcbiAgICBhY3RpdmU6IGN1c3RvbVByb3BlcnRpZXMuY29sb3JQcmltYXJ5LFxuICB9XG5cbiAgcmV0dXJuIGJvcmRlckNvbG9yc1tzdGF0ZV0gfHwgYm9yZGVyQ29sb3JzLmRlZmF1bHRcbn1cblxuY29uc3QgZ2V0RGFzaGVkQm9yZGVyID0gKHN0YXRlOiBEcm9wQXJlYVN0YXRlID0gJ2RlZmF1bHQnKSA9PiB7XG4gIGNvbnN0IGNvbG9yID0gZ2V0Qm9yZGVyQ29sb3Ioc3RhdGUpXG4gIGNvbnN0IHN2Z0NvbnRlbnQgPSBgXG4gICAgPHN2ZyB3aWR0aD1cIjEwMCVcIiBoZWlnaHQ9XCIxMDAlXCIgeG1sbnM9XCJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2Z1wiPlxuICAgICAgPHJlY3Qgd2lkdGg9XCIxMDAlXCIgaGVpZ2h0PVwiMTAwJVwiIGZpbGw9XCJub25lXCIgc3Ryb2tlPVwiJHtjb2xvcn1cIiBzdHJva2Utd2lkdGg9XCIycHhcIiBzdHJva2UtZGFzaGFycmF5PVwiNiw2XCIgc3Ryb2tlLWRhc2hvZmZzZXQ9XCIwXCIgc3Ryb2tlLWxpbmVjYXA9XCJzcXVhcmVcIi8+XG4gICAgPC9zdmc+XG4gIGBcbiAgcmV0dXJuIGBkYXRhOmltYWdlL3N2Zyt4bWwsJHtlbmNvZGVVUklDb21wb25lbnQoc3ZnQ29udGVudCl9YFxufVxuXG5jb25zdCBiYXNlID0gY3NzYFxuICBib3JkZXItcmFkaXVzOiAke2N1c3RvbVByb3BlcnRpZXMuYm9yZGVyUmFkaXVzNn07XG4gIG1pbi1oZWlnaHQ6IDEzNnB4O1xuICBkaXNwbGF5OiBmbGV4O1xuICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjtcbiAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbmBcbmNvbnN0IGRpc2FibGVkID0gY3NzYGBcbmNvbnN0IHJlYWR5Rm9yRHJvcCA9IGNzc2BcbiAgYmFja2dyb3VuZC1pbWFnZTogdXJsKFxcXCIke2dldERhc2hlZEJvcmRlcigpfVxcXCIpO1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAke2N1c3RvbVByb3BlcnRpZXMuY29sb3JTdXJmYWNlfTtcbmBcbmNvbnN0IGFjdGl2ZURyYWcgPSBjc3NgXG4gIGJhY2tncm91bmQtaW1hZ2U6IHVybChcXFwiJHtnZXREYXNoZWRCb3JkZXIoJ2FjdGl2ZScpfVxcXCIpO1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAke2N1c3RvbVByb3BlcnRpZXMuY29sb3JQcmltYXJ5OTV9O1xuICBwYWRkaW5nOiAke2N1c3RvbVByb3BlcnRpZXMuc3BhY2luZzUwfSAxMDBweDtcbmBcbmNvbnN0IGZpbGVEcm9wcGVkID0gY3NzYFxuICBiYWNrZ3JvdW5kLWltYWdlOiB1cmwoXFxcIiR7Z2V0RGFzaGVkQm9yZGVyKCl9XFxcIik7XG4gIGJhY2tncm91bmQtY29sb3I6ICR7Y3VzdG9tUHJvcGVydGllcy5jb2xvclN1cmZhY2V9O1xuICBwYWRkaW5nOiAke2N1c3RvbVByb3BlcnRpZXMuc3BhY2luZzUwfSAxMDBweDtcbmBcblxuZXhwb3J0IGNvbnN0IHN0eWxlcyA9IHtcbiAgYmFzZSxcbiAgcmVhZHlGb3JEcm9wLFxuICBmaWxlRHJvcHBlZCxcbiAgZGlzYWJsZWQsXG4gIGFjdGl2ZURyYWcsXG59XG4iXX0= */");
+const readyForDrop = /*#__PURE__*/css("background-image:url(\"", getDashedBorder(), "\");background-color:", customProperties.colorSurface, ";" + (process.env.NODE_ENV === "production" ? "" : ";label:readyForDrop;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFpQ3dCIiwiZmlsZSI6InN0eWxlcy50cyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0J1xuaW1wb3J0IHsgY3VzdG9tUHJvcGVydGllcyB9IGZyb20gJ0Bjb21tZXJjZXRvb2xzLWZyb250ZW5kL3VpLWtpdCdcblxudHlwZSBEcm9wQXJlYVN0YXRlID0gJ2RlZmF1bHQnIHwgJ2Vycm9yJyB8ICdhY3RpdmUnXG5cbmNvbnN0IGdldEJvcmRlckNvbG9yID0gKHN0YXRlOiBEcm9wQXJlYVN0YXRlKSA9PiB7XG4gIGNvbnN0IGJvcmRlckNvbG9ycyA9IHtcbiAgICBkZWZhdWx0OiAnIzkwOWRiYycsXG4gICAgZXJyb3I6ICcjZTYwMDUwJyxcbiAgICBhY3RpdmU6IGN1c3RvbVByb3BlcnRpZXMuY29sb3JQcmltYXJ5LFxuICB9XG5cbiAgcmV0dXJuIGJvcmRlckNvbG9yc1tzdGF0ZV0gfHwgYm9yZGVyQ29sb3JzLmRlZmF1bHRcbn1cblxuY29uc3QgZ2V0RGFzaGVkQm9yZGVyID0gKHN0YXRlOiBEcm9wQXJlYVN0YXRlID0gJ2RlZmF1bHQnKSA9PiB7XG4gIGNvbnN0IGNvbG9yID0gZ2V0Qm9yZGVyQ29sb3Ioc3RhdGUpXG4gIGNvbnN0IHN2Z0NvbnRlbnQgPSBgXG4gICAgPHN2ZyB3aWR0aD1cIjEwMCVcIiBoZWlnaHQ9XCIxMDAlXCIgeG1sbnM9XCJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2Z1wiPlxuICAgICAgPHJlY3Qgd2lkdGg9XCIxMDAlXCIgaGVpZ2h0PVwiMTAwJVwiIGZpbGw9XCJub25lXCIgc3Ryb2tlPVwiJHtjb2xvcn1cIiBzdHJva2Utd2lkdGg9XCIycHhcIiBzdHJva2UtZGFzaGFycmF5PVwiNiw2XCIgc3Ryb2tlLWRhc2hvZmZzZXQ9XCIwXCIgc3Ryb2tlLWxpbmVjYXA9XCJzcXVhcmVcIi8+XG4gICAgPC9zdmc+XG4gIGBcbiAgcmV0dXJuIGBkYXRhOmltYWdlL3N2Zyt4bWwsJHtlbmNvZGVVUklDb21wb25lbnQoc3ZnQ29udGVudCl9YFxufVxuXG5jb25zdCBiYXNlID0gY3NzYFxuICBib3JkZXItcmFkaXVzOiAke2N1c3RvbVByb3BlcnRpZXMuYm9yZGVyUmFkaXVzNn07XG4gIG1pbi1oZWlnaHQ6IDEzNnB4O1xuICBkaXNwbGF5OiBmbGV4O1xuICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjtcbiAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbmBcbmNvbnN0IGRpc2FibGVkID0gY3NzYGBcbmNvbnN0IHJlYWR5Rm9yRHJvcCA9IGNzc2BcbiAgYmFja2dyb3VuZC1pbWFnZTogdXJsKFxcXCIke2dldERhc2hlZEJvcmRlcigpfVxcXCIpO1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAke2N1c3RvbVByb3BlcnRpZXMuY29sb3JTdXJmYWNlfTtcbmBcbmNvbnN0IGFjdGl2ZURyYWcgPSBjc3NgXG4gIGJhY2tncm91bmQtaW1hZ2U6IHVybChcXFwiJHtnZXREYXNoZWRCb3JkZXIoJ2FjdGl2ZScpfVxcXCIpO1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAke2N1c3RvbVByb3BlcnRpZXMuY29sb3JQcmltYXJ5OTV9O1xuICBwYWRkaW5nOiAke2N1c3RvbVByb3BlcnRpZXMuc3BhY2luZzUwfSAxMDBweDtcbmBcbmNvbnN0IGZpbGVEcm9wcGVkID0gY3NzYFxuICBiYWNrZ3JvdW5kLWltYWdlOiB1cmwoXFxcIiR7Z2V0RGFzaGVkQm9yZGVyKCl9XFxcIik7XG4gIGJhY2tncm91bmQtY29sb3I6ICR7Y3VzdG9tUHJvcGVydGllcy5jb2xvclN1cmZhY2V9O1xuICBwYWRkaW5nOiAke2N1c3RvbVByb3BlcnRpZXMuc3BhY2luZzUwfSAxMDBweDtcbmBcblxuZXhwb3J0IGNvbnN0IHN0eWxlcyA9IHtcbiAgYmFzZSxcbiAgcmVhZHlGb3JEcm9wLFxuICBmaWxlRHJvcHBlZCxcbiAgZGlzYWJsZWQsXG4gIGFjdGl2ZURyYWcsXG59XG4iXX0= */");
+const activeDrag = /*#__PURE__*/css("background-image:url(\"", getDashedBorder('active'), "\");background-color:", customProperties.colorPrimary95, ";padding:", customProperties.spacing50, " 100px;" + (process.env.NODE_ENV === "production" ? "" : ";label:activeDrag;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFxQ3NCIiwiZmlsZSI6InN0eWxlcy50cyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0J1xuaW1wb3J0IHsgY3VzdG9tUHJvcGVydGllcyB9IGZyb20gJ0Bjb21tZXJjZXRvb2xzLWZyb250ZW5kL3VpLWtpdCdcblxudHlwZSBEcm9wQXJlYVN0YXRlID0gJ2RlZmF1bHQnIHwgJ2Vycm9yJyB8ICdhY3RpdmUnXG5cbmNvbnN0IGdldEJvcmRlckNvbG9yID0gKHN0YXRlOiBEcm9wQXJlYVN0YXRlKSA9PiB7XG4gIGNvbnN0IGJvcmRlckNvbG9ycyA9IHtcbiAgICBkZWZhdWx0OiAnIzkwOWRiYycsXG4gICAgZXJyb3I6ICcjZTYwMDUwJyxcbiAgICBhY3RpdmU6IGN1c3RvbVByb3BlcnRpZXMuY29sb3JQcmltYXJ5LFxuICB9XG5cbiAgcmV0dXJuIGJvcmRlckNvbG9yc1tzdGF0ZV0gfHwgYm9yZGVyQ29sb3JzLmRlZmF1bHRcbn1cblxuY29uc3QgZ2V0RGFzaGVkQm9yZGVyID0gKHN0YXRlOiBEcm9wQXJlYVN0YXRlID0gJ2RlZmF1bHQnKSA9PiB7XG4gIGNvbnN0IGNvbG9yID0gZ2V0Qm9yZGVyQ29sb3Ioc3RhdGUpXG4gIGNvbnN0IHN2Z0NvbnRlbnQgPSBgXG4gICAgPHN2ZyB3aWR0aD1cIjEwMCVcIiBoZWlnaHQ9XCIxMDAlXCIgeG1sbnM9XCJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2Z1wiPlxuICAgICAgPHJlY3Qgd2lkdGg9XCIxMDAlXCIgaGVpZ2h0PVwiMTAwJVwiIGZpbGw9XCJub25lXCIgc3Ryb2tlPVwiJHtjb2xvcn1cIiBzdHJva2Utd2lkdGg9XCIycHhcIiBzdHJva2UtZGFzaGFycmF5PVwiNiw2XCIgc3Ryb2tlLWRhc2hvZmZzZXQ9XCIwXCIgc3Ryb2tlLWxpbmVjYXA9XCJzcXVhcmVcIi8+XG4gICAgPC9zdmc+XG4gIGBcbiAgcmV0dXJuIGBkYXRhOmltYWdlL3N2Zyt4bWwsJHtlbmNvZGVVUklDb21wb25lbnQoc3ZnQ29udGVudCl9YFxufVxuXG5jb25zdCBiYXNlID0gY3NzYFxuICBib3JkZXItcmFkaXVzOiAke2N1c3RvbVByb3BlcnRpZXMuYm9yZGVyUmFkaXVzNn07XG4gIG1pbi1oZWlnaHQ6IDEzNnB4O1xuICBkaXNwbGF5OiBmbGV4O1xuICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjtcbiAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbmBcbmNvbnN0IGRpc2FibGVkID0gY3NzYGBcbmNvbnN0IHJlYWR5Rm9yRHJvcCA9IGNzc2BcbiAgYmFja2dyb3VuZC1pbWFnZTogdXJsKFxcXCIke2dldERhc2hlZEJvcmRlcigpfVxcXCIpO1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAke2N1c3RvbVByb3BlcnRpZXMuY29sb3JTdXJmYWNlfTtcbmBcbmNvbnN0IGFjdGl2ZURyYWcgPSBjc3NgXG4gIGJhY2tncm91bmQtaW1hZ2U6IHVybChcXFwiJHtnZXREYXNoZWRCb3JkZXIoJ2FjdGl2ZScpfVxcXCIpO1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAke2N1c3RvbVByb3BlcnRpZXMuY29sb3JQcmltYXJ5OTV9O1xuICBwYWRkaW5nOiAke2N1c3RvbVByb3BlcnRpZXMuc3BhY2luZzUwfSAxMDBweDtcbmBcbmNvbnN0IGZpbGVEcm9wcGVkID0gY3NzYFxuICBiYWNrZ3JvdW5kLWltYWdlOiB1cmwoXFxcIiR7Z2V0RGFzaGVkQm9yZGVyKCl9XFxcIik7XG4gIGJhY2tncm91bmQtY29sb3I6ICR7Y3VzdG9tUHJvcGVydGllcy5jb2xvclN1cmZhY2V9O1xuICBwYWRkaW5nOiAke2N1c3RvbVByb3BlcnRpZXMuc3BhY2luZzUwfSAxMDBweDtcbmBcblxuZXhwb3J0IGNvbnN0IHN0eWxlcyA9IHtcbiAgYmFzZSxcbiAgcmVhZHlGb3JEcm9wLFxuICBmaWxlRHJvcHBlZCxcbiAgZGlzYWJsZWQsXG4gIGFjdGl2ZURyYWcsXG59XG4iXX0= */");
+const fileDropped = /*#__PURE__*/css("background-image:url(\"", getDashedBorder(), "\");background-color:", customProperties.colorSurface, ";padding:", customProperties.spacing50, " 100px;" + (process.env.NODE_ENV === "production" ? "" : ";label:fileDropped;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUEwQ3VCIiwiZmlsZSI6InN0eWxlcy50cyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0J1xuaW1wb3J0IHsgY3VzdG9tUHJvcGVydGllcyB9IGZyb20gJ0Bjb21tZXJjZXRvb2xzLWZyb250ZW5kL3VpLWtpdCdcblxudHlwZSBEcm9wQXJlYVN0YXRlID0gJ2RlZmF1bHQnIHwgJ2Vycm9yJyB8ICdhY3RpdmUnXG5cbmNvbnN0IGdldEJvcmRlckNvbG9yID0gKHN0YXRlOiBEcm9wQXJlYVN0YXRlKSA9PiB7XG4gIGNvbnN0IGJvcmRlckNvbG9ycyA9IHtcbiAgICBkZWZhdWx0OiAnIzkwOWRiYycsXG4gICAgZXJyb3I6ICcjZTYwMDUwJyxcbiAgICBhY3RpdmU6IGN1c3RvbVByb3BlcnRpZXMuY29sb3JQcmltYXJ5LFxuICB9XG5cbiAgcmV0dXJuIGJvcmRlckNvbG9yc1tzdGF0ZV0gfHwgYm9yZGVyQ29sb3JzLmRlZmF1bHRcbn1cblxuY29uc3QgZ2V0RGFzaGVkQm9yZGVyID0gKHN0YXRlOiBEcm9wQXJlYVN0YXRlID0gJ2RlZmF1bHQnKSA9PiB7XG4gIGNvbnN0IGNvbG9yID0gZ2V0Qm9yZGVyQ29sb3Ioc3RhdGUpXG4gIGNvbnN0IHN2Z0NvbnRlbnQgPSBgXG4gICAgPHN2ZyB3aWR0aD1cIjEwMCVcIiBoZWlnaHQ9XCIxMDAlXCIgeG1sbnM9XCJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2Z1wiPlxuICAgICAgPHJlY3Qgd2lkdGg9XCIxMDAlXCIgaGVpZ2h0PVwiMTAwJVwiIGZpbGw9XCJub25lXCIgc3Ryb2tlPVwiJHtjb2xvcn1cIiBzdHJva2Utd2lkdGg9XCIycHhcIiBzdHJva2UtZGFzaGFycmF5PVwiNiw2XCIgc3Ryb2tlLWRhc2hvZmZzZXQ9XCIwXCIgc3Ryb2tlLWxpbmVjYXA9XCJzcXVhcmVcIi8+XG4gICAgPC9zdmc+XG4gIGBcbiAgcmV0dXJuIGBkYXRhOmltYWdlL3N2Zyt4bWwsJHtlbmNvZGVVUklDb21wb25lbnQoc3ZnQ29udGVudCl9YFxufVxuXG5jb25zdCBiYXNlID0gY3NzYFxuICBib3JkZXItcmFkaXVzOiAke2N1c3RvbVByb3BlcnRpZXMuYm9yZGVyUmFkaXVzNn07XG4gIG1pbi1oZWlnaHQ6IDEzNnB4O1xuICBkaXNwbGF5OiBmbGV4O1xuICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjtcbiAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbmBcbmNvbnN0IGRpc2FibGVkID0gY3NzYGBcbmNvbnN0IHJlYWR5Rm9yRHJvcCA9IGNzc2BcbiAgYmFja2dyb3VuZC1pbWFnZTogdXJsKFxcXCIke2dldERhc2hlZEJvcmRlcigpfVxcXCIpO1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAke2N1c3RvbVByb3BlcnRpZXMuY29sb3JTdXJmYWNlfTtcbmBcbmNvbnN0IGFjdGl2ZURyYWcgPSBjc3NgXG4gIGJhY2tncm91bmQtaW1hZ2U6IHVybChcXFwiJHtnZXREYXNoZWRCb3JkZXIoJ2FjdGl2ZScpfVxcXCIpO1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAke2N1c3RvbVByb3BlcnRpZXMuY29sb3JQcmltYXJ5OTV9O1xuICBwYWRkaW5nOiAke2N1c3RvbVByb3BlcnRpZXMuc3BhY2luZzUwfSAxMDBweDtcbmBcbmNvbnN0IGZpbGVEcm9wcGVkID0gY3NzYFxuICBiYWNrZ3JvdW5kLWltYWdlOiB1cmwoXFxcIiR7Z2V0RGFzaGVkQm9yZGVyKCl9XFxcIik7XG4gIGJhY2tncm91bmQtY29sb3I6ICR7Y3VzdG9tUHJvcGVydGllcy5jb2xvclN1cmZhY2V9O1xuICBwYWRkaW5nOiAke2N1c3RvbVByb3BlcnRpZXMuc3BhY2luZzUwfSAxMDBweDtcbmBcblxuZXhwb3J0IGNvbnN0IHN0eWxlcyA9IHtcbiAgYmFzZSxcbiAgcmVhZHlGb3JEcm9wLFxuICBmaWxlRHJvcHBlZCxcbiAgZGlzYWJsZWQsXG4gIGFjdGl2ZURyYWcsXG59XG4iXX0= */");
+const styles = {
+  base,
+  readyForDrop,
+  fileDropped,
+  disabled,
+  activeDrag
+};
+
+const DropWrapper = /*#__PURE__*/_styled("div", process.env.NODE_ENV === "production" ? {
+  target: "ef0z5en0"
+} : {
+  target: "ef0z5en0",
+  label: "DropWrapper"
+})(styles.base, " ", props => {
+  if (props.dropAreaState === 'disabled') {
+    return styles.disabled;
+  }
+  if (props.dropAreaState === 'ready-for-drop') {
+    return styles.readyForDrop;
+  }
+  if (props.dropAreaState === 'active-drag') {
+    return styles.activeDrag;
+  }
+  if (props.dropAreaState === 'file-dropped') {
+    return styles.fileDropped;
+  }
+  return getDefaultDropWrapperStyles(props.dropAreaState);
+}, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImRyb3AtYXJlYS13cmFwcGVyLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFTdUQiLCJmaWxlIjoiZHJvcC1hcmVhLXdyYXBwZXIudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnXG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCdcbmltcG9ydCB7IHR5cGUgRHJvcHpvbmVSb290UHJvcHMgfSBmcm9tICdyZWFjdC1kcm9wem9uZSdcbmltcG9ydCB7IHN0eWxlcyB9IGZyb20gJy4vc3R5bGVzJ1xuaW1wb3J0IHsgdHlwZSBEcm9wQXJlYVN0YXRlIH0gZnJvbSAnQHR5cGVzJ1xuXG5pbnRlcmZhY2UgRHJvcFdyYXBwZXJQcm9wcyBleHRlbmRzIERyb3B6b25lUm9vdFByb3BzIHtcbiAgZHJvcEFyZWFTdGF0ZTogRHJvcEFyZWFTdGF0ZVxufVxuZXhwb3J0IGNvbnN0IERyb3BXcmFwcGVyID0gc3R5bGVkLmRpdjxEcm9wV3JhcHBlclByb3BzPmBcbiAgJHtzdHlsZXMuYmFzZX1cbiAgJHsocHJvcHMpID0+IHtcbiAgICBpZiAocHJvcHMuZHJvcEFyZWFTdGF0ZSA9PT0gJ2Rpc2FibGVkJykge1xuICAgICAgcmV0dXJuIHN0eWxlcy5kaXNhYmxlZFxuICAgIH1cbiAgICBpZiAocHJvcHMuZHJvcEFyZWFTdGF0ZSA9PT0gJ3JlYWR5LWZvci1kcm9wJykge1xuICAgICAgcmV0dXJuIHN0eWxlcy5yZWFkeUZvckRyb3BcbiAgICB9XG4gICAgaWYgKHByb3BzLmRyb3BBcmVhU3RhdGUgPT09ICdhY3RpdmUtZHJhZycpIHtcbiAgICAgIHJldHVybiBzdHlsZXMuYWN0aXZlRHJhZ1xuICAgIH1cbiAgICBpZiAocHJvcHMuZHJvcEFyZWFTdGF0ZSA9PT0gJ2ZpbGUtZHJvcHBlZCcpIHtcbiAgICAgIHJldHVybiBzdHlsZXMuZmlsZURyb3BwZWRcbiAgICB9XG4gICAgcmV0dXJuIGdldERlZmF1bHREcm9wV3JhcHBlclN0eWxlcyhwcm9wcy5kcm9wQXJlYVN0YXRlKVxuICB9fVxuYFxuZnVuY3Rpb24gZ2V0RGVmYXVsdERyb3BXcmFwcGVyU3R5bGVzKF9kcm9wQXJlYVN0YXRlOiBuZXZlcikge1xuICByZXR1cm4gY3NzYGBcbn1cbiJdfQ== */"));
+function getDefaultDropWrapperStyles(_dropAreaState) {
+  return /*#__PURE__*/css(process.env.NODE_ENV === "production" ? "" : ";label:getDefaultDropWrapperStyles;", process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImRyb3AtYXJlYS13cmFwcGVyLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUE0QlkiLCJmaWxlIjoiZHJvcC1hcmVhLXdyYXBwZXIudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnXG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCdcbmltcG9ydCB7IHR5cGUgRHJvcHpvbmVSb290UHJvcHMgfSBmcm9tICdyZWFjdC1kcm9wem9uZSdcbmltcG9ydCB7IHN0eWxlcyB9IGZyb20gJy4vc3R5bGVzJ1xuaW1wb3J0IHsgdHlwZSBEcm9wQXJlYVN0YXRlIH0gZnJvbSAnQHR5cGVzJ1xuXG5pbnRlcmZhY2UgRHJvcFdyYXBwZXJQcm9wcyBleHRlbmRzIERyb3B6b25lUm9vdFByb3BzIHtcbiAgZHJvcEFyZWFTdGF0ZTogRHJvcEFyZWFTdGF0ZVxufVxuZXhwb3J0IGNvbnN0IERyb3BXcmFwcGVyID0gc3R5bGVkLmRpdjxEcm9wV3JhcHBlclByb3BzPmBcbiAgJHtzdHlsZXMuYmFzZX1cbiAgJHsocHJvcHMpID0+IHtcbiAgICBpZiAocHJvcHMuZHJvcEFyZWFTdGF0ZSA9PT0gJ2Rpc2FibGVkJykge1xuICAgICAgcmV0dXJuIHN0eWxlcy5kaXNhYmxlZFxuICAgIH1cbiAgICBpZiAocHJvcHMuZHJvcEFyZWFTdGF0ZSA9PT0gJ3JlYWR5LWZvci1kcm9wJykge1xuICAgICAgcmV0dXJuIHN0eWxlcy5yZWFkeUZvckRyb3BcbiAgICB9XG4gICAgaWYgKHByb3BzLmRyb3BBcmVhU3RhdGUgPT09ICdhY3RpdmUtZHJhZycpIHtcbiAgICAgIHJldHVybiBzdHlsZXMuYWN0aXZlRHJhZ1xuICAgIH1cbiAgICBpZiAocHJvcHMuZHJvcEFyZWFTdGF0ZSA9PT0gJ2ZpbGUtZHJvcHBlZCcpIHtcbiAgICAgIHJldHVybiBzdHlsZXMuZmlsZURyb3BwZWRcbiAgICB9XG4gICAgcmV0dXJuIGdldERlZmF1bHREcm9wV3JhcHBlclN0eWxlcyhwcm9wcy5kcm9wQXJlYVN0YXRlKVxuICB9fVxuYFxuZnVuY3Rpb24gZ2V0RGVmYXVsdERyb3BXcmFwcGVyU3R5bGVzKF9kcm9wQXJlYVN0YXRlOiBuZXZlcikge1xuICByZXR1cm4gY3NzYGBcbn1cbiJdfQ== */");
+}
+
+var ActiveDragDropArea = /*#__PURE__*/lazy(() => import('./active-drag-drop-area-06cef014.esm.js' /* webpackChunkName: "active-drag-drop-area" */));
+
+var DisabledDropArea = /*#__PURE__*/lazy(() => import('./disabled-drop-area-2c088477.esm.js' /* webpackChunkName: "disabled-drop-area" */));
+
+var EnabledDropArea = /*#__PURE__*/lazy(() => import('./enabled-drop-area-69507fae.esm.js' /* webpackChunkName: "enabled-drop-area" */));
+
+var FileDropped = /*#__PURE__*/lazy(() => import('./file-dropped-area-6f365e02.esm.js' /* webpackChunkName: "filed-dropped-area" */));
+
+function getDropArea(_ref) {
+  let dropAreaState = _ref.dropAreaState,
+    resourceType = _ref.resourceType,
+    isFileDropped = _ref.isFileDropped;
+  if (dropAreaState === 'file-dropped') {
+    return jsx(FileDropped, {});
+  }
+  if (dropAreaState === 'disabled' || !resourceType) {
+    return jsx(DisabledDropArea, {});
+  }
+  if (dropAreaState === 'ready-for-drop') {
+    return jsx(EnabledDropArea, {});
+  }
+  if (dropAreaState === 'active-drag') {
+    return jsx(ActiveDragDropArea, {
+      isFileDropped: isFileDropped
+    });
+  }
+  return fallbackDropArea();
+}
+function fallbackDropArea(_invalidDropAreaState) {
+  return jsx(DisabledDropArea, {});
+}
+function getDropAreaState(flags) {
+  if (flags.isDragActive) {
+    return 'active-drag';
+  }
+  if (flags.hasResourceType) {
+    return 'disabled';
+  }
+  if (flags.isReady) {
+    return 'file-dropped';
+  }
+  return 'ready-for-drop';
+}
+
+var messages$2 = defineMessages({
+  modalDescription: {
+    id: 'ImportResourcesModal.modalDescription',
+    description: 'Label for the modal category description',
+    defaultMessage: 'Maximum file size is {fileSize} MB with a limit of {rowLimit} rows. Download <csvTemplateLink>the CSV template</csvTemplateLink> or refer to <documentationLink>the documentation</documentationLink>.'
+  },
+  dragAndDropCSV: {
+    id: 'ImportResourcesModal.dragAndDropCSV',
+    description: 'The message telling the user to drag and drop CSV file in the file drop area',
+    defaultMessage: 'Drag and drop CSV'
+  },
+  or: {
+    id: 'ImportResourcesModal.or',
+    description: 'The word "or" in the drag and drop message',
+    defaultMessage: 'or'
+  },
+  browseButton: {
+    id: 'ImportResourcesModal.browseFile',
+    defaultMessage: 'Browse file'
+  },
+  uploadFile: {
+    id: 'ImportResourcesModal.uploadFile',
+    description: 'Label for a button on the file upload page, shown on active drop area state',
+    defaultMessage: 'Upload file'
+  },
+  chooseFile: {
+    id: 'ImportResourcesModal.chooseFile',
+    description: 'Label for a button on the file upload page, shown on ready to upload state',
+    defaultMessage: 'Choose file'
+  },
+  fileUploadFailed: {
+    id: 'ImportResourcesModal.fileUploadFailed',
+    description: 'A title on the file upload page, shown on file upload error state',
+    defaultMessage: 'File upload failed'
+  },
+  fileFormatNotSupported: {
+    id: 'ImportResourcesModal.fileFormatNotSupported',
+    description: 'Error message displayed when a user drags and drops a non-CSV file',
+    defaultMessage: 'Invalid file format: The file is not in CSV format and cannot be processed.'
+  },
+  tooManyFilesError: {
+    id: 'ImportResourcesModal.tooManyFilesError',
+    description: 'Error message displayed when a user drags and drops multiple files at once',
+    defaultMessage: 'Multiple files detected: You can only drag and drop one file at a time.'
+  },
+  genericError: {
+    id: 'ImportResourcesModal.genericError',
+    description: 'Default error message for unexpected file upload issues (for unhandled cases)',
+    defaultMessage: 'Error occurred: Please try uploading the file again or contact our support team for assistance.'
+  }
+});
+
+function ownKeys$a(e, r) { var t = _Object$keys(e); if (_Object$getOwnPropertySymbols) { var o = _Object$getOwnPropertySymbols(e); r && (o = _filterInstanceProperty(o).call(o, function (r) { return _Object$getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$a(e) { for (var r = 1; r < arguments.length; r++) { var _context3, _context4; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty(_context3 = ownKeys$a(Object(t), !0)).call(_context3, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(e, _Object$getOwnPropertyDescriptors(t)) : _forEachInstanceProperty(_context4 = ownKeys$a(Object(t))).call(_context4, function (r) { _Object$defineProperty(e, r, _Object$getOwnPropertyDescriptor(t, r)); }); } return e; }
+const FileDropArea = () => {
+  const intl = useIntl();
+  const _useImportResourcesCo = useImportResourcesContext(),
+    state = _useImportResourcesCo.state,
+    actions = _useImportResourcesCo.actions;
+  const isResourceTypeSelected = Boolean(state.resourceType);
+  const showNotification = useShowNotification();
+  const onDrop = React.useCallback(_ref => {
+    let _ref2 = _slicedToArray(_ref, 1),
+      file = _ref2[0];
+    if (!file) return;
+    assertResourceType(state.resourceType);
+    actions.setDroppedFile(file);
+  }, [state.resourceType]);
+  const _useDropzone = useDropzone({
+      onDrop,
+      multiple: false,
+      disabled: !isResourceTypeSelected,
+      accept: {
+        'text/csv': ['.csv']
+      },
+      onDropRejected: _ref3 => {
+        var _context, _context2;
+        let _ref4 = _slicedToArray(_ref3, 1),
+          rejectedFile = _ref4[0];
+        if (_someInstanceProperty(_context = rejectedFile.errors).call(_context, error => error.code === 'too-many-files')) {
+          showNotification({
+            kind: 'error',
+            domain: DOMAINS.PAGE,
+            text: intl.formatMessage(messages$2.tooManyFilesError)
+          });
+          return;
+        }
+        if (_someInstanceProperty(_context2 = rejectedFile.errors).call(_context2, error => error.code === 'file-invalid-type')) {
+          showNotification({
+            kind: 'error',
+            domain: DOMAINS.PAGE,
+            text: intl.formatMessage(messages$2.fileFormatNotSupported)
+          });
+        } else {
+          showNotification({
+            kind: 'error',
+            domain: DOMAINS.PAGE,
+            text: intl.formatMessage(messages$2.genericError)
+          });
+        }
+      }
+    }),
+    getRootProps = _useDropzone.getRootProps,
+    getInputProps = _useDropzone.getInputProps,
+    isDragActive = _useDropzone.isDragActive;
+  const dropAreaState = React.useMemo(() => getDropAreaState({
+    isReady: Boolean(state.droppedFile),
+    hasResourceType: !state.resourceType,
+    isDragActive
+  }), [state.resourceType, state.droppedFile, isDragActive]);
+  const dropArea = getDropArea({
+    dropAreaState,
+    resourceType: 'category',
+    isFileDropped: Boolean(state.droppedFile)
+  });
+  return jsxs(DropWrapper, _objectSpread$a(_objectSpread$a({
+    role: "presentation"
+  }, getRootProps()), {}, {
+    dropAreaState: dropAreaState,
+    children: [jsx("input", _objectSpread$a({
+      "data-testid": "file-input"
+    }, getInputProps())), jsx(Constraints.Horizontal, {
+      children: dropArea
+    })]
+  }));
+};
+
+var sharedMessages = defineMessages({
+  modalTitle: {
+    id: 'ImportResourcesModal.modalTitle',
+    description: 'Label for the modal title',
+    defaultMessage: 'Import {resourceType} by CSV'
+  },
+  uploadButton: {
+    id: 'ImportResourcesModal.uploadButton',
+    description: 'Label for the upload button',
+    defaultMessage: 'Upload and preview'
+  },
+  cancel: {
+    id: 'ImportResourcesModal.cancel',
+    description: 'Label for the cancel button',
+    defaultMessage: 'Cancel'
+  },
+  close: {
+    id: 'ImportResourcesModal.close',
+    description: 'Label for the close button',
+    defaultMessage: 'Close'
+  }
+});
+
+function ownKeys$9(e, r) { var t = _Object$keys(e); if (_Object$getOwnPropertySymbols) { var o = _Object$getOwnPropertySymbols(e); r && (o = _filterInstanceProperty(o).call(o, function (r) { return _Object$getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$9(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty(_context = ownKeys$9(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(e, _Object$getOwnPropertyDescriptors(t)) : _forEachInstanceProperty(_context2 = ownKeys$9(Object(t))).call(_context2, function (r) { _Object$defineProperty(e, r, _Object$getOwnPropertyDescriptor(t, r)); }); } return e; }
+const Upload = () => {
+  const _useImportResourcesCo = useImportResourcesContext(),
+    state = _useImportResourcesCo.state,
+    onClose = _useImportResourcesCo.onClose;
+  const intl = useIntl();
+  const resourceTypePlural = resourceTypeToDisplayName({
+    resourceType: state.resourceType,
+    isPlural: true
+  });
+  const _useUpload = useUpload(),
+    handleUploadAndValidation = _useUpload.handleUploadAndValidation;
+  const templateLink = RESOURCE_TYPE_TEMPLATE_DOWNLOAD_LINKS[state.resourceType];
+  const documentationLink = RESOURCE_TYPE_DOCUMENTATION_LINKS[state.resourceType];
+  return jsx(FormDialog, {
+    size: 16,
+    isOpen: true,
+    title: intl.formatMessage(sharedMessages.modalTitle, {
+      resourceType: resourceTypePlural
+    }),
+    labelPrimary: intl.formatMessage(sharedMessages.uploadButton),
+    onPrimaryButtonClick: handleUploadAndValidation,
+    isPrimaryButtonDisabled: !Boolean(state.droppedFile),
+    onSecondaryButtonClick: () => onClose({
+      shouldDeleteImportContainer: true
+    }),
+    onClose: () => onClose({
+      shouldDeleteImportContainer: true
+    }),
+    children: jsxs(Spacings.Stack, {
+      scale: "l",
+      children: [jsx(Text.Body, {
+        intlMessage: _objectSpread$9(_objectSpread$9({}, messages$2.modalDescription), {}, {
+          values: {
+            fileSize: intl.formatNumber(FILE_SIZE_LIMITS_MB[state.resourceType]),
+            rowLimit: intl.formatNumber(ROW_LIMITS[state.resourceType]),
+            csvTemplateLink: msg => jsx(Link, {
+              tone: "secondary",
+              isExternal: true,
+              to: templateLink,
+              children: msg
+            }),
+            documentationLink: msg => jsx(Link, {
+              tone: "secondary",
+              isExternal: true,
+              to: documentationLink,
+              children: msg
+            })
+          }
+        })
+      }), jsx(FileDropArea, {})]
+    })
+  });
+};
+
+var messages$1 = defineMessages({
+  startImportButton: {
+    id: 'ImportResourcesModal.startImportButton',
+    description: 'Label for the modal Start import button',
+    defaultMessage: 'Start import'
+  },
+  BodyText: {
+    id: 'ImportResourcesModal.BodyText',
+    description: 'Confirmation dialog text',
+    defaultMessage: 'You are about to import <bold>{count}</bold> rows to the project: <bold>{projectName}</bold>.'
+  },
+  BodyNote: {
+    id: 'ImportResourcesModal.BodyNote',
+    description: 'Confirmation dialog text',
+    defaultMessage: 'Please be aware that existing values with the same keys will be overwritten by the data included in the CSV.'
+  },
+  BodyQuestion: {
+    id: 'ImportResourcesModal.BodyQuestion',
+    description: 'Confirmation question',
+    defaultMessage: 'Proceed with the import?'
+  },
+  uploadNotificationSuccessMessage: {
+    id: 'ImportResourcesModal.successMessage',
+    description: 'Notification success message',
+    defaultMessage: '<b>Your import has started.</b><newline></newline> <logsLink>Go to Import logs</logsLink> to view the progress.'
+  },
+  previewOfYourImport: {
+    id: 'ImportResourcesModal.previewOfYourImport',
+    description: 'Label for modal path',
+    defaultMessage: "Here's a preview of your import"
+  },
+  rowsToBeImported: {
+    id: 'ImportResourcesModal.rowsToBeImported',
+    description: 'This message indicates the number of rows that are ready to be imported into the system.',
+    defaultMessage: '<b>{rowCount}</b> rows to be imported'
+  },
+  columnsToBeImported: {
+    id: 'ImportResourcesModal.columnsToBeImported',
+    description: 'This message indicates the number of columns that are ready to be imported into the system.',
+    defaultMessage: '<b>{columnCount}</b> columns to be imported'
+  },
+  columnsToBeIgnored: {
+    id: 'ImportResourcesModal.columnsToBeIgnored',
+    description: "This message indicates the number of columns that will be deliberately skipped during the import because they can't be imported",
+    defaultMessage: "We will intentionally ignore <b>{columnCount}</b> columns as they can't be imported"
+  },
+  showMore: {
+    id: 'ImportResourcesModal.showMore',
+    description: 'A button label for expanding the import preview to show more details.',
+    defaultMessage: 'Show more'
+  },
+  showLess: {
+    id: 'ImportResourcesModal.showLess',
+    description: 'A button label for collapsing the import preview to show fewer details.',
+    defaultMessage: 'Show less'
+  },
+  continue: {
+    id: 'ImportResourcesModal.continue',
+    description: 'Confirmation dialog continue button',
+    defaultMessage: 'Continue'
+  },
+  confirmationBodyText: {
+    id: 'ImportResourcesModal.confirmationBodyText',
+    description: 'Confirmation dialog text',
+    defaultMessage: 'You are about to import <bold>{count}</bold> rows to the project: <bold>{projectName}</bold>.'
+  },
+  confirmationBodyNote: {
+    id: 'ImportResourcesModal.confirmationBodyNote',
+    description: 'Confirmation dialog text',
+    defaultMessage: 'Please be aware that existing values with the same keys will be overwritten by the data included in the CSV.'
+  },
+  confirmationBodyQuestion: {
+    id: 'ImportResourcesModal.confirmationBodyQuestion',
+    description: 'Confirmation question',
+    defaultMessage: 'Proceed with the import?'
+  }
+});
+
+function ownKeys$8(e, r) { var t = _Object$keys(e); if (_Object$getOwnPropertySymbols) { var o = _Object$getOwnPropertySymbols(e); r && (o = _filterInstanceProperty(o).call(o, function (r) { return _Object$getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$8(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty(_context = ownKeys$8(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(e, _Object$getOwnPropertyDescriptors(t)) : _forEachInstanceProperty(_context2 = ownKeys$8(Object(t))).call(_context2, function (r) { _Object$defineProperty(e, r, _Object$getOwnPropertyDescriptor(t, r)); }); } return e; }
+const truncate = (isExpanded, columns, columnsCount) => {
+  return isExpanded ? columns.join(' | ') : _sliceInstanceProperty(columns).call(columns, 0, columnsCount).join(' | ') + (columns.length > columnsCount ? '...' : '');
+};
+const SpacedLink = /*#__PURE__*/_styled("span", process.env.NODE_ENV === "production" ? {
+  target: "e1amawj90"
+} : {
+  target: "e1amawj90",
+  label: "SpacedLink"
+})("margin-left:", customProperties.spacingS, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImNvbHVtbi1saXN0LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUEyQnFDIiwiZmlsZSI6ImNvbHVtbi1saXN0LnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBSZWFjdCBmcm9tICdyZWFjdCdcbmltcG9ydCB7IEZvcm1hdHRlZE1lc3NhZ2UgfSBmcm9tICdyZWFjdC1pbnRsJ1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnXG5pbXBvcnQge1xuICBMaW5rLFxuICBTcGFjaW5ncyxcbiAgVGV4dCxcbiAgY3VzdG9tUHJvcGVydGllcyxcbn0gZnJvbSAnQGNvbW1lcmNldG9vbHMtZnJvbnRlbmQvdWkta2l0J1xuaW1wb3J0IHsgSU5JVElBTF9DT0xVTU5fRElTUExBWV9DT1VOVCB9IGZyb20gJ0Bjb25zdGFudHMnXG5pbXBvcnQgbWVzc2FnZXMgZnJvbSAnLi9tZXNzYWdlcydcblxuaW50ZXJmYWNlIFByb3BzIHtcbiAgY29sdW1uczogQXJyYXk8c3RyaW5nPlxufVxuXG5jb25zdCB0cnVuY2F0ZSA9IChcbiAgaXNFeHBhbmRlZDogYm9vbGVhbixcbiAgY29sdW1uczogQXJyYXk8c3RyaW5nPixcbiAgY29sdW1uc0NvdW50OiBudW1iZXJcbik6IHN0cmluZyA9PiB7XG4gIHJldHVybiBpc0V4cGFuZGVkXG4gICAgPyBjb2x1bW5zLmpvaW4oJyB8ICcpXG4gICAgOiBjb2x1bW5zLnNsaWNlKDAsIGNvbHVtbnNDb3VudCkuam9pbignIHwgJykgK1xuICAgICAgICAoY29sdW1ucy5sZW5ndGggPiBjb2x1bW5zQ291bnQgPyAnLi4uJyA6ICcnKVxufVxuXG5leHBvcnQgY29uc3QgU3BhY2VkTGluayA9IHN0eWxlZC5zcGFuYFxuICBtYXJnaW4tbGVmdDogJHtjdXN0b21Qcm9wZXJ0aWVzLnNwYWNpbmdTfTtcbmBcblxuZXhwb3J0IGNvbnN0IENvbHVtbkxpc3QgPSAocHJvcHM6IFJlYWN0LlByb3BzV2l0aENoaWxkcmVuPFByb3BzPikgPT4ge1xuICBjb25zdCBbaXNFeHBhbmRlZCwgc2V0SXNFeHBhbmRlZF0gPSBSZWFjdC51c2VTdGF0ZShmYWxzZSlcbiAgY29uc3Qgc2hvdWxkU2hvd0V4cGFuZEJ1dHRvbiA9XG4gICAgcHJvcHMuY29sdW1ucy5sZW5ndGggPiBJTklUSUFMX0NPTFVNTl9ESVNQTEFZX0NPVU5UXG5cbiAgcmV0dXJuIChcbiAgICA8U3BhY2luZ3MuSW5saW5lIHNjYWxlPVwieGxcIj5cbiAgICAgIHsvKiBFbXB0eSBkaXYgaXMgcmVxdWlyZWQgZm9yIHNwYWNpbmcgKi99XG4gICAgICA8ZGl2IC8+XG4gICAgICA8PlxuICAgICAgICA8VGV4dC5Cb2R5IHRvbmU9XCJzZWNvbmRhcnlcIj5cbiAgICAgICAgICB7dHJ1bmNhdGUoaXNFeHBhbmRlZCwgcHJvcHMuY29sdW1ucywgSU5JVElBTF9DT0xVTU5fRElTUExBWV9DT1VOVCl9XG4gICAgICAgICAge3Nob3VsZFNob3dFeHBhbmRCdXR0b24gJiYgKFxuICAgICAgICAgICAgPFNwYWNlZExpbms+XG4gICAgICAgICAgICAgIDxMaW5rXG4gICAgICAgICAgICAgICAgdG89XCJcIlxuICAgICAgICAgICAgICAgIHRvbmU9XCJzZWNvbmRhcnlcIlxuICAgICAgICAgICAgICAgIG9uQ2xpY2s9eyhlKSA9PiB7XG4gICAgICAgICAgICAgICAgICBlLnByZXZlbnREZWZhdWx0KClcbiAgICAgICAgICAgICAgICAgIHNldElzRXhwYW5kZWQoIWlzRXhwYW5kZWQpXG4gICAgICAgICAgICAgICAgfX1cbiAgICAgICAgICAgICAgPlxuICAgICAgICAgICAgICAgIHtpc0V4cGFuZGVkID8gKFxuICAgICAgICAgICAgICAgICAgPEZvcm1hdHRlZE1lc3NhZ2Ugey4uLm1lc3NhZ2VzLnNob3dMZXNzfSAvPlxuICAgICAgICAgICAgICAgICkgOiAoXG4gICAgICAgICAgICAgICAgICA8Rm9ybWF0dGVkTWVzc2FnZSB7Li4ubWVzc2FnZXMuc2hvd01vcmV9IC8+XG4gICAgICAgICAgICAgICAgKX1cbiAgICAgICAgICAgICAgPC9MaW5rPlxuICAgICAgICAgICAgPC9TcGFjZWRMaW5rPlxuICAgICAgICAgICl9XG4gICAgICAgIDwvVGV4dC5Cb2R5PlxuICAgICAgPC8+XG4gICAgPC9TcGFjaW5ncy5JbmxpbmU+XG4gIClcbn1cbiJdfQ== */"));
+const ColumnList = props => {
+  const _React$useState = React.useState(false),
+    _React$useState2 = _slicedToArray(_React$useState, 2),
+    isExpanded = _React$useState2[0],
+    setIsExpanded = _React$useState2[1];
+  const shouldShowExpandButton = props.columns.length > INITIAL_COLUMN_DISPLAY_COUNT;
+  return jsxs(Spacings.Inline, {
+    scale: "xl",
+    children: [jsx("div", {}), jsx(Fragment, {
+      children: jsxs(Text.Body, {
+        tone: "secondary",
+        children: [truncate(isExpanded, props.columns, INITIAL_COLUMN_DISPLAY_COUNT), shouldShowExpandButton && jsx(SpacedLink, {
+          children: jsx(Link, {
+            to: "",
+            tone: "secondary",
+            onClick: e => {
+              e.preventDefault();
+              setIsExpanded(!isExpanded);
+            },
+            children: isExpanded ? jsx(FormattedMessage, _objectSpread$8({}, messages$1.showLess)) : jsx(FormattedMessage, _objectSpread$8({}, messages$1.showMore))
+          })
+        })]
+      })
+    })]
+  });
+};
+
+function ownKeys$7(e, r) { var t = _Object$keys(e); if (_Object$getOwnPropertySymbols) { var o = _Object$getOwnPropertySymbols(e); r && (o = _filterInstanceProperty(o).call(o, function (r) { return _Object$getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$7(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty(_context = ownKeys$7(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(e, _Object$getOwnPropertyDescriptors(t)) : _forEachInstanceProperty(_context2 = ownKeys$7(Object(t))).call(_context2, function (r) { _Object$defineProperty(e, r, _Object$getOwnPropertyDescriptor(t, r)); }); } return e; }
+function UploadPreviewModal() {
+  const _useImportResourcesCo = useImportResourcesContext(),
+    state = _useImportResourcesCo.state;
+  const intl = useIntl();
+  const _useImportResourcesCo2 = useImportResourcesContext(),
+    actions = _useImportResourcesCo2.actions,
+    onClose = _useImportResourcesCo2.onClose;
+  if (!state.resourceType || !state.uploadFileResponse) return null;
+  const ignoredColumns = state.uploadFileResponse.ignoredColumns;
+  const validatedColumns = getValidatedColumns(state.uploadFileResponse.columns, ignoredColumns);
+  return jsx(FormDialog, {
+    size: 16,
+    isOpen: true,
+    title: intl.formatMessage(sharedMessages.modalTitle, {
+      resourceType: state.resourceType
+    }),
+    labelPrimary: intl.formatMessage(messages$1.continue),
+    onSecondaryButtonClick: () => onClose({
+      shouldDeleteImportContainer: true
+    }),
+    onPrimaryButtonClick: () => {
+      actions.setCurrentStep(4);
+    },
+    onClose: () => onClose({
+      shouldDeleteImportContainer: true
+    }),
+    children: jsx(PageContentNarrow, {
+      children: jsx(Spacings.Stack, {
+        scale: "xxxl",
+        children: jsx(Spacings.Stack, {
+          scale: "xl",
+          children: jsxs(Spacings.Stack, {
+            scale: "m",
+            children: [jsx("div", {}), jsx(Text.Body, {
+              intlMessage: messages$1.previewOfYourImport
+            }), jsx(Card, {
+              insetScale: "xl",
+              children: jsxs(Spacings.Stack, {
+                scale: "xs",
+                children: [jsxs(Spacings.Inline, {
+                  alignItems: "center",
+                  children: [jsx(CheckBoldIcon, {
+                    color: "success"
+                  }), jsx(Text.Body, {
+                    intlMessage: _objectSpread$7(_objectSpread$7({}, messages$1.rowsToBeImported), {}, {
+                      values: {
+                        rowCount: intl.formatNumber(state.uploadFileResponse.rowsCount),
+                        b: getBold$3
+                      }
+                    })
+                  })]
+                }), jsxs(Spacings.Inline, {
+                  alignItems: "center",
+                  children: [jsx(CheckBoldIcon, {
+                    color: "success"
+                  }), jsx(Text.Body, {
+                    intlMessage: _objectSpread$7(_objectSpread$7({}, messages$1.columnsToBeImported), {}, {
+                      values: {
+                        columnCount: intl.formatNumber(validatedColumns.length),
+                        b: getBold$3
+                      }
+                    })
+                  })]
+                }), jsx(ColumnList, {
+                  columns: validatedColumns
+                })]
+              })
+            }), ignoredColumns.length > 0 && jsx(Card, {
+              insetScale: "xl",
+              children: jsxs(Spacings.Stack, {
+                scale: "xs",
+                children: [jsxs(Spacings.Inline, {
+                  alignItems: "center",
+                  children: [jsx(EyeCrossedIcon, {
+                    color: "neutral60"
+                  }), jsx(Text.Body, {
+                    intlMessage: _objectSpread$7(_objectSpread$7({}, messages$1.columnsToBeIgnored), {}, {
+                      values: {
+                        columnCount: intl.formatNumber(ignoredColumns.length),
+                        b: getBold$3
+                      }
+                    })
+                  })]
+                }), jsx(ColumnList, {
+                  columns: ignoredColumns
+                })]
+              })
+            })]
+          })
+        })
+      })
+    })
+  });
+}
+function getBold$3(msg) {
+  return jsx(Text.Body, {
+    as: "span",
+    isBold: true,
+    children: msg
+  });
+}
+
+function ownKeys$6(e, r) { var t = _Object$keys(e); if (_Object$getOwnPropertySymbols) { var o = _Object$getOwnPropertySymbols(e); r && (o = _filterInstanceProperty(o).call(o, function (r) { return _Object$getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$6(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty(_context = ownKeys$6(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(e, _Object$getOwnPropertyDescriptors(t)) : _forEachInstanceProperty(_context2 = ownKeys$6(Object(t))).call(_context2, function (r) { _Object$defineProperty(e, r, _Object$getOwnPropertyDescriptor(t, r)); }); } return e; }
+const getNewLine = () => jsx("br", {});
+const getImportLogsLink = (msg, projectKey) => jsx(Link, {
+  to: "/".concat(projectKey, "/operations/import/logs"),
+  children: msg
+});
+const ImportConfirmationModal = () => {
+  var _state$uploadFileResp;
+  const intl = useIntl();
+  const _useImportResourcesCo = useImportResourcesContext(),
+    state = _useImportResourcesCo.state,
+    onStartImportSuccess = _useImportResourcesCo.onStartImportSuccess,
+    onClose = _useImportResourcesCo.onClose;
+  const _useApplicationContex = useApplicationContext(context => {
+      var _context$project, _context$project2;
+      return {
+        projectKey: (_context$project = context.project) === null || _context$project === void 0 ? void 0 : _context$project.key,
+        projectName: (_context$project2 = context.project) === null || _context$project2 === void 0 ? void 0 : _context$project2.name
+      };
+    }),
+    projectKey = _useApplicationContex.projectKey,
+    projectName = _useApplicationContex.projectName;
+  const asyncDispatch = useAsyncDispatch();
+  const showNotification = useShowNotification();
+  const ImportRunningTextNotification = () => jsx(Text.Body, {
+    intlMessage: _objectSpread$6(_objectSpread$6({}, messages$1.uploadNotificationSuccessMessage), {}, {
+      values: {
+        newline: getNewLine,
+        logsLink: msg => getImportLogsLink(msg, projectKey),
+        b: getBold$2
+      }
+    })
+  });
+  return jsx(ConfirmationDialog, {
+    title: intl.formatMessage(sharedMessages.modalTitle, {
+      resourceType: resourceTypeToDisplayName({
+        resourceType: state.resourceType,
+        isPlural: true
+      })
+    }),
+    labelPrimary: intl.formatMessage(messages$1.startImportButton),
+    isOpen: true,
+    onClose: () => onClose({
+      shouldDeleteImportContainer: true
+    }),
+    onCancel: () => onClose({
+      shouldDeleteImportContainer: true
+    }),
+    dataAttributesPrimaryButton: {
+      'data-test-id': 'confirmation-dialog-confirm'
+    },
+    dataAttributesSecondaryButton: {
+      'data-test-id': 'confirmation-dialog-cancel'
+    },
+    onConfirm: async () => {
+      try {
+        var _state$droppedFile;
+        const canConfirm = projectKey && state.containerKey && ((_state$droppedFile = state.droppedFile) === null || _state$droppedFile === void 0 ? void 0 : _state$droppedFile.name) && state.resourceType;
+        if (!canConfirm) return;
+        onClose();
+        await processUploadedFile({
+          projectKey,
+          containerKey: state.containerKey,
+          resourceType: state.resourceType,
+          asyncDispatch
+        });
+        onStartImportSuccess();
+        showNotification({
+          kind: 'info',
+          domain: DOMAINS.SIDE,
+          // @ts-ignore
+          text: jsx(ImportRunningTextNotification, {})
+        }, {
+          dismissAfter: 5000
+        });
+      } catch (error) {
+        onClose({
+          shouldDeleteImportContainer: true
+        });
+        showNotification({
+          kind: 'error',
+          domain: DOMAINS.PAGE,
+          text: isError(error) ? error.toString() : String(error)
+        });
+      }
+    },
+    size: 16,
+    children: jsxs(Spacings.Stack, {
+      scale: "xl",
+      children: [jsxs("div", {
+        children: [jsx(Text.Body, {
+          intlMessage: _objectSpread$6(_objectSpread$6({}, messages$1.confirmationBodyText), {}, {
+            values: {
+              projectName: projectName,
+              count: intl.formatNumber((state === null || state === void 0 || (_state$uploadFileResp = state.uploadFileResponse) === null || _state$uploadFileResp === void 0 ? void 0 : _state$uploadFileResp.rowsCount) || 0),
+              bold: getBold$2
+            }
+          })
+        }), jsx(Text.Body, {
+          intlMessage: messages$1.confirmationBodyNote
+        })]
+      }), jsx(Text.Body, {
+        intlMessage: messages$1.confirmationBodyQuestion
+      })]
+    })
+  });
+};
+function getBold$2(msg) {
+  return jsx(Text.Body, {
+    as: "span",
+    isBold: true,
+    children: msg
+  });
+}
+
+var messages = defineMessages({
+  row: {
+    id: 'ImportResourcesModal.row',
+    description: 'In Upload file error modal - "Row" column',
+    defaultMessage: 'Row'
+  },
+  errorType: {
+    id: 'ImportResourcesModal.errorType',
+    description: 'In Upload file error modal - "Error type" column',
+    defaultMessage: 'Error type'
+  },
+  details: {
+    id: 'ImportResourcesModal.details',
+    description: 'In Upload file error modal - "Details" column',
+    defaultMessage: 'Details'
+  },
+  uploadingError: {
+    id: 'ImportResourcesModal.uploadingError',
+    description: 'Title when errors detected while uploading file',
+    defaultMessage: 'There are <b>{errorsCount}</b> errors detected while uploading the file <b>{fileName}</b>.'
+  },
+  supportedValuesDocumentation: {
+    id: 'ImportResourcesModal.supportedValuesDocumentation',
+    description: 'Link to the documentation for supported values',
+    defaultMessage: '<documentationLink>View the documentation</documentationLink> for supported values.'
+  },
+  uploadNewFile: {
+    id: 'ImportResourcesModal.uploadNewFile',
+    description: 'Upload new file button',
+    defaultMessage: 'Upload new file'
+  }
+});
+
+function ownKeys$5(e, r) { var t = _Object$keys(e); if (_Object$getOwnPropertySymbols) { var o = _Object$getOwnPropertySymbols(e); r && (o = _filterInstanceProperty(o).call(o, function (r) { return _Object$getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$5(e) { for (var r = 1; r < arguments.length; r++) { var _context2, _context3; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty(_context2 = ownKeys$5(Object(t), !0)).call(_context2, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(e, _Object$getOwnPropertyDescriptors(t)) : _forEachInstanceProperty(_context3 = ownKeys$5(Object(t))).call(_context3, function (r) { _Object$defineProperty(e, r, _Object$getOwnPropertyDescriptor(t, r)); }); } return e; }
+const getColumns$1 = () => [{
+  key: 'errorType',
+  label: jsx(FormattedMessage, _objectSpread$5({}, messages.errorType)),
+  width: 'max-content'
+}, {
+  key: 'details',
+  label: jsx(FormattedMessage, _objectSpread$5({}, messages.details))
+}];
+const UploadClientSideErrorTable = props => {
+  var _context;
+  const pagination = usePaginationState({
+    perPage: 10
+  });
+  const startIndex = (pagination.page.value - 1) * pagination.perPage.value;
+  const endIndex = startIndex + pagination.perPage.value;
+  const currentPageRows = _sliceInstanceProperty(_context = props.rows).call(_context, startIndex, endIndex);
+  const shouldShowPagination = props.rows.length > pagination.perPage.value;
+  return jsxs(Spacings.Stack, {
+    scale: "l",
+    children: [jsx(DataTable, {
+      verticalCellAlignment: "center",
+      isCondensed: true,
+      rows: currentPageRows,
+      columns: getColumns$1(),
+      itemRenderer: itemRenderer$1
+    }), shouldShowPagination && jsx(PageNavigator, {
+      onPageChange: pagination.page.onChange,
+      page: pagination.page.value,
+      totalPages: Math.ceil(props.rows.length / pagination.perPage.value)
+    })]
+  });
+};
+function itemRenderer$1(item, column) {
+  switch (column.key) {
+    case 'errorType':
+      return jsx(Stamp, {
+        isCondensed: true,
+        label: item.title,
+        tone: "critical"
+      });
+    case 'details':
+      return jsx(Text.Body, {
+        children: item.description
+      });
+    default:
+      throw new UnexpectedColumnError(column.key);
+  }
+}
+
+function ownKeys$4(e, r) { var t = _Object$keys(e); if (_Object$getOwnPropertySymbols) { var o = _Object$getOwnPropertySymbols(e); r && (o = _filterInstanceProperty(o).call(o, function (r) { return _Object$getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$4(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty(_context = ownKeys$4(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(e, _Object$getOwnPropertyDescriptors(t)) : _forEachInstanceProperty(_context2 = ownKeys$4(Object(t))).call(_context2, function (r) { _Object$defineProperty(e, r, _Object$getOwnPropertyDescriptor(t, r)); }); } return e; }
+const UploadClientSideErrorsModal = () => {
+  var _state$droppedFile;
+  const intl = useIntl();
+  const _useImportResourcesCo = useImportResourcesContext(),
+    state = _useImportResourcesCo.state,
+    actions = _useImportResourcesCo.actions,
+    onClose = _useImportResourcesCo.onClose;
+  const errorsCount = state.fileUploadClientSideErrors.length;
+  return jsx(InfoDialog, {
+    size: 16,
+    isOpen: true,
+    title: intl.formatMessage(sharedMessages.modalTitle, {
+      resourceType: resourceTypeToDisplayName({
+        resourceType: state.resourceType,
+        isPlural: true
+      })
+    }),
+    onClose: () => onClose(),
+    children: jsxs(Spacings.Stack, {
+      scale: "l",
+      children: [jsx(Text.Body, {
+        intlMessage: _objectSpread$4(_objectSpread$4({}, messages.uploadingError), {}, {
+          values: {
+            fileName: (_state$droppedFile = state.droppedFile) === null || _state$droppedFile === void 0 ? void 0 : _state$droppedFile.name,
+            errorsCount: intl.formatNumber(errorsCount),
+            b: getBold$1
+          }
+        })
+      }), jsx(UploadClientSideErrorTable, {
+        rows: mapUploadFileClientSideErrorsToUploadFileErrorRows(state.fileUploadClientSideErrors)
+      }), jsxs(Spacings.Inline, {
+        scale: "m",
+        justifyContent: "flex-end",
+        children: [jsx(SecondaryButton, {
+          label: intl.formatMessage(sharedMessages.close),
+          onClick: () => onClose()
+        }), jsx(PrimaryButton, {
+          iconLeft: jsx(ImportIcon, {}),
+          label: intl.formatMessage(messages.uploadNewFile),
+          onClick: () => actions.uploadNewFile()
+        })]
+      })]
+    })
+  });
+};
+function getBold$1(msg) {
+  return jsx(Text.Body, {
+    as: "span",
+    isBold: true,
+    children: msg
+  });
+}
+
+function ownKeys$3(e, r) { var t = _Object$keys(e); if (_Object$getOwnPropertySymbols) { var o = _Object$getOwnPropertySymbols(e); r && (o = _filterInstanceProperty(o).call(o, function (r) { return _Object$getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$3(e) { for (var r = 1; r < arguments.length; r++) { var _context2, _context3; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty(_context2 = ownKeys$3(Object(t), !0)).call(_context2, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(e, _Object$getOwnPropertyDescriptors(t)) : _forEachInstanceProperty(_context3 = ownKeys$3(Object(t))).call(_context3, function (r) { _Object$defineProperty(e, r, _Object$getOwnPropertyDescriptor(t, r)); }); } return e; }
+const getColumns = () => [{
+  key: 'row',
+  label: jsx(FormattedMessage, _objectSpread$3({}, messages.row)),
+  width: 'max-content'
+}, {
+  key: 'errorType',
+  label: jsx(FormattedMessage, _objectSpread$3({}, messages.errorType)),
+  width: 'max-content'
+}, {
+  key: 'details',
+  label: jsx(FormattedMessage, _objectSpread$3({}, messages.details))
+}];
+const UploadServerSideErrorTable = props => {
+  var _context;
+  const pagination = usePaginationState({
+    perPage: 10
+  });
+  const startIndex = (pagination.page.value - 1) * pagination.perPage.value;
+  const endIndex = startIndex + pagination.perPage.value;
+  const currentPageRows = _sliceInstanceProperty(_context = props.rows).call(_context, startIndex, endIndex);
+  const shouldShowPagination = props.rows.length > pagination.perPage.value;
+  return jsxs(Spacings.Stack, {
+    scale: "l",
+    children: [jsx(DataTable, {
+      verticalCellAlignment: "center",
+      isCondensed: true,
+      rows: currentPageRows,
+      columns: getColumns(),
+      itemRenderer: itemRenderer
+    }), shouldShowPagination && jsx(PageNavigator, {
+      onPageChange: pagination.page.onChange,
+      page: pagination.page.value,
+      totalPages: Math.ceil(props.rows.length / pagination.perPage.value)
+    })]
+  });
+};
+function itemRenderer(item, column) {
+  switch (column.key) {
+    case 'row':
+      return item.row;
+    case 'errorType':
+      return jsx(Stamp, {
+        isCondensed: true,
+        label: item.code,
+        tone: "critical"
+      });
+    case 'details':
+      return jsxs(Spacings.Inline, {
+        scale: "xs",
+        children: [jsx(Text.Body, {
+          tone: "information",
+          children: item.field
+        }), jsx(Text.Body, {
+          children: extractErrorDescriptionFromValidationMessage(item.validationMessage)
+        })]
+      });
+    default:
+      throw new UnexpectedColumnError(column.key);
+  }
+}
+
+function ownKeys$2(e, r) { var t = _Object$keys(e); if (_Object$getOwnPropertySymbols) { var o = _Object$getOwnPropertySymbols(e); r && (o = _filterInstanceProperty(o).call(o, function (r) { return _Object$getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$2(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty(_context = ownKeys$2(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(e, _Object$getOwnPropertyDescriptors(t)) : _forEachInstanceProperty(_context2 = ownKeys$2(Object(t))).call(_context2, function (r) { _Object$defineProperty(e, r, _Object$getOwnPropertyDescriptor(t, r)); }); } return e; }
+const UploadServerSideErrorsModal = () => {
+  var _state$uploadFileResp, _state$droppedFile, _state$uploadFileResp2;
+  const intl = useIntl();
+  const _useImportResourcesCo = useImportResourcesContext(),
+    state = _useImportResourcesCo.state,
+    actions = _useImportResourcesCo.actions,
+    onClose = _useImportResourcesCo.onClose;
+  const errorsCount = getFileUploadErrorsCount((_state$uploadFileResp = state.uploadFileResponse) === null || _state$uploadFileResp === void 0 ? void 0 : _state$uploadFileResp.results);
+  const documentationLink = RESOURCE_TYPE_DOCUMENTATION_LINKS[state.resourceType];
+  return jsx(InfoDialog, {
+    size: 16,
+    isOpen: true,
+    title: intl.formatMessage(sharedMessages.modalTitle, {
+      resourceType: resourceTypeToDisplayName({
+        resourceType: state.resourceType,
+        isPlural: true
+      })
+    }),
+    onClose: onClose,
+    children: jsxs(Spacings.Stack, {
+      scale: "l",
+      children: [jsxs(Spacings.Stack, {
+        scale: "xs",
+        children: [jsx(Text.Body, {
+          intlMessage: _objectSpread$2(_objectSpread$2({}, messages.uploadingError), {}, {
+            values: {
+              fileName: (_state$droppedFile = state.droppedFile) === null || _state$droppedFile === void 0 ? void 0 : _state$droppedFile.name,
+              errorsCount: intl.formatNumber(errorsCount),
+              b: getBold
+            }
+          })
+        }), jsx(Text.Body, {
+          intlMessage: _objectSpread$2(_objectSpread$2({}, messages.supportedValuesDocumentation), {}, {
+            values: {
+              documentationLink: msg => jsx(Link, {
+                tone: "secondary",
+                isExternal: true,
+                to: documentationLink,
+                children: msg
+              })
+            }
+          })
+        })]
+      }), jsx(UploadServerSideErrorTable, {
+        rows: mapUploadFileErrorsResponseToUploadFileErrorRows((_state$uploadFileResp2 = state.uploadFileResponse) === null || _state$uploadFileResp2 === void 0 ? void 0 : _state$uploadFileResp2.results)
+      }), jsxs(Spacings.Inline, {
+        scale: "m",
+        justifyContent: "flex-end",
+        children: [jsx(SecondaryButton, {
+          label: intl.formatMessage(sharedMessages.close),
+          onClick: () => onClose()
+        }), jsx(PrimaryButton, {
+          iconLeft: jsx(ImportIcon, {}),
+          label: intl.formatMessage(messages.uploadNewFile),
+          onClick: () => actions.uploadNewFile()
+        })]
+      })]
+    })
+  });
+};
+function getBold(msg) {
+  return jsx(Text.Body, {
+    as: "span",
+    isBold: true,
+    children: msg
+  });
+}
+
+const UploadResult = () => {
+  var _state$uploadFileResp;
+  const _useImportResourcesCo = useImportResourcesContext(),
+    state = _useImportResourcesCo.state;
+  if (state.fileUploadClientSideErrors.length > 0) return jsx(UploadClientSideErrorsModal, {});
+  if (((_state$uploadFileResp = state.uploadFileResponse) === null || _state$uploadFileResp === void 0 ? void 0 : _state$uploadFileResp.invalid) > 0) return jsx(UploadServerSideErrorsModal, {});
+  return jsx(UploadPreviewModal, {});
+};
+
+function ownKeys$1(e, r) { var t = _Object$keys(e); if (_Object$getOwnPropertySymbols) { var o = _Object$getOwnPropertySymbols(e); r && (o = _filterInstanceProperty(o).call(o, function (r) { return _Object$getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$1(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty(_context = ownKeys$1(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(e, _Object$getOwnPropertyDescriptors(t)) : _forEachInstanceProperty(_context2 = ownKeys$1(Object(t))).call(_context2, function (r) { _Object$defineProperty(e, r, _Object$getOwnPropertyDescriptor(t, r)); }); } return e; }
+var FileIcon = function FileIcon(props) {
+  return jsxs("svg", _objectSpread$1(_objectSpread$1({}, props), {}, {
+    children: [jsx("mask", {
+      id: "a",
+      style: {
+        maskType: "alpha"
+      },
+      maskUnits: "userSpaceOnUse",
+      x: "0",
+      y: "0",
+      width: "32",
+      height: "32",
+      children: jsx("path", {
+        fill: "#D9D9D9",
+        d: "M0 0h32v32H0z"
+      })
+    }), jsx("g", {
+      mask: "url(#a)",
+      children: jsx("path", {
+        d: "M14.667 25.333h2.666v-5.566l2.134 2.133 1.866-1.9L16 14.667 10.667 20l1.9 1.867 2.1-2.1v5.566Zm-6.667 4a2.568 2.568 0 0 1-1.883-.783 2.568 2.568 0 0 1-.784-1.883V5.333c0-.733.261-1.36.784-1.883A2.568 2.568 0 0 1 8 2.667h10.667l8 8v16c0 .733-.261 1.36-.784 1.883a2.568 2.568 0 0 1-1.883.783H8ZM17.333 12H24l-6.667-6.667V12Z",
+        fill: "#B1ACFF"
+      })
+    })]
+  }));
+};
+FileIcon.defaultProps = {
+  width: "32",
+  height: "32",
+  fill: "none",
+  xmlns: "http://www.w3.org/2000/svg"
+};
+const Uploading = () => {
+  var _state$droppedFile;
+  const intl = useIntl();
+  const _useImportResourcesCo = useImportResourcesContext(),
+    state = _useImportResourcesCo.state,
+    onClose = _useImportResourcesCo.onClose;
+  const resourceTypePlural = resourceTypeToDisplayName({
+    resourceType: state.resourceType,
+    isPlural: true
+  });
+  if ((_state$droppedFile = state.droppedFile) !== null && _state$droppedFile !== void 0 && _state$droppedFile.name) return jsx(InfoDialog, {
+    size: 16,
+    isOpen: true,
+    title: intl.formatMessage(sharedMessages.modalTitle, {
+      resourceType: resourceTypePlural
+    }),
+    onClose: () => onClose({
+      shouldDeleteImportContainer: true
+    }),
+    children: jsxs(Spacings.Stack, {
+      scale: "m",
+      children: [jsxs(Spacings.Inline, {
+        alignItems: "center",
+        justifyContent: "space-between",
+        children: [jsxs(Spacings.Inline, {
+          alignItems: "center",
+          children: [jsx(FileIcon, {}), jsx(Text.Body, {
+            isBold: true,
+            children: truncate$1(state.droppedFile.name, {
+              length: 40
+            })
+          }), jsxs(Text.Body, {
+            tone: "secondary",
+            children: [intl.formatNumber(convertFileSizeToKB(state.droppedFile.size)), ' ', "KB"]
+          })]
+        }), jsx(SecondaryButton, {
+          tone: "secondary",
+          size: "medium",
+          label: intl.formatMessage(sharedMessages.cancel),
+          onClick: () => {
+            state.abortController.abort();
+          }
+        })]
+      }), jsx(ProgressBar, {
+        barWidth: "scale",
+        height: "10",
+        progress: 100
+      }), jsx("div", {})]
+    })
+  });
+  return null;
+};
+
+const CurrentStep = () => {
+  const _useImportResourcesCo = useImportResourcesContext(),
+    state = _useImportResourcesCo.state;
+  const steps = {
+    1: jsx(Upload, {}),
+    2: jsx(Uploading, {}),
+    3: jsx(UploadResult, {}),
+    4: jsx(ImportConfirmationModal, {})
+  };
+  return steps[state.currentStep] || null;
+};
+
+const getChunkImport = locale => {
+  const intlLocale = mapLocaleToIntlLocale(locale);
+  switch (intlLocale) {
+    case 'de':
+      return import( /* webpackChunkName: "import-resources-modal-i18n-de" */'./de-cd6c45d3.esm.js');
+    case 'es':
+      return import( /* webpackChunkName: "import-resources-modal-i18n-es" */'./es-e544023d.esm.js');
+    case 'fr-FR':
+      return import( /* webpackChunkName: "import-resources-modal-i18n-fr-FR" */'./fr-FR-9d9081ee.esm.js');
+    case 'zh-CN':
+      return import( /* webpackChunkName: "import-resources-modal-i18n-zh-CN" */'./zh-CN-4780d88e.esm.js');
+    case 'ja':
+      return import( /* webpackChunkName: "import-resources-modal-i18n-ja" */'./ja-73c088a7.esm.js');
+    case 'pt-BR':
+      return import( /* webpackChunkName: "change-history-i18n-pt-BR" */'./pt-BR-b37d730b.esm.js');
+    default:
+      return import( /* webpackChunkName: "import-resources-modal-i18n-en" */'./en-3a9aa2d4.esm.js');
+  }
+};
+const loadMessages = async locale => {
+  try {
+    const chunkImport = await getChunkImport(locale);
+    return parseChunkImport(chunkImport);
+  } catch (error) {
+    // eslint-disable-next-line no-console
+    console.warn("Something went wrong while loading the import-resources-modal messages for ".concat(locale), error);
+    reportErrorToSentry(new Error("Something went wrong while loading the import-resources-modal messages for ".concat(locale)), {
+      extra: error
+    });
+    return {};
+  }
+};
+
+const useAsyncIntlMessages = (locale, loader) => {
+  const _useState = useState({
+      isLoading: true,
+      messages: undefined,
+      error: undefined
+    }),
+    _useState2 = _slicedToArray(_useState, 2),
+    state = _useState2[0],
+    setState = _useState2[1];
+  useEffect(() => {
+    let _isUnmounting = false;
+    async function load() {
+      try {
+        if (!_isUnmounting) {
+          const messages = await loader(locale);
+          setState({
+            isLoading: false,
+            messages
+          });
+        }
+      } catch (error) {
+        setState({
+          isLoading: false,
+          error
+        });
+      }
+    }
+    if (locale) load();
+    return () => {
+      _isUnmounting = true;
+    };
+  }, [locale, loader]);
+  return state;
+};
+
+function ownKeys(e, r) { var t = _Object$keys(e); if (_Object$getOwnPropertySymbols) { var o = _Object$getOwnPropertySymbols(e); r && (o = _filterInstanceProperty(o).call(o, function (r) { return _Object$getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty(_context = ownKeys(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(e, _Object$getOwnPropertyDescriptors(t)) : _forEachInstanceProperty(_context2 = ownKeys(Object(t))).call(_context2, function (r) { _Object$defineProperty(e, r, _Object$getOwnPropertyDescriptor(t, r)); }); } return e; }
+const ImportResourcesModal = props => {
+  const _useApplicationContex = useApplicationContext(context => ({
+      locale: context.user && context.user.locale
+    })),
+    locale = _useApplicationContex.locale;
+  const messages = useAsyncIntlMessages(locale, loadMessages);
+  if (!props.isOpen || messages.isLoading) return null;
+  return jsx(IntlProvider, {
+    locale: locale,
+    messages: messages.messages,
+    children: jsx(ImportResourcesProvider, _objectSpread(_objectSpread({}, props), {}, {
+      children: jsx(CurrentStep, {})
+    }))
+  });
+};
+ImportResourcesModal.displayName = 'ImportResourcesModal';
+
+export { EnabledDropArea as E, FileDropped as F, ImportResourcesModal as I, messages$2 as m, useImportResourcesContext as u };