@dreamcommerce/aurora 3.1.31 → 3.1.32
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/build/cjs/packages/aurora/src/components/controls/xhr_image_picker_control/xhr_image_picker_control.js +5 -14
- package/build/cjs/packages/aurora/src/components/controls/xhr_image_picker_control/xhr_image_picker_control.js.map +1 -1
- package/build/cjs/packages/aurora/src/components/image_picker/components/image_picker_preview.js +0 -2
- package/build/cjs/packages/aurora/src/components/image_picker/components/image_picker_preview.js.map +1 -1
- package/build/cjs/packages/aurora/src/components/image_picker/image_picker.js +15 -81
- package/build/cjs/packages/aurora/src/components/image_picker/image_picker.js.map +1 -1
- package/build/cjs/packages/aurora/src/components/image_picker/use_image_picker.js +36 -102
- package/build/cjs/packages/aurora/src/components/image_picker/use_image_picker.js.map +1 -1
- package/build/cjs/packages/aurora/src/components/modal/components/modal/modal_content.js +4 -2
- package/build/cjs/packages/aurora/src/components/modal/components/modal/modal_content.js.map +1 -1
- package/build/cjs/packages/aurora/src/components/modal/modal_variants.js +1 -1
- package/build/cjs/packages/aurora/src/components/xhr_image_picker/xhr_image_picker.js +114 -123
- package/build/cjs/packages/aurora/src/components/xhr_image_picker/xhr_image_picker.js.map +1 -1
- package/build/cjs/packages/aurora/tailwind.config.js +4 -4
- package/build/esm/packages/aurora/src/components/controls/xhr_image_picker_control/xhr_image_picker_control.js +6 -15
- package/build/esm/packages/aurora/src/components/controls/xhr_image_picker_control/xhr_image_picker_control.js.map +1 -1
- package/build/esm/packages/aurora/src/components/controls/xhr_image_picker_control/xhr_image_picker_control_types.d.ts +3 -5
- package/build/esm/packages/aurora/src/components/controls/xhr_image_picker_control/xhr_image_picker_control_types.js +0 -1
- package/build/esm/packages/aurora/src/components/controls/xhr_image_picker_control/xhr_image_picker_control_types.js.map +1 -1
- package/build/esm/packages/aurora/src/components/image_picker/components/image_picker_preview.d.ts +1 -2
- package/build/esm/packages/aurora/src/components/image_picker/components/image_picker_preview.js +0 -2
- package/build/esm/packages/aurora/src/components/image_picker/components/image_picker_preview.js.map +1 -1
- package/build/esm/packages/aurora/src/components/image_picker/image_picker.js +17 -83
- package/build/esm/packages/aurora/src/components/image_picker/image_picker.js.map +1 -1
- package/build/esm/packages/aurora/src/components/image_picker/image_picker_types.d.ts +16 -24
- package/build/esm/packages/aurora/src/components/image_picker/image_picker_types.js.map +1 -1
- package/build/esm/packages/aurora/src/components/image_picker/use_image_picker.d.ts +1 -1
- package/build/esm/packages/aurora/src/components/image_picker/use_image_picker.js +37 -103
- package/build/esm/packages/aurora/src/components/image_picker/use_image_picker.js.map +1 -1
- package/build/esm/packages/aurora/src/components/modal/components/modal/modal_content.js +4 -2
- package/build/esm/packages/aurora/src/components/modal/components/modal/modal_content.js.map +1 -1
- package/build/esm/packages/aurora/src/components/modal/modal_variants.js +1 -1
- package/build/esm/packages/aurora/src/components/xhr_image_picker/xhr_image_picker.js +115 -124
- package/build/esm/packages/aurora/src/components/xhr_image_picker/xhr_image_picker.js.map +1 -1
- package/build/esm/packages/aurora/src/components/xhr_image_picker/xhr_image_picker_types.d.ts +5 -7
- package/build/esm/packages/aurora/src/components/xhr_image_picker/xhr_image_picker_types.js.map +1 -1
- package/build/esm/packages/aurora/tailwind.config.js +4 -4
- package/build/index.css +1 -1
- package/build/tailwind.config.js +4 -4
- package/package.json +1 -1
|
@@ -25,23 +25,16 @@ var XhrImagePickerControl = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
25
25
|
className = _ref.className,
|
|
26
26
|
errors = _ref.errors,
|
|
27
27
|
tooltip = _ref.tooltip,
|
|
28
|
-
onUploaded = _ref.onUploaded,
|
|
29
28
|
helperText = _ref.helperText,
|
|
30
|
-
onImageSizeUpdated = _ref.onImageSizeUpdated,
|
|
31
29
|
ImageEditor = _ref.ImageEditor,
|
|
32
30
|
onError = _ref.onError;
|
|
33
|
-
var handleControlError = function
|
|
31
|
+
var handleControlError = React.useCallback(function (errors) {
|
|
34
32
|
onError === null || onError === void 0 ? void 0 : onError(errors);
|
|
35
|
-
};
|
|
36
|
-
var handleControlChange = function
|
|
37
|
-
var fileList = file.fileList,
|
|
38
|
-
fileAsDataUrl = file.fileAsDataUrl;
|
|
33
|
+
}, [onError]);
|
|
34
|
+
var handleControlChange = React.useCallback(function (val) {
|
|
39
35
|
onError === null || onError === void 0 ? void 0 : onError([]);
|
|
40
|
-
onChange === null || onChange === void 0 ? void 0 : onChange(
|
|
41
|
-
|
|
42
|
-
fileAsDataUrl: fileAsDataUrl
|
|
43
|
-
});
|
|
44
|
-
};
|
|
36
|
+
onChange === null || onChange === void 0 ? void 0 : onChange(val);
|
|
37
|
+
}, [onChange, onError]);
|
|
45
38
|
return /*#__PURE__*/React__default['default'].createElement(control.Control, {
|
|
46
39
|
classname: "aurora-flex-col"
|
|
47
40
|
}, label$1 ? (/*#__PURE__*/React__default['default'].createElement(label.Label, {
|
|
@@ -59,8 +52,6 @@ var XhrImagePickerControl = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
59
52
|
initialFile: initialFile,
|
|
60
53
|
className: className,
|
|
61
54
|
errors: errors,
|
|
62
|
-
onUploaded: onUploaded,
|
|
63
|
-
onImageSizeUpdated: onImageSizeUpdated,
|
|
64
55
|
ImageEditor: ImageEditor,
|
|
65
56
|
ref: ref
|
|
66
57
|
}), helperText ? /*#__PURE__*/React__default['default'].createElement(helper_text.HelperText, null, helperText) : null);
|
|
@@ -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;
|
|
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;"}
|
package/build/cjs/packages/aurora/src/components/image_picker/components/image_picker_preview.js
CHANGED
|
@@ -10,7 +10,6 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
|
10
10
|
|
|
11
11
|
var ImagePickerPreview = function ImagePickerPreview(_ref) {
|
|
12
12
|
var file = _ref.file,
|
|
13
|
-
onError = _ref.onError,
|
|
14
13
|
onLoad = _ref.onLoad;
|
|
15
14
|
return /*#__PURE__*/React__default['default'].createElement("div", {
|
|
16
15
|
className: "aurora-rounded-4 aurora-w-full aurora-h-full aurora-min-h-16 aurora-flex aurora-justify-center aurora-items-center"
|
|
@@ -18,7 +17,6 @@ var ImagePickerPreview = function ImagePickerPreview(_ref) {
|
|
|
18
17
|
className: "aurora-rounded-4 aurora-w-full aurora-h-full aurora-object-contain",
|
|
19
18
|
alt: file.fileName,
|
|
20
19
|
src: (file === null || file === void 0 ? void 0 : file.fileUrl) || '',
|
|
21
|
-
onError: onError,
|
|
22
20
|
onLoad: onLoad
|
|
23
21
|
}));
|
|
24
22
|
};
|
package/build/cjs/packages/aurora/src/components/image_picker/components/image_picker_preview.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;AACA;"}
|
|
@@ -29,94 +29,28 @@ var ImagePicker = /*#__PURE__*/React.memo(/*#__PURE__*/React.forwardRef(function
|
|
|
29
29
|
_ref$allowedExtension = _ref.allowedExtensions,
|
|
30
30
|
allowedExtensions = _ref$allowedExtension === void 0 ? [image_picker_constants.IMAGE_PICKER_EXTENSIONS.WEBP, image_picker_constants.IMAGE_PICKER_EXTENSIONS.JPG, image_picker_constants.IMAGE_PICKER_EXTENSIONS.PNG, image_picker_constants.IMAGE_PICKER_EXTENSIONS.GIF, image_picker_constants.IMAGE_PICKER_EXTENSIONS.SVG, image_picker_constants.IMAGE_PICKER_EXTENSIONS.JPEG] : _ref$allowedExtension,
|
|
31
31
|
allowedExtensionsLabel = _ref.allowedExtensionsLabel,
|
|
32
|
-
initialFile = _ref.initialFile,
|
|
33
32
|
name = _ref.name,
|
|
34
|
-
onImageSizeUpdated = _ref.onImageSizeUpdated,
|
|
35
33
|
topButtons = _ref.topButtons,
|
|
36
|
-
|
|
34
|
+
file = _ref.file;
|
|
37
35
|
var _useTranslation = useTranslation.useTranslation(),
|
|
38
36
|
_useTranslation2 = _rollupPluginBabelHelpers.slicedToArray(_useTranslation, 1),
|
|
39
37
|
t = _useTranslation2[0];
|
|
40
38
|
var inputRef = /*#__PURE__*/React.createRef();
|
|
41
|
-
var handleOnChange = function handleOnChange(ev) {
|
|
42
|
-
var _ev$fileList;
|
|
43
|
-
onChange === null || onChange === void 0 ? void 0 : onChange(ev);
|
|
44
|
-
if ((_ev$fileList = ev.fileList) !== null && _ev$fileList !== void 0 && _ev$fileList.length) {
|
|
45
|
-
setImageSizeBasedOnUrl(URL.createObjectURL(ev.fileList[0]));
|
|
46
|
-
}
|
|
47
|
-
};
|
|
48
39
|
var _useImagePicker = use_image_picker.useImagePicker({
|
|
49
|
-
|
|
50
|
-
onChange: handleOnChange,
|
|
40
|
+
onChange: onChange,
|
|
51
41
|
allowedExtensions: allowedExtensions,
|
|
52
|
-
onError: onError
|
|
53
|
-
inputRef: inputRef
|
|
42
|
+
onError: onError
|
|
54
43
|
}),
|
|
44
|
+
updateFile = _useImagePicker.updateFile,
|
|
55
45
|
onDropFile = _useImagePicker.onDropFile,
|
|
56
|
-
onFileChange = _useImagePicker.onFileChange,
|
|
57
46
|
onDragOver = _useImagePicker.onDragOver,
|
|
58
47
|
onDragLeave = _useImagePicker.onDragLeave,
|
|
59
|
-
onFileDelete = _useImagePicker.onFileDelete,
|
|
60
|
-
onPreviewError = _useImagePicker.onPreviewError,
|
|
61
|
-
changeFile = _useImagePicker.changeFile,
|
|
62
|
-
file = _useImagePicker.file,
|
|
63
|
-
isPreview = _useImagePicker.isPreview,
|
|
64
48
|
isDragOver = _useImagePicker.isDragOver;
|
|
65
|
-
var _useState = React.useState(undefined),
|
|
66
|
-
_useState2 = _rollupPluginBabelHelpers.slicedToArray(_useState, 2),
|
|
67
|
-
imageSize = _useState2[0],
|
|
68
|
-
setImageSize = _useState2[1];
|
|
69
49
|
var acceptFiles = image_picker_utils.getAcceptFilesParametersFromAllowedExtensions(allowedExtensions);
|
|
70
|
-
React.useEffect(function () {
|
|
71
|
-
initialFile && setImageSizeBasedOnUrl(initialFile === null || initialFile === void 0 ? void 0 : initialFile.fileUrl);
|
|
72
|
-
}, [initialFile]);
|
|
73
|
-
React.useEffect(function () {
|
|
74
|
-
if (!editedImageResult) return;
|
|
75
|
-
var fileList = createFileList(editedImageResult);
|
|
76
|
-
changeFile(fileList);
|
|
77
|
-
}, [editedImageResult]);
|
|
78
|
-
var createFileList = function createFileList(file) {
|
|
79
|
-
var fileArray = [];
|
|
80
|
-
fileArray.push(file);
|
|
81
|
-
return fileArray;
|
|
82
|
-
};
|
|
83
|
-
var setImageSizeBasedOnUrl = function setImageSizeBasedOnUrl(fileUrl) {
|
|
84
|
-
createImageFromUrl(fileUrl).then(function (image) {
|
|
85
|
-
var size = {
|
|
86
|
-
width: image.naturalWidth,
|
|
87
|
-
height: image.naturalHeight
|
|
88
|
-
};
|
|
89
|
-
setImageSize(size);
|
|
90
|
-
onImageSizeUpdated === null || onImageSizeUpdated === void 0 ? void 0 : onImageSizeUpdated(size);
|
|
91
|
-
});
|
|
92
|
-
};
|
|
93
|
-
var createImageFromUrl = /*#__PURE__*/function () {
|
|
94
|
-
var _ref2 = _rollupPluginBabelHelpers.asyncToGenerator(/*#__PURE__*/_rollupPluginBabelHelpers.regeneratorRuntime().mark(function _callee(url) {
|
|
95
|
-
var img;
|
|
96
|
-
return _rollupPluginBabelHelpers.regeneratorRuntime().wrap(function _callee$(_context) {
|
|
97
|
-
while (1) switch (_context.prev = _context.next) {
|
|
98
|
-
case 0:
|
|
99
|
-
img = new Image();
|
|
100
|
-
img.src = url;
|
|
101
|
-
_context.next = 4;
|
|
102
|
-
return img.decode();
|
|
103
|
-
case 4:
|
|
104
|
-
return _context.abrupt("return", img);
|
|
105
|
-
case 5:
|
|
106
|
-
case "end":
|
|
107
|
-
return _context.stop();
|
|
108
|
-
}
|
|
109
|
-
}, _callee);
|
|
110
|
-
}));
|
|
111
|
-
return function createImageFromUrl(_x) {
|
|
112
|
-
return _ref2.apply(this, arguments);
|
|
113
|
-
};
|
|
114
|
-
}();
|
|
115
50
|
var handleOnFileDelete = function handleOnFileDelete() {
|
|
116
|
-
|
|
117
|
-
setImageSize(undefined);
|
|
118
|
-
onImageSizeUpdated === null || onImageSizeUpdated === void 0 ? void 0 : onImageSizeUpdated(undefined);
|
|
51
|
+
updateFile(null);
|
|
119
52
|
};
|
|
53
|
+
var isPreview = file !== null;
|
|
120
54
|
return /*#__PURE__*/React__default['default'].createElement("div", {
|
|
121
55
|
className: "aurora-mb-1"
|
|
122
56
|
}, /*#__PURE__*/React__default['default'].createElement("div", {
|
|
@@ -146,17 +80,16 @@ var ImagePicker = /*#__PURE__*/React.memo(/*#__PURE__*/React.forwardRef(function
|
|
|
146
80
|
}, topButtons && /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, topButtons), /*#__PURE__*/React__default['default'].createElement("div", {
|
|
147
81
|
className: "aurora-relative"
|
|
148
82
|
}, /*#__PURE__*/React__default['default'].createElement(image_picker_preview.ImagePickerPreview, {
|
|
149
|
-
file: file
|
|
150
|
-
onError: onPreviewError
|
|
83
|
+
file: file
|
|
151
84
|
})), /*#__PURE__*/React__default['default'].createElement(uploaded_image_picker_item.UploadedImagePickerItem, {
|
|
152
|
-
imageSize:
|
|
85
|
+
imageSize: file.size,
|
|
153
86
|
file: file,
|
|
154
87
|
isValid: !(errors !== null && errors !== void 0 && errors.length),
|
|
155
88
|
onFileDelete: handleOnFileDelete
|
|
156
89
|
})), isDragOver && /*#__PURE__*/React__default['default'].createElement(image_picker_drag_over_placeholder.ImagePickerDragOverPlaceholder, {
|
|
157
90
|
onDropFile: onDropFile
|
|
158
91
|
}))) : (/*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, /*#__PURE__*/React__default['default'].createElement("div", null, "".concat(t('No preview'))), /*#__PURE__*/React__default['default'].createElement(image_picker_delete_button.ImagePickerDeleteButton, {
|
|
159
|
-
onFileDelete:
|
|
92
|
+
onFileDelete: handleOnFileDelete
|
|
160
93
|
}))) : (/*#__PURE__*/React__default['default'].createElement(image_picker_input.ImagePickerInput, {
|
|
161
94
|
isDragOver: isDragOver,
|
|
162
95
|
allowedExtensions: allowedExtensions,
|
|
@@ -165,7 +98,11 @@ var ImagePicker = /*#__PURE__*/React.memo(/*#__PURE__*/React.forwardRef(function
|
|
|
165
98
|
onDropFile: onDropFile
|
|
166
99
|
})), /*#__PURE__*/React__default['default'].createElement("input", {
|
|
167
100
|
className: "aurora-hidden",
|
|
168
|
-
onChange:
|
|
101
|
+
onChange: function onChange(e) {
|
|
102
|
+
var _e$target$files$, _e$target$files;
|
|
103
|
+
updateFile((_e$target$files$ = (_e$target$files = e.target.files) === null || _e$target$files === void 0 ? void 0 : _e$target$files[0]) !== null && _e$target$files$ !== void 0 ? _e$target$files$ : null);
|
|
104
|
+
e.target.value = '';
|
|
105
|
+
},
|
|
169
106
|
id: id,
|
|
170
107
|
ref: inputRef,
|
|
171
108
|
type: "file",
|
|
@@ -174,10 +111,7 @@ var ImagePicker = /*#__PURE__*/React.memo(/*#__PURE__*/React.forwardRef(function
|
|
|
174
111
|
}))), errors && /*#__PURE__*/React__default['default'].createElement(error_list.ErrorList, {
|
|
175
112
|
errors: errors
|
|
176
113
|
}));
|
|
177
|
-
})
|
|
178
|
-
var _prev$initialFile, _curr$initialFile, _prev$initialFile2, _curr$initialFile2;
|
|
179
|
-
return ((_prev$initialFile = prev.initialFile) === null || _prev$initialFile === void 0 ? void 0 : _prev$initialFile.fileUrl) === ((_curr$initialFile = curr.initialFile) === null || _curr$initialFile === void 0 ? void 0 : _curr$initialFile.fileUrl) && ((_prev$initialFile2 = prev.initialFile) === null || _prev$initialFile2 === void 0 ? void 0 : _prev$initialFile2.fileName) === ((_curr$initialFile2 = curr.initialFile) === null || _curr$initialFile2 === void 0 ? void 0 : _curr$initialFile2.fileName) && prev.errors === curr.errors && prev.editedImageResult === curr.editedImageResult && prev.topButtons === curr.topButtons;
|
|
180
|
-
});
|
|
114
|
+
}));
|
|
181
115
|
ImagePicker.displayName = 'ImagePicker';
|
|
182
116
|
|
|
183
117
|
exports.ImagePicker = ImagePicker;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA,6BAA6B,iEAAqE;AAClG;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
|
|
@@ -9,51 +9,14 @@ var image_picker_constants = require('./image_picker_constants.js');
|
|
|
9
9
|
|
|
10
10
|
var useImagePicker = function useImagePicker(_ref) {
|
|
11
11
|
var onChange = _ref.onChange,
|
|
12
|
-
initialFile = _ref.initialFile,
|
|
13
12
|
allowedExtensions = _ref.allowedExtensions,
|
|
14
|
-
inputRef = _ref.inputRef,
|
|
15
13
|
onError = _ref.onError;
|
|
16
|
-
var
|
|
17
|
-
var _useState = React.useState(initialFile),
|
|
14
|
+
var _useState = React.useState(false),
|
|
18
15
|
_useState2 = _rollupPluginBabelHelpers.slicedToArray(_useState, 2),
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
var _useState3 = React.useState(false),
|
|
22
|
-
_useState4 = _rollupPluginBabelHelpers.slicedToArray(_useState3, 2),
|
|
23
|
-
isDragOver = _useState4[0],
|
|
24
|
-
setDragOver = _useState4[1];
|
|
25
|
-
var _useState5 = React.useState(true),
|
|
26
|
-
_useState6 = _rollupPluginBabelHelpers.slicedToArray(_useState5, 2),
|
|
27
|
-
isPreview = _useState6[0],
|
|
28
|
-
setPreview = _useState6[1];
|
|
29
|
-
var reader = React.useRef(new FileReader());
|
|
16
|
+
isDragOver = _useState2[0],
|
|
17
|
+
setDragOver = _useState2[1];
|
|
30
18
|
var dragTimeoutRef = React.useRef(null);
|
|
31
|
-
React.
|
|
32
|
-
reader.current.result && getDataUrlFromFile(reader.current.result);
|
|
33
|
-
reader.current.addEventListener('load', function () {
|
|
34
|
-
return getDataUrlFromFile(reader.current.result);
|
|
35
|
-
}, false);
|
|
36
|
-
return function () {
|
|
37
|
-
return reader.current.removeEventListener('load', function () {
|
|
38
|
-
return getDataUrlFromFile(reader.current.result);
|
|
39
|
-
});
|
|
40
|
-
};
|
|
41
|
-
}, []);
|
|
42
|
-
React.useEffect(function () {
|
|
43
|
-
setFile(initialFile);
|
|
44
|
-
}, [initialFile]);
|
|
45
|
-
var onDropFile = function onDropFile(event) {
|
|
46
|
-
onError === null || onError === void 0 ? void 0 : onError([]);
|
|
47
|
-
event.stopPropagation();
|
|
48
|
-
event.preventDefault();
|
|
49
|
-
setDragOver(false);
|
|
50
|
-
var files = event.dataTransfer.files;
|
|
51
|
-
if (!files.length) return;
|
|
52
|
-
var isValid = validateFileExtension(allowedExtensions, files[0].type);
|
|
53
|
-
if (!isValid) return;
|
|
54
|
-
updateFile(files);
|
|
55
|
-
};
|
|
56
|
-
var validateFileExtension = function validateFileExtension(allowedExtensions, mimeType) {
|
|
19
|
+
var validateFileExtension = React.useCallback(function (allowedExtensions, mimeType) {
|
|
57
20
|
if (!allowedExtensions) return true;
|
|
58
21
|
var isValid = allowedExtensions.reduce(function (acc, extension) {
|
|
59
22
|
return acc ? acc : image_picker_constants.MIME_TYPE_TO_FILE_EXTENSIONS[mimeType] === extension;
|
|
@@ -62,41 +25,28 @@ var useImagePicker = function useImagePicker(_ref) {
|
|
|
62
25
|
onError === null || onError === void 0 ? void 0 : onError([i18n.i18n.t(image_picker_constants.IMAGE_PICKER_ERROR.invalidFileFormat)]);
|
|
63
26
|
}
|
|
64
27
|
return isValid;
|
|
65
|
-
};
|
|
66
|
-
var
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
var updateFile = function updateFile(files) {
|
|
74
|
-
if (files !== null && files !== void 0 && files.length) {
|
|
75
|
-
fileListRef.current = files;
|
|
76
|
-
reader.current.readAsDataURL(files[0]);
|
|
77
|
-
setFile({
|
|
78
|
-
fileName: files === null || files === void 0 ? void 0 : files[0].name,
|
|
79
|
-
fileUrl: URL.createObjectURL(files === null || files === void 0 ? void 0 : files[0])
|
|
80
|
-
});
|
|
81
|
-
var isValid = validateFileExtension(allowedExtensions, files[0].type);
|
|
82
|
-
if (isValid) onChange === null || onChange === void 0 ? void 0 : onChange({
|
|
83
|
-
fileList: files
|
|
84
|
-
});
|
|
28
|
+
}, [onError]);
|
|
29
|
+
var updateFile = React.useCallback(function (file) {
|
|
30
|
+
if (file) {
|
|
31
|
+
var isValid = validateFileExtension(allowedExtensions, file.type);
|
|
32
|
+
if (isValid) {
|
|
33
|
+
onError === null || onError === void 0 ? void 0 : onError([]);
|
|
34
|
+
onChange === null || onChange === void 0 ? void 0 : onChange(file);
|
|
35
|
+
}
|
|
85
36
|
} else {
|
|
86
|
-
|
|
87
|
-
onChange === null || onChange === void 0 ? void 0 : onChange(
|
|
88
|
-
fileList: files
|
|
89
|
-
});
|
|
37
|
+
onError === null || onError === void 0 ? void 0 : onError([]);
|
|
38
|
+
onChange === null || onChange === void 0 ? void 0 : onChange(null);
|
|
90
39
|
}
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
40
|
+
}, [allowedExtensions, onChange, onError, validateFileExtension]);
|
|
41
|
+
var onDropFile = React.useCallback(function (event) {
|
|
42
|
+
event.stopPropagation();
|
|
43
|
+
event.preventDefault();
|
|
44
|
+
setDragOver(false);
|
|
45
|
+
var files = event.dataTransfer.files;
|
|
46
|
+
if (!files.length) return;
|
|
47
|
+
updateFile(files[0]);
|
|
48
|
+
}, [updateFile]);
|
|
49
|
+
var onDragOver = React.useCallback(function (event) {
|
|
100
50
|
var dt = event.dataTransfer;
|
|
101
51
|
if (!dt.types || !(dt.types.indexOf ? dt.types.indexOf('Files') != -1 : dt.types.includes('Files'))) {
|
|
102
52
|
return;
|
|
@@ -106,38 +56,22 @@ var useImagePicker = function useImagePicker(_ref) {
|
|
|
106
56
|
event.dataTransfer.dropEffect = 'copy';
|
|
107
57
|
setDragOver(true);
|
|
108
58
|
dragTimeoutRef.current && window.clearTimeout(dragTimeoutRef.current);
|
|
109
|
-
};
|
|
110
|
-
var onDragLeave = function
|
|
59
|
+
}, []);
|
|
60
|
+
var onDragLeave = React.useCallback(function () {
|
|
111
61
|
dragTimeoutRef.current = setTimeout(function () {
|
|
112
62
|
setDragOver(false);
|
|
113
63
|
dragTimeoutRef.current = null;
|
|
114
64
|
}, 25);
|
|
115
|
-
};
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
};
|
|
126
|
-
var onPreviewError = function onPreviewError() {
|
|
127
|
-
setPreview(false);
|
|
128
|
-
};
|
|
129
|
-
return {
|
|
130
|
-
onDropFile: onDropFile,
|
|
131
|
-
onFileChange: onFileChange,
|
|
132
|
-
onDragOver: onDragOver,
|
|
133
|
-
onDragLeave: onDragLeave,
|
|
134
|
-
onFileDelete: onFileDelete,
|
|
135
|
-
onPreviewError: onPreviewError,
|
|
136
|
-
changeFile: changeFile,
|
|
137
|
-
file: file,
|
|
138
|
-
isPreview: isPreview,
|
|
139
|
-
isDragOver: isDragOver
|
|
140
|
-
};
|
|
65
|
+
}, []);
|
|
66
|
+
return React.useMemo(function () {
|
|
67
|
+
return {
|
|
68
|
+
updateFile: updateFile,
|
|
69
|
+
onDropFile: onDropFile,
|
|
70
|
+
onDragOver: onDragOver,
|
|
71
|
+
onDragLeave: onDragLeave,
|
|
72
|
+
isDragOver: isDragOver
|
|
73
|
+
};
|
|
74
|
+
}, [updateFile, isDragOver, onDragLeave, onDragOver, onDropFile]);
|
|
141
75
|
};
|
|
142
76
|
|
|
143
77
|
exports.useImagePicker = useImagePicker;
|
|
@@ -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;
|
|
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;"}
|
|
@@ -32,7 +32,9 @@ var ModalContent = /*#__PURE__*/React__default['default'].forwardRef(function (_
|
|
|
32
32
|
var _useScroll = use_scroll.useScroll(contentRef),
|
|
33
33
|
atBottom = _useScroll.atBottom,
|
|
34
34
|
hasScroll = _useScroll.hasScroll;
|
|
35
|
-
return /*#__PURE__*/React__default['default'].createElement(
|
|
35
|
+
return /*#__PURE__*/React__default['default'].createElement("div", {
|
|
36
|
+
className: "aurora-fixed aurora-w-full aurora-h-full aurora-flex aurora-z-[1000] aurora-top-0 aurora-left-0 aurora-pointer-events-none"
|
|
37
|
+
}, /*#__PURE__*/React__default['default'].createElement(index.Content, {
|
|
36
38
|
onEscapeKeyDown: function onEscapeKeyDown(e) {
|
|
37
39
|
if (!closeOnEscButton) e.preventDefault();
|
|
38
40
|
},
|
|
@@ -59,7 +61,7 @@ var ModalContent = /*#__PURE__*/React__default['default'].forwardRef(function (_
|
|
|
59
61
|
className: cn.cn('', {
|
|
60
62
|
'aurora-border-t': hasScroll && !atBottom
|
|
61
63
|
})
|
|
62
|
-
}, footer)));
|
|
64
|
+
}, footer))));
|
|
63
65
|
});
|
|
64
66
|
ModalContent.displayName = 'ModalContent';
|
|
65
67
|
|
package/build/cjs/packages/aurora/src/components/modal/components/modal/modal_content.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,oBAAoB,wEAA4E;AAChG;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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,oBAAoB,wEAA4E;AAChG;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
|
|
@@ -6,7 +6,7 @@ var _rollupPluginBabelHelpers = require('../../../../../_virtual/_rollupPluginBa
|
|
|
6
6
|
var index = require('../../../../../external/class-variance-authority/dist/index.mjs.js');
|
|
7
7
|
var modal_constants = require('./modal_constants.js');
|
|
8
8
|
|
|
9
|
-
var modalVariants = index.cva('aurora-flex aurora-flex-col aurora-w-full aurora-max-h-[90vh] aurora-
|
|
9
|
+
var modalVariants = index.cva('aurora-flex aurora-flex-col aurora-w-full aurora-max-h-[90vh] aurora-bg aurora-rounded-16 aurora-shadow-xl data-[state=open]:aurora-animate-modal-slide-in data-[state=closed]:aurora-animate-modal-slide-out aurora-z-[1000] aurora-m-auto aurora-pointer-events-auto js__modal', {
|
|
10
10
|
variants: {
|
|
11
11
|
width: _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty({}, modal_constants.MODAL_WIDTH_VARIANT.s, 'aurora-max-w-[25rem]'), modal_constants.MODAL_WIDTH_VARIANT.m, 'aurora-max-w-[40rem]'), modal_constants.MODAL_WIDTH_VARIANT.l, 'aurora-max-w-[61rem]')
|
|
12
12
|
},
|