@dreamcommerce/aurora 2.6.0-3 → 2.6.0-5

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 (44) hide show
  1. package/build/cjs/packages/aurora/src/components/controls/hoc/{control_image_picker → control_xhr_image_picker}/index.js +9 -4
  2. package/build/{esm/packages/aurora/src/components/controls/hoc/control_image_picker → 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 +2 -2
  4. package/build/cjs/packages/aurora/src/components/image_picker/components/uploaded_image_item.js +4 -4
  5. package/build/cjs/packages/aurora/src/components/image_picker/css_classes.js +1 -2
  6. package/build/cjs/packages/aurora/src/components/image_picker/css_classes.js.map +1 -1
  7. package/build/cjs/packages/aurora/src/components/image_picker/index.js +27 -18
  8. package/build/cjs/packages/aurora/src/components/image_picker/index.js.map +1 -1
  9. package/build/cjs/packages/aurora/src/components/xhr_image_picker/index.js +3 -4
  10. package/build/cjs/packages/aurora/src/components/xhr_image_picker/index.js.map +1 -1
  11. package/build/cjs/packages/aurora/src/css/image_picker/main.module.less.js +2 -2
  12. package/build/cjs/packages/aurora/src/index.js +4 -4
  13. package/build/esm/packages/aurora/src/components/controls/hoc/control_xhr_image_picker/index.d.ts +4 -0
  14. package/build/esm/packages/aurora/src/components/controls/hoc/control_xhr_image_picker/index.js +23 -0
  15. package/build/{cjs/packages/aurora/src/components/controls/hoc/control_image_picker → esm/packages/aurora/src/components/controls/hoc/control_xhr_image_picker}/index.js.map +1 -1
  16. package/build/esm/packages/aurora/src/components/controls/types.d.ts +4 -6
  17. package/build/esm/packages/aurora/src/components/controls/types.js +1 -0
  18. package/build/esm/packages/aurora/src/components/controls/types.js.map +1 -1
  19. package/build/esm/packages/aurora/src/components/file_picker/types.d.ts +3 -0
  20. package/build/esm/packages/aurora/src/components/file_picker/types.js +1 -0
  21. package/build/esm/packages/aurora/src/components/file_picker/types.js.map +1 -1
  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 +2 -2
  24. package/build/esm/packages/aurora/src/components/image_picker/components/uploaded_image_item.js +4 -4
  25. package/build/esm/packages/aurora/src/components/image_picker/css_classes.d.ts +0 -1
  26. package/build/esm/packages/aurora/src/components/image_picker/css_classes.js +1 -2
  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 +28 -19
  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 +3 -12
  31. package/build/esm/packages/aurora/src/components/image_picker/types.js.map +1 -1
  32. package/build/esm/packages/aurora/src/components/xhr_image_picker/index.d.ts +2 -2
  33. package/build/esm/packages/aurora/src/components/xhr_image_picker/index.js +3 -4
  34. package/build/esm/packages/aurora/src/components/xhr_image_picker/index.js.map +1 -1
  35. package/build/esm/packages/aurora/src/components/xhr_image_picker/types.d.ts +2 -7
  36. package/build/esm/packages/aurora/src/css/image_picker/main.module.less.js +2 -2
  37. package/build/esm/packages/aurora/src/index.d.ts +2 -2
  38. package/build/esm/packages/aurora/src/index.js +2 -2
  39. package/package.json +1 -1
  40. package/build/esm/packages/aurora/src/components/controls/hoc/control_image_picker/index.d.ts +0 -4
  41. package/build/esm/packages/aurora/src/components/controls/hoc/control_image_picker/index.js +0 -18
  42. package/build/esm/packages/aurora/src/components/image_picker/components/selected_image_preview.d.ts +0 -4
  43. package/build/esm/packages/aurora/src/components/image_picker/components/selected_image_preview.js +0 -28
  44. package/build/esm/packages/aurora/src/components/image_picker/components/selected_image_preview.js.map +0 -1
package/build/cjs/packages/aurora/src/components/controls/hoc/{control_image_picker → control_xhr_image_picker}/index.js RENAMED
@@ -5,22 +5,27 @@ Object.defineProperty(exports, '__esModule', { value: true });
5
5
  var React = require('react');
6
6
  var index = require('../../index.js');
7
7
  var index$1 = require('../../../hint/index.js');
8
- var index$2 = require('../../../image_picker/index.js');
8
+ var index$2 = require('../../../xhr_image_picker/index.js');
9
9
 
10
10
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
11
11
 
12
12
  var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
13
13
 
14
- const ControlImagePicker = ({ label, isRequired, id, name, onChange, allowedExtensions, initialFile, className, errors, hint, labelAdditionalInfo, hasWidthInput, widthInputPostfix, widthInputLabel, widthInputHint }) => {
14
+ const ControlXhrImagePicker = ({ url, label, isRequired, id, name, onChange, allowedExtensions, initialFile, className, errors, hint, labelAdditionalInfo
15
+ // hasWidthInput,
16
+ // widthInputPostfix,
17
+ // widthInputLabel,
18
+ // widthInputHint
19
+ }) => {
15
20
  return (React__default['default'].createElement(index['default'], { errors: errors, name: name, id: id },
16
21
  (label || hint) && (React__default['default'].createElement(index['default'].Label, { id: id, isRequired: isRequired, additionalInfo: labelAdditionalInfo },
17
22
  label,
18
23
  hint && React__default['default'].createElement(index$1['default'], { hint: hint, spacingLeft: true }))),
19
24
  React__default['default'].createElement(index['default'].Content, null,
20
25
  React__default['default'].createElement(index['default'].Element, null,
21
- React__default['default'].createElement(index$2['default'], { id: id, name: name, onChange: onChange, allowedExtensions: allowedExtensions, initialFile: initialFile, className: className, hasWidthInput: hasWidthInput, widthInputPostfix: widthInputPostfix, widthInputLabel: widthInputLabel, widthInputHint: widthInputHint }))),
26
+ React__default['default'].createElement(index$2['default'], { url: url, id: id, name: name, onChange: onChange, allowedExtensions: allowedExtensions, initialFile: initialFile, className: className, errors: errors }))),
22
27
  React__default['default'].createElement(index['default'].Errors, null)));
23
28
  };
24
29
 
25
- exports.default = ControlImagePicker;
30
+ exports.default = ControlXhrImagePicker;
26
31
  //# sourceMappingURL=index.js.map
package/build/{esm/packages/aurora/src/components/controls/hoc/control_image_picker → cjs/packages/aurora/src/components/controls/hoc/control_xhr_image_picker}/index.js.map RENAMED
@@ -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;"}
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;"}
package/build/cjs/packages/aurora/src/components/file_picker/use_file_picker.js CHANGED
@@ -6,9 +6,9 @@ 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 }) => {
9
+ const useFilePicker = ({ onChange, initialFile, allowedExtensions, inputRef, initialErrors }) => {
10
10
  const [file, setFile] = React.useState(initialFile);
11
- const [errors, setErrors] = React.useState([]);
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
14
  React.useEffect(() => {
package/build/cjs/packages/aurora/src/components/image_picker/components/uploaded_image_item.js CHANGED
@@ -20,11 +20,11 @@ const UploadedImageItem = ({ imageSize, onFileDelete, isValid, file }) => {
20
20
  const imageWidth = imageSize && imageSize.width;
21
21
  const imageHeight = imageSize && imageSize.height;
22
22
  return (React__default['default'].createElement("div", { className: main_module['default'][css_classes['default'].imagePickerSelectedFile] },
23
- React__default['default'].createElement("div", { className: main_module['default'][css_classes['default'].imagePickerSelectedFileNameWrapper] }, isValid && (React__default['default'].createElement("span", { className: main_module['default'][css_classes['default'].imagePickerSelectedFileFullName] },
24
- React__default['default'].createElement("span", null, utilities.FileUtils.getShortenFileName(imageName, 10, 5, 1)),
25
- React__default['default'].createElement("span", null, `.${imageExtension} (${imageWidth}x${imageHeight}px)`)))),
23
+ React__default['default'].createElement("div", { className: main_module['default'][css_classes['default'].imagePickerSelectedFileNameWrapper] }, isValid && (React__default['default'].createElement(React__default['default'].Fragment, null,
24
+ utilities.FileUtils.getShortenFileName(imageName, 10, 5, 1),
25
+ `.${imageExtension} (${imageWidth}x${imageHeight}px)`))),
26
26
  React__default['default'].createElement("div", { className: main_module['default'][css_classes['default'].imagePickerSelectedFileRemoveWrapper] },
27
- React__default['default'].createElement("span", { onClick: onFileDelete, className: main_module['default'][css_classes['default'].imagePickerDeleteButton] },
27
+ React__default['default'].createElement("button", { onClick: onFileDelete, className: main_module['default'][css_classes['default'].imagePickerDeleteButton] },
28
28
  React__default['default'].createElement(icon_delete['default'], { className: main_module['default'][css_classes['default'].imagePickerDeleteIcon] }),
29
29
  React__default['default'].createElement("span", { className: main_module['default'][css_classes['default'].imagePickerDeleteLabel] }, t('Remove'))))));
30
30
  };
package/build/cjs/packages/aurora/src/components/image_picker/css_classes.js CHANGED
@@ -21,8 +21,7 @@ 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`,
25
- imagePickerSelectedFileFullName: `${imagePicker}__selected-file-full-name`
24
+ imagePickerSelectedFileRemoveWrapper: `${imagePicker}__selected-file-remove-wrapper`
26
25
  };
27
26
 
28
27
  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;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;"}
package/build/cjs/packages/aurora/src/components/image_picker/index.js CHANGED
@@ -21,14 +21,22 @@ 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, allowedExtensions = [constants.FILES_EXTENSIONS.WEBP, constants.FILES_EXTENSIONS.JPG, constants.FILES_EXTENSIONS.PNG, constants.FILES_EXTENSIONS.GIF, constants.FILES_EXTENSIONS.SVG], initialFile, name, className = '', hasWidthInput, widthInputPostfix = 'px', widthInputLabel, widthInputHint }) => {
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
+ }) => {
25
30
  const [t] = useTranslation.useTranslation();
26
31
  const inputRef = React.createRef();
27
32
  // const [fileFormatIsCorrect, setFileFormatIsCorrect] = useState<boolean>(true);
28
- const [imageSize, setImageSize] = React.useState({ width: 0, height: 0 });
29
- const [widthInputValue, setWidthInputValue] = React.useState();
33
+ const [imageSize, setImageSize] = React.useState(undefined);
34
+ // const [widthInputValue, setWidthInputValue] = useState<number | undefined>();
30
35
  // const [isInputWidthTooBig, setIsInputWidthTooBig] = useState<boolean>(false);
31
- const { onDropFile, onFileChange, onDragOver, onDragLeave, onFileDelete, onPreviewError, file, errors, isPreview, isDragOver } = use_file_picker.useFilePicker({ initialFile, onChange, allowedExtensions, inputRef });
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 });
32
40
  const acceptFiles = utils.getAcceptFilesParametersFromAllowedExtensions(allowedExtensions);
33
41
  // const showMaxWidthInput = hasWidthInput && file && fileFormatIsCorrect && !isVectorImage;
34
42
  const imagePickerClassName = classnames__default['default'](main_module['default'][css_classes['default'].imagePicker], className && className);
@@ -79,16 +87,17 @@ const ImagePicker = ({ id, onChange, allowedExtensions = [constants.FILES_EXTENS
79
87
  // if (!widthInputValue || !imageSize.width) return;
80
88
  // widthInputValue > imageSize.width ? setIsInputWidthTooBig(true) : setIsInputWidthTooBig(false);
81
89
  // };
82
- const handleOnDropFile = (event) => {
83
- onDropFile(event);
84
- // getImageWidth(event);
85
- };
86
- const handleOnFileChange = (event) => {
87
- onFileChange(event);
88
- // getImageWidth(event);
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
+ // };
90
99
  const handleOnFileDelete = () => {
91
- setImageSize({ width: 0, height: 0 });
100
+ setImageSize(undefined);
92
101
  onFileDelete();
93
102
  };
94
103
  // const handleOnWidthInputChange = (event: React.ChangeEvent<HTMLInputElement>) => {
@@ -98,17 +107,17 @@ const ImagePicker = ({ id, onChange, allowedExtensions = [constants.FILES_EXTENS
98
107
  // // checkIfInvalideFileFormatErrorOccured(errors) ? setFileFormatIsCorrect(false) : setFileFormatIsCorrect(true);
99
108
  // // file && checkIfInputMaxWidthIsGreaterThenImageWidth();
100
109
  // }, [errors, file, widthInputValue]);
101
- React.useEffect(() => {
102
- setWidthInputValue(imageSize.width);
103
- }, [imageSize]);
110
+ // useEffect(() => {
111
+ // setWidthInputValue(imageSize.width);
112
+ // }, [imageSize]);
104
113
  return (React__default['default'].createElement("div", { className: imagePickerClassName },
105
114
  React__default['default'].createElement("div", { className: `${imagePickerWrapperClassName} ${dragOverStyles.imagePickerWrapper}` },
106
115
  file &&
107
116
  (isPreview ? (React__default['default'].createElement(React__default['default'].Fragment, null,
108
117
  React__default['default'].createElement(image_preview.ImagePreview, { file: file, isValid: !(errors === null || errors === void 0 ? void 0 : errors.length), onError: onPreviewError, onLoad: handlePreviewLoaded }),
109
118
  React__default['default'].createElement(uploaded_image_item.UploadedImageItem, { imageSize: imageSize, file: file, isValid: !(errors === null || errors === void 0 ? void 0 : errors.length), onFileDelete: handleOnFileDelete }))) : (React__default['default'].createElement("div", null, t('No preview')))),
110
- React__default['default'].createElement(image_input['default'], { onDragLeave: onDragLeave, onDragOver: onDragOver, isDragOver: isDragOver, allowedExtensions: allowedExtensions, id: id, onDropFile: handleOnDropFile }),
111
- React__default['default'].createElement("input", { onChange: handleOnFileChange, id: id, ref: inputRef, type: "file", name: name, className: main_module['default'][css_classes['default'].imagePickerInput], accept: acceptFiles })),
119
+ React__default['default'].createElement(image_input['default'], { onDragLeave: onDragLeave, onDragOver: onDragOver, isDragOver: isDragOver, allowedExtensions: allowedExtensions, id: id, onDropFile: onDropFile }),
120
+ React__default['default'].createElement("input", { onChange: onFileChange, id: id, ref: inputRef, type: "file", name: name, className: main_module['default'][css_classes['default'].imagePickerInput], accept: acceptFiles })),
112
121
  errors && React__default['default'].createElement(errors_list.ErrorsList, { errors: errors })));
113
122
  };
114
123
 
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;"}
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;"}
package/build/cjs/packages/aurora/src/components/xhr_image_picker/index.js CHANGED
@@ -12,19 +12,18 @@ 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, 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, allowedExtensions = [constants.FILES_EXTENSIONS.WEBP, constants.FILES_EXTENSIONS.JPG, constants.FILES_EXTENSIONS.PNG, constants.FILES_EXTENSIONS.GIF, constants.FILES_EXTENSIONS.SVG] }) => {
16
16
  const httpApi = use_http_api.useHttpApi();
17
17
  const onChange = async (fileList) => {
18
- console.warn('onChange', fileList[0]);
19
18
  const { response } = httpApi.fetch({
20
19
  url,
21
20
  method: http_requester_contants.REQUEST_TYPES.post,
22
21
  data: fileList[0]
23
22
  });
24
23
  const data = await response;
25
- onUploaded === null || onUploaded === void 0 ? void 0 : onUploaded(data);
24
+ onUploaded === null || onUploaded === void 0 ? void 0 : onUploaded(data, fileList[0]);
26
25
  };
27
- return (React__default['default'].createElement(index['default'], { id: id, name: name, onChange: onChange, allowedExtensions: allowedExtensions, initialFile: initialFile }));
26
+ return (React__default['default'].createElement(index['default'], { id: id, name: name, onChange: onChange, errors: errors, allowedExtensions: allowedExtensions, initialFile: initialFile }));
28
27
  };
29
28
 
30
29
  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;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;"}
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 flex-shrink: 0;\n color: #3c83ec;\n cursor: pointer;\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 flex: 1;\n max-width: 50%;\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-full-name__3fALB {\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__selected-file-full-name":"main-module_image-picker__selected-file-full-name__3fALB","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}\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"};
9
9
  styleInject_es['default'](css_248z);
10
10
 
11
11
  exports.default = styles;
package/build/cjs/packages/aurora/src/index.js CHANGED
@@ -27,7 +27,8 @@ var index$m = require('./components/controls/hoc/control_date_picker/index.js');
27
27
  var index$B = require('./components/file_picker/index.js');
28
28
  var index$n = require('./components/controls/hoc/control_file_picker/index.js');
29
29
  var index$C = require('./components/image_picker/index.js');
30
- var index$o = require('./components/controls/hoc/control_image_picker/index.js');
30
+ var index$M = require('./components/xhr_image_picker/index.js');
31
+ var index$o = require('./components/controls/hoc/control_xhr_image_picker/index.js');
31
32
  var index$a = require('./components/controls/hoc/control_input/index.js');
32
33
  var index$6 = require('./components/dropdown/hoc/multiselect/index.js');
33
34
  var index$g = require('./components/controls/hoc/control_multi_select/index.js');
@@ -78,7 +79,6 @@ var tabs_panel_list = require('./components/tabs/components/tabs_panel_list.js')
78
79
  var tabs_wrapper = require('./components/tabs/components/tabs_wrapper.js');
79
80
  var index$2 = require('./components/tooltip/index.js');
80
81
  var index$J = require('./components/with_loader/index.js');
81
- var index$M = require('./components/xhr_image_picker/index.js');
82
82
 
83
83
 
84
84
 
@@ -108,7 +108,8 @@ exports.ControlDatepicker = index$m['default'];
108
108
  exports.FilePicker = index$B['default'];
109
109
  exports.ControlFilePicker = index$n['default'];
110
110
  exports.ImagePicker = index$C['default'];
111
- exports.ControlImagePicker = index$o['default'];
111
+ exports.XhrImagePicker = index$M['default'];
112
+ exports.ControlXhrImagePicker = index$o['default'];
112
113
  exports.ControlInput = index$a['default'];
113
114
  exports.MultiSelect = index$6['default'];
114
115
  exports.ControlMultiSelect = index$g['default'];
@@ -160,5 +161,4 @@ exports.TabsPanelList = tabs_panel_list.TabsPanelList;
160
161
  exports.TabsWrapper = tabs_wrapper['default'];
161
162
  exports.Tooltip = index$2['default'];
162
163
  exports.WithLoader = index$J['default'];
163
- exports.XhrImagePicker = index$M['default'];
164
164
  //# sourceMappingURL=index.js.map
package/build/esm/packages/aurora/src/components/controls/hoc/control_xhr_image_picker/index.d.ts ADDED
@@ -0,0 +1,4 @@
1
+ import { IControlXhrImagePicker } from '../../types';
2
+ import React from 'react';
3
+ declare const ControlXhrImagePicker: React.FC<IControlXhrImagePicker>;
4
+ export default ControlXhrImagePicker;
package/build/esm/packages/aurora/src/components/controls/hoc/control_xhr_image_picker/index.js ADDED
@@ -0,0 +1,23 @@
1
+ import React from 'react';
2
+ import Control from '../../index.js';
3
+ import Hint from '../../../hint/index.js';
4
+ import XhrImagePicker from '../../../xhr_image_picker/index.js';
5
+
6
+ const ControlXhrImagePicker = ({ url, label, isRequired, id, name, onChange, allowedExtensions, initialFile, className, errors, hint, labelAdditionalInfo
7
+ // hasWidthInput,
8
+ // widthInputPostfix,
9
+ // widthInputLabel,
10
+ // widthInputHint
11
+ }) => {
12
+ return (React.createElement(Control, { errors: errors, name: name, id: id },
13
+ (label || hint) && (React.createElement(Control.Label, { id: id, isRequired: isRequired, additionalInfo: labelAdditionalInfo },
14
+ label,
15
+ hint && React.createElement(Hint, { hint: hint, spacingLeft: true }))),
16
+ React.createElement(Control.Content, null,
17
+ 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 }))),
19
+ React.createElement(Control.Errors, null)));
20
+ };
21
+
22
+ export default ControlXhrImagePicker;
23
+ //# sourceMappingURL=index.js.map
package/build/{cjs/packages/aurora/src/components/controls/hoc/control_image_picker → esm/packages/aurora/src/components/controls/hoc/control_xhr_image_picker}/index.js.map RENAMED
@@ -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;"}
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;"}
package/build/esm/packages/aurora/src/components/controls/types.d.ts CHANGED
@@ -5,6 +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
9
  export declare type TControlErrors = string[] | null | undefined;
9
10
  export interface IControlContext {
10
11
  errors?: TControlErrors;
@@ -169,15 +170,12 @@ export interface IControlFilePicker extends IFilePicker, IControlCommonProps {
169
170
  name?: string;
170
171
  labelAdditionalInfo?: string | ReactNode;
171
172
  }
172
- export interface IControlImagePicker extends IFilePicker, IControlCommonProps {
173
+ export interface IControlXhrImagePicker extends IFilePicker, IControlCommonProps {
174
+ url: string;
173
175
  label?: string;
174
176
  isRequired?: boolean;
175
- name?: string;
177
+ onChange?: (fileList: FileList | null, size?: TImageSize) => void;
176
178
  labelAdditionalInfo?: string | ReactNode;
177
- hasWidthInput?: boolean;
178
- widthInputPostfix?: string;
179
- widthInputLabel?: string;
180
- widthInputHint?: string;
181
179
  }
182
180
  export interface ICellSelector {
183
181
  rows?: number;
package/build/esm/packages/aurora/src/components/controls/types.js CHANGED
@@ -5,4 +5,5 @@ import '@auroraComponents/file_picker/types';
5
5
  import '@auroraComponents/range/types';
6
6
  import 'react';
7
7
  import '@auroraTypings/general';
8
+ import '@auroraComponents/image_picker/types';
8
9
  //# sourceMappingURL=types.js.map
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"}
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"}
package/build/esm/packages/aurora/src/components/file_picker/types.d.ts CHANGED
@@ -1,5 +1,6 @@
1
1
  import React, { ChangeEvent } from 'react';
2
2
  import { FILES_EXTENSIONS, MIME_FILE_EXTENSIONS } from "./constants";
3
+ import { TControlErrors } from "../controls/types";
3
4
  export declare type TFilePickerFile = {
4
5
  fileUrl: string;
5
6
  fileName: string;
@@ -11,6 +12,7 @@ export interface IFilePicker {
11
12
  onChange?: (fileList: FileList | null) => void;
12
13
  allowedExtensions?: TFilesExtension[];
13
14
  initialFile?: TFilePickerFile;
15
+ errors?: TControlErrors;
14
16
  }
15
17
  export interface ISelectedFilePreview {
16
18
  file: TFilePickerFile | null;
@@ -43,6 +45,7 @@ export interface IUseFilePickerProps {
43
45
  initialFile?: TFilePickerFile;
44
46
  allowedExtensions?: TFilesExtension[];
45
47
  inputRef: React.RefObject<HTMLInputElement>;
48
+ initialErrors?: TControlErrors;
46
49
  }
47
50
  export declare type TFilesExtension = typeof FILES_EXTENSIONS[keyof typeof FILES_EXTENSIONS];
48
51
  export declare type TMimeFileExtension = typeof MIME_FILE_EXTENSIONS[keyof typeof MIME_FILE_EXTENSIONS];
package/build/esm/packages/aurora/src/components/file_picker/types.js CHANGED
@@ -1,3 +1,4 @@
1
1
  import 'react';
2
2
  import '@auroraComponents/file_picker/constants';
3
+ import '@auroraComponents/controls/types';
3
4
  //# sourceMappingURL=types.js.map
package/build/esm/packages/aurora/src/components/file_picker/types.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../../../../src/components/file_picker/types.ts"],"names":[],"mappings":"AAAA,OAAmC,OAAO,CAAC;AAC3C,OAAuD,yCAAyC,CAAC"}
1
+ {"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../../../../src/components/file_picker/types.ts"],"names":[],"mappings":"AAAA,OAAmC,OAAO,CAAC;AAC3C,OAAuD,yCAAyC,CAAC;AACjG,OAA+B,kCAAkC,CAAC"}
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 }: IUseFilePickerProps) => IUseFilePicker;
2
+ export declare const useFilePicker: ({ onChange, initialFile, allowedExtensions, inputRef, initialErrors }: IUseFilePickerProps) => IUseFilePicker;
package/build/esm/packages/aurora/src/components/file_picker/use_file_picker.js CHANGED
@@ -2,9 +2,9 @@ import { useState, useEffect } 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 }) => {
5
+ const useFilePicker = ({ onChange, initialFile, allowedExtensions, inputRef, initialErrors }) => {
6
6
  const [file, setFile] = useState(initialFile);
7
- const [errors, setErrors] = useState([]);
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
10
  useEffect(() => {
package/build/esm/packages/aurora/src/components/image_picker/components/uploaded_image_item.js CHANGED
@@ -12,11 +12,11 @@ const UploadedImageItem = ({ imageSize, onFileDelete, isValid, file }) => {
12
12
  const imageWidth = imageSize && imageSize.width;
13
13
  const imageHeight = imageSize && imageSize.height;
14
14
  return (React.createElement("div", { className: styles[CSS_CLASSES.imagePickerSelectedFile] },
15
- React.createElement("div", { className: styles[CSS_CLASSES.imagePickerSelectedFileNameWrapper] }, isValid && (React.createElement("span", { className: styles[CSS_CLASSES.imagePickerSelectedFileFullName] },
16
- React.createElement("span", null, FileUtils.getShortenFileName(imageName, 10, 5, 1)),
17
- React.createElement("span", null, `.${imageExtension} (${imageWidth}x${imageHeight}px)`)))),
15
+ React.createElement("div", { className: styles[CSS_CLASSES.imagePickerSelectedFileNameWrapper] }, isValid && (React.createElement(React.Fragment, null,
16
+ FileUtils.getShortenFileName(imageName, 10, 5, 1),
17
+ `.${imageExtension} (${imageWidth}x${imageHeight}px)`))),
18
18
  React.createElement("div", { className: styles[CSS_CLASSES.imagePickerSelectedFileRemoveWrapper] },
19
- React.createElement("span", { onClick: onFileDelete, className: styles[CSS_CLASSES.imagePickerDeleteButton] },
19
+ React.createElement("button", { onClick: onFileDelete, className: styles[CSS_CLASSES.imagePickerDeleteButton] },
20
20
  React.createElement(IconDelete, { className: styles[CSS_CLASSES.imagePickerDeleteIcon] }),
21
21
  React.createElement("span", { className: styles[CSS_CLASSES.imagePickerDeleteLabel] }, t('Remove'))))));
22
22
  };
package/build/esm/packages/aurora/src/components/image_picker/css_classes.d.ts CHANGED
@@ -17,6 +17,5 @@ declare const _default: {
17
17
  imagePickerSelectedFile: string;
18
18
  imagePickerSelectedFileNameWrapper: string;
19
19
  imagePickerSelectedFileRemoveWrapper: string;
20
- imagePickerSelectedFileFullName: string;
21
20
  };
22
21
  export default _default;
package/build/esm/packages/aurora/src/components/image_picker/css_classes.js CHANGED
@@ -17,8 +17,7 @@ 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`,
21
- imagePickerSelectedFileFullName: `${imagePicker}__selected-file-full-name`
20
+ imagePickerSelectedFileRemoveWrapper: `${imagePicker}__selected-file-remove-wrapper`
22
21
  };
23
22
 
24
23
  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;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;"}
package/build/esm/packages/aurora/src/components/image_picker/index.js CHANGED
@@ -1,4 +1,4 @@
1
- import React, { createRef, useState, useEffect } from 'react';
1
+ import React, { createRef, useState } 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,14 +12,22 @@ 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, allowedExtensions = [FILES_EXTENSIONS.WEBP, FILES_EXTENSIONS.JPG, FILES_EXTENSIONS.PNG, FILES_EXTENSIONS.GIF, FILES_EXTENSIONS.SVG], initialFile, name, className = '', hasWidthInput, widthInputPostfix = 'px', widthInputLabel, widthInputHint }) => {
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
+ }) => {
16
21
  const [t] = useTranslation();
17
22
  const inputRef = createRef();
18
23
  // const [fileFormatIsCorrect, setFileFormatIsCorrect] = useState<boolean>(true);
19
- const [imageSize, setImageSize] = useState({ width: 0, height: 0 });
20
- const [widthInputValue, setWidthInputValue] = useState();
24
+ const [imageSize, setImageSize] = useState(undefined);
25
+ // const [widthInputValue, setWidthInputValue] = useState<number | undefined>();
21
26
  // const [isInputWidthTooBig, setIsInputWidthTooBig] = useState<boolean>(false);
22
- const { onDropFile, onFileChange, onDragOver, onDragLeave, onFileDelete, onPreviewError, file, errors, isPreview, isDragOver } = useFilePicker({ initialFile, onChange, allowedExtensions, inputRef });
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 });
23
31
  const acceptFiles = getAcceptFilesParametersFromAllowedExtensions(allowedExtensions);
24
32
  // const showMaxWidthInput = hasWidthInput && file && fileFormatIsCorrect && !isVectorImage;
25
33
  const imagePickerClassName = classnames(styles[CSS_CLASSES.imagePicker], className && className);
@@ -70,16 +78,17 @@ const ImagePicker = ({ id, onChange, allowedExtensions = [FILES_EXTENSIONS.WEBP,
70
78
  // if (!widthInputValue || !imageSize.width) return;
71
79
  // widthInputValue > imageSize.width ? setIsInputWidthTooBig(true) : setIsInputWidthTooBig(false);
72
80
  // };
73
- const handleOnDropFile = (event) => {
74
- onDropFile(event);
75
- // getImageWidth(event);
76
- };
77
- const handleOnFileChange = (event) => {
78
- onFileChange(event);
79
- // getImageWidth(event);
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
+ // };
81
90
  const handleOnFileDelete = () => {
82
- setImageSize({ width: 0, height: 0 });
91
+ setImageSize(undefined);
83
92
  onFileDelete();
84
93
  };
85
94
  // const handleOnWidthInputChange = (event: React.ChangeEvent<HTMLInputElement>) => {
@@ -89,17 +98,17 @@ const ImagePicker = ({ id, onChange, allowedExtensions = [FILES_EXTENSIONS.WEBP,
89
98
  // // checkIfInvalideFileFormatErrorOccured(errors) ? setFileFormatIsCorrect(false) : setFileFormatIsCorrect(true);
90
99
  // // file && checkIfInputMaxWidthIsGreaterThenImageWidth();
91
100
  // }, [errors, file, widthInputValue]);
92
- useEffect(() => {
93
- setWidthInputValue(imageSize.width);
94
- }, [imageSize]);
101
+ // useEffect(() => {
102
+ // setWidthInputValue(imageSize.width);
103
+ // }, [imageSize]);
95
104
  return (React.createElement("div", { className: imagePickerClassName },
96
105
  React.createElement("div", { className: `${imagePickerWrapperClassName} ${dragOverStyles.imagePickerWrapper}` },
97
106
  file &&
98
107
  (isPreview ? (React.createElement(React.Fragment, null,
99
108
  React.createElement(ImagePreview, { file: file, isValid: !(errors === null || errors === void 0 ? void 0 : errors.length), onError: onPreviewError, onLoad: handlePreviewLoaded }),
100
109
  React.createElement(UploadedImageItem, { imageSize: imageSize, file: file, isValid: !(errors === null || errors === void 0 ? void 0 : errors.length), onFileDelete: handleOnFileDelete }))) : (React.createElement("div", null, t('No preview')))),
101
- React.createElement(ImageInput, { onDragLeave: onDragLeave, onDragOver: onDragOver, isDragOver: isDragOver, allowedExtensions: allowedExtensions, id: id, onDropFile: handleOnDropFile }),
102
- React.createElement("input", { onChange: handleOnFileChange, id: id, ref: inputRef, type: "file", name: name, className: styles[CSS_CLASSES.imagePickerInput], accept: acceptFiles })),
110
+ React.createElement(ImageInput, { onDragLeave: onDragLeave, onDragOver: onDragOver, isDragOver: isDragOver, allowedExtensions: allowedExtensions, id: id, onDropFile: onDropFile }),
111
+ React.createElement("input", { onChange: onFileChange, id: id, ref: inputRef, type: "file", name: name, className: styles[CSS_CLASSES.imagePickerInput], accept: acceptFiles })),
103
112
  errors && React.createElement(ErrorsList, { errors: errors })));
104
113
  };
105
114
 
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;"}
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;"}
package/build/esm/packages/aurora/src/components/image_picker/types.d.ts CHANGED
@@ -1,20 +1,11 @@
1
1
  import React from 'react';
2
- import { TFilesExtension } from "../file_picker/types";
2
+ import { IFilePicker, TFilesExtension } from "../file_picker/types";
3
3
  export declare type TImagePickerFile = {
4
4
  fileUrl: string;
5
5
  fileName: string;
6
6
  };
7
- export interface IImagePicker {
8
- id: string;
9
- name?: string;
10
- className?: string;
11
- onChange?: (imageList: FileList | null) => void;
12
- allowedExtensions?: TFilesExtension[];
13
- initialFile?: TImagePickerFile;
14
- hasWidthInput?: boolean;
15
- widthInputPostfix?: string;
16
- widthInputLabel?: string;
17
- widthInputHint?: string;
7
+ export interface IImagePicker extends IFilePicker {
8
+ onChange?: (fileList: FileList | null, size?: TImageSize) => void;
18
9
  }
19
10
  export interface ISelectedImagePreview {
20
11
  file: TImagePickerFile;
package/build/esm/packages/aurora/src/components/image_picker/types.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../../../../src/components/image_picker/types.ts"],"names":[],"mappings":"AAAA,OAAkB,OAAO,CAAC;AAC1B,OAAgC,qCAAqC,CAAC"}
1
+ {"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../../../../src/components/image_picker/types.ts"],"names":[],"mappings":"AAAA,OAAkB,OAAO,CAAC;AAC1B,OAA6C,qCAAqC,CAAC"}
package/build/esm/packages/aurora/src/components/xhr_image_picker/index.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- import { TXhrImagePickerProps } from './types';
2
1
  import React from 'react';
3
- declare const XhrImagePicker: React.FC<TXhrImagePickerProps>;
2
+ import { IXhrImagePickerProps } from "./types";
3
+ declare const XhrImagePicker: React.FC<IXhrImagePickerProps>;
4
4
  export default XhrImagePicker;
package/build/esm/packages/aurora/src/components/xhr_image_picker/index.js CHANGED
@@ -4,19 +4,18 @@ import ImagePicker from '../image_picker/index.js';
4
4
  import { REQUEST_TYPES } from '../../../../star_core/build/esm/packages/star_core/src/features/http_requester/http_requester_contants.js';
5
5
  import { useHttpApi } from '../../hooks/use_http_api.js';
6
6
 
7
- const XhrImagePicker = ({ id, url, name, onUploaded, initialFile, 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, allowedExtensions = [FILES_EXTENSIONS.WEBP, FILES_EXTENSIONS.JPG, FILES_EXTENSIONS.PNG, FILES_EXTENSIONS.GIF, FILES_EXTENSIONS.SVG] }) => {
8
8
  const httpApi = useHttpApi();
9
9
  const onChange = async (fileList) => {
10
- console.warn('onChange', fileList[0]);
11
10
  const { response } = httpApi.fetch({
12
11
  url,
13
12
  method: REQUEST_TYPES.post,
14
13
  data: fileList[0]
15
14
  });
16
15
  const data = await response;
17
- onUploaded === null || onUploaded === void 0 ? void 0 : onUploaded(data);
16
+ onUploaded === null || onUploaded === void 0 ? void 0 : onUploaded(data, fileList[0]);
18
17
  };
19
- return (React.createElement(ImagePicker, { id: id, name: name, onChange: onChange, allowedExtensions: allowedExtensions, initialFile: initialFile }));
18
+ return (React.createElement(ImagePicker, { id: id, name: name, onChange: onChange, errors: errors, allowedExtensions: allowedExtensions, initialFile: initialFile }));
20
19
  };
21
20
 
22
21
  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;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;"}
package/build/esm/packages/aurora/src/components/xhr_image_picker/types.d.ts CHANGED
@@ -1,12 +1,7 @@
1
1
  import { IImagePicker } from "../image_picker/types";
2
2
  import { IRequestResponse } from '@dreamcommerce/star_core';
3
- export declare type TXhrImagePickerProps = {
4
- id: string;
3
+ export interface IXhrImagePickerProps extends IImagePicker {
5
4
  url: string;
6
- onUploaded?: (resp: IRequestResponse<any>) => void;
5
+ onUploaded?: (resp: IRequestResponse<any>, file: File) => void;
7
6
  onUploadError?: Function;
8
- } & Pick<IImagePicker, 'id' | 'name' | 'initialFile' | 'allowedExtensions'>;
9
- export interface TFetchXhrImageData {
10
- url: string;
11
- imageFile: File;
12
7
  }
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 flex-shrink: 0;\n color: #3c83ec;\n cursor: pointer;\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 flex: 1;\n max-width: 50%;\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-full-name__3fALB {\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__selected-file-full-name":"main-module_image-picker__selected-file-full-name__3fALB","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}\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"};
5
5
  styleInject(css_248z);
6
6
 
7
7
  export default styles;
package/build/esm/packages/aurora/src/index.d.ts CHANGED
@@ -20,7 +20,7 @@ import ControlCheckboxSwitch from "./components/controls/hoc/control_checkbox_sw
20
20
  import ControlColorPicker from "./components/controls/hoc/control_color_picker";
21
21
  import ControlDatepicker from "./components/controls/hoc/control_date_picker";
22
22
  import ControlFilePicker from "./components/controls/hoc/control_file_picker";
23
- import ControlImagePicker from "./components/controls/hoc/control_image_picker";
23
+ import ControlXhrImagePicker from "./components/controls/hoc/control_xhr_image_picker";
24
24
  import ControlInput from "./components/controls/hoc/control_input";
25
25
  import ControlMultiSelect from "./components/controls/hoc/control_multi_select";
26
26
  import ControlRadio from "./components/controls/hoc/control_radio";
@@ -109,7 +109,7 @@ import XhrImagePicker from "./components/xhr_image_picker";
109
109
  /**
110
110
  * export components
111
111
  */
112
- export { Accordion, Button, Tooltip, ButtonsGroup, Dropdown, Select, MultiSelect, Label, Stack, Control, ControlInput, ControlCheckbox, ControlCheckboxSwitch, ControlRadio, ControlSelect, ControlRange, ControlMultiSelect, ControlTextarea, Gallery, Datepicker, ColorPicker, ControlColorPicker, ControlDatepicker, ControlFilePicker, ControlImagePicker, Heading, Typography, Modal, ModalProvider, AbsoluteModal, RelativeModal, TabsWrapper, Tabs, TabsItem, TabsItemList, TabsPanel, TabsPanelList, SearchList, SearchListInput, SearchListResults, Tag, TagsSelector, ControlTagsSelector, Table, DataTable, Grid, DropdownContext, ModalContext, IconCalendar, Spacing, IconArrow, IconTick, FilePicker, ImagePicker, ControlCellSelector, Hint, ControlRadioGroup, MessageBox, FlashMessenger, useFlashMessenger, Loader, WithLoader, useDropdownContext, FlashMessengerContext, FlashMessagesList, Link, IconTablet, IconMobile, IconLaptop, IconDesktop, IconWarning, useToggle, useSearchList, Slide, SlideWrapper, SlideHeader, SlideContent, SlideFooter, XhrImagePicker };
112
+ export { Accordion, Button, Tooltip, ButtonsGroup, Dropdown, Select, MultiSelect, Label, Stack, Control, ControlInput, ControlCheckbox, ControlCheckboxSwitch, ControlRadio, ControlSelect, ControlRange, ControlMultiSelect, ControlTextarea, Gallery, Datepicker, ColorPicker, ControlColorPicker, ControlDatepicker, ControlFilePicker, ControlXhrImagePicker, Heading, Typography, Modal, ModalProvider, AbsoluteModal, RelativeModal, TabsWrapper, Tabs, TabsItem, TabsItemList, TabsPanel, TabsPanelList, SearchList, SearchListInput, SearchListResults, Tag, TagsSelector, ControlTagsSelector, Table, DataTable, Grid, DropdownContext, ModalContext, IconCalendar, Spacing, IconArrow, IconTick, FilePicker, ImagePicker, ControlCellSelector, Hint, ControlRadioGroup, MessageBox, FlashMessenger, useFlashMessenger, Loader, WithLoader, useDropdownContext, FlashMessengerContext, FlashMessagesList, Link, IconTablet, IconMobile, IconLaptop, IconDesktop, IconWarning, useToggle, useSearchList, Slide, SlideWrapper, SlideHeader, SlideContent, SlideFooter, XhrImagePicker };
113
113
  /**
114
114
  * export types
115
115
  */
package/build/esm/packages/aurora/src/index.js CHANGED
@@ -23,7 +23,8 @@ export { default as ControlDatepicker } from './components/controls/hoc/control_
23
23
  export { default as FilePicker } from './components/file_picker/index.js';
24
24
  export { default as ControlFilePicker } from './components/controls/hoc/control_file_picker/index.js';
25
25
  export { default as ImagePicker } from './components/image_picker/index.js';
26
- export { default as ControlImagePicker } from './components/controls/hoc/control_image_picker/index.js';
26
+ export { default as XhrImagePicker } from './components/xhr_image_picker/index.js';
27
+ export { default as ControlXhrImagePicker } from './components/controls/hoc/control_xhr_image_picker/index.js';
27
28
  export { default as ControlInput } from './components/controls/hoc/control_input/index.js';
28
29
  export { default as MultiSelect } from './components/dropdown/hoc/multiselect/index.js';
29
30
  export { default as ControlMultiSelect } from './components/controls/hoc/control_multi_select/index.js';
@@ -74,5 +75,4 @@ export { TabsPanelList } from './components/tabs/components/tabs_panel_list.js';
74
75
  export { default as TabsWrapper } from './components/tabs/components/tabs_wrapper.js';
75
76
  export { default as Tooltip } from './components/tooltip/index.js';
76
77
  export { default as WithLoader } from './components/with_loader/index.js';
77
- export { default as XhrImagePicker } from './components/xhr_image_picker/index.js';
78
78
  //# sourceMappingURL=index.js.map
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-3",
5
+ "version": "2.6.0-5",
6
6
  "description": "aurora",
7
7
  "author": "k0ssak",
8
8
  "license": "MIT",
package/build/esm/packages/aurora/src/components/controls/hoc/control_image_picker/index.d.ts DELETED
@@ -1,4 +0,0 @@
1
- import { IControlImagePicker } from '../../types';
2
- import React from 'react';
3
- declare const ControlImagePicker: React.FC<IControlImagePicker>;
4
- export default ControlImagePicker;
package/build/esm/packages/aurora/src/components/controls/hoc/control_image_picker/index.js DELETED
@@ -1,18 +0,0 @@
1
- import React from 'react';
2
- import Control from '../../index.js';
3
- import Hint from '../../../hint/index.js';
4
- import ImagePicker from '../../../image_picker/index.js';
5
-
6
- const ControlImagePicker = ({ label, isRequired, id, name, onChange, allowedExtensions, initialFile, className, errors, hint, labelAdditionalInfo, hasWidthInput, widthInputPostfix, widthInputLabel, widthInputHint }) => {
7
- return (React.createElement(Control, { errors: errors, name: name, id: id },
8
- (label || hint) && (React.createElement(Control.Label, { id: id, isRequired: isRequired, additionalInfo: labelAdditionalInfo },
9
- label,
10
- hint && React.createElement(Hint, { hint: hint, spacingLeft: true }))),
11
- React.createElement(Control.Content, null,
12
- React.createElement(Control.Element, null,
13
- React.createElement(ImagePicker, { id: id, name: name, onChange: onChange, allowedExtensions: allowedExtensions, initialFile: initialFile, className: className, hasWidthInput: hasWidthInput, widthInputPostfix: widthInputPostfix, widthInputLabel: widthInputLabel, widthInputHint: widthInputHint }))),
14
- React.createElement(Control.Errors, null)));
15
- };
16
-
17
- export default ControlImagePicker;
18
- //# sourceMappingURL=index.js.map
package/build/esm/packages/aurora/src/components/image_picker/components/selected_image_preview.d.ts DELETED
@@ -1,4 +0,0 @@
1
- import { ISelectedImagePreview } from '../types';
2
- import React from 'react';
3
- declare const SelectedImagePreview: React.FC<ISelectedImagePreview>;
4
- export default SelectedImagePreview;
package/build/esm/packages/aurora/src/components/image_picker/components/selected_image_preview.js DELETED
@@ -1,28 +0,0 @@
1
- import CSS_CLASSES from '@auroraComponents/image_picker/css_classes';
2
- import { FileUtils } from '@dreamcommerce/utilities';
3
- import '../types';
4
- import IconDelete from '@auroraAssets/icon_delete';
5
- import IconWrongFileFormat from '@auroraAssets/icon_wrong_file_format';
6
- import React from 'react';
7
- import styles from '@auroraCss/image_picker/main.module.less';
8
- import { useTranslation } from 'react-i18next';
9
- const SelectedImagePreview = ({ file, isPreview, fileFormatIsCorrect, imageSize, onPreviewError, onFileDelete }) => {
10
- const [t] = useTranslation();
11
- const imageName = FileUtils.getFileName(file.fileName);
12
- const imageExtension = FileUtils.getFileExtension(file.fileName);
13
- const imageWidth = imageSize && imageSize.width;
14
- const imageHeight = imageSize && imageSize.height;
15
- const previewMarkupJsx = fileFormatIsCorrect ? (React.createElement("img", { alt: "", src: (file === null || file === void 0 ? void 0 : file.fileUrl) || '', onError: onPreviewError, className: styles[CSS_CLASSES.imagePickerImagePreview] })) : (React.createElement(IconWrongFileFormat, { className: styles[CSS_CLASSES.imagePickerWrongFileFormatIcon] }));
16
- return (React.createElement("div", null,
17
- isPreview ? (React.createElement("div", { className: styles[CSS_CLASSES.imagePickerImagePreviewWrapper] }, previewMarkupJsx)) : (React.createElement("div", null, t('No preview'))),
18
- React.createElement("div", { className: styles[CSS_CLASSES.imagePickerSelectedFile] },
19
- React.createElement("div", { className: styles[CSS_CLASSES.imagePickerSelectedFileNameWrapper] }, fileFormatIsCorrect && (React.createElement("span", { className: styles[CSS_CLASSES.imagePickerSelectedFileFullName] },
20
- React.createElement("span", null, FileUtils.getShortenFileName(imageName, 10, 5, 1)),
21
- React.createElement("span", null, `.${imageExtension} (${imageWidth}x${imageHeight}px)`)))),
22
- React.createElement("div", { className: styles[CSS_CLASSES.imagePickerSelectedFileRemoveWrapper] },
23
- React.createElement("span", { onClick: onFileDelete, className: styles[CSS_CLASSES.imagePickerDeleteButton] },
24
- React.createElement(IconDelete, { className: styles[CSS_CLASSES.imagePickerDeleteIcon] }),
25
- React.createElement("span", { className: styles[CSS_CLASSES.imagePickerDeleteLabel] }, t('Remove')))))));
26
- };
27
- export default SelectedImagePreview;
28
- //# sourceMappingURL=selected_image_preview.js.map
package/build/esm/packages/aurora/src/components/image_picker/components/selected_image_preview.js.map DELETED
@@ -1 +0,0 @@
1
- {"version":3,"file":"selected_image_preview.js","sourceRoot":"","sources":["../../../../../../../../src/components/image_picker/components/selected_image_preview.tsx"],"names":[],"mappings":"AAAA,OAAO,WAAW,MAAM,4CAA4C,CAAC;AACrE,OAAO,EAAE,SAAS,EAAE,MAAM,0BAA0B,CAAC;AACrD,OAAsC,UAAU,CAAC;AACjD,OAAO,UAAU,MAAM,2BAA2B,CAAC;AACnD,OAAO,mBAAmB,MAAM,sCAAsC,CAAC;AACvE,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,MAAM,MAAM,0CAA0C,CAAC;AAC9D,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAE/C,MAAM,oBAAoB,GAAoC,CAAC,EAC3D,IAAI,EACJ,SAAS,EACT,mBAAmB,EACnB,SAAS,EACT,cAAc,EACd,YAAY,EACf,EAAE,EAAE;IACD,MAAM,CAAC,CAAC,CAAC,GAAG,cAAc,EAAE,CAAC;IAC7B,MAAM,SAAS,GAAG,SAAS,CAAC,WAAW,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;IACvD,MAAM,cAAc,GAAG,SAAS,CAAC,gBAAgB,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;IACjE,MAAM,UAAU,GAAG,SAAS,IAAI,SAAS,CAAC,KAAK,CAAC;IAChD,MAAM,WAAW,GAAG,SAAS,IAAI,SAAS,CAAC,MAAM,CAAC;IAElD,MAAM,gBAAgB,GAAG,mBAAmB,CAAC,CAAC,CAAC,CAC3C,6BAAK,GAAG,EAAC,EAAE,EAAC,GAAG,EAAE,CAAA,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,OAAO,KAAI,EAAE,EAAE,OAAO,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,CAAC,WAAW,CAAC,uBAAuB,CAAC,GAAI,CAC5H,CAAC,CAAC,CAAC,CACA,oBAAC,mBAAmB,IAAC,SAAS,EAAE,MAAM,CAAC,WAAW,CAAC,8BAA8B,CAAC,GAAI,CACzF,CAAC;IAEF,OAAO,CACH;QACK,SAAS,CAAC,CAAC,CAAC,CACT,6BAAK,SAAS,EAAE,MAAM,CAAC,WAAW,CAAC,8BAA8B,CAAC,IAAG,gBAAgB,CAAO,CAC/F,CAAC,CAAC,CAAC,CACA,iCAAM,CAAC,CAAC,YAAY,CAAC,CAAO,CAC/B;QAED,6BAAK,SAAS,EAAE,MAAM,CAAC,WAAW,CAAC,uBAAuB,CAAC;YACvD,6BAAK,SAAS,EAAE,MAAM,CAAC,WAAW,CAAC,kCAAkC,CAAC,IACjE,mBAAmB,IAAI,CACpB,8BAAM,SAAS,EAAE,MAAM,CAAC,WAAW,CAAC,+BAA+B,CAAC;gBAChE,kCAAO,SAAS,CAAC,kBAAkB,CAAC,SAAS,EAAE,EAAE,EAAE,CAAC,EAAE,CAAC,CAAC,CAAQ;gBAChE,kCAAO,IAAI,cAAc,KAAK,UAAU,IAAI,WAAW,KAAK,CAAQ,CACjE,CACV,CACC;YAEN,6BAAK,SAAS,EAAE,MAAM,CAAC,WAAW,CAAC,oCAAoC,CAAC;gBACpE,8BAAM,OAAO,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,CAAC,WAAW,CAAC,uBAAuB,CAAC;oBAC/E,oBAAC,UAAU,IAAC,SAAS,EAAE,MAAM,CAAC,WAAW,CAAC,qBAAqB,CAAC,GAAI;oBACpE,8BAAM,SAAS,EAAE,MAAM,CAAC,WAAW,CAAC,sBAAsB,CAAC,IAAG,CAAC,CAAC,QAAQ,CAAC,CAAQ,CAC9E,CACL,CACJ,CACJ,CACT,CAAC;AACN,CAAC,CAAC;AAEF,eAAe,oBAAoB,CAAC"}