@dreamcommerce/aurora 2.19.0-2 → 2.19.0-3

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 (20) hide show
  1. package/build/cjs/packages/aurora/src/components/file_picker/use_file_picker.js +20 -18
  2. package/build/cjs/packages/aurora/src/components/file_picker/use_file_picker.js.map +1 -1
  3. package/build/cjs/packages/aurora/src/components/image_picker/index.js +38 -34
  4. package/build/cjs/packages/aurora/src/components/image_picker/index.js.map +1 -1
  5. package/build/cjs/packages/aurora/src/components/loader/index.js +1 -1
  6. package/build/cjs/packages/aurora/src/components/with_loader/index.js +1 -1
  7. package/build/cjs/packages/aurora/src/components/xhr_image_picker/index.js +58 -30
  8. package/build/cjs/packages/aurora/src/components/xhr_image_picker/index.js.map +1 -1
  9. package/build/cjs/packages/aurora/src/index.js +4 -4
  10. package/build/esm/packages/aurora/src/components/file_picker/use_file_picker.js +20 -18
  11. package/build/esm/packages/aurora/src/components/file_picker/use_file_picker.js.map +1 -1
  12. package/build/esm/packages/aurora/src/components/image_picker/index.js +39 -35
  13. package/build/esm/packages/aurora/src/components/image_picker/index.js.map +1 -1
  14. package/build/esm/packages/aurora/src/components/loader/index.js +1 -1
  15. package/build/esm/packages/aurora/src/components/with_loader/index.js +1 -1
  16. package/build/esm/packages/aurora/src/components/xhr_image_picker/index.d.ts +1 -1
  17. package/build/esm/packages/aurora/src/components/xhr_image_picker/index.js +58 -30
  18. package/build/esm/packages/aurora/src/components/xhr_image_picker/index.js.map +1 -1
  19. package/build/esm/packages/aurora/src/index.js +2 -2
  20. package/package.json +1 -1
@@ -46,16 +46,20 @@ var useFilePicker = function useFilePicker(_ref) {
46
46
  setPreview = _useState12[1];
47
47
 
48
48
  var reader = React.useRef(new FileReader());
49
- var isMounted = React.useRef(true); // Nowy ref do śledzenia czy komponent jest zamontowany
50
-
49
+ var isMountedRef = React.useRef(true);
51
50
  React.useEffect(function () {
52
- isMounted.current = true; // Ustawienie ref na true podczas montowania komponentu
51
+ isMountedRef.current = true;
53
52
 
54
- reader.current.addEventListener('load', handleFileRead, false);
55
- return function () {
56
- isMounted.current = false; // Ustawienie ref na false podczas odmontowywania komponentu
53
+ var loadListener = function loadListener() {
54
+ if (isMountedRef.current) {
55
+ getDataUrlFromFile(reader.current.result);
56
+ }
57
+ };
57
58
 
58
- reader.current.removeEventListener('load', handleFileRead);
59
+ reader.current.addEventListener('load', loadListener, false);
60
+ return function () {
61
+ isMountedRef.current = false;
62
+ reader.current.removeEventListener('load', loadListener);
59
63
  };
60
64
  }, []);
61
65
  React.useEffect(function () {
@@ -65,7 +69,7 @@ var useFilePicker = function useFilePicker(_ref) {
65
69
  initialErrors && setErrors(initialErrors);
66
70
  }, [initialErrors]);
67
71
  React.useEffect(function () {
68
- if (fileAsDataUrl && isMounted.current) {
72
+ if (fileAsDataUrl && isMountedRef.current) {
69
73
  onChange === null || onChange === void 0 || onChange({
70
74
  fileList: fileList,
71
75
  fileAsDataUrl: fileAsDataUrl
@@ -73,12 +77,6 @@ var useFilePicker = function useFilePicker(_ref) {
73
77
  }
74
78
  }, [fileAsDataUrl]);
75
79
 
76
- var handleFileRead = function handleFileRead() {
77
- if (isMounted.current) {
78
- setFileAsDataUrl(reader.current.result);
79
- }
80
- };
81
-
82
80
  var onDropFile = function onDropFile(event) {
83
81
  setErrors([]);
84
82
  event.stopPropagation();
@@ -125,20 +123,24 @@ var useFilePicker = function useFilePicker(_ref) {
125
123
  });
126
124
  var isValid = validateFileExtension(allowedExtensions, files[0].type);
127
125
  if (isValid) onChange === null || onChange === void 0 || onChange({
128
- fileList: files,
129
- fileAsDataUrl: reader.current.result
126
+ fileList: files
130
127
  });
131
128
  } else {
132
129
  setFile(undefined);
133
130
  onChange === null || onChange === void 0 || onChange({
134
- fileList: files,
135
- fileAsDataUrl: null
131
+ fileList: files
136
132
  });
137
133
  }
138
134
 
139
135
  setPreview(true);
140
136
  };
141
137
 
138
+ var getDataUrlFromFile = function getDataUrlFromFile(fileReaderResult) {
139
+ if (isMountedRef.current) {
140
+ setFileAsDataUrl(fileReaderResult);
141
+ }
142
+ };
143
+
142
144
  var onDragOver = function onDragOver(event) {
143
145
  event.stopPropagation();
144
146
  event.preventDefault();
@@ -1 +1 @@
1
- {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
1
+ {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
@@ -42,13 +42,7 @@ var ImagePicker = /*#__PURE__*/React.memo(function (_ref) {
42
42
  t = _useTranslation2[0];
43
43
 
44
44
  var inputRef = /*#__PURE__*/React.createRef();
45
- var isMounted = React.useRef(true);
46
- React.useEffect(function () {
47
- isMounted.current = true;
48
- return function () {
49
- isMounted.current = false;
50
- };
51
- }, []);
45
+ var isMountedRef = React.useRef(true);
52
46
 
53
47
  var handleOnChange = function handleOnChange(ev) {
54
48
  var _ev$fileList;
@@ -89,14 +83,18 @@ var ImagePicker = /*#__PURE__*/React.memo(function (_ref) {
89
83
  var imagePickerClassName = classnames__default['default'](main_module['default'][css_classes['default'].imagePicker], className && className);
90
84
  var imagePickerWrapperClassName = classnames__default['default'](main_module['default'][css_classes['default'].imagePickerWrapper], file && main_module['default'][css_classes['default'].imagePickerWrapperHasFile], _rollupPluginBabelHelpers.defineProperty({}, main_module['default'][css_classes['default'].imagePickerWrapperError], errors.length));
91
85
  React.useEffect(function () {
92
- if (isMounted.current) {
93
- onImageSizeUpdated === null || onImageSizeUpdated === void 0 || onImageSizeUpdated(imageSize);
94
- }
86
+ onImageSizeUpdated === null || onImageSizeUpdated === void 0 || onImageSizeUpdated(imageSize);
95
87
  }, [imageSize]);
96
88
  React.useEffect(function () {
89
+ isMountedRef.current = true;
90
+
97
91
  if (initialFile) {
98
- setImageSizeBasedOnUrl(initialFile === null || initialFile === void 0 ? void 0 : initialFile.fileUrl);
92
+ setImageSizeBasedOnUrl(initialFile.fileUrl);
99
93
  }
94
+
95
+ return function () {
96
+ isMountedRef.current = false;
97
+ };
100
98
  }, [initialFile]);
101
99
  React.useEffect(function () {
102
100
  if (!editedImageResult) return;
@@ -110,44 +108,50 @@ var ImagePicker = /*#__PURE__*/React.memo(function (_ref) {
110
108
  return fileArray;
111
109
  };
112
110
 
113
- var setImageSizeBasedOnUrl = function setImageSizeBasedOnUrl(fileUrl) {
114
- console.log('fileUrl', fileUrl);
115
- createImageFromUrl(fileUrl).then(function (image) {
116
- if (isMounted.current) {
117
- setImageSize({
118
- width: image.naturalWidth,
119
- height: image.naturalHeight
120
- });
121
- }
122
- });
123
- };
124
-
125
- var createImageFromUrl = /*#__PURE__*/function () {
126
- var _ref2 = _rollupPluginBabelHelpers.asyncToGenerator( /*#__PURE__*/_rollupPluginBabelHelpers.regeneratorRuntime().mark(function _callee(url) {
127
- var img;
111
+ var setImageSizeBasedOnUrl = /*#__PURE__*/function () {
112
+ var _ref2 = _rollupPluginBabelHelpers.asyncToGenerator( /*#__PURE__*/_rollupPluginBabelHelpers.regeneratorRuntime().mark(function _callee(fileUrl) {
113
+ var image;
128
114
  return _rollupPluginBabelHelpers.regeneratorRuntime().wrap(function _callee$(_context) {
129
115
  while (1) switch (_context.prev = _context.next) {
130
116
  case 0:
131
- img = new Image();
132
- img.src = url;
133
- _context.next = 4;
134
- return img.decode();
117
+ _context.next = 2;
118
+ return createImageFromUrl(fileUrl);
135
119
 
136
- case 4:
137
- return _context.abrupt("return", img);
120
+ case 2:
121
+ image = _context.sent;
138
122
 
139
- case 5:
123
+ if (isMountedRef.current) {
124
+ setImageSize({
125
+ width: image.naturalWidth,
126
+ height: image.naturalHeight
127
+ });
128
+ }
129
+
130
+ case 4:
140
131
  case "end":
141
132
  return _context.stop();
142
133
  }
143
134
  }, _callee);
144
135
  }));
145
136
 
146
- return function createImageFromUrl(_x) {
137
+ return function setImageSizeBasedOnUrl(_x) {
147
138
  return _ref2.apply(this, arguments);
148
139
  };
149
140
  }();
150
141
 
142
+ var createImageFromUrl = function createImageFromUrl(url) {
143
+ return new Promise(function (resolve, reject) {
144
+ var img = new Image();
145
+ img.src = url;
146
+
147
+ img.onload = function () {
148
+ return resolve(img);
149
+ };
150
+
151
+ img.onerror = reject;
152
+ });
153
+ };
154
+
151
155
  var useStyles = reactJss_esm.createUseStyles({
152
156
  imagePickerWrapper: {
153
157
  border: function border(_ref3) {
@@ -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,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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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,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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
@@ -4,9 +4,9 @@ Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  var React = require('react');
6
6
  var classnames = require('classnames');
7
- var main_module = require('../../css/loader/main.module.less.js');
8
7
  var css_classes = require('./css_classes.js');
9
8
  var constants = require('./constants.js');
9
+ var main_module = require('../../css/loader/main.module.less.js');
10
10
 
11
11
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
12
12
 
@@ -5,8 +5,8 @@ Object.defineProperty(exports, '__esModule', { value: true });
5
5
  var React = require('react');
6
6
  var classnames = require('classnames');
7
7
  var main_module = require('../../css/with-loader/main.module.less.js');
8
- var index = require('../loader/index.js');
9
8
  var css_classes = require('./css_classes.js');
9
+ var index = require('../loader/index.js');
10
10
 
11
11
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
12
12
 
@@ -73,32 +73,39 @@ var XhrImagePicker = function XhrImagePicker(_ref) {
73
73
  isLoading = _useState10[0],
74
74
  setIsLoading = _useState10[1];
75
75
 
76
+ var isMountedRef = React.useRef(true);
77
+ React.useEffect(function () {
78
+ return function () {
79
+ isMountedRef.current = false;
80
+
81
+ if (pendingRequestRef.current) {
82
+ pendingRequestRef.current();
83
+ }
84
+ };
85
+ }, []);
86
+
76
87
  var handleControlChange = /*#__PURE__*/function () {
77
88
  var _ref2 = _rollupPluginBabelHelpers.asyncToGenerator( /*#__PURE__*/_rollupPluginBabelHelpers.regeneratorRuntime().mark(function _callee(file) {
78
- var fileList, fileAsDataUrl, _httpApi$fetch, response, cancelRequest, responseObject;
89
+ var fileList, fileAsDataUrl, _httpApi$fetch2, response, cancelRequest, responseObject;
79
90
 
80
91
  return _rollupPluginBabelHelpers.regeneratorRuntime().wrap(function _callee$(_context) {
81
92
  while (1) switch (_context.prev = _context.next) {
82
93
  case 0:
83
94
  fileList = file.fileList, fileAsDataUrl = file.fileAsDataUrl;
84
- console.log('handleControlChange - file:', file);
85
- console.log('handleControlChange - fileList:', fileList);
86
- console.log('handleControlChange - fileAsDataUrl:', fileAsDataUrl);
87
95
  fileList && setImage(fileList[0]);
88
96
  onChange === null || onChange === void 0 || onChange({
89
97
  fileList: fileList,
90
98
  fileAsDataUrl: fileAsDataUrl
91
99
  });
92
- console.log('handleControlChange - fileAsDataUrl:', fileAsDataUrl);
93
100
 
94
101
  if (!(!fileList || !fileList.length)) {
95
- _context.next = 9;
102
+ _context.next = 5;
96
103
  break;
97
104
  }
98
105
 
99
106
  return _context.abrupt("return");
100
107
 
101
- case 9:
108
+ case 5:
102
109
  setIsLoading(true);
103
110
 
104
111
  if (pendingRequestRef.current) {
@@ -106,30 +113,55 @@ var XhrImagePicker = function XhrImagePicker(_ref) {
106
113
  pendingRequestRef.current = undefined;
107
114
  }
108
115
 
109
- _httpApi$fetch = httpApi.fetch({
116
+ _context.prev = 7;
117
+ _httpApi$fetch2 = httpApi.fetch({
110
118
  url: url,
111
119
  method: http_requester_contants.REQUEST_TYPES.post,
112
120
  data: fileList[0]
113
- }), response = _httpApi$fetch.response, cancelRequest = _httpApi$fetch.cancelRequest;
121
+ }), response = _httpApi$fetch2.response, cancelRequest = _httpApi$fetch2.cancelRequest;
114
122
  pendingRequestRef.current = cancelRequest;
115
- _context.next = 15;
123
+ _context.next = 12;
116
124
  return response;
117
125
 
118
- case 15:
126
+ case 12:
119
127
  responseObject = _context.sent;
120
- console.log('handleControlChange - responseObject:', responseObject);
128
+
129
+ if (isMountedRef.current) {
130
+ _context.next = 15;
131
+ break;
132
+ }
133
+
134
+ return _context.abrupt("return");
135
+
136
+ case 15:
121
137
  onUploaded === null || onUploaded === void 0 || onUploaded({
122
138
  fileList: fileList,
123
139
  dataUrl: fileAsDataUrl,
124
140
  imageId: responseObject.data.imageId
125
141
  });
126
- setIsLoading(false);
142
+ _context.next = 22;
143
+ break;
144
+
145
+ case 18:
146
+ _context.prev = 18;
147
+ _context.t0 = _context["catch"](7);
148
+ console.error('Error uploading image:', _context.t0);
149
+ onError === null || onError === void 0 || onError([t('Error uploading image')]);
150
+
151
+ case 22:
152
+ _context.prev = 22;
127
153
 
128
- case 19:
154
+ if (isMountedRef.current) {
155
+ setIsLoading(false);
156
+ }
157
+
158
+ return _context.finish(22);
159
+
160
+ case 25:
129
161
  case "end":
130
162
  return _context.stop();
131
163
  }
132
- }, _callee);
164
+ }, _callee, null, [[7, 18, 22, 25]]);
133
165
  }));
134
166
 
135
167
  return function handleControlChange(_x) {
@@ -139,7 +171,6 @@ var XhrImagePicker = function XhrImagePicker(_ref) {
139
171
 
140
172
  React.useEffect(function () {
141
173
  initialImageFile.current = initialFile;
142
- console.log('useEffect - initialFile:', initialFile);
143
174
 
144
175
  var setFileFromUrl = /*#__PURE__*/function () {
145
176
  var _ref3 = _rollupPluginBabelHelpers.asyncToGenerator( /*#__PURE__*/_rollupPluginBabelHelpers.regeneratorRuntime().mark(function _callee2(fileData) {
@@ -147,22 +178,23 @@ var XhrImagePicker = function XhrImagePicker(_ref) {
147
178
  return _rollupPluginBabelHelpers.regeneratorRuntime().wrap(function _callee2$(_context2) {
148
179
  while (1) switch (_context2.prev = _context2.next) {
149
180
  case 0:
150
- console.log('setFileFromUrl - fileData:', fileData);
151
- _context2.next = 3;
181
+ _context2.next = 2;
152
182
  return fetch(fileData.fileUrl);
153
183
 
154
- case 3:
184
+ case 2:
155
185
  response = _context2.sent;
156
- _context2.next = 6;
186
+ _context2.next = 5;
157
187
  return response.blob();
158
188
 
159
- case 6:
189
+ case 5:
160
190
  data = _context2.sent;
161
191
  file = new File([data], fileData.fileName);
162
- setInitialImage(file);
163
- console.log('setFileFromUrl - file:', file);
164
192
 
165
- case 10:
193
+ if (isMountedRef.current) {
194
+ setInitialImage(file);
195
+ }
196
+
197
+ case 8:
166
198
  case "end":
167
199
  return _context2.stop();
168
200
  }
@@ -183,15 +215,11 @@ var XhrImagePicker = function XhrImagePicker(_ref) {
183
215
  };
184
216
  }, [image, initialFile]);
185
217
  React.useEffect(function () {
186
- var src = image !== null && image !== void 0 ? image : initialImage;
187
- console.log('useEffect - image:', image);
188
- console.log('useEffect - initialImage:', initialImage);
189
- console.log('useEffect - src:', src !== null && src !== void 0 ? src : '');
190
- setImageEditorSrc(src !== null && src !== void 0 ? src : '');
218
+ var src = image ? URL.createObjectURL(image) : initialImage ? URL.createObjectURL(initialImage) : '';
219
+ setImageEditorSrc(src);
191
220
  }, [image, initialImage]);
192
221
 
193
222
  var renderImageEditor = function renderImageEditor(defaultProps) {
194
- console.log('renderImageEditor - defaultProps:', defaultProps);
195
223
  return ImageEditor ? /*#__PURE__*/React__default['default'].createElement("div", null, /*#__PURE__*/React__default['default'].createElement(ImageEditor, _rollupPluginBabelHelpers.objectSpread2({}, defaultProps))) : null;
196
224
  };
197
225
 
@@ -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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
@@ -44,8 +44,6 @@ var index$g = require('./components/controls/hoc/control_textarea/index.js');
44
44
  var index$F = require('./components/image_picker/index.js');
45
45
  var use_modals_context = require('./components/modal_new/hooks/use_modals_context.js');
46
46
  var modal = require('./components/modal_new/components/modal/modal.js');
47
- var index$L = require('./components/loader/index.js');
48
- var index$M = require('./components/with_loader/index.js');
49
47
  var index$P = require('./components/xhr_image_picker/index.js');
50
48
  var index$p = require('./components/controls/hoc/control_xhr_image_picker/index.js');
51
49
  var index$z = require('./components/table/index.js');
@@ -65,6 +63,7 @@ var icon_mobile = require('./assets/icon_mobile.js');
65
63
  var icon_tablet = require('./assets/icon_tablet.js');
66
64
  var icon_warning = require('./assets/icon_warning.js');
67
65
  var index$N = require('./components/link/index.js');
66
+ var index$L = require('./components/loader/index.js');
68
67
  var index$s = require('./components/modal/index.js');
69
68
  var modal_context = require('./components/modal/context/modal_context.js');
70
69
  var modal_provider = require('./components/modal/hoc/modal_provider.js');
@@ -93,6 +92,7 @@ var index$2 = require('./components/tooltip/index.js');
93
92
  var index$Q = require('./components/tree/index.js');
94
93
  var tree_node = require('./components/tree/components/tree_node.js');
95
94
  var values_syncer = require('./components/controls/components/values_syncer.js');
95
+ var index$M = require('./components/with_loader/index.js');
96
96
 
97
97
 
98
98
 
@@ -139,8 +139,6 @@ exports.ControlTextarea = index$g['default'];
139
139
  exports.ImagePicker = index$F['default'];
140
140
  exports.useModalsContext = use_modals_context.useModalsContext;
141
141
  exports.ModalNew = modal.ModalNew;
142
- exports.Loader = index$L['default'];
143
- exports.WithLoader = index$M['default'];
144
142
  exports.XhrImagePicker = index$P['default'];
145
143
  exports.ControlXhrImagePicker = index$p['default'];
146
144
  exports.Table = index$z['default'];
@@ -161,6 +159,7 @@ exports.IconMobile = icon_mobile['default'];
161
159
  exports.IconTablet = icon_tablet['default'];
162
160
  exports.IconWarning = icon_warning['default'];
163
161
  exports.Link = index$N['default'];
162
+ exports.Loader = index$L['default'];
164
163
  exports.Modal = index$s['default'];
165
164
  exports.ModalContext = modal_context.ModalContext;
166
165
  exports.ModalProvider = modal_provider['default'];
@@ -189,4 +188,5 @@ exports.Tooltip = index$2['default'];
189
188
  exports.Tree = index$Q.Tree;
190
189
  exports.TreeNode = tree_node.TreeNode;
191
190
  exports.ValuesSyncer = values_syncer['default'];
191
+ exports.WithLoader = index$M['default'];
192
192
  //# sourceMappingURL=index.js.map
@@ -42,16 +42,20 @@ var useFilePicker = function useFilePicker(_ref) {
42
42
  setPreview = _useState12[1];
43
43
 
44
44
  var reader = useRef(new FileReader());
45
- var isMounted = useRef(true); // Nowy ref do śledzenia czy komponent jest zamontowany
46
-
45
+ var isMountedRef = useRef(true);
47
46
  useEffect(function () {
48
- isMounted.current = true; // Ustawienie ref na true podczas montowania komponentu
47
+ isMountedRef.current = true;
49
48
 
50
- reader.current.addEventListener('load', handleFileRead, false);
51
- return function () {
52
- isMounted.current = false; // Ustawienie ref na false podczas odmontowywania komponentu
49
+ var loadListener = function loadListener() {
50
+ if (isMountedRef.current) {
51
+ getDataUrlFromFile(reader.current.result);
52
+ }
53
+ };
53
54
 
54
- reader.current.removeEventListener('load', handleFileRead);
55
+ reader.current.addEventListener('load', loadListener, false);
56
+ return function () {
57
+ isMountedRef.current = false;
58
+ reader.current.removeEventListener('load', loadListener);
55
59
  };
56
60
  }, []);
57
61
  useEffect(function () {
@@ -61,7 +65,7 @@ var useFilePicker = function useFilePicker(_ref) {
61
65
  initialErrors && setErrors(initialErrors);
62
66
  }, [initialErrors]);
63
67
  useEffect(function () {
64
- if (fileAsDataUrl && isMounted.current) {
68
+ if (fileAsDataUrl && isMountedRef.current) {
65
69
  onChange === null || onChange === void 0 || onChange({
66
70
  fileList: fileList,
67
71
  fileAsDataUrl: fileAsDataUrl
@@ -69,12 +73,6 @@ var useFilePicker = function useFilePicker(_ref) {
69
73
  }
70
74
  }, [fileAsDataUrl]);
71
75
 
72
- var handleFileRead = function handleFileRead() {
73
- if (isMounted.current) {
74
- setFileAsDataUrl(reader.current.result);
75
- }
76
- };
77
-
78
76
  var onDropFile = function onDropFile(event) {
79
77
  setErrors([]);
80
78
  event.stopPropagation();
@@ -121,20 +119,24 @@ var useFilePicker = function useFilePicker(_ref) {
121
119
  });
122
120
  var isValid = validateFileExtension(allowedExtensions, files[0].type);
123
121
  if (isValid) onChange === null || onChange === void 0 || onChange({
124
- fileList: files,
125
- fileAsDataUrl: reader.current.result
122
+ fileList: files
126
123
  });
127
124
  } else {
128
125
  setFile(undefined);
129
126
  onChange === null || onChange === void 0 || onChange({
130
- fileList: files,
131
- fileAsDataUrl: null
127
+ fileList: files
132
128
  });
133
129
  }
134
130
 
135
131
  setPreview(true);
136
132
  };
137
133
 
134
+ var getDataUrlFromFile = function getDataUrlFromFile(fileReaderResult) {
135
+ if (isMountedRef.current) {
136
+ setFileAsDataUrl(fileReaderResult);
137
+ }
138
+ };
139
+
138
140
  var onDragOver = function onDragOver(event) {
139
141
  event.stopPropagation();
140
142
  event.preventDefault();
@@ -1 +1 @@
1
- {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
1
+ {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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,4 +1,4 @@
1
- import React, { memo, useRef, useEffect, useState, createRef } from 'react';
1
+ import React, { memo, useRef, useState, useEffect, createRef } from 'react';
2
2
  import { useTranslation } from '../../../../../external/react-i18next/dist/es/useTranslation.js';
3
3
  import { slicedToArray as _slicedToArray, defineProperty as _defineProperty, asyncToGenerator as _asyncToGenerator, regeneratorRuntime as _regeneratorRuntime } from '../../../../../_virtual/_rollupPluginBabelHelpers.js';
4
4
  import { FILES_EXTENSIONS } from '../file_picker/constants.js';
@@ -33,13 +33,7 @@ var ImagePicker = /*#__PURE__*/memo(function (_ref) {
33
33
  t = _useTranslation2[0];
34
34
 
35
35
  var inputRef = /*#__PURE__*/createRef();
36
- var isMounted = useRef(true);
37
- useEffect(function () {
38
- isMounted.current = true;
39
- return function () {
40
- isMounted.current = false;
41
- };
42
- }, []);
36
+ var isMountedRef = useRef(true);
43
37
 
44
38
  var handleOnChange = function handleOnChange(ev) {
45
39
  var _ev$fileList;
@@ -80,14 +74,18 @@ var ImagePicker = /*#__PURE__*/memo(function (_ref) {
80
74
  var imagePickerClassName = classnames(styles[CSS_CLASSES.imagePicker], className && className);
81
75
  var imagePickerWrapperClassName = classnames(styles[CSS_CLASSES.imagePickerWrapper], file && styles[CSS_CLASSES.imagePickerWrapperHasFile], _defineProperty({}, styles[CSS_CLASSES.imagePickerWrapperError], errors.length));
82
76
  useEffect(function () {
83
- if (isMounted.current) {
84
- onImageSizeUpdated === null || onImageSizeUpdated === void 0 || onImageSizeUpdated(imageSize);
85
- }
77
+ onImageSizeUpdated === null || onImageSizeUpdated === void 0 || onImageSizeUpdated(imageSize);
86
78
  }, [imageSize]);
87
79
  useEffect(function () {
80
+ isMountedRef.current = true;
81
+
88
82
  if (initialFile) {
89
- setImageSizeBasedOnUrl(initialFile === null || initialFile === void 0 ? void 0 : initialFile.fileUrl);
83
+ setImageSizeBasedOnUrl(initialFile.fileUrl);
90
84
  }
85
+
86
+ return function () {
87
+ isMountedRef.current = false;
88
+ };
91
89
  }, [initialFile]);
92
90
  useEffect(function () {
93
91
  if (!editedImageResult) return;
@@ -101,44 +99,50 @@ var ImagePicker = /*#__PURE__*/memo(function (_ref) {
101
99
  return fileArray;
102
100
  };
103
101
 
104
- var setImageSizeBasedOnUrl = function setImageSizeBasedOnUrl(fileUrl) {
105
- console.log('fileUrl', fileUrl);
106
- createImageFromUrl(fileUrl).then(function (image) {
107
- if (isMounted.current) {
108
- setImageSize({
109
- width: image.naturalWidth,
110
- height: image.naturalHeight
111
- });
112
- }
113
- });
114
- };
115
-
116
- var createImageFromUrl = /*#__PURE__*/function () {
117
- var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(url) {
118
- var img;
102
+ var setImageSizeBasedOnUrl = /*#__PURE__*/function () {
103
+ var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(fileUrl) {
104
+ var image;
119
105
  return _regeneratorRuntime().wrap(function _callee$(_context) {
120
106
  while (1) switch (_context.prev = _context.next) {
121
107
  case 0:
122
- img = new Image();
123
- img.src = url;
124
- _context.next = 4;
125
- return img.decode();
108
+ _context.next = 2;
109
+ return createImageFromUrl(fileUrl);
126
110
 
127
- case 4:
128
- return _context.abrupt("return", img);
111
+ case 2:
112
+ image = _context.sent;
129
113
 
130
- case 5:
114
+ if (isMountedRef.current) {
115
+ setImageSize({
116
+ width: image.naturalWidth,
117
+ height: image.naturalHeight
118
+ });
119
+ }
120
+
121
+ case 4:
131
122
  case "end":
132
123
  return _context.stop();
133
124
  }
134
125
  }, _callee);
135
126
  }));
136
127
 
137
- return function createImageFromUrl(_x) {
128
+ return function setImageSizeBasedOnUrl(_x) {
138
129
  return _ref2.apply(this, arguments);
139
130
  };
140
131
  }();
141
132
 
133
+ var createImageFromUrl = function createImageFromUrl(url) {
134
+ return new Promise(function (resolve, reject) {
135
+ var img = new Image();
136
+ img.src = url;
137
+
138
+ img.onload = function () {
139
+ return resolve(img);
140
+ };
141
+
142
+ img.onerror = reject;
143
+ });
144
+ };
145
+
142
146
  var useStyles = createUseStyles({
143
147
  imagePickerWrapper: {
144
148
  border: function border(_ref3) {
@@ -1 +1 @@
1
- {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA,+BAA+B,iEAAqE;AACpG;AACA;AACA;AACA,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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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;AACA;AACA;AACA,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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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,8 +1,8 @@
1
1
  import React from 'react';
2
2
  import classnames from 'classnames';
3
- import cssClasses from '../../css/loader/main.module.less.js';
4
3
  import { cssLoader } from './css_classes.js';
5
4
  import { LOADER_SIZE_CSS_CLASS_MAP, LOADER_SIZE } from './constants.js';
5
+ import cssClasses from '../../css/loader/main.module.less.js';
6
6
 
7
7
  var Loader = function Loader(_ref) {
8
8
  var size = _ref.size,
@@ -1,8 +1,8 @@
1
1
  import React from 'react';
2
2
  import classnames from 'classnames';
3
3
  import cssClasses from '../../css/with-loader/main.module.less.js';
4
- import Loader from '../loader/index.js';
5
4
  import { cssWithLoaderWrapper, cssWithLoader } from './css_classes.js';
5
+ import Loader from '../loader/index.js';
6
6
 
7
7
  var WithLoader = function WithLoader(_ref) {
8
8
  var isLoading = _ref.isLoading,
@@ -1,4 +1,4 @@
1
- import { IXhrImagePickerProps } from "./types";
2
1
  import React from 'react';
2
+ import { IXhrImagePickerProps } from "./types";
3
3
  declare const XhrImagePicker: React.FC<IXhrImagePickerProps>;
4
4
  export default XhrImagePicker;
@@ -65,32 +65,39 @@ var XhrImagePicker = function XhrImagePicker(_ref) {
65
65
  isLoading = _useState10[0],
66
66
  setIsLoading = _useState10[1];
67
67
 
68
+ var isMountedRef = useRef(true);
69
+ useEffect(function () {
70
+ return function () {
71
+ isMountedRef.current = false;
72
+
73
+ if (pendingRequestRef.current) {
74
+ pendingRequestRef.current();
75
+ }
76
+ };
77
+ }, []);
78
+
68
79
  var handleControlChange = /*#__PURE__*/function () {
69
80
  var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(file) {
70
- var fileList, fileAsDataUrl, _httpApi$fetch, response, cancelRequest, responseObject;
81
+ var fileList, fileAsDataUrl, _httpApi$fetch2, response, cancelRequest, responseObject;
71
82
 
72
83
  return _regeneratorRuntime().wrap(function _callee$(_context) {
73
84
  while (1) switch (_context.prev = _context.next) {
74
85
  case 0:
75
86
  fileList = file.fileList, fileAsDataUrl = file.fileAsDataUrl;
76
- console.log('handleControlChange - file:', file);
77
- console.log('handleControlChange - fileList:', fileList);
78
- console.log('handleControlChange - fileAsDataUrl:', fileAsDataUrl);
79
87
  fileList && setImage(fileList[0]);
80
88
  onChange === null || onChange === void 0 || onChange({
81
89
  fileList: fileList,
82
90
  fileAsDataUrl: fileAsDataUrl
83
91
  });
84
- console.log('handleControlChange - fileAsDataUrl:', fileAsDataUrl);
85
92
 
86
93
  if (!(!fileList || !fileList.length)) {
87
- _context.next = 9;
94
+ _context.next = 5;
88
95
  break;
89
96
  }
90
97
 
91
98
  return _context.abrupt("return");
92
99
 
93
- case 9:
100
+ case 5:
94
101
  setIsLoading(true);
95
102
 
96
103
  if (pendingRequestRef.current) {
@@ -98,30 +105,55 @@ var XhrImagePicker = function XhrImagePicker(_ref) {
98
105
  pendingRequestRef.current = undefined;
99
106
  }
100
107
 
101
- _httpApi$fetch = httpApi.fetch({
108
+ _context.prev = 7;
109
+ _httpApi$fetch2 = httpApi.fetch({
102
110
  url: url,
103
111
  method: REQUEST_TYPES.post,
104
112
  data: fileList[0]
105
- }), response = _httpApi$fetch.response, cancelRequest = _httpApi$fetch.cancelRequest;
113
+ }), response = _httpApi$fetch2.response, cancelRequest = _httpApi$fetch2.cancelRequest;
106
114
  pendingRequestRef.current = cancelRequest;
107
- _context.next = 15;
115
+ _context.next = 12;
108
116
  return response;
109
117
 
110
- case 15:
118
+ case 12:
111
119
  responseObject = _context.sent;
112
- console.log('handleControlChange - responseObject:', responseObject);
120
+
121
+ if (isMountedRef.current) {
122
+ _context.next = 15;
123
+ break;
124
+ }
125
+
126
+ return _context.abrupt("return");
127
+
128
+ case 15:
113
129
  onUploaded === null || onUploaded === void 0 || onUploaded({
114
130
  fileList: fileList,
115
131
  dataUrl: fileAsDataUrl,
116
132
  imageId: responseObject.data.imageId
117
133
  });
118
- setIsLoading(false);
134
+ _context.next = 22;
135
+ break;
136
+
137
+ case 18:
138
+ _context.prev = 18;
139
+ _context.t0 = _context["catch"](7);
140
+ console.error('Error uploading image:', _context.t0);
141
+ onError === null || onError === void 0 || onError([t('Error uploading image')]);
142
+
143
+ case 22:
144
+ _context.prev = 22;
119
145
 
120
- case 19:
146
+ if (isMountedRef.current) {
147
+ setIsLoading(false);
148
+ }
149
+
150
+ return _context.finish(22);
151
+
152
+ case 25:
121
153
  case "end":
122
154
  return _context.stop();
123
155
  }
124
- }, _callee);
156
+ }, _callee, null, [[7, 18, 22, 25]]);
125
157
  }));
126
158
 
127
159
  return function handleControlChange(_x) {
@@ -131,7 +163,6 @@ var XhrImagePicker = function XhrImagePicker(_ref) {
131
163
 
132
164
  useEffect(function () {
133
165
  initialImageFile.current = initialFile;
134
- console.log('useEffect - initialFile:', initialFile);
135
166
 
136
167
  var setFileFromUrl = /*#__PURE__*/function () {
137
168
  var _ref3 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2(fileData) {
@@ -139,22 +170,23 @@ var XhrImagePicker = function XhrImagePicker(_ref) {
139
170
  return _regeneratorRuntime().wrap(function _callee2$(_context2) {
140
171
  while (1) switch (_context2.prev = _context2.next) {
141
172
  case 0:
142
- console.log('setFileFromUrl - fileData:', fileData);
143
- _context2.next = 3;
173
+ _context2.next = 2;
144
174
  return fetch(fileData.fileUrl);
145
175
 
146
- case 3:
176
+ case 2:
147
177
  response = _context2.sent;
148
- _context2.next = 6;
178
+ _context2.next = 5;
149
179
  return response.blob();
150
180
 
151
- case 6:
181
+ case 5:
152
182
  data = _context2.sent;
153
183
  file = new File([data], fileData.fileName);
154
- setInitialImage(file);
155
- console.log('setFileFromUrl - file:', file);
156
184
 
157
- case 10:
185
+ if (isMountedRef.current) {
186
+ setInitialImage(file);
187
+ }
188
+
189
+ case 8:
158
190
  case "end":
159
191
  return _context2.stop();
160
192
  }
@@ -175,15 +207,11 @@ var XhrImagePicker = function XhrImagePicker(_ref) {
175
207
  };
176
208
  }, [image, initialFile]);
177
209
  useEffect(function () {
178
- var src = image !== null && image !== void 0 ? image : initialImage;
179
- console.log('useEffect - image:', image);
180
- console.log('useEffect - initialImage:', initialImage);
181
- console.log('useEffect - src:', src !== null && src !== void 0 ? src : '');
182
- setImageEditorSrc(src !== null && src !== void 0 ? src : '');
210
+ var src = image ? URL.createObjectURL(image) : initialImage ? URL.createObjectURL(initialImage) : '';
211
+ setImageEditorSrc(src);
183
212
  }, [image, initialImage]);
184
213
 
185
214
  var renderImageEditor = function renderImageEditor(defaultProps) {
186
- console.log('renderImageEditor - defaultProps:', defaultProps);
187
215
  return ImageEditor ? /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(ImageEditor, _objectSpread2({}, defaultProps))) : null;
188
216
  };
189
217
 
@@ -1 +1 @@
1
- {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA,+BAA+B,iEAAqE;AACpG;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
@@ -40,8 +40,6 @@ export { default as ControlTextarea } from './components/controls/hoc/control_te
40
40
  export { default as ImagePicker } from './components/image_picker/index.js';
41
41
  export { useModalsContext } from './components/modal_new/hooks/use_modals_context.js';
42
42
  export { ModalNew } from './components/modal_new/components/modal/modal.js';
43
- export { default as Loader } from './components/loader/index.js';
44
- export { default as WithLoader } from './components/with_loader/index.js';
45
43
  export { default as XhrImagePicker } from './components/xhr_image_picker/index.js';
46
44
  export { default as ControlXhrImagePicker } from './components/controls/hoc/control_xhr_image_picker/index.js';
47
45
  export { default as Table } from './components/table/index.js';
@@ -61,6 +59,7 @@ export { default as IconMobile } from './assets/icon_mobile.js';
61
59
  export { default as IconTablet } from './assets/icon_tablet.js';
62
60
  export { default as IconWarning } from './assets/icon_warning.js';
63
61
  export { default as Link } from './components/link/index.js';
62
+ export { default as Loader } from './components/loader/index.js';
64
63
  export { default as Modal } from './components/modal/index.js';
65
64
  export { ModalContext } from './components/modal/context/modal_context.js';
66
65
  export { default as ModalProvider } from './components/modal/hoc/modal_provider.js';
@@ -89,4 +88,5 @@ export { default as Tooltip } from './components/tooltip/index.js';
89
88
  export { Tree } from './components/tree/index.js';
90
89
  export { TreeNode } from './components/tree/components/tree_node.js';
91
90
  export { default as ValuesSyncer } from './components/controls/components/values_syncer.js';
91
+ export { default as WithLoader } from './components/with_loader/index.js';
92
92
  //# 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.19.0-2",
5
+ "version": "2.19.0-3",
6
6
  "description": "aurora",
7
7
  "author": "k0ssak",
8
8
  "license": "MIT",