@panneau/field-upload 1.0.3-alpha.2 → 1.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.
- package/es/index.js +29 -50
- package/lib/index.js +29 -50
- package/package.json +7 -7
package/es/index.js
CHANGED
|
@@ -48,40 +48,35 @@ var defaultProps = {
|
|
|
48
48
|
onChange: null,
|
|
49
49
|
className: null
|
|
50
50
|
};
|
|
51
|
-
|
|
52
51
|
var UploadField = function UploadField(_ref) {
|
|
53
52
|
var value = _ref.value,
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
53
|
+
types = _ref.types,
|
|
54
|
+
fileTypes = _ref.fileTypes,
|
|
55
|
+
sources = _ref.sources,
|
|
56
|
+
withButton = _ref.withButton,
|
|
57
|
+
addButtonLabel = _ref.addButtonLabel,
|
|
58
|
+
allowMultipleUploads = _ref.allowMultipleUploads,
|
|
59
|
+
onChange = _ref.onChange,
|
|
60
|
+
className = _ref.className;
|
|
62
61
|
var onComplete = useCallback(function (response) {
|
|
63
62
|
console.log('upload complete', response); // eslint-disable-line
|
|
64
|
-
|
|
65
63
|
var newValue = null;
|
|
66
|
-
|
|
67
64
|
if (isArray(response)) {
|
|
68
65
|
if (allowMultipleUploads) {
|
|
69
66
|
newValue = response;
|
|
70
67
|
} else {
|
|
71
68
|
var _response = _slicedToArray(response, 1),
|
|
72
|
-
|
|
73
|
-
|
|
69
|
+
first = _response[0];
|
|
74
70
|
newValue = first;
|
|
75
71
|
}
|
|
76
72
|
} else if (response && response.successful) {
|
|
77
73
|
newValue = response.successful.length > 0 ? response.successful[0].response.body : null;
|
|
78
|
-
}
|
|
79
|
-
|
|
74
|
+
}
|
|
80
75
|
|
|
76
|
+
// Merge the response from our back-end
|
|
81
77
|
if (isObject(newValue) && isObject(newValue.response) && newValue.response.status === 200 && newValue.response.body !== null) {
|
|
82
78
|
newValue = _objectSpread(_objectSpread({}, newValue), newValue.response.body || null);
|
|
83
79
|
}
|
|
84
|
-
|
|
85
80
|
console.log('new upload value', newValue); // eslint-disable-line
|
|
86
81
|
|
|
87
82
|
if (onChange !== null) {
|
|
@@ -93,7 +88,6 @@ var UploadField = function UploadField(_ref) {
|
|
|
93
88
|
if (fileTypes !== null) {
|
|
94
89
|
return fileTypes;
|
|
95
90
|
}
|
|
96
|
-
|
|
97
91
|
return typesString.split('.').map(function (type) {
|
|
98
92
|
return "".concat(type, "/*");
|
|
99
93
|
});
|
|
@@ -114,12 +108,10 @@ var UploadField = function UploadField(_ref) {
|
|
|
114
108
|
onChange(null);
|
|
115
109
|
}
|
|
116
110
|
}, [value, onChange]);
|
|
117
|
-
|
|
118
111
|
var _useState = useState(false),
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
112
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
113
|
+
modalOpened = _useState2[0],
|
|
114
|
+
setModalOpened = _useState2[1];
|
|
123
115
|
var openModal = useCallback(function () {
|
|
124
116
|
setModalOpened(true);
|
|
125
117
|
}, [setModalOpened]);
|
|
@@ -137,40 +129,34 @@ var UploadField = function UploadField(_ref) {
|
|
|
137
129
|
className: "media align-items-center"
|
|
138
130
|
}, values.map(function (val, idx) {
|
|
139
131
|
var _ref2 = val || {},
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
132
|
+
_ref2$id = _ref2.id,
|
|
133
|
+
id = _ref2$id === void 0 ? null : _ref2$id,
|
|
134
|
+
_ref2$filename = _ref2.filename,
|
|
135
|
+
filename = _ref2$filename === void 0 ? null : _ref2$filename,
|
|
136
|
+
_ref2$size = _ref2.size,
|
|
137
|
+
size = _ref2$size === void 0 ? 0 : _ref2$size,
|
|
138
|
+
_ref2$thumbnail_url = _ref2.thumbnail_url,
|
|
139
|
+
thumbnailUrl = _ref2$thumbnail_url === void 0 ? null : _ref2$thumbnail_url,
|
|
140
|
+
_ref2$preview = _ref2.preview,
|
|
141
|
+
preview = _ref2$preview === void 0 ? null : _ref2$preview,
|
|
142
|
+
_ref2$data = _ref2.data,
|
|
143
|
+
data = _ref2$data === void 0 ? {} : _ref2$data,
|
|
144
|
+
type = _ref2.type;
|
|
154
145
|
var _ref3 = data || {},
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
146
|
+
_ref3$file = _ref3.file,
|
|
147
|
+
file = _ref3$file === void 0 ? null : _ref3$file;
|
|
158
148
|
var faIcon = null;
|
|
159
|
-
|
|
160
149
|
switch (type) {
|
|
161
150
|
case 'audio':
|
|
162
151
|
faIcon = faFileAudio;
|
|
163
152
|
break;
|
|
164
|
-
|
|
165
153
|
case 'image':
|
|
166
154
|
faIcon = faFileImage;
|
|
167
155
|
break;
|
|
168
|
-
|
|
169
156
|
case 'video':
|
|
170
157
|
faIcon = faFileVideo;
|
|
171
158
|
break;
|
|
172
159
|
}
|
|
173
|
-
|
|
174
160
|
var hasPreview = preview !== null || thumbnailUrl !== null;
|
|
175
161
|
return /*#__PURE__*/React.createElement("div", {
|
|
176
162
|
className: "d-flex align-items-center justify-content-between my-1",
|
|
@@ -223,7 +209,6 @@ var UploadField = function UploadField(_ref) {
|
|
|
223
209
|
closeModalOnClickOutside: true
|
|
224
210
|
}) : null);
|
|
225
211
|
};
|
|
226
|
-
|
|
227
212
|
UploadField.propTypes = propTypes;
|
|
228
213
|
UploadField.defaultProps = defaultProps;
|
|
229
214
|
var UploadField$1 = /*#__PURE__*/React.memo(UploadField);
|
|
@@ -243,33 +228,27 @@ var definition = [{
|
|
|
243
228
|
}];
|
|
244
229
|
|
|
245
230
|
/* eslint-disable react/jsx-props-no-spreading */
|
|
246
|
-
|
|
247
231
|
var AudioField = function AudioField(props) {
|
|
248
232
|
return /*#__PURE__*/React.createElement(UploadField$1, Object.assign({}, props, {
|
|
249
233
|
types: ['audio']
|
|
250
234
|
}));
|
|
251
235
|
};
|
|
252
|
-
|
|
253
236
|
var AudioField$1 = /*#__PURE__*/React.memo(AudioField);
|
|
254
237
|
|
|
255
238
|
/* eslint-disable react/jsx-props-no-spreading */
|
|
256
|
-
|
|
257
239
|
var ImageField = function ImageField(props) {
|
|
258
240
|
return /*#__PURE__*/React.createElement(UploadField$1, Object.assign({}, props, {
|
|
259
241
|
types: ['image']
|
|
260
242
|
}));
|
|
261
243
|
};
|
|
262
|
-
|
|
263
244
|
var ImageField$1 = /*#__PURE__*/React.memo(ImageField);
|
|
264
245
|
|
|
265
246
|
/* eslint-disable react/jsx-props-no-spreading */
|
|
266
|
-
|
|
267
247
|
var VideoField = function VideoField(props) {
|
|
268
248
|
return /*#__PURE__*/React.createElement(UploadField$1, Object.assign({}, props, {
|
|
269
249
|
types: ['video']
|
|
270
250
|
}));
|
|
271
251
|
};
|
|
272
|
-
|
|
273
252
|
var VideoField$1 = /*#__PURE__*/React.memo(VideoField);
|
|
274
253
|
|
|
275
254
|
export { AudioField$1 as AudioField, ImageField$1 as ImageField, VideoField$1 as VideoField, UploadField$1 as default, definition };
|
package/lib/index.js
CHANGED
|
@@ -64,40 +64,35 @@ var defaultProps = {
|
|
|
64
64
|
onChange: null,
|
|
65
65
|
className: null
|
|
66
66
|
};
|
|
67
|
-
|
|
68
67
|
var UploadField = function UploadField(_ref) {
|
|
69
68
|
var value = _ref.value,
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
69
|
+
types = _ref.types,
|
|
70
|
+
fileTypes = _ref.fileTypes,
|
|
71
|
+
sources = _ref.sources,
|
|
72
|
+
withButton = _ref.withButton,
|
|
73
|
+
addButtonLabel = _ref.addButtonLabel,
|
|
74
|
+
allowMultipleUploads = _ref.allowMultipleUploads,
|
|
75
|
+
onChange = _ref.onChange,
|
|
76
|
+
className = _ref.className;
|
|
78
77
|
var onComplete = React.useCallback(function (response) {
|
|
79
78
|
console.log('upload complete', response); // eslint-disable-line
|
|
80
|
-
|
|
81
79
|
var newValue = null;
|
|
82
|
-
|
|
83
80
|
if (isArray__default["default"](response)) {
|
|
84
81
|
if (allowMultipleUploads) {
|
|
85
82
|
newValue = response;
|
|
86
83
|
} else {
|
|
87
84
|
var _response = _slicedToArray__default["default"](response, 1),
|
|
88
|
-
|
|
89
|
-
|
|
85
|
+
first = _response[0];
|
|
90
86
|
newValue = first;
|
|
91
87
|
}
|
|
92
88
|
} else if (response && response.successful) {
|
|
93
89
|
newValue = response.successful.length > 0 ? response.successful[0].response.body : null;
|
|
94
|
-
}
|
|
95
|
-
|
|
90
|
+
}
|
|
96
91
|
|
|
92
|
+
// Merge the response from our back-end
|
|
97
93
|
if (isObject__default["default"](newValue) && isObject__default["default"](newValue.response) && newValue.response.status === 200 && newValue.response.body !== null) {
|
|
98
94
|
newValue = _objectSpread__default["default"](_objectSpread__default["default"]({}, newValue), newValue.response.body || null);
|
|
99
95
|
}
|
|
100
|
-
|
|
101
96
|
console.log('new upload value', newValue); // eslint-disable-line
|
|
102
97
|
|
|
103
98
|
if (onChange !== null) {
|
|
@@ -109,7 +104,6 @@ var UploadField = function UploadField(_ref) {
|
|
|
109
104
|
if (fileTypes !== null) {
|
|
110
105
|
return fileTypes;
|
|
111
106
|
}
|
|
112
|
-
|
|
113
107
|
return typesString.split('.').map(function (type) {
|
|
114
108
|
return "".concat(type, "/*");
|
|
115
109
|
});
|
|
@@ -130,12 +124,10 @@ var UploadField = function UploadField(_ref) {
|
|
|
130
124
|
onChange(null);
|
|
131
125
|
}
|
|
132
126
|
}, [value, onChange]);
|
|
133
|
-
|
|
134
127
|
var _useState = React.useState(false),
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
128
|
+
_useState2 = _slicedToArray__default["default"](_useState, 2),
|
|
129
|
+
modalOpened = _useState2[0],
|
|
130
|
+
setModalOpened = _useState2[1];
|
|
139
131
|
var openModal = React.useCallback(function () {
|
|
140
132
|
setModalOpened(true);
|
|
141
133
|
}, [setModalOpened]);
|
|
@@ -153,40 +145,34 @@ var UploadField = function UploadField(_ref) {
|
|
|
153
145
|
className: "media align-items-center"
|
|
154
146
|
}, values.map(function (val, idx) {
|
|
155
147
|
var _ref2 = val || {},
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
148
|
+
_ref2$id = _ref2.id,
|
|
149
|
+
id = _ref2$id === void 0 ? null : _ref2$id,
|
|
150
|
+
_ref2$filename = _ref2.filename,
|
|
151
|
+
filename = _ref2$filename === void 0 ? null : _ref2$filename,
|
|
152
|
+
_ref2$size = _ref2.size,
|
|
153
|
+
size = _ref2$size === void 0 ? 0 : _ref2$size,
|
|
154
|
+
_ref2$thumbnail_url = _ref2.thumbnail_url,
|
|
155
|
+
thumbnailUrl = _ref2$thumbnail_url === void 0 ? null : _ref2$thumbnail_url,
|
|
156
|
+
_ref2$preview = _ref2.preview,
|
|
157
|
+
preview = _ref2$preview === void 0 ? null : _ref2$preview,
|
|
158
|
+
_ref2$data = _ref2.data,
|
|
159
|
+
data = _ref2$data === void 0 ? {} : _ref2$data,
|
|
160
|
+
type = _ref2.type;
|
|
170
161
|
var _ref3 = data || {},
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
162
|
+
_ref3$file = _ref3.file,
|
|
163
|
+
file = _ref3$file === void 0 ? null : _ref3$file;
|
|
174
164
|
var faIcon = null;
|
|
175
|
-
|
|
176
165
|
switch (type) {
|
|
177
166
|
case 'audio':
|
|
178
167
|
faIcon = freeSolidSvgIcons.faFileAudio;
|
|
179
168
|
break;
|
|
180
|
-
|
|
181
169
|
case 'image':
|
|
182
170
|
faIcon = freeSolidSvgIcons.faFileImage;
|
|
183
171
|
break;
|
|
184
|
-
|
|
185
172
|
case 'video':
|
|
186
173
|
faIcon = freeSolidSvgIcons.faFileVideo;
|
|
187
174
|
break;
|
|
188
175
|
}
|
|
189
|
-
|
|
190
176
|
var hasPreview = preview !== null || thumbnailUrl !== null;
|
|
191
177
|
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
192
178
|
className: "d-flex align-items-center justify-content-between my-1",
|
|
@@ -239,7 +225,6 @@ var UploadField = function UploadField(_ref) {
|
|
|
239
225
|
closeModalOnClickOutside: true
|
|
240
226
|
}) : null);
|
|
241
227
|
};
|
|
242
|
-
|
|
243
228
|
UploadField.propTypes = propTypes;
|
|
244
229
|
UploadField.defaultProps = defaultProps;
|
|
245
230
|
var UploadField$1 = /*#__PURE__*/React__default["default"].memo(UploadField);
|
|
@@ -259,33 +244,27 @@ var definition = [{
|
|
|
259
244
|
}];
|
|
260
245
|
|
|
261
246
|
/* eslint-disable react/jsx-props-no-spreading */
|
|
262
|
-
|
|
263
247
|
var AudioField = function AudioField(props) {
|
|
264
248
|
return /*#__PURE__*/React__default["default"].createElement(UploadField$1, Object.assign({}, props, {
|
|
265
249
|
types: ['audio']
|
|
266
250
|
}));
|
|
267
251
|
};
|
|
268
|
-
|
|
269
252
|
var AudioField$1 = /*#__PURE__*/React__default["default"].memo(AudioField);
|
|
270
253
|
|
|
271
254
|
/* eslint-disable react/jsx-props-no-spreading */
|
|
272
|
-
|
|
273
255
|
var ImageField = function ImageField(props) {
|
|
274
256
|
return /*#__PURE__*/React__default["default"].createElement(UploadField$1, Object.assign({}, props, {
|
|
275
257
|
types: ['image']
|
|
276
258
|
}));
|
|
277
259
|
};
|
|
278
|
-
|
|
279
260
|
var ImageField$1 = /*#__PURE__*/React__default["default"].memo(ImageField);
|
|
280
261
|
|
|
281
262
|
/* eslint-disable react/jsx-props-no-spreading */
|
|
282
|
-
|
|
283
263
|
var VideoField = function VideoField(props) {
|
|
284
264
|
return /*#__PURE__*/React__default["default"].createElement(UploadField$1, Object.assign({}, props, {
|
|
285
265
|
types: ['video']
|
|
286
266
|
}));
|
|
287
267
|
};
|
|
288
|
-
|
|
289
268
|
var VideoField$1 = /*#__PURE__*/React__default["default"].memo(VideoField);
|
|
290
269
|
|
|
291
270
|
exports.AudioField = AudioField$1;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@panneau/field-upload",
|
|
3
|
-
"version": "1.0.3
|
|
3
|
+
"version": "1.0.3",
|
|
4
4
|
"description": "An Upload field",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"javascript"
|
|
@@ -56,11 +56,11 @@
|
|
|
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.3
|
|
60
|
-
"@panneau/element-button": "^1.0.3
|
|
61
|
-
"@panneau/element-card": "^1.0.3
|
|
62
|
-
"@panneau/element-label": "^1.0.3
|
|
63
|
-
"@panneau/themes": "^1.0.3
|
|
59
|
+
"@panneau/core": "^1.0.3",
|
|
60
|
+
"@panneau/element-button": "^1.0.3",
|
|
61
|
+
"@panneau/element-card": "^1.0.3",
|
|
62
|
+
"@panneau/element-label": "^1.0.3",
|
|
63
|
+
"@panneau/themes": "^1.0.3",
|
|
64
64
|
"@uppy/core": "^2.1.4",
|
|
65
65
|
"@uppy/dashboard": "^2.1.3",
|
|
66
66
|
"@uppy/react": "^2.1.2",
|
|
@@ -73,5 +73,5 @@
|
|
|
73
73
|
"publishConfig": {
|
|
74
74
|
"access": "public"
|
|
75
75
|
},
|
|
76
|
-
"gitHead": "
|
|
76
|
+
"gitHead": "59e6842b1a768acb6fa826e6a6396d09e239c955"
|
|
77
77
|
}
|