@dreamcommerce/aurora 2.5.2 → 2.5.3-1

package/build/cjs/packages/aurora/src/components/file_picker/constants.js

@@ -0,0 +1,19 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const FILE_PICKER_ERROR = {
+    invalidFileFormat: 'Invalid file format',
+    invalidInputWidth: 'The value cannot be greater than the width of the uploaded file'
+};
+const JPG_EXTENSION = 'jpg';
+const JPEG_EXTENSION = 'jpeg';
+const SVG_MIME_TYPE = 'svg+xml';
+const SVG_EXTENSION = 'svg';
+
+exports.FILE_PICKER_ERROR = FILE_PICKER_ERROR;
+exports.JPEG_EXTENSION = JPEG_EXTENSION;
+exports.JPG_EXTENSION = JPG_EXTENSION;
+exports.SVG_EXTENSION = SVG_EXTENSION;
+exports.SVG_MIME_TYPE = SVG_MIME_TYPE;
+//# sourceMappingURL=constants.js.map

package/build/cjs/packages/aurora/src/components/file_picker/constants.js.map

@@ -0,0 +1 @@
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/cjs/packages/aurora/src/components/file_picker/use_file_picker.js

@@ -3,11 +3,14 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
+var constants = require('./constants.js');
 
-const useFilePicker = ({ onChange, initialFile }) => {
+const useFilePicker = ({ onChange, initialFile, allowedExtensions }) => {
     const [file, setFile] = React.useState(initialFile);
+    const [errors, setErrors] = React.useState([]);
     const [isDragOver, setDragOver] = React.useState(false);
     const [isPreview, setPreview] = React.useState(true);
+    const [isVectorImage, setIsVectorImage] = React.useState(false);
     React.useEffect(() => {
         setFile(initialFile);
     }, [initialFile]);
@@ -15,9 +18,49 @@ const useFilePicker = ({ onChange, initialFile }) => {
         event.stopPropagation();
         event.preventDefault();
         const { dataTransfer: { files } } = event;
+        setFileFormatError(checkIfFileIsInCorrectFormat(allowedExtensions, files[0].type));
+        checkIfImageIsVector(files[0].type);
         setDragOver(false);
         updateFile(files);
     };
+    const checkIfFileIsInCorrectFormat = (allowedExtensions, fileType) => {
+        if (!allowedExtensions)
+            return;
+        const fileExtension = getFileExtension(fileType);
+        let formatIsCorrect;
+        if (Array.isArray(fileExtension)) {
+            formatIsCorrect = allowedExtensions.some((extension) => fileExtension.includes(extension.toLowerCase()));
+        }
+        else {
+            formatIsCorrect = allowedExtensions === null || allowedExtensions === void 0 ? void 0 : allowedExtensions.some((extension) => {
+                return extension.toLowerCase() === fileExtension.toLowerCase();
+            });
+        }
+        return formatIsCorrect;
+    };
+    const setFileFormatError = (isFileFormatCorrect) => {
+        if (!isFileFormatCorrect) {
+            setErrors([...errors, constants.FILE_PICKER_ERROR.invalidFileFormat]);
+        }
+        else {
+            setErrors([]);
+        }
+    };
+    const getFileExtension = (fileType) => {
+        const substringIndex = fileType.lastIndexOf('/');
+        const fileExtension = fileType.substring(substringIndex + 1);
+        if (fileExtension === constants.JPG_EXTENSION || fileExtension === constants.JPEG_EXTENSION) {
+            return [constants.JPG_EXTENSION, constants.JPEG_EXTENSION];
+        }
+        else if (fileExtension === constants.SVG_MIME_TYPE) {
+            return constants.SVG_EXTENSION;
+        }
+        return fileExtension;
+    };
+    const checkIfImageIsVector = (fileType) => {
+        const fileExtenstion = getFileExtension(fileType);
+        fileExtenstion === 'svg' ? setIsVectorImage(true) : setIsVectorImage(false);
+    };
     const onFileChange = ({ target: { files } }) => {
         updateFile(files);
     };
@@ -27,6 +70,8 @@ const useFilePicker = ({ onChange, initialFile }) => {
                 fileName: files === null || files === void 0 ? void 0 : files[0].name,
                 fileUrl: URL.createObjectURL(files === null || files === void 0 ? void 0 : files[0])
             });
+            setFileFormatError(checkIfFileIsInCorrectFormat(allowedExtensions, files[0].type));
+            checkIfImageIsVector(files[0].type);
         }
         else {
             setFile(undefined);
@@ -48,6 +93,7 @@ const useFilePicker = ({ onChange, initialFile }) => {
     const onFileDelete = () => {
         setFile(undefined);
         setPreview(true);
+        setErrors([]);
         onChange === null || onChange === void 0 ? void 0 : onChange(null);
     };
     const onPreviewError = () => {
@@ -61,8 +107,10 @@ const useFilePicker = ({ onChange, initialFile }) => {
         onFileDelete,
         onPreviewError,
         file,
+        errors,
         isPreview,
-        isDragOver
+        isDragOver,
+        isVectorImage
     };
 };
 

package/build/cjs/packages/aurora/src/components/file_picker/use_file_picker.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/cjs/packages/aurora/src/components/modal/components/modal.js

@@ -9,8 +9,8 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
-const Modal = ({ children, className, modalRef }) => {
-    return (React__default['default'].createElement("div", { "data-test-id": "modal", ref: modalRef, className: `${main_module['default']['modal-window']} ${main_module['default']['modal-window_visible']} ${className}` },
+const Modal = ({ children, className, modalRef, style = {} }) => {
+    return (React__default['default'].createElement("div", { style: style, "data-test-id": "modal", ref: modalRef, className: `${main_module['default']['modal-window']} ${main_module['default']['modal-window_visible']} ${className}` },
         React__default['default'].createElement("div", { className: main_module['default']['modal-window__body'] }, children)));
 };
 

package/build/cjs/packages/aurora/src/css/modal/main.module.less.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var styleInject_es = require('../../../../../external/style-inject/dist/style-inject.es.js');
 
-var css_248z = "/* font colors */\n/* actions */\n/* background */\n/* errors */\n/* borders */\n/* grid */\n/* scrollBar */\n/* sizes */\n.main-module_modal-window__1epDY {\n  flex-direction: column;\n  position: relative;\n  z-index: 2000;\n  max-width: 1400px;\n  max-height: 100%;\n  min-width: 320px;\n  background-color: #ffffff;\n  border-radius: 5px;\n  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.33);\n  transition: all 0.25s ease;\n}\n.main-module_modal-window_show-transition-start__20Zyy,\n.main-module_modal-window_hide-transition-end__2tbM7 {\n  opacity: 0;\n  transform: translate3d(0, -20vh, 0);\n}\n.main-module_modal-window_show-transition-end__1bGXM,\n.main-module_modal-window_hide-transition-start__3v2ve {\n  opacity: 1;\n  transform: translate3d(0, 0, 0);\n}\n.main-module_modal-window_show-tooltip-transition-start__3T6jk,\n.main-module_modal-window_hide-tooltip-transition-end__1-Elu {\n  opacity: 0;\n}\n.main-module_modal-window_show-tooltip-transition-end__3qcFY,\n.main-module_modal-window_hide-tooltip-transition-start__1LrQS {\n  opacity: 1;\n}\n.main-module_modal-window_visible__Y9ArZ {\n  display: flex;\n}\n.main-module_modal-window_relative__2bV4q {\n  position: absolute;\n}\n.main-module_modal-window_loading__i6ehQ {\n  min-width: auto;\n}\n.main-module_modal-window_small__2ohvZ {\n  max-width: 440px;\n}\n.main-module_modal-window__body__o4m8Y {\n  display: flex;\n  flex-direction: column;\n  overflow: hidden;\n  max-height: calc(var(--vh, 1vh) * 100 - (2 * 1rem));\n}\n.main-module_modal-window__body_no-overflow__144M5 {\n  overflow: visible;\n}\n.main-module_modal-window__header__vMn-j {\n  flex: 0 0 auto;\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  padding: 2rem 2rem 0.5rem 2rem;\n}\n.main-module_modal-window__header-actions__Qj4RZ {\n  margin-left: 2rem;\n}\n.main-module_modal-window__close-icon__32GlC {\n  cursor: pointer;\n  fill: #5c657e;\n}\n.main-module_modal-window__close-icon__32GlC * {\n  fill: #5c657e;\n}\n.main-module_modal-window__content__2Yq_0 {\n  overflow-y: auto;\n  -ms-scroll-chaining: none;\n      overscroll-behavior: none;\n  padding: 1rem 2rem 1rem 2rem;\n}\n.main-module_modal-window__content_no-overflow__d24L_ {\n  overflow-y: visible;\n}\n.main-module_modal-window__footer__1o3OM {\n  padding: 0.75rem 2rem;\n  text-align: right;\n  border-top: 1px solid #ececec;\n  border-bottom: 2px solid transparent;\n}\n.main-module_modal-window-mask__mR_gM {\n  align-items: center;\n  justify-content: center;\n  position: fixed;\n  top: 0;\n  left: 0;\n  z-index: 1900;\n  background-color: rgba(0, 0, 0, 0.5);\n  width: calc(100vw);\n  height: calc(100vh);\n  height: calc(var(--vh, 1vh) * 100);\n  transition: all 0.25s ease;\n}\n.main-module_modal-window-mask_show-transition-start__2F24Y,\n.main-module_modal-window-mask_hide-transition-end__1SeMQ {\n  opacity: 0;\n}\n.main-module_modal-window-mask_show-transition-end__3QHf6,\n.main-module_modal-window-mask_hide-transition-start__1FESf {\n  opacity: 1;\n}\n";
+var css_248z = "/* font colors */\n/* actions */\n/* background */\n/* errors */\n/* borders */\n/* grid */\n/* scrollBar */\n/* sizes */\n.main-module_modal-window__1epDY {\n  flex-direction: column;\n  position: relative;\n  z-index: 2000;\n  max-width: 1400px;\n  max-height: 100%;\n  min-width: 320px;\n  background-color: #ffffff;\n  border-radius: 5px;\n  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.33);\n  transition: all 0.25s ease;\n}\n.main-module_modal-window_show-transition-start__20Zyy,\n.main-module_modal-window_hide-transition-end__2tbM7 {\n  opacity: 0;\n  transform: translate3d(0, -20vh, 0);\n}\n.main-module_modal-window_show-transition-end__1bGXM,\n.main-module_modal-window_hide-transition-start__3v2ve {\n  opacity: 1;\n  transform: translate3d(0, 0, 0);\n}\n.main-module_modal-window_show-tooltip-transition-start__3T6jk,\n.main-module_modal-window_hide-tooltip-transition-end__1-Elu {\n  opacity: 0;\n}\n.main-module_modal-window_show-tooltip-transition-end__3qcFY,\n.main-module_modal-window_hide-tooltip-transition-start__1LrQS {\n  opacity: 1;\n}\n.main-module_modal-window_visible__Y9ArZ {\n  display: flex;\n}\n.main-module_modal-window_relative__2bV4q {\n  position: absolute;\n}\n.main-module_modal-window_loading__i6ehQ {\n  min-width: auto;\n}\n.main-module_modal-window_small__2ohvZ {\n  max-width: 440px;\n}\n.main-module_modal-window__body__o4m8Y {\n  display: flex;\n  flex-direction: column;\n  overflow: hidden;\n  max-height: calc(var(--vh, 1vh) * 100 - (2 * 1rem));\n}\n.main-module_modal-window__body_no-overflow__144M5 {\n  overflow: visible;\n}\n.main-module_modal-window__header__vMn-j {\n  flex: 0 0 auto;\n  display: flex;\n  justify-content: space-between;\n  align-items: flex-start;\n  padding: 2rem 2rem 0.5rem 2rem;\n}\n.main-module_modal-window__header-actions__Qj4RZ {\n  margin-left: 2rem;\n}\n.main-module_modal-window__close-icon__32GlC {\n  cursor: pointer;\n  fill: #5c657e;\n}\n.main-module_modal-window__close-icon__32GlC * {\n  fill: #5c657e;\n}\n.main-module_modal-window__content__2Yq_0 {\n  overflow-y: auto;\n  -ms-scroll-chaining: none;\n      overscroll-behavior: none;\n  padding: 1rem 2rem 1rem 2rem;\n}\n.main-module_modal-window__content_no-overflow__d24L_ {\n  overflow-y: visible;\n}\n.main-module_modal-window__footer__1o3OM {\n  padding: 0.75rem 2rem;\n  text-align: right;\n  border-top: 1px solid #ececec;\n  border-bottom: 2px solid transparent;\n}\n.main-module_modal-window-mask__mR_gM {\n  align-items: center;\n  justify-content: center;\n  position: fixed;\n  top: 0;\n  left: 0;\n  z-index: 1900;\n  background-color: rgba(0, 0, 0, 0.5);\n  width: calc(100vw);\n  height: calc(var(--vh, 1vh) * 100);\n  transition: all 0.25s ease;\n}\n.main-module_modal-window-mask_show-transition-start__2F24Y,\n.main-module_modal-window-mask_hide-transition-end__1SeMQ {\n  opacity: 0;\n}\n.main-module_modal-window-mask_show-transition-end__3QHf6,\n.main-module_modal-window-mask_hide-transition-start__1FESf {\n  opacity: 1;\n}\n";
 var cssClasses = {"modal-window":"main-module_modal-window__1epDY","modal-window_show-transition-start":"main-module_modal-window_show-transition-start__20Zyy","modal-window_hide-transition-end":"main-module_modal-window_hide-transition-end__2tbM7","modal-window_show-transition-end":"main-module_modal-window_show-transition-end__1bGXM","modal-window_hide-transition-start":"main-module_modal-window_hide-transition-start__3v2ve","modal-window_show-tooltip-transition-start":"main-module_modal-window_show-tooltip-transition-start__3T6jk","modal-window_hide-tooltip-transition-end":"main-module_modal-window_hide-tooltip-transition-end__1-Elu","modal-window_show-tooltip-transition-end":"main-module_modal-window_show-tooltip-transition-end__3qcFY","modal-window_hide-tooltip-transition-start":"main-module_modal-window_hide-tooltip-transition-start__1LrQS","modal-window_visible":"main-module_modal-window_visible__Y9ArZ","modal-window_relative":"main-module_modal-window_relative__2bV4q","modal-window_loading":"main-module_modal-window_loading__i6ehQ","modal-window_small":"main-module_modal-window_small__2ohvZ","modal-window__body":"main-module_modal-window__body__o4m8Y","modal-window__body_no-overflow":"main-module_modal-window__body_no-overflow__144M5","modal-window__header":"main-module_modal-window__header__vMn-j","modal-window__header-actions":"main-module_modal-window__header-actions__Qj4RZ","modal-window__close-icon":"main-module_modal-window__close-icon__32GlC","modal-window__content":"main-module_modal-window__content__2Yq_0","modal-window__content_no-overflow":"main-module_modal-window__content_no-overflow__d24L_","modal-window__footer":"main-module_modal-window__footer__1o3OM","modal-window-mask":"main-module_modal-window-mask__mR_gM","modal-window-mask_show-transition-start":"main-module_modal-window-mask_show-transition-start__2F24Y","modal-window-mask_hide-transition-end":"main-module_modal-window-mask_hide-transition-end__1SeMQ","modal-window-mask_show-transition-end":"main-module_modal-window-mask_show-transition-end__3QHf6","modal-window-mask_hide-transition-start":"main-module_modal-window-mask_hide-transition-start__1FESf"};
 styleInject_es['default'](css_248z);
 

package/build/cjs/packages/aurora/src/translations/en.json.js

@@ -79,7 +79,10 @@ var en = {
 	"Selected cell 6": "Bottom left",
 	"Selected cell 7": "Bottom center",
 	"Selected cell 8": "Bottom right",
-	"Drag file or select": "Drag file or select"
+	"Drag file or select": "Drag file or select",
+	"Drag a file here or browse": "Drag a file here or browse",
+	"supported format": "supported format",
+	"The value cannot be greater than the width of the uploaded file": "The value cannot be greater than the width of the uploaded file"
 };
 
 exports.Add = Add;

package/build/cjs/packages/aurora/src/translations/en.json.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/cjs/packages/aurora/src/translations/pl.json.js

@@ -79,7 +79,10 @@ var pl = {
 	"Selected cell 6": "Dół z lewej",
 	"Selected cell 7": "Dół na środku",
 	"Selected cell 8": "Dół z prawej",
-	"Drag file or select": "Przeciągnij plik lub wybierz"
+	"Drag file or select": "Przeciągnij plik lub wybierz",
+	"Drag a file here or browse": "Przeciągnij lub wybierz plik z dysku",
+	"supported format": "obsługiwany format",
+	"The value cannot be greater than the width of the uploaded file": "Wartość nie może być większa od szerokości wgranego pliku"
 };
 
 exports.Add = Add;

package/build/cjs/packages/aurora/src/translations/pl.json.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/aurora/src/assets/icon_wrong_file_format.d.ts

@@ -0,0 +1,4 @@
+import { IIconProps } from './types';
+import React from 'react';
+declare const IconWrongFileFormat: React.FC<IIconProps>;
+export default IconWrongFileFormat;

package/build/esm/packages/aurora/src/assets/icon_wrong_file_format.js

@@ -0,0 +1,13 @@
+import './types';
+import Icon from './icon';
+import React from 'react';
+import cssClasses from '../css/icons/main.module.less';
+const IconWrongFileFormat = ({ className = '', size }) => (React.createElement(Icon, null,
+    React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 67 52", width: "67", height: "52", className: `${className || ''} ${cssClasses[`icon_${size}`]}` },
+        React.createElement("path", { d: "M36.9768 2H1.5V49.9829H29.9977M44.5374 2H65.4745V49.9829H39.8847", stroke: "#ABB4CD", strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "3" }),
+        React.createElement("path", { d: "m36.976 2-7.5606 7.7972 9.8869 10.196-9.8869 10.196 9.8869 10.196-9.3053 9.5965", stroke: "#ABB4CD", strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "3" }),
+        React.createElement("path", { d: "m34.069 45.784-15.703-15.594-16.866 16.794v2.9989h28.498l4.0711-4.1985z", fill: "#ABB4CD", stroke: "#ABB4CD", strokeLinejoin: "round", strokeWidth: "2" }),
+        React.createElement("path", { d: "m45.726 24.793 19.774 20.393v4.7983h-26.753c-0.1938 0.1999 1.1365-1.3195 5.7892-6.5976 4.6526-5.2782-2.3263-8.3971-5.2076-11.996l6.3974-6.5976z", fill: "#ABB4CD", stroke: "#ABB4CD", strokeLinejoin: "round", strokeWidth: "3" }),
+        React.createElement("circle", { cx: "54.352", cy: "13.197", r: "4", fill: "#ABB4CD" }))));
+export default IconWrongFileFormat;
+//# sourceMappingURL=icon_wrong_file_format.js.map

package/build/esm/packages/aurora/src/assets/icon_wrong_file_format.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"icon_wrong_file_format.js","sourceRoot":"","sources":["../../../../../../src/assets/icon_wrong_file_format.tsx"],"names":[],"mappings":"AAAA,OAA2B,SAAS,CAAC;AACrC,OAAO,IAAI,MAAM,QAAQ,CAAC;AAC1B,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,UAAU,MAAM,+BAA+B,CAAC;AAEvD,MAAM,mBAAmB,GAAyB,CAAC,EAAE,SAAS,GAAG,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE,CAAC,CAC5E,oBAAC,IAAI;IACD,6BACI,KAAK,EAAC,4BAA4B,EAClC,OAAO,EAAC,WAAW,EACnB,KAAK,EAAC,IAAI,EACV,MAAM,EAAC,IAAI,EACX,SAAS,EAAE,GAAG,SAAS,IAAI,EAAE,IAAI,UAAU,CAAC,QAAQ,IAAI,EAAE,CAAC,EAAE;QAE7D,8BACI,CAAC,EAAC,kEAAkE,EACpE,MAAM,EAAC,SAAS,EAChB,aAAa,EAAC,OAAO,EACrB,cAAc,EAAC,OAAO,EACtB,WAAW,EAAC,GAAG,GACjB;QACF,8BACI,CAAC,EAAC,iFAAiF,EACnF,MAAM,EAAC,SAAS,EAChB,aAAa,EAAC,OAAO,EACrB,cAAc,EAAC,OAAO,EACtB,WAAW,EAAC,GAAG,GACjB;QACF,8BACI,CAAC,EAAC,yEAAyE,EAC3E,IAAI,EAAC,SAAS,EACd,MAAM,EAAC,SAAS,EAChB,cAAc,EAAC,OAAO,EACtB,WAAW,EAAC,GAAG,GACjB;QACF,8BACI,CAAC,EAAC,iJAAiJ,EACnJ,IAAI,EAAC,SAAS,EACd,MAAM,EAAC,SAAS,EAChB,cAAc,EAAC,OAAO,EACtB,WAAW,EAAC,GAAG,GACjB;QACF,gCAAQ,EAAE,EAAC,QAAQ,EAAC,EAAE,EAAC,QAAQ,EAAC,CAAC,EAAC,GAAG,EAAC,IAAI,EAAC,SAAS,GAAG,CACrD,CACH,CACV,CAAC;AAEF,eAAe,mBAAmB,CAAC"}

package/build/esm/packages/aurora/src/components/controls/hoc/control_image_picker/index.d.ts

@@ -0,0 +1,4 @@
+import { IControlImagePicker } from '../../types';
+import React from 'react';
+declare const ControlImagePicker: React.FC<IControlImagePicker>;
+export default ControlImagePicker;

package/build/esm/packages/aurora/src/components/controls/hoc/control_image_picker/index.js

@@ -0,0 +1,17 @@
+import Control from '../../index';
+import Hint from '@auroraComponents/hint';
+import '../../types';
+import ImagePicker from '@auroraComponents/image_picker';
+import React from 'react';
+const ControlImagePicker = ({ label, isRequired, id, name, onChange, allowedExtensions, initialFile, className, errors, hint, labelAdditionalInfo, hasWidthInput, widthInputPostfix, widthInputLabel, widthInputHint }) => {
+    return (React.createElement(Control, { errors: errors, name: name, id: id },
+        (label || hint) && (React.createElement(Control.Label, { id: id, isRequired: isRequired, additionalInfo: labelAdditionalInfo },
+            label,
+            hint && React.createElement(Hint, { hint: hint, spacingLeft: true }))),
+        React.createElement(Control.Content, null,
+            React.createElement(Control.Element, null,
+                React.createElement(ImagePicker, { id: id, name: name, onChange: onChange, allowedExtensions: allowedExtensions, initialFile: initialFile, className: className, hasWidthInput: hasWidthInput, widthInputPostfix: widthInputPostfix, widthInputLabel: widthInputLabel, widthInputHint: widthInputHint }))),
+        React.createElement(Control.Errors, null)));
+};
+export default ControlImagePicker;
+//# sourceMappingURL=index.js.map

package/build/esm/packages/aurora/src/components/controls/hoc/control_image_picker/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../../../src/components/controls/hoc/control_image_picker/index.tsx"],"names":[],"mappings":"AAAA,OAAO,OAAO,MAAM,aAAa,CAAC;AAClC,OAAO,IAAI,MAAM,wBAAwB,CAAC;AAC1C,OAAoC,aAAa,CAAC;AAClD,OAAO,WAAW,MAAM,gCAAgC,CAAC;AACzD,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,MAAM,kBAAkB,GAAkC,CAAC,EACvD,KAAK,EACL,UAAU,EACV,EAAE,EACF,IAAI,EACJ,QAAQ,EACR,iBAAiB,EACjB,WAAW,EACX,SAAS,EACT,MAAM,EACN,IAAI,EACJ,mBAAmB,EACnB,aAAa,EACb,iBAAiB,EACjB,eAAe,EACf,cAAc,EACjB,EAAE,EAAE;IACD,OAAO,CACH,oBAAC,OAAO,IAAC,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,EAAE,EAAE,EAAE;QACtC,CAAC,KAAK,IAAI,IAAI,CAAC,IAAI,CAChB,oBAAC,OAAO,CAAC,KAAK,IAAC,EAAE,EAAE,EAAE,EAAE,UAAU,EAAE,UAAU,EAAE,cAAc,EAAE,mBAAmB;YAC7E,KAAK;YACL,IAAI,IAAI,oBAAC,IAAI,IAAC,IAAI,EAAE,IAAI,EAAE,WAAW,SAAG,CAC7B,CACnB;QACD,oBAAC,OAAO,CAAC,OAAO;YACZ,oBAAC,OAAO,CAAC,OAAO;gBACZ,oBAAC,WAAW,IACR,EAAE,EAAE,EAAE,EACN,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,QAAQ,EAClB,iBAAiB,EAAE,iBAAiB,EACpC,WAAW,EAAE,WAAW,EACxB,SAAS,EAAE,SAAS,EACpB,aAAa,EAAE,aAAa,EAC5B,iBAAiB,EAAE,iBAAiB,EACpC,eAAe,EAAE,eAAe,EAChC,cAAc,EAAE,cAAc,GAChC,CACY,CACJ;QAClB,oBAAC,OAAO,CAAC,MAAM,OAAG,CACZ,CACb,CAAC;AACN,CAAC,CAAC;AAEF,eAAe,kBAAkB,CAAC"}

package/build/esm/packages/aurora/src/components/controls/types.d.ts

@@ -169,6 +169,16 @@ export interface IControlFilePicker extends IFilePicker, IControlCommonProps {
     name?: string;
     labelAdditionalInfo?: string | ReactNode;
 }
+export interface IControlImagePicker extends IFilePicker, IControlCommonProps {
+    label?: string;
+    isRequired?: boolean;
+    name?: string;
+    labelAdditionalInfo?: string | ReactNode;
+    hasWidthInput?: boolean;
+    widthInputPostfix?: string;
+    widthInputLabel?: string;
+    widthInputHint?: string;
+}
 export interface ICellSelector {
     rows?: number;
     cols?: number;

package/build/esm/packages/aurora/src/components/file_picker/constants.d.ts

@@ -0,0 +1,8 @@
+export declare const FILE_PICKER_ERROR: {
+    invalidFileFormat: string;
+    invalidInputWidth: string;
+};
+export declare const JPG_EXTENSION = "jpg";
+export declare const JPEG_EXTENSION = "jpeg";
+export declare const SVG_MIME_TYPE = "svg+xml";
+export declare const SVG_EXTENSION = "svg";

package/build/esm/packages/aurora/src/components/file_picker/constants.js

@@ -0,0 +1,11 @@
+const FILE_PICKER_ERROR = {
+    invalidFileFormat: 'Invalid file format',
+    invalidInputWidth: 'The value cannot be greater than the width of the uploaded file'
+};
+const JPG_EXTENSION = 'jpg';
+const JPEG_EXTENSION = 'jpeg';
+const SVG_MIME_TYPE = 'svg+xml';
+const SVG_EXTENSION = 'svg';
+
+export { FILE_PICKER_ERROR, JPEG_EXTENSION, JPG_EXTENSION, SVG_EXTENSION, SVG_MIME_TYPE };
+//# sourceMappingURL=constants.js.map

package/build/esm/packages/aurora/src/components/file_picker/constants.js.map

@@ -0,0 +1 @@
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/aurora/src/components/file_picker/types.d.ts

@@ -33,10 +33,13 @@ export interface IUseFilePicker {
     onFileDelete: () => void;
     onPreviewError: () => void;
     file: TFilePickerFile | undefined;
+    errors?: string[];
     isPreview: boolean;
     isDragOver: boolean;
+    isVectorImage?: boolean;
 }
 export interface IUseFilePickerProps {
     onChange?: (fileList: FileList | null) => void;
     initialFile?: TFilePickerFile;
+    allowedExtensions?: string[];
 }

package/build/esm/packages/aurora/src/components/file_picker/use_file_picker.d.ts

@@ -1,2 +1,2 @@
 import { IUseFilePicker, IUseFilePickerProps } from "./types";
-export declare const useFilePicker: ({ onChange, initialFile }: IUseFilePickerProps) => IUseFilePicker;
+export declare const useFilePicker: ({ onChange, initialFile, allowedExtensions }: IUseFilePickerProps) => IUseFilePicker;

package/build/esm/packages/aurora/src/components/file_picker/use_file_picker.js

@@ -1,9 +1,12 @@
 import { useState, useEffect } from 'react';
+import { FILE_PICKER_ERROR, JPG_EXTENSION, JPEG_EXTENSION, SVG_MIME_TYPE, SVG_EXTENSION } from './constants.js';
 
-const useFilePicker = ({ onChange, initialFile }) => {
+const useFilePicker = ({ onChange, initialFile, allowedExtensions }) => {
     const [file, setFile] = useState(initialFile);
+    const [errors, setErrors] = useState([]);
     const [isDragOver, setDragOver] = useState(false);
     const [isPreview, setPreview] = useState(true);
+    const [isVectorImage, setIsVectorImage] = useState(false);
     useEffect(() => {
         setFile(initialFile);
     }, [initialFile]);
@@ -11,9 +14,49 @@ const useFilePicker = ({ onChange, initialFile }) => {
         event.stopPropagation();
         event.preventDefault();
         const { dataTransfer: { files } } = event;
+        setFileFormatError(checkIfFileIsInCorrectFormat(allowedExtensions, files[0].type));
+        checkIfImageIsVector(files[0].type);
         setDragOver(false);
         updateFile(files);
     };
+    const checkIfFileIsInCorrectFormat = (allowedExtensions, fileType) => {
+        if (!allowedExtensions)
+            return;
+        const fileExtension = getFileExtension(fileType);
+        let formatIsCorrect;
+        if (Array.isArray(fileExtension)) {
+            formatIsCorrect = allowedExtensions.some((extension) => fileExtension.includes(extension.toLowerCase()));
+        }
+        else {
+            formatIsCorrect = allowedExtensions === null || allowedExtensions === void 0 ? void 0 : allowedExtensions.some((extension) => {
+                return extension.toLowerCase() === fileExtension.toLowerCase();
+            });
+        }
+        return formatIsCorrect;
+    };
+    const setFileFormatError = (isFileFormatCorrect) => {
+        if (!isFileFormatCorrect) {
+            setErrors([...errors, FILE_PICKER_ERROR.invalidFileFormat]);
+        }
+        else {
+            setErrors([]);
+        }
+    };
+    const getFileExtension = (fileType) => {
+        const substringIndex = fileType.lastIndexOf('/');
+        const fileExtension = fileType.substring(substringIndex + 1);
+        if (fileExtension === JPG_EXTENSION || fileExtension === JPEG_EXTENSION) {
+            return [JPG_EXTENSION, JPEG_EXTENSION];
+        }
+        else if (fileExtension === SVG_MIME_TYPE) {
+            return SVG_EXTENSION;
+        }
+        return fileExtension;
+    };
+    const checkIfImageIsVector = (fileType) => {
+        const fileExtenstion = getFileExtension(fileType);
+        fileExtenstion === 'svg' ? setIsVectorImage(true) : setIsVectorImage(false);
+    };
     const onFileChange = ({ target: { files } }) => {
         updateFile(files);
     };
@@ -23,6 +66,8 @@ const useFilePicker = ({ onChange, initialFile }) => {
                 fileName: files === null || files === void 0 ? void 0 : files[0].name,
                 fileUrl: URL.createObjectURL(files === null || files === void 0 ? void 0 : files[0])
             });
+            setFileFormatError(checkIfFileIsInCorrectFormat(allowedExtensions, files[0].type));
+            checkIfImageIsVector(files[0].type);
         }
         else {
             setFile(undefined);
@@ -44,6 +89,7 @@ const useFilePicker = ({ onChange, initialFile }) => {
     const onFileDelete = () => {
         setFile(undefined);
         setPreview(true);
+        setErrors([]);
         onChange === null || onChange === void 0 ? void 0 : onChange(null);
     };
     const onPreviewError = () => {
@@ -57,8 +103,10 @@ const useFilePicker = ({ onChange, initialFile }) => {
         onFileDelete,
         onPreviewError,
         file,
+        errors,
         isPreview,
-        isDragOver
+        isDragOver,
+        isVectorImage
     };
 };
 

package/build/esm/packages/aurora/src/components/file_picker/use_file_picker.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/aurora/src/components/image_picker/components/image_input.d.ts

@@ -0,0 +1,4 @@
+import { IImagePickerInput } from '../types';
+import React from 'react';
+declare const _default: React.FC<IImagePickerInput>;
+export default _default;

package/build/esm/packages/aurora/src/components/image_picker/components/image_input.js

@@ -0,0 +1,22 @@
+import CSS_CLASSES from '@auroraComponents/image_picker/css_classes';
+import '../types';
+import IconUpload from '@auroraAssets/icon_upload';
+import React from 'react';
+import styles from '@auroraCss/image_picker/main.module.less';
+import { useTranslation } from 'react-i18next';
+import withTranslation from '@auroraUtilities/translation/with_translation';
+const ImageInput = ({ id, onDropFile, onDragOver, onDragLeave, allowedExtensions, isDragOver }) => {
+    const [t] = useTranslation();
+    return (React.createElement("label", { htmlFor: id, onDrop: onDropFile, onDragOver: onDragOver, onDragLeave: onDragLeave, className: styles[CSS_CLASSES.imagePickerLabel] },
+        React.createElement("div", { className: styles[CSS_CLASSES.imagePickerDescription] },
+            React.createElement(IconUpload, { className: styles[CSS_CLASSES.imagePickerUploadIcon] }),
+            React.createElement("p", null, t('Drag a file here or browse')),
+            React.createElement("span", null,
+                "(",
+                t('supported format'),
+                ": ",
+                allowedExtensions.join(', '),
+                ")"))));
+};
+export default withTranslation(ImageInput);
+//# sourceMappingURL=image_input.js.map

package/build/esm/packages/aurora/src/components/image_picker/components/image_input.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"image_input.js","sourceRoot":"","sources":["../../../../../../../../src/components/image_picker/components/image_input.tsx"],"names":[],"mappings":"AAAA,OAAO,WAAW,MAAM,4CAA4C,CAAC;AACrE,OAAkC,UAAU,CAAC;AAC7C,OAAO,UAAU,MAAM,2BAA2B,CAAC;AACnD,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,MAAM,MAAM,0CAA0C,CAAC;AAC9D,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAC/C,OAAO,eAAe,MAAM,+CAA+C,CAAC;AAE5E,MAAM,UAAU,GAAgC,CAAC,EAAE,EAAE,EAAE,UAAU,EAAE,UAAU,EAAE,WAAW,EAAE,iBAAiB,EAAE,UAAU,EAAE,EAAE,EAAE;IAC3H,MAAM,CAAC,CAAC,CAAC,GAAG,cAAc,EAAE,CAAC;IAE7B,OAAO,CACH,+BACI,OAAO,EAAE,EAAE,EACX,MAAM,EAAE,UAAU,EAClB,UAAU,EAAE,UAAU,EACtB,WAAW,EAAE,WAAW,EACxB,SAAS,EAAE,MAAM,CAAC,WAAW,CAAC,gBAAgB,CAAC;QAE/C,6BAAK,SAAS,EAAE,MAAM,CAAC,WAAW,CAAC,sBAAsB,CAAC;YACtD,oBAAC,UAAU,IAAC,SAAS,EAAE,MAAM,CAAC,WAAW,CAAC,qBAAqB,CAAC,GAAI;YACpE,+BAAI,CAAC,CAAC,4BAA4B,CAAC,CAAK;YACxC;;gBACM,CAAC,CAAC,kBAAkB,CAAC;;gBAAI,iBAAiB,CAAC,IAAI,CAAC,IAAI,CAAC;oBACpD,CACL,CACF,CACX,CAAC;AACN,CAAC,CAAC;AAEF,eAAe,eAAe,CAAC,UAAU,CAAC,CAAC"}

package/build/esm/packages/aurora/src/components/image_picker/components/selected_image_preview.d.ts

@@ -0,0 +1,4 @@
+import { ISelectedImagePreview } from '../types';
+import React from 'react';
+declare const SelectedImagePreview: React.FC<ISelectedImagePreview>;
+export default SelectedImagePreview;

package/build/esm/packages/aurora/src/components/image_picker/components/selected_image_preview.js

@@ -0,0 +1,28 @@
+import CSS_CLASSES from '@auroraComponents/image_picker/css_classes';
+import { FileUtils } from '@dreamcommerce/utilities';
+import '../types';
+import IconDelete from '@auroraAssets/icon_delete';
+import IconWrongFileFormat from '@auroraAssets/icon_wrong_file_format';
+import React from 'react';
+import styles from '@auroraCss/image_picker/main.module.less';
+import { useTranslation } from 'react-i18next';
+const SelectedImagePreview = ({ file, isPreview, fileFormatIsCorrect, imageSize, onPreviewError, onFileDelete }) => {
+    const [t] = useTranslation();
+    const imageName = FileUtils.getFileName(file.fileName);
+    const imageExtension = FileUtils.getFileExtension(file.fileName);
+    const imageWidth = imageSize && imageSize.width;
+    const imageHeight = imageSize && imageSize.height;
+    const previewMarkupJsx = fileFormatIsCorrect ? (React.createElement("img", { alt: "", src: (file === null || file === void 0 ? void 0 : file.fileUrl) || '', onError: onPreviewError, className: styles[CSS_CLASSES.imagePickerImagePreview] })) : (React.createElement(IconWrongFileFormat, { className: styles[CSS_CLASSES.imagePickerWrongFileFormatIcon] }));
+    return (React.createElement("div", null,
+        isPreview ? (React.createElement("div", { className: styles[CSS_CLASSES.imagePickerImagePreviewWrapper] }, previewMarkupJsx)) : (React.createElement("div", null, t('No preview'))),
+        React.createElement("div", { className: styles[CSS_CLASSES.imagePickerSelectedFile] },
+            React.createElement("div", { className: styles[CSS_CLASSES.imagePickerSelectedFileNameWrapper] }, fileFormatIsCorrect && (React.createElement("span", { className: styles[CSS_CLASSES.imagePickerSelectedFileFullName] },
+                React.createElement("span", null, FileUtils.getFileNameShortenInMiddle(imageName, 10, 5, 1)),
+                React.createElement("span", null, `.${imageExtension} (${imageWidth}x${imageHeight}px)`)))),
+            React.createElement("div", { className: styles[CSS_CLASSES.imagePickerSelectedFileRemoveWrapper] },
+                React.createElement("span", { onClick: onFileDelete, className: styles[CSS_CLASSES.imagePickerDeleteButton] },
+                    React.createElement(IconDelete, { className: styles[CSS_CLASSES.imagePickerDeleteIcon] }),
+                    React.createElement("span", { className: styles[CSS_CLASSES.imagePickerDeleteLabel] }, t('Remove')))))));
+};
+export default SelectedImagePreview;
+//# sourceMappingURL=selected_image_preview.js.map

package/build/esm/packages/aurora/src/components/image_picker/components/selected_image_preview.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"selected_image_preview.js","sourceRoot":"","sources":["../../../../../../../../src/components/image_picker/components/selected_image_preview.tsx"],"names":[],"mappings":"AAAA,OAAO,WAAW,MAAM,4CAA4C,CAAC;AACrE,OAAO,EAAE,SAAS,EAAE,MAAM,0BAA0B,CAAC;AACrD,OAAsC,UAAU,CAAC;AACjD,OAAO,UAAU,MAAM,2BAA2B,CAAC;AACnD,OAAO,mBAAmB,MAAM,sCAAsC,CAAC;AACvE,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,MAAM,MAAM,0CAA0C,CAAC;AAC9D,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAE/C,MAAM,oBAAoB,GAAoC,CAAC,EAC3D,IAAI,EACJ,SAAS,EACT,mBAAmB,EACnB,SAAS,EACT,cAAc,EACd,YAAY,EACf,EAAE,EAAE;IACD,MAAM,CAAC,CAAC,CAAC,GAAG,cAAc,EAAE,CAAC;IAC7B,MAAM,SAAS,GAAG,SAAS,CAAC,WAAW,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;IACvD,MAAM,cAAc,GAAG,SAAS,CAAC,gBAAgB,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;IACjE,MAAM,UAAU,GAAG,SAAS,IAAI,SAAS,CAAC,KAAK,CAAC;IAChD,MAAM,WAAW,GAAG,SAAS,IAAI,SAAS,CAAC,MAAM,CAAC;IAElD,MAAM,gBAAgB,GAAG,mBAAmB,CAAC,CAAC,CAAC,CAC3C,6BAAK,GAAG,EAAC,EAAE,EAAC,GAAG,EAAE,CAAA,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,OAAO,KAAI,EAAE,EAAE,OAAO,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,CAAC,WAAW,CAAC,uBAAuB,CAAC,GAAI,CAC5H,CAAC,CAAC,CAAC,CACA,oBAAC,mBAAmB,IAAC,SAAS,EAAE,MAAM,CAAC,WAAW,CAAC,8BAA8B,CAAC,GAAI,CACzF,CAAC;IAEF,OAAO,CACH;QACK,SAAS,CAAC,CAAC,CAAC,CACT,6BAAK,SAAS,EAAE,MAAM,CAAC,WAAW,CAAC,8BAA8B,CAAC,IAAG,gBAAgB,CAAO,CAC/F,CAAC,CAAC,CAAC,CACA,iCAAM,CAAC,CAAC,YAAY,CAAC,CAAO,CAC/B;QAED,6BAAK,SAAS,EAAE,MAAM,CAAC,WAAW,CAAC,uBAAuB,CAAC;YACvD,6BAAK,SAAS,EAAE,MAAM,CAAC,WAAW,CAAC,kCAAkC,CAAC,IACjE,mBAAmB,IAAI,CACpB,8BAAM,SAAS,EAAE,MAAM,CAAC,WAAW,CAAC,+BAA+B,CAAC;gBAChE,kCAAO,SAAS,CAAC,0BAA0B,CAAC,SAAS,EAAE,EAAE,EAAE,CAAC,EAAE,CAAC,CAAC,CAAQ;gBACxE,kCAAO,IAAI,cAAc,KAAK,UAAU,IAAI,WAAW,KAAK,CAAQ,CACjE,CACV,CACC;YAEN,6BAAK,SAAS,EAAE,MAAM,CAAC,WAAW,CAAC,oCAAoC,CAAC;gBACpE,8BAAM,OAAO,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,CAAC,WAAW,CAAC,uBAAuB,CAAC;oBAC/E,oBAAC,UAAU,IAAC,SAAS,EAAE,MAAM,CAAC,WAAW,CAAC,qBAAqB,CAAC,GAAI;oBACpE,8BAAM,SAAS,EAAE,MAAM,CAAC,WAAW,CAAC,sBAAsB,CAAC,IAAG,CAAC,CAAC,QAAQ,CAAC,CAAQ,CAC9E,CACL,CACJ,CACJ,CACT,CAAC;AACN,CAAC,CAAC;AAEF,eAAe,oBAAoB,CAAC"}

package/build/esm/packages/aurora/src/components/image_picker/css_classes.d.ts

@@ -0,0 +1,22 @@
+declare const _default: {
+    imagePicker: string;
+    imagePickerWrapper: string;
+    imagePickerWrapperError: string;
+    imagePickerWrapperHasFile: string;
+    imagePickerLabel: string;
+    imagePickerDescription: string;
+    imagePickerImagePreview: string;
+    imagePickerImagePreviewWrapper: string;
+    imagePickerWrongFileFormatIcon: string;
+    imagePickerErrorText: string;
+    imagePickerUploadIcon: string;
+    imagePickerDeleteButton: string;
+    imagePickerDeleteLabel: string;
+    imagePickerDeleteIcon: string;
+    imagePickerInput: string;
+    imagePickerSelectedFile: string;
+    imagePickerSelectedFileNameWrapper: string;
+    imagePickerSelectedFileRemoveWrapper: string;
+    imagePickerSelectedFileFullName: string;
+};
+export default _default;

package/build/esm/packages/aurora/src/components/image_picker/css_classes.js

@@ -0,0 +1,23 @@
+const imagePicker = 'image-picker';
+export default {
+    imagePicker: `${imagePicker}`,
+    imagePickerWrapper: `${imagePicker}__wrapper`,
+    imagePickerWrapperError: `${imagePicker}__wrapper-error`,
+    imagePickerWrapperHasFile: `${imagePicker}__wrapper-has-file`,
+    imagePickerLabel: `${imagePicker}__label`,
+    imagePickerDescription: `${imagePicker}__description`,
+    imagePickerImagePreview: `${imagePicker}__image-preview`,
+    imagePickerImagePreviewWrapper: `${imagePicker}__image-preview-wrapper`,
+    imagePickerWrongFileFormatIcon: `${imagePicker}__wrong-file-format-icon`,
+    imagePickerErrorText: `${imagePicker}__error-text`,
+    imagePickerUploadIcon: `${imagePicker}__upload-icon`,
+    imagePickerDeleteButton: `${imagePicker}__delete-button`,
+    imagePickerDeleteLabel: `${imagePicker}__delete-label`,
+    imagePickerDeleteIcon: `${imagePicker}__delete-icon`,
+    imagePickerInput: `${imagePicker}__input`,
+    imagePickerSelectedFile: `${imagePicker}__selected-file`,
+    imagePickerSelectedFileNameWrapper: `${imagePicker}__selected-file-name-wrapper`,
+    imagePickerSelectedFileRemoveWrapper: `${imagePicker}__selected-file-remove-wrapper`,
+    imagePickerSelectedFileFullName: `${imagePicker}__selected-file-full-name`
+};
+//# sourceMappingURL=css_classes.js.map

package/build/esm/packages/aurora/src/components/image_picker/css_classes.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"css_classes.js","sourceRoot":"","sources":["../../../../../../../src/components/image_picker/css_classes.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,GAAG,cAAc,CAAC;AAEnC,eAAe;IACX,WAAW,EAAE,GAAG,WAAW,EAAE;IAC7B,kBAAkB,EAAE,GAAG,WAAW,WAAW;IAC7C,uBAAuB,EAAE,GAAG,WAAW,iBAAiB;IACxD,yBAAyB,EAAE,GAAG,WAAW,oBAAoB;IAC7D,gBAAgB,EAAE,GAAG,WAAW,SAAS;IACzC,sBAAsB,EAAE,GAAG,WAAW,eAAe;IACrD,uBAAuB,EAAE,GAAG,WAAW,iBAAiB;IACxD,8BAA8B,EAAE,GAAG,WAAW,yBAAyB;IACvE,8BAA8B,EAAE,GAAG,WAAW,0BAA0B;IACxE,oBAAoB,EAAE,GAAG,WAAW,cAAc;IAClD,qBAAqB,EAAE,GAAG,WAAW,eAAe;IACpD,uBAAuB,EAAE,GAAG,WAAW,iBAAiB;IACxD,sBAAsB,EAAE,GAAG,WAAW,gBAAgB;IACtD,qBAAqB,EAAE,GAAG,WAAW,eAAe;IACpD,gBAAgB,EAAE,GAAG,WAAW,SAAS;IACzC,uBAAuB,EAAE,GAAG,WAAW,iBAAiB;IACxD,kCAAkC,EAAE,GAAG,WAAW,8BAA8B;IAChF,oCAAoC,EAAE,GAAG,WAAW,gCAAgC;IACpF,+BAA+B,EAAE,GAAG,WAAW,2BAA2B;CAC7E,CAAC"}

package/build/esm/packages/aurora/src/components/image_picker/index.d.ts

@@ -0,0 +1,4 @@
+import { IImagePicker } from "./types";
+import React from 'react';
+declare const ImagePicker: React.FC<IImagePicker>;
+export default ImagePicker;

package/build/esm/packages/aurora/src/components/image_picker/index.js

@@ -0,0 +1,93 @@
+import '@auroraComponents/image_picker/types';
+import React, { useEffect, useState } from 'react';
+import CSS_CLASSES from '@auroraComponents/image_picker/css_classes';
+import ControlInput from '@auroraComponents/controls/hoc/control_input';
+import { FILE_PICKER_ERROR } from '@auroraComponents/file_picker/constants';
+import ImageInput from '@auroraComponents/image_picker/components/image_input';
+import SelectedImagePreview from '@auroraComponents/image_picker/components/selected_image_preview';
+import Spacing from '@auroraComponents/spacing';
+import { checkIfInvalideFileFormatErrorOccured } from './utils';
+import classnames from 'classnames';
+import { createUseStyles } from 'react-jss';
+import { getAcceptFilesParametersFromAllowedExtensions } from '@auroraComponents/file_picker/utils';
+import styles from '@auroraCss/image_picker/main.module.less';
+import { useFilePicker } from '@auroraComponents/file_picker/use_file_picker';
+import { useTranslation } from 'react-i18next';
+const ImagePicker = ({ id, onChange, allowedExtensions = ['WEBP', 'JPG', 'PNG', 'GIF'], initialFile, name, className = '', hasWidthInput, widthInputPostfix = 'px', widthInputLabel, widthInputHint }) => {
+    const [t] = useTranslation();
+    const [fileFormatIsCorrect, setFileFormatIsCorrect] = useState(true);
+    const [imageSize, setImageSize] = useState({ width: 0, height: 0 });
+    const [widthInputValue, setWidthInputValue] = useState();
+    const [isInputWidthTooBig, setIsInputWidthTooBig] = useState(false);
+    const { onDropFile, onFileChange, onDragOver, onDragLeave, onFileDelete, onPreviewError, file, errors, isPreview, isDragOver, isVectorImage } = useFilePicker({ initialFile, onChange, allowedExtensions });
+    const acceptFiles = getAcceptFilesParametersFromAllowedExtensions(allowedExtensions);
+    const showMaxWidthInput = hasWidthInput && file && fileFormatIsCorrect && !isVectorImage;
+    const imagePickerClassName = classnames(styles[CSS_CLASSES.imagePicker], className && className);
+    const imagePickerWrapperClassName = classnames(styles[CSS_CLASSES.imagePickerWrapper], file && styles[CSS_CLASSES.imagePickerWrapperHasFile], !fileFormatIsCorrect && styles[CSS_CLASSES.imagePickerWrapperError]);
+    const useStyles = createUseStyles({
+        imagePickerWrapper: {
+            border: ({ isDragOver }) => (isDragOver ? '1px solid #135cc8' : ''),
+            backgroundColor: ({ isDragOver }) => (isDragOver ? 'rgba(208, 230, 255, 0.5)' : ''),
+            '& svg': {
+                // @ts-ignore
+                fill: ({ isDragOver }) => (isDragOver ? '#3c83ec' : '')
+            }
+        }
+    });
+    const dragOverStyles = useStyles({ isDragOver });
+    const getImageWidth = (event) => {
+        let selectedImage;
+        if (event.target instanceof HTMLInputElement) {
+            const { target: { files } } = event;
+            selectedImage = files[0];
+        }
+        else {
+            const { dataTransfer: { files } } = event;
+            selectedImage = files[0];
+        }
+        const imgElement = document.createElement('img');
+        const objectURL = URL.createObjectURL(selectedImage);
+        imgElement.onload = () => {
+            setImageSize({ width: imgElement.width, height: imgElement.height });
+            URL.revokeObjectURL(objectURL);
+        };
+        imgElement.src = objectURL;
+    };
+    const checkIfInputMaxWidthIsGreaterThenImageWidth = () => {
+        if (!widthInputValue || !imageSize.width)
+            return;
+        widthInputValue > imageSize.width ? setIsInputWidthTooBig(true) : setIsInputWidthTooBig(false);
+    };
+    const handleonDropFile = (event) => {
+        onDropFile(event);
+        getImageWidth(event);
+    };
+    const handleOnFileChange = (event) => {
+        onFileChange(event);
+        getImageWidth(event);
+    };
+    const handleOnFileDelete = () => {
+        setImageSize({ width: 0, height: 0 });
+        onFileDelete();
+    };
+    const handleOnWidthInputChange = (event) => {
+        setWidthInputValue(event.target.valueAsNumber);
+    };
+    useEffect(() => {
+        checkIfInvalideFileFormatErrorOccured(errors) ? setFileFormatIsCorrect(false) : setFileFormatIsCorrect(true);
+        file && checkIfInputMaxWidthIsGreaterThenImageWidth();
+    }, [errors, file, widthInputValue]);
+    useEffect(() => {
+        setWidthInputValue(imageSize.width);
+    }, [imageSize]);
+    return (React.createElement("div", { className: imagePickerClassName },
+        React.createElement("div", { className: `${imagePickerWrapperClassName} ${dragOverStyles.imagePickerWrapper}` },
+            file && (React.createElement(SelectedImagePreview, { file: file, onFileDelete: handleOnFileDelete, onPreviewError: onPreviewError, isPreview: isPreview, fileFormatIsCorrect: fileFormatIsCorrect, imageSize: imageSize })),
+            React.createElement(ImageInput, { onDragLeave: onDragLeave, onDragOver: onDragOver, isDragOver: isDragOver, allowedExtensions: allowedExtensions, id: id, onDropFile: handleonDropFile }),
+            React.createElement("input", { onChange: handleOnFileChange, id: id, type: "file", name: name, className: styles[CSS_CLASSES.imagePickerInput], accept: acceptFiles })),
+        !fileFormatIsCorrect && React.createElement("p", { className: styles[CSS_CLASSES.imagePickerErrorText] }, t('Invalid file format')),
+        showMaxWidthInput && (React.createElement(Spacing, { as: "div", "mt-xs": 2 },
+            React.createElement(ControlInput, { id: `${id}-image-width`, type: "number", postfix: widthInputPostfix, value: widthInputValue, isRequired: true, label: widthInputLabel, hint: widthInputHint, onChange: handleOnWidthInputChange, errors: isInputWidthTooBig ? [`${t(FILE_PICKER_ERROR.invalidInputWidth)}`] : null })))));
+};
+export default ImagePicker;
+//# sourceMappingURL=index.js.map

package/build/esm/packages/aurora/src/components/image_picker/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../src/components/image_picker/index.tsx"],"names":[],"mappings":"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"}

package/build/esm/packages/aurora/src/components/image_picker/types.d.ts

@@ -0,0 +1,37 @@
+import React from 'react';
+export declare type TImagePickerFile = {
+    fileUrl: string;
+    fileName: string;
+};
+export interface IImagePicker {
+    id: string;
+    name?: string;
+    className?: string;
+    onChange?: (imageList: FileList | null) => void;
+    allowedExtensions?: string[];
+    initialFile?: TImagePickerFile;
+    hasWidthInput?: boolean;
+    widthInputPostfix?: string;
+    widthInputLabel?: string;
+    widthInputHint?: string;
+}
+export interface ISelectedImagePreview {
+    file: TImagePickerFile;
+    isPreview: boolean;
+    fileFormatIsCorrect?: boolean;
+    imageSize?: TImageSize;
+    onPreviewError: () => void;
+    onFileDelete: () => void;
+}
+export interface IImagePickerInput {
+    id: string;
+    onDropFile: (event: React.DragEvent<HTMLLabelElement>) => void;
+    onDragOver: (event: React.DragEvent<HTMLLabelElement>) => void;
+    onDragLeave: (event: React.DragEvent<HTMLLabelElement>) => void;
+    allowedExtensions: string[];
+    isDragOver: boolean;
+}
+export declare type TImageSize = {
+    width: number;
+    height: number;
+};

package/build/esm/packages/aurora/src/components/image_picker/types.js

@@ -0,0 +1,2 @@
+import 'react';
+//# sourceMappingURL=types.js.map

package/build/esm/packages/aurora/src/components/image_picker/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../../../../src/components/image_picker/types.ts"],"names":[],"mappings":"AAAA,OAAkB,OAAO,CAAC"}

package/build/esm/packages/aurora/src/components/image_picker/utils.d.ts

@@ -0,0 +1 @@
+export declare const checkIfInvalideFileFormatErrorOccured: (errorsArray: string[] | undefined) => boolean | undefined;

package/build/esm/packages/aurora/src/components/image_picker/utils.js

@@ -0,0 +1,5 @@
+import { FILE_PICKER_ERROR } from '@auroraComponents/file_picker/constants';
+export const checkIfInvalideFileFormatErrorOccured = (errorsArray) => {
+    return errorsArray && errorsArray.includes(FILE_PICKER_ERROR.invalidFileFormat);
+};
+//# sourceMappingURL=utils.js.map

package/build/esm/packages/aurora/src/components/image_picker/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../../../../../src/components/image_picker/utils.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,yCAAyC,CAAC;AAE5E,MAAM,CAAC,MAAM,qCAAqC,GAAG,CAAC,WAAiC,EAAuB,EAAE;IAC5G,OAAO,WAAW,IAAI,WAAW,CAAC,QAAQ,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;AACpF,CAAC,CAAC"}

package/build/esm/packages/aurora/src/components/modal/components/modal.js

@@ -1,8 +1,8 @@
 import React from 'react';
 import cssClasses from '../../../css/modal/main.module.less.js';
 
-const Modal = ({ children, className, modalRef }) => {
-    return (React.createElement("div", { "data-test-id": "modal", ref: modalRef, className: `${cssClasses['modal-window']} ${cssClasses['modal-window_visible']} ${className}` },
+const Modal = ({ children, className, modalRef, style = {} }) => {
+    return (React.createElement("div", { style: style, "data-test-id": "modal", ref: modalRef, className: `${cssClasses['modal-window']} ${cssClasses['modal-window_visible']} ${className}` },
         React.createElement("div", { className: cssClasses['modal-window__body'] }, children)));
 };
 

package/build/esm/packages/aurora/src/css/modal/main.module.less.js

@@ -1,6 +1,6 @@
 import styleInject from '../../../../../external/style-inject/dist/style-inject.es.js';
 
-var css_248z = "/* font colors */\n/* actions */\n/* background */\n/* errors */\n/* borders */\n/* grid */\n/* scrollBar */\n/* sizes */\n.main-module_modal-window__1epDY {\n  flex-direction: column;\n  position: relative;\n  z-index: 2000;\n  max-width: 1400px;\n  max-height: 100%;\n  min-width: 320px;\n  background-color: #ffffff;\n  border-radius: 5px;\n  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.33);\n  transition: all 0.25s ease;\n}\n.main-module_modal-window_show-transition-start__20Zyy,\n.main-module_modal-window_hide-transition-end__2tbM7 {\n  opacity: 0;\n  transform: translate3d(0, -20vh, 0);\n}\n.main-module_modal-window_show-transition-end__1bGXM,\n.main-module_modal-window_hide-transition-start__3v2ve {\n  opacity: 1;\n  transform: translate3d(0, 0, 0);\n}\n.main-module_modal-window_show-tooltip-transition-start__3T6jk,\n.main-module_modal-window_hide-tooltip-transition-end__1-Elu {\n  opacity: 0;\n}\n.main-module_modal-window_show-tooltip-transition-end__3qcFY,\n.main-module_modal-window_hide-tooltip-transition-start__1LrQS {\n  opacity: 1;\n}\n.main-module_modal-window_visible__Y9ArZ {\n  display: flex;\n}\n.main-module_modal-window_relative__2bV4q {\n  position: absolute;\n}\n.main-module_modal-window_loading__i6ehQ {\n  min-width: auto;\n}\n.main-module_modal-window_small__2ohvZ {\n  max-width: 440px;\n}\n.main-module_modal-window__body__o4m8Y {\n  display: flex;\n  flex-direction: column;\n  overflow: hidden;\n  max-height: calc(var(--vh, 1vh) * 100 - (2 * 1rem));\n}\n.main-module_modal-window__body_no-overflow__144M5 {\n  overflow: visible;\n}\n.main-module_modal-window__header__vMn-j {\n  flex: 0 0 auto;\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  padding: 2rem 2rem 0.5rem 2rem;\n}\n.main-module_modal-window__header-actions__Qj4RZ {\n  margin-left: 2rem;\n}\n.main-module_modal-window__close-icon__32GlC {\n  cursor: pointer;\n  fill: #5c657e;\n}\n.main-module_modal-window__close-icon__32GlC * {\n  fill: #5c657e;\n}\n.main-module_modal-window__content__2Yq_0 {\n  overflow-y: auto;\n  -ms-scroll-chaining: none;\n      overscroll-behavior: none;\n  padding: 1rem 2rem 1rem 2rem;\n}\n.main-module_modal-window__content_no-overflow__d24L_ {\n  overflow-y: visible;\n}\n.main-module_modal-window__footer__1o3OM {\n  padding: 0.75rem 2rem;\n  text-align: right;\n  border-top: 1px solid #ececec;\n  border-bottom: 2px solid transparent;\n}\n.main-module_modal-window-mask__mR_gM {\n  align-items: center;\n  justify-content: center;\n  position: fixed;\n  top: 0;\n  left: 0;\n  z-index: 1900;\n  background-color: rgba(0, 0, 0, 0.5);\n  width: calc(100vw);\n  height: calc(100vh);\n  height: calc(var(--vh, 1vh) * 100);\n  transition: all 0.25s ease;\n}\n.main-module_modal-window-mask_show-transition-start__2F24Y,\n.main-module_modal-window-mask_hide-transition-end__1SeMQ {\n  opacity: 0;\n}\n.main-module_modal-window-mask_show-transition-end__3QHf6,\n.main-module_modal-window-mask_hide-transition-start__1FESf {\n  opacity: 1;\n}\n";
+var css_248z = "/* font colors */\n/* actions */\n/* background */\n/* errors */\n/* borders */\n/* grid */\n/* scrollBar */\n/* sizes */\n.main-module_modal-window__1epDY {\n  flex-direction: column;\n  position: relative;\n  z-index: 2000;\n  max-width: 1400px;\n  max-height: 100%;\n  min-width: 320px;\n  background-color: #ffffff;\n  border-radius: 5px;\n  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.33);\n  transition: all 0.25s ease;\n}\n.main-module_modal-window_show-transition-start__20Zyy,\n.main-module_modal-window_hide-transition-end__2tbM7 {\n  opacity: 0;\n  transform: translate3d(0, -20vh, 0);\n}\n.main-module_modal-window_show-transition-end__1bGXM,\n.main-module_modal-window_hide-transition-start__3v2ve {\n  opacity: 1;\n  transform: translate3d(0, 0, 0);\n}\n.main-module_modal-window_show-tooltip-transition-start__3T6jk,\n.main-module_modal-window_hide-tooltip-transition-end__1-Elu {\n  opacity: 0;\n}\n.main-module_modal-window_show-tooltip-transition-end__3qcFY,\n.main-module_modal-window_hide-tooltip-transition-start__1LrQS {\n  opacity: 1;\n}\n.main-module_modal-window_visible__Y9ArZ {\n  display: flex;\n}\n.main-module_modal-window_relative__2bV4q {\n  position: absolute;\n}\n.main-module_modal-window_loading__i6ehQ {\n  min-width: auto;\n}\n.main-module_modal-window_small__2ohvZ {\n  max-width: 440px;\n}\n.main-module_modal-window__body__o4m8Y {\n  display: flex;\n  flex-direction: column;\n  overflow: hidden;\n  max-height: calc(var(--vh, 1vh) * 100 - (2 * 1rem));\n}\n.main-module_modal-window__body_no-overflow__144M5 {\n  overflow: visible;\n}\n.main-module_modal-window__header__vMn-j {\n  flex: 0 0 auto;\n  display: flex;\n  justify-content: space-between;\n  align-items: flex-start;\n  padding: 2rem 2rem 0.5rem 2rem;\n}\n.main-module_modal-window__header-actions__Qj4RZ {\n  margin-left: 2rem;\n}\n.main-module_modal-window__close-icon__32GlC {\n  cursor: pointer;\n  fill: #5c657e;\n}\n.main-module_modal-window__close-icon__32GlC * {\n  fill: #5c657e;\n}\n.main-module_modal-window__content__2Yq_0 {\n  overflow-y: auto;\n  -ms-scroll-chaining: none;\n      overscroll-behavior: none;\n  padding: 1rem 2rem 1rem 2rem;\n}\n.main-module_modal-window__content_no-overflow__d24L_ {\n  overflow-y: visible;\n}\n.main-module_modal-window__footer__1o3OM {\n  padding: 0.75rem 2rem;\n  text-align: right;\n  border-top: 1px solid #ececec;\n  border-bottom: 2px solid transparent;\n}\n.main-module_modal-window-mask__mR_gM {\n  align-items: center;\n  justify-content: center;\n  position: fixed;\n  top: 0;\n  left: 0;\n  z-index: 1900;\n  background-color: rgba(0, 0, 0, 0.5);\n  width: calc(100vw);\n  height: calc(var(--vh, 1vh) * 100);\n  transition: all 0.25s ease;\n}\n.main-module_modal-window-mask_show-transition-start__2F24Y,\n.main-module_modal-window-mask_hide-transition-end__1SeMQ {\n  opacity: 0;\n}\n.main-module_modal-window-mask_show-transition-end__3QHf6,\n.main-module_modal-window-mask_hide-transition-start__1FESf {\n  opacity: 1;\n}\n";
 var cssClasses = {"modal-window":"main-module_modal-window__1epDY","modal-window_show-transition-start":"main-module_modal-window_show-transition-start__20Zyy","modal-window_hide-transition-end":"main-module_modal-window_hide-transition-end__2tbM7","modal-window_show-transition-end":"main-module_modal-window_show-transition-end__1bGXM","modal-window_hide-transition-start":"main-module_modal-window_hide-transition-start__3v2ve","modal-window_show-tooltip-transition-start":"main-module_modal-window_show-tooltip-transition-start__3T6jk","modal-window_hide-tooltip-transition-end":"main-module_modal-window_hide-tooltip-transition-end__1-Elu","modal-window_show-tooltip-transition-end":"main-module_modal-window_show-tooltip-transition-end__3qcFY","modal-window_hide-tooltip-transition-start":"main-module_modal-window_hide-tooltip-transition-start__1LrQS","modal-window_visible":"main-module_modal-window_visible__Y9ArZ","modal-window_relative":"main-module_modal-window_relative__2bV4q","modal-window_loading":"main-module_modal-window_loading__i6ehQ","modal-window_small":"main-module_modal-window_small__2ohvZ","modal-window__body":"main-module_modal-window__body__o4m8Y","modal-window__body_no-overflow":"main-module_modal-window__body_no-overflow__144M5","modal-window__header":"main-module_modal-window__header__vMn-j","modal-window__header-actions":"main-module_modal-window__header-actions__Qj4RZ","modal-window__close-icon":"main-module_modal-window__close-icon__32GlC","modal-window__content":"main-module_modal-window__content__2Yq_0","modal-window__content_no-overflow":"main-module_modal-window__content_no-overflow__d24L_","modal-window__footer":"main-module_modal-window__footer__1o3OM","modal-window-mask":"main-module_modal-window-mask__mR_gM","modal-window-mask_show-transition-start":"main-module_modal-window-mask_show-transition-start__2F24Y","modal-window-mask_hide-transition-end":"main-module_modal-window-mask_hide-transition-end__1SeMQ","modal-window-mask_show-transition-end":"main-module_modal-window-mask_show-transition-end__3QHf6","modal-window-mask_hide-transition-start":"main-module_modal-window-mask_hide-transition-start__1FESf"};
 styleInject(css_248z);
 

package/build/esm/packages/aurora/src/hooks/use_fixed_child_position.d.ts

@@ -1,7 +1,7 @@
 import React, { RefObject } from 'react';
 export declare const useFixedChildPosition: ({ useFixed, childRef, vPosition, hPosition }: {
     useFixed?: boolean | undefined;
-    vPosition?: "top" | "bottom" | undefined;
+    vPosition?: "bottom" | "top" | undefined;
     hPosition?: "left" | "right" | "center" | undefined;
     childRef?: React.RefObject<HTMLDivElement> | undefined;
 }) => {

package/build/esm/packages/aurora/src/translations/en.json

@@ -48,5 +48,8 @@
     "Selected cell 6": "Bottom left",
     "Selected cell 7": "Bottom center",
     "Selected cell 8": "Bottom right",
-    "Drag file or select": "Drag file or select"
+    "Drag file or select": "Drag file or select",
+    "Drag a file here or browse": "Drag a file here or browse",
+    "supported format": "supported format",
+    "The value cannot be greater than the width of the uploaded file": "The value cannot be greater than the width of the uploaded file"
 }

package/build/esm/packages/aurora/src/translations/en.json.js

@@ -75,7 +75,10 @@ var en = {
 	"Selected cell 6": "Bottom left",
 	"Selected cell 7": "Bottom center",
 	"Selected cell 8": "Bottom right",
-	"Drag file or select": "Drag file or select"
+	"Drag file or select": "Drag file or select",
+	"Drag a file here or browse": "Drag a file here or browse",
+	"supported format": "supported format",
+	"The value cannot be greater than the width of the uploaded file": "The value cannot be greater than the width of the uploaded file"
 };
 
 export default en;

package/build/esm/packages/aurora/src/translations/en.json.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/aurora/src/translations/pl.json

@@ -48,5 +48,8 @@
     "Selected cell 6": "Dół z lewej",
     "Selected cell 7": "Dół na środku",
     "Selected cell 8": "Dół z prawej",
-    "Drag file or select": "Przeciągnij plik lub wybierz"
+    "Drag file or select": "Przeciągnij plik lub wybierz",
+    "Drag a file here or browse": "Przeciągnij lub wybierz plik z dysku",
+    "supported format": "obsługiwany format",
+    "The value cannot be greater than the width of the uploaded file": "Wartość nie może być większa od szerokości wgranego pliku"
 }

package/build/esm/packages/aurora/src/translations/pl.json.js

@@ -75,7 +75,10 @@ var pl = {
 	"Selected cell 6": "Dół z lewej",
 	"Selected cell 7": "Dół na środku",
 	"Selected cell 8": "Dół z prawej",
-	"Drag file or select": "Przeciągnij plik lub wybierz"
+	"Drag file or select": "Przeciągnij plik lub wybierz",
+	"Drag a file here or browse": "Przeciągnij lub wybierz plik z dysku",
+	"supported format": "obsługiwany format",
+	"The value cannot be greater than the width of the uploaded file": "Wartość nie może być większa od szerokości wgranego pliku"
 };
 
 export default pl;

package/build/esm/packages/aurora/src/translations/pl.json.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/package.json

@@ -2,7 +2,7 @@
   "name": "@dreamcommerce/aurora",
   "packageManager": "yarn@3.2.0",
   "sideEffects": false,
-  "version": "2.5.2",
+  "version": "2.5.3-1",
   "description": "aurora",
   "author": "k0ssak",
   "license": "MIT",