@panneau/medias 3.0.162 → 3.0.164

package/es/index.js

@@ -32,9 +32,11 @@ var useMediasApi = function useMediasApi() {
 };
 var apiPropTypes = PropTypes.shape({
   get: PropTypes.func.isRequired,
+  getTrashed: PropTypes.func.isRequired,
   create: PropTypes.func.isRequired,
   find: PropTypes.func.isRequired,
   update: PropTypes.func.isRequired,
+  trash: PropTypes.func.isRequired,
   "delete": PropTypes.func.isRequired
 });
 var propTypes$9 = {
@@ -255,89 +257,97 @@ var defaultFields = [{
   }),
   type: 'text',
   component: 'text'
-}, {
-  id: 'info',
+},
+// {
+//     id: 'info',
+//     component: 'fields',
+//     title: <FormattedMessage defaultMessage="Informations" description="Field title" />,
+//     isList: true,
+//     horizontal: true,
+//     fields: [
+//         {
+//             id: 'user',
+//             label: <FormattedMessage defaultMessage="Added by" description="Field label" />,
+//             type: 'display',
+//             display: 'avatar',
+//             name: 'user',
+//         },
+//         {
+//             id: 'created_at',
+//             label: <FormattedMessage defaultMessage="Created at" description="Field label" />,
+//             type: 'display',
+//             display: 'date',
+//             name: 'created_at',
+//             format: 'yyyy-MM-dd hh:ss',
+//         },
+//     ],
+// },
+{
+  id: 'technical',
   component: 'fields',
   title: /*#__PURE__*/React.createElement(FormattedMessage, {
-    id: "3RT69u",
+    id: "xKUOLG",
     defaultMessage: [{
       "type": 0,
-      "value": "Informations"
+      "value": "Technical details"
     }]
   }),
+  isList: true,
+  horizontal: true,
   fields: [{
-    id: 'user',
+    id: 'format',
     label: /*#__PURE__*/React.createElement(FormattedMessage, {
-      id: "yByaBh",
+      id: "JuxiUN",
       defaultMessage: [{
         "type": 0,
-        "value": "Added by"
+        "value": "Format"
       }]
     }),
-    component: 'display',
-    type: 'avatar',
-    path: 'user',
-    section: 'info'
+    type: 'display',
+    display: 'unit',
+    format: 'format',
+    name: 'format'
   }, {
-    id: 'created_at',
+    id: 'dimensions',
     label: /*#__PURE__*/React.createElement(FormattedMessage, {
-      id: "PN+75e",
+      id: "rmJBin",
       defaultMessage: [{
         "type": 0,
-        "value": "Created at"
+        "value": "Dimensions"
       }]
     }),
-    component: 'display',
-    type: 'date',
-    path: 'created_at',
-    format: 'yyyy-MM-dd hh:ss',
-    section: 'info'
+    type: 'display',
+    display: 'unit',
+    format: 'dimensions',
+    name: 'metadata'
+  }, {
+    id: 'size',
+    label: /*#__PURE__*/React.createElement(FormattedMessage, {
+      id: "g2CRt5",
+      defaultMessage: [{
+        "type": 0,
+        "value": "Size"
+      }]
+    }),
+    type: 'display',
+    display: 'unit',
+    format: 'bytes',
+    name: 'metadata.size'
+  }, {
+    id: 'duration',
+    label: /*#__PURE__*/React.createElement(FormattedMessage, {
+      id: "wU++NJ",
+      defaultMessage: [{
+        "type": 0,
+        "value": "Duration"
+      }]
+    }),
+    type: 'display',
+    display: 'unit',
+    format: 'duration',
+    name: 'metadata.duration'
   }]
-}
-// {
-//     id: 'technical',
-//     component: 'fields',
-//     title: <FormattedMessage defaultMessage="Technical details" description="Field title" />,
-//     fields: [
-//         {
-//             id: 'format',
-//             label: <FormattedMessage defaultMessage="Format" description="Field label" />,
-//             type: 'display',
-//             component: 'unit',
-//             format: 'format',
-//             path: 'format',
-//             section: 'technical',
-//         },
-//         {
-//             id: 'dimensions',
-//             label: <FormattedMessage defaultMessage="Dimensions" description="Field label" />,
-//             type: 'display',
-//             component: 'unit',
-//             format: 'dimensions',
-//             path: 'metadata',
-//             section: 'technical',
-//         },
-//         {
-//             id: 'size',
-//             label: <FormattedMessage defaultMessage="Size" description="Field label" />,
-//             type: 'display',
-//             component: 'unit',
-//             format: 'bytes',
-//             path: 'metadata.size',
-//             section: 'technical',
-//         },
-//         {
-//             id: 'duration',
-//             label: <FormattedMessage defaultMessage="Duration" description="Field label" />,
-//             type: 'display',
-//             component: 'unit',
-//             format: 'duration',
-//             path: 'metadata.duration',
-//             section: 'technical',
-//         },
-//     ],
-// },
-];
+}];
 
 var propTypes$7 = {
   value: PropTypes.shape({
@@ -346,8 +356,8 @@ var propTypes$7 = {
   fields: PropTypes.arrayOf(PropTypes.shape({
     name: PropTypes.string
   })),
-  onChange: PropTypes.func.isRequired,
-  onSave: PropTypes.func.isRequired,
+  onChange: PropTypes.func,
+  onSave: PropTypes.func,
   onDelete: PropTypes.func,
   onClose: PropTypes.func,
   className: PropTypes.string,
@@ -356,8 +366,10 @@ var propTypes$7 = {
 var defaultProps$7 = {
   value: null,
   fields: defaultFields,
-  onClose: null,
+  onChange: null,
+  onSave: null,
   onDelete: null,
+  onClose: null,
   className: null,
   children: null
 };
@@ -405,13 +417,13 @@ function MediaForm(_ref) {
       _ref3$id = _ref3.id,
       id = _ref3$id === void 0 ? null : _ref3$id;
     destroy(id, initialValue).then(function () {
-      if (onClose !== null) {
-        onClose();
-      }
       if (onDelete !== null) {
         onDelete();
       }
       setChanged(false);
+      if (onClose !== null) {
+        onClose();
+      }
     });
   }, [initialValue, destroy, destroying, setChanged]);
   var postForm = useCallback(function (action, data) {
@@ -433,16 +445,16 @@ function MediaForm(_ref) {
     generalError = _useForm.generalError;
   return /*#__PURE__*/React.createElement("div", {
     className: classNames(['text-body', _defineProperty({}, className, className !== null)])
+  }, /*#__PURE__*/React.createElement("nav", {
+    className: "navbar d-flex w-100 align-items-end justify-content-between border-bottom mb-3"
   }, /*#__PURE__*/React.createElement("div", {
-    className: "d-flex w-100 align-items-start justify-content-between mb-3 pb-2 border-bottom"
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "d-flex align-items-end justify-content-end mb-0"
+    className: "d-flex align-items-end justify-content-end mb-1"
   }, /*#__PURE__*/React.createElement("h4", {
     className: "d-inline text-break mb-0"
   }, name), /*#__PURE__*/React.createElement("span", {
     className: "mx-2"
   }, type)), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Button, {
-    className: "me-2 mb-1",
+    className: "me-2 mb-1 mt-1",
     theme: "danger",
     onClick: onDeleteMedia,
     disabled: destroying
@@ -453,7 +465,7 @@ function MediaForm(_ref) {
       "value": "Delete"
     }]
   })), onSave !== null ? /*#__PURE__*/React.createElement(Button, {
-    className: "mb-1",
+    className: "mb-1 mt-1",
     theme: "primary",
     onClick: onSubmit,
     disabled: !changed || updating || destroying
@@ -895,6 +907,10 @@ function MediasBrowser(_ref) {
     onSelectItems(media);
     onQueryReset();
   }, [setCurrentMedia, onQueryReset, onSelectItems]);
+  var onSaveMedia = useCallback(function () {
+    setCurrentMedia(null);
+    onQueryReset();
+  }, [setCurrentMedia, onQueryReset]);
   var pagination = /*#__PURE__*/React.createElement(Pagination, {
     page: page,
     lastPage: lastPage,
@@ -940,6 +956,8 @@ function MediasBrowser(_ref) {
   }))), /*#__PURE__*/React.createElement(MediaForm, {
     value: currentMedia,
     fields: fields,
+    onChange: setCurrentMedia,
+    onSave: onSaveMedia,
     onClose: onCloseMedia
   })) : /*#__PURE__*/React.createElement(React.Fragment, null, buttons !== null ? /*#__PURE__*/React.createElement(Buttons, {
     items: buttons,
@@ -992,6 +1010,7 @@ function MediasBrowser(_ref) {
     }
   }, tableProps, {
     items: items || [],
+    loading: loading,
     onSelectItem: onSelectItem !== null ? onSelectItem : function (it) {
       return onOpenMedia(it);
     }
@@ -1003,6 +1022,7 @@ function MediasBrowser(_ref) {
     }, "\u2014")
   }, tableProps, {
     items: items,
+    loading: loading,
     onSelectItem: onSelectItem !== null ? onSelectItem : function (it) {
       return onOpenMedia(it);
     },
@@ -1226,33 +1246,47 @@ function MediasResourceBrowser(_ref) {
         }
         return (_api$resources = api.resources).get.apply(_api$resources, [resource].concat(args));
       },
-      find: function find() {
+      getTrashed: function getTrashed() {
         var _api$resources2;
         for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
           args[_key2] = arguments[_key2];
         }
-        return (_api$resources2 = api.resources).find.apply(_api$resources2, [resource].concat(args));
+        return (_api$resources2 = api.resources).getTrashed.apply(_api$resources2, [resource].concat(args));
       },
-      create: function create() {
+      find: function find() {
         var _api$resources3;
         for (var _len3 = arguments.length, args = new Array(_len3), _key3 = 0; _key3 < _len3; _key3++) {
           args[_key3] = arguments[_key3];
         }
-        return (_api$resources3 = api.resources).create.apply(_api$resources3, [resource].concat(args));
+        return (_api$resources3 = api.resources).find.apply(_api$resources3, [resource].concat(args));
       },
-      update: function update() {
+      create: function create() {
         var _api$resources4;
         for (var _len4 = arguments.length, args = new Array(_len4), _key4 = 0; _key4 < _len4; _key4++) {
           args[_key4] = arguments[_key4];
         }
-        return (_api$resources4 = api.resources).update.apply(_api$resources4, [resource].concat(args));
+        return (_api$resources4 = api.resources).create.apply(_api$resources4, [resource].concat(args));
       },
-      "delete": function _delete() {
+      update: function update() {
         var _api$resources5;
         for (var _len5 = arguments.length, args = new Array(_len5), _key5 = 0; _key5 < _len5; _key5++) {
           args[_key5] = arguments[_key5];
         }
-        return (_api$resources5 = api.resources)["delete"].apply(_api$resources5, [resource].concat(args));
+        return (_api$resources5 = api.resources).update.apply(_api$resources5, [resource].concat(args));
+      },
+      trash: function trash() {
+        var _api$resources6;
+        for (var _len6 = arguments.length, args = new Array(_len6), _key6 = 0; _key6 < _len6; _key6++) {
+          args[_key6] = arguments[_key6];
+        }
+        return (_api$resources6 = api.resources).trash.apply(_api$resources6, [resource].concat(args));
+      },
+      "delete": function _delete() {
+        var _api$resources7;
+        for (var _len7 = arguments.length, args = new Array(_len7), _key7 = 0; _key7 < _len7; _key7++) {
+          args[_key7] = arguments[_key7];
+        }
+        return (_api$resources7 = api.resources)["delete"].apply(_api$resources7, [resource].concat(args));
       }
     };
   }, [api, resource]);
@@ -1274,7 +1308,16 @@ function MediasResourcePicker(_ref) {
   var resourceId = _ref.resource,
     props = _objectWithoutProperties(_ref, _excluded);
   var resource = usePanneauResource(resourceId);
-  // console.log('resource', resource);
+  var _ref2 = resource || {},
+    _ref2$index = _ref2.index,
+    index = _ref2$index === void 0 ? null : _ref2$index,
+    _ref2$fields = _ref2.fields,
+    fields = _ref2$fields === void 0 ? null : _ref2$fields;
+  var _ref3 = index || {},
+    _ref3$filters = _ref3.filters,
+    filters = _ref3$filters === void 0 ? null : _ref3$filters,
+    _ref3$columns = _ref3.columns,
+    columns = _ref3$columns === void 0 ? null : _ref3$columns;
   var api = useApi();
   var mediasApi = useMemo(function () {
     return {
@@ -1285,39 +1328,59 @@ function MediasResourcePicker(_ref) {
         }
         return (_api$resources = api.resources).get.apply(_api$resources, [resource].concat(args));
       },
-      find: function find() {
+      getTrashed: function getTrashed() {
         var _api$resources2;
         for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
           args[_key2] = arguments[_key2];
         }
-        return (_api$resources2 = api.resources).find.apply(_api$resources2, [resource].concat(args));
+        return (_api$resources2 = api.resources).getTrashed.apply(_api$resources2, [resource].concat(args));
       },
-      create: function create() {
+      find: function find() {
         var _api$resources3;
         for (var _len3 = arguments.length, args = new Array(_len3), _key3 = 0; _key3 < _len3; _key3++) {
           args[_key3] = arguments[_key3];
         }
-        return (_api$resources3 = api.resources).create.apply(_api$resources3, [resource].concat(args));
+        return (_api$resources3 = api.resources).find.apply(_api$resources3, [resource].concat(args));
       },
-      update: function update() {
+      create: function create() {
         var _api$resources4;
         for (var _len4 = arguments.length, args = new Array(_len4), _key4 = 0; _key4 < _len4; _key4++) {
           args[_key4] = arguments[_key4];
         }
-        return (_api$resources4 = api.resources).update.apply(_api$resources4, [resource].concat(args));
+        return (_api$resources4 = api.resources).create.apply(_api$resources4, [resource].concat(args));
       },
-      "delete": function _delete() {
+      update: function update() {
         var _api$resources5;
         for (var _len5 = arguments.length, args = new Array(_len5), _key5 = 0; _key5 < _len5; _key5++) {
           args[_key5] = arguments[_key5];
         }
-        return (_api$resources5 = api.resources)["delete"].apply(_api$resources5, [resource].concat(args));
+        return (_api$resources5 = api.resources).update.apply(_api$resources5, [resource].concat(args));
+      },
+      trash: function trash() {
+        var _api$resources6;
+        for (var _len6 = arguments.length, args = new Array(_len6), _key6 = 0; _key6 < _len6; _key6++) {
+          args[_key6] = arguments[_key6];
+        }
+        return (_api$resources6 = api.resources).trash.apply(_api$resources6, [resource].concat(args));
+      },
+      "delete": function _delete() {
+        var _api$resources7;
+        for (var _len7 = arguments.length, args = new Array(_len7), _key7 = 0; _key7 < _len7; _key7++) {
+          args[_key7] = arguments[_key7];
+        }
+        return (_api$resources7 = api.resources)["delete"].apply(_api$resources7, [resource].concat(args));
       }
     };
   }, [api, resource]);
   return /*#__PURE__*/React.createElement(MediasPickerContainer, Object.assign({
     api: mediasApi
-  }, props));
+  }, filters !== null ? {
+    filters: filters
+  } : null, fields !== null ? {
+    fields: fields
+  } : null, columns !== null ? {
+    columns: columns
+  } : null, props));
 }
 MediasResourcePicker.propTypes = propTypes;
 MediasResourcePicker.defaultProps = defaultProps;

package/lib/index.js

@@ -34,9 +34,11 @@ var useMediasApi = function useMediasApi() {
 };
 var apiPropTypes = PropTypes.shape({
   get: PropTypes.func.isRequired,
+  getTrashed: PropTypes.func.isRequired,
   create: PropTypes.func.isRequired,
   find: PropTypes.func.isRequired,
   update: PropTypes.func.isRequired,
+  trash: PropTypes.func.isRequired,
   "delete": PropTypes.func.isRequired
 });
 var propTypes$9 = {
@@ -257,89 +259,97 @@ var defaultFields = [{
   }),
   type: 'text',
   component: 'text'
-}, {
-  id: 'info',
+},
+// {
+//     id: 'info',
+//     component: 'fields',
+//     title: <FormattedMessage defaultMessage="Informations" description="Field title" />,
+//     isList: true,
+//     horizontal: true,
+//     fields: [
+//         {
+//             id: 'user',
+//             label: <FormattedMessage defaultMessage="Added by" description="Field label" />,
+//             type: 'display',
+//             display: 'avatar',
+//             name: 'user',
+//         },
+//         {
+//             id: 'created_at',
+//             label: <FormattedMessage defaultMessage="Created at" description="Field label" />,
+//             type: 'display',
+//             display: 'date',
+//             name: 'created_at',
+//             format: 'yyyy-MM-dd hh:ss',
+//         },
+//     ],
+// },
+{
+  id: 'technical',
   component: 'fields',
   title: /*#__PURE__*/React.createElement(reactIntl.FormattedMessage, {
-    id: "3RT69u",
+    id: "xKUOLG",
     defaultMessage: [{
       "type": 0,
-      "value": "Informations"
+      "value": "Technical details"
     }]
   }),
+  isList: true,
+  horizontal: true,
   fields: [{
-    id: 'user',
+    id: 'format',
     label: /*#__PURE__*/React.createElement(reactIntl.FormattedMessage, {
-      id: "yByaBh",
+      id: "JuxiUN",
       defaultMessage: [{
         "type": 0,
-        "value": "Added by"
+        "value": "Format"
       }]
     }),
-    component: 'display',
-    type: 'avatar',
-    path: 'user',
-    section: 'info'
+    type: 'display',
+    display: 'unit',
+    format: 'format',
+    name: 'format'
   }, {
-    id: 'created_at',
+    id: 'dimensions',
     label: /*#__PURE__*/React.createElement(reactIntl.FormattedMessage, {
-      id: "PN+75e",
+      id: "rmJBin",
       defaultMessage: [{
         "type": 0,
-        "value": "Created at"
+        "value": "Dimensions"
       }]
     }),
-    component: 'display',
-    type: 'date',
-    path: 'created_at',
-    format: 'yyyy-MM-dd hh:ss',
-    section: 'info'
+    type: 'display',
+    display: 'unit',
+    format: 'dimensions',
+    name: 'metadata'
+  }, {
+    id: 'size',
+    label: /*#__PURE__*/React.createElement(reactIntl.FormattedMessage, {
+      id: "g2CRt5",
+      defaultMessage: [{
+        "type": 0,
+        "value": "Size"
+      }]
+    }),
+    type: 'display',
+    display: 'unit',
+    format: 'bytes',
+    name: 'metadata.size'
+  }, {
+    id: 'duration',
+    label: /*#__PURE__*/React.createElement(reactIntl.FormattedMessage, {
+      id: "wU++NJ",
+      defaultMessage: [{
+        "type": 0,
+        "value": "Duration"
+      }]
+    }),
+    type: 'display',
+    display: 'unit',
+    format: 'duration',
+    name: 'metadata.duration'
   }]
-}
-// {
-//     id: 'technical',
-//     component: 'fields',
-//     title: <FormattedMessage defaultMessage="Technical details" description="Field title" />,
-//     fields: [
-//         {
-//             id: 'format',
-//             label: <FormattedMessage defaultMessage="Format" description="Field label" />,
-//             type: 'display',
-//             component: 'unit',
-//             format: 'format',
-//             path: 'format',
-//             section: 'technical',
-//         },
-//         {
-//             id: 'dimensions',
-//             label: <FormattedMessage defaultMessage="Dimensions" description="Field label" />,
-//             type: 'display',
-//             component: 'unit',
-//             format: 'dimensions',
-//             path: 'metadata',
-//             section: 'technical',
-//         },
-//         {
-//             id: 'size',
-//             label: <FormattedMessage defaultMessage="Size" description="Field label" />,
-//             type: 'display',
-//             component: 'unit',
-//             format: 'bytes',
-//             path: 'metadata.size',
-//             section: 'technical',
-//         },
-//         {
-//             id: 'duration',
-//             label: <FormattedMessage defaultMessage="Duration" description="Field label" />,
-//             type: 'display',
-//             component: 'unit',
-//             format: 'duration',
-//             path: 'metadata.duration',
-//             section: 'technical',
-//         },
-//     ],
-// },
-];
+}];
 
 var propTypes$7 = {
   value: PropTypes.shape({
@@ -348,8 +358,8 @@ var propTypes$7 = {
   fields: PropTypes.arrayOf(PropTypes.shape({
     name: PropTypes.string
   })),
-  onChange: PropTypes.func.isRequired,
-  onSave: PropTypes.func.isRequired,
+  onChange: PropTypes.func,
+  onSave: PropTypes.func,
   onDelete: PropTypes.func,
   onClose: PropTypes.func,
   className: PropTypes.string,
@@ -358,8 +368,10 @@ var propTypes$7 = {
 var defaultProps$7 = {
   value: null,
   fields: defaultFields,
-  onClose: null,
+  onChange: null,
+  onSave: null,
   onDelete: null,
+  onClose: null,
   className: null,
   children: null
 };
@@ -407,13 +419,13 @@ function MediaForm(_ref) {
       _ref3$id = _ref3.id,
       id = _ref3$id === void 0 ? null : _ref3$id;
     destroy(id, initialValue).then(function () {
-      if (onClose !== null) {
-        onClose();
-      }
       if (onDelete !== null) {
         onDelete();
       }
       setChanged(false);
+      if (onClose !== null) {
+        onClose();
+      }
     });
   }, [initialValue, destroy, destroying, setChanged]);
   var postForm = React.useCallback(function (action, data) {
@@ -435,16 +447,16 @@ function MediaForm(_ref) {
     generalError = _useForm.generalError;
   return /*#__PURE__*/React.createElement("div", {
     className: classNames(['text-body', _defineProperty({}, className, className !== null)])
+  }, /*#__PURE__*/React.createElement("nav", {
+    className: "navbar d-flex w-100 align-items-end justify-content-between border-bottom mb-3"
   }, /*#__PURE__*/React.createElement("div", {
-    className: "d-flex w-100 align-items-start justify-content-between mb-3 pb-2 border-bottom"
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "d-flex align-items-end justify-content-end mb-0"
+    className: "d-flex align-items-end justify-content-end mb-1"
   }, /*#__PURE__*/React.createElement("h4", {
     className: "d-inline text-break mb-0"
   }, name), /*#__PURE__*/React.createElement("span", {
     className: "mx-2"
   }, type)), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Button, {
-    className: "me-2 mb-1",
+    className: "me-2 mb-1 mt-1",
     theme: "danger",
     onClick: onDeleteMedia,
     disabled: destroying
@@ -455,7 +467,7 @@ function MediaForm(_ref) {
       "value": "Delete"
     }]
   })), onSave !== null ? /*#__PURE__*/React.createElement(Button, {
-    className: "mb-1",
+    className: "mb-1 mt-1",
     theme: "primary",
     onClick: onSubmit,
     disabled: !changed || updating || destroying
@@ -897,6 +909,10 @@ function MediasBrowser(_ref) {
     onSelectItems(media);
     onQueryReset();
   }, [setCurrentMedia, onQueryReset, onSelectItems]);
+  var onSaveMedia = React.useCallback(function () {
+    setCurrentMedia(null);
+    onQueryReset();
+  }, [setCurrentMedia, onQueryReset]);
   var pagination = /*#__PURE__*/React.createElement(Pagination, {
     page: page,
     lastPage: lastPage,
@@ -942,6 +958,8 @@ function MediasBrowser(_ref) {
   }))), /*#__PURE__*/React.createElement(MediaForm, {
     value: currentMedia,
     fields: fields,
+    onChange: setCurrentMedia,
+    onSave: onSaveMedia,
     onClose: onCloseMedia
   })) : /*#__PURE__*/React.createElement(React.Fragment, null, buttons !== null ? /*#__PURE__*/React.createElement(Buttons, {
     items: buttons,
@@ -994,6 +1012,7 @@ function MediasBrowser(_ref) {
     }
   }, tableProps, {
     items: items || [],
+    loading: loading,
     onSelectItem: onSelectItem !== null ? onSelectItem : function (it) {
       return onOpenMedia(it);
     }
@@ -1005,6 +1024,7 @@ function MediasBrowser(_ref) {
     }, "\u2014")
   }, tableProps, {
     items: items,
+    loading: loading,
     onSelectItem: onSelectItem !== null ? onSelectItem : function (it) {
       return onOpenMedia(it);
     },
@@ -1228,33 +1248,47 @@ function MediasResourceBrowser(_ref) {
         }
         return (_api$resources = api.resources).get.apply(_api$resources, [resource].concat(args));
       },
-      find: function find() {
+      getTrashed: function getTrashed() {
         var _api$resources2;
         for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
           args[_key2] = arguments[_key2];
         }
-        return (_api$resources2 = api.resources).find.apply(_api$resources2, [resource].concat(args));
+        return (_api$resources2 = api.resources).getTrashed.apply(_api$resources2, [resource].concat(args));
       },
-      create: function create() {
+      find: function find() {
         var _api$resources3;
         for (var _len3 = arguments.length, args = new Array(_len3), _key3 = 0; _key3 < _len3; _key3++) {
           args[_key3] = arguments[_key3];
         }
-        return (_api$resources3 = api.resources).create.apply(_api$resources3, [resource].concat(args));
+        return (_api$resources3 = api.resources).find.apply(_api$resources3, [resource].concat(args));
       },
-      update: function update() {
+      create: function create() {
         var _api$resources4;
         for (var _len4 = arguments.length, args = new Array(_len4), _key4 = 0; _key4 < _len4; _key4++) {
           args[_key4] = arguments[_key4];
         }
-        return (_api$resources4 = api.resources).update.apply(_api$resources4, [resource].concat(args));
+        return (_api$resources4 = api.resources).create.apply(_api$resources4, [resource].concat(args));
       },
-      "delete": function _delete() {
+      update: function update() {
         var _api$resources5;
         for (var _len5 = arguments.length, args = new Array(_len5), _key5 = 0; _key5 < _len5; _key5++) {
           args[_key5] = arguments[_key5];
         }
-        return (_api$resources5 = api.resources)["delete"].apply(_api$resources5, [resource].concat(args));
+        return (_api$resources5 = api.resources).update.apply(_api$resources5, [resource].concat(args));
+      },
+      trash: function trash() {
+        var _api$resources6;
+        for (var _len6 = arguments.length, args = new Array(_len6), _key6 = 0; _key6 < _len6; _key6++) {
+          args[_key6] = arguments[_key6];
+        }
+        return (_api$resources6 = api.resources).trash.apply(_api$resources6, [resource].concat(args));
+      },
+      "delete": function _delete() {
+        var _api$resources7;
+        for (var _len7 = arguments.length, args = new Array(_len7), _key7 = 0; _key7 < _len7; _key7++) {
+          args[_key7] = arguments[_key7];
+        }
+        return (_api$resources7 = api.resources)["delete"].apply(_api$resources7, [resource].concat(args));
       }
     };
   }, [api, resource]);
@@ -1276,7 +1310,16 @@ function MediasResourcePicker(_ref) {
   var resourceId = _ref.resource,
     props = _objectWithoutProperties(_ref, _excluded);
   var resource = contexts.usePanneauResource(resourceId);
-  // console.log('resource', resource);
+  var _ref2 = resource || {},
+    _ref2$index = _ref2.index,
+    index = _ref2$index === void 0 ? null : _ref2$index,
+    _ref2$fields = _ref2.fields,
+    fields = _ref2$fields === void 0 ? null : _ref2$fields;
+  var _ref3 = index || {},
+    _ref3$filters = _ref3.filters,
+    filters = _ref3$filters === void 0 ? null : _ref3$filters,
+    _ref3$columns = _ref3.columns,
+    columns = _ref3$columns === void 0 ? null : _ref3$columns;
   var api = data.useApi();
   var mediasApi = React.useMemo(function () {
     return {
@@ -1287,39 +1330,59 @@ function MediasResourcePicker(_ref) {
         }
         return (_api$resources = api.resources).get.apply(_api$resources, [resource].concat(args));
       },
-      find: function find() {
+      getTrashed: function getTrashed() {
         var _api$resources2;
         for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
           args[_key2] = arguments[_key2];
         }
-        return (_api$resources2 = api.resources).find.apply(_api$resources2, [resource].concat(args));
+        return (_api$resources2 = api.resources).getTrashed.apply(_api$resources2, [resource].concat(args));
       },
-      create: function create() {
+      find: function find() {
         var _api$resources3;
         for (var _len3 = arguments.length, args = new Array(_len3), _key3 = 0; _key3 < _len3; _key3++) {
           args[_key3] = arguments[_key3];
         }
-        return (_api$resources3 = api.resources).create.apply(_api$resources3, [resource].concat(args));
+        return (_api$resources3 = api.resources).find.apply(_api$resources3, [resource].concat(args));
       },
-      update: function update() {
+      create: function create() {
         var _api$resources4;
         for (var _len4 = arguments.length, args = new Array(_len4), _key4 = 0; _key4 < _len4; _key4++) {
           args[_key4] = arguments[_key4];
         }
-        return (_api$resources4 = api.resources).update.apply(_api$resources4, [resource].concat(args));
+        return (_api$resources4 = api.resources).create.apply(_api$resources4, [resource].concat(args));
       },
-      "delete": function _delete() {
+      update: function update() {
         var _api$resources5;
         for (var _len5 = arguments.length, args = new Array(_len5), _key5 = 0; _key5 < _len5; _key5++) {
           args[_key5] = arguments[_key5];
         }
-        return (_api$resources5 = api.resources)["delete"].apply(_api$resources5, [resource].concat(args));
+        return (_api$resources5 = api.resources).update.apply(_api$resources5, [resource].concat(args));
+      },
+      trash: function trash() {
+        var _api$resources6;
+        for (var _len6 = arguments.length, args = new Array(_len6), _key6 = 0; _key6 < _len6; _key6++) {
+          args[_key6] = arguments[_key6];
+        }
+        return (_api$resources6 = api.resources).trash.apply(_api$resources6, [resource].concat(args));
+      },
+      "delete": function _delete() {
+        var _api$resources7;
+        for (var _len7 = arguments.length, args = new Array(_len7), _key7 = 0; _key7 < _len7; _key7++) {
+          args[_key7] = arguments[_key7];
+        }
+        return (_api$resources7 = api.resources)["delete"].apply(_api$resources7, [resource].concat(args));
       }
     };
   }, [api, resource]);
   return /*#__PURE__*/React.createElement(MediasPickerContainer, Object.assign({
     api: mediasApi
-  }, props));
+  }, filters !== null ? {
+    filters: filters
+  } : null, fields !== null ? {
+    fields: fields
+  } : null, columns !== null ? {
+    columns: columns
+  } : null, props));
 }
 MediasResourcePicker.propTypes = propTypes;
 MediasResourcePicker.defaultProps = defaultProps;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@panneau/medias",
-    "version": "3.0.162",
+    "version": "3.0.164",
     "description": "",
     "keywords": [
         "javascript"
@@ -46,21 +46,21 @@
     },
     "dependencies": {
         "@babel/runtime": "^7.12.5",
-        "@panneau/core": "^3.0.162",
-        "@panneau/data": "^3.0.162",
-        "@panneau/element-button": "^3.0.162",
-        "@panneau/element-buttons": "^3.0.162",
-        "@panneau/element-form": "^3.0.162",
-        "@panneau/element-form-status": "^3.0.162",
-        "@panneau/element-grid": "^3.0.162",
-        "@panneau/element-icon": "^3.0.162",
-        "@panneau/element-media-card": "^3.0.162",
-        "@panneau/element-media-player": "^3.0.162",
-        "@panneau/element-media-preview": "^3.0.162",
-        "@panneau/element-pagination": "^3.0.162",
-        "@panneau/element-table": "^3.0.162",
-        "@panneau/field-upload": "^3.0.162",
-        "@panneau/filter-filters": "^3.0.162",
+        "@panneau/core": "^3.0.164",
+        "@panneau/data": "^3.0.164",
+        "@panneau/element-button": "^3.0.164",
+        "@panneau/element-buttons": "^3.0.164",
+        "@panneau/element-form": "^3.0.164",
+        "@panneau/element-form-status": "^3.0.164",
+        "@panneau/element-grid": "^3.0.164",
+        "@panneau/element-icon": "^3.0.164",
+        "@panneau/element-media-card": "^3.0.164",
+        "@panneau/element-media-player": "^3.0.164",
+        "@panneau/element-media-preview": "^3.0.164",
+        "@panneau/element-pagination": "^3.0.164",
+        "@panneau/element-table": "^3.0.164",
+        "@panneau/field-upload": "^3.0.164",
+        "@panneau/filter-filters": "^3.0.164",
         "classnames": "^2.5.1",
         "lodash": "^4.17.21",
         "prop-types": "^15.7.2",
@@ -69,5 +69,5 @@
     "publishConfig": {
         "access": "public"
     },
-    "gitHead": "82936217c80643ad52d9b425a7a8c374d6264d8e"
+    "gitHead": "7a1511eb7b08a09cfcf708d1ca314a12155e9bd8"
 }