@panneau/modal-medias-picker 4.0.50 → 4.0.55

package/dist/index.d.ts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { Media, Resource } from '@panneau/core';
+import { Media, Resource, Button } from '@panneau/core';
 
 interface MediasPickerModalProps {
     id: string;
@@ -7,11 +7,11 @@ interface MediasPickerModalProps {
     resource?: Resource | string | null;
     title?: string | null;
     multiple?: boolean;
-    onChange?: ((items: Media[]) => void) | null;
+    onChange?: ((items: Media | Media[] | null) => void) | null;
     onClosed?: (() => void) | null;
-    confirmButton?: Record<string, unknown> | null;
-    cancelButton?: Record<string, unknown> | null;
+    confirmButton?: Button | null;
+    cancelButton?: Button | null;
 }
-declare function MediasPickerModal({ id, value, resource, title, onChange, onClosed, confirmButton, cancelButton, multiple, ...props }: MediasPickerModalProps): react_jsx_runtime.JSX.Element;
+declare function MediasPickerModal({ id, value: initialValue, resource, title, onChange, onClosed, confirmButton, cancelButton, multiple, ...props }: MediasPickerModalProps): react_jsx_runtime.JSX.Element;
 
 export { MediasPickerModal as default };

package/dist/index.js

@@ -1,4 +1,6 @@
 import { c } from 'react/compiler-runtime';
+import isArray from 'lodash/isArray';
+import isObject from 'lodash/isObject';
 import { useState } from 'react';
 import { FormattedMessage } from 'react-intl';
 import { MediasResourcePicker, MediasPickerContainer } from '@panneau/medias';
@@ -6,7 +8,7 @@ import Dialog from '@panneau/modal-dialog';
 import { jsx } from 'react/jsx-runtime';
 
 function MediasPickerModal(t0) {
-  const $ = c(35);
+  const $ = c(43);
   let id;
   let props;
   let t1;
@@ -53,7 +55,7 @@ function MediasPickerModal(t0) {
     t7 = $[9];
     t8 = $[10];
   }
-  const value = t1 === undefined ? null : t1;
+  const initialValue = t1 === undefined ? null : t1;
   const resource = t2 === undefined ? null : t2;
   const title = t3 === undefined ? null : t3;
   const onChange = t4 === undefined ? null : t4;
@@ -72,89 +74,104 @@ function MediasPickerModal(t0) {
     t9 = $[11];
   }
   const requestClose = t9;
-  const [selectedItems, setSelectedItems] = useState(value);
   let t10;
-  if ($[12] !== onChange || $[13] !== selectedItems) {
-    t10 = () => {
+  if ($[12] !== initialValue) {
+    t10 = () => isObject(initialValue) && !isArray(initialValue) ? [initialValue] : initialValue;
+    $[12] = initialValue;
+    $[13] = t10;
+  } else {
+    t10 = $[13];
+  }
+  const [selectedItems, setSelectedItems] = useState(t10);
+  let t11;
+  if ($[14] !== multiple || $[15] !== onChange || $[16] !== selectedItems) {
+    t11 = () => {
       if (onChange !== null) {
-        onChange(selectedItems);
+        onChange(!multiple ? selectedItems?.[0] || null : selectedItems);
       }
       requestClose();
     };
-    $[12] = onChange;
-    $[13] = selectedItems;
-    $[14] = t10;
+    $[14] = multiple;
+    $[15] = onChange;
+    $[16] = selectedItems;
+    $[17] = t11;
   } else {
-    t10 = $[14];
+    t11 = $[17];
   }
-  const onConfirm = t10;
-  let t11;
-  if ($[15] === Symbol.for("react.memo_cache_sentinel")) {
-    t11 = items => {
+  const onConfirm = t11;
+  let t12;
+  if ($[18] === Symbol.for("react.memo_cache_sentinel")) {
+    t12 = items => {
       setSelectedItems(items);
     };
-    $[15] = t11;
+    $[18] = t12;
   } else {
-    t11 = $[15];
+    t12 = $[18];
   }
-  const onSelectionChange = t11;
+  const onSelectionChange = t12;
   const [mediaFormOpen, setMediaFormOpen] = useState(false);
-  let t12;
-  if ($[16] === Symbol.for("react.memo_cache_sentinel")) {
-    t12 = () => {
+  let t13;
+  if ($[19] === Symbol.for("react.memo_cache_sentinel")) {
+    t13 = () => {
       setMediaFormOpen(true);
     };
-    $[16] = t12;
+    $[19] = t13;
   } else {
-    t12 = $[16];
+    t13 = $[19];
   }
-  const onMediaFormOpen = t12;
-  let t13;
-  if ($[17] === Symbol.for("react.memo_cache_sentinel")) {
-    t13 = () => {
+  const onMediaFormOpen = t13;
+  let t14;
+  if ($[20] === Symbol.for("react.memo_cache_sentinel")) {
+    t14 = () => {
       setMediaFormOpen(false);
     };
-    $[17] = t13;
+    $[20] = t14;
   } else {
-    t13 = $[17];
+    t14 = $[20];
   }
-  const onMediaFormClose = t13;
-  const t14 = id || "medias-picker";
-  let t15;
-  if ($[18] !== cancelButton || $[19] !== confirmButton || $[20] !== mediaFormOpen || $[21] !== onConfirm) {
-    t15 = !mediaFormOpen ? [{
-      id: "cancel",
-      label: /*#__PURE__*/jsx(FormattedMessage, {
-        id: "PyxZY2"
-      }),
-      theme: "secondary",
-      onClick: requestClose,
-      ...cancelButton
-    }, {
-      id: "confirm",
-      label: /*#__PURE__*/jsx(FormattedMessage, {
-        id: "rvOVCV"
-      }),
-      theme: "primary",
-      onClick: onConfirm,
-      ...confirmButton
-    }] : null;
-    $[18] = cancelButton;
-    $[19] = confirmButton;
-    $[20] = mediaFormOpen;
-    $[21] = onConfirm;
-    $[22] = t15;
+  const onMediaFormClose = t14;
+  const t15 = id || "medias-picker";
+  let t16;
+  if ($[21] !== title) {
+    t16 = title ?? /*#__PURE__*/jsx(FormattedMessage, {
+      id: "DV8/HU"
+    });
+    $[21] = title;
+    $[22] = t16;
   } else {
-    t15 = $[22];
+    t16 = $[22];
   }
-  let t16;
-  if ($[23] !== multiple || $[24] !== props || $[25] !== resource || $[26] !== selectedItems) {
-    t16 = resource !== null ? /*#__PURE__*/jsx(MediasResourcePicker, {
+  const t17 = !mediaFormOpen;
+  const t18 = !mediaFormOpen;
+  let t19;
+  if ($[23] === Symbol.for("react.memo_cache_sentinel")) {
+    t19 = /*#__PURE__*/jsx(FormattedMessage, {
+      id: "rvOVCV"
+    });
+    $[23] = t19;
+  } else {
+    t19 = $[23];
+  }
+  const t20 = selectedItems === null || selectedItems.length === 0;
+  let t21;
+  if ($[24] !== confirmButton || $[25] !== t20) {
+    t21 = {
+      ...confirmButton,
+      disabled: t20
+    };
+    $[24] = confirmButton;
+    $[25] = t20;
+    $[26] = t21;
+  } else {
+    t21 = $[26];
+  }
+  let t22;
+  if ($[27] !== multiple || $[28] !== props || $[29] !== resource || $[30] !== selectedItems) {
+    t22 = resource !== null ? /*#__PURE__*/jsx(MediasResourcePicker, {
       ...props,
       value: selectedItems,
       resource: resource,
       onChange: onSelectionChange,
-      onClose: requestClose,
       multiple: multiple,
       onMediaFormOpen: onMediaFormOpen,
       onMediaFormClose: onMediaFormClose
@@ -162,42 +179,51 @@ function MediasPickerModal(t0) {
       ...props,
       value: selectedItems,
       onChange: onSelectionChange,
-      onClose: requestClose,
       multiple: multiple,
       onMediaFormOpen: onMediaFormOpen,
       onMediaFormClose: onMediaFormClose
     });
-    $[23] = multiple;
-    $[24] = props;
-    $[25] = resource;
-    $[26] = selectedItems;
-    $[27] = t16;
+    $[27] = multiple;
+    $[28] = props;
+    $[29] = resource;
+    $[30] = selectedItems;
+    $[31] = t22;
   } else {
-    t16 = $[27];
+    t22 = $[31];
   }
-  let t17;
-  if ($[28] !== onClosed || $[29] !== opened || $[30] !== t14 || $[31] !== t15 || $[32] !== t16 || $[33] !== title) {
-    t17 = /*#__PURE__*/jsx(Dialog, {
-      id: t14,
+  let t23;
+  if ($[32] !== cancelButton || $[33] !== onClosed || $[34] !== onConfirm || $[35] !== opened || $[36] !== t15 || $[37] !== t16 || $[38] !== t17 || $[39] !== t18 || $[40] !== t21 || $[41] !== t22) {
+    t23 = /*#__PURE__*/jsx(Dialog, {
+      id: t15,
       size: "xl",
       visible: opened,
       requestClose: requestClose,
       onClosed: onClosed,
-      title: title,
-      buttons: t15,
-      children: t16
+      title: t16,
+      withCancelButton: t17,
+      withSubmitButton: t18,
+      submitButtonLabel: t19,
+      submitButton: t21,
+      className: "modal-fullscreen-lg-down",
+      cancelButton: cancelButton,
+      onClickSubmit: onConfirm,
+      children: t22
     });
-    $[28] = onClosed;
-    $[29] = opened;
-    $[30] = t14;
-    $[31] = t15;
-    $[32] = t16;
-    $[33] = title;
-    $[34] = t17;
+    $[32] = cancelButton;
+    $[33] = onClosed;
+    $[34] = onConfirm;
+    $[35] = opened;
+    $[36] = t15;
+    $[37] = t16;
+    $[38] = t17;
+    $[39] = t18;
+    $[40] = t21;
+    $[41] = t22;
+    $[42] = t23;
   } else {
-    t17 = $[34];
+    t23 = $[42];
   }
-  return t17;
+  return t23;
 }
 
 export { MediasPickerModal as default };

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@panneau/modal-medias-picker",
-    "version": "4.0.50",
+    "version": "4.0.55",
     "description": "Medias picker modal",
     "keywords": [
         "javascript"
@@ -52,9 +52,9 @@
     },
     "dependencies": {
         "@babel/runtime": "^7.28.6",
-        "@panneau/core": "^4.0.50",
-        "@panneau/medias": "^4.0.50",
-        "@panneau/modal-dialog": "^4.0.50",
+        "@panneau/core": "^4.0.55",
+        "@panneau/medias": "^4.0.55",
+        "@panneau/modal-dialog": "^4.0.55",
         "@uppy/core": "^5.1.1",
         "@uppy/dashboard": "^5.0.4",
         "@uppy/react": "^5.1.1",
@@ -65,5 +65,5 @@
     "publishConfig": {
         "access": "public"
     },
-    "gitHead": "c5d4004686dae5529035f8eac83571739e24340d"
+    "gitHead": "1c9183567fc5bf98ba10fa57c63cf2ed2ae4a054"
 }