@dreamcommerce/aurora 2.6.0-10 → 2.6.0-12

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 (37) hide show
  1. package/build/cjs/packages/aurora/src/components/controls/hoc/control_xhr_image_picker/index.js +2 -7
  2. package/build/cjs/packages/aurora/src/components/controls/hoc/control_xhr_image_picker/index.js.map +1 -1
  3. package/build/cjs/packages/aurora/src/components/file_picker/use_file_picker.js +0 -8
  4. package/build/cjs/packages/aurora/src/components/file_picker/use_file_picker.js.map +1 -1
  5. package/build/cjs/packages/aurora/src/components/image_picker/index.js +5 -62
  6. package/build/cjs/packages/aurora/src/components/image_picker/index.js.map +1 -1
  7. package/build/cjs/packages/aurora/src/components/message-box/index.js +1 -1
  8. package/build/cjs/packages/aurora/src/components/xhr_image_picker/index.js +16 -5
  9. package/build/cjs/packages/aurora/src/components/xhr_image_picker/index.js.map +1 -1
  10. package/build/cjs/packages/aurora/src/css/slide/main.module.less.js +1 -1
  11. package/build/esm/packages/aurora/src/components/controls/hoc/control_xhr_image_picker/index.js +2 -7
  12. package/build/esm/packages/aurora/src/components/controls/hoc/control_xhr_image_picker/index.js.map +1 -1
  13. package/build/esm/packages/aurora/src/components/controls/types.d.ts +3 -3
  14. package/build/esm/packages/aurora/src/components/controls/types.js.map +1 -1
  15. package/build/esm/packages/aurora/src/components/file_picker/use_file_picker.js +1 -9
  16. package/build/esm/packages/aurora/src/components/file_picker/use_file_picker.js.map +1 -1
  17. package/build/esm/packages/aurora/src/components/image_picker/index.js +6 -63
  18. package/build/esm/packages/aurora/src/components/image_picker/index.js.map +1 -1
  19. package/build/esm/packages/aurora/src/components/image_picker/types.d.ts +2 -2
  20. package/build/esm/packages/aurora/src/components/message-box/index.d.ts +1 -1
  21. package/build/esm/packages/aurora/src/components/message-box/index.js +1 -1
  22. package/build/esm/packages/aurora/src/components/message-box/types.d.ts +1 -1
  23. package/build/esm/packages/aurora/src/components/xhr_image_picker/index.js +17 -6
  24. package/build/esm/packages/aurora/src/components/xhr_image_picker/index.js.map +1 -1
  25. package/build/esm/packages/aurora/src/components/xhr_image_picker/types.d.ts +2 -2
  26. package/build/esm/packages/aurora/src/components/xhr_image_picker/types.js.map +1 -1
  27. package/build/esm/packages/aurora/src/css/slide/main.module.less.js +1 -1
  28. package/package.json +1 -1
  29. package/build/esm/packages/aurora/src/components/image_picker/constants.d.ts +0 -1
  30. package/build/esm/packages/aurora/src/components/image_picker/constants.js +0 -2
  31. package/build/esm/packages/aurora/src/components/image_picker/constants.js.map +0 -1
  32. package/build/esm/packages/aurora/src/components/image_picker/utils.d.ts +0 -1
  33. package/build/esm/packages/aurora/src/components/image_picker/utils.js +0 -5
  34. package/build/esm/packages/aurora/src/components/image_picker/utils.js.map +0 -1
  35. package/build/esm/packages/aurora/src/components/xhr_image_picker/utils.d.ts +0 -1
  36. package/build/esm/packages/aurora/src/components/xhr_image_picker/utils.js +0 -45
  37. package/build/esm/packages/aurora/src/components/xhr_image_picker/utils.js.map +0 -1
package/build/cjs/packages/aurora/src/components/controls/hoc/control_xhr_image_picker/index.js CHANGED
@@ -11,19 +11,14 @@ 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
- }) => {
14
+ const ControlXhrImagePicker = ({ url, label, isRequired, id, name, onChange, allowedExtensions, initialFile, className, errors, hint, labelAdditionalInfo, onUploaded, onImageSizeUpdated }) => {
20
15
  return (React__default['default'].createElement(index['default'], { errors: errors, name: name, id: id },
21
16
  (label || hint) && (React__default['default'].createElement(index['default'].Label, { id: id, isRequired: isRequired, additionalInfo: labelAdditionalInfo },
22
17
  label,
23
18
  hint && React__default['default'].createElement(index$1['default'], { hint: hint, spacingLeft: true }))),
24
19
  React__default['default'].createElement(index['default'].Content, null,
25
20
  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 }))),
21
+ 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, onImageSizeUpdated: onImageSizeUpdated }))),
27
22
  React__default['default'].createElement(index['default'].Errors, null)));
28
23
  };
29
24
 
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;"}
package/build/cjs/packages/aurora/src/components/file_picker/use_file_picker.js CHANGED
@@ -11,9 +11,6 @@ const useFilePicker = ({ onChange, initialFile, allowedExtensions, inputRef, ini
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();
@@ -29,13 +26,8 @@ const useFilePicker = ({ onChange, initialFile, allowedExtensions, inputRef, ini
29
26
  if (!allowedExtensions)
30
27
  return;
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
31
  !isValid ? setErrors([...errors, i18n['default'].t(constants.FILE_PICKER_ERROR.invalidFileFormat)]) : setErrors([]);
40
32
  };
41
33
  const onFileChange = ({ target: { files } }) => {
package/build/cjs/packages/aurora/src/components/file_picker/use_file_picker.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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
1
+ {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
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, 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, 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,29 @@ 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, 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 onChange = async (fileList) => {
19
+ if (!fileList)
20
+ return;
21
+ if (pendingRequestRef.current) {
22
+ pendingRequestRef.current();
23
+ pendingRequestRef.current = undefined;
24
+ }
25
+ const { response, cancelRequest } = httpApi.fetch({
19
26
  url,
20
27
  method: http_requester_contants.REQUEST_TYPES.post,
21
28
  data: fileList[0]
22
29
  });
30
+ pendingRequestRef.current = cancelRequest;
23
31
  const data = await response;
24
- onUploaded === null || onUploaded === void 0 ? void 0 : onUploaded(data, fileList[0], imageSize);
32
+ onUploaded === null || onUploaded === void 0 ? void 0 : onUploaded(data, fileList[0]);
25
33
  };
26
- return (React__default['default'].createElement(index['default'], { id: id, name: name, onChange: onChange, errors: errors, allowedExtensions: allowedExtensions, initialFile: initialFile }));
34
+ React.useEffect(() => {
35
+ return () => { var _a; return (_a = pendingRequestRef.current) === null || _a === void 0 ? void 0 : _a.call(pendingRequestRef); };
36
+ }, []);
37
+ return (React__default['default'].createElement(index['default'], { id: id, name: name, onChange: onChange, errors: errors, allowedExtensions: allowedExtensions, initialFile: initialFile, onImageSizeUpdated: onImageSizeUpdated }));
27
38
  };
28
39
 
29
40
  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;"}
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/hoc/control_xhr_image_picker/index.js CHANGED
@@ -3,19 +3,14 @@ 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
- }) => {
6
+ const ControlXhrImagePicker = ({ url, label, isRequired, id, name, onChange, allowedExtensions, initialFile, className, errors, hint, labelAdditionalInfo, onUploaded, onImageSizeUpdated }) => {
12
7
  return (React.createElement(Control, { errors: errors, name: name, id: id },
13
8
  (label || hint) && (React.createElement(Control.Label, { id: id, isRequired: isRequired, additionalInfo: labelAdditionalInfo },
14
9
  label,
15
10
  hint && React.createElement(Hint, { hint: hint, spacingLeft: true }))),
16
11
  React.createElement(Control.Content, null,
17
12
  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 }))),
13
+ React.createElement(XhrImagePicker, { url: url, id: id, name: name, onChange: onChange, allowedExtensions: allowedExtensions, initialFile: initialFile, className: className, errors: errors, onUploaded: onUploaded, onImageSizeUpdated: onImageSizeUpdated }))),
19
14
  React.createElement(Control.Errors, null)));
20
15
  };
21
16
 
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;"}
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/use_file_picker.js CHANGED
@@ -1,4 +1,4 @@
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
 
@@ -7,9 +7,6 @@ const useFilePicker = ({ onChange, initialFile, allowedExtensions, inputRef, ini
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();
@@ -25,13 +22,8 @@ const useFilePicker = ({ onChange, initialFile, allowedExtensions, inputRef, ini
25
22
  if (!allowedExtensions)
26
23
  return;
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
27
  !isValid ? setErrors([...errors, i18n.t(FILE_PICKER_ERROR.invalidFileFormat)]) : setErrors([]);
36
28
  };
37
29
  const onFileChange = ({ target: { files } }) => {
package/build/esm/packages/aurora/src/components/file_picker/use_file_picker.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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
1
+ {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
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, 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, 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,32 @@
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, 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 onChange = async (fileList) => {
11
+ if (!fileList)
12
+ return;
13
+ if (pendingRequestRef.current) {
14
+ pendingRequestRef.current();
15
+ pendingRequestRef.current = undefined;
16
+ }
17
+ const { response, cancelRequest } = httpApi.fetch({
11
18
  url,
12
19
  method: REQUEST_TYPES.post,
13
20
  data: fileList[0]
14
21
  });
22
+ pendingRequestRef.current = cancelRequest;
15
23
  const data = await response;
16
- onUploaded === null || onUploaded === void 0 ? void 0 : onUploaded(data, fileList[0], imageSize);
24
+ onUploaded === null || onUploaded === void 0 ? void 0 : onUploaded(data, fileList[0]);
17
25
  };
18
- return (React.createElement(ImagePicker, { id: id, name: name, onChange: onChange, errors: errors, allowedExtensions: allowedExtensions, initialFile: initialFile }));
26
+ useEffect(() => {
27
+ return () => { var _a; return (_a = pendingRequestRef.current) === null || _a === void 0 ? void 0 : _a.call(pendingRequestRef); };
28
+ }, []);
29
+ return (React.createElement(ImagePicker, { id: id, name: name, onChange: onChange, errors: errors, allowedExtensions: allowedExtensions, initialFile: initialFile, onImageSizeUpdated: onImageSizeUpdated }));
19
30
  };
20
31
 
21
32
  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;"}
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/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-10",
5
+ "version": "2.6.0-12",
6
6
  "description": "aurora",
7
7
  "author": "k0ssak",
8
8
  "license": "MIT",
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"}