@payloadcms/ui 3.71.0-canary.2 → 3.71.0-internal-debug.dea9d74

package/dist/@types/assets.d.js.map

@@ -1 +1 @@
-{"version":3,"file":"assets.d.js","names":[],"sources":["../../src/@types/assets.d.ts"],"sourcesContent":[null],"mappings":"","ignoreList":[]}
+{"version":3,"sources":["../../src/@types/assets.d.ts"],"names":[],"mappings":""}

package/dist/assets/index.js

@@ -2,4 +2,5 @@ export { default as payloadFavicon } from './payload-favicon.svg';
 export { default as payloadFaviconDark } from './payload-favicon-dark.png';
 export { default as payloadFaviconLight } from './payload-favicon-light.png';
 export { default as staticOGImage } from './static-og-image.png';
+
 //# sourceMappingURL=index.js.map

package/dist/assets/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["default","payloadFavicon","payloadFaviconDark","payloadFaviconLight","staticOGImage"],"sources":["../../src/assets/index.ts"],"sourcesContent":["export { default as payloadFavicon } from './payload-favicon.svg'\nexport { default as payloadFaviconDark } from './payload-favicon-dark.png'\nexport { default as payloadFaviconLight } from './payload-favicon-light.png'\nexport { default as staticOGImage } from './static-og-image.png'\n"],"mappings":"AAAA,SAASA,OAAA,IAAWC,cAAc,QAAQ;AAC1C,SAASD,OAAA,IAAWE,kBAAkB,QAAQ;AAC9C,SAASF,OAAA,IAAWG,mBAAmB,QAAQ;AAC/C,SAASH,OAAA,IAAWI,aAAa,QAAQ","ignoreList":[]}
+{"version":3,"sources":["../../src/assets/index.ts"],"sourcesContent":["export { default as payloadFavicon } from './payload-favicon.svg'\nexport { default as payloadFaviconDark } from './payload-favicon-dark.png'\nexport { default as payloadFaviconLight } from './payload-favicon-light.png'\nexport { default as staticOGImage } from './static-og-image.png'\n"],"names":["default","payloadFavicon","payloadFaviconDark","payloadFaviconLight","staticOGImage"],"mappings":"AAAA,SAASA,WAAWC,cAAc,QAAQ,wBAAuB;AACjE,SAASD,WAAWE,kBAAkB,QAAQ,6BAA4B;AAC1E,SAASF,WAAWG,mBAAmB,QAAQ,8BAA6B;AAC5E,SAASH,WAAWI,aAAa,QAAQ,wBAAuB"}

package/dist/elements/AddNewRelation/index.js

@@ -1,7 +1,5 @@
 'use client';
-
-import { c as _c } from "react/compiler-runtime";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
 import { getTranslation } from '@payloadcms/translations';
 import { hasAutosaveEnabled } from 'payload/shared';
 import React, { Fragment, useCallback, useEffect, useState } from 'react';
@@ -16,280 +14,227 @@ import * as PopupList from '../Popup/PopupButtonList/index.js';
 import './index.scss';
 import { Tooltip } from '../Tooltip/index.js';
 const baseClass = 'relationship-add-new';
-export const AddNewRelation = t0 => {
-  const $ = _c(46);
-  const {
-    Button: ButtonFromProps,
-    hasMany,
-    onChange,
-    path,
-    relationTo,
-    unstyled,
-    value
-  } = t0;
-  const relatedCollections = useRelatedCollections(relationTo);
-  const {
-    permissions
-  } = useAuth();
-  const [show, setShow] = useState(false);
-  const [selectedCollection, setSelectedCollection] = useState();
-  const relatedToMany = relatedCollections.length > 1;
-  let t1;
-  if ($[0] !== relatedCollections[0] || $[1] !== relatedToMany) {
-    t1 = () => !relatedToMany ? relatedCollections[0] : undefined;
-    $[0] = relatedCollections[0];
-    $[1] = relatedToMany;
-    $[2] = t1;
-  } else {
-    t1 = $[2];
-  }
-  const [collectionConfig, setCollectionConfig] = useState(t1);
-  const [popupOpen, setPopupOpen] = useState(false);
-  const {
-    i18n,
-    t
-  } = useTranslation();
-  const [showTooltip, setShowTooltip] = useState(false);
-  const t2 = collectionConfig?.slug;
-  let t3;
-  if ($[3] !== t2) {
-    t3 = {
-      collectionSlug: t2
-    };
-    $[3] = t2;
-    $[4] = t3;
-  } else {
-    t3 = $[4];
-  }
-  const [DocumentDrawer, DocumentDrawerToggler, t4] = useDocumentDrawer(t3);
-  const {
-    isDrawerOpen,
-    toggleDrawer
-  } = t4;
-  let t5;
-  if ($[5] !== collectionConfig || $[6] !== hasMany || $[7] !== onChange || $[8] !== value) {
-    t5 = t6 => {
-      const {
-        doc,
-        operation
-      } = t6;
-      if (operation === "create" || operation === "update" && hasAutosaveEnabled(collectionConfig)) {
-        let isNewValue;
-        if (!value) {
-          isNewValue = true;
-        } else {
-          isNewValue = Array.isArray(value) ? !value.some(v => v && v.value === doc.id) : value.value !== doc.id;
+export const AddNewRelation = ({ Button: ButtonFromProps, hasMany, onChange, path, relationTo, unstyled, value })=>{
+    const relatedCollections = useRelatedCollections(relationTo);
+    const { permissions } = useAuth();
+    const [show, setShow] = useState(false);
+    const [selectedCollection, setSelectedCollection] = useState();
+    const relatedToMany = relatedCollections.length > 1;
+    const [collectionConfig, setCollectionConfig] = useState(()=>!relatedToMany ? relatedCollections[0] : undefined);
+    const [popupOpen, setPopupOpen] = useState(false);
+    const { i18n, t } = useTranslation();
+    const [showTooltip, setShowTooltip] = useState(false);
+    const [DocumentDrawer, DocumentDrawerToggler, { isDrawerOpen, toggleDrawer }] = useDocumentDrawer({
+        collectionSlug: collectionConfig?.slug
+    });
+    const onSave = useCallback(({ doc, operation })=>{
+        // if autosave is enabled, the operation will be 'update'
+        if (operation === 'create' || operation === 'update' && hasAutosaveEnabled(collectionConfig)) {
+            // ensure the value is not already in the array
+            let isNewValue = false;
+            if (!value) {
+                isNewValue = true;
+            } else {
+                isNewValue = Array.isArray(value) ? !value.some((v)=>v && v.value === doc.id) : value.value !== doc.id;
+            }
+            if (isNewValue) {
+                if (hasMany === true) {
+                    onChange([
+                        ...Array.isArray(value) ? value : [],
+                        {
+                            relationTo: collectionConfig?.slug,
+                            value: doc.id
+                        }
+                    ]);
+                } else {
+                    onChange({
+                        relationTo: collectionConfig?.slug,
+                        value: doc.id
+                    });
+                }
+            }
+            setSelectedCollection(undefined);
+        }
+    }, [
+        collectionConfig,
+        hasMany,
+        onChange,
+        value
+    ]);
+    const onPopupToggle = useCallback((state)=>{
+        setPopupOpen(state);
+    }, []);
+    useEffect(()=>{
+        if (permissions) {
+            if (relatedCollections.length === 1) {
+                setShow(permissions.collections[relatedCollections[0]?.slug]?.create);
+            } else {
+                setShow(relatedCollections.some((collection)=>permissions.collections[collection?.slug]?.create));
+            }
+        }
+    }, [
+        permissions,
+        relatedCollections
+    ]);
+    useEffect(()=>{
+        if (relatedToMany && selectedCollection) {
+            setCollectionConfig(relatedCollections.find((collection)=>collection?.slug === selectedCollection));
         }
-        if (isNewValue) {
-          if (hasMany === true) {
-            onChange([...(Array.isArray(value) ? value : []), {
-              relationTo: collectionConfig?.slug,
-              value: doc.id
-            }]);
-          } else {
-            onChange({
-              relationTo: collectionConfig?.slug,
-              value: doc.id
-            });
-          }
+    }, [
+        selectedCollection,
+        relatedToMany,
+        relatedCollections
+    ]);
+    useEffect(()=>{
+        if (relatedToMany && collectionConfig) {
+            // the drawer must be rendered on the page before before opening it
+            // this is why 'selectedCollection' is different from 'collectionConfig'
+            toggleDrawer();
+            setSelectedCollection(undefined);
         }
-        setSelectedCollection(undefined);
-      }
-    };
-    $[5] = collectionConfig;
-    $[6] = hasMany;
-    $[7] = onChange;
-    $[8] = value;
-    $[9] = t5;
-  } else {
-    t5 = $[9];
-  }
-  const onSave = t5;
-  let t6;
-  if ($[10] === Symbol.for("react.memo_cache_sentinel")) {
-    t6 = state => {
-      setPopupOpen(state);
-    };
-    $[10] = t6;
-  } else {
-    t6 = $[10];
-  }
-  const onPopupToggle = t6;
-  let t7;
-  let t8;
-  if ($[11] !== permissions || $[12] !== relatedCollections) {
-    t7 = () => {
-      if (permissions) {
-        if (relatedCollections.length === 1) {
-          setShow(permissions.collections[relatedCollections[0]?.slug]?.create);
-        } else {
-          setShow(relatedCollections.some(collection => permissions.collections[collection?.slug]?.create));
+    }, [
+        toggleDrawer,
+        relatedToMany,
+        collectionConfig
+    ]);
+    useEffect(()=>{
+        if (relatedToMany && !isDrawerOpen) {
+            setCollectionConfig(undefined);
         }
-      }
-    };
-    t8 = [permissions, relatedCollections];
-    $[11] = permissions;
-    $[12] = relatedCollections;
-    $[13] = t7;
-    $[14] = t8;
-  } else {
-    t7 = $[13];
-    t8 = $[14];
-  }
-  useEffect(t7, t8);
-  let t10;
-  let t9;
-  if ($[15] !== relatedCollections || $[16] !== relatedToMany || $[17] !== selectedCollection) {
-    t9 = () => {
-      if (relatedToMany && selectedCollection) {
-        setCollectionConfig(relatedCollections.find(collection_0 => collection_0?.slug === selectedCollection));
-      }
-    };
-    t10 = [selectedCollection, relatedToMany, relatedCollections];
-    $[15] = relatedCollections;
-    $[16] = relatedToMany;
-    $[17] = selectedCollection;
-    $[18] = t10;
-    $[19] = t9;
-  } else {
-    t10 = $[18];
-    t9 = $[19];
-  }
-  useEffect(t9, t10);
-  let t11;
-  let t12;
-  if ($[20] !== collectionConfig || $[21] !== relatedToMany || $[22] !== toggleDrawer) {
-    t11 = () => {
-      if (relatedToMany && collectionConfig) {
-        toggleDrawer();
-        setSelectedCollection(undefined);
-      }
-    };
-    t12 = [toggleDrawer, relatedToMany, collectionConfig];
-    $[20] = collectionConfig;
-    $[21] = relatedToMany;
-    $[22] = toggleDrawer;
-    $[23] = t11;
-    $[24] = t12;
-  } else {
-    t11 = $[23];
-    t12 = $[24];
-  }
-  useEffect(t11, t12);
-  let t13;
-  let t14;
-  if ($[25] !== isDrawerOpen || $[26] !== relatedToMany) {
-    t13 = () => {
-      if (relatedToMany && !isDrawerOpen) {
-        setCollectionConfig(undefined);
-      }
-    };
-    t14 = [isDrawerOpen, relatedToMany];
-    $[25] = isDrawerOpen;
-    $[26] = relatedToMany;
-    $[27] = t13;
-    $[28] = t14;
-  } else {
-    t13 = $[27];
-    t14 = $[28];
-  }
-  useEffect(t13, t14);
-  const t15 = relatedCollections[0]?.labels.singular;
-  let t16;
-  let t17;
-  if ($[29] !== ButtonFromProps || $[30] !== DocumentDrawer || $[31] !== DocumentDrawerToggler || $[32] !== collectionConfig || $[33] !== i18n || $[34] !== onSave || $[35] !== path || $[36] !== permissions || $[37] !== popupOpen || $[38] !== relatedCollections || $[39] !== show || $[40] !== showTooltip || $[41] !== t || $[42] !== t15 || $[43] !== unstyled) {
-    t17 = Symbol.for("react.early_return_sentinel");
-    bb0: {
-      const label = t("fields:addNewLabel", {
-        label: getTranslation(t15, i18n)
-      });
-      if (!show) {
-        t17 = null;
-        break bb0;
-      }
-      t16 = _jsxs("div", {
+    }, [
+        isDrawerOpen,
+        relatedToMany
+    ]);
+    const label = t('fields:addNewLabel', {
+        label: getTranslation(relatedCollections[0]?.labels.singular, i18n)
+    });
+    if (!show) {
+        return null;
+    }
+    return /*#__PURE__*/ _jsxDEV("div", {
         className: baseClass,
         id: `${path}-add-new`,
-        children: [relatedCollections.length === 1 && _jsxs(Fragment, {
-          children: [_jsx(DocumentDrawerToggler, {
-            className: [`${baseClass}__add-button`, unstyled && `${baseClass}__add-button--unstyled`].filter(Boolean).join(" "),
-            onClick: () => {
-              setShowTooltip(false);
-            },
-            onMouseEnter: () => setShowTooltip(true),
-            onMouseLeave: () => setShowTooltip(false),
-            children: ButtonFromProps ? ButtonFromProps : _jsxs(Fragment, {
-              children: [_jsx(Tooltip, {
-                className: `${baseClass}__tooltip`,
-                show: showTooltip,
-                children: label
-              }), _jsx(PlusIcon, {})]
-            })
-          }), _jsx(DocumentDrawer, {
-            onSave
-          })]
-        }), relatedCollections.length > 1 && _jsxs(Fragment, {
-          children: [_jsx(Popup, {
-            button: ButtonFromProps ? ButtonFromProps : _jsx(Button, {
-              buttonStyle: "none",
-              className: `${baseClass}__add-button`,
-              tooltip: popupOpen ? undefined : t("fields:addNew"),
-              children: _jsx(PlusIcon, {})
-            }),
-            buttonType: "custom",
-            horizontalAlign: "center",
-            onToggleOpen: onPopupToggle,
-            render: t18 => {
-              const {
-                close: closePopup
-              } = t18;
-              return _jsx(PopupList.ButtonGroup, {
-                children: relatedCollections.map(relatedCollection => {
-                  if (permissions.collections[relatedCollection?.slug]?.create) {
-                    return _jsx(PopupList.Button, {
-                      className: `${baseClass}__relation-button--${relatedCollection?.slug}`,
-                      onClick: () => {
-                        closePopup();
-                        setSelectedCollection(relatedCollection?.slug);
-                      },
-                      children: getTranslation(relatedCollection?.labels?.singular, i18n)
-                    }, relatedCollection?.slug);
-                  }
-                  return null;
-                })
-              });
-            },
-            size: "medium"
-          }), collectionConfig && permissions.collections[collectionConfig?.slug]?.create && _jsx(DocumentDrawer, {
-            onSave
-          })]
-        })]
-      });
-    }
-    $[29] = ButtonFromProps;
-    $[30] = DocumentDrawer;
-    $[31] = DocumentDrawerToggler;
-    $[32] = collectionConfig;
-    $[33] = i18n;
-    $[34] = onSave;
-    $[35] = path;
-    $[36] = permissions;
-    $[37] = popupOpen;
-    $[38] = relatedCollections;
-    $[39] = show;
-    $[40] = showTooltip;
-    $[41] = t;
-    $[42] = t15;
-    $[43] = unstyled;
-    $[44] = t16;
-    $[45] = t17;
-  } else {
-    t16 = $[44];
-    t17 = $[45];
-  }
-  if (t17 !== Symbol.for("react.early_return_sentinel")) {
-    return t17;
-  }
-  return t16;
+        children: [
+            relatedCollections.length === 1 && /*#__PURE__*/ _jsxDEV(Fragment, {
+                children: [
+                    /*#__PURE__*/ _jsxDEV(DocumentDrawerToggler, {
+                        className: [
+                            `${baseClass}__add-button`,
+                            unstyled && `${baseClass}__add-button--unstyled`
+                        ].filter(Boolean).join(' '),
+                        onClick: ()=>{
+                            setShowTooltip(false);
+                        },
+                        onMouseEnter: ()=>setShowTooltip(true),
+                        onMouseLeave: ()=>setShowTooltip(false),
+                        children: ButtonFromProps ? ButtonFromProps : /*#__PURE__*/ _jsxDEV(Fragment, {
+                            children: [
+                                /*#__PURE__*/ _jsxDEV(Tooltip, {
+                                    className: `${baseClass}__tooltip`,
+                                    show: showTooltip,
+                                    children: label
+                                }, void 0, false, {
+                                    fileName: "src/elements/AddNewRelation/index.tsx",
+                                    lineNumber: 164,
+                                    columnNumber: 17
+                                }, this),
+                                /*#__PURE__*/ _jsxDEV(PlusIcon, {}, void 0, false, {
+                                    fileName: "src/elements/AddNewRelation/index.tsx",
+                                    lineNumber: 167,
+                                    columnNumber: 17
+                                }, this)
+                            ]
+                        }, void 0, true, {
+                            fileName: "src/elements/AddNewRelation/index.tsx",
+                            lineNumber: 163,
+                            columnNumber: 15
+                        }, this)
+                    }, void 0, false, {
+                        fileName: "src/elements/AddNewRelation/index.tsx",
+                        lineNumber: 147,
+                        columnNumber: 11
+                    }, this),
+                    /*#__PURE__*/ _jsxDEV(DocumentDrawer, {
+                        onSave: onSave
+                    }, void 0, false, {
+                        fileName: "src/elements/AddNewRelation/index.tsx",
+                        lineNumber: 171,
+                        columnNumber: 11
+                    }, this)
+                ]
+            }, void 0, true, {
+                fileName: "src/elements/AddNewRelation/index.tsx",
+                lineNumber: 146,
+                columnNumber: 9
+            }, this),
+            relatedCollections.length > 1 && /*#__PURE__*/ _jsxDEV(Fragment, {
+                children: [
+                    /*#__PURE__*/ _jsxDEV(Popup, {
+                        button: ButtonFromProps ? ButtonFromProps : /*#__PURE__*/ _jsxDEV(Button, {
+                            buttonStyle: "none",
+                            className: `${baseClass}__add-button`,
+                            tooltip: popupOpen ? undefined : t('fields:addNew'),
+                            children: /*#__PURE__*/ _jsxDEV(PlusIcon, {}, void 0, false, {
+                                fileName: "src/elements/AddNewRelation/index.tsx",
+                                lineNumber: 186,
+                                columnNumber: 19
+                            }, void 0)
+                        }, void 0, false, {
+                            fileName: "src/elements/AddNewRelation/index.tsx",
+                            lineNumber: 181,
+                            columnNumber: 17
+                        }, void 0),
+                        buttonType: "custom",
+                        horizontalAlign: "center",
+                        onToggleOpen: onPopupToggle,
+                        render: ({ close: closePopup })=>/*#__PURE__*/ _jsxDEV(PopupList.ButtonGroup, {
+                                children: relatedCollections.map((relatedCollection)=>{
+                                    if (permissions.collections[relatedCollection?.slug]?.create) {
+                                        return /*#__PURE__*/ _jsxDEV(PopupList.Button, {
+                                            className: `${baseClass}__relation-button--${relatedCollection?.slug}`,
+                                            onClick: ()=>{
+                                                closePopup();
+                                                setSelectedCollection(relatedCollection?.slug);
+                                            },
+                                            children: getTranslation(relatedCollection?.labels?.singular, i18n)
+                                        }, relatedCollection?.slug, false, {
+                                            fileName: "src/elements/AddNewRelation/index.tsx",
+                                            lineNumber: 198,
+                                            columnNumber: 23
+                                        }, void 0);
+                                    }
+                                    return null;
+                                })
+                            }, void 0, false, {
+                                fileName: "src/elements/AddNewRelation/index.tsx",
+                                lineNumber: 194,
+                                columnNumber: 15
+                            }, void 0),
+                        size: "medium"
+                    }, void 0, false, {
+                        fileName: "src/elements/AddNewRelation/index.tsx",
+                        lineNumber: 176,
+                        columnNumber: 11
+                    }, this),
+                    collectionConfig && permissions.collections[collectionConfig?.slug]?.create && /*#__PURE__*/ _jsxDEV(DocumentDrawer, {
+                        onSave: onSave
+                    }, void 0, false, {
+                        fileName: "src/elements/AddNewRelation/index.tsx",
+                        lineNumber: 218,
+                        columnNumber: 13
+                    }, this)
+                ]
+            }, void 0, true, {
+                fileName: "src/elements/AddNewRelation/index.tsx",
+                lineNumber: 175,
+                columnNumber: 9
+            }, this)
+        ]
+    }, void 0, true, {
+        fileName: "src/elements/AddNewRelation/index.tsx",
+        lineNumber: 144,
+        columnNumber: 5
+    }, this);
 };
+
 //# sourceMappingURL=index.js.map

package/dist/elements/AddNewRelation/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["c","_c","getTranslation","hasAutosaveEnabled","React","Fragment","useCallback","useEffect","useState","useRelatedCollections","PlusIcon","useAuth","useTranslation","Button","useDocumentDrawer","Popup","PopupList","Tooltip","baseClass","AddNewRelation","t0","$","ButtonFromProps","hasMany","onChange","path","relationTo","unstyled","value","relatedCollections","permissions","show","setShow","selectedCollection","setSelectedCollection","relatedToMany","length","t1","undefined","collectionConfig","setCollectionConfig","popupOpen","setPopupOpen","i18n","t","showTooltip","setShowTooltip","t2","slug","t3","collectionSlug","DocumentDrawer","DocumentDrawerToggler","t4","isDrawerOpen","toggleDrawer","t5","t6","doc","operation","isNewValue","some","v","id","Array","isArray","onSave","Symbol","for","state","onPopupToggle","t7","t8","collections","create","collection","t10","t9","find","collection_0","t11","t12","t13","t14","t15","labels","singular","t16","t17","bb0","label","_jsxs","className","children","_jsx","filter","Boolean","join","onClick","onMouseEnter","onMouseLeave","button","buttonStyle","tooltip","horizontalAlign","onToggleOpen","render","t18","close","closePopup","ButtonGroup","map","relatedCollection"],"sources":["../../../src/elements/AddNewRelation/index.tsx"],"sourcesContent":["'use client'\nimport type { ClientCollectionConfig } from 'payload'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport { hasAutosaveEnabled } from 'payload/shared'\nimport React, { Fragment, useCallback, useEffect, useState } from 'react'\n\nimport type { DocumentDrawerContextType } from '../DocumentDrawer/Provider.js'\nimport type { Props } from './types.js'\n\nimport { useRelatedCollections } from '../../hooks/useRelatedCollections.js'\nimport { PlusIcon } from '../../icons/Plus/index.js'\nimport { useAuth } from '../../providers/Auth/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { Button } from '../Button/index.js'\nimport { useDocumentDrawer } from '../DocumentDrawer/index.js'\nimport { Popup } from '../Popup/index.js'\nimport * as PopupList from '../Popup/PopupButtonList/index.js'\nimport './index.scss'\nimport { Tooltip } from '../Tooltip/index.js'\n\nconst baseClass = 'relationship-add-new'\n\nexport const AddNewRelation: React.FC<Props> = ({\n  Button: ButtonFromProps,\n  hasMany,\n  onChange,\n  path,\n  relationTo,\n  unstyled,\n  value,\n}) => {\n  const relatedCollections = useRelatedCollections(relationTo)\n  const { permissions } = useAuth()\n  const [show, setShow] = useState(false)\n  const [selectedCollection, setSelectedCollection] = useState<string>()\n\n  const relatedToMany = relatedCollections.length > 1\n\n  const [collectionConfig, setCollectionConfig] = useState<ClientCollectionConfig>(() =>\n    !relatedToMany ? relatedCollections[0] : undefined,\n  )\n\n  const [popupOpen, setPopupOpen] = useState(false)\n  const { i18n, t } = useTranslation()\n  const [showTooltip, setShowTooltip] = useState(false)\n\n  const [DocumentDrawer, DocumentDrawerToggler, { isDrawerOpen, toggleDrawer }] = useDocumentDrawer(\n    {\n      collectionSlug: collectionConfig?.slug,\n    },\n  )\n\n  const onSave: DocumentDrawerContextType['onSave'] = useCallback(\n    ({ doc, operation }) => {\n      // if autosave is enabled, the operation will be 'update'\n      if (\n        operation === 'create' ||\n        (operation === 'update' && hasAutosaveEnabled(collectionConfig))\n      ) {\n        // ensure the value is not already in the array\n        let isNewValue = false\n        if (!value) {\n          isNewValue = true\n        } else {\n          isNewValue = Array.isArray(value)\n            ? !value.some((v) => v && v.value === doc.id)\n            : value.value !== doc.id\n        }\n\n        if (isNewValue) {\n          if (hasMany === true) {\n            onChange([\n              ...(Array.isArray(value) ? value : []),\n              {\n                relationTo: collectionConfig?.slug,\n                value: doc.id,\n              },\n            ])\n          } else {\n            onChange({\n              relationTo: collectionConfig?.slug,\n              value: doc.id,\n            })\n          }\n        }\n\n        setSelectedCollection(undefined)\n      }\n    },\n    [collectionConfig, hasMany, onChange, value],\n  )\n\n  const onPopupToggle = useCallback((state) => {\n    setPopupOpen(state)\n  }, [])\n\n  useEffect(() => {\n    if (permissions) {\n      if (relatedCollections.length === 1) {\n        setShow(permissions.collections[relatedCollections[0]?.slug]?.create)\n      } else {\n        setShow(\n          relatedCollections.some(\n            (collection) => permissions.collections[collection?.slug]?.create,\n          ),\n        )\n      }\n    }\n  }, [permissions, relatedCollections])\n\n  useEffect(() => {\n    if (relatedToMany && selectedCollection) {\n      setCollectionConfig(\n        relatedCollections.find((collection) => collection?.slug === selectedCollection),\n      )\n    }\n  }, [selectedCollection, relatedToMany, relatedCollections])\n\n  useEffect(() => {\n    if (relatedToMany && collectionConfig) {\n      // the drawer must be rendered on the page before before opening it\n      // this is why 'selectedCollection' is different from 'collectionConfig'\n      toggleDrawer()\n      setSelectedCollection(undefined)\n    }\n  }, [toggleDrawer, relatedToMany, collectionConfig])\n\n  useEffect(() => {\n    if (relatedToMany && !isDrawerOpen) {\n      setCollectionConfig(undefined)\n    }\n  }, [isDrawerOpen, relatedToMany])\n\n  const label = t('fields:addNewLabel', {\n    label: getTranslation(relatedCollections[0]?.labels.singular, i18n),\n  })\n\n  if (!show) {\n    return null\n  }\n\n  return (\n    <div className={baseClass} id={`${path}-add-new`}>\n      {relatedCollections.length === 1 && (\n        <Fragment>\n          <DocumentDrawerToggler\n            className={[\n              `${baseClass}__add-button`,\n              unstyled && `${baseClass}__add-button--unstyled`,\n            ]\n              .filter(Boolean)\n              .join(' ')}\n            onClick={() => {\n              setShowTooltip(false)\n            }}\n            onMouseEnter={() => setShowTooltip(true)}\n            onMouseLeave={() => setShowTooltip(false)}\n          >\n            {ButtonFromProps ? (\n              ButtonFromProps\n            ) : (\n              <Fragment>\n                <Tooltip className={`${baseClass}__tooltip`} show={showTooltip}>\n                  {label}\n                </Tooltip>\n                <PlusIcon />\n              </Fragment>\n            )}\n          </DocumentDrawerToggler>\n          <DocumentDrawer onSave={onSave} />\n        </Fragment>\n      )}\n      {relatedCollections.length > 1 && (\n        <Fragment>\n          <Popup\n            button={\n              ButtonFromProps ? (\n                ButtonFromProps\n              ) : (\n                <Button\n                  buttonStyle=\"none\"\n                  className={`${baseClass}__add-button`}\n                  tooltip={popupOpen ? undefined : t('fields:addNew')}\n                >\n                  <PlusIcon />\n                </Button>\n              )\n            }\n            buttonType=\"custom\"\n            horizontalAlign=\"center\"\n            onToggleOpen={onPopupToggle}\n            render={({ close: closePopup }) => (\n              <PopupList.ButtonGroup>\n                {relatedCollections.map((relatedCollection) => {\n                  if (permissions.collections[relatedCollection?.slug]?.create) {\n                    return (\n                      <PopupList.Button\n                        className={`${baseClass}__relation-button--${relatedCollection?.slug}`}\n                        key={relatedCollection?.slug}\n                        onClick={() => {\n                          closePopup()\n                          setSelectedCollection(relatedCollection?.slug)\n                        }}\n                      >\n                        {getTranslation(relatedCollection?.labels?.singular, i18n)}\n                      </PopupList.Button>\n                    )\n                  }\n\n                  return null\n                })}\n              </PopupList.ButtonGroup>\n            )}\n            size=\"medium\"\n          />\n          {collectionConfig && permissions.collections[collectionConfig?.slug]?.create && (\n            <DocumentDrawer onSave={onSave} />\n          )}\n        </Fragment>\n      )}\n    </div>\n  )\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"sources":["../../../src/elements/AddNewRelation/index.tsx"],"sourcesContent":["'use client'\nimport type { ClientCollectionConfig } from 'payload'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport { hasAutosaveEnabled } from 'payload/shared'\nimport React, { Fragment, useCallback, useEffect, useState } from 'react'\n\nimport type { DocumentDrawerContextType } from '../DocumentDrawer/Provider.js'\nimport type { Props } from './types.js'\n\nimport { useRelatedCollections } from '../../hooks/useRelatedCollections.js'\nimport { PlusIcon } from '../../icons/Plus/index.js'\nimport { useAuth } from '../../providers/Auth/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { Button } from '../Button/index.js'\nimport { useDocumentDrawer } from '../DocumentDrawer/index.js'\nimport { Popup } from '../Popup/index.js'\nimport * as PopupList from '../Popup/PopupButtonList/index.js'\nimport './index.scss'\nimport { Tooltip } from '../Tooltip/index.js'\n\nconst baseClass = 'relationship-add-new'\n\nexport const AddNewRelation: React.FC<Props> = ({\n  Button: ButtonFromProps,\n  hasMany,\n  onChange,\n  path,\n  relationTo,\n  unstyled,\n  value,\n}) => {\n  const relatedCollections = useRelatedCollections(relationTo)\n  const { permissions } = useAuth()\n  const [show, setShow] = useState(false)\n  const [selectedCollection, setSelectedCollection] = useState<string>()\n\n  const relatedToMany = relatedCollections.length > 1\n\n  const [collectionConfig, setCollectionConfig] = useState<ClientCollectionConfig>(() =>\n    !relatedToMany ? relatedCollections[0] : undefined,\n  )\n\n  const [popupOpen, setPopupOpen] = useState(false)\n  const { i18n, t } = useTranslation()\n  const [showTooltip, setShowTooltip] = useState(false)\n\n  const [DocumentDrawer, DocumentDrawerToggler, { isDrawerOpen, toggleDrawer }] = useDocumentDrawer(\n    {\n      collectionSlug: collectionConfig?.slug,\n    },\n  )\n\n  const onSave: DocumentDrawerContextType['onSave'] = useCallback(\n    ({ doc, operation }) => {\n      // if autosave is enabled, the operation will be 'update'\n      if (\n        operation === 'create' ||\n        (operation === 'update' && hasAutosaveEnabled(collectionConfig))\n      ) {\n        // ensure the value is not already in the array\n        let isNewValue = false\n        if (!value) {\n          isNewValue = true\n        } else {\n          isNewValue = Array.isArray(value)\n            ? !value.some((v) => v && v.value === doc.id)\n            : value.value !== doc.id\n        }\n\n        if (isNewValue) {\n          if (hasMany === true) {\n            onChange([\n              ...(Array.isArray(value) ? value : []),\n              {\n                relationTo: collectionConfig?.slug,\n                value: doc.id,\n              },\n            ])\n          } else {\n            onChange({\n              relationTo: collectionConfig?.slug,\n              value: doc.id,\n            })\n          }\n        }\n\n        setSelectedCollection(undefined)\n      }\n    },\n    [collectionConfig, hasMany, onChange, value],\n  )\n\n  const onPopupToggle = useCallback((state) => {\n    setPopupOpen(state)\n  }, [])\n\n  useEffect(() => {\n    if (permissions) {\n      if (relatedCollections.length === 1) {\n        setShow(permissions.collections[relatedCollections[0]?.slug]?.create)\n      } else {\n        setShow(\n          relatedCollections.some(\n            (collection) => permissions.collections[collection?.slug]?.create,\n          ),\n        )\n      }\n    }\n  }, [permissions, relatedCollections])\n\n  useEffect(() => {\n    if (relatedToMany && selectedCollection) {\n      setCollectionConfig(\n        relatedCollections.find((collection) => collection?.slug === selectedCollection),\n      )\n    }\n  }, [selectedCollection, relatedToMany, relatedCollections])\n\n  useEffect(() => {\n    if (relatedToMany && collectionConfig) {\n      // the drawer must be rendered on the page before before opening it\n      // this is why 'selectedCollection' is different from 'collectionConfig'\n      toggleDrawer()\n      setSelectedCollection(undefined)\n    }\n  }, [toggleDrawer, relatedToMany, collectionConfig])\n\n  useEffect(() => {\n    if (relatedToMany && !isDrawerOpen) {\n      setCollectionConfig(undefined)\n    }\n  }, [isDrawerOpen, relatedToMany])\n\n  const label = t('fields:addNewLabel', {\n    label: getTranslation(relatedCollections[0]?.labels.singular, i18n),\n  })\n\n  if (!show) {\n    return null\n  }\n\n  return (\n    <div className={baseClass} id={`${path}-add-new`}>\n      {relatedCollections.length === 1 && (\n        <Fragment>\n          <DocumentDrawerToggler\n            className={[\n              `${baseClass}__add-button`,\n              unstyled && `${baseClass}__add-button--unstyled`,\n            ]\n              .filter(Boolean)\n              .join(' ')}\n            onClick={() => {\n              setShowTooltip(false)\n            }}\n            onMouseEnter={() => setShowTooltip(true)}\n            onMouseLeave={() => setShowTooltip(false)}\n          >\n            {ButtonFromProps ? (\n              ButtonFromProps\n            ) : (\n              <Fragment>\n                <Tooltip className={`${baseClass}__tooltip`} show={showTooltip}>\n                  {label}\n                </Tooltip>\n                <PlusIcon />\n              </Fragment>\n            )}\n          </DocumentDrawerToggler>\n          <DocumentDrawer onSave={onSave} />\n        </Fragment>\n      )}\n      {relatedCollections.length > 1 && (\n        <Fragment>\n          <Popup\n            button={\n              ButtonFromProps ? (\n                ButtonFromProps\n              ) : (\n                <Button\n                  buttonStyle=\"none\"\n                  className={`${baseClass}__add-button`}\n                  tooltip={popupOpen ? undefined : t('fields:addNew')}\n                >\n                  <PlusIcon />\n                </Button>\n              )\n            }\n            buttonType=\"custom\"\n            horizontalAlign=\"center\"\n            onToggleOpen={onPopupToggle}\n            render={({ close: closePopup }) => (\n              <PopupList.ButtonGroup>\n                {relatedCollections.map((relatedCollection) => {\n                  if (permissions.collections[relatedCollection?.slug]?.create) {\n                    return (\n                      <PopupList.Button\n                        className={`${baseClass}__relation-button--${relatedCollection?.slug}`}\n                        key={relatedCollection?.slug}\n                        onClick={() => {\n                          closePopup()\n                          setSelectedCollection(relatedCollection?.slug)\n                        }}\n                      >\n                        {getTranslation(relatedCollection?.labels?.singular, i18n)}\n                      </PopupList.Button>\n                    )\n                  }\n\n                  return null\n                })}\n              </PopupList.ButtonGroup>\n            )}\n            size=\"medium\"\n          />\n          {collectionConfig && permissions.collections[collectionConfig?.slug]?.create && (\n            <DocumentDrawer onSave={onSave} />\n          )}\n        </Fragment>\n      )}\n    </div>\n  )\n}\n"],"names":["getTranslation","hasAutosaveEnabled","React","Fragment","useCallback","useEffect","useState","useRelatedCollections","PlusIcon","useAuth","useTranslation","Button","useDocumentDrawer","Popup","PopupList","Tooltip","baseClass","AddNewRelation","ButtonFromProps","hasMany","onChange","path","relationTo","unstyled","value","relatedCollections","permissions","show","setShow","selectedCollection","setSelectedCollection","relatedToMany","length","collectionConfig","setCollectionConfig","undefined","popupOpen","setPopupOpen","i18n","t","showTooltip","setShowTooltip","DocumentDrawer","DocumentDrawerToggler","isDrawerOpen","toggleDrawer","collectionSlug","slug","onSave","doc","operation","isNewValue","Array","isArray","some","v","id","onPopupToggle","state","collections","create","collection","find","label","labels","singular","div","className","filter","Boolean","join","onClick","onMouseEnter","onMouseLeave","button","buttonStyle","tooltip","buttonType","horizontalAlign","onToggleOpen","render","close","closePopup","ButtonGroup","map","relatedCollection","size"],"mappings":"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"}

package/dist/elements/AddNewRelation/types.js

@@ -1,2 +1,3 @@
-export {};
+export { };
+
 //# sourceMappingURL=types.js.map

package/dist/elements/AddNewRelation/types.js.map

@@ -1 +1 @@
-{"version":3,"file":"types.js","names":[],"sources":["../../../src/elements/AddNewRelation/types.ts"],"sourcesContent":["import type { ValueWithRelation } from 'payload'\n\nexport type Props = {\n  readonly Button?: React.ReactNode\n  readonly path: string\n  readonly relationTo: string | string[]\n  readonly unstyled?: boolean\n} & SharedRelationshipInputProps\n\ntype SharedRelationshipInputProps =\n  | {\n      readonly hasMany: false\n      readonly onChange: (value: ValueWithRelation, modifyForm?: boolean) => void\n      readonly value?: null | ValueWithRelation\n    }\n  | {\n      readonly hasMany: true\n      readonly onChange: (value: ValueWithRelation[]) => void\n      readonly value?: null | ValueWithRelation[]\n    }\n"],"mappings":"AAEA","ignoreList":[]}
+{"version":3,"sources":["../../../src/elements/AddNewRelation/types.ts"],"sourcesContent":["import type { ValueWithRelation } from 'payload'\n\nexport type Props = {\n  readonly Button?: React.ReactNode\n  readonly path: string\n  readonly relationTo: string | string[]\n  readonly unstyled?: boolean\n} & SharedRelationshipInputProps\n\ntype SharedRelationshipInputProps =\n  | {\n      readonly hasMany: false\n      readonly onChange: (value: ValueWithRelation, modifyForm?: boolean) => void\n      readonly value?: null | ValueWithRelation\n    }\n  | {\n      readonly hasMany: true\n      readonly onChange: (value: ValueWithRelation[]) => void\n      readonly value?: null | ValueWithRelation[]\n    }\n"],"names":[],"mappings":"AAEA,WAKgC"}