@panneau/field-upload 4.0.2 → 4.0.4

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 (2) hide show
  1. package/es/index.js +186 -160
  2. package/package.json +9 -9
package/es/index.js CHANGED
@@ -18,12 +18,11 @@ import ModalResourceItems from '@panneau/modal-resource-items';
18
18
  import { useUppy } from '@panneau/uppy';
19
19
  import '@uppy/core/css/style.css';
20
20
  import '@uppy/dashboard/css/style.css';
21
+ import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
21
22
  import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
22
23
 
23
24
  var styles = {"container":"panneau-field-upload-container","dashboard":"panneau-field-upload-dashboard","dashboardModal":"panneau-field-upload-dashboardModal"};
24
25
 
25
- // import '@uppy/react/css/style.css';
26
-
27
26
  var DEFAULT_TYPES = ['audio', 'image', 'video'];
28
27
  var DEFAULT_SOURCES = ['webcam', 'facebook', 'instagram', 'dropbox', 'google-drive'];
29
28
  function UploadField(_ref) {
@@ -91,21 +90,21 @@ function UploadField(_ref) {
91
90
  onClickFind = _ref$onClickFind === void 0 ? null : _ref$onClickFind,
92
91
  _ref$className = _ref.className,
93
92
  className = _ref$className === void 0 ? null : _ref$className;
94
- var addButtonLabel = initialAddButtonLabel || /*#__PURE__*/React.createElement(FormattedMessage, {
93
+ var addButtonLabel = initialAddButtonLabel || /*#__PURE__*/jsx(FormattedMessage, {
95
94
  id: "BeKVq6",
96
95
  defaultMessage: [{
97
96
  "type": 0,
98
97
  "value": "Upload file"
99
98
  }]
100
99
  });
101
- var findButtonLabel = initialFindButtonLabel || /*#__PURE__*/React.createElement(FormattedMessage, {
100
+ var findButtonLabel = initialFindButtonLabel || /*#__PURE__*/jsx(FormattedMessage, {
102
101
  id: "une5WQ",
103
102
  defaultMessage: [{
104
103
  "type": 0,
105
104
  "value": "Find a file"
106
105
  }]
107
106
  });
108
- var clearButtonLabel = initialCleanButtonLabel || /*#__PURE__*/React.createElement(FormattedMessage, {
107
+ var clearButtonLabel = initialCleanButtonLabel || /*#__PURE__*/jsx(FormattedMessage, {
109
108
  id: "odaCUe",
110
109
  defaultMessage: [{
111
110
  "type": 0,
@@ -328,132 +327,155 @@ function UploadField(_ref) {
328
327
  };
329
328
  }, [uppy, startLoading, endLoading]);
330
329
  var finalLoading = loading || parentLoading;
331
- return /*#__PURE__*/React.createElement("div", {
330
+ return /*#__PURE__*/jsxs("div", {
332
331
  className: classNames([styles.container, _defineProperty({}, className, className !== null)]),
333
- ref: containerRef
334
- }, !withoutMedia && hasMedia ? /*#__PURE__*/React.createElement(MediaCards, {
335
- value: values,
336
- namePath: namePath,
337
- thumbnailPath: thumbnailPath,
338
- sizePath: sizePath,
339
- linkPath: linkPath,
340
- disabled: disabled,
341
- onClickRemove: onClickRemove
342
- }) : null, !withoutMedia && hasMedia && withClearButton ? /*#__PURE__*/React.createElement("div", {
343
- className: "row mt-2"
344
- }, /*#__PURE__*/React.createElement("div", {
345
- className: "col-auto"
346
- }, /*#__PURE__*/React.createElement(Button, {
347
- type: "button",
348
- theme: "primary",
349
- onClick: onClickClear
350
- }, /*#__PURE__*/React.createElement(Label, null, clearButtonLabel)))) : null, withoutMedia || (!hasMedia || allowMultipleUploads) && withButton ? /*#__PURE__*/React.createElement("div", {
351
- className: "row"
352
- }, /*#__PURE__*/React.createElement("div", {
353
- className: "col-auto"
354
- }, /*#__PURE__*/React.createElement(Button, {
355
- id: "trigger-uppy",
356
- type: "button",
357
- theme: "primary",
358
- icon: finalLoading ? 'loading' : 'upload',
359
- iconPosition: "right",
360
- onClick: onClickAdd || openModal,
361
- disabled: finalLoading || disabled,
362
- outline: outline
363
- }, /*#__PURE__*/React.createElement(Label, null, finalLoading ? /*#__PURE__*/React.createElement(FormattedMessage, {
364
- id: "NozDYd",
365
- defaultMessage: [{
366
- "type": 0,
367
- "value": "Uploading"
368
- }]
369
- }) : addButtonLabel))), withFind ? /*#__PURE__*/React.createElement("div", {
370
- className: "col-auto ps-0"
371
- }, /*#__PURE__*/React.createElement(Button, {
372
- type: "button",
373
- theme: "primary",
374
- icon: "search",
375
- iconPosition: "right",
376
- onClick: finalOnClickFind,
377
- disabled: disabled,
378
- outline: outline
379
- }, /*#__PURE__*/React.createElement(Label, null, findButtonLabel))) : null) : null, finalUppy !== null ? /*#__PURE__*/React.createElement(UppyContextProvider, {
380
- uppy: finalUppy
381
- }, !uploadDisabled && !hasMedia && !withButton && finalUppy !== null ? /*#__PURE__*/React.createElement("div", {
382
- className: styles.dashboard
383
- }, /*#__PURE__*/React.createElement(Dashboard, Object.assign({
384
- uppy: finalUppy
385
- // {...(containerWidth !== null && height !== null
386
- // ? { width: containerWidth }
387
- // : null)}
388
- }, width !== null ? {
389
- width: width
390
- } : null, height !== null ? {
391
- height: height
392
- } : null, {
393
- plugins: sources,
394
- inline: true,
395
- showProgressDetails: true,
396
- areInsidesReadyToBeVisible: true,
397
- proudlyDisplayPoweredByUppy: false
398
- }))) : null, !showResourceModal && !uploadDisabled && withButton && finalUppy !== null && modalOpened ? /*#__PURE__*/React.createElement(DashboardModal, {
399
- uppy: finalUppy,
400
- className: styles.dashboardModal,
401
- plugins: sources,
402
- open: true,
403
- onRequestClose: closeModal,
404
- proudlyDisplayPoweredByUppy: false,
405
- closeModalOnClickOutside: true,
406
- areInsidesReadyToBeVisible: true,
407
- isDashboardVisible: true,
408
- showProgressDetails: true,
409
- showAddFilesPanel: true,
410
- doneButtonHandler: closeModal,
411
- closeAfterFinish: closeAfterFinish
412
- }) : null) : null, showResourceModal ? /*#__PURE__*/React.createElement(ModalResourceItems, {
413
- id: "upload-".concat(name),
414
- resource: resource,
415
- query: listQuery,
416
- onPageChange: onListPageChange,
417
- onQueryChange: onListQueryChange,
418
- onQueryReset: onListQueryReset,
419
- baseUrl: null,
420
- showActions: false,
421
- selectable: true,
422
- selectedItems: modalItems,
423
- onSelectionChange: onSelectionChange,
424
- multipleSelection: allowMultipleUploads,
425
- onClose: closeResourceModal
426
- }, /*#__PURE__*/React.createElement("div", {
427
- className: "d-flex mt-4 justify-content-between"
428
- }, modalItems !== null && modalItems.length > 0 ? /*#__PURE__*/React.createElement("span", {
429
- className: "me-2"
430
- }, modalItems.length, " items") : /*#__PURE__*/React.createElement("span", null), /*#__PURE__*/React.createElement("div", {
431
- className: "d-flex"
432
- }, /*#__PURE__*/React.createElement(Button, {
433
- type: "button",
434
- theme: "secondary",
435
- onClick: closeResourceModal,
436
- disabled: disabled,
437
- className: "d-block me-2"
438
- }, /*#__PURE__*/React.createElement(FormattedMessage, {
439
- id: "PyxZY2",
440
- defaultMessage: [{
441
- "type": 0,
442
- "value": "Cancel"
443
- }]
444
- })), /*#__PURE__*/React.createElement(Button, {
445
- type: "button",
446
- theme: "primary",
447
- onClick: confirmResourceModal,
448
- disabled: disabled || modalItems !== null && modalItems.length === 0,
449
- className: "d-block"
450
- }, /*#__PURE__*/React.createElement(FormattedMessage, {
451
- id: "rvOVCV",
452
- defaultMessage: [{
453
- "type": 0,
454
- "value": "Confirm selection"
455
- }]
456
- }))))) : null);
332
+ ref: containerRef,
333
+ children: [!withoutMedia && hasMedia ? /*#__PURE__*/jsx(MediaCards, {
334
+ value: values,
335
+ namePath: namePath,
336
+ thumbnailPath: thumbnailPath,
337
+ sizePath: sizePath,
338
+ linkPath: linkPath,
339
+ disabled: disabled,
340
+ onClickRemove: onClickRemove
341
+ }) : null, !withoutMedia && hasMedia && withClearButton ? /*#__PURE__*/jsx("div", {
342
+ className: "row mt-2",
343
+ children: /*#__PURE__*/jsx("div", {
344
+ className: "col-auto",
345
+ children: /*#__PURE__*/jsx(Button, {
346
+ type: "button",
347
+ theme: "primary",
348
+ onClick: onClickClear,
349
+ children: /*#__PURE__*/jsx(Label, {
350
+ children: clearButtonLabel
351
+ })
352
+ })
353
+ })
354
+ }) : null, withoutMedia || (!hasMedia || allowMultipleUploads) && withButton ? /*#__PURE__*/jsxs("div", {
355
+ className: "row",
356
+ children: [/*#__PURE__*/jsx("div", {
357
+ className: "col-auto",
358
+ children: /*#__PURE__*/jsx(Button, {
359
+ id: "trigger-uppy",
360
+ type: "button",
361
+ theme: "primary",
362
+ icon: finalLoading ? 'loading' : 'upload',
363
+ iconPosition: "right",
364
+ onClick: onClickAdd || openModal,
365
+ disabled: finalLoading || disabled,
366
+ outline: outline,
367
+ children: /*#__PURE__*/jsx(Label, {
368
+ children: finalLoading ? /*#__PURE__*/jsx(FormattedMessage, {
369
+ id: "NozDYd",
370
+ defaultMessage: [{
371
+ "type": 0,
372
+ "value": "Uploading"
373
+ }]
374
+ }) : addButtonLabel
375
+ })
376
+ })
377
+ }), withFind ? /*#__PURE__*/jsx("div", {
378
+ className: "col-auto ps-0",
379
+ children: /*#__PURE__*/jsx(Button, {
380
+ type: "button",
381
+ theme: "primary",
382
+ icon: "search",
383
+ iconPosition: "right",
384
+ onClick: finalOnClickFind,
385
+ disabled: disabled,
386
+ outline: outline,
387
+ children: /*#__PURE__*/jsx(Label, {
388
+ children: findButtonLabel
389
+ })
390
+ })
391
+ }) : null]
392
+ }) : null, finalUppy !== null ? /*#__PURE__*/jsxs(UppyContextProvider, {
393
+ uppy: finalUppy,
394
+ children: [!uploadDisabled && !hasMedia && !withButton && finalUppy !== null ? /*#__PURE__*/jsx("div", {
395
+ className: styles.dashboard,
396
+ children: /*#__PURE__*/jsx(Dashboard, _objectSpread(_objectSpread(_objectSpread({
397
+ uppy: finalUppy
398
+ // {...(containerWidth !== null && height !== null
399
+ // ? { width: containerWidth }
400
+ // : null)}
401
+ }, width !== null ? {
402
+ width: width
403
+ } : null), height !== null ? {
404
+ height: height
405
+ } : null), {}, {
406
+ plugins: sources,
407
+ inline: true,
408
+ showProgressDetails: true,
409
+ areInsidesReadyToBeVisible: true,
410
+ proudlyDisplayPoweredByUppy: false
411
+ }))
412
+ }) : null, !showResourceModal && !uploadDisabled && withButton && finalUppy !== null && modalOpened ? /*#__PURE__*/jsx(DashboardModal, {
413
+ uppy: finalUppy,
414
+ className: styles.dashboardModal,
415
+ plugins: sources,
416
+ open: true,
417
+ onRequestClose: closeModal,
418
+ proudlyDisplayPoweredByUppy: false,
419
+ closeModalOnClickOutside: true,
420
+ areInsidesReadyToBeVisible: true,
421
+ isDashboardVisible: true,
422
+ showProgressDetails: true,
423
+ showAddFilesPanel: true,
424
+ doneButtonHandler: closeModal,
425
+ closeAfterFinish: closeAfterFinish
426
+ }) : null]
427
+ }) : null, showResourceModal ? /*#__PURE__*/jsx(ModalResourceItems, {
428
+ id: "upload-".concat(name),
429
+ resource: resource,
430
+ query: listQuery,
431
+ onPageChange: onListPageChange,
432
+ onQueryChange: onListQueryChange,
433
+ onQueryReset: onListQueryReset,
434
+ baseUrl: null,
435
+ showActions: false,
436
+ selectable: true,
437
+ selectedItems: modalItems,
438
+ onSelectionChange: onSelectionChange,
439
+ multipleSelection: allowMultipleUploads,
440
+ onClose: closeResourceModal,
441
+ children: /*#__PURE__*/jsxs("div", {
442
+ className: "d-flex mt-4 justify-content-between",
443
+ children: [modalItems !== null && modalItems.length > 0 ? /*#__PURE__*/jsxs("span", {
444
+ className: "me-2",
445
+ children: [modalItems.length, " items"]
446
+ }) : /*#__PURE__*/jsx("span", {}), /*#__PURE__*/jsxs("div", {
447
+ className: "d-flex",
448
+ children: [/*#__PURE__*/jsx(Button, {
449
+ type: "button",
450
+ theme: "secondary",
451
+ onClick: closeResourceModal,
452
+ disabled: disabled,
453
+ className: "d-block me-2",
454
+ children: /*#__PURE__*/jsx(FormattedMessage, {
455
+ id: "PyxZY2",
456
+ defaultMessage: [{
457
+ "type": 0,
458
+ "value": "Cancel"
459
+ }]
460
+ })
461
+ }), /*#__PURE__*/jsx(Button, {
462
+ type: "button",
463
+ theme: "primary",
464
+ onClick: confirmResourceModal,
465
+ disabled: disabled || modalItems !== null && modalItems.length === 0,
466
+ className: "d-block",
467
+ children: /*#__PURE__*/jsx(FormattedMessage, {
468
+ id: "rvOVCV",
469
+ defaultMessage: [{
470
+ "type": 0,
471
+ "value": "Confirm selection"
472
+ }]
473
+ })
474
+ })]
475
+ })]
476
+ })
477
+ }) : null]
478
+ });
457
479
  }
458
480
 
459
481
  var definition = [{
@@ -480,7 +502,7 @@ function AudioField(props) {
480
502
  var types = useMemo(function () {
481
503
  return ['audio'];
482
504
  }, []);
483
- return /*#__PURE__*/React.createElement(UploadField, Object.assign({}, props, {
505
+ return /*#__PURE__*/jsx(UploadField, _objectSpread(_objectSpread({}, props), {}, {
484
506
  types: types
485
507
  }));
486
508
  }
@@ -489,7 +511,7 @@ function ImageField(props) {
489
511
  var types = useMemo(function () {
490
512
  return ['image'];
491
513
  }, []);
492
- return /*#__PURE__*/React.createElement(UploadField, Object.assign({}, props, {
514
+ return /*#__PURE__*/jsx(UploadField, _objectSpread(_objectSpread({}, props), {}, {
493
515
  types: types
494
516
  }));
495
517
  }
@@ -498,7 +520,7 @@ function ImagesField(props) {
498
520
  var types = useMemo(function () {
499
521
  return ['image'];
500
522
  }, []);
501
- return /*#__PURE__*/React.createElement(UploadField, Object.assign({}, props, {
523
+ return /*#__PURE__*/jsx(UploadField, _objectSpread(_objectSpread({}, props), {}, {
502
524
  types: types,
503
525
  allowMultipleUploads: true
504
526
  }));
@@ -508,7 +530,7 @@ function VideoField(props) {
508
530
  var types = useMemo(function () {
509
531
  return ['video'];
510
532
  }, []);
511
- return /*#__PURE__*/React.createElement(UploadField, Object.assign({}, props, {
533
+ return /*#__PURE__*/jsx(UploadField, _objectSpread(_objectSpread({}, props), {}, {
512
534
  types: types
513
535
  }));
514
536
  }
@@ -520,7 +542,7 @@ function DocumentField(props) {
520
542
  var types = useMemo(function () {
521
543
  return ['document'];
522
544
  }, []);
523
- return /*#__PURE__*/React.createElement(UploadField, Object.assign({}, props, {
545
+ return /*#__PURE__*/jsx(UploadField, _objectSpread(_objectSpread({}, props), {}, {
524
546
  fileTypes: fileTypes,
525
547
  types: types
526
548
  }));
@@ -530,7 +552,7 @@ function FontField(props) {
530
552
  var fileTypes = useMemo(function () {
531
553
  return ['.ttf', '.otf'];
532
554
  }, []);
533
- return /*#__PURE__*/React.createElement(UploadField, Object.assign({}, props, {
555
+ return /*#__PURE__*/jsx(UploadField, _objectSpread(_objectSpread({}, props), {}, {
534
556
  fileTypes: fileTypes
535
557
  }));
536
558
  }
@@ -591,30 +613,34 @@ function UpdateFileField(_ref) {
591
613
  }
592
614
  return null;
593
615
  }, [type]);
594
- return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
595
- className: "mb-3"
596
- }, /*#__PURE__*/React.createElement(MediaCard, {
597
- value: visibleFile || value,
598
- withoutDescription: true
599
- })), /*#__PURE__*/React.createElement("div", {
600
- className: "mb-3"
601
- }, /*#__PURE__*/React.createElement(UploadField, Object.assign({}, props, uploadProps, {
602
- addButtonLabel: /*#__PURE__*/React.createElement(FormattedMessage, {
603
- id: "daHjZg",
604
- defaultMessage: [{
605
- "type": 0,
606
- "value": "Edit file"
607
- }]
608
- }),
609
- allowMultipleUploads: false,
610
- linkPath: "panneauUrl",
611
- onChange: onUploadChange,
612
- onClose: onUploadChange,
613
- maxNumberOfFiles: 1,
614
- value: newValue,
615
- withButton: true,
616
- uppyProps: uppyProps
617
- }))));
616
+ return /*#__PURE__*/jsxs(Fragment, {
617
+ children: [/*#__PURE__*/jsx("div", {
618
+ className: "mb-3",
619
+ children: /*#__PURE__*/jsx(MediaCard, {
620
+ value: visibleFile || value,
621
+ withoutDescription: true
622
+ })
623
+ }), /*#__PURE__*/jsx("div", {
624
+ className: "mb-3",
625
+ children: /*#__PURE__*/jsx(UploadField, _objectSpread(_objectSpread(_objectSpread({}, props), uploadProps), {}, {
626
+ addButtonLabel: /*#__PURE__*/jsx(FormattedMessage, {
627
+ id: "daHjZg",
628
+ defaultMessage: [{
629
+ "type": 0,
630
+ "value": "Edit file"
631
+ }]
632
+ }),
633
+ allowMultipleUploads: false,
634
+ linkPath: "panneauUrl",
635
+ onChange: onUploadChange,
636
+ onClose: onUploadChange,
637
+ maxNumberOfFiles: 1,
638
+ value: newValue,
639
+ withButton: true,
640
+ uppyProps: uppyProps
641
+ }))
642
+ })]
643
+ });
618
644
  }
619
645
 
620
646
  export { AudioField, DocumentField, FontField, ImageField, ImagesField, UpdateFileField, VideoField, UploadField as default, definition };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@panneau/field-upload",
3
- "version": "4.0.2",
3
+ "version": "4.0.4",
4
4
  "description": "An Upload field",
5
5
  "keywords": [
6
6
  "javascript"
@@ -62,13 +62,13 @@
62
62
  "@fortawesome/fontawesome-svg-core": "^6.5.1",
63
63
  "@fortawesome/free-solid-svg-icons": "^6.5.1",
64
64
  "@fortawesome/react-fontawesome": "^0.2.0",
65
- "@panneau/core": "^4.0.2",
66
- "@panneau/element-button": "^4.0.2",
67
- "@panneau/element-label": "^4.0.2",
68
- "@panneau/element-media-card": "^4.0.2",
69
- "@panneau/modal-resource-items": "^4.0.2",
70
- "@panneau/themes": "^4.0.2",
71
- "@panneau/uppy": "^4.0.2",
65
+ "@panneau/core": "^4.0.4",
66
+ "@panneau/element-button": "^4.0.4",
67
+ "@panneau/element-label": "^4.0.4",
68
+ "@panneau/element-media-card": "^4.0.4",
69
+ "@panneau/modal-resource-items": "^4.0.4",
70
+ "@panneau/themes": "^4.0.4",
71
+ "@panneau/uppy": "^4.0.4",
72
72
  "@uppy/core": "^5.1.1",
73
73
  "@uppy/dashboard": "^5.0.4",
74
74
  "@uppy/react": "^5.1.1",
@@ -82,5 +82,5 @@
82
82
  "publishConfig": {
83
83
  "access": "public"
84
84
  },
85
- "gitHead": "53ad0f27e467992c23158732e0f7d39d8615780b"
85
+ "gitHead": "e854451a718c6bc7dcde2b804c9913d8ac0297ff"
86
86
  }