@dreamcommerce/aurora 2.6.0-13 → 2.6.0-15
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/build/cjs/packages/aurora/src/components/controls/hoc/control_xhr_image_picker/index.js +1 -1
- package/build/cjs/packages/aurora/src/components/file_picker/use_file_picker.js +7 -4
- package/build/cjs/packages/aurora/src/components/file_picker/use_file_picker.js.map +1 -1
- package/build/cjs/packages/aurora/src/components/xhr_image_picker/index.js +4 -3
- package/build/cjs/packages/aurora/src/components/xhr_image_picker/index.js.map +1 -1
- package/build/cjs/packages/aurora/src/css/image_picker/main.module.less.js +1 -1
- package/build/esm/packages/aurora/src/components/controls/hoc/control_xhr_image_picker/index.js +1 -1
- package/build/esm/packages/aurora/src/components/file_picker/use_file_picker.js +7 -4
- package/build/esm/packages/aurora/src/components/file_picker/use_file_picker.js.map +1 -1
- package/build/esm/packages/aurora/src/components/xhr_image_picker/index.js +4 -3
- package/build/esm/packages/aurora/src/components/xhr_image_picker/index.js.map +1 -1
- package/build/esm/packages/aurora/src/css/image_picker/main.module.less.js +1 -1
- package/package.json +1 -1
package/build/cjs/packages/aurora/src/components/controls/hoc/control_xhr_image_picker/index.js
CHANGED
|
@@ -17,7 +17,7 @@ const ControlXhrImagePicker = ({ url, label, isRequired, id, name, onChange, all
|
|
|
17
17
|
setErrors(errors);
|
|
18
18
|
};
|
|
19
19
|
const handleControlChange = (fileList) => {
|
|
20
|
-
setErrors(
|
|
20
|
+
setErrors(null);
|
|
21
21
|
onChange === null || onChange === void 0 ? void 0 : onChange(fileList);
|
|
22
22
|
};
|
|
23
23
|
return (React__default['default'].createElement(index['default'], { errors: controlErrors, name: name, id: id },
|
|
@@ -24,16 +24,17 @@ const useFilePicker = ({ onChange, initialFile, allowedExtensions, inputRef, ini
|
|
|
24
24
|
};
|
|
25
25
|
const validateFileExtension = (allowedExtensions, mimeType) => {
|
|
26
26
|
if (!allowedExtensions)
|
|
27
|
-
return;
|
|
27
|
+
return true;
|
|
28
28
|
const isValid = allowedExtensions.reduce((acc, extension) => {
|
|
29
29
|
return acc ? acc : constants.MIME_TYPE_TO_FILE_EXTENSIONS[mimeType] === extension;
|
|
30
30
|
}, false);
|
|
31
31
|
if (isValid) {
|
|
32
32
|
setErrors([]);
|
|
33
|
-
return;
|
|
33
|
+
return isValid;
|
|
34
34
|
}
|
|
35
35
|
setErrors([...errors, i18n['default'].t(constants.FILE_PICKER_ERROR.invalidFileFormat)]);
|
|
36
36
|
onError === null || onError === void 0 ? void 0 : onError(errors);
|
|
37
|
+
return isValid;
|
|
37
38
|
};
|
|
38
39
|
const onFileChange = ({ target: { files } }) => {
|
|
39
40
|
setErrors([]);
|
|
@@ -45,13 +46,15 @@ const useFilePicker = ({ onChange, initialFile, allowedExtensions, inputRef, ini
|
|
|
45
46
|
fileName: files === null || files === void 0 ? void 0 : files[0].name,
|
|
46
47
|
fileUrl: URL.createObjectURL(files === null || files === void 0 ? void 0 : files[0])
|
|
47
48
|
});
|
|
48
|
-
validateFileExtension(allowedExtensions, files[0].type);
|
|
49
|
+
const isValid = validateFileExtension(allowedExtensions, files[0].type);
|
|
50
|
+
if (isValid)
|
|
51
|
+
onChange === null || onChange === void 0 ? void 0 : onChange(files);
|
|
49
52
|
}
|
|
50
53
|
else {
|
|
51
54
|
setFile(undefined);
|
|
55
|
+
onChange === null || onChange === void 0 ? void 0 : onChange(files);
|
|
52
56
|
}
|
|
53
57
|
setPreview(true);
|
|
54
|
-
onChange === null || onChange === void 0 ? void 0 : onChange(files);
|
|
55
58
|
};
|
|
56
59
|
const onDragOver = (event) => {
|
|
57
60
|
event.stopPropagation();
|
|
@@ -1 +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;"}
|
|
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;"}
|
|
@@ -12,10 +12,11 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
|
|
|
12
12
|
|
|
13
13
|
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
14
14
|
|
|
15
|
-
const XhrImagePicker = ({ id, url, name, onUploaded, initialFile, errors, onError, onImageSizeUpdated, allowedExtensions = [constants.FILES_EXTENSIONS.WEBP, constants.FILES_EXTENSIONS.JPG, constants.FILES_EXTENSIONS.PNG, constants.FILES_EXTENSIONS.GIF, constants.FILES_EXTENSIONS.SVG] }) => {
|
|
15
|
+
const XhrImagePicker = ({ id, url, name, onUploaded, initialFile, errors, onError, onChange, onImageSizeUpdated, allowedExtensions = [constants.FILES_EXTENSIONS.WEBP, constants.FILES_EXTENSIONS.JPG, constants.FILES_EXTENSIONS.PNG, constants.FILES_EXTENSIONS.GIF, constants.FILES_EXTENSIONS.SVG] }) => {
|
|
16
16
|
const httpApi = use_http_api.useHttpApi();
|
|
17
17
|
const pendingRequestRef = React__default['default'].useRef();
|
|
18
|
-
const
|
|
18
|
+
const handleControlChange = async (fileList) => {
|
|
19
|
+
onChange === null || onChange === void 0 ? void 0 : onChange(fileList);
|
|
19
20
|
if (!fileList || !fileList.length)
|
|
20
21
|
return;
|
|
21
22
|
if (pendingRequestRef.current) {
|
|
@@ -34,7 +35,7 @@ const XhrImagePicker = ({ id, url, name, onUploaded, initialFile, errors, onErro
|
|
|
34
35
|
React.useEffect(() => {
|
|
35
36
|
return () => { var _a; return (_a = pendingRequestRef.current) === null || _a === void 0 ? void 0 : _a.call(pendingRequestRef); };
|
|
36
37
|
}, []);
|
|
37
|
-
return (React__default['default'].createElement(index['default'], { id: id, name: name, onChange:
|
|
38
|
+
return (React__default['default'].createElement(index['default'], { id: id, name: name, onChange: handleControlChange, onError: onError, errors: errors, allowedExtensions: allowedExtensions, initialFile: initialFile, onImageSizeUpdated: onImageSizeUpdated }));
|
|
38
39
|
};
|
|
39
40
|
|
|
40
41
|
exports.default = XhrImagePicker;
|
|
@@ -1 +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;"}
|
|
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;"}
|
|
@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
4
4
|
|
|
5
5
|
var styleInject_es = require('../../../../../external/style-inject/dist/style-inject.es.js');
|
|
6
6
|
|
|
7
|
-
var css_248z = "/* font colors */\n/* actions */\n/* background */\n/* errors */\n/* borders */\n/* grid */\n/* scrollBar */\n/* sizes */\n.main-module_image-picker__wrapper__2RK3f {\n border: 1px dashed #abb4cd;\n border-radius: 2px;\n}\n.main-module_image-picker__wrapper-error__kCZeA {\n border-color: #e60c54;\n}\n.main-module_image-picker__wrapper-error__kCZeA:hover {\n border-color: #e60c54;\n}\n.main-module_image-picker__wrapper-has-file__2zmRc {\n position: relative;\n}\n.main-module_image-picker__wrapper-has-file__2zmRc .main-module_image-picker__label__1i_Fq {\n position: absolute;\n top: 0;\n right: 0;\n bottom: 46px;\n left: 0;\n}\n.main-module_image-picker__wrapper-has-file__2zmRc .main-module_image-picker__description__1v13N {\n display: none;\n}\n.main-module_image-picker__wrapper__2RK3f:hover {\n border-color: #135cc8;\n}\n.main-module_image-picker__wrapper__2RK3f:hover .main-module_image-picker__upload-icon__3sMvN {\n fill: #3c83ec;\n}\n.main-module_image-picker__label__1i_Fq {\n cursor: pointer;\n}\n.main-module_image-picker__input__3Wu2I {\n display: none;\n}\n.main-module_image-picker__description__1v13N {\n padding: 2rem 0;\n text-align: center;\n color: #3c83ec;\n}\n.main-module_image-picker__supported-formats__1_R_X {\n font-size: 12px;\n color: #59687e;\n}\n.main-module_image-picker__upload-icon__3sMvN {\n width: 1rem;\n height: auto;\n margin-bottom: 1rem;\n fill: #abb4cd;\n}\n.main-module_image-picker__delete-button__21_kT {\n display: flex;\n align-items: center;\n color: #3c83ec;\n cursor: pointer;\n background: transparent;\n}\n.main-module_image-picker__delete-button__21_kT:hover .main-module_image-picker__delete-label__3v2ot {\n text-decoration: underline;\n}\n.main-module_image-picker__wrong-file-format-icon__X-NL0 {\n margin: 2rem 0 0.5rem;\n fill: #ffffff;\n}\n.main-module_image-picker__delete-icon__30pkO {\n fill: #3c83ec;\n margin-right: 0.5rem;\n}\n.main-module_image-picker__selected-file__3bRqa {\n display: flex;\n align-items: center;\n justify-content: space-between;\n height: 46px;\n}\n.main-module_image-picker__selected-file-name-wrapper__37MKd,\n.main-module_image-picker__selected-file-remove-wrapper__2v4W2 {\n padding: 1rem;\n}\n.main-module_image-picker__selected-file-remove-wrapper__2v4W2 {\n display: flex;\n justify-content: flex-end;\n}\n.main-module_image-picker__selected-file-name-wrapper__37MKd {\n color: #59687e;\n}\n.main-module_image-picker__image-preview-wrapper__1jPXU {\n display: flex;\n align-items: center;\n justify-content: center;\n}\n.main-module_image-picker__image-preview-wrapper__1jPXU svg {\n fill: transparent;\n}\n.main-module_image-picker__image-preview__12pRu {\n max-width: 100%;\n max-height: 100%;\n}\n.main-module_image-picker__error-text__rXAvw {\n margin-top: 0.5rem;\n color: #e60c54;\n}\n";
|
|
7
|
+
var css_248z = "/* font colors */\n/* actions */\n/* background */\n/* errors */\n/* borders */\n/* grid */\n/* scrollBar */\n/* sizes */\n.main-module_image-picker__wrapper__2RK3f {\n border: 1px dashed #abb4cd;\n border-radius: 2px;\n}\n.main-module_image-picker__wrapper-error__kCZeA {\n border-color: #e60c54;\n}\n.main-module_image-picker__wrapper-error__kCZeA:hover {\n border-color: #e60c54;\n}\n.main-module_image-picker__wrapper-has-file__2zmRc {\n position: relative;\n}\n.main-module_image-picker__wrapper-has-file__2zmRc .main-module_image-picker__label__1i_Fq {\n position: absolute;\n top: 0;\n right: 0;\n bottom: 46px;\n left: 0;\n}\n.main-module_image-picker__wrapper-has-file__2zmRc .main-module_image-picker__description__1v13N {\n display: none;\n}\n.main-module_image-picker__wrapper__2RK3f:hover {\n border-color: #135cc8;\n}\n.main-module_image-picker__wrapper__2RK3f:hover .main-module_image-picker__upload-icon__3sMvN {\n fill: #3c83ec;\n}\n.main-module_image-picker__label__1i_Fq {\n cursor: pointer;\n}\n.main-module_image-picker__input__3Wu2I {\n display: none;\n}\n.main-module_image-picker__description__1v13N {\n padding: 2rem 0;\n text-align: center;\n color: #3c83ec;\n}\n.main-module_image-picker__supported-formats__1_R_X {\n font-size: 12px;\n color: #59687e;\n}\n.main-module_image-picker__upload-icon__3sMvN {\n width: 1rem;\n height: auto;\n margin-bottom: 1rem;\n fill: #abb4cd;\n}\n.main-module_image-picker__delete-button__21_kT {\n display: flex;\n align-items: center;\n color: #3c83ec;\n cursor: pointer;\n background: transparent;\n}\n.main-module_image-picker__delete-button__21_kT:hover .main-module_image-picker__delete-label__3v2ot {\n text-decoration: underline;\n}\n.main-module_image-picker__delete-button__21_kT .main-module_image-picker__delete-label__3v2ot {\n color: #3c83ec;\n}\n.main-module_image-picker__delete-button__21_kT svg {\n fill: #3c83ec;\n}\n.main-module_image-picker__wrong-file-format-icon__X-NL0 {\n margin: 2rem 0 0.5rem;\n fill: #ffffff;\n}\n.main-module_image-picker__delete-icon__30pkO {\n fill: #3c83ec;\n margin-right: 0.5rem;\n}\n.main-module_image-picker__selected-file__3bRqa {\n display: flex;\n align-items: center;\n justify-content: space-between;\n height: 46px;\n}\n.main-module_image-picker__selected-file-name-wrapper__37MKd,\n.main-module_image-picker__selected-file-remove-wrapper__2v4W2 {\n padding: 1rem;\n}\n.main-module_image-picker__selected-file-remove-wrapper__2v4W2 {\n display: flex;\n justify-content: flex-end;\n}\n.main-module_image-picker__selected-file-name-wrapper__37MKd {\n color: #59687e;\n}\n.main-module_image-picker__image-preview-wrapper__1jPXU {\n display: flex;\n align-items: center;\n justify-content: center;\n}\n.main-module_image-picker__image-preview-wrapper__1jPXU svg {\n fill: transparent;\n}\n.main-module_image-picker__image-preview__12pRu {\n max-width: 100%;\n max-height: 100%;\n}\n.main-module_image-picker__error-text__rXAvw {\n margin-top: 0.5rem;\n color: #e60c54;\n}\n";
|
|
8
8
|
var styles = {"image-picker__wrapper":"main-module_image-picker__wrapper__2RK3f","image-picker__wrapper-error":"main-module_image-picker__wrapper-error__kCZeA","image-picker__wrapper-has-file":"main-module_image-picker__wrapper-has-file__2zmRc","image-picker__label":"main-module_image-picker__label__1i_Fq","image-picker__description":"main-module_image-picker__description__1v13N","image-picker__upload-icon":"main-module_image-picker__upload-icon__3sMvN","image-picker__input":"main-module_image-picker__input__3Wu2I","image-picker__supported-formats":"main-module_image-picker__supported-formats__1_R_X","image-picker__delete-button":"main-module_image-picker__delete-button__21_kT","image-picker__delete-label":"main-module_image-picker__delete-label__3v2ot","image-picker__wrong-file-format-icon":"main-module_image-picker__wrong-file-format-icon__X-NL0","image-picker__delete-icon":"main-module_image-picker__delete-icon__30pkO","image-picker__selected-file":"main-module_image-picker__selected-file__3bRqa","image-picker__selected-file-name-wrapper":"main-module_image-picker__selected-file-name-wrapper__37MKd","image-picker__selected-file-remove-wrapper":"main-module_image-picker__selected-file-remove-wrapper__2v4W2","image-picker__image-preview-wrapper":"main-module_image-picker__image-preview-wrapper__1jPXU","image-picker__image-preview":"main-module_image-picker__image-preview__12pRu","image-picker__error-text":"main-module_image-picker__error-text__rXAvw"};
|
|
9
9
|
styleInject_es['default'](css_248z);
|
|
10
10
|
|
package/build/esm/packages/aurora/src/components/controls/hoc/control_xhr_image_picker/index.js
CHANGED
|
@@ -9,7 +9,7 @@ const ControlXhrImagePicker = ({ url, label, isRequired, id, name, onChange, all
|
|
|
9
9
|
setErrors(errors);
|
|
10
10
|
};
|
|
11
11
|
const handleControlChange = (fileList) => {
|
|
12
|
-
setErrors(
|
|
12
|
+
setErrors(null);
|
|
13
13
|
onChange === null || onChange === void 0 ? void 0 : onChange(fileList);
|
|
14
14
|
};
|
|
15
15
|
return (React.createElement(Control, { errors: controlErrors, name: name, id: id },
|
|
@@ -20,16 +20,17 @@ const useFilePicker = ({ onChange, initialFile, allowedExtensions, inputRef, ini
|
|
|
20
20
|
};
|
|
21
21
|
const validateFileExtension = (allowedExtensions, mimeType) => {
|
|
22
22
|
if (!allowedExtensions)
|
|
23
|
-
return;
|
|
23
|
+
return true;
|
|
24
24
|
const isValid = allowedExtensions.reduce((acc, extension) => {
|
|
25
25
|
return acc ? acc : MIME_TYPE_TO_FILE_EXTENSIONS[mimeType] === extension;
|
|
26
26
|
}, false);
|
|
27
27
|
if (isValid) {
|
|
28
28
|
setErrors([]);
|
|
29
|
-
return;
|
|
29
|
+
return isValid;
|
|
30
30
|
}
|
|
31
31
|
setErrors([...errors, i18n.t(FILE_PICKER_ERROR.invalidFileFormat)]);
|
|
32
32
|
onError === null || onError === void 0 ? void 0 : onError(errors);
|
|
33
|
+
return isValid;
|
|
33
34
|
};
|
|
34
35
|
const onFileChange = ({ target: { files } }) => {
|
|
35
36
|
setErrors([]);
|
|
@@ -41,13 +42,15 @@ const useFilePicker = ({ onChange, initialFile, allowedExtensions, inputRef, ini
|
|
|
41
42
|
fileName: files === null || files === void 0 ? void 0 : files[0].name,
|
|
42
43
|
fileUrl: URL.createObjectURL(files === null || files === void 0 ? void 0 : files[0])
|
|
43
44
|
});
|
|
44
|
-
validateFileExtension(allowedExtensions, files[0].type);
|
|
45
|
+
const isValid = validateFileExtension(allowedExtensions, files[0].type);
|
|
46
|
+
if (isValid)
|
|
47
|
+
onChange === null || onChange === void 0 ? void 0 : onChange(files);
|
|
45
48
|
}
|
|
46
49
|
else {
|
|
47
50
|
setFile(undefined);
|
|
51
|
+
onChange === null || onChange === void 0 ? void 0 : onChange(files);
|
|
48
52
|
}
|
|
49
53
|
setPreview(true);
|
|
50
|
-
onChange === null || onChange === void 0 ? void 0 : onChange(files);
|
|
51
54
|
};
|
|
52
55
|
const onDragOver = (event) => {
|
|
53
56
|
event.stopPropagation();
|
|
@@ -1 +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;"}
|
|
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;"}
|
|
@@ -4,10 +4,11 @@ import { REQUEST_TYPES } from '../../../../star_core/build/esm/packages/star_cor
|
|
|
4
4
|
import ImagePicker from '../image_picker/index.js';
|
|
5
5
|
import { useHttpApi } from '../../hooks/use_http_api.js';
|
|
6
6
|
|
|
7
|
-
const XhrImagePicker = ({ id, url, name, onUploaded, initialFile, errors, onError, onImageSizeUpdated, allowedExtensions = [FILES_EXTENSIONS.WEBP, FILES_EXTENSIONS.JPG, FILES_EXTENSIONS.PNG, FILES_EXTENSIONS.GIF, FILES_EXTENSIONS.SVG] }) => {
|
|
7
|
+
const XhrImagePicker = ({ id, url, name, onUploaded, initialFile, errors, onError, onChange, onImageSizeUpdated, allowedExtensions = [FILES_EXTENSIONS.WEBP, FILES_EXTENSIONS.JPG, FILES_EXTENSIONS.PNG, FILES_EXTENSIONS.GIF, FILES_EXTENSIONS.SVG] }) => {
|
|
8
8
|
const httpApi = useHttpApi();
|
|
9
9
|
const pendingRequestRef = React.useRef();
|
|
10
|
-
const
|
|
10
|
+
const handleControlChange = async (fileList) => {
|
|
11
|
+
onChange === null || onChange === void 0 ? void 0 : onChange(fileList);
|
|
11
12
|
if (!fileList || !fileList.length)
|
|
12
13
|
return;
|
|
13
14
|
if (pendingRequestRef.current) {
|
|
@@ -26,7 +27,7 @@ const XhrImagePicker = ({ id, url, name, onUploaded, initialFile, errors, onErro
|
|
|
26
27
|
useEffect(() => {
|
|
27
28
|
return () => { var _a; return (_a = pendingRequestRef.current) === null || _a === void 0 ? void 0 : _a.call(pendingRequestRef); };
|
|
28
29
|
}, []);
|
|
29
|
-
return (React.createElement(ImagePicker, { id: id, name: name, onChange:
|
|
30
|
+
return (React.createElement(ImagePicker, { id: id, name: name, onChange: handleControlChange, onError: onError, errors: errors, allowedExtensions: allowedExtensions, initialFile: initialFile, onImageSizeUpdated: onImageSizeUpdated }));
|
|
30
31
|
};
|
|
31
32
|
|
|
32
33
|
export default XhrImagePicker;
|
|
@@ -1 +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;"}
|
|
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;"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import styleInject from '../../../../../external/style-inject/dist/style-inject.es.js';
|
|
2
2
|
|
|
3
|
-
var css_248z = "/* font colors */\n/* actions */\n/* background */\n/* errors */\n/* borders */\n/* grid */\n/* scrollBar */\n/* sizes */\n.main-module_image-picker__wrapper__2RK3f {\n border: 1px dashed #abb4cd;\n border-radius: 2px;\n}\n.main-module_image-picker__wrapper-error__kCZeA {\n border-color: #e60c54;\n}\n.main-module_image-picker__wrapper-error__kCZeA:hover {\n border-color: #e60c54;\n}\n.main-module_image-picker__wrapper-has-file__2zmRc {\n position: relative;\n}\n.main-module_image-picker__wrapper-has-file__2zmRc .main-module_image-picker__label__1i_Fq {\n position: absolute;\n top: 0;\n right: 0;\n bottom: 46px;\n left: 0;\n}\n.main-module_image-picker__wrapper-has-file__2zmRc .main-module_image-picker__description__1v13N {\n display: none;\n}\n.main-module_image-picker__wrapper__2RK3f:hover {\n border-color: #135cc8;\n}\n.main-module_image-picker__wrapper__2RK3f:hover .main-module_image-picker__upload-icon__3sMvN {\n fill: #3c83ec;\n}\n.main-module_image-picker__label__1i_Fq {\n cursor: pointer;\n}\n.main-module_image-picker__input__3Wu2I {\n display: none;\n}\n.main-module_image-picker__description__1v13N {\n padding: 2rem 0;\n text-align: center;\n color: #3c83ec;\n}\n.main-module_image-picker__supported-formats__1_R_X {\n font-size: 12px;\n color: #59687e;\n}\n.main-module_image-picker__upload-icon__3sMvN {\n width: 1rem;\n height: auto;\n margin-bottom: 1rem;\n fill: #abb4cd;\n}\n.main-module_image-picker__delete-button__21_kT {\n display: flex;\n align-items: center;\n color: #3c83ec;\n cursor: pointer;\n background: transparent;\n}\n.main-module_image-picker__delete-button__21_kT:hover .main-module_image-picker__delete-label__3v2ot {\n text-decoration: underline;\n}\n.main-module_image-picker__wrong-file-format-icon__X-NL0 {\n margin: 2rem 0 0.5rem;\n fill: #ffffff;\n}\n.main-module_image-picker__delete-icon__30pkO {\n fill: #3c83ec;\n margin-right: 0.5rem;\n}\n.main-module_image-picker__selected-file__3bRqa {\n display: flex;\n align-items: center;\n justify-content: space-between;\n height: 46px;\n}\n.main-module_image-picker__selected-file-name-wrapper__37MKd,\n.main-module_image-picker__selected-file-remove-wrapper__2v4W2 {\n padding: 1rem;\n}\n.main-module_image-picker__selected-file-remove-wrapper__2v4W2 {\n display: flex;\n justify-content: flex-end;\n}\n.main-module_image-picker__selected-file-name-wrapper__37MKd {\n color: #59687e;\n}\n.main-module_image-picker__image-preview-wrapper__1jPXU {\n display: flex;\n align-items: center;\n justify-content: center;\n}\n.main-module_image-picker__image-preview-wrapper__1jPXU svg {\n fill: transparent;\n}\n.main-module_image-picker__image-preview__12pRu {\n max-width: 100%;\n max-height: 100%;\n}\n.main-module_image-picker__error-text__rXAvw {\n margin-top: 0.5rem;\n color: #e60c54;\n}\n";
|
|
3
|
+
var css_248z = "/* font colors */\n/* actions */\n/* background */\n/* errors */\n/* borders */\n/* grid */\n/* scrollBar */\n/* sizes */\n.main-module_image-picker__wrapper__2RK3f {\n border: 1px dashed #abb4cd;\n border-radius: 2px;\n}\n.main-module_image-picker__wrapper-error__kCZeA {\n border-color: #e60c54;\n}\n.main-module_image-picker__wrapper-error__kCZeA:hover {\n border-color: #e60c54;\n}\n.main-module_image-picker__wrapper-has-file__2zmRc {\n position: relative;\n}\n.main-module_image-picker__wrapper-has-file__2zmRc .main-module_image-picker__label__1i_Fq {\n position: absolute;\n top: 0;\n right: 0;\n bottom: 46px;\n left: 0;\n}\n.main-module_image-picker__wrapper-has-file__2zmRc .main-module_image-picker__description__1v13N {\n display: none;\n}\n.main-module_image-picker__wrapper__2RK3f:hover {\n border-color: #135cc8;\n}\n.main-module_image-picker__wrapper__2RK3f:hover .main-module_image-picker__upload-icon__3sMvN {\n fill: #3c83ec;\n}\n.main-module_image-picker__label__1i_Fq {\n cursor: pointer;\n}\n.main-module_image-picker__input__3Wu2I {\n display: none;\n}\n.main-module_image-picker__description__1v13N {\n padding: 2rem 0;\n text-align: center;\n color: #3c83ec;\n}\n.main-module_image-picker__supported-formats__1_R_X {\n font-size: 12px;\n color: #59687e;\n}\n.main-module_image-picker__upload-icon__3sMvN {\n width: 1rem;\n height: auto;\n margin-bottom: 1rem;\n fill: #abb4cd;\n}\n.main-module_image-picker__delete-button__21_kT {\n display: flex;\n align-items: center;\n color: #3c83ec;\n cursor: pointer;\n background: transparent;\n}\n.main-module_image-picker__delete-button__21_kT:hover .main-module_image-picker__delete-label__3v2ot {\n text-decoration: underline;\n}\n.main-module_image-picker__delete-button__21_kT .main-module_image-picker__delete-label__3v2ot {\n color: #3c83ec;\n}\n.main-module_image-picker__delete-button__21_kT svg {\n fill: #3c83ec;\n}\n.main-module_image-picker__wrong-file-format-icon__X-NL0 {\n margin: 2rem 0 0.5rem;\n fill: #ffffff;\n}\n.main-module_image-picker__delete-icon__30pkO {\n fill: #3c83ec;\n margin-right: 0.5rem;\n}\n.main-module_image-picker__selected-file__3bRqa {\n display: flex;\n align-items: center;\n justify-content: space-between;\n height: 46px;\n}\n.main-module_image-picker__selected-file-name-wrapper__37MKd,\n.main-module_image-picker__selected-file-remove-wrapper__2v4W2 {\n padding: 1rem;\n}\n.main-module_image-picker__selected-file-remove-wrapper__2v4W2 {\n display: flex;\n justify-content: flex-end;\n}\n.main-module_image-picker__selected-file-name-wrapper__37MKd {\n color: #59687e;\n}\n.main-module_image-picker__image-preview-wrapper__1jPXU {\n display: flex;\n align-items: center;\n justify-content: center;\n}\n.main-module_image-picker__image-preview-wrapper__1jPXU svg {\n fill: transparent;\n}\n.main-module_image-picker__image-preview__12pRu {\n max-width: 100%;\n max-height: 100%;\n}\n.main-module_image-picker__error-text__rXAvw {\n margin-top: 0.5rem;\n color: #e60c54;\n}\n";
|
|
4
4
|
var styles = {"image-picker__wrapper":"main-module_image-picker__wrapper__2RK3f","image-picker__wrapper-error":"main-module_image-picker__wrapper-error__kCZeA","image-picker__wrapper-has-file":"main-module_image-picker__wrapper-has-file__2zmRc","image-picker__label":"main-module_image-picker__label__1i_Fq","image-picker__description":"main-module_image-picker__description__1v13N","image-picker__upload-icon":"main-module_image-picker__upload-icon__3sMvN","image-picker__input":"main-module_image-picker__input__3Wu2I","image-picker__supported-formats":"main-module_image-picker__supported-formats__1_R_X","image-picker__delete-button":"main-module_image-picker__delete-button__21_kT","image-picker__delete-label":"main-module_image-picker__delete-label__3v2ot","image-picker__wrong-file-format-icon":"main-module_image-picker__wrong-file-format-icon__X-NL0","image-picker__delete-icon":"main-module_image-picker__delete-icon__30pkO","image-picker__selected-file":"main-module_image-picker__selected-file__3bRqa","image-picker__selected-file-name-wrapper":"main-module_image-picker__selected-file-name-wrapper__37MKd","image-picker__selected-file-remove-wrapper":"main-module_image-picker__selected-file-remove-wrapper__2v4W2","image-picker__image-preview-wrapper":"main-module_image-picker__image-preview-wrapper__1jPXU","image-picker__image-preview":"main-module_image-picker__image-preview__12pRu","image-picker__error-text":"main-module_image-picker__error-text__rXAvw"};
|
|
5
5
|
styleInject(css_248z);
|
|
6
6
|
|