@dreamcommerce/aurora 2.6.0-9 → 2.6.1-1

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.
Files changed (50) hide show
  1. package/build/cjs/packages/aurora/src/components/controls/components/errors_list.js +1 -1
  2. package/build/cjs/packages/aurora/src/components/controls/hoc/control_xhr_image_picker/index.js +11 -8
  3. package/build/cjs/packages/aurora/src/components/controls/hoc/control_xhr_image_picker/index.js.map +1 -1
  4. package/build/cjs/packages/aurora/src/components/file_picker/use_file_picker.js +13 -13
  5. package/build/cjs/packages/aurora/src/components/image_picker/components/image_input.js +3 -3
  6. package/build/cjs/packages/aurora/src/components/image_picker/css_classes.js +2 -1
  7. package/build/cjs/packages/aurora/src/components/image_picker/css_classes.js.map +1 -1
  8. package/build/cjs/packages/aurora/src/components/image_picker/index.js +5 -62
  9. package/build/cjs/packages/aurora/src/components/image_picker/index.js.map +1 -1
  10. package/build/cjs/packages/aurora/src/components/message-box/index.js +1 -1
  11. package/build/cjs/packages/aurora/src/components/xhr_image_picker/index.js +17 -5
  12. package/build/cjs/packages/aurora/src/components/xhr_image_picker/index.js.map +1 -1
  13. package/build/cjs/packages/aurora/src/css/image_picker/main.module.less.js +2 -2
  14. package/build/cjs/packages/aurora/src/css/message-box/main.module.less.js +1 -1
  15. package/build/cjs/packages/aurora/src/css/slide/main.module.less.js +1 -1
  16. package/build/esm/packages/aurora/src/components/controls/components/errors_list.js +1 -1
  17. package/build/esm/packages/aurora/src/components/controls/hoc/control_xhr_image_picker/index.js +12 -9
  18. package/build/esm/packages/aurora/src/components/controls/hoc/control_xhr_image_picker/index.js.map +1 -1
  19. package/build/esm/packages/aurora/src/components/controls/types.d.ts +3 -3
  20. package/build/esm/packages/aurora/src/components/controls/types.js.map +1 -1
  21. package/build/esm/packages/aurora/src/components/file_picker/types.d.ts +2 -0
  22. package/build/esm/packages/aurora/src/components/file_picker/use_file_picker.d.ts +1 -1
  23. package/build/esm/packages/aurora/src/components/file_picker/use_file_picker.js +14 -14
  24. package/build/esm/packages/aurora/src/components/image_picker/components/image_input.js +3 -3
  25. package/build/esm/packages/aurora/src/components/image_picker/css_classes.d.ts +1 -0
  26. package/build/esm/packages/aurora/src/components/image_picker/css_classes.js +2 -1
  27. package/build/esm/packages/aurora/src/components/image_picker/css_classes.js.map +1 -1
  28. package/build/esm/packages/aurora/src/components/image_picker/index.js +6 -63
  29. package/build/esm/packages/aurora/src/components/image_picker/index.js.map +1 -1
  30. package/build/esm/packages/aurora/src/components/image_picker/types.d.ts +2 -2
  31. package/build/esm/packages/aurora/src/components/message-box/index.d.ts +1 -1
  32. package/build/esm/packages/aurora/src/components/message-box/index.js +1 -1
  33. package/build/esm/packages/aurora/src/components/message-box/types.d.ts +1 -1
  34. package/build/esm/packages/aurora/src/components/xhr_image_picker/index.js +18 -6
  35. package/build/esm/packages/aurora/src/components/xhr_image_picker/index.js.map +1 -1
  36. package/build/esm/packages/aurora/src/components/xhr_image_picker/types.d.ts +2 -2
  37. package/build/esm/packages/aurora/src/components/xhr_image_picker/types.js.map +1 -1
  38. package/build/esm/packages/aurora/src/css/image_picker/main.module.less.js +2 -2
  39. package/build/esm/packages/aurora/src/css/message-box/main.module.less.js +1 -1
  40. package/build/esm/packages/aurora/src/css/slide/main.module.less.js +1 -1
  41. package/package.json +2 -2
  42. package/build/esm/packages/aurora/src/components/image_picker/constants.d.ts +0 -1
  43. package/build/esm/packages/aurora/src/components/image_picker/constants.js +0 -2
  44. package/build/esm/packages/aurora/src/components/image_picker/constants.js.map +0 -1
  45. package/build/esm/packages/aurora/src/components/image_picker/utils.d.ts +0 -1
  46. package/build/esm/packages/aurora/src/components/image_picker/utils.js +0 -5
  47. package/build/esm/packages/aurora/src/components/image_picker/utils.js.map +0 -1
  48. package/build/esm/packages/aurora/src/components/xhr_image_picker/utils.d.ts +0 -1
  49. package/build/esm/packages/aurora/src/components/xhr_image_picker/utils.js +0 -45
  50. package/build/esm/packages/aurora/src/components/xhr_image_picker/utils.js.map +0 -1
package/build/cjs/packages/aurora/src/components/controls/components/errors_list.js CHANGED
@@ -11,7 +11,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
11
11
  var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
12
12
 
13
13
  const ErrorsList = ({ errors, id }) => {
14
- return errors ? (React__default['default'].createElement("div", { className: main_module['default'][css_classes.cssControlsErrors] },
14
+ return (errors === null || errors === void 0 ? void 0 : errors.length) ? (React__default['default'].createElement("div", { className: main_module['default'][css_classes.cssControlsErrors] },
15
15
  React__default['default'].createElement("ul", { className: main_module['default'][css_classes.cssControlsErrorsList] }, errors.map((error, key) => (React__default['default'].createElement("label", { htmlFor: id, key: `error-item-${id}-${key}` },
16
16
  React__default['default'].createElement("li", { className: main_module['default'][css_classes.cssControlsErrorsListItem] }, error))))))) : null;
17
17
  };
package/build/cjs/packages/aurora/src/components/controls/hoc/control_xhr_image_picker/index.js CHANGED
@@ -11,19 +11,22 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
11
11
 
12
12
  var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
13
13
 
14
- const ControlXhrImagePicker = ({ url, label, isRequired, id, name, onChange, allowedExtensions, initialFile, className, errors, hint, labelAdditionalInfo, onUploaded
15
- // hasWidthInput,
16
- // widthInputPostfix,
17
- // widthInputLabel,
18
- // widthInputHint
19
- }) => {
20
- return (React__default['default'].createElement(index['default'], { errors: errors, name: name, id: id },
14
+ const ControlXhrImagePicker = ({ url, label, isRequired, id, name, onChange, allowedExtensions, initialFile, className, errors, hint, labelAdditionalInfo, onUploaded, onImageSizeUpdated }) => {
15
+ const [controlErrors, setErrors] = React.useState(errors);
16
+ const handleControlError = (errors) => {
17
+ setErrors(errors);
18
+ };
19
+ const handleControlChange = (fileList) => {
20
+ setErrors(null);
21
+ onChange === null || onChange === void 0 ? void 0 : onChange(fileList);
22
+ };
23
+ return (React__default['default'].createElement(index['default'], { errors: controlErrors, name: name, id: id },
21
24
  (label || hint) && (React__default['default'].createElement(index['default'].Label, { id: id, isRequired: isRequired, additionalInfo: labelAdditionalInfo },
22
25
  label,
23
26
  hint && React__default['default'].createElement(index$1['default'], { hint: hint, spacingLeft: true }))),
24
27
  React__default['default'].createElement(index['default'].Content, null,
25
28
  React__default['default'].createElement(index['default'].Element, null,
26
- React__default['default'].createElement(index$2['default'], { url: url, id: id, name: name, onChange: onChange, allowedExtensions: allowedExtensions, initialFile: initialFile, className: className, errors: errors, onUploaded: onUploaded }))),
29
+ React__default['default'].createElement(index$2['default'], { url: url, id: id, name: name, onChange: handleControlChange, onError: handleControlError, allowedExtensions: allowedExtensions, initialFile: initialFile, className: className, errors: errors, onUploaded: onUploaded, onImageSizeUpdated: onImageSizeUpdated }))),
27
30
  React__default['default'].createElement(index['default'].Errors, null)));
28
31
  };
29
32
 
package/build/cjs/packages/aurora/src/components/controls/hoc/control_xhr_image_picker/index.js.map CHANGED
@@ -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;"}
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;"}
package/build/cjs/packages/aurora/src/components/file_picker/use_file_picker.js CHANGED
@@ -6,14 +6,11 @@ var React = require('react');
6
6
  var i18n = require('../../i18n.js');
7
7
  var constants = require('./constants.js');
8
8
 
9
- const useFilePicker = ({ onChange, initialFile, allowedExtensions, inputRef, initialErrors }) => {
9
+ const useFilePicker = ({ onChange, initialFile, allowedExtensions, inputRef, initialErrors, onError }) => {
10
10
  const [file, setFile] = React.useState(initialFile);
11
11
  const [errors, setErrors] = React.useState(initialErrors !== null && initialErrors !== void 0 ? initialErrors : []);
12
12
  const [isDragOver, setDragOver] = React.useState(false);
13
13
  const [isPreview, setPreview] = React.useState(true);
14
- React.useEffect(() => {
15
- setFile(initialFile);
16
- }, [initialFile]);
17
14
  const onDropFile = (event) => {
18
15
  setErrors([]);
19
16
  event.stopPropagation();
@@ -27,16 +24,17 @@ const useFilePicker = ({ onChange, initialFile, allowedExtensions, inputRef, ini
27
24
  };
28
25
  const validateFileExtension = (allowedExtensions, mimeType) => {
29
26
  if (!allowedExtensions)
30
- return;
27
+ return true;
31
28
  const isValid = allowedExtensions.reduce((acc, extension) => {
32
- console.log('extension', extension);
33
- console.log('MIME_TYPE_TO_FILE_EXTENSIONS', constants.MIME_TYPE_TO_FILE_EXTENSIONS);
34
- console.log('MIME_TYPE_TO_FILE_EXTENSIONS[mimeType]', constants.MIME_TYPE_TO_FILE_EXTENSIONS[mimeType]);
35
29
  return acc ? acc : constants.MIME_TYPE_TO_FILE_EXTENSIONS[mimeType] === extension;
36
30
  }, false);
37
- console.log('isValid', isValid);
38
- console.log('mimeType', mimeType);
39
- !isValid ? setErrors([...errors, i18n['default'].t(constants.FILE_PICKER_ERROR.invalidFileFormat)]) : setErrors([]);
31
+ if (isValid) {
32
+ setErrors([]);
33
+ return isValid;
34
+ }
35
+ setErrors([...errors, i18n['default'].t(constants.FILE_PICKER_ERROR.invalidFileFormat)]);
36
+ onError === null || onError === void 0 ? void 0 : onError(errors);
37
+ return isValid;
40
38
  };
41
39
  const onFileChange = ({ target: { files } }) => {
42
40
  setErrors([]);
@@ -48,13 +46,15 @@ const useFilePicker = ({ onChange, initialFile, allowedExtensions, inputRef, ini
48
46
  fileName: files === null || files === void 0 ? void 0 : files[0].name,
49
47
  fileUrl: URL.createObjectURL(files === null || files === void 0 ? void 0 : files[0])
50
48
  });
51
- 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);
52
52
  }
53
53
  else {
54
54
  setFile(undefined);
55
+ onChange === null || onChange === void 0 ? void 0 : onChange(files);
55
56
  }
56
57
  setPreview(true);
57
- onChange === null || onChange === void 0 ? void 0 : onChange(files);
58
58
  };
59
59
  const onDragOver = (event) => {
60
60
  event.stopPropagation();
package/build/cjs/packages/aurora/src/components/image_picker/components/image_input.js CHANGED
@@ -18,12 +18,12 @@ const ImageInput = ({ id, onDropFile, onDragOver, onDragLeave, allowedExtensions
18
18
  return (React__default['default'].createElement("label", { htmlFor: id, onDrop: onDropFile, onDragOver: onDragOver, onDragLeave: onDragLeave, className: main_module['default'][css_classes['default'].imagePickerLabel] },
19
19
  React__default['default'].createElement("div", { className: main_module['default'][css_classes['default'].imagePickerDescription] },
20
20
  React__default['default'].createElement(icon_upload['default'], { className: main_module['default'][css_classes['default'].imagePickerUploadIcon] }),
21
- React__default['default'].createElement("p", null, t('Drag a file here or browse')),
22
- React__default['default'].createElement("span", null,
21
+ React__default['default'].createElement("div", null, t('Drag a file here or browse')),
22
+ React__default['default'].createElement("span", { className: main_module['default'][css_classes['default'].imagePickerSupportedFormats] },
23
23
  "(",
24
24
  t('supported format'),
25
25
  ": ",
26
- allowedExtensions.join(', '),
26
+ allowedExtensions.map((extension) => `*.${extension}`).join(', '),
27
27
  ")"))));
28
28
  };
29
29
  var ImageInput$1 = with_translation['default'](ImageInput);
package/build/cjs/packages/aurora/src/components/image_picker/css_classes.js CHANGED
@@ -21,7 +21,8 @@ var CSS_CLASSES = {
21
21
  imagePickerInput: `${imagePicker}__input`,
22
22
  imagePickerSelectedFile: `${imagePicker}__selected-file`,
23
23
  imagePickerSelectedFileNameWrapper: `${imagePicker}__selected-file-name-wrapper`,
24
- imagePickerSelectedFileRemoveWrapper: `${imagePicker}__selected-file-remove-wrapper`
24
+ imagePickerSelectedFileRemoveWrapper: `${imagePicker}__selected-file-remove-wrapper`,
25
+ imagePickerSupportedFormats: `${imagePicker}__supported-formats`
25
26
  };
26
27
 
27
28
  exports.default = CSS_CLASSES;
package/build/cjs/packages/aurora/src/components/image_picker/css_classes.js.map CHANGED
@@ -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;"}
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;"}
package/build/cjs/packages/aurora/src/components/image_picker/index.js CHANGED
@@ -21,28 +21,19 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
21
21
  var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
22
22
  var classnames__default = /*#__PURE__*/_interopDefaultLegacy(classnames);
23
23
 
24
- const ImagePicker = ({ id, onChange, errors: initialErrors, allowedExtensions = [constants.FILES_EXTENSIONS.WEBP, constants.FILES_EXTENSIONS.JPG, constants.FILES_EXTENSIONS.PNG, constants.FILES_EXTENSIONS.GIF, constants.FILES_EXTENSIONS.SVG], initialFile, name, className = ''
25
- // hasWidthInput,
26
- // widthInputPostfix = 'px',
27
- // widthInputLabel,
28
- // widthInputHint
29
- }) => {
24
+ const ImagePicker = ({ id, onChange, onError, errors: initialErrors, allowedExtensions = [constants.FILES_EXTENSIONS.WEBP, constants.FILES_EXTENSIONS.JPG, constants.FILES_EXTENSIONS.PNG, constants.FILES_EXTENSIONS.GIF, constants.FILES_EXTENSIONS.SVG], initialFile, name, className = '', onImageSizeUpdated }) => {
30
25
  const [t] = useTranslation.useTranslation();
31
26
  const inputRef = React.createRef();
32
- // const [fileFormatIsCorrect, setFileFormatIsCorrect] = useState<boolean>(true);
33
27
  const [imageSize, setImageSize] = React.useState(undefined);
34
- // const [widthInputValue, setWidthInputValue] = useState<number | undefined>();
35
- // const [isInputWidthTooBig, setIsInputWidthTooBig] = useState<boolean>(false);
36
- const onImageFileChange = (files) => {
37
- onChange === null || onChange === void 0 ? void 0 : onChange(files, imageSize);
38
- };
39
- const { onDropFile, onFileChange, onDragOver, onDragLeave, onFileDelete, onPreviewError, file, errors, isPreview, isDragOver } = use_file_picker.useFilePicker({ initialFile, onChange: onImageFileChange, allowedExtensions, initialErrors, inputRef });
28
+ const { onDropFile, onFileChange, onDragOver, onDragLeave, onFileDelete, onPreviewError, file, errors, isPreview, isDragOver } = use_file_picker.useFilePicker({ initialFile, onChange, allowedExtensions, initialErrors, onError, inputRef });
40
29
  const acceptFiles = utils.getAcceptFilesParametersFromAllowedExtensions(allowedExtensions);
41
- // const showMaxWidthInput = hasWidthInput && file && fileFormatIsCorrect && !isVectorImage;
42
30
  const imagePickerClassName = classnames__default['default'](main_module['default'][css_classes['default'].imagePicker], className && className);
43
31
  const imagePickerWrapperClassName = classnames__default['default'](main_module['default'][css_classes['default'].imagePickerWrapper], file && main_module['default'][css_classes['default'].imagePickerWrapperHasFile], {
44
32
  [main_module['default'][css_classes['default'].imagePickerWrapperError]]: errors.length
45
33
  });
34
+ React.useEffect(() => {
35
+ onImageSizeUpdated === null || onImageSizeUpdated === void 0 ? void 0 : onImageSizeUpdated(imageSize);
36
+ }, [imageSize]);
46
37
  const useStyles = reactJss_esm.createUseStyles({
47
38
  imagePickerWrapper: {
48
39
  border: ({ isDragOver }) => (isDragOver ? '1px solid #135cc8' : ''),
@@ -54,62 +45,14 @@ const ImagePicker = ({ id, onChange, errors: initialErrors, allowedExtensions =
54
45
  }
55
46
  });
56
47
  const dragOverStyles = useStyles({ isDragOver });
57
- // const getImageWidth = (event: any) => {
58
- // let selectedImage;
59
- //
60
- // if (event.target instanceof HTMLInputElement) {
61
- // const {
62
- // target: { files }
63
- // } = event;
64
- // selectedImage = files[0];
65
- // } else {
66
- // const {
67
- // dataTransfer: { files }
68
- // } = event;
69
- // selectedImage = files[0];
70
- // }
71
- //
72
- // const imgElement = document.createElement('img');
73
- // const objectURL = URL.createObjectURL(selectedImage);
74
- //
75
- // imgElement.onload = () => {
76
- // setImageSize({ width: imgElement.width, height: imgElement.height });
77
- // URL.revokeObjectURL(objectURL);
78
- // };
79
- //
80
- // imgElement.src = objectURL;
81
- // };
82
48
  const handlePreviewLoaded = (event) => {
83
49
  const $image = event.target;
84
50
  setImageSize({ width: $image.width, height: $image.height });
85
51
  };
86
- // const checkIfInputMaxWidthIsGreaterThenImageWidth = (): void => {
87
- // if (!widthInputValue || !imageSize.width) return;
88
- // widthInputValue > imageSize.width ? setIsInputWidthTooBig(true) : setIsInputWidthTooBig(false);
89
- // };
90
- // const handleOnDropFile = (event: React.DragEvent<HTMLLabelElement>) => {
91
- // onDropFile(event);
92
- // // getImageWidth(event);
93
- // };
94
- //
95
- // const handleOnFileChange = (event: React.ChangeEvent<HTMLInputElement>) => {
96
- // onFileChange(event);
97
- // // getImageWidth(event);
98
- // };
99
52
  const handleOnFileDelete = () => {
100
53
  setImageSize(undefined);
101
54
  onFileDelete();
102
55
  };
103
- // const handleOnWidthInputChange = (event: React.ChangeEvent<HTMLInputElement>) => {
104
- // setWidthInputValue(event.target.valueAsNumber);
105
- // };
106
- // useEffect(() => {
107
- // // checkIfInvalideFileFormatErrorOccured(errors) ? setFileFormatIsCorrect(false) : setFileFormatIsCorrect(true);
108
- // // file && checkIfInputMaxWidthIsGreaterThenImageWidth();
109
- // }, [errors, file, widthInputValue]);
110
- // useEffect(() => {
111
- // setWidthInputValue(imageSize.width);
112
- // }, [imageSize]);
113
56
  return (React__default['default'].createElement("div", { className: imagePickerClassName },
114
57
  React__default['default'].createElement("div", { className: `${imagePickerWrapperClassName} ${dragOverStyles.imagePickerWrapper}` },
115
58
  file &&
package/build/cjs/packages/aurora/src/components/image_picker/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA,6BAA6B,iEAAqE;AAClG,2BAA2B,yDAA6D;AACxF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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,6BAA6B,iEAAqE;AAClG,2BAA2B,yDAA6D;AACxF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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/message-box/index.js CHANGED
@@ -13,7 +13,7 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
13
13
  const MessageBox = ({ children, header, type, withoutIcon, fullWidth, className }) => {
14
14
  const messageBoxClassName = classNames.classNames([className, 'message-box', type && `message-box_${type}`, fullWidth && `message-box_full-width`], main_module['default']);
15
15
  return (React__default['default'].createElement("div", { className: messageBoxClassName },
16
- !withoutIcon && React__default['default'].createElement("div", { className: main_module['default']['message-box__icon'] }),
16
+ !withoutIcon && type !== 'blank' && React__default['default'].createElement("div", { className: main_module['default']['message-box__icon'] }),
17
17
  React__default['default'].createElement("div", { className: main_module['default']['message-box__content'] },
18
18
  header && React__default['default'].createElement("h4", { className: main_module['default']['message-box__header'] }, header),
19
19
  children)));
package/build/cjs/packages/aurora/src/components/xhr_image_picker/index.js CHANGED
@@ -12,18 +12,30 @@ 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, 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
- const onChange = async (fileList, imageSize) => {
18
- const { response } = httpApi.fetch({
17
+ const pendingRequestRef = React__default['default'].useRef();
18
+ const handleControlChange = async (fileList) => {
19
+ onChange === null || onChange === void 0 ? void 0 : onChange(fileList);
20
+ if (!fileList || !fileList.length)
21
+ return;
22
+ if (pendingRequestRef.current) {
23
+ pendingRequestRef.current();
24
+ pendingRequestRef.current = undefined;
25
+ }
26
+ const { response, cancelRequest } = httpApi.fetch({
19
27
  url,
20
28
  method: http_requester_contants.REQUEST_TYPES.post,
21
29
  data: fileList[0]
22
30
  });
31
+ pendingRequestRef.current = cancelRequest;
23
32
  const data = await response;
24
- onUploaded === null || onUploaded === void 0 ? void 0 : onUploaded(data, fileList[0], imageSize);
33
+ onUploaded === null || onUploaded === void 0 ? void 0 : onUploaded(data, fileList[0]);
25
34
  };
26
- return (React__default['default'].createElement(index['default'], { id: id, name: name, onChange: onChange, errors: errors, allowedExtensions: allowedExtensions, initialFile: initialFile }));
35
+ React.useEffect(() => {
36
+ return () => { var _a; return (_a = pendingRequestRef.current) === null || _a === void 0 ? void 0 : _a.call(pendingRequestRef); };
37
+ }, []);
38
+ return (React__default['default'].createElement(index['default'], { id: id, name: name, onChange: handleControlChange, onError: onError, errors: errors, allowedExtensions: allowedExtensions, initialFile: initialFile, onImageSizeUpdated: onImageSizeUpdated }));
27
39
  };
28
40
 
29
41
  exports.default = XhrImagePicker;
package/build/cjs/packages/aurora/src/components/xhr_image_picker/index.js.map CHANGED
@@ -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;"}
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;"}
package/build/cjs/packages/aurora/src/css/image_picker/main.module.less.js CHANGED
@@ -4,8 +4,8 @@ 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}\n.main-module_image-picker__description__1v13N p {\n color: #3c83ec;\n}\n.main-module_image-picker__description__1v13N span {\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__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
- 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__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"};
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
+ 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
 
11
11
  exports.default = styles;
package/build/cjs/packages/aurora/src/css/message-box/main.module.less.js CHANGED
@@ -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/** Form Variables */\n/** Errors */\n.main-module_link__3TzzF {\n display: flex;\n align-items: center;\n gap: 0.25rem;\n margin-top: 0.25rem;\n color: #135cc8;\n text-decoration: none;\n}\n.main-module_link__3TzzF * {\n color: #135cc8;\n fill: #135cc8;\n}\n.main-module_link__3TzzF:hover {\n text-decoration: underline;\n -webkit-text-decoration-color: #135cc8;\n text-decoration-color: #135cc8;\n cursor: pointer;\n}\n.main-module_message-box__2eSFA {\n position: relative;\n display: flex;\n align-items: center;\n width: 100%;\n max-width: 100%;\n padding: 1rem;\n margin-left: auto;\n margin-right: auto;\n background-color: #ebeffa;\n border-radius: 3px;\n color: #2d3748;\n}\n.main-module_message-box__2eSFA:not(:last-child) {\n margin-bottom: 1rem;\n}\n.main-module_message-box__2eSFA a {\n display: flex;\n align-items: center;\n gap: 0.25rem;\n margin-top: 0.25rem;\n color: #135cc8;\n text-decoration: none;\n display: inline-flex;\n margin-top: 0;\n}\n.main-module_message-box__2eSFA a * {\n color: #135cc8;\n fill: #135cc8;\n}\n.main-module_message-box__2eSFA a:hover {\n text-decoration: underline;\n -webkit-text-decoration-color: #135cc8;\n text-decoration-color: #135cc8;\n cursor: pointer;\n}\n.main-module_message-box_alert__3K_Ml,\n.main-module_message-box_error__Cbckk {\n background-color: #ffe6ea;\n}\n.main-module_message-box_alert__3K_Ml .main-module_message-box__icon__2N_H_::before,\n.main-module_message-box_error__Cbckk .main-module_message-box__icon__2N_H_::before {\n content: '\\E93E';\n color: #e60c54;\n}\n.main-module_message-box_alert__3K_Ml .main-module_message-box__header__9jQvW,\n.main-module_message-box_error__Cbckk .main-module_message-box__header__9jQvW {\n color: #e60c54;\n}\n.main-module_message-box_warning__3Gk_4 {\n background-color: #fff6cc;\n}\n.main-module_message-box_warning__3Gk_4 .main-module_message-box__icon__2N_H_::before {\n color: #fad961;\n}\n.main-module_message-box_success__1poUE {\n background-color: #c5e4da;\n}\n.main-module_message-box_success__1poUE .main-module_message-box__icon__2N_H_::before {\n content: '\\E93D';\n color: #4a456d;\n}\n.main-module_message-box_light__1AtoA {\n background-color: #ececec;\n}\n.main-module_message-box_full-width__PSXNS {\n width: 100%;\n}\n.main-module_message-box_arrow__2pC5G {\n border: 1px solid #e1e6f3;\n}\n.main-module_message-box_arrow__2pC5G::after,\n.main-module_message-box_arrow__2pC5G::before {\n content: '';\n display: block;\n position: absolute;\n border-style: solid;\n}\n.main-module_message-box_arrow__2pC5G::before {\n top: -14px;\n left: 7px;\n border-width: 7px;\n border-color: transparent transparent #e1e6f3 transparent;\n}\n.main-module_message-box_arrow__2pC5G::after {\n top: -10px;\n left: 9px;\n border-width: 5px;\n border-color: transparent transparent #ebeffa transparent;\n}\n.main-module_message-box_arrow-right__1hMSX::before {\n left: auto;\n right: 7px;\n}\n.main-module_message-box_arrow-right__1hMSX::after {\n left: auto;\n right: 9px;\n}\n.main-module_message-box_arrow__2pC5G.main-module_message-box_light__1AtoA::after {\n border-color: transparent transparent #ececec transparent;\n}\n.main-module_message-box_center__2M7Yr {\n justify-content: center;\n}\n.main-module_message-box__icon__2N_H_::before {\n display: inline-block;\n font-family: 'aurora-icons';\n font-style: normal;\n font-weight: normal;\n font-variant: normal;\n text-transform: none;\n line-height: inherit;\n text-decoration: none;\n position: relative;\n vertical-align: middle;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n font-size: 18px;\n font-size: 1.2857142857142858rem;\n color: #abb4cd;\n margin-right: 1rem;\n content: '\\E93C';\n}\n.main-module_message-box__icon__2N_H_::before::after {\n content: '';\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n}\n.main-module_message-box__icon_custom-icon__2lVfZ {\n display: flex;\n margin-right: 1rem;\n}\n.main-module_message-box__icon_custom-icon__2lVfZ::before {\n margin-right: 0;\n content: '';\n}\n.main-module_message-box__content__zxfHd {\n max-width: 909px;\n}\n.main-module_message-box__header__9jQvW {\n font-size: 16px;\n font-size: 1.1428571428571428rem;\n font-weight: 600;\n}\n.main-module_message-box__header__9jQvW:not(:last-child) {\n margin-bottom: 0.2rem;\n}\n@media screen and (max-width: 767px) {\n .main-module_message-box__2eSFA {\n justify-content: center;\n }\n .main-module_message-box__content__zxfHd {\n max-width: 100%;\n }\n}\n";
7
+ var css_248z = "/* font colors */\n/* actions */\n/* background */\n/* errors */\n/* borders */\n/* grid */\n/* scrollBar */\n/* sizes */\n/** Form Variables */\n/** Errors */\n.main-module_link__3TzzF {\n display: flex;\n align-items: center;\n gap: 0.25rem;\n margin-top: 0.25rem;\n color: #135cc8;\n text-decoration: none;\n}\n.main-module_link__3TzzF * {\n color: #135cc8;\n fill: #135cc8;\n}\n.main-module_link__3TzzF:hover {\n text-decoration: underline;\n -webkit-text-decoration-color: #135cc8;\n text-decoration-color: #135cc8;\n cursor: pointer;\n}\n.main-module_message-box__2eSFA {\n position: relative;\n display: flex;\n align-items: center;\n width: 100%;\n max-width: 100%;\n padding: 1rem;\n margin-left: auto;\n margin-right: auto;\n background-color: #ebeffa;\n border-radius: 3px;\n color: #2d3748;\n}\n.main-module_message-box__2eSFA:not(:last-child) {\n margin-bottom: 1rem;\n}\n.main-module_message-box__2eSFA a {\n display: flex;\n align-items: center;\n gap: 0.25rem;\n margin-top: 0.25rem;\n color: #135cc8;\n text-decoration: none;\n display: inline-flex;\n margin-top: 0;\n}\n.main-module_message-box__2eSFA a * {\n color: #135cc8;\n fill: #135cc8;\n}\n.main-module_message-box__2eSFA a:hover {\n text-decoration: underline;\n -webkit-text-decoration-color: #135cc8;\n text-decoration-color: #135cc8;\n cursor: pointer;\n}\n.main-module_message-box__2eSFA ul {\n padding-left: 20px;\n}\n.main-module_message-box__2eSFA ul li {\n list-style: disc;\n margin: 3px 0;\n}\n.main-module_message-box__2eSFA ul li:last-child {\n margin-bottom: 0;\n}\n.main-module_message-box_alert__3K_Ml,\n.main-module_message-box_error__Cbckk {\n background-color: #ffe6ea;\n}\n.main-module_message-box_alert__3K_Ml .main-module_message-box__icon__2N_H_::before,\n.main-module_message-box_error__Cbckk .main-module_message-box__icon__2N_H_::before {\n content: '\\E93E';\n color: #e60c54;\n}\n.main-module_message-box_alert__3K_Ml .main-module_message-box__header__9jQvW,\n.main-module_message-box_error__Cbckk .main-module_message-box__header__9jQvW {\n color: #e60c54;\n}\n.main-module_message-box_warning__3Gk_4 {\n background-color: #fff6cc;\n}\n.main-module_message-box_warning__3Gk_4 .main-module_message-box__icon__2N_H_::before {\n color: #fad961;\n}\n.main-module_message-box_success__1poUE {\n background-color: #c5e4da;\n}\n.main-module_message-box_success__1poUE .main-module_message-box__icon__2N_H_::before {\n content: '\\E93D';\n color: #4a456d;\n}\n.main-module_message-box_light__1AtoA {\n background-color: #ececec;\n}\n.main-module_message-box_full-width__PSXNS {\n width: 100%;\n}\n.main-module_message-box_arrow__2pC5G {\n border: 1px solid #e1e6f3;\n}\n.main-module_message-box_arrow__2pC5G::after,\n.main-module_message-box_arrow__2pC5G::before {\n content: '';\n display: block;\n position: absolute;\n border-style: solid;\n}\n.main-module_message-box_arrow__2pC5G::before {\n top: -14px;\n left: 7px;\n border-width: 7px;\n border-color: transparent transparent #e1e6f3 transparent;\n}\n.main-module_message-box_arrow__2pC5G::after {\n top: -10px;\n left: 9px;\n border-width: 5px;\n border-color: transparent transparent #ebeffa transparent;\n}\n.main-module_message-box_arrow-right__1hMSX::before {\n left: auto;\n right: 7px;\n}\n.main-module_message-box_arrow-right__1hMSX::after {\n left: auto;\n right: 9px;\n}\n.main-module_message-box_arrow__2pC5G.main-module_message-box_light__1AtoA::after {\n border-color: transparent transparent #ececec transparent;\n}\n.main-module_message-box_center__2M7Yr {\n justify-content: center;\n}\n.main-module_message-box__icon__2N_H_::before {\n display: inline-block;\n font-family: 'aurora-icons';\n font-style: normal;\n font-weight: normal;\n font-variant: normal;\n text-transform: none;\n line-height: inherit;\n text-decoration: none;\n position: relative;\n vertical-align: middle;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n font-size: 18px;\n font-size: 1.2857142857142858rem;\n color: #abb4cd;\n margin-right: 1rem;\n content: '\\E93C';\n}\n.main-module_message-box__icon__2N_H_::before::after {\n content: '';\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n}\n.main-module_message-box__icon_custom-icon__2lVfZ {\n display: flex;\n margin-right: 1rem;\n}\n.main-module_message-box__icon_custom-icon__2lVfZ::before {\n margin-right: 0;\n content: '';\n}\n.main-module_message-box__content__zxfHd {\n max-width: 909px;\n}\n.main-module_message-box__header__9jQvW {\n font-size: 16px;\n font-size: 1.1428571428571428rem;\n font-weight: 600;\n}\n.main-module_message-box__header__9jQvW:not(:last-child) {\n margin-bottom: 0.2rem;\n}\n@media screen and (max-width: 767px) {\n .main-module_message-box__2eSFA {\n justify-content: center;\n }\n .main-module_message-box__content__zxfHd {\n max-width: 100%;\n }\n}\n";
8
8
  var cssClasses = {"link":"main-module_link__3TzzF","message-box":"main-module_message-box__2eSFA","message-box_alert":"main-module_message-box_alert__3K_Ml","message-box_error":"main-module_message-box_error__Cbckk","message-box__icon":"main-module_message-box__icon__2N_H_","message-box__header":"main-module_message-box__header__9jQvW","message-box_warning":"main-module_message-box_warning__3Gk_4","message-box_success":"main-module_message-box_success__1poUE","message-box_light":"main-module_message-box_light__1AtoA","message-box_full-width":"main-module_message-box_full-width__PSXNS","message-box_arrow":"main-module_message-box_arrow__2pC5G","message-box_arrow-right":"main-module_message-box_arrow-right__1hMSX","message-box_center":"main-module_message-box_center__2M7Yr","message-box__icon_custom-icon":"main-module_message-box__icon_custom-icon__2lVfZ","message-box__content":"main-module_message-box__content__zxfHd"};
9
9
  styleInject_es['default'](css_248z);
10
10
 
package/build/cjs/packages/aurora/src/css/slide/main.module.less.js CHANGED
@@ -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@-webkit-keyframes main-module_directionLeftShow__1VVi1 {\n from {\n transform: translateX(100%);\n }\n to {\n transform: translateX(0);\n }\n}\n@keyframes main-module_directionLeftShow__1VVi1 {\n from {\n transform: translateX(100%);\n }\n to {\n transform: translateX(0);\n }\n}\n@-webkit-keyframes main-module_directionLeftHide__QSuRw {\n from {\n transform: translateX(0);\n }\n to {\n transform: translateX(100%);\n }\n}\n@keyframes main-module_directionLeftHide__QSuRw {\n from {\n transform: translateX(0);\n }\n to {\n transform: translateX(100%);\n }\n}\n.main-module_slide__1kcca {\n position: absolute;\n top: 0;\n height: 100%;\n background-color: #fff;\n -webkit-animation-fill-mode: both;\n animation-fill-mode: both;\n overflow-y: hidden;\n z-index: 1;\n}\n.main-module_slide__wrapper__3mC8j {\n display: flex;\n flex-direction: column;\n height: 100%;\n}\n.main-module_slide__header__11UTh {\n width: 100%;\n border-bottom: 1px solid #abb4cd;\n background-color: #fff;\n display: flex;\n align-items: center;\n box-shadow: 0 0 9px 0 rgba(16, 47, 102, 0.16);\n}\n.main-module_slide__content__3KeZM {\n flex: 1;\n overflow-x: hidden;\n overflow-y: scroll;\n}\n.main-module_slide__footer__3wvMP {\n padding: 1.5rem 1rem 1.5rem 1rem;\n background-color: #fff;\n border-top: 1px solid #abb4cd;\n box-shadow: 0 1px 5px 0 rgba(171, 180, 205, 0.6);\n}\n.main-module_slide_direction-left__Rg5kV {\n right: 0;\n left: 0;\n -webkit-animation-name: main-module_directionLeftHide__QSuRw;\n animation-name: main-module_directionLeftHide__QSuRw;\n}\n.main-module_slide_direction-left__Rg5kV.main-module_slide_is-open__3twK9 {\n -webkit-animation-name: main-module_directionLeftShow__1VVi1;\n animation-name: main-module_directionLeftShow__1VVi1;\n}\n";
7
+ var css_248z = "/* font colors */\n/* actions */\n/* background */\n/* errors */\n/* borders */\n/* grid */\n/* scrollBar */\n/* sizes */\n@-webkit-keyframes main-module_directionLeftShow__1VVi1 {\n from {\n transform: translateX(100%);\n }\n to {\n transform: translateX(0);\n }\n}\n@keyframes main-module_directionLeftShow__1VVi1 {\n from {\n transform: translateX(100%);\n }\n to {\n transform: translateX(0);\n }\n}\n@-webkit-keyframes main-module_directionLeftHide__QSuRw {\n from {\n transform: translateX(0);\n }\n to {\n transform: translateX(100%);\n }\n}\n@keyframes main-module_directionLeftHide__QSuRw {\n from {\n transform: translateX(0);\n }\n to {\n transform: translateX(100%);\n }\n}\n.main-module_slide__1kcca {\n position: absolute;\n top: 0;\n height: 100%;\n background-color: #fff;\n -webkit-animation-fill-mode: both;\n animation-fill-mode: both;\n overflow-y: hidden;\n z-index: 1;\n}\n.main-module_slide__wrapper__3mC8j {\n display: flex;\n flex-direction: column;\n height: 100%;\n}\n.main-module_slide__header__11UTh {\n width: 100%;\n border-bottom: 1px solid #abb4cd;\n background-color: #fff;\n display: flex;\n align-items: center;\n box-shadow: 0 0 9px 0 rgba(16, 47, 102, 0.16);\n}\n.main-module_slide__content__3KeZM {\n flex: 1;\n overflow-x: hidden;\n overflow-y: scroll;\n}\n.main-module_slide__footer__3wvMP {\n padding: 0.5rem 1rem 0.5rem 1rem;\n background-color: #f3f4f8;\n border-top: 1px solid #abb4cd;\n box-shadow: 0 1px 5px 0 rgba(171, 180, 205, 0.6);\n}\n.main-module_slide_direction-left__Rg5kV {\n right: 0;\n left: 0;\n -webkit-animation-name: main-module_directionLeftHide__QSuRw;\n animation-name: main-module_directionLeftHide__QSuRw;\n}\n.main-module_slide_direction-left__Rg5kV.main-module_slide_is-open__3twK9 {\n -webkit-animation-name: main-module_directionLeftShow__1VVi1;\n animation-name: main-module_directionLeftShow__1VVi1;\n}\n";
8
8
  var cssClasses = {"slide":"main-module_slide__1kcca","slide__wrapper":"main-module_slide__wrapper__3mC8j","slide__header":"main-module_slide__header__11UTh","slide__content":"main-module_slide__content__3KeZM","slide__footer":"main-module_slide__footer__3wvMP","slide_direction-left":"main-module_slide_direction-left__Rg5kV","directionLeftHide":"main-module_directionLeftHide__QSuRw","slide_is-open":"main-module_slide_is-open__3twK9","directionLeftShow":"main-module_directionLeftShow__1VVi1"};
9
9
  styleInject_es['default'](css_248z);
10
10
 
package/build/esm/packages/aurora/src/components/controls/components/errors_list.js CHANGED
@@ -3,7 +3,7 @@ import { cssControlsErrors, cssControlsErrorsList, cssControlsErrorsListItem } f
3
3
  import cssStyles from '../../../css/controls/main.module.less.js';
4
4
 
5
5
  const ErrorsList = ({ errors, id }) => {
6
- return errors ? (React.createElement("div", { className: cssStyles[cssControlsErrors] },
6
+ return (errors === null || errors === void 0 ? void 0 : errors.length) ? (React.createElement("div", { className: cssStyles[cssControlsErrors] },
7
7
  React.createElement("ul", { className: cssStyles[cssControlsErrorsList] }, errors.map((error, key) => (React.createElement("label", { htmlFor: id, key: `error-item-${id}-${key}` },
8
8
  React.createElement("li", { className: cssStyles[cssControlsErrorsListItem] }, error))))))) : null;
9
9
  };
package/build/esm/packages/aurora/src/components/controls/hoc/control_xhr_image_picker/index.js CHANGED
@@ -1,21 +1,24 @@
1
- import React from 'react';
1
+ import React, { useState } from 'react';
2
2
  import Control from '../../index.js';
3
3
  import Hint from '../../../hint/index.js';
4
4
  import XhrImagePicker from '../../../xhr_image_picker/index.js';
5
5
 
6
- const ControlXhrImagePicker = ({ url, label, isRequired, id, name, onChange, allowedExtensions, initialFile, className, errors, hint, labelAdditionalInfo, onUploaded
7
- // hasWidthInput,
8
- // widthInputPostfix,
9
- // widthInputLabel,
10
- // widthInputHint
11
- }) => {
12
- return (React.createElement(Control, { errors: errors, name: name, id: id },
6
+ const ControlXhrImagePicker = ({ url, label, isRequired, id, name, onChange, allowedExtensions, initialFile, className, errors, hint, labelAdditionalInfo, onUploaded, onImageSizeUpdated }) => {
7
+ const [controlErrors, setErrors] = useState(errors);
8
+ const handleControlError = (errors) => {
9
+ setErrors(errors);
10
+ };
11
+ const handleControlChange = (fileList) => {
12
+ setErrors(null);
13
+ onChange === null || onChange === void 0 ? void 0 : onChange(fileList);
14
+ };
15
+ return (React.createElement(Control, { errors: controlErrors, name: name, id: id },
13
16
  (label || hint) && (React.createElement(Control.Label, { id: id, isRequired: isRequired, additionalInfo: labelAdditionalInfo },
14
17
  label,
15
18
  hint && React.createElement(Hint, { hint: hint, spacingLeft: true }))),
16
19
  React.createElement(Control.Content, null,
17
20
  React.createElement(Control.Element, null,
18
- React.createElement(XhrImagePicker, { url: url, id: id, name: name, onChange: onChange, allowedExtensions: allowedExtensions, initialFile: initialFile, className: className, errors: errors, onUploaded: onUploaded }))),
21
+ React.createElement(XhrImagePicker, { url: url, id: id, name: name, onChange: handleControlChange, onError: handleControlError, allowedExtensions: allowedExtensions, initialFile: initialFile, className: className, errors: errors, onUploaded: onUploaded, onImageSizeUpdated: onImageSizeUpdated }))),
19
22
  React.createElement(Control.Errors, null)));
20
23
  };
21
24
 
package/build/esm/packages/aurora/src/components/controls/hoc/control_xhr_image_picker/index.js.map CHANGED
@@ -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;"}
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;"}
package/build/esm/packages/aurora/src/components/controls/types.d.ts CHANGED
@@ -5,7 +5,7 @@ import { IFilePicker } from "../file_picker/types";
5
5
  import { IRange } from "../range/types";
6
6
  import React from 'react';
7
7
  import { TVerticalPosition } from "../../typings/general";
8
- import { TImageSize } from "../image_picker/types";
8
+ import { IImagePicker, TImageSize } from "../image_picker/types";
9
9
  import { IRequestResponse } from '@dreamcommerce/star_core';
10
10
  export declare type TControlErrors = string[] | null | undefined;
11
11
  export interface IControlContext {
@@ -171,13 +171,13 @@ export interface IControlFilePicker extends IFilePicker, IControlCommonProps {
171
171
  name?: string;
172
172
  labelAdditionalInfo?: string | ReactNode;
173
173
  }
174
- export interface IControlXhrImagePicker extends IFilePicker, IControlCommonProps {
174
+ export interface IControlXhrImagePicker extends IImagePicker, IControlCommonProps {
175
175
  url: string;
176
176
  label?: string;
177
177
  isRequired?: boolean;
178
178
  onChange?: (fileList: FileList | null, size?: TImageSize) => void;
179
179
  labelAdditionalInfo?: string | ReactNode;
180
- onUploaded?: (resp: IRequestResponse<any>, file: File, size: TImageSize) => void;
180
+ onUploaded?: (resp: IRequestResponse<any>, file: File) => void;
181
181
  }
182
182
  export interface ICellSelector {
183
183
  rows?: number;
package/build/esm/packages/aurora/src/components/controls/types.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../../../../src/components/controls/types.ts"],"names":[],"mappings":"AAAA,OAA0G,OAAO,CAAC;AAClH,OAAgD,kCAAkC,CAAC;AAEnF,OAAkC,sCAAsC,CAAC;AACzE,OAA4B,qCAAqC,CAAC;AAClE,OAAuB,+BAA+B,CAAC;AACvD,OAAkB,OAAO,CAAC;AAC1B,OAAkC,wBAAwB,CAAC;AAC3D,OAA2B,sCAAsC,CAAC;AAClE,OAAiC,0BAA0B,CAAC"}
1
+ {"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../../../../src/components/controls/types.ts"],"names":[],"mappings":"AAAA,OAA0G,OAAO,CAAC;AAClH,OAAgD,kCAAkC,CAAC;AAEnF,OAAkC,sCAAsC,CAAC;AACzE,OAA4B,qCAAqC,CAAC;AAClE,OAAuB,+BAA+B,CAAC;AACvD,OAAkB,OAAO,CAAC;AAC1B,OAAkC,wBAAwB,CAAC;AAC3D,OAAyC,sCAAsC,CAAC;AAChF,OAAiC,0BAA0B,CAAC"}
package/build/esm/packages/aurora/src/components/file_picker/types.d.ts CHANGED
@@ -13,6 +13,7 @@ export interface IFilePicker {
13
13
  allowedExtensions?: TFilesExtension[];
14
14
  initialFile?: TFilePickerFile;
15
15
  errors?: TControlErrors;
16
+ onError?: (errors: string[]) => void;
16
17
  }
17
18
  export interface ISelectedFilePreview {
18
19
  file: TFilePickerFile | null;
@@ -46,6 +47,7 @@ export interface IUseFilePickerProps {
46
47
  allowedExtensions?: TFilesExtension[];
47
48
  inputRef: React.RefObject<HTMLInputElement>;
48
49
  initialErrors?: TControlErrors;
50
+ onError?: (errors: string[]) => void;
49
51
  }
50
52
  export declare type TFilesExtension = typeof FILES_EXTENSIONS[keyof typeof FILES_EXTENSIONS];
51
53
  export declare type TMimeFileExtension = typeof MIME_FILE_EXTENSIONS[keyof typeof MIME_FILE_EXTENSIONS];
package/build/esm/packages/aurora/src/components/file_picker/use_file_picker.d.ts CHANGED
@@ -1,2 +1,2 @@
1
1
  import { IUseFilePicker, IUseFilePickerProps } from "./types";
2
- export declare const useFilePicker: ({ onChange, initialFile, allowedExtensions, inputRef, initialErrors }: IUseFilePickerProps) => IUseFilePicker;
2
+ export declare const useFilePicker: ({ onChange, initialFile, allowedExtensions, inputRef, initialErrors, onError }: IUseFilePickerProps) => IUseFilePicker;
package/build/esm/packages/aurora/src/components/file_picker/use_file_picker.js CHANGED
@@ -1,15 +1,12 @@
1
- import { useState, useEffect } from 'react';
1
+ import { useState } from 'react';
2
2
  import i18n from '../../i18n.js';
3
3
  import { MIME_TYPE_TO_FILE_EXTENSIONS, FILE_PICKER_ERROR } from './constants.js';
4
4
 
5
- const useFilePicker = ({ onChange, initialFile, allowedExtensions, inputRef, initialErrors }) => {
5
+ const useFilePicker = ({ onChange, initialFile, allowedExtensions, inputRef, initialErrors, onError }) => {
6
6
  const [file, setFile] = useState(initialFile);
7
7
  const [errors, setErrors] = useState(initialErrors !== null && initialErrors !== void 0 ? initialErrors : []);
8
8
  const [isDragOver, setDragOver] = useState(false);
9
9
  const [isPreview, setPreview] = useState(true);
10
- useEffect(() => {
11
- setFile(initialFile);
12
- }, [initialFile]);
13
10
  const onDropFile = (event) => {
14
11
  setErrors([]);
15
12
  event.stopPropagation();
@@ -23,16 +20,17 @@ const useFilePicker = ({ onChange, initialFile, allowedExtensions, inputRef, ini
23
20
  };
24
21
  const validateFileExtension = (allowedExtensions, mimeType) => {
25
22
  if (!allowedExtensions)
26
- return;
23
+ return true;
27
24
  const isValid = allowedExtensions.reduce((acc, extension) => {
28
- console.log('extension', extension);
29
- console.log('MIME_TYPE_TO_FILE_EXTENSIONS', MIME_TYPE_TO_FILE_EXTENSIONS);
30
- console.log('MIME_TYPE_TO_FILE_EXTENSIONS[mimeType]', MIME_TYPE_TO_FILE_EXTENSIONS[mimeType]);
31
25
  return acc ? acc : MIME_TYPE_TO_FILE_EXTENSIONS[mimeType] === extension;
32
26
  }, false);
33
- console.log('isValid', isValid);
34
- console.log('mimeType', mimeType);
35
- !isValid ? setErrors([...errors, i18n.t(FILE_PICKER_ERROR.invalidFileFormat)]) : setErrors([]);
27
+ if (isValid) {
28
+ setErrors([]);
29
+ return isValid;
30
+ }
31
+ setErrors([...errors, i18n.t(FILE_PICKER_ERROR.invalidFileFormat)]);
32
+ onError === null || onError === void 0 ? void 0 : onError(errors);
33
+ return isValid;
36
34
  };
37
35
  const onFileChange = ({ target: { files } }) => {
38
36
  setErrors([]);
@@ -44,13 +42,15 @@ const useFilePicker = ({ onChange, initialFile, allowedExtensions, inputRef, ini
44
42
  fileName: files === null || files === void 0 ? void 0 : files[0].name,
45
43
  fileUrl: URL.createObjectURL(files === null || files === void 0 ? void 0 : files[0])
46
44
  });
47
- 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);
48
48
  }
49
49
  else {
50
50
  setFile(undefined);
51
+ onChange === null || onChange === void 0 ? void 0 : onChange(files);
51
52
  }
52
53
  setPreview(true);
53
- onChange === null || onChange === void 0 ? void 0 : onChange(files);
54
54
  };
55
55
  const onDragOver = (event) => {
56
56
  event.stopPropagation();
package/build/esm/packages/aurora/src/components/image_picker/components/image_input.js CHANGED
@@ -10,12 +10,12 @@ const ImageInput = ({ id, onDropFile, onDragOver, onDragLeave, allowedExtensions
10
10
  return (React.createElement("label", { htmlFor: id, onDrop: onDropFile, onDragOver: onDragOver, onDragLeave: onDragLeave, className: styles[CSS_CLASSES.imagePickerLabel] },
11
11
  React.createElement("div", { className: styles[CSS_CLASSES.imagePickerDescription] },
12
12
  React.createElement(IconUpload, { className: styles[CSS_CLASSES.imagePickerUploadIcon] }),
13
- React.createElement("p", null, t('Drag a file here or browse')),
14
- React.createElement("span", null,
13
+ React.createElement("div", null, t('Drag a file here or browse')),
14
+ React.createElement("span", { className: styles[CSS_CLASSES.imagePickerSupportedFormats] },
15
15
  "(",
16
16
  t('supported format'),
17
17
  ": ",
18
- allowedExtensions.join(', '),
18
+ allowedExtensions.map((extension) => `*.${extension}`).join(', '),
19
19
  ")"))));
20
20
  };
21
21
  var ImageInput$1 = withTranslation(ImageInput);
package/build/esm/packages/aurora/src/components/image_picker/css_classes.d.ts CHANGED
@@ -17,5 +17,6 @@ declare const _default: {
17
17
  imagePickerSelectedFile: string;
18
18
  imagePickerSelectedFileNameWrapper: string;
19
19
  imagePickerSelectedFileRemoveWrapper: string;
20
+ imagePickerSupportedFormats: string;
20
21
  };
21
22
  export default _default;
package/build/esm/packages/aurora/src/components/image_picker/css_classes.js CHANGED
@@ -17,7 +17,8 @@ var CSS_CLASSES = {
17
17
  imagePickerInput: `${imagePicker}__input`,
18
18
  imagePickerSelectedFile: `${imagePicker}__selected-file`,
19
19
  imagePickerSelectedFileNameWrapper: `${imagePicker}__selected-file-name-wrapper`,
20
- imagePickerSelectedFileRemoveWrapper: `${imagePicker}__selected-file-remove-wrapper`
20
+ imagePickerSelectedFileRemoveWrapper: `${imagePicker}__selected-file-remove-wrapper`,
21
+ imagePickerSupportedFormats: `${imagePicker}__supported-formats`
21
22
  };
22
23
 
23
24
  export default CSS_CLASSES;
package/build/esm/packages/aurora/src/components/image_picker/css_classes.js.map CHANGED
@@ -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;"}
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;"}
package/build/esm/packages/aurora/src/components/image_picker/index.js CHANGED
@@ -1,4 +1,4 @@
1
- import React, { createRef, useState } from 'react';
1
+ import React, { createRef, useState, useEffect } from 'react';
2
2
  import { useTranslation } from '../../../../../external/react-i18next/dist/es/useTranslation.js';
3
3
  import { createUseStyles } from '../../../../../external/react-jss/dist/react-jss.esm.js';
4
4
  import classnames from 'classnames';
@@ -12,28 +12,19 @@ import ImageInput from './components/image_input.js';
12
12
  import { ImagePreview } from './components/image_preview.js';
13
13
  import { UploadedImageItem } from './components/uploaded_image_item.js';
14
14
 
15
- const ImagePicker = ({ id, onChange, errors: initialErrors, allowedExtensions = [FILES_EXTENSIONS.WEBP, FILES_EXTENSIONS.JPG, FILES_EXTENSIONS.PNG, FILES_EXTENSIONS.GIF, FILES_EXTENSIONS.SVG], initialFile, name, className = ''
16
- // hasWidthInput,
17
- // widthInputPostfix = 'px',
18
- // widthInputLabel,
19
- // widthInputHint
20
- }) => {
15
+ const ImagePicker = ({ id, onChange, onError, errors: initialErrors, allowedExtensions = [FILES_EXTENSIONS.WEBP, FILES_EXTENSIONS.JPG, FILES_EXTENSIONS.PNG, FILES_EXTENSIONS.GIF, FILES_EXTENSIONS.SVG], initialFile, name, className = '', onImageSizeUpdated }) => {
21
16
  const [t] = useTranslation();
22
17
  const inputRef = createRef();
23
- // const [fileFormatIsCorrect, setFileFormatIsCorrect] = useState<boolean>(true);
24
18
  const [imageSize, setImageSize] = useState(undefined);
25
- // const [widthInputValue, setWidthInputValue] = useState<number | undefined>();
26
- // const [isInputWidthTooBig, setIsInputWidthTooBig] = useState<boolean>(false);
27
- const onImageFileChange = (files) => {
28
- onChange === null || onChange === void 0 ? void 0 : onChange(files, imageSize);
29
- };
30
- const { onDropFile, onFileChange, onDragOver, onDragLeave, onFileDelete, onPreviewError, file, errors, isPreview, isDragOver } = useFilePicker({ initialFile, onChange: onImageFileChange, allowedExtensions, initialErrors, inputRef });
19
+ const { onDropFile, onFileChange, onDragOver, onDragLeave, onFileDelete, onPreviewError, file, errors, isPreview, isDragOver } = useFilePicker({ initialFile, onChange, allowedExtensions, initialErrors, onError, inputRef });
31
20
  const acceptFiles = getAcceptFilesParametersFromAllowedExtensions(allowedExtensions);
32
- // const showMaxWidthInput = hasWidthInput && file && fileFormatIsCorrect && !isVectorImage;
33
21
  const imagePickerClassName = classnames(styles[CSS_CLASSES.imagePicker], className && className);
34
22
  const imagePickerWrapperClassName = classnames(styles[CSS_CLASSES.imagePickerWrapper], file && styles[CSS_CLASSES.imagePickerWrapperHasFile], {
35
23
  [styles[CSS_CLASSES.imagePickerWrapperError]]: errors.length
36
24
  });
25
+ useEffect(() => {
26
+ onImageSizeUpdated === null || onImageSizeUpdated === void 0 ? void 0 : onImageSizeUpdated(imageSize);
27
+ }, [imageSize]);
37
28
  const useStyles = createUseStyles({
38
29
  imagePickerWrapper: {
39
30
  border: ({ isDragOver }) => (isDragOver ? '1px solid #135cc8' : ''),
@@ -45,62 +36,14 @@ const ImagePicker = ({ id, onChange, errors: initialErrors, allowedExtensions =
45
36
  }
46
37
  });
47
38
  const dragOverStyles = useStyles({ isDragOver });
48
- // const getImageWidth = (event: any) => {
49
- // let selectedImage;
50
- //
51
- // if (event.target instanceof HTMLInputElement) {
52
- // const {
53
- // target: { files }
54
- // } = event;
55
- // selectedImage = files[0];
56
- // } else {
57
- // const {
58
- // dataTransfer: { files }
59
- // } = event;
60
- // selectedImage = files[0];
61
- // }
62
- //
63
- // const imgElement = document.createElement('img');
64
- // const objectURL = URL.createObjectURL(selectedImage);
65
- //
66
- // imgElement.onload = () => {
67
- // setImageSize({ width: imgElement.width, height: imgElement.height });
68
- // URL.revokeObjectURL(objectURL);
69
- // };
70
- //
71
- // imgElement.src = objectURL;
72
- // };
73
39
  const handlePreviewLoaded = (event) => {
74
40
  const $image = event.target;
75
41
  setImageSize({ width: $image.width, height: $image.height });
76
42
  };
77
- // const checkIfInputMaxWidthIsGreaterThenImageWidth = (): void => {
78
- // if (!widthInputValue || !imageSize.width) return;
79
- // widthInputValue > imageSize.width ? setIsInputWidthTooBig(true) : setIsInputWidthTooBig(false);
80
- // };
81
- // const handleOnDropFile = (event: React.DragEvent<HTMLLabelElement>) => {
82
- // onDropFile(event);
83
- // // getImageWidth(event);
84
- // };
85
- //
86
- // const handleOnFileChange = (event: React.ChangeEvent<HTMLInputElement>) => {
87
- // onFileChange(event);
88
- // // getImageWidth(event);
89
- // };
90
43
  const handleOnFileDelete = () => {
91
44
  setImageSize(undefined);
92
45
  onFileDelete();
93
46
  };
94
- // const handleOnWidthInputChange = (event: React.ChangeEvent<HTMLInputElement>) => {
95
- // setWidthInputValue(event.target.valueAsNumber);
96
- // };
97
- // useEffect(() => {
98
- // // checkIfInvalideFileFormatErrorOccured(errors) ? setFileFormatIsCorrect(false) : setFileFormatIsCorrect(true);
99
- // // file && checkIfInputMaxWidthIsGreaterThenImageWidth();
100
- // }, [errors, file, widthInputValue]);
101
- // useEffect(() => {
102
- // setWidthInputValue(imageSize.width);
103
- // }, [imageSize]);
104
47
  return (React.createElement("div", { className: imagePickerClassName },
105
48
  React.createElement("div", { className: `${imagePickerWrapperClassName} ${dragOverStyles.imagePickerWrapper}` },
106
49
  file &&
package/build/esm/packages/aurora/src/components/image_picker/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA,+BAA+B,iEAAqE;AACpG,gCAAgC,yDAA6D;AAC7F;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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,+BAA+B,iEAAqE;AACpG,gCAAgC,yDAA6D;AAC7F;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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/types.d.ts CHANGED
@@ -4,8 +4,8 @@ export declare type TImagePickerFile = {
4
4
  fileUrl: string;
5
5
  fileName: string;
6
6
  };
7
- export interface IImagePicker extends Omit<IFilePicker, 'onChange'> {
8
- onChange?: (fileList: FileList | null, imageSize?: TImageSize) => void;
7
+ export interface IImagePicker extends IFilePicker {
8
+ onImageSizeUpdated?: (imageSize?: TImageSize) => void;
9
9
  }
10
10
  export interface ISelectedImagePreview {
11
11
  file: TImagePickerFile;
package/build/esm/packages/aurora/src/components/message-box/index.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- import React from 'react';
2
1
  import { IMessageBox } from './types';
2
+ import React from 'react';
3
3
  declare const MessageBox: React.FC<IMessageBox>;
4
4
  export default MessageBox;
package/build/esm/packages/aurora/src/components/message-box/index.js CHANGED
@@ -5,7 +5,7 @@ import cssClasses from '../../css/message-box/main.module.less.js';
5
5
  const MessageBox = ({ children, header, type, withoutIcon, fullWidth, className }) => {
6
6
  const messageBoxClassName = classNames([className, 'message-box', type && `message-box_${type}`, fullWidth && `message-box_full-width`], cssClasses);
7
7
  return (React.createElement("div", { className: messageBoxClassName },
8
- !withoutIcon && React.createElement("div", { className: cssClasses['message-box__icon'] }),
8
+ !withoutIcon && type !== 'blank' && React.createElement("div", { className: cssClasses['message-box__icon'] }),
9
9
  React.createElement("div", { className: cssClasses['message-box__content'] },
10
10
  header && React.createElement("h4", { className: cssClasses['message-box__header'] }, header),
11
11
  children)));
package/build/esm/packages/aurora/src/components/message-box/types.d.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  /// <reference types="react" />
2
- export declare type TMessageBoxType = 'success' | 'alert' | 'warning' | 'light';
2
+ export declare type TMessageBoxType = 'success' | 'alert' | 'warning' | 'light' | 'blank';
3
3
  export interface IMessageBox {
4
4
  type?: TMessageBoxType;
5
5
  header?: string;
package/build/esm/packages/aurora/src/components/xhr_image_picker/index.js CHANGED
@@ -1,21 +1,33 @@
1
- import React from 'react';
1
+ import React, { useEffect } from 'react';
2
2
  import { FILES_EXTENSIONS } from '../file_picker/constants.js';
3
3
  import { REQUEST_TYPES } from '../../../../star_core/build/esm/packages/star_core/src/features/http_requester/http_requester_contants.js';
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, 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
- const onChange = async (fileList, imageSize) => {
10
- const { response } = httpApi.fetch({
9
+ const pendingRequestRef = React.useRef();
10
+ const handleControlChange = async (fileList) => {
11
+ onChange === null || onChange === void 0 ? void 0 : onChange(fileList);
12
+ if (!fileList || !fileList.length)
13
+ return;
14
+ if (pendingRequestRef.current) {
15
+ pendingRequestRef.current();
16
+ pendingRequestRef.current = undefined;
17
+ }
18
+ const { response, cancelRequest } = httpApi.fetch({
11
19
  url,
12
20
  method: REQUEST_TYPES.post,
13
21
  data: fileList[0]
14
22
  });
23
+ pendingRequestRef.current = cancelRequest;
15
24
  const data = await response;
16
- onUploaded === null || onUploaded === void 0 ? void 0 : onUploaded(data, fileList[0], imageSize);
25
+ onUploaded === null || onUploaded === void 0 ? void 0 : onUploaded(data, fileList[0]);
17
26
  };
18
- return (React.createElement(ImagePicker, { id: id, name: name, onChange: onChange, errors: errors, allowedExtensions: allowedExtensions, initialFile: initialFile }));
27
+ useEffect(() => {
28
+ return () => { var _a; return (_a = pendingRequestRef.current) === null || _a === void 0 ? void 0 : _a.call(pendingRequestRef); };
29
+ }, []);
30
+ return (React.createElement(ImagePicker, { id: id, name: name, onChange: handleControlChange, onError: onError, errors: errors, allowedExtensions: allowedExtensions, initialFile: initialFile, onImageSizeUpdated: onImageSizeUpdated }));
19
31
  };
20
32
 
21
33
  export default XhrImagePicker;
package/build/esm/packages/aurora/src/components/xhr_image_picker/index.js.map CHANGED
@@ -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;"}
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;"}
package/build/esm/packages/aurora/src/components/xhr_image_picker/types.d.ts CHANGED
@@ -1,7 +1,7 @@
1
- import { IImagePicker, TImageSize } from "../image_picker/types";
1
+ import { IImagePicker } from "../image_picker/types";
2
2
  import { IRequestResponse } from '@dreamcommerce/star_core';
3
3
  export interface IXhrImagePickerProps extends IImagePicker {
4
4
  url: string;
5
- onUploaded?: (resp: IRequestResponse<any>, file: File, imageSize: TImageSize) => void;
5
+ onUploaded?: (resp: IRequestResponse<any>, file: File) => void;
6
6
  onUploadError?: Function;
7
7
  }
package/build/esm/packages/aurora/src/components/xhr_image_picker/types.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../../../../src/components/xhr_image_picker/types.ts"],"names":[],"mappings":"AAAA,OAAyC,sCAAsC,CAAC;AAChF,OAAiC,0BAA0B,CAAC"}
1
+ {"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../../../../src/components/xhr_image_picker/types.ts"],"names":[],"mappings":"AAAA,OAA6B,sCAAsC,CAAC;AACpE,OAAiC,0BAA0B,CAAC"}
package/build/esm/packages/aurora/src/css/image_picker/main.module.less.js CHANGED
@@ -1,7 +1,7 @@
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}\n.main-module_image-picker__description__1v13N p {\n color: #3c83ec;\n}\n.main-module_image-picker__description__1v13N span {\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__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
- 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__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"};
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
+ 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
 
7
7
  export default styles;
package/build/esm/packages/aurora/src/css/message-box/main.module.less.js CHANGED
@@ -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/** Form Variables */\n/** Errors */\n.main-module_link__3TzzF {\n display: flex;\n align-items: center;\n gap: 0.25rem;\n margin-top: 0.25rem;\n color: #135cc8;\n text-decoration: none;\n}\n.main-module_link__3TzzF * {\n color: #135cc8;\n fill: #135cc8;\n}\n.main-module_link__3TzzF:hover {\n text-decoration: underline;\n -webkit-text-decoration-color: #135cc8;\n text-decoration-color: #135cc8;\n cursor: pointer;\n}\n.main-module_message-box__2eSFA {\n position: relative;\n display: flex;\n align-items: center;\n width: 100%;\n max-width: 100%;\n padding: 1rem;\n margin-left: auto;\n margin-right: auto;\n background-color: #ebeffa;\n border-radius: 3px;\n color: #2d3748;\n}\n.main-module_message-box__2eSFA:not(:last-child) {\n margin-bottom: 1rem;\n}\n.main-module_message-box__2eSFA a {\n display: flex;\n align-items: center;\n gap: 0.25rem;\n margin-top: 0.25rem;\n color: #135cc8;\n text-decoration: none;\n display: inline-flex;\n margin-top: 0;\n}\n.main-module_message-box__2eSFA a * {\n color: #135cc8;\n fill: #135cc8;\n}\n.main-module_message-box__2eSFA a:hover {\n text-decoration: underline;\n -webkit-text-decoration-color: #135cc8;\n text-decoration-color: #135cc8;\n cursor: pointer;\n}\n.main-module_message-box_alert__3K_Ml,\n.main-module_message-box_error__Cbckk {\n background-color: #ffe6ea;\n}\n.main-module_message-box_alert__3K_Ml .main-module_message-box__icon__2N_H_::before,\n.main-module_message-box_error__Cbckk .main-module_message-box__icon__2N_H_::before {\n content: '\\E93E';\n color: #e60c54;\n}\n.main-module_message-box_alert__3K_Ml .main-module_message-box__header__9jQvW,\n.main-module_message-box_error__Cbckk .main-module_message-box__header__9jQvW {\n color: #e60c54;\n}\n.main-module_message-box_warning__3Gk_4 {\n background-color: #fff6cc;\n}\n.main-module_message-box_warning__3Gk_4 .main-module_message-box__icon__2N_H_::before {\n color: #fad961;\n}\n.main-module_message-box_success__1poUE {\n background-color: #c5e4da;\n}\n.main-module_message-box_success__1poUE .main-module_message-box__icon__2N_H_::before {\n content: '\\E93D';\n color: #4a456d;\n}\n.main-module_message-box_light__1AtoA {\n background-color: #ececec;\n}\n.main-module_message-box_full-width__PSXNS {\n width: 100%;\n}\n.main-module_message-box_arrow__2pC5G {\n border: 1px solid #e1e6f3;\n}\n.main-module_message-box_arrow__2pC5G::after,\n.main-module_message-box_arrow__2pC5G::before {\n content: '';\n display: block;\n position: absolute;\n border-style: solid;\n}\n.main-module_message-box_arrow__2pC5G::before {\n top: -14px;\n left: 7px;\n border-width: 7px;\n border-color: transparent transparent #e1e6f3 transparent;\n}\n.main-module_message-box_arrow__2pC5G::after {\n top: -10px;\n left: 9px;\n border-width: 5px;\n border-color: transparent transparent #ebeffa transparent;\n}\n.main-module_message-box_arrow-right__1hMSX::before {\n left: auto;\n right: 7px;\n}\n.main-module_message-box_arrow-right__1hMSX::after {\n left: auto;\n right: 9px;\n}\n.main-module_message-box_arrow__2pC5G.main-module_message-box_light__1AtoA::after {\n border-color: transparent transparent #ececec transparent;\n}\n.main-module_message-box_center__2M7Yr {\n justify-content: center;\n}\n.main-module_message-box__icon__2N_H_::before {\n display: inline-block;\n font-family: 'aurora-icons';\n font-style: normal;\n font-weight: normal;\n font-variant: normal;\n text-transform: none;\n line-height: inherit;\n text-decoration: none;\n position: relative;\n vertical-align: middle;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n font-size: 18px;\n font-size: 1.2857142857142858rem;\n color: #abb4cd;\n margin-right: 1rem;\n content: '\\E93C';\n}\n.main-module_message-box__icon__2N_H_::before::after {\n content: '';\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n}\n.main-module_message-box__icon_custom-icon__2lVfZ {\n display: flex;\n margin-right: 1rem;\n}\n.main-module_message-box__icon_custom-icon__2lVfZ::before {\n margin-right: 0;\n content: '';\n}\n.main-module_message-box__content__zxfHd {\n max-width: 909px;\n}\n.main-module_message-box__header__9jQvW {\n font-size: 16px;\n font-size: 1.1428571428571428rem;\n font-weight: 600;\n}\n.main-module_message-box__header__9jQvW:not(:last-child) {\n margin-bottom: 0.2rem;\n}\n@media screen and (max-width: 767px) {\n .main-module_message-box__2eSFA {\n justify-content: center;\n }\n .main-module_message-box__content__zxfHd {\n max-width: 100%;\n }\n}\n";
3
+ var css_248z = "/* font colors */\n/* actions */\n/* background */\n/* errors */\n/* borders */\n/* grid */\n/* scrollBar */\n/* sizes */\n/** Form Variables */\n/** Errors */\n.main-module_link__3TzzF {\n display: flex;\n align-items: center;\n gap: 0.25rem;\n margin-top: 0.25rem;\n color: #135cc8;\n text-decoration: none;\n}\n.main-module_link__3TzzF * {\n color: #135cc8;\n fill: #135cc8;\n}\n.main-module_link__3TzzF:hover {\n text-decoration: underline;\n -webkit-text-decoration-color: #135cc8;\n text-decoration-color: #135cc8;\n cursor: pointer;\n}\n.main-module_message-box__2eSFA {\n position: relative;\n display: flex;\n align-items: center;\n width: 100%;\n max-width: 100%;\n padding: 1rem;\n margin-left: auto;\n margin-right: auto;\n background-color: #ebeffa;\n border-radius: 3px;\n color: #2d3748;\n}\n.main-module_message-box__2eSFA:not(:last-child) {\n margin-bottom: 1rem;\n}\n.main-module_message-box__2eSFA a {\n display: flex;\n align-items: center;\n gap: 0.25rem;\n margin-top: 0.25rem;\n color: #135cc8;\n text-decoration: none;\n display: inline-flex;\n margin-top: 0;\n}\n.main-module_message-box__2eSFA a * {\n color: #135cc8;\n fill: #135cc8;\n}\n.main-module_message-box__2eSFA a:hover {\n text-decoration: underline;\n -webkit-text-decoration-color: #135cc8;\n text-decoration-color: #135cc8;\n cursor: pointer;\n}\n.main-module_message-box__2eSFA ul {\n padding-left: 20px;\n}\n.main-module_message-box__2eSFA ul li {\n list-style: disc;\n margin: 3px 0;\n}\n.main-module_message-box__2eSFA ul li:last-child {\n margin-bottom: 0;\n}\n.main-module_message-box_alert__3K_Ml,\n.main-module_message-box_error__Cbckk {\n background-color: #ffe6ea;\n}\n.main-module_message-box_alert__3K_Ml .main-module_message-box__icon__2N_H_::before,\n.main-module_message-box_error__Cbckk .main-module_message-box__icon__2N_H_::before {\n content: '\\E93E';\n color: #e60c54;\n}\n.main-module_message-box_alert__3K_Ml .main-module_message-box__header__9jQvW,\n.main-module_message-box_error__Cbckk .main-module_message-box__header__9jQvW {\n color: #e60c54;\n}\n.main-module_message-box_warning__3Gk_4 {\n background-color: #fff6cc;\n}\n.main-module_message-box_warning__3Gk_4 .main-module_message-box__icon__2N_H_::before {\n color: #fad961;\n}\n.main-module_message-box_success__1poUE {\n background-color: #c5e4da;\n}\n.main-module_message-box_success__1poUE .main-module_message-box__icon__2N_H_::before {\n content: '\\E93D';\n color: #4a456d;\n}\n.main-module_message-box_light__1AtoA {\n background-color: #ececec;\n}\n.main-module_message-box_full-width__PSXNS {\n width: 100%;\n}\n.main-module_message-box_arrow__2pC5G {\n border: 1px solid #e1e6f3;\n}\n.main-module_message-box_arrow__2pC5G::after,\n.main-module_message-box_arrow__2pC5G::before {\n content: '';\n display: block;\n position: absolute;\n border-style: solid;\n}\n.main-module_message-box_arrow__2pC5G::before {\n top: -14px;\n left: 7px;\n border-width: 7px;\n border-color: transparent transparent #e1e6f3 transparent;\n}\n.main-module_message-box_arrow__2pC5G::after {\n top: -10px;\n left: 9px;\n border-width: 5px;\n border-color: transparent transparent #ebeffa transparent;\n}\n.main-module_message-box_arrow-right__1hMSX::before {\n left: auto;\n right: 7px;\n}\n.main-module_message-box_arrow-right__1hMSX::after {\n left: auto;\n right: 9px;\n}\n.main-module_message-box_arrow__2pC5G.main-module_message-box_light__1AtoA::after {\n border-color: transparent transparent #ececec transparent;\n}\n.main-module_message-box_center__2M7Yr {\n justify-content: center;\n}\n.main-module_message-box__icon__2N_H_::before {\n display: inline-block;\n font-family: 'aurora-icons';\n font-style: normal;\n font-weight: normal;\n font-variant: normal;\n text-transform: none;\n line-height: inherit;\n text-decoration: none;\n position: relative;\n vertical-align: middle;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n font-size: 18px;\n font-size: 1.2857142857142858rem;\n color: #abb4cd;\n margin-right: 1rem;\n content: '\\E93C';\n}\n.main-module_message-box__icon__2N_H_::before::after {\n content: '';\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n}\n.main-module_message-box__icon_custom-icon__2lVfZ {\n display: flex;\n margin-right: 1rem;\n}\n.main-module_message-box__icon_custom-icon__2lVfZ::before {\n margin-right: 0;\n content: '';\n}\n.main-module_message-box__content__zxfHd {\n max-width: 909px;\n}\n.main-module_message-box__header__9jQvW {\n font-size: 16px;\n font-size: 1.1428571428571428rem;\n font-weight: 600;\n}\n.main-module_message-box__header__9jQvW:not(:last-child) {\n margin-bottom: 0.2rem;\n}\n@media screen and (max-width: 767px) {\n .main-module_message-box__2eSFA {\n justify-content: center;\n }\n .main-module_message-box__content__zxfHd {\n max-width: 100%;\n }\n}\n";
4
4
  var cssClasses = {"link":"main-module_link__3TzzF","message-box":"main-module_message-box__2eSFA","message-box_alert":"main-module_message-box_alert__3K_Ml","message-box_error":"main-module_message-box_error__Cbckk","message-box__icon":"main-module_message-box__icon__2N_H_","message-box__header":"main-module_message-box__header__9jQvW","message-box_warning":"main-module_message-box_warning__3Gk_4","message-box_success":"main-module_message-box_success__1poUE","message-box_light":"main-module_message-box_light__1AtoA","message-box_full-width":"main-module_message-box_full-width__PSXNS","message-box_arrow":"main-module_message-box_arrow__2pC5G","message-box_arrow-right":"main-module_message-box_arrow-right__1hMSX","message-box_center":"main-module_message-box_center__2M7Yr","message-box__icon_custom-icon":"main-module_message-box__icon_custom-icon__2lVfZ","message-box__content":"main-module_message-box__content__zxfHd"};
5
5
  styleInject(css_248z);
6
6
 
package/build/esm/packages/aurora/src/css/slide/main.module.less.js CHANGED
@@ -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@-webkit-keyframes main-module_directionLeftShow__1VVi1 {\n from {\n transform: translateX(100%);\n }\n to {\n transform: translateX(0);\n }\n}\n@keyframes main-module_directionLeftShow__1VVi1 {\n from {\n transform: translateX(100%);\n }\n to {\n transform: translateX(0);\n }\n}\n@-webkit-keyframes main-module_directionLeftHide__QSuRw {\n from {\n transform: translateX(0);\n }\n to {\n transform: translateX(100%);\n }\n}\n@keyframes main-module_directionLeftHide__QSuRw {\n from {\n transform: translateX(0);\n }\n to {\n transform: translateX(100%);\n }\n}\n.main-module_slide__1kcca {\n position: absolute;\n top: 0;\n height: 100%;\n background-color: #fff;\n -webkit-animation-fill-mode: both;\n animation-fill-mode: both;\n overflow-y: hidden;\n z-index: 1;\n}\n.main-module_slide__wrapper__3mC8j {\n display: flex;\n flex-direction: column;\n height: 100%;\n}\n.main-module_slide__header__11UTh {\n width: 100%;\n border-bottom: 1px solid #abb4cd;\n background-color: #fff;\n display: flex;\n align-items: center;\n box-shadow: 0 0 9px 0 rgba(16, 47, 102, 0.16);\n}\n.main-module_slide__content__3KeZM {\n flex: 1;\n overflow-x: hidden;\n overflow-y: scroll;\n}\n.main-module_slide__footer__3wvMP {\n padding: 1.5rem 1rem 1.5rem 1rem;\n background-color: #fff;\n border-top: 1px solid #abb4cd;\n box-shadow: 0 1px 5px 0 rgba(171, 180, 205, 0.6);\n}\n.main-module_slide_direction-left__Rg5kV {\n right: 0;\n left: 0;\n -webkit-animation-name: main-module_directionLeftHide__QSuRw;\n animation-name: main-module_directionLeftHide__QSuRw;\n}\n.main-module_slide_direction-left__Rg5kV.main-module_slide_is-open__3twK9 {\n -webkit-animation-name: main-module_directionLeftShow__1VVi1;\n animation-name: main-module_directionLeftShow__1VVi1;\n}\n";
3
+ var css_248z = "/* font colors */\n/* actions */\n/* background */\n/* errors */\n/* borders */\n/* grid */\n/* scrollBar */\n/* sizes */\n@-webkit-keyframes main-module_directionLeftShow__1VVi1 {\n from {\n transform: translateX(100%);\n }\n to {\n transform: translateX(0);\n }\n}\n@keyframes main-module_directionLeftShow__1VVi1 {\n from {\n transform: translateX(100%);\n }\n to {\n transform: translateX(0);\n }\n}\n@-webkit-keyframes main-module_directionLeftHide__QSuRw {\n from {\n transform: translateX(0);\n }\n to {\n transform: translateX(100%);\n }\n}\n@keyframes main-module_directionLeftHide__QSuRw {\n from {\n transform: translateX(0);\n }\n to {\n transform: translateX(100%);\n }\n}\n.main-module_slide__1kcca {\n position: absolute;\n top: 0;\n height: 100%;\n background-color: #fff;\n -webkit-animation-fill-mode: both;\n animation-fill-mode: both;\n overflow-y: hidden;\n z-index: 1;\n}\n.main-module_slide__wrapper__3mC8j {\n display: flex;\n flex-direction: column;\n height: 100%;\n}\n.main-module_slide__header__11UTh {\n width: 100%;\n border-bottom: 1px solid #abb4cd;\n background-color: #fff;\n display: flex;\n align-items: center;\n box-shadow: 0 0 9px 0 rgba(16, 47, 102, 0.16);\n}\n.main-module_slide__content__3KeZM {\n flex: 1;\n overflow-x: hidden;\n overflow-y: scroll;\n}\n.main-module_slide__footer__3wvMP {\n padding: 0.5rem 1rem 0.5rem 1rem;\n background-color: #f3f4f8;\n border-top: 1px solid #abb4cd;\n box-shadow: 0 1px 5px 0 rgba(171, 180, 205, 0.6);\n}\n.main-module_slide_direction-left__Rg5kV {\n right: 0;\n left: 0;\n -webkit-animation-name: main-module_directionLeftHide__QSuRw;\n animation-name: main-module_directionLeftHide__QSuRw;\n}\n.main-module_slide_direction-left__Rg5kV.main-module_slide_is-open__3twK9 {\n -webkit-animation-name: main-module_directionLeftShow__1VVi1;\n animation-name: main-module_directionLeftShow__1VVi1;\n}\n";
4
4
  var cssClasses = {"slide":"main-module_slide__1kcca","slide__wrapper":"main-module_slide__wrapper__3mC8j","slide__header":"main-module_slide__header__11UTh","slide__content":"main-module_slide__content__3KeZM","slide__footer":"main-module_slide__footer__3wvMP","slide_direction-left":"main-module_slide_direction-left__Rg5kV","directionLeftHide":"main-module_directionLeftHide__QSuRw","slide_is-open":"main-module_slide_is-open__3twK9","directionLeftShow":"main-module_directionLeftShow__1VVi1"};
5
5
  styleInject(css_248z);
6
6
 
package/package.json CHANGED
@@ -2,7 +2,7 @@
2
2
  "name": "@dreamcommerce/aurora",
3
3
  "packageManager": "yarn@3.2.0",
4
4
  "sideEffects": false,
5
- "version": "2.6.0-9",
5
+ "version": "2.6.1-1",
6
6
  "description": "aurora",
7
7
  "author": "k0ssak",
8
8
  "license": "MIT",
@@ -44,7 +44,7 @@
44
44
  "update-visuals": "jest -c .config/jest/jest.config.visual.js --updateSnapshot"
45
45
  },
46
46
  "devDependencies": {
47
- "@dreamcommerce/utilities": "^1.7.0",
47
+ "@dreamcommerce/utilities": "^1.8.0",
48
48
  "@shoper/jest_config": "^0.0.0",
49
49
  "@shoper/tsconfig": "^0.0.0",
50
50
  "@storybook/react": "6.5.7",
package/build/esm/packages/aurora/src/components/image_picker/constants.js DELETED
@@ -1,2 +0,0 @@
1
- export {};
2
- //# sourceMappingURL=constants.js.map
package/build/esm/packages/aurora/src/components/image_picker/constants.js.map DELETED
@@ -1 +0,0 @@
1
- {"version":3,"file":"constants.js","sourceRoot":"","sources":["../../../../../../../src/components/image_picker/constants.ts"],"names":[],"mappings":""}
package/build/esm/packages/aurora/src/components/image_picker/utils.d.ts DELETED
@@ -1 +0,0 @@
1
- export declare const checkIfInvalideFileFormatErrorOccured: (errorsArray: string[] | undefined) => boolean | undefined;
package/build/esm/packages/aurora/src/components/image_picker/utils.js DELETED
@@ -1,5 +0,0 @@
1
- import { FILE_PICKER_ERROR } from '@auroraComponents/file_picker/constants';
2
- export const checkIfInvalideFileFormatErrorOccured = (errorsArray) => {
3
- return errorsArray && errorsArray.includes(FILE_PICKER_ERROR.invalidFileFormat);
4
- };
5
- //# sourceMappingURL=utils.js.map
package/build/esm/packages/aurora/src/components/image_picker/utils.js.map DELETED
@@ -1 +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/xhr_image_picker/utils.js DELETED
@@ -1,45 +0,0 @@
1
- // import { useCallback, useEffect, useState } from 'react';
2
- //
3
- // import { AxiosClient } from '@dreamcommerce/star_core';
4
- // import { TFetchXhrImageData } from './types';
5
- //
6
- // export const useXhr = ({ url, imageFile }: TFetchXhrImageData) => {
7
- // const [imageId, setImageId] = useState();
8
- // const fetchClient = new AxiosClient();
9
- //
10
- // const fetchXhrData = useCallback(
11
- // ({ url, imageFile, handleResponseData }) => {
12
- // fetchClient
13
- // .fetch<any>({ method: 'post', url, data: imageFile })
14
- // .then((response) => {
15
- // handleResponseData(response);
16
- // })
17
- // .catch();
18
- // },
19
- // [fetchClient]
20
- // );
21
- //
22
- // const getImageId = () => {
23
- // fetchXhrData({
24
- // url,
25
- // imageFile,
26
- // handleResponseData: (response) => {
27
- // setImageId(response);
28
- // }
29
- // });
30
- // };
31
- //
32
- // useEffect(() => {
33
- // getImageId();
34
- //
35
- // return () => {
36
- // fetchClient.makeCancelable().cancelRequest();
37
- // };
38
- // }, []);
39
- //
40
- // return {
41
- // imageId
42
- // };
43
- // };
44
- export {};
45
- //# sourceMappingURL=utils.js.map
package/build/esm/packages/aurora/src/components/xhr_image_picker/utils.js.map DELETED
@@ -1 +0,0 @@
1
- {"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../../../../../src/components/xhr_image_picker/utils.ts"],"names":[],"mappings":"AAAA,4DAA4D;AAC5D,EAAE;AACF,0DAA0D;AAC1D,gDAAgD;AAChD,EAAE;AACF,sEAAsE;AACtE,gDAAgD;AAChD,6CAA6C;AAC7C,EAAE;AACF,wCAAwC;AACxC,wDAAwD;AACxD,0BAA0B;AAC1B,wEAAwE;AACxE,wCAAwC;AACxC,oDAAoD;AACpD,qBAAqB;AACrB,4BAA4B;AAC5B,aAAa;AACb,wBAAwB;AACxB,SAAS;AACT,EAAE;AACF,iCAAiC;AACjC,yBAAyB;AACzB,mBAAmB;AACnB,yBAAyB;AACzB,kDAAkD;AAClD,wCAAwC;AACxC,gBAAgB;AAChB,cAAc;AACd,SAAS;AACT,EAAE;AACF,wBAAwB;AACxB,wBAAwB;AACxB,EAAE;AACF,yBAAyB;AACzB,4DAA4D;AAC5D,aAAa;AACb,cAAc;AACd,EAAE;AACF,eAAe;AACf,kBAAkB;AAClB,SAAS;AACT,KAAK"}