@panneau/field-upload 4.0.1 → 4.0.3

package/es/index.js

@@ -8,7 +8,7 @@ import DashboardModal from '@uppy/react/dashboard-modal';
 import classNames from 'classnames';
 import isArray from 'lodash-es/isArray';
 import isObject from 'lodash-es/isObject';
-import React, { useCallback, useMemo, useState, useRef, useEffect } from 'react';
+import { useCallback, useMemo, useState, useRef, useEffect } from 'react';
 import { FormattedMessage } from 'react-intl';
 import { useQuery } from '@panneau/core/hooks';
 import Button from '@panneau/element-button';
@@ -18,12 +18,11 @@ import ModalResourceItems from '@panneau/modal-resource-items';
 import { useUppy } from '@panneau/uppy';
 import '@uppy/core/css/style.css';
 import '@uppy/dashboard/css/style.css';
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
 
 var styles = {"container":"panneau-field-upload-container","dashboard":"panneau-field-upload-dashboard","dashboardModal":"panneau-field-upload-dashboardModal"};
 
-// import '@uppy/react/css/style.css';
-
 var DEFAULT_TYPES = ['audio', 'image', 'video'];
 var DEFAULT_SOURCES = ['webcam', 'facebook', 'instagram', 'dropbox', 'google-drive'];
 function UploadField(_ref) {
@@ -91,21 +90,21 @@ function UploadField(_ref) {
     onClickFind = _ref$onClickFind === void 0 ? null : _ref$onClickFind,
     _ref$className = _ref.className,
     className = _ref$className === void 0 ? null : _ref$className;
-  var addButtonLabel = initialAddButtonLabel || /*#__PURE__*/React.createElement(FormattedMessage, {
+  var addButtonLabel = initialAddButtonLabel || /*#__PURE__*/jsx(FormattedMessage, {
     id: "BeKVq6",
     defaultMessage: [{
       "type": 0,
       "value": "Upload file"
     }]
   });
-  var findButtonLabel = initialFindButtonLabel || /*#__PURE__*/React.createElement(FormattedMessage, {
+  var findButtonLabel = initialFindButtonLabel || /*#__PURE__*/jsx(FormattedMessage, {
     id: "une5WQ",
     defaultMessage: [{
       "type": 0,
       "value": "Find a file"
     }]
   });
-  var clearButtonLabel = initialCleanButtonLabel || /*#__PURE__*/React.createElement(FormattedMessage, {
+  var clearButtonLabel = initialCleanButtonLabel || /*#__PURE__*/jsx(FormattedMessage, {
     id: "odaCUe",
     defaultMessage: [{
       "type": 0,
@@ -328,132 +327,155 @@ function UploadField(_ref) {
     };
   }, [uppy, startLoading, endLoading]);
   var finalLoading = loading || parentLoading;
-  return /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/jsxs("div", {
     className: classNames([styles.container, _defineProperty({}, className, className !== null)]),
-    ref: containerRef
-  }, !withoutMedia && hasMedia ? /*#__PURE__*/React.createElement(MediaCards, {
-    value: values,
-    namePath: namePath,
-    thumbnailPath: thumbnailPath,
-    sizePath: sizePath,
-    linkPath: linkPath,
-    disabled: disabled,
-    onClickRemove: onClickRemove
-  }) : null, !withoutMedia && hasMedia && withClearButton ? /*#__PURE__*/React.createElement("div", {
-    className: "row mt-2"
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "col-auto"
-  }, /*#__PURE__*/React.createElement(Button, {
-    type: "button",
-    theme: "primary",
-    onClick: onClickClear
-  }, /*#__PURE__*/React.createElement(Label, null, clearButtonLabel)))) : null, withoutMedia || (!hasMedia || allowMultipleUploads) && withButton ? /*#__PURE__*/React.createElement("div", {
-    className: "row"
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "col-auto"
-  }, /*#__PURE__*/React.createElement(Button, {
-    id: "trigger-uppy",
-    type: "button",
-    theme: "primary",
-    icon: finalLoading ? 'loading' : 'upload',
-    iconPosition: "right",
-    onClick: onClickAdd || openModal,
-    disabled: finalLoading || disabled,
-    outline: outline
-  }, /*#__PURE__*/React.createElement(Label, null, finalLoading ? /*#__PURE__*/React.createElement(FormattedMessage, {
-    id: "NozDYd",
-    defaultMessage: [{
-      "type": 0,
-      "value": "Uploading"
-    }]
-  }) : addButtonLabel))), withFind ? /*#__PURE__*/React.createElement("div", {
-    className: "col-auto ps-0"
-  }, /*#__PURE__*/React.createElement(Button, {
-    type: "button",
-    theme: "primary",
-    icon: "search",
-    iconPosition: "right",
-    onClick: finalOnClickFind,
-    disabled: disabled,
-    outline: outline
-  }, /*#__PURE__*/React.createElement(Label, null, findButtonLabel))) : null) : null, finalUppy !== null ? /*#__PURE__*/React.createElement(UppyContextProvider, {
-    uppy: finalUppy
-  }, !uploadDisabled && !hasMedia && !withButton && finalUppy !== null ? /*#__PURE__*/React.createElement("div", {
-    className: styles.dashboard
-  }, /*#__PURE__*/React.createElement(Dashboard, Object.assign({
-    uppy: finalUppy
-    // {...(containerWidth !== null && height !== null
-    //     ? { width: containerWidth }
-    // : null)}
-  }, width !== null ? {
-    width: width
-  } : null, height !== null ? {
-    height: height
-  } : null, {
-    plugins: sources,
-    inline: true,
-    showProgressDetails: true,
-    areInsidesReadyToBeVisible: true,
-    proudlyDisplayPoweredByUppy: false
-  }))) : null, !showResourceModal && !uploadDisabled && withButton && finalUppy !== null && modalOpened ? /*#__PURE__*/React.createElement(DashboardModal, {
-    uppy: finalUppy,
-    className: styles.dashboardModal,
-    plugins: sources,
-    open: true,
-    onRequestClose: closeModal,
-    proudlyDisplayPoweredByUppy: false,
-    closeModalOnClickOutside: true,
-    areInsidesReadyToBeVisible: true,
-    isDashboardVisible: true,
-    showProgressDetails: true,
-    showAddFilesPanel: true,
-    doneButtonHandler: closeModal,
-    closeAfterFinish: closeAfterFinish
-  }) : null) : null, showResourceModal ? /*#__PURE__*/React.createElement(ModalResourceItems, {
-    id: "upload-".concat(name),
-    resource: resource,
-    query: listQuery,
-    onPageChange: onListPageChange,
-    onQueryChange: onListQueryChange,
-    onQueryReset: onListQueryReset,
-    baseUrl: null,
-    showActions: false,
-    selectable: true,
-    selectedItems: modalItems,
-    onSelectionChange: onSelectionChange,
-    multipleSelection: allowMultipleUploads,
-    onClose: closeResourceModal
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "d-flex mt-4 justify-content-between"
-  }, modalItems !== null && modalItems.length > 0 ? /*#__PURE__*/React.createElement("span", {
-    className: "me-2"
-  }, modalItems.length, " items") : /*#__PURE__*/React.createElement("span", null), /*#__PURE__*/React.createElement("div", {
-    className: "d-flex"
-  }, /*#__PURE__*/React.createElement(Button, {
-    type: "button",
-    theme: "secondary",
-    onClick: closeResourceModal,
-    disabled: disabled,
-    className: "d-block me-2"
-  }, /*#__PURE__*/React.createElement(FormattedMessage, {
-    id: "PyxZY2",
-    defaultMessage: [{
-      "type": 0,
-      "value": "Cancel"
-    }]
-  })), /*#__PURE__*/React.createElement(Button, {
-    type: "button",
-    theme: "primary",
-    onClick: confirmResourceModal,
-    disabled: disabled || modalItems !== null && modalItems.length === 0,
-    className: "d-block"
-  }, /*#__PURE__*/React.createElement(FormattedMessage, {
-    id: "rvOVCV",
-    defaultMessage: [{
-      "type": 0,
-      "value": "Confirm selection"
-    }]
-  }))))) : null);
+    ref: containerRef,
+    children: [!withoutMedia && hasMedia ? /*#__PURE__*/jsx(MediaCards, {
+      value: values,
+      namePath: namePath,
+      thumbnailPath: thumbnailPath,
+      sizePath: sizePath,
+      linkPath: linkPath,
+      disabled: disabled,
+      onClickRemove: onClickRemove
+    }) : null, !withoutMedia && hasMedia && withClearButton ? /*#__PURE__*/jsx("div", {
+      className: "row mt-2",
+      children: /*#__PURE__*/jsx("div", {
+        className: "col-auto",
+        children: /*#__PURE__*/jsx(Button, {
+          type: "button",
+          theme: "primary",
+          onClick: onClickClear,
+          children: /*#__PURE__*/jsx(Label, {
+            children: clearButtonLabel
+          })
+        })
+      })
+    }) : null, withoutMedia || (!hasMedia || allowMultipleUploads) && withButton ? /*#__PURE__*/jsxs("div", {
+      className: "row",
+      children: [/*#__PURE__*/jsx("div", {
+        className: "col-auto",
+        children: /*#__PURE__*/jsx(Button, {
+          id: "trigger-uppy",
+          type: "button",
+          theme: "primary",
+          icon: finalLoading ? 'loading' : 'upload',
+          iconPosition: "right",
+          onClick: onClickAdd || openModal,
+          disabled: finalLoading || disabled,
+          outline: outline,
+          children: /*#__PURE__*/jsx(Label, {
+            children: finalLoading ? /*#__PURE__*/jsx(FormattedMessage, {
+              id: "NozDYd",
+              defaultMessage: [{
+                "type": 0,
+                "value": "Uploading"
+              }]
+            }) : addButtonLabel
+          })
+        })
+      }), withFind ? /*#__PURE__*/jsx("div", {
+        className: "col-auto ps-0",
+        children: /*#__PURE__*/jsx(Button, {
+          type: "button",
+          theme: "primary",
+          icon: "search",
+          iconPosition: "right",
+          onClick: finalOnClickFind,
+          disabled: disabled,
+          outline: outline,
+          children: /*#__PURE__*/jsx(Label, {
+            children: findButtonLabel
+          })
+        })
+      }) : null]
+    }) : null, finalUppy !== null ? /*#__PURE__*/jsxs(UppyContextProvider, {
+      uppy: finalUppy,
+      children: [!uploadDisabled && !hasMedia && !withButton && finalUppy !== null ? /*#__PURE__*/jsx("div", {
+        className: styles.dashboard,
+        children: /*#__PURE__*/jsx(Dashboard, _objectSpread(_objectSpread(_objectSpread({
+          uppy: finalUppy
+          // {...(containerWidth !== null && height !== null
+          //     ? { width: containerWidth }
+          // : null)}
+        }, width !== null ? {
+          width: width
+        } : null), height !== null ? {
+          height: height
+        } : null), {}, {
+          plugins: sources,
+          inline: true,
+          showProgressDetails: true,
+          areInsidesReadyToBeVisible: true,
+          proudlyDisplayPoweredByUppy: false
+        }))
+      }) : null, !showResourceModal && !uploadDisabled && withButton && finalUppy !== null && modalOpened ? /*#__PURE__*/jsx(DashboardModal, {
+        uppy: finalUppy,
+        className: styles.dashboardModal,
+        plugins: sources,
+        open: true,
+        onRequestClose: closeModal,
+        proudlyDisplayPoweredByUppy: false,
+        closeModalOnClickOutside: true,
+        areInsidesReadyToBeVisible: true,
+        isDashboardVisible: true,
+        showProgressDetails: true,
+        showAddFilesPanel: true,
+        doneButtonHandler: closeModal,
+        closeAfterFinish: closeAfterFinish
+      }) : null]
+    }) : null, showResourceModal ? /*#__PURE__*/jsx(ModalResourceItems, {
+      id: "upload-".concat(name),
+      resource: resource,
+      query: listQuery,
+      onPageChange: onListPageChange,
+      onQueryChange: onListQueryChange,
+      onQueryReset: onListQueryReset,
+      baseUrl: null,
+      showActions: false,
+      selectable: true,
+      selectedItems: modalItems,
+      onSelectionChange: onSelectionChange,
+      multipleSelection: allowMultipleUploads,
+      onClose: closeResourceModal,
+      children: /*#__PURE__*/jsxs("div", {
+        className: "d-flex mt-4 justify-content-between",
+        children: [modalItems !== null && modalItems.length > 0 ? /*#__PURE__*/jsxs("span", {
+          className: "me-2",
+          children: [modalItems.length, " items"]
+        }) : /*#__PURE__*/jsx("span", {}), /*#__PURE__*/jsxs("div", {
+          className: "d-flex",
+          children: [/*#__PURE__*/jsx(Button, {
+            type: "button",
+            theme: "secondary",
+            onClick: closeResourceModal,
+            disabled: disabled,
+            className: "d-block me-2",
+            children: /*#__PURE__*/jsx(FormattedMessage, {
+              id: "PyxZY2",
+              defaultMessage: [{
+                "type": 0,
+                "value": "Cancel"
+              }]
+            })
+          }), /*#__PURE__*/jsx(Button, {
+            type: "button",
+            theme: "primary",
+            onClick: confirmResourceModal,
+            disabled: disabled || modalItems !== null && modalItems.length === 0,
+            className: "d-block",
+            children: /*#__PURE__*/jsx(FormattedMessage, {
+              id: "rvOVCV",
+              defaultMessage: [{
+                "type": 0,
+                "value": "Confirm selection"
+              }]
+            })
+          })]
+        })]
+      })
+    }) : null]
+  });
 }
 
 var definition = [{
@@ -476,48 +498,43 @@ var definition = [{
   component: 'Font'
 }];
 
-/* eslint-disable react/jsx-props-no-spreading */
 function AudioField(props) {
   var types = useMemo(function () {
     return ['audio'];
   }, []);
-  return /*#__PURE__*/React.createElement(UploadField, Object.assign({}, props, {
+  return /*#__PURE__*/jsx(UploadField, _objectSpread(_objectSpread({}, props), {}, {
     types: types
   }));
 }
 
-/* eslint-disable react/jsx-props-no-spreading */
 function ImageField(props) {
   var types = useMemo(function () {
     return ['image'];
   }, []);
-  return /*#__PURE__*/React.createElement(UploadField, Object.assign({}, props, {
+  return /*#__PURE__*/jsx(UploadField, _objectSpread(_objectSpread({}, props), {}, {
     types: types
   }));
 }
 
-/* eslint-disable react/jsx-props-no-spreading */
 function ImagesField(props) {
   var types = useMemo(function () {
     return ['image'];
   }, []);
-  return /*#__PURE__*/React.createElement(UploadField, Object.assign({}, props, {
+  return /*#__PURE__*/jsx(UploadField, _objectSpread(_objectSpread({}, props), {}, {
     types: types,
     allowMultipleUploads: true
   }));
 }
 
-/* eslint-disable react/jsx-props-no-spreading */
 function VideoField(props) {
   var types = useMemo(function () {
     return ['video'];
   }, []);
-  return /*#__PURE__*/React.createElement(UploadField, Object.assign({}, props, {
+  return /*#__PURE__*/jsx(UploadField, _objectSpread(_objectSpread({}, props), {}, {
     types: types
   }));
 }
 
-/* eslint-disable react/jsx-props-no-spreading */
 function DocumentField(props) {
   var fileTypes = useMemo(function () {
     return ['.pdf'];
@@ -525,18 +542,17 @@ function DocumentField(props) {
   var types = useMemo(function () {
     return ['document'];
   }, []);
-  return /*#__PURE__*/React.createElement(UploadField, Object.assign({}, props, {
+  return /*#__PURE__*/jsx(UploadField, _objectSpread(_objectSpread({}, props), {}, {
     fileTypes: fileTypes,
     types: types
   }));
 }
 
-/* eslint-disable react/jsx-props-no-spreading */
 function FontField(props) {
   var fileTypes = useMemo(function () {
     return ['.ttf', '.otf'];
   }, []);
-  return /*#__PURE__*/React.createElement(UploadField, Object.assign({}, props, {
+  return /*#__PURE__*/jsx(UploadField, _objectSpread(_objectSpread({}, props), {}, {
     fileTypes: fileTypes
   }));
 }
@@ -597,30 +613,34 @@ function UpdateFileField(_ref) {
     }
     return null;
   }, [type]);
-  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
-    className: "mb-3"
-  }, /*#__PURE__*/React.createElement(MediaCard, {
-    value: visibleFile || value,
-    withoutDescription: true
-  })), /*#__PURE__*/React.createElement("div", {
-    className: "mb-3"
-  }, /*#__PURE__*/React.createElement(UploadField, Object.assign({}, props, uploadProps, {
-    addButtonLabel: /*#__PURE__*/React.createElement(FormattedMessage, {
-      id: "daHjZg",
-      defaultMessage: [{
-        "type": 0,
-        "value": "Edit file"
-      }]
-    }),
-    allowMultipleUploads: false,
-    linkPath: "panneauUrl",
-    onChange: onUploadChange,
-    onClose: onUploadChange,
-    maxNumberOfFiles: 1,
-    value: newValue,
-    withButton: true,
-    uppyProps: uppyProps
-  }))));
+  return /*#__PURE__*/jsxs(Fragment, {
+    children: [/*#__PURE__*/jsx("div", {
+      className: "mb-3",
+      children: /*#__PURE__*/jsx(MediaCard, {
+        value: visibleFile || value,
+        withoutDescription: true
+      })
+    }), /*#__PURE__*/jsx("div", {
+      className: "mb-3",
+      children: /*#__PURE__*/jsx(UploadField, _objectSpread(_objectSpread(_objectSpread({}, props), uploadProps), {}, {
+        addButtonLabel: /*#__PURE__*/jsx(FormattedMessage, {
+          id: "daHjZg",
+          defaultMessage: [{
+            "type": 0,
+            "value": "Edit file"
+          }]
+        }),
+        allowMultipleUploads: false,
+        linkPath: "panneauUrl",
+        onChange: onUploadChange,
+        onClose: onUploadChange,
+        maxNumberOfFiles: 1,
+        value: newValue,
+        withButton: true,
+        uppyProps: uppyProps
+      }))
+    })]
+  });
 }
 
 export { AudioField, DocumentField, FontField, ImageField, ImagesField, UpdateFileField, VideoField, UploadField as default, definition };

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@panneau/field-upload",
-    "version": "4.0.1",
+    "version": "4.0.3",
     "description": "An Upload field",
     "keywords": [
         "javascript"
@@ -62,13 +62,13 @@
         "@fortawesome/fontawesome-svg-core": "^6.5.1",
         "@fortawesome/free-solid-svg-icons": "^6.5.1",
         "@fortawesome/react-fontawesome": "^0.2.0",
-        "@panneau/core": "^4.0.1",
-        "@panneau/element-button": "^4.0.1",
-        "@panneau/element-label": "^4.0.1",
-        "@panneau/element-media-card": "^4.0.1",
-        "@panneau/modal-resource-items": "^4.0.1",
-        "@panneau/themes": "^4.0.1",
-        "@panneau/uppy": "^4.0.1",
+        "@panneau/core": "^4.0.2",
+        "@panneau/element-button": "^4.0.2",
+        "@panneau/element-label": "^4.0.2",
+        "@panneau/element-media-card": "^4.0.2",
+        "@panneau/modal-resource-items": "^4.0.3",
+        "@panneau/themes": "^4.0.2",
+        "@panneau/uppy": "^4.0.2",
         "@uppy/core": "^5.1.1",
         "@uppy/dashboard": "^5.0.4",
         "@uppy/react": "^5.1.1",
@@ -82,5 +82,5 @@
     "publishConfig": {
         "access": "public"
     },
-    "gitHead": "dbdf65640625c027ecd56cf2b816b80a5c38cb8d"
+    "gitHead": "26b5ab7536b0e8c3197d40d302fc2681e7c7122e"
 }