@panneau/field-upload 3.0.108 → 3.0.110

package/assets/css/styles.css

@@ -1 +1 @@
-.panneau-field-upload-container{position:relative;width:100%}.panneau-field-upload-container .panneau-field-upload-dashboard{position:relative}.panneau-field-upload-container .panneau-field-upload-uppyDashboardContainer{margin-top:10px}
+.panneau-field-upload-container{position:relative;width:100%}.panneau-field-upload-container .panneau-field-upload-dashboard{position:relative}.panneau-field-upload-container .panneau-field-upload-dashboardModal{position:relative;z-index:10001}.panneau-field-upload-container .panneau-field-upload-uppyDashboardContainer{margin-top:10px}

package/es/index.js

@@ -2,7 +2,7 @@ import _defineProperty from '@babel/runtime/helpers/defineProperty';
 import _toConsumableArray from '@babel/runtime/helpers/toConsumableArray';
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
 import _objectSpread from '@babel/runtime/helpers/objectSpread2';
-import { Dashboard } from '@uppy/react';
+import { Dashboard, DashboardModal } from '@uppy/react';
 import classNames from 'classnames';
 import isArray from 'lodash/isArray';
 import isObject from 'lodash/isObject';
@@ -16,14 +16,13 @@ import Label from '@panneau/element-label';
 import { MediaCards } from '@panneau/element-media-card';
 import ResourceItemsList from '@panneau/list-resource-items';
 import Dialog from '@panneau/modal-dialog';
-import UploadModal from '@panneau/modal-upload';
 import { useUppy } from '@panneau/uppy';
-import '@uppy/core/dist/style.min.css';
-import '@uppy/dashboard/dist/style.min.css';
-import '@uppy/drag-drop/dist/style.min.css';
-import '@uppy/status-bar/dist/style.min.css';
+import '@uppy/core/dist/style.css';
+import '@uppy/dashboard/dist/style.css';
+import '@uppy/drag-drop/dist/style.css';
+import '@uppy/status-bar/dist/style.css';
 
-var styles = {"container":"panneau-field-upload-container","dashboard":"panneau-field-upload-dashboard","uppyDashboardContainer":"panneau-field-upload-uppyDashboardContainer"};
+var styles = {"container":"panneau-field-upload-container","dashboard":"panneau-field-upload-dashboard","dashboardModal":"panneau-field-upload-dashboardModal","uppyDashboardContainer":"panneau-field-upload-uppyDashboardContainer"};
 
 var propTypes = {
   value: PropTypes.oneOfType([PropTypes.array, PropTypes.shape({
@@ -212,7 +211,7 @@ var UploadField = function UploadField(_ref) {
   var openModal = useCallback(function () {
     setModalOpened(!modalOpened);
   }, [modalOpened, setModalOpened]);
-  useCallback(function () {
+  var closeModal = useCallback(function () {
     setModalOpened(false);
     if (uppy !== null) {
       uppy.cancelAll({
@@ -370,18 +369,20 @@ var UploadField = function UploadField(_ref) {
     showProgressDetails: true,
     areInsidesReadyToBeVisible: true,
     proudlyDisplayPoweredByUppy: false
-  }))) : null, !showResourceModal && !disabled && withButton && uppy !== null && modalOpened ? /*#__PURE__*/React.createElement("div", {
-    className: styles.uppyDashboardContainer
-  }, /*#__PURE__*/React.createElement(UploadModal, {
-    title: addButtonLabel,
+  }))) : null, !showResourceModal && !disabled && withButton && uppy !== null && modalOpened ? /*#__PURE__*/React.createElement(DashboardModal, {
     uppy: uppy,
+    className: styles.dashboardModal,
     plugins: sources,
-    inline: true,
-    width: "100%",
-    height: "300px",
+    open: true,
+    onRequestClose: closeModal,
+    proudlyDisplayPoweredByUppy: false,
+    closeModalOnClickOutside: true,
+    areInsidesReadyToBeVisible: true,
+    isDashboardVisible: true,
     showProgressDetails: true,
-    proudlyDisplayPoweredByUppy: false
-  })) : null, showResourceModal ? /*#__PURE__*/React.createElement(Dialog, {
+    showAddFilesPanel: true,
+    doneButtonHandler: closeModal
+  }) : null, showResourceModal ? /*#__PURE__*/React.createElement(Dialog, {
     title: /*#__PURE__*/React.createElement(Label, null, findButtonLabel),
     size: "xl",
     onClose: closeResourceModal

package/lib/index.js

@@ -20,12 +20,11 @@ var Label = require('@panneau/element-label');
 var elementMediaCard = require('@panneau/element-media-card');
 var ResourceItemsList = require('@panneau/list-resource-items');
 var Dialog = require('@panneau/modal-dialog');
-var UploadModal = require('@panneau/modal-upload');
 var uppy = require('@panneau/uppy');
-require('@uppy/core/dist/style.min.css');
-require('@uppy/dashboard/dist/style.min.css');
-require('@uppy/drag-drop/dist/style.min.css');
-require('@uppy/status-bar/dist/style.min.css');
+require('@uppy/core/dist/style.css');
+require('@uppy/dashboard/dist/style.css');
+require('@uppy/drag-drop/dist/style.css');
+require('@uppy/status-bar/dist/style.css');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -42,9 +41,8 @@ var Button__default = /*#__PURE__*/_interopDefaultLegacy(Button);
 var Label__default = /*#__PURE__*/_interopDefaultLegacy(Label);
 var ResourceItemsList__default = /*#__PURE__*/_interopDefaultLegacy(ResourceItemsList);
 var Dialog__default = /*#__PURE__*/_interopDefaultLegacy(Dialog);
-var UploadModal__default = /*#__PURE__*/_interopDefaultLegacy(UploadModal);
 
-var styles = {"container":"panneau-field-upload-container","dashboard":"panneau-field-upload-dashboard","uppyDashboardContainer":"panneau-field-upload-uppyDashboardContainer"};
+var styles = {"container":"panneau-field-upload-container","dashboard":"panneau-field-upload-dashboard","dashboardModal":"panneau-field-upload-dashboardModal","uppyDashboardContainer":"panneau-field-upload-uppyDashboardContainer"};
 
 var propTypes = {
   value: PropTypes__default["default"].oneOfType([PropTypes__default["default"].array, PropTypes__default["default"].shape({
@@ -233,7 +231,7 @@ var UploadField = function UploadField(_ref) {
   var openModal = React.useCallback(function () {
     setModalOpened(!modalOpened);
   }, [modalOpened, setModalOpened]);
-  React.useCallback(function () {
+  var closeModal = React.useCallback(function () {
     setModalOpened(false);
     if (uppy$1 !== null) {
       uppy$1.cancelAll({
@@ -391,18 +389,20 @@ var UploadField = function UploadField(_ref) {
     showProgressDetails: true,
     areInsidesReadyToBeVisible: true,
     proudlyDisplayPoweredByUppy: false
-  }))) : null, !showResourceModal && !disabled && withButton && uppy$1 !== null && modalOpened ? /*#__PURE__*/React__default["default"].createElement("div", {
-    className: styles.uppyDashboardContainer
-  }, /*#__PURE__*/React__default["default"].createElement(UploadModal__default["default"], {
-    title: addButtonLabel,
+  }))) : null, !showResourceModal && !disabled && withButton && uppy$1 !== null && modalOpened ? /*#__PURE__*/React__default["default"].createElement(react.DashboardModal, {
     uppy: uppy$1,
+    className: styles.dashboardModal,
     plugins: sources,
-    inline: true,
-    width: "100%",
-    height: "300px",
+    open: true,
+    onRequestClose: closeModal,
+    proudlyDisplayPoweredByUppy: false,
+    closeModalOnClickOutside: true,
+    areInsidesReadyToBeVisible: true,
+    isDashboardVisible: true,
     showProgressDetails: true,
-    proudlyDisplayPoweredByUppy: false
-  })) : null, showResourceModal ? /*#__PURE__*/React__default["default"].createElement(Dialog__default["default"], {
+    showAddFilesPanel: true,
+    doneButtonHandler: closeModal
+  }) : null, showResourceModal ? /*#__PURE__*/React__default["default"].createElement(Dialog__default["default"], {
     title: /*#__PURE__*/React__default["default"].createElement(Label__default["default"], null, findButtonLabel),
     size: "xl",
     onClose: closeResourceModal

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@panneau/field-upload",
-    "version": "3.0.108",
+    "version": "3.0.110",
     "description": "An Upload field",
     "keywords": [
         "javascript"
@@ -82,5 +82,5 @@
     "publishConfig": {
         "access": "public"
     },
-    "gitHead": "e0d3677666eee6729ca3c48d06ea8564e2078c86"
+    "gitHead": "4fca6a9873eec7598d8ad71c577d31becd37f77b"
 }