@panneau/field-upload 3.0.95 → 3.0.97

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 (3) hide show
  1. package/es/index.js +40 -12
  2. package/lib/index.js +40 -12
  3. package/package.json +2 -2
package/es/index.js CHANGED
@@ -35,8 +35,10 @@ var propTypes = {
35
35
  sources: PropTypes.arrayOf(PropTypes.oneOf(['webcam', 'facebook', 'instagram', 'dropbox', 'google-drive'])),
36
36
  withButton: PropTypes.bool,
37
37
  withFind: PropTypes.bool,
38
+ withClearButton: PropTypes.bool,
38
39
  addButtonLabel: PropTypes$1.label,
39
40
  findButtonLabel: PropTypes$1.label,
41
+ clearButtonLabel: PropTypes$1.label,
40
42
  countLabel: PropTypes$1.label,
41
43
  confirmButtonLabel: PropTypes$1.label,
42
44
  cancelButtonLabel: PropTypes$1.label,
@@ -52,6 +54,7 @@ var propTypes = {
52
54
  height: PropTypes.number,
53
55
  disabled: PropTypes.bool,
54
56
  onChange: PropTypes.func,
57
+ onClear: PropTypes.func,
55
58
  className: PropTypes.string
56
59
  };
57
60
  var defaultProps = {
@@ -61,6 +64,7 @@ var defaultProps = {
61
64
  sources: ['webcam', 'facebook', 'instagram', 'dropbox', 'google-drive'],
62
65
  withButton: false,
63
66
  withFind: false,
67
+ withClearButton: false,
64
68
  addButtonLabel: /*#__PURE__*/React.createElement(FormattedMessage, {
65
69
  id: "NI9440",
66
70
  defaultMessage: [{
@@ -75,6 +79,13 @@ var defaultProps = {
75
79
  "value": "Find a file"
76
80
  }]
77
81
  }),
82
+ clearButtonLabel: /*#__PURE__*/React.createElement(FormattedMessage, {
83
+ id: "odaCUe",
84
+ defaultMessage: [{
85
+ "type": 0,
86
+ "value": "Clear"
87
+ }]
88
+ }),
78
89
  countLabel: /*#__PURE__*/React.createElement(FormattedMessage, {
79
90
  id: "XLOebh",
80
91
  defaultMessage: [{
@@ -106,6 +117,7 @@ var defaultProps = {
106
117
  height: 300,
107
118
  disabled: false,
108
119
  onChange: null,
120
+ onClear: null,
109
121
  className: null
110
122
  };
111
123
  var UploadField = function UploadField(_ref) {
@@ -115,8 +127,10 @@ var UploadField = function UploadField(_ref) {
115
127
  sources = _ref.sources,
116
128
  withButton = _ref.withButton,
117
129
  withFind = _ref.withFind,
130
+ withClearButton = _ref.withClearButton,
118
131
  addButtonLabel = _ref.addButtonLabel,
119
132
  findButtonLabel = _ref.findButtonLabel,
133
+ clearButtonLabel = _ref.clearButtonLabel,
120
134
  countLabel = _ref.countLabel,
121
135
  confirmButtonLabel = _ref.confirmButtonLabel,
122
136
  cancelButtonLabel = _ref.cancelButtonLabel,
@@ -130,6 +144,7 @@ var UploadField = function UploadField(_ref) {
130
144
  height = _ref.height,
131
145
  disabled = _ref.disabled,
132
146
  onChange = _ref.onChange,
147
+ onClear = _ref.onClear,
133
148
  className = _ref.className;
134
149
  var mergeData = useCallback(function (newValue) {
135
150
  // Merge the response from our back-end
@@ -199,17 +214,21 @@ var UploadField = function UploadField(_ref) {
199
214
  var closeModal = useCallback(function () {
200
215
  setModalOpened(false);
201
216
  if (uppy !== null) {
202
- uppy.cancelAll();
217
+ uppy.cancelAll({
218
+ reason: 'user'
219
+ });
203
220
  }
204
221
  }, [uppy, setModalOpened]);
205
-
206
- // const closeModalAndClear = useCallback(() => {
207
- // closeModal();
208
- // if (uppy !== null) {
209
- // uppy.cancelAll();
210
- // }
211
- // }, [uppy, closeModal]);
212
-
222
+ var onClickClear = useCallback(function () {
223
+ if (onClear !== null) {
224
+ onClear();
225
+ }
226
+ if (uppy !== null) {
227
+ uppy.cancelAll({
228
+ reason: 'user'
229
+ });
230
+ }
231
+ }, [uppy, onClear]);
213
232
  var onClickRemove = useCallback(function (idx) {
214
233
  if (onChange !== null && isArray(value) && value.length > 1) {
215
234
  onChange(value.filter(function (v, i) {
@@ -293,14 +312,23 @@ var UploadField = function UploadField(_ref) {
293
312
  return /*#__PURE__*/React.createElement("div", {
294
313
  className: classNames([styles.container, _defineProperty({}, className, className !== null)])
295
314
  // ref={containerRef}
296
- }, /*#__PURE__*/React.createElement(MediaCards, {
315
+ }, hasMedia ? /*#__PURE__*/React.createElement(MediaCards, {
297
316
  value: values,
298
317
  namePath: namePath,
299
318
  thumbnailPath: thumbnailPath,
300
319
  sizePath: sizePath,
301
320
  disabled: disabled,
302
321
  onClickRemove: onClickRemove
303
- }), (!hasMedia || allowMultipleUploads) && withButton ? /*#__PURE__*/React.createElement("div", {
322
+ }) : null, hasMedia && withClearButton ? /*#__PURE__*/React.createElement("div", {
323
+ className: "row mt-2"
324
+ }, /*#__PURE__*/React.createElement("div", {
325
+ className: "col-auto"
326
+ }, /*#__PURE__*/React.createElement(Button, {
327
+ type: "button",
328
+ theme: "primary",
329
+ onClick: onClickClear,
330
+ outline: true
331
+ }, /*#__PURE__*/React.createElement(Label, null, clearButtonLabel)))) : null, (!hasMedia || allowMultipleUploads) && withButton ? /*#__PURE__*/React.createElement("div", {
304
332
  className: "row"
305
333
  }, /*#__PURE__*/React.createElement("div", {
306
334
  className: "col-auto"
@@ -375,7 +403,7 @@ var UploadField = function UploadField(_ref) {
375
403
  // </Dialog>
376
404
  null, showResourceModal ? /*#__PURE__*/React.createElement(Dialog, {
377
405
  title: /*#__PURE__*/React.createElement(Label, null, findButtonLabel),
378
- size: "lg",
406
+ size: "xl",
379
407
  onClose: closeResourceModal
380
408
  }, /*#__PURE__*/React.createElement(ResourceItemsList, {
381
409
  resource: "medias",
package/lib/index.js CHANGED
@@ -55,8 +55,10 @@ var propTypes = {
55
55
  sources: PropTypes__default["default"].arrayOf(PropTypes__default["default"].oneOf(['webcam', 'facebook', 'instagram', 'dropbox', 'google-drive'])),
56
56
  withButton: PropTypes__default["default"].bool,
57
57
  withFind: PropTypes__default["default"].bool,
58
+ withClearButton: PropTypes__default["default"].bool,
58
59
  addButtonLabel: core.PropTypes.label,
59
60
  findButtonLabel: core.PropTypes.label,
61
+ clearButtonLabel: core.PropTypes.label,
60
62
  countLabel: core.PropTypes.label,
61
63
  confirmButtonLabel: core.PropTypes.label,
62
64
  cancelButtonLabel: core.PropTypes.label,
@@ -72,6 +74,7 @@ var propTypes = {
72
74
  height: PropTypes__default["default"].number,
73
75
  disabled: PropTypes__default["default"].bool,
74
76
  onChange: PropTypes__default["default"].func,
77
+ onClear: PropTypes__default["default"].func,
75
78
  className: PropTypes__default["default"].string
76
79
  };
77
80
  var defaultProps = {
@@ -81,6 +84,7 @@ var defaultProps = {
81
84
  sources: ['webcam', 'facebook', 'instagram', 'dropbox', 'google-drive'],
82
85
  withButton: false,
83
86
  withFind: false,
87
+ withClearButton: false,
84
88
  addButtonLabel: /*#__PURE__*/React__default["default"].createElement(reactIntl.FormattedMessage, {
85
89
  id: "NI9440",
86
90
  defaultMessage: [{
@@ -95,6 +99,13 @@ var defaultProps = {
95
99
  "value": "Find a file"
96
100
  }]
97
101
  }),
102
+ clearButtonLabel: /*#__PURE__*/React__default["default"].createElement(reactIntl.FormattedMessage, {
103
+ id: "odaCUe",
104
+ defaultMessage: [{
105
+ "type": 0,
106
+ "value": "Clear"
107
+ }]
108
+ }),
98
109
  countLabel: /*#__PURE__*/React__default["default"].createElement(reactIntl.FormattedMessage, {
99
110
  id: "XLOebh",
100
111
  defaultMessage: [{
@@ -126,6 +137,7 @@ var defaultProps = {
126
137
  height: 300,
127
138
  disabled: false,
128
139
  onChange: null,
140
+ onClear: null,
129
141
  className: null
130
142
  };
131
143
  var UploadField = function UploadField(_ref) {
@@ -135,8 +147,10 @@ var UploadField = function UploadField(_ref) {
135
147
  sources = _ref.sources,
136
148
  withButton = _ref.withButton,
137
149
  withFind = _ref.withFind,
150
+ withClearButton = _ref.withClearButton,
138
151
  addButtonLabel = _ref.addButtonLabel,
139
152
  findButtonLabel = _ref.findButtonLabel,
153
+ clearButtonLabel = _ref.clearButtonLabel,
140
154
  countLabel = _ref.countLabel,
141
155
  confirmButtonLabel = _ref.confirmButtonLabel,
142
156
  cancelButtonLabel = _ref.cancelButtonLabel,
@@ -150,6 +164,7 @@ var UploadField = function UploadField(_ref) {
150
164
  height = _ref.height,
151
165
  disabled = _ref.disabled,
152
166
  onChange = _ref.onChange,
167
+ onClear = _ref.onClear,
153
168
  className = _ref.className;
154
169
  var mergeData = React.useCallback(function (newValue) {
155
170
  // Merge the response from our back-end
@@ -219,17 +234,21 @@ var UploadField = function UploadField(_ref) {
219
234
  var closeModal = React.useCallback(function () {
220
235
  setModalOpened(false);
221
236
  if (uppy$1 !== null) {
222
- uppy$1.cancelAll();
237
+ uppy$1.cancelAll({
238
+ reason: 'user'
239
+ });
223
240
  }
224
241
  }, [uppy$1, setModalOpened]);
225
-
226
- // const closeModalAndClear = useCallback(() => {
227
- // closeModal();
228
- // if (uppy !== null) {
229
- // uppy.cancelAll();
230
- // }
231
- // }, [uppy, closeModal]);
232
-
242
+ var onClickClear = React.useCallback(function () {
243
+ if (onClear !== null) {
244
+ onClear();
245
+ }
246
+ if (uppy$1 !== null) {
247
+ uppy$1.cancelAll({
248
+ reason: 'user'
249
+ });
250
+ }
251
+ }, [uppy$1, onClear]);
233
252
  var onClickRemove = React.useCallback(function (idx) {
234
253
  if (onChange !== null && isArray__default["default"](value) && value.length > 1) {
235
254
  onChange(value.filter(function (v, i) {
@@ -313,14 +332,23 @@ var UploadField = function UploadField(_ref) {
313
332
  return /*#__PURE__*/React__default["default"].createElement("div", {
314
333
  className: classNames__default["default"]([styles.container, _defineProperty__default["default"]({}, className, className !== null)])
315
334
  // ref={containerRef}
316
- }, /*#__PURE__*/React__default["default"].createElement(elementMediaCard.MediaCards, {
335
+ }, hasMedia ? /*#__PURE__*/React__default["default"].createElement(elementMediaCard.MediaCards, {
317
336
  value: values,
318
337
  namePath: namePath,
319
338
  thumbnailPath: thumbnailPath,
320
339
  sizePath: sizePath,
321
340
  disabled: disabled,
322
341
  onClickRemove: onClickRemove
323
- }), (!hasMedia || allowMultipleUploads) && withButton ? /*#__PURE__*/React__default["default"].createElement("div", {
342
+ }) : null, hasMedia && withClearButton ? /*#__PURE__*/React__default["default"].createElement("div", {
343
+ className: "row mt-2"
344
+ }, /*#__PURE__*/React__default["default"].createElement("div", {
345
+ className: "col-auto"
346
+ }, /*#__PURE__*/React__default["default"].createElement(Button__default["default"], {
347
+ type: "button",
348
+ theme: "primary",
349
+ onClick: onClickClear,
350
+ outline: true
351
+ }, /*#__PURE__*/React__default["default"].createElement(Label__default["default"], null, clearButtonLabel)))) : null, (!hasMedia || allowMultipleUploads) && withButton ? /*#__PURE__*/React__default["default"].createElement("div", {
324
352
  className: "row"
325
353
  }, /*#__PURE__*/React__default["default"].createElement("div", {
326
354
  className: "col-auto"
@@ -395,7 +423,7 @@ var UploadField = function UploadField(_ref) {
395
423
  // </Dialog>
396
424
  null, showResourceModal ? /*#__PURE__*/React__default["default"].createElement(Dialog__default["default"], {
397
425
  title: /*#__PURE__*/React__default["default"].createElement(Label__default["default"], null, findButtonLabel),
398
- size: "lg",
426
+ size: "xl",
399
427
  onClose: closeResourceModal
400
428
  }, /*#__PURE__*/React__default["default"].createElement(ResourceItemsList__default["default"], {
401
429
  resource: "medias",
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@panneau/field-upload",
3
- "version": "3.0.95",
3
+ "version": "3.0.97",
4
4
  "description": "An Upload field",
5
5
  "keywords": [
6
6
  "javascript"
@@ -81,5 +81,5 @@
81
81
  "publishConfig": {
82
82
  "access": "public"
83
83
  },
84
- "gitHead": "599e92b3a8564b896e6361ce9f44be9d664bd93b"
84
+ "gitHead": "041aa66bfc4eff0723cc6d26e1e9a4c56beb65f9"
85
85
  }