@panneau/field-upload 1.0.0-alpha.97 → 1.0.3-alpha.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/es/index.js +37 -19
- package/lib/index.js +75 -54
- package/package.json +15 -15
package/es/index.js
CHANGED
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import _objectSpread from '@babel/runtime/helpers/objectSpread2';
|
|
1
2
|
import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
|
|
2
3
|
import { faTimes, faFileVideo, faFileImage, faFileAudio } from '@fortawesome/free-solid-svg-icons';
|
|
3
4
|
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
|
|
@@ -9,29 +10,31 @@ import '@uppy/core/dist/style.css';
|
|
|
9
10
|
import '@uppy/dashboard/dist/style.css';
|
|
10
11
|
import { Dashboard, DashboardModal } from '@uppy/react';
|
|
11
12
|
import isArray from 'lodash/isArray';
|
|
13
|
+
import isObject from 'lodash/isObject';
|
|
12
14
|
import prettyBytes from 'pretty-bytes';
|
|
13
15
|
import PropTypes from 'prop-types';
|
|
14
16
|
import React, { useCallback, useMemo, useState } from 'react';
|
|
15
17
|
import { FormattedMessage } from 'react-intl';
|
|
16
18
|
|
|
17
19
|
var propTypes = {
|
|
18
|
-
|
|
19
|
-
value: PropTypes.oneOf(PropTypes.array, PropTypes.shape({
|
|
20
|
+
value: PropTypes.oneOfType([PropTypes.array, PropTypes.shape({
|
|
20
21
|
filename: PropTypes.string,
|
|
21
22
|
size: PropTypes.number,
|
|
22
23
|
url: PropTypes.string
|
|
23
|
-
})),
|
|
24
|
+
})]),
|
|
24
25
|
types: PropTypes.arrayOf(PropTypes.oneOf(['audio', 'image', 'video'])),
|
|
26
|
+
fileTypes: PropTypes.arrayOf(PropTypes.string),
|
|
25
27
|
sources: PropTypes.arrayOf(PropTypes.oneOf(['webcam', 'facebook', 'instagram', 'dropbox', 'google-drive'])),
|
|
26
28
|
withButton: PropTypes.bool,
|
|
27
29
|
addButtonLabel: PropTypes$1.label,
|
|
28
30
|
allowMultipleUploads: PropTypes.bool,
|
|
29
|
-
onChange: PropTypes.func
|
|
31
|
+
onChange: PropTypes.func,
|
|
32
|
+
className: PropTypes.string
|
|
30
33
|
};
|
|
31
34
|
var defaultProps = {
|
|
32
|
-
className: null,
|
|
33
35
|
value: null,
|
|
34
36
|
types: ['audio', 'image', 'video'],
|
|
37
|
+
fileTypes: null,
|
|
35
38
|
sources: ['webcam', 'facebook', 'instagram', 'dropbox', 'google-drive'],
|
|
36
39
|
withButton: false,
|
|
37
40
|
addButtonLabel: /*#__PURE__*/React.createElement(FormattedMessage, {
|
|
@@ -42,20 +45,22 @@ var defaultProps = {
|
|
|
42
45
|
}]
|
|
43
46
|
}),
|
|
44
47
|
allowMultipleUploads: false,
|
|
45
|
-
onChange: null
|
|
48
|
+
onChange: null,
|
|
49
|
+
className: null
|
|
46
50
|
};
|
|
47
51
|
|
|
48
52
|
var UploadField = function UploadField(_ref) {
|
|
49
|
-
var
|
|
50
|
-
value = _ref.value,
|
|
53
|
+
var value = _ref.value,
|
|
51
54
|
types = _ref.types,
|
|
55
|
+
fileTypes = _ref.fileTypes,
|
|
52
56
|
sources = _ref.sources,
|
|
53
57
|
withButton = _ref.withButton,
|
|
54
58
|
addButtonLabel = _ref.addButtonLabel,
|
|
55
59
|
allowMultipleUploads = _ref.allowMultipleUploads,
|
|
56
|
-
onChange = _ref.onChange
|
|
60
|
+
onChange = _ref.onChange,
|
|
61
|
+
className = _ref.className;
|
|
57
62
|
var onComplete = useCallback(function (response) {
|
|
58
|
-
console.log('complete', response); // eslint-disable-line
|
|
63
|
+
console.log('upload complete', response); // eslint-disable-line
|
|
59
64
|
|
|
60
65
|
var newValue = null;
|
|
61
66
|
|
|
@@ -70,18 +75,29 @@ var UploadField = function UploadField(_ref) {
|
|
|
70
75
|
}
|
|
71
76
|
} else if (response && response.successful) {
|
|
72
77
|
newValue = response.successful.length > 0 ? response.successful[0].response.body : null;
|
|
78
|
+
} // Merge the response from our back-end
|
|
79
|
+
|
|
80
|
+
|
|
81
|
+
if (isObject(newValue) && isObject(newValue.response) && newValue.response.status === 200 && newValue.response.body !== null) {
|
|
82
|
+
newValue = _objectSpread(_objectSpread({}, newValue), newValue.response.body || null);
|
|
73
83
|
}
|
|
74
84
|
|
|
85
|
+
console.log('new upload value', newValue); // eslint-disable-line
|
|
86
|
+
|
|
75
87
|
if (onChange !== null) {
|
|
76
88
|
onChange(newValue);
|
|
77
89
|
}
|
|
78
90
|
}, [onChange, allowMultipleUploads]);
|
|
79
91
|
var typesString = types.join('.');
|
|
80
92
|
var allowedFileTypes = useMemo(function () {
|
|
93
|
+
if (fileTypes !== null) {
|
|
94
|
+
return fileTypes;
|
|
95
|
+
}
|
|
96
|
+
|
|
81
97
|
return typesString.split('.').map(function (type) {
|
|
82
98
|
return "".concat(type, "/*");
|
|
83
99
|
});
|
|
84
|
-
}, [typesString]);
|
|
100
|
+
}, [typesString, fileTypes]);
|
|
85
101
|
var uppy = useUppy({
|
|
86
102
|
allowedFileTypes: allowedFileTypes,
|
|
87
103
|
allowMultipleUploads: allowMultipleUploads,
|
|
@@ -127,8 +143,8 @@ var UploadField = function UploadField(_ref) {
|
|
|
127
143
|
filename = _ref2$filename === void 0 ? null : _ref2$filename,
|
|
128
144
|
_ref2$size = _ref2.size,
|
|
129
145
|
size = _ref2$size === void 0 ? 0 : _ref2$size,
|
|
130
|
-
_ref2$
|
|
131
|
-
|
|
146
|
+
_ref2$thumbnail_url = _ref2.thumbnail_url,
|
|
147
|
+
thumbnailUrl = _ref2$thumbnail_url === void 0 ? null : _ref2$thumbnail_url,
|
|
132
148
|
_ref2$preview = _ref2.preview,
|
|
133
149
|
preview = _ref2$preview === void 0 ? null : _ref2$preview,
|
|
134
150
|
_ref2$data = _ref2.data,
|
|
@@ -155,21 +171,24 @@ var UploadField = function UploadField(_ref) {
|
|
|
155
171
|
break;
|
|
156
172
|
}
|
|
157
173
|
|
|
158
|
-
var hasPreview = preview !== null ||
|
|
174
|
+
var hasPreview = preview !== null || thumbnailUrl !== null;
|
|
159
175
|
return /*#__PURE__*/React.createElement("div", {
|
|
160
176
|
className: "d-flex align-items-center justify-content-between my-1",
|
|
161
177
|
key: "file-".concat(id, "-").concat(filename, "-").concat(idx + 1)
|
|
162
178
|
}, /*#__PURE__*/React.createElement("div", {
|
|
163
|
-
className: "d-flex align-items-center mx-2"
|
|
179
|
+
className: "d-flex align-items-center mx-2 text-truncate"
|
|
164
180
|
}, !hasPreview && faIcon !== null ? /*#__PURE__*/React.createElement(FontAwesomeIcon, {
|
|
165
181
|
icon: faIcon,
|
|
166
182
|
className: "me-2"
|
|
167
183
|
}) : null, hasPreview ? /*#__PURE__*/React.createElement("img", {
|
|
168
184
|
className: "img-thumbnail me-2",
|
|
169
|
-
src: preview ||
|
|
185
|
+
src: preview || thumbnailUrl,
|
|
170
186
|
alt: "preview",
|
|
171
187
|
style: {
|
|
172
|
-
height: 100
|
|
188
|
+
height: 100,
|
|
189
|
+
backgroundImage: 'linear-gradient(45deg, #eee 25%, transparent 25%), linear-gradient(-45deg, #eee 25%, transparent 25%), linear-gradient(45deg, transparent 75%, #eee 75%), linear-gradient(-45deg, transparent 75%, #eee 75%)',
|
|
190
|
+
backgroundSize: '20px 20px',
|
|
191
|
+
backgroundPosition: '0 0, 0 10px, 10px -10px, -10px 0'
|
|
173
192
|
}
|
|
174
193
|
}) : null, /*#__PURE__*/React.createElement("div", {
|
|
175
194
|
className: "media-body text-truncate small me-2"
|
|
@@ -253,5 +272,4 @@ var VideoField = function VideoField(props) {
|
|
|
253
272
|
|
|
254
273
|
var VideoField$1 = /*#__PURE__*/React.memo(VideoField);
|
|
255
274
|
|
|
256
|
-
export
|
|
257
|
-
export { AudioField$1 as AudioField, ImageField$1 as ImageField, VideoField$1 as VideoField, definition };
|
|
275
|
+
export { AudioField$1 as AudioField, ImageField$1 as ImageField, VideoField$1 as VideoField, UploadField$1 as default, definition };
|
package/lib/index.js
CHANGED
|
@@ -2,6 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
+
var _objectSpread = require('@babel/runtime/helpers/objectSpread2');
|
|
5
6
|
var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
|
|
6
7
|
var freeSolidSvgIcons = require('@fortawesome/free-solid-svg-icons');
|
|
7
8
|
var reactFontawesome = require('@fortawesome/react-fontawesome');
|
|
@@ -13,6 +14,7 @@ require('@uppy/core/dist/style.css');
|
|
|
13
14
|
require('@uppy/dashboard/dist/style.css');
|
|
14
15
|
var react = require('@uppy/react');
|
|
15
16
|
var isArray = require('lodash/isArray');
|
|
17
|
+
var isObject = require('lodash/isObject');
|
|
16
18
|
var prettyBytes = require('pretty-bytes');
|
|
17
19
|
var PropTypes = require('prop-types');
|
|
18
20
|
var React = require('react');
|
|
@@ -20,35 +22,38 @@ var reactIntl = require('react-intl');
|
|
|
20
22
|
|
|
21
23
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
22
24
|
|
|
25
|
+
var _objectSpread__default = /*#__PURE__*/_interopDefaultLegacy(_objectSpread);
|
|
23
26
|
var _slicedToArray__default = /*#__PURE__*/_interopDefaultLegacy(_slicedToArray);
|
|
24
27
|
var Button__default = /*#__PURE__*/_interopDefaultLegacy(Button);
|
|
25
28
|
var Label__default = /*#__PURE__*/_interopDefaultLegacy(Label);
|
|
26
29
|
var isArray__default = /*#__PURE__*/_interopDefaultLegacy(isArray);
|
|
30
|
+
var isObject__default = /*#__PURE__*/_interopDefaultLegacy(isObject);
|
|
27
31
|
var prettyBytes__default = /*#__PURE__*/_interopDefaultLegacy(prettyBytes);
|
|
28
32
|
var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
|
|
29
33
|
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
30
34
|
|
|
31
35
|
var propTypes = {
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
sources: PropTypes__default[
|
|
40
|
-
withButton: PropTypes__default[
|
|
36
|
+
value: PropTypes__default["default"].oneOfType([PropTypes__default["default"].array, PropTypes__default["default"].shape({
|
|
37
|
+
filename: PropTypes__default["default"].string,
|
|
38
|
+
size: PropTypes__default["default"].number,
|
|
39
|
+
url: PropTypes__default["default"].string
|
|
40
|
+
})]),
|
|
41
|
+
types: PropTypes__default["default"].arrayOf(PropTypes__default["default"].oneOf(['audio', 'image', 'video'])),
|
|
42
|
+
fileTypes: PropTypes__default["default"].arrayOf(PropTypes__default["default"].string),
|
|
43
|
+
sources: PropTypes__default["default"].arrayOf(PropTypes__default["default"].oneOf(['webcam', 'facebook', 'instagram', 'dropbox', 'google-drive'])),
|
|
44
|
+
withButton: PropTypes__default["default"].bool,
|
|
41
45
|
addButtonLabel: core.PropTypes.label,
|
|
42
|
-
allowMultipleUploads: PropTypes__default[
|
|
43
|
-
onChange: PropTypes__default[
|
|
46
|
+
allowMultipleUploads: PropTypes__default["default"].bool,
|
|
47
|
+
onChange: PropTypes__default["default"].func,
|
|
48
|
+
className: PropTypes__default["default"].string
|
|
44
49
|
};
|
|
45
50
|
var defaultProps = {
|
|
46
|
-
className: null,
|
|
47
51
|
value: null,
|
|
48
52
|
types: ['audio', 'image', 'video'],
|
|
53
|
+
fileTypes: null,
|
|
49
54
|
sources: ['webcam', 'facebook', 'instagram', 'dropbox', 'google-drive'],
|
|
50
55
|
withButton: false,
|
|
51
|
-
addButtonLabel: /*#__PURE__*/React__default[
|
|
56
|
+
addButtonLabel: /*#__PURE__*/React__default["default"].createElement(reactIntl.FormattedMessage, {
|
|
52
57
|
id: "NI9440",
|
|
53
58
|
defaultMessage: [{
|
|
54
59
|
"type": 0,
|
|
@@ -56,46 +61,59 @@ var defaultProps = {
|
|
|
56
61
|
}]
|
|
57
62
|
}),
|
|
58
63
|
allowMultipleUploads: false,
|
|
59
|
-
onChange: null
|
|
64
|
+
onChange: null,
|
|
65
|
+
className: null
|
|
60
66
|
};
|
|
61
67
|
|
|
62
68
|
var UploadField = function UploadField(_ref) {
|
|
63
|
-
var
|
|
64
|
-
value = _ref.value,
|
|
69
|
+
var value = _ref.value,
|
|
65
70
|
types = _ref.types,
|
|
71
|
+
fileTypes = _ref.fileTypes,
|
|
66
72
|
sources = _ref.sources,
|
|
67
73
|
withButton = _ref.withButton,
|
|
68
74
|
addButtonLabel = _ref.addButtonLabel,
|
|
69
75
|
allowMultipleUploads = _ref.allowMultipleUploads,
|
|
70
|
-
onChange = _ref.onChange
|
|
76
|
+
onChange = _ref.onChange,
|
|
77
|
+
className = _ref.className;
|
|
71
78
|
var onComplete = React.useCallback(function (response) {
|
|
72
|
-
console.log('complete', response); // eslint-disable-line
|
|
79
|
+
console.log('upload complete', response); // eslint-disable-line
|
|
73
80
|
|
|
74
81
|
var newValue = null;
|
|
75
82
|
|
|
76
|
-
if (isArray__default[
|
|
83
|
+
if (isArray__default["default"](response)) {
|
|
77
84
|
if (allowMultipleUploads) {
|
|
78
85
|
newValue = response;
|
|
79
86
|
} else {
|
|
80
|
-
var _response = _slicedToArray__default[
|
|
87
|
+
var _response = _slicedToArray__default["default"](response, 1),
|
|
81
88
|
first = _response[0];
|
|
82
89
|
|
|
83
90
|
newValue = first;
|
|
84
91
|
}
|
|
85
92
|
} else if (response && response.successful) {
|
|
86
93
|
newValue = response.successful.length > 0 ? response.successful[0].response.body : null;
|
|
94
|
+
} // Merge the response from our back-end
|
|
95
|
+
|
|
96
|
+
|
|
97
|
+
if (isObject__default["default"](newValue) && isObject__default["default"](newValue.response) && newValue.response.status === 200 && newValue.response.body !== null) {
|
|
98
|
+
newValue = _objectSpread__default["default"](_objectSpread__default["default"]({}, newValue), newValue.response.body || null);
|
|
87
99
|
}
|
|
88
100
|
|
|
101
|
+
console.log('new upload value', newValue); // eslint-disable-line
|
|
102
|
+
|
|
89
103
|
if (onChange !== null) {
|
|
90
104
|
onChange(newValue);
|
|
91
105
|
}
|
|
92
106
|
}, [onChange, allowMultipleUploads]);
|
|
93
107
|
var typesString = types.join('.');
|
|
94
108
|
var allowedFileTypes = React.useMemo(function () {
|
|
109
|
+
if (fileTypes !== null) {
|
|
110
|
+
return fileTypes;
|
|
111
|
+
}
|
|
112
|
+
|
|
95
113
|
return typesString.split('.').map(function (type) {
|
|
96
114
|
return "".concat(type, "/*");
|
|
97
115
|
});
|
|
98
|
-
}, [typesString]);
|
|
116
|
+
}, [typesString, fileTypes]);
|
|
99
117
|
var uppy = contexts.useUppy({
|
|
100
118
|
allowedFileTypes: allowedFileTypes,
|
|
101
119
|
allowMultipleUploads: allowMultipleUploads,
|
|
@@ -104,7 +122,7 @@ var UploadField = function UploadField(_ref) {
|
|
|
104
122
|
onComplete: onComplete
|
|
105
123
|
});
|
|
106
124
|
var onClickRemove = React.useCallback(function (idx) {
|
|
107
|
-
if (onChange !== null && isArray__default[
|
|
125
|
+
if (onChange !== null && isArray__default["default"](value) && value.length > 1) {
|
|
108
126
|
onChange(value.filter(function (v, i) {
|
|
109
127
|
return i !== idx;
|
|
110
128
|
}));
|
|
@@ -114,7 +132,7 @@ var UploadField = function UploadField(_ref) {
|
|
|
114
132
|
}, [value, onChange]);
|
|
115
133
|
|
|
116
134
|
var _useState = React.useState(false),
|
|
117
|
-
_useState2 = _slicedToArray__default[
|
|
135
|
+
_useState2 = _slicedToArray__default["default"](_useState, 2),
|
|
118
136
|
modalOpened = _useState2[0],
|
|
119
137
|
setModalOpened = _useState2[1];
|
|
120
138
|
|
|
@@ -124,14 +142,14 @@ var UploadField = function UploadField(_ref) {
|
|
|
124
142
|
var closeModal = React.useCallback(function () {
|
|
125
143
|
setModalOpened(false);
|
|
126
144
|
}, [setModalOpened]);
|
|
127
|
-
var values = isArray__default[
|
|
128
|
-
return /*#__PURE__*/React__default[
|
|
145
|
+
var values = isArray__default["default"](value) ? value : [value];
|
|
146
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
129
147
|
className: className
|
|
130
|
-
}, value !== null ? /*#__PURE__*/React__default[
|
|
148
|
+
}, value !== null ? /*#__PURE__*/React__default["default"].createElement("div", {
|
|
131
149
|
className: "card"
|
|
132
|
-
}, /*#__PURE__*/React__default[
|
|
150
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
133
151
|
className: "card-body p-1 pl-2"
|
|
134
|
-
}, /*#__PURE__*/React__default[
|
|
152
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
135
153
|
className: "media align-items-center"
|
|
136
154
|
}, values.map(function (val, idx) {
|
|
137
155
|
var _ref2 = val || {},
|
|
@@ -141,8 +159,8 @@ var UploadField = function UploadField(_ref) {
|
|
|
141
159
|
filename = _ref2$filename === void 0 ? null : _ref2$filename,
|
|
142
160
|
_ref2$size = _ref2.size,
|
|
143
161
|
size = _ref2$size === void 0 ? 0 : _ref2$size,
|
|
144
|
-
_ref2$
|
|
145
|
-
|
|
162
|
+
_ref2$thumbnail_url = _ref2.thumbnail_url,
|
|
163
|
+
thumbnailUrl = _ref2$thumbnail_url === void 0 ? null : _ref2$thumbnail_url,
|
|
146
164
|
_ref2$preview = _ref2.preview,
|
|
147
165
|
preview = _ref2$preview === void 0 ? null : _ref2$preview,
|
|
148
166
|
_ref2$data = _ref2.data,
|
|
@@ -169,29 +187,32 @@ var UploadField = function UploadField(_ref) {
|
|
|
169
187
|
break;
|
|
170
188
|
}
|
|
171
189
|
|
|
172
|
-
var hasPreview = preview !== null ||
|
|
173
|
-
return /*#__PURE__*/React__default[
|
|
190
|
+
var hasPreview = preview !== null || thumbnailUrl !== null;
|
|
191
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
174
192
|
className: "d-flex align-items-center justify-content-between my-1",
|
|
175
193
|
key: "file-".concat(id, "-").concat(filename, "-").concat(idx + 1)
|
|
176
|
-
}, /*#__PURE__*/React__default[
|
|
177
|
-
className: "d-flex align-items-center mx-2"
|
|
178
|
-
}, !hasPreview && faIcon !== null ? /*#__PURE__*/React__default[
|
|
194
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
195
|
+
className: "d-flex align-items-center mx-2 text-truncate"
|
|
196
|
+
}, !hasPreview && faIcon !== null ? /*#__PURE__*/React__default["default"].createElement(reactFontawesome.FontAwesomeIcon, {
|
|
179
197
|
icon: faIcon,
|
|
180
198
|
className: "me-2"
|
|
181
|
-
}) : null, hasPreview ? /*#__PURE__*/React__default[
|
|
199
|
+
}) : null, hasPreview ? /*#__PURE__*/React__default["default"].createElement("img", {
|
|
182
200
|
className: "img-thumbnail me-2",
|
|
183
|
-
src: preview ||
|
|
201
|
+
src: preview || thumbnailUrl,
|
|
184
202
|
alt: "preview",
|
|
185
203
|
style: {
|
|
186
|
-
height: 100
|
|
204
|
+
height: 100,
|
|
205
|
+
backgroundImage: 'linear-gradient(45deg, #eee 25%, transparent 25%), linear-gradient(-45deg, #eee 25%, transparent 25%), linear-gradient(45deg, transparent 75%, #eee 75%), linear-gradient(-45deg, transparent 75%, #eee 75%)',
|
|
206
|
+
backgroundSize: '20px 20px',
|
|
207
|
+
backgroundPosition: '0 0, 0 10px, 10px -10px, -10px 0'
|
|
187
208
|
}
|
|
188
|
-
}) : null, /*#__PURE__*/React__default[
|
|
209
|
+
}) : null, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
189
210
|
className: "media-body text-truncate small me-2"
|
|
190
|
-
}, /*#__PURE__*/React__default[
|
|
211
|
+
}, /*#__PURE__*/React__default["default"].createElement("strong", null, file || filename)), /*#__PURE__*/React__default["default"].createElement("small", {
|
|
191
212
|
className: "text-muted me-2"
|
|
192
|
-
}, size > 0 ? prettyBytes__default[
|
|
213
|
+
}, size > 0 ? prettyBytes__default["default"](size) : size)), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
193
214
|
className: "mx-2"
|
|
194
|
-
}, /*#__PURE__*/React__default[
|
|
215
|
+
}, /*#__PURE__*/React__default["default"].createElement(Button__default["default"], {
|
|
195
216
|
type: "button",
|
|
196
217
|
size: "sm",
|
|
197
218
|
theme: "secondary",
|
|
@@ -199,18 +220,18 @@ var UploadField = function UploadField(_ref) {
|
|
|
199
220
|
onClick: function onClick() {
|
|
200
221
|
return onClickRemove(idx);
|
|
201
222
|
}
|
|
202
|
-
}, /*#__PURE__*/React__default[
|
|
223
|
+
}, /*#__PURE__*/React__default["default"].createElement(reactFontawesome.FontAwesomeIcon, {
|
|
203
224
|
icon: freeSolidSvgIcons.faTimes
|
|
204
225
|
}))));
|
|
205
|
-
})))) : /*#__PURE__*/React__default[
|
|
226
|
+
})))) : /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, withButton ? /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(Button__default["default"], {
|
|
206
227
|
type: "button",
|
|
207
228
|
theme: "primary",
|
|
208
229
|
onClick: openModal
|
|
209
|
-
}, /*#__PURE__*/React__default[
|
|
230
|
+
}, /*#__PURE__*/React__default["default"].createElement(Label__default["default"], null, addButtonLabel))) : /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, uppy !== null ? /*#__PURE__*/React__default["default"].createElement(react.Dashboard, {
|
|
210
231
|
uppy: uppy,
|
|
211
232
|
height: 300,
|
|
212
233
|
plugins: sources
|
|
213
|
-
}) : null)), withButton && uppy !== null ? /*#__PURE__*/React__default[
|
|
234
|
+
}) : null)), withButton && uppy !== null ? /*#__PURE__*/React__default["default"].createElement(react.DashboardModal, {
|
|
214
235
|
uppy: uppy,
|
|
215
236
|
plugins: sources,
|
|
216
237
|
open: modalOpened,
|
|
@@ -221,7 +242,7 @@ var UploadField = function UploadField(_ref) {
|
|
|
221
242
|
|
|
222
243
|
UploadField.propTypes = propTypes;
|
|
223
244
|
UploadField.defaultProps = defaultProps;
|
|
224
|
-
var UploadField$1 = /*#__PURE__*/React__default[
|
|
245
|
+
var UploadField$1 = /*#__PURE__*/React__default["default"].memo(UploadField);
|
|
225
246
|
|
|
226
247
|
var definition = [{
|
|
227
248
|
id: 'upload',
|
|
@@ -240,35 +261,35 @@ var definition = [{
|
|
|
240
261
|
/* eslint-disable react/jsx-props-no-spreading */
|
|
241
262
|
|
|
242
263
|
var AudioField = function AudioField(props) {
|
|
243
|
-
return /*#__PURE__*/React__default[
|
|
264
|
+
return /*#__PURE__*/React__default["default"].createElement(UploadField$1, Object.assign({}, props, {
|
|
244
265
|
types: ['audio']
|
|
245
266
|
}));
|
|
246
267
|
};
|
|
247
268
|
|
|
248
|
-
var AudioField$1 = /*#__PURE__*/React__default[
|
|
269
|
+
var AudioField$1 = /*#__PURE__*/React__default["default"].memo(AudioField);
|
|
249
270
|
|
|
250
271
|
/* eslint-disable react/jsx-props-no-spreading */
|
|
251
272
|
|
|
252
273
|
var ImageField = function ImageField(props) {
|
|
253
|
-
return /*#__PURE__*/React__default[
|
|
274
|
+
return /*#__PURE__*/React__default["default"].createElement(UploadField$1, Object.assign({}, props, {
|
|
254
275
|
types: ['image']
|
|
255
276
|
}));
|
|
256
277
|
};
|
|
257
278
|
|
|
258
|
-
var ImageField$1 = /*#__PURE__*/React__default[
|
|
279
|
+
var ImageField$1 = /*#__PURE__*/React__default["default"].memo(ImageField);
|
|
259
280
|
|
|
260
281
|
/* eslint-disable react/jsx-props-no-spreading */
|
|
261
282
|
|
|
262
283
|
var VideoField = function VideoField(props) {
|
|
263
|
-
return /*#__PURE__*/React__default[
|
|
284
|
+
return /*#__PURE__*/React__default["default"].createElement(UploadField$1, Object.assign({}, props, {
|
|
264
285
|
types: ['video']
|
|
265
286
|
}));
|
|
266
287
|
};
|
|
267
288
|
|
|
268
|
-
var VideoField$1 = /*#__PURE__*/React__default[
|
|
289
|
+
var VideoField$1 = /*#__PURE__*/React__default["default"].memo(VideoField);
|
|
269
290
|
|
|
270
291
|
exports.AudioField = AudioField$1;
|
|
271
292
|
exports.ImageField = ImageField$1;
|
|
272
293
|
exports.VideoField = VideoField$1;
|
|
273
|
-
exports
|
|
294
|
+
exports["default"] = UploadField$1;
|
|
274
295
|
exports.definition = definition;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@panneau/field-upload",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.3-alpha.1",
|
|
4
4
|
"description": "An Upload field",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"javascript"
|
|
@@ -44,34 +44,34 @@
|
|
|
44
44
|
"prepare": "../../scripts/prepare-package.sh"
|
|
45
45
|
},
|
|
46
46
|
"devDependencies": {
|
|
47
|
-
"react": "^16.8.0",
|
|
48
|
-
"react-dom": "^16.8.0"
|
|
47
|
+
"react": "^16.8.0 || ^17.0.0 || ^18.0.0",
|
|
48
|
+
"react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0"
|
|
49
49
|
},
|
|
50
50
|
"peerDependencies": {
|
|
51
|
-
"react": "^16.8.0",
|
|
52
|
-
"react-dom": "^16.8.0"
|
|
51
|
+
"react": "^16.8.0 || ^17.0.0 || ^18.0.0",
|
|
52
|
+
"react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0"
|
|
53
53
|
},
|
|
54
54
|
"dependencies": {
|
|
55
55
|
"@babel/runtime": "^7.12.5",
|
|
56
56
|
"@fortawesome/fontawesome-svg-core": "^1.2.35",
|
|
57
57
|
"@fortawesome/free-solid-svg-icons": "^5.15.3",
|
|
58
58
|
"@fortawesome/react-fontawesome": "^0.1.14",
|
|
59
|
-
"@panneau/core": "^1.0.
|
|
60
|
-
"@panneau/element-button": "^1.0.
|
|
61
|
-
"@panneau/element-card": "^1.0.
|
|
62
|
-
"@panneau/element-label": "^1.0.
|
|
63
|
-
"@panneau/themes": "^1.0.
|
|
64
|
-
"@uppy/core": "^1.
|
|
65
|
-
"@uppy/dashboard": "^1.
|
|
66
|
-
"@uppy/react": "^1.
|
|
59
|
+
"@panneau/core": "^1.0.3-alpha.1",
|
|
60
|
+
"@panneau/element-button": "^1.0.3-alpha.1",
|
|
61
|
+
"@panneau/element-card": "^1.0.3-alpha.1",
|
|
62
|
+
"@panneau/element-label": "^1.0.3-alpha.1",
|
|
63
|
+
"@panneau/themes": "^1.0.3-alpha.1",
|
|
64
|
+
"@uppy/core": "^2.1.4",
|
|
65
|
+
"@uppy/dashboard": "^2.1.3",
|
|
66
|
+
"@uppy/react": "^2.1.2",
|
|
67
67
|
"classnames": "^2.2.6",
|
|
68
68
|
"lodash": "^4.17.21",
|
|
69
69
|
"pretty-bytes": "^5.4.1",
|
|
70
70
|
"prop-types": "^15.7.2",
|
|
71
|
-
"react-intl": "^5.15.8"
|
|
71
|
+
"react-intl": "^5.15.8||^6.0.0"
|
|
72
72
|
},
|
|
73
73
|
"publishConfig": {
|
|
74
74
|
"access": "public"
|
|
75
75
|
},
|
|
76
|
-
"gitHead": "
|
|
76
|
+
"gitHead": "e04e663c7f1eb692f89a0136f2e8f45024fbe355"
|
|
77
77
|
}
|