@payloadcms/ui 3.0.0-beta.34 → 3.0.0-beta.36

package/dist/elements/DraggableSortable/index.js

@@ -1,3 +1,4 @@
+import { jsx as _jsx } from "react/jsx-runtime";
 import { DndContext, KeyboardSensor, PointerSensor, closestCenter, useDroppable, useSensor, useSensors } from '@dnd-kit/core';
 import { SortableContext, sortableKeyboardCoordinates } from '@dnd-kit/sortable';
 import React, { useCallback, useId } from 'react';
@@ -28,17 +29,20 @@ export const DraggableSortable = (props)=>{
         onDragEnd,
         ids
     ]);
-    return /*#__PURE__*/ React.createElement(DndContext, {
+    return /*#__PURE__*/ _jsx(DndContext, {
         collisionDetection: closestCenter,
         id: id,
         onDragEnd: handleDragEnd,
-        sensors: sensors
-    }, /*#__PURE__*/ React.createElement(SortableContext, {
-        items: ids
-    }, /*#__PURE__*/ React.createElement("div", {
-        className: className,
-        ref: setNodeRef
-    }, children)));
+        sensors: sensors,
+        children: /*#__PURE__*/ _jsx(SortableContext, {
+            items: ids,
+            children: /*#__PURE__*/ _jsx("div", {
+                className: className,
+                ref: setNodeRef,
+                children: children
+            })
+        })
+    });
 };
 
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/DraggableSortable/index.tsx"],"sourcesContent":["import type { DragEndEvent } from '@dnd-kit/core'\n\nimport {\n  DndContext,\n  KeyboardSensor,\n  PointerSensor,\n  closestCenter,\n  useDroppable,\n  useSensor,\n  useSensors,\n} from '@dnd-kit/core'\nimport { SortableContext, sortableKeyboardCoordinates } from '@dnd-kit/sortable'\nimport React, { useCallback, useId } from 'react'\n\nimport type { Props } from './types.js'\n\nexport { Props }\n\nexport const DraggableSortable: React.FC<Props> = (props) => {\n  const { children, className, ids, onDragEnd } = props\n\n  const id = useId()\n\n  const { setNodeRef } = useDroppable({\n    id,\n  })\n\n  const sensors = useSensors(\n    useSensor(PointerSensor, {\n      activationConstraint: {\n        distance: 5,\n      },\n    }),\n    useSensor(KeyboardSensor, {\n      coordinateGetter: sortableKeyboardCoordinates,\n    }),\n  )\n\n  const handleDragEnd = useCallback(\n    (event: DragEndEvent) => {\n      const { active, over } = event\n\n      if (!active || !over) return\n\n      if (typeof onDragEnd === 'function') {\n        onDragEnd({\n          event,\n          moveFromIndex: ids.findIndex((_id) => _id === active.id),\n          moveToIndex: ids.findIndex((_id) => _id === over.id),\n        })\n      }\n    },\n    [onDragEnd, ids],\n  )\n\n  return (\n    <DndContext\n      collisionDetection={closestCenter}\n      id={id}\n      onDragEnd={handleDragEnd}\n      sensors={sensors}\n    >\n      <SortableContext items={ids}>\n        <div className={className} ref={setNodeRef}>\n          {children}\n        </div>\n      </SortableContext>\n    </DndContext>\n  )\n}\n"],"names":["DndContext","KeyboardSensor","PointerSensor","closestCenter","useDroppable","useSensor","useSensors","SortableContext","sortableKeyboardCoordinates","React","useCallback","useId","DraggableSortable","props","children","className","ids","onDragEnd","id","setNodeRef","sensors","activationConstraint","distance","coordinateGetter","handleDragEnd","event","active","over","moveFromIndex","findIndex","_id","moveToIndex","collisionDetection","items","div","ref"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAEA,SACEA,UAAU,EACVC,cAAc,EACdC,aAAa,EACbC,aAAa,EACbC,YAAY,EACZC,SAAS,EACTC,UAAU,QACL,gBAAe;AACtB,SAASC,eAAe,EAAEC,2BAA2B,QAAQ,oBAAmB;AAChF,OAAOC,SAASC,WAAW,EAAEC,KAAK,QAAQ,QAAO;AAMjD,OAAO,MAAMC,oBAAqC,CAACC;IACjD,MAAM,EAAEC,QAAQ,EAAEC,SAAS,EAAEC,GAAG,EAAEC,SAAS,EAAE,GAAGJ;IAEhD,MAAMK,KAAKP;IAEX,MAAM,EAAEQ,UAAU,EAAE,GAAGf,aAAa;QAClCc;IACF;IAEA,MAAME,UAAUd,WACdD,UAAUH,eAAe;QACvBmB,sBAAsB;YACpBC,UAAU;QACZ;IACF,IACAjB,UAAUJ,gBAAgB;QACxBsB,kBAAkBf;IACpB;IAGF,MAAMgB,gBAAgBd,YACpB,CAACe;QACC,MAAM,EAAEC,MAAM,EAAEC,IAAI,EAAE,GAAGF;QAEzB,IAAI,CAACC,UAAU,CAACC,MAAM;QAEtB,IAAI,OAAOV,cAAc,YAAY;YACnCA,UAAU;gBACRQ;gBACAG,eAAeZ,IAAIa,SAAS,CAAC,CAACC,MAAQA,QAAQJ,OAAOR,EAAE;gBACvDa,aAAaf,IAAIa,SAAS,CAAC,CAACC,MAAQA,QAAQH,KAAKT,EAAE;YACrD;QACF;IACF,GACA;QAACD;QAAWD;KAAI;IAGlB,qBACE,oBAAChB;QACCgC,oBAAoB7B;QACpBe,IAAIA;QACJD,WAAWO;QACXJ,SAASA;qBAET,oBAACb;QAAgB0B,OAAOjB;qBACtB,oBAACkB;QAAInB,WAAWA;QAAWoB,KAAKhB;OAC7BL;AAKX,EAAC"}
+{"version":3,"sources":["../../../src/elements/DraggableSortable/index.tsx"],"sourcesContent":["import type { DragEndEvent } from '@dnd-kit/core'\n\nimport {\n  DndContext,\n  KeyboardSensor,\n  PointerSensor,\n  closestCenter,\n  useDroppable,\n  useSensor,\n  useSensors,\n} from '@dnd-kit/core'\nimport { SortableContext, sortableKeyboardCoordinates } from '@dnd-kit/sortable'\nimport React, { useCallback, useId } from 'react'\n\nimport type { Props } from './types.js'\n\nexport { Props }\n\nexport const DraggableSortable: React.FC<Props> = (props) => {\n  const { children, className, ids, onDragEnd } = props\n\n  const id = useId()\n\n  const { setNodeRef } = useDroppable({\n    id,\n  })\n\n  const sensors = useSensors(\n    useSensor(PointerSensor, {\n      activationConstraint: {\n        distance: 5,\n      },\n    }),\n    useSensor(KeyboardSensor, {\n      coordinateGetter: sortableKeyboardCoordinates,\n    }),\n  )\n\n  const handleDragEnd = useCallback(\n    (event: DragEndEvent) => {\n      const { active, over } = event\n\n      if (!active || !over) return\n\n      if (typeof onDragEnd === 'function') {\n        onDragEnd({\n          event,\n          moveFromIndex: ids.findIndex((_id) => _id === active.id),\n          moveToIndex: ids.findIndex((_id) => _id === over.id),\n        })\n      }\n    },\n    [onDragEnd, ids],\n  )\n\n  return (\n    <DndContext\n      collisionDetection={closestCenter}\n      id={id}\n      onDragEnd={handleDragEnd}\n      sensors={sensors}\n    >\n      <SortableContext items={ids}>\n        <div className={className} ref={setNodeRef}>\n          {children}\n        </div>\n      </SortableContext>\n    </DndContext>\n  )\n}\n"],"names":["DndContext","KeyboardSensor","PointerSensor","closestCenter","useDroppable","useSensor","useSensors","SortableContext","sortableKeyboardCoordinates","React","useCallback","useId","DraggableSortable","props","children","className","ids","onDragEnd","id","setNodeRef","sensors","activationConstraint","distance","coordinateGetter","handleDragEnd","event","active","over","moveFromIndex","findIndex","_id","moveToIndex","collisionDetection","items","div","ref"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";AAEA,SACEA,UAAU,EACVC,cAAc,EACdC,aAAa,EACbC,aAAa,EACbC,YAAY,EACZC,SAAS,EACTC,UAAU,QACL,gBAAe;AACtB,SAASC,eAAe,EAAEC,2BAA2B,QAAQ,oBAAmB;AAChF,OAAOC,SAASC,WAAW,EAAEC,KAAK,QAAQ,QAAO;AAMjD,OAAO,MAAMC,oBAAqC,CAACC;IACjD,MAAM,EAAEC,QAAQ,EAAEC,SAAS,EAAEC,GAAG,EAAEC,SAAS,EAAE,GAAGJ;IAEhD,MAAMK,KAAKP;IAEX,MAAM,EAAEQ,UAAU,EAAE,GAAGf,aAAa;QAClCc;IACF;IAEA,MAAME,UAAUd,WACdD,UAAUH,eAAe;QACvBmB,sBAAsB;YACpBC,UAAU;QACZ;IACF,IACAjB,UAAUJ,gBAAgB;QACxBsB,kBAAkBf;IACpB;IAGF,MAAMgB,gBAAgBd,YACpB,CAACe;QACC,MAAM,EAAEC,MAAM,EAAEC,IAAI,EAAE,GAAGF;QAEzB,IAAI,CAACC,UAAU,CAACC,MAAM;QAEtB,IAAI,OAAOV,cAAc,YAAY;YACnCA,UAAU;gBACRQ;gBACAG,eAAeZ,IAAIa,SAAS,CAAC,CAACC,MAAQA,QAAQJ,OAAOR,EAAE;gBACvDa,aAAaf,IAAIa,SAAS,CAAC,CAACC,MAAQA,QAAQH,KAAKT,EAAE;YACrD;QACF;IACF,GACA;QAACD;QAAWD;KAAI;IAGlB,qBACE,KAAChB;QACCgC,oBAAoB7B;QACpBe,IAAIA;QACJD,WAAWO;QACXJ,SAASA;kBAET,cAAA,KAACb;YAAgB0B,OAAOjB;sBACtB,cAAA,KAACkB;gBAAInB,WAAWA;gBAAWoB,KAAKhB;0BAC7BL;;;;AAKX,EAAC"}

package/dist/elements/Drawer/index.js

@@ -1,4 +1,5 @@
 'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as facelessUIImport from '@faceless-ui/modal';
 import React, { useCallback, useEffect, useState } from 'react';
 import { X } from '../../icons/X/index.js';
@@ -20,13 +21,14 @@ export const DrawerToggler = ({ slug, children, className, disabled, onClick, ..
         slug,
         onClick
     ]);
-    return /*#__PURE__*/ React.createElement("button", {
+    return /*#__PURE__*/ _jsx("button", {
         className: className,
         disabled: disabled,
         onClick: handleClick,
         type: "button",
-        ...rest
-    }, children);
+        ...rest,
+        children: children
+    });
 };
 export const Drawer = ({ slug, Header, children, className, gutter = true, hoverTitle, title })=>{
     const { Modal, useModal } = facelessUIImport;
@@ -48,7 +50,7 @@ export const Drawer = ({ slug, Header, children, className, gutter = true, hover
     ]);
     if (isOpen) {
         // IMPORTANT: do not render the drawer until it is explicitly open, this is to avoid large html trees especially when nesting drawers
-        return /*#__PURE__*/ React.createElement(Modal, {
+        return /*#__PURE__*/ _jsxs(Modal, {
             className: [
                 className,
                 baseClass,
@@ -58,37 +60,58 @@ export const Drawer = ({ slug, Header, children, className, gutter = true, hover
             slug: slug,
             style: {
                 zIndex: zBase + drawerDepth
-            }
-        }, (!drawerDepth || drawerDepth === 1) && /*#__PURE__*/ React.createElement("div", {
-            className: `${baseClass}__blur-bg`
-        }), /*#__PURE__*/ React.createElement("button", {
-            "aria-label": t('general:close'),
-            className: `${baseClass}__close`,
-            id: `close-drawer__${slug}`,
-            onClick: ()=>closeModal(slug),
-            type: "button"
-        }), /*#__PURE__*/ React.createElement("div", {
-            className: `${baseClass}__content`
-        }, /*#__PURE__*/ React.createElement("div", {
-            className: `${baseClass}__blur-bg-content`
-        }), /*#__PURE__*/ React.createElement(Gutter, {
-            className: `${baseClass}__content-children`,
-            left: gutter,
-            right: gutter
-        }, /*#__PURE__*/ React.createElement(EditDepthContext.Provider, {
-            value: drawerDepth + 1
-        }, Header, Header === undefined && /*#__PURE__*/ React.createElement("div", {
-            className: `${baseClass}__header`
-        }, /*#__PURE__*/ React.createElement("h2", {
-            className: `${baseClass}__header__title`,
-            title: hoverTitle ? title : null
-        }, title), /*#__PURE__*/ React.createElement("button", {
-            "aria-label": t('general:close'),
-            className: `${baseClass}__header__close`,
-            id: `close-drawer__${slug}`,
-            onClick: ()=>closeModal(slug),
-            type: "button"
-        }, /*#__PURE__*/ React.createElement(X, null))), children))));
+            },
+            children: [
+                (!drawerDepth || drawerDepth === 1) && /*#__PURE__*/ _jsx("div", {
+                    className: `${baseClass}__blur-bg`
+                }),
+                /*#__PURE__*/ _jsx("button", {
+                    "aria-label": t('general:close'),
+                    className: `${baseClass}__close`,
+                    id: `close-drawer__${slug}`,
+                    onClick: ()=>closeModal(slug),
+                    type: "button"
+                }),
+                /*#__PURE__*/ _jsxs("div", {
+                    className: `${baseClass}__content`,
+                    children: [
+                        /*#__PURE__*/ _jsx("div", {
+                            className: `${baseClass}__blur-bg-content`
+                        }),
+                        /*#__PURE__*/ _jsx(Gutter, {
+                            className: `${baseClass}__content-children`,
+                            left: gutter,
+                            right: gutter,
+                            children: /*#__PURE__*/ _jsxs(EditDepthContext.Provider, {
+                                value: drawerDepth + 1,
+                                children: [
+                                    Header,
+                                    Header === undefined && /*#__PURE__*/ _jsxs("div", {
+                                        className: `${baseClass}__header`,
+                                        children: [
+                                            /*#__PURE__*/ _jsx("h2", {
+                                                className: `${baseClass}__header__title`,
+                                                title: hoverTitle ? title : null,
+                                                children: title
+                                            }),
+                                            /*#__PURE__*/ _jsx("button", {
+                                                "aria-label": t('general:close'),
+                                                className: `${baseClass}__header__close`,
+                                                id: `close-drawer__${slug}`,
+                                                onClick: ()=>closeModal(slug),
+                                                type: "button",
+                                                children: /*#__PURE__*/ _jsx(X, {})
+                                            })
+                                        ]
+                                    }),
+                                    children
+                                ]
+                            })
+                        })
+                    ]
+                })
+            ]
+        });
     }
     return null;
 };

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/Drawer/index.tsx"],"sourcesContent":["'use client'\nimport * as facelessUIImport from '@faceless-ui/modal'\nimport React, { useCallback, useEffect, useState } from 'react'\n\nimport type { Props, TogglerProps } from './types.js'\n\nimport { X } from '../../icons/X/index.js'\nimport { EditDepthContext, useEditDepth } from '../../providers/EditDepth/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { Gutter } from '../Gutter/index.js'\nimport './index.scss'\n\nconst baseClass = 'drawer'\nconst zBase = 100\n\nexport const formatDrawerSlug = ({ slug, depth }: { depth: number; slug: string }): string =>\n  `drawer_${depth}_${slug}`\n\nexport { useDrawerSlug } from './useDrawerSlug.js'\n\nexport const DrawerToggler: React.FC<TogglerProps> = ({\n  slug,\n  children,\n  className,\n  disabled,\n  onClick,\n  ...rest\n}) => {\n  const { Modal, useModal } = facelessUIImport\n\n  const { openModal } = useModal()\n\n  const handleClick = useCallback(\n    (e) => {\n      openModal(slug)\n      if (typeof onClick === 'function') onClick(e)\n    },\n    [openModal, slug, onClick],\n  )\n\n  return (\n    <button className={className} disabled={disabled} onClick={handleClick} type=\"button\" {...rest}>\n      {children}\n    </button>\n  )\n}\n\nexport const Drawer: React.FC<Props> = ({\n  slug,\n  Header,\n  children,\n  className,\n  gutter = true,\n  hoverTitle,\n  title,\n}) => {\n  const { Modal, useModal } = facelessUIImport\n\n  const { t } = useTranslation()\n  const { closeModal, modalState } = useModal()\n  const drawerDepth = useEditDepth()\n  const [isOpen, setIsOpen] = useState(false)\n  const [animateIn, setAnimateIn] = useState(false)\n\n  useEffect(() => {\n    setIsOpen(modalState[slug]?.isOpen)\n  }, [slug, modalState])\n\n  useEffect(() => {\n    setAnimateIn(isOpen)\n  }, [isOpen])\n\n  if (isOpen) {\n    // IMPORTANT: do not render the drawer until it is explicitly open, this is to avoid large html trees especially when nesting drawers\n    return (\n      <Modal\n        className={[\n          className,\n          baseClass,\n          animateIn && `${baseClass}--is-open`,\n          drawerDepth > 1 && `${baseClass}--nested`,\n        ]\n          .filter(Boolean)\n          .join(' ')}\n        slug={slug}\n        style={{\n          zIndex: zBase + drawerDepth,\n        }}\n      >\n        {(!drawerDepth || drawerDepth === 1) && <div className={`${baseClass}__blur-bg`} />}\n        <button\n          aria-label={t('general:close')}\n          className={`${baseClass}__close`}\n          id={`close-drawer__${slug}`}\n          onClick={() => closeModal(slug)}\n          type=\"button\"\n        />\n        <div className={`${baseClass}__content`}>\n          <div className={`${baseClass}__blur-bg-content`} />\n          <Gutter className={`${baseClass}__content-children`} left={gutter} right={gutter}>\n            <EditDepthContext.Provider value={drawerDepth + 1}>\n              {Header}\n              {Header === undefined && (\n                <div className={`${baseClass}__header`}>\n                  <h2 className={`${baseClass}__header__title`} title={hoverTitle ? title : null}>\n                    {title}\n                  </h2>\n                  {/* TODO: the `button` HTML element breaks CSS transitions on the drawer for some reason...\n                    i.e. changing to a `div` element will fix the animation issue but will break accessibility\n                  */}\n                  <button\n                    aria-label={t('general:close')}\n                    className={`${baseClass}__header__close`}\n                    id={`close-drawer__${slug}`}\n                    onClick={() => closeModal(slug)}\n                    type=\"button\"\n                  >\n                    <X />\n                  </button>\n                </div>\n              )}\n              {children}\n            </EditDepthContext.Provider>\n          </Gutter>\n        </div>\n      </Modal>\n    )\n  }\n\n  return null\n}\n"],"names":["facelessUIImport","React","useCallback","useEffect","useState","X","EditDepthContext","useEditDepth","useTranslation","Gutter","baseClass","zBase","formatDrawerSlug","slug","depth","useDrawerSlug","DrawerToggler","children","className","disabled","onClick","rest","Modal","useModal","openModal","handleClick","e","button","type","Drawer","Header","gutter","hoverTitle","title","t","closeModal","modalState","drawerDepth","isOpen","setIsOpen","animateIn","setAnimateIn","filter","Boolean","join","style","zIndex","div","aria-label","id","left","right","Provider","value","undefined","h2"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
+{"version":3,"sources":["../../../src/elements/Drawer/index.tsx"],"sourcesContent":["'use client'\nimport * as facelessUIImport from '@faceless-ui/modal'\nimport React, { useCallback, useEffect, useState } from 'react'\n\nimport type { Props, TogglerProps } from './types.js'\n\nimport { X } from '../../icons/X/index.js'\nimport { EditDepthContext, useEditDepth } from '../../providers/EditDepth/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { Gutter } from '../Gutter/index.js'\nimport './index.scss'\n\nconst baseClass = 'drawer'\nconst zBase = 100\n\nexport const formatDrawerSlug = ({ slug, depth }: { depth: number; slug: string }): string =>\n  `drawer_${depth}_${slug}`\n\nexport { useDrawerSlug } from './useDrawerSlug.js'\n\nexport const DrawerToggler: React.FC<TogglerProps> = ({\n  slug,\n  children,\n  className,\n  disabled,\n  onClick,\n  ...rest\n}) => {\n  const { Modal, useModal } = facelessUIImport\n\n  const { openModal } = useModal()\n\n  const handleClick = useCallback(\n    (e) => {\n      openModal(slug)\n      if (typeof onClick === 'function') onClick(e)\n    },\n    [openModal, slug, onClick],\n  )\n\n  return (\n    <button className={className} disabled={disabled} onClick={handleClick} type=\"button\" {...rest}>\n      {children}\n    </button>\n  )\n}\n\nexport const Drawer: React.FC<Props> = ({\n  slug,\n  Header,\n  children,\n  className,\n  gutter = true,\n  hoverTitle,\n  title,\n}) => {\n  const { Modal, useModal } = facelessUIImport\n\n  const { t } = useTranslation()\n  const { closeModal, modalState } = useModal()\n  const drawerDepth = useEditDepth()\n  const [isOpen, setIsOpen] = useState(false)\n  const [animateIn, setAnimateIn] = useState(false)\n\n  useEffect(() => {\n    setIsOpen(modalState[slug]?.isOpen)\n  }, [slug, modalState])\n\n  useEffect(() => {\n    setAnimateIn(isOpen)\n  }, [isOpen])\n\n  if (isOpen) {\n    // IMPORTANT: do not render the drawer until it is explicitly open, this is to avoid large html trees especially when nesting drawers\n    return (\n      <Modal\n        className={[\n          className,\n          baseClass,\n          animateIn && `${baseClass}--is-open`,\n          drawerDepth > 1 && `${baseClass}--nested`,\n        ]\n          .filter(Boolean)\n          .join(' ')}\n        slug={slug}\n        style={{\n          zIndex: zBase + drawerDepth,\n        }}\n      >\n        {(!drawerDepth || drawerDepth === 1) && <div className={`${baseClass}__blur-bg`} />}\n        <button\n          aria-label={t('general:close')}\n          className={`${baseClass}__close`}\n          id={`close-drawer__${slug}`}\n          onClick={() => closeModal(slug)}\n          type=\"button\"\n        />\n        <div className={`${baseClass}__content`}>\n          <div className={`${baseClass}__blur-bg-content`} />\n          <Gutter className={`${baseClass}__content-children`} left={gutter} right={gutter}>\n            <EditDepthContext.Provider value={drawerDepth + 1}>\n              {Header}\n              {Header === undefined && (\n                <div className={`${baseClass}__header`}>\n                  <h2 className={`${baseClass}__header__title`} title={hoverTitle ? title : null}>\n                    {title}\n                  </h2>\n                  {/* TODO: the `button` HTML element breaks CSS transitions on the drawer for some reason...\n                    i.e. changing to a `div` element will fix the animation issue but will break accessibility\n                  */}\n                  <button\n                    aria-label={t('general:close')}\n                    className={`${baseClass}__header__close`}\n                    id={`close-drawer__${slug}`}\n                    onClick={() => closeModal(slug)}\n                    type=\"button\"\n                  >\n                    <X />\n                  </button>\n                </div>\n              )}\n              {children}\n            </EditDepthContext.Provider>\n          </Gutter>\n        </div>\n      </Modal>\n    )\n  }\n\n  return null\n}\n"],"names":["facelessUIImport","React","useCallback","useEffect","useState","X","EditDepthContext","useEditDepth","useTranslation","Gutter","baseClass","zBase","formatDrawerSlug","slug","depth","useDrawerSlug","DrawerToggler","children","className","disabled","onClick","rest","Modal","useModal","openModal","handleClick","e","button","type","Drawer","Header","gutter","hoverTitle","title","t","closeModal","modalState","drawerDepth","isOpen","setIsOpen","animateIn","setAnimateIn","filter","Boolean","join","style","zIndex","div","aria-label","id","left","right","Provider","value","undefined","h2"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}

package/dist/elements/Dropzone/index.js

@@ -1,3 +1,4 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React from 'react';
 import { useTranslation } from '../../providers/Translation/index.js';
 import { Button } from '../Button/index.js';
@@ -77,25 +78,36 @@ export const Dropzone = ({ className, mimeTypes, onChange })=>{
         className,
         dragging ? 'dragging' : ''
     ].filter(Boolean).join(' ');
-    return /*#__PURE__*/ React.createElement("div", {
+    return /*#__PURE__*/ _jsxs("div", {
         className: classes,
-        ref: dropRef
-    }, /*#__PURE__*/ React.createElement(Button, {
-        buttonStyle: "secondary",
-        className: `${baseClass}__file-button`,
-        onClick: ()=>{
-            inputRef.current.click();
-        },
-        size: "small"
-    }, t('upload:selectFile')), /*#__PURE__*/ React.createElement("input", {
-        accept: mimeTypes?.join(','),
-        className: `${baseClass}__hidden-input`,
-        onChange: handleFileSelection,
-        ref: inputRef,
-        type: "file"
-    }), /*#__PURE__*/ React.createElement("p", {
-        className: `${baseClass}__label`
-    }, t('general:or'), " ", t('upload:dragAndDrop')));
+        ref: dropRef,
+        children: [
+            /*#__PURE__*/ _jsx(Button, {
+                buttonStyle: "secondary",
+                className: `${baseClass}__file-button`,
+                onClick: ()=>{
+                    inputRef.current.click();
+                },
+                size: "small",
+                children: t('upload:selectFile')
+            }),
+            /*#__PURE__*/ _jsx("input", {
+                accept: mimeTypes?.join(','),
+                className: `${baseClass}__hidden-input`,
+                onChange: handleFileSelection,
+                ref: inputRef,
+                type: "file"
+            }),
+            /*#__PURE__*/ _jsxs("p", {
+                className: `${baseClass}__label`,
+                children: [
+                    t('general:or'),
+                    " ",
+                    t('upload:dragAndDrop')
+                ]
+            })
+        ]
+    });
 };
 
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/Dropzone/index.tsx"],"sourcesContent":["import React from 'react'\n\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { Button } from '../Button/index.js'\nimport './index.scss'\n\nconst handleDragOver = (e: DragEvent) => {\n  e.preventDefault()\n  e.stopPropagation()\n}\n\nconst baseClass = 'dropzone'\n\nexport type Props = {\n  className?: string\n  mimeTypes?: string[]\n  onChange: (e: FileList) => void\n}\n\nexport const Dropzone: React.FC<Props> = ({ className, mimeTypes, onChange }) => {\n  const dropRef = React.useRef<HTMLDivElement>(null)\n  const [dragging, setDragging] = React.useState(false)\n  const inputRef = React.useRef(null)\n\n  const { t } = useTranslation()\n\n  const handlePaste = React.useCallback(\n    (e: ClipboardEvent) => {\n      e.preventDefault()\n      e.stopPropagation()\n\n      if (e.clipboardData.files && e.clipboardData.files.length > 0) {\n        onChange(e.clipboardData.files)\n      }\n    },\n    [onChange],\n  )\n\n  const handleDragEnter = React.useCallback((e: DragEvent) => {\n    e.preventDefault()\n    e.stopPropagation()\n    setDragging(true)\n  }, [])\n\n  const handleDragLeave = React.useCallback((e: DragEvent) => {\n    e.preventDefault()\n    e.stopPropagation()\n    setDragging(false)\n  }, [])\n\n  const handleDrop = React.useCallback(\n    (e: DragEvent) => {\n      e.preventDefault()\n      e.stopPropagation()\n      setDragging(false)\n\n      if (e.dataTransfer.files && e.dataTransfer.files.length > 0) {\n        onChange(e.dataTransfer.files)\n        setDragging(false)\n\n        e.dataTransfer.clearData()\n      }\n    },\n    [onChange],\n  )\n\n  const handleFileSelection = React.useCallback(\n    (e: React.ChangeEvent<HTMLInputElement>) => {\n      if (e.target.files && e.target.files.length > 0) {\n        onChange(e.target.files)\n      }\n    },\n    [onChange],\n  )\n\n  React.useEffect(() => {\n    const div = dropRef.current\n\n    if (div) {\n      div.addEventListener('dragenter', handleDragEnter)\n      div.addEventListener('dragleave', handleDragLeave)\n      div.addEventListener('dragover', handleDragOver)\n      div.addEventListener('drop', handleDrop)\n      div.addEventListener('paste', handlePaste)\n\n      return () => {\n        div.removeEventListener('dragenter', handleDragEnter)\n        div.removeEventListener('dragleave', handleDragLeave)\n        div.removeEventListener('dragover', handleDragOver)\n        div.removeEventListener('drop', handleDrop)\n        div.removeEventListener('paste', handlePaste)\n      }\n    }\n\n    return () => null\n  }, [handleDragEnter, handleDragLeave, handleDrop, handlePaste])\n\n  const classes = [baseClass, className, dragging ? 'dragging' : ''].filter(Boolean).join(' ')\n\n  return (\n    <div className={classes} ref={dropRef}>\n      <Button\n        buttonStyle=\"secondary\"\n        className={`${baseClass}__file-button`}\n        onClick={() => {\n          inputRef.current.click()\n        }}\n        size=\"small\"\n      >\n        {t('upload:selectFile')}\n      </Button>\n\n      <input\n        accept={mimeTypes?.join(',')}\n        className={`${baseClass}__hidden-input`}\n        onChange={handleFileSelection}\n        ref={inputRef}\n        type=\"file\"\n      />\n\n      <p className={`${baseClass}__label`}>\n        {t('general:or')} {t('upload:dragAndDrop')}\n      </p>\n    </div>\n  )\n}\n"],"names":["React","useTranslation","Button","handleDragOver","e","preventDefault","stopPropagation","baseClass","Dropzone","className","mimeTypes","onChange","dropRef","useRef","dragging","setDragging","useState","inputRef","t","handlePaste","useCallback","clipboardData","files","length","handleDragEnter","handleDragLeave","handleDrop","dataTransfer","clearData","handleFileSelection","target","useEffect","div","current","addEventListener","removeEventListener","classes","filter","Boolean","join","ref","buttonStyle","onClick","click","size","input","accept","type","p"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
+{"version":3,"sources":["../../../src/elements/Dropzone/index.tsx"],"sourcesContent":["import React from 'react'\n\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { Button } from '../Button/index.js'\nimport './index.scss'\n\nconst handleDragOver = (e: DragEvent) => {\n  e.preventDefault()\n  e.stopPropagation()\n}\n\nconst baseClass = 'dropzone'\n\nexport type Props = {\n  className?: string\n  mimeTypes?: string[]\n  onChange: (e: FileList) => void\n}\n\nexport const Dropzone: React.FC<Props> = ({ className, mimeTypes, onChange }) => {\n  const dropRef = React.useRef<HTMLDivElement>(null)\n  const [dragging, setDragging] = React.useState(false)\n  const inputRef = React.useRef(null)\n\n  const { t } = useTranslation()\n\n  const handlePaste = React.useCallback(\n    (e: ClipboardEvent) => {\n      e.preventDefault()\n      e.stopPropagation()\n\n      if (e.clipboardData.files && e.clipboardData.files.length > 0) {\n        onChange(e.clipboardData.files)\n      }\n    },\n    [onChange],\n  )\n\n  const handleDragEnter = React.useCallback((e: DragEvent) => {\n    e.preventDefault()\n    e.stopPropagation()\n    setDragging(true)\n  }, [])\n\n  const handleDragLeave = React.useCallback((e: DragEvent) => {\n    e.preventDefault()\n    e.stopPropagation()\n    setDragging(false)\n  }, [])\n\n  const handleDrop = React.useCallback(\n    (e: DragEvent) => {\n      e.preventDefault()\n      e.stopPropagation()\n      setDragging(false)\n\n      if (e.dataTransfer.files && e.dataTransfer.files.length > 0) {\n        onChange(e.dataTransfer.files)\n        setDragging(false)\n\n        e.dataTransfer.clearData()\n      }\n    },\n    [onChange],\n  )\n\n  const handleFileSelection = React.useCallback(\n    (e: React.ChangeEvent<HTMLInputElement>) => {\n      if (e.target.files && e.target.files.length > 0) {\n        onChange(e.target.files)\n      }\n    },\n    [onChange],\n  )\n\n  React.useEffect(() => {\n    const div = dropRef.current\n\n    if (div) {\n      div.addEventListener('dragenter', handleDragEnter)\n      div.addEventListener('dragleave', handleDragLeave)\n      div.addEventListener('dragover', handleDragOver)\n      div.addEventListener('drop', handleDrop)\n      div.addEventListener('paste', handlePaste)\n\n      return () => {\n        div.removeEventListener('dragenter', handleDragEnter)\n        div.removeEventListener('dragleave', handleDragLeave)\n        div.removeEventListener('dragover', handleDragOver)\n        div.removeEventListener('drop', handleDrop)\n        div.removeEventListener('paste', handlePaste)\n      }\n    }\n\n    return () => null\n  }, [handleDragEnter, handleDragLeave, handleDrop, handlePaste])\n\n  const classes = [baseClass, className, dragging ? 'dragging' : ''].filter(Boolean).join(' ')\n\n  return (\n    <div className={classes} ref={dropRef}>\n      <Button\n        buttonStyle=\"secondary\"\n        className={`${baseClass}__file-button`}\n        onClick={() => {\n          inputRef.current.click()\n        }}\n        size=\"small\"\n      >\n        {t('upload:selectFile')}\n      </Button>\n\n      <input\n        accept={mimeTypes?.join(',')}\n        className={`${baseClass}__hidden-input`}\n        onChange={handleFileSelection}\n        ref={inputRef}\n        type=\"file\"\n      />\n\n      <p className={`${baseClass}__label`}>\n        {t('general:or')} {t('upload:dragAndDrop')}\n      </p>\n    </div>\n  )\n}\n"],"names":["React","useTranslation","Button","handleDragOver","e","preventDefault","stopPropagation","baseClass","Dropzone","className","mimeTypes","onChange","dropRef","useRef","dragging","setDragging","useState","inputRef","t","handlePaste","useCallback","clipboardData","files","length","handleDragEnter","handleDragLeave","handleDrop","dataTransfer","clearData","handleFileSelection","target","useEffect","div","current","addEventListener","removeEventListener","classes","filter","Boolean","join","ref","buttonStyle","onClick","click","size","input","accept","type","p"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}

package/dist/elements/DuplicateDocument/index.js

@@ -1,4 +1,5 @@
 'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as facelessUIImport from '@faceless-ui/modal';
 import { getTranslation } from '@payloadcms/translations';
 import { useRouter } from 'next/navigation.js';
@@ -78,23 +79,42 @@ export const DuplicateDocument = ({ id, slug, singularLabel })=>{
     }, [
         handleClick
     ]);
-    return /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement(PopupList.Button, {
-        id: "action-duplicate",
-        onClick: ()=>handleClick(false)
-    }, t('general:duplicate')), modified && hasClicked && /*#__PURE__*/ React.createElement(Modal, {
-        className: `${baseClass}__modal`,
-        slug: modalSlug
-    }, /*#__PURE__*/ React.createElement(MinimalTemplate, {
-        className: `${baseClass}__modal-template`
-    }, /*#__PURE__*/ React.createElement("h1", null, t('general:confirmDuplication')), /*#__PURE__*/ React.createElement("p", null, t('general:unsavedChangesDuplicate')), /*#__PURE__*/ React.createElement(Button, {
-        buttonStyle: "secondary",
-        id: "confirm-cancel",
-        onClick: ()=>toggleModal(modalSlug),
-        type: "button"
-    }, t('general:cancel')), /*#__PURE__*/ React.createElement(Button, {
-        id: "confirm-duplicate",
-        onClick: confirm
-    }, t('general:duplicateWithoutSaving')))));
+    return /*#__PURE__*/ _jsxs(React.Fragment, {
+        children: [
+            /*#__PURE__*/ _jsx(PopupList.Button, {
+                id: "action-duplicate",
+                onClick: ()=>handleClick(false),
+                children: t('general:duplicate')
+            }),
+            modified && hasClicked && /*#__PURE__*/ _jsx(Modal, {
+                className: `${baseClass}__modal`,
+                slug: modalSlug,
+                children: /*#__PURE__*/ _jsxs(MinimalTemplate, {
+                    className: `${baseClass}__modal-template`,
+                    children: [
+                        /*#__PURE__*/ _jsx("h1", {
+                            children: t('general:confirmDuplication')
+                        }),
+                        /*#__PURE__*/ _jsx("p", {
+                            children: t('general:unsavedChangesDuplicate')
+                        }),
+                        /*#__PURE__*/ _jsx(Button, {
+                            buttonStyle: "secondary",
+                            id: "confirm-cancel",
+                            onClick: ()=>toggleModal(modalSlug),
+                            type: "button",
+                            children: t('general:cancel')
+                        }),
+                        /*#__PURE__*/ _jsx(Button, {
+                            id: "confirm-duplicate",
+                            onClick: confirm,
+                            children: t('general:duplicateWithoutSaving')
+                        })
+                    ]
+                })
+            })
+        ]
+    });
 };
 
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/DuplicateDocument/index.tsx"],"sourcesContent":["'use client'\n\nimport type { SanitizedCollectionConfig } from 'payload/types'\n\nimport * as facelessUIImport from '@faceless-ui/modal'\nimport { getTranslation } from '@payloadcms/translations'\nimport { useRouter } from 'next/navigation.js'\nimport React, { useCallback, useState } from 'react'\nimport { toast } from 'react-toastify'\n\nimport { useForm, useFormModified } from '../../forms/Form/context.js'\nimport { useConfig } from '../../providers/Config/index.js'\nimport { useLocale } from '../../providers/Locale/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { MinimalTemplate } from '../../templates/Minimal/index.js'\nimport { requests } from '../../utilities/api.js'\nimport { Button } from '../Button/index.js'\nimport { PopupList } from '../Popup/index.js'\nimport './index.scss'\n\nconst baseClass = 'duplicate'\n\nexport type Props = {\n  id: string\n  singularLabel: SanitizedCollectionConfig['labels']['singular']\n  slug: string\n}\n\nexport const DuplicateDocument: React.FC<Props> = ({ id, slug, singularLabel }) => {\n  const { Modal, useModal } = facelessUIImport\n\n  const router = useRouter()\n  const modified = useFormModified()\n  const { toggleModal } = useModal()\n  const locale = useLocale()\n  const { setModified } = useForm()\n  const {\n    routes: { api },\n    serverURL,\n  } = useConfig()\n  const {\n    routes: { admin },\n  } = useConfig()\n  const [hasClicked, setHasClicked] = useState<boolean>(false)\n  const { i18n, t } = useTranslation()\n\n  const modalSlug = `duplicate-${id}`\n\n  const handleClick = useCallback(\n    async (override = false) => {\n      setHasClicked(true)\n\n      if (modified && !override) {\n        toggleModal(modalSlug)\n        return\n      }\n      await requests\n        .post(`${serverURL}${api}/${slug}/${id}/duplicate?locale=${locale.code}`, {\n          body: JSON.stringify({}),\n          headers: {\n            'Accept-Language': i18n.language,\n            'Content-Type': 'application/json',\n            credentials: 'include',\n          },\n        })\n        .then(async (res) => {\n          const { doc, errors, message } = await res.json()\n          if (res.status < 400) {\n            toast.success(\n              message ||\n                t('general:successfullyDuplicated', { label: getTranslation(singularLabel, i18n) }),\n              {\n                autoClose: 3000,\n              },\n            )\n            setModified(false)\n            router.push(`${admin}/collections/${slug}/${doc.id}?locale=${locale.code}`)\n          } else {\n            toast.error(\n              errors?.[0].message ||\n                message ||\n                t('error:unspecific', { label: getTranslation(singularLabel, i18n) }),\n              { autoClose: 5000 },\n            )\n          }\n        })\n    },\n    [\n      locale,\n      modified,\n      serverURL,\n      api,\n      slug,\n      id,\n      i18n,\n      toggleModal,\n      modalSlug,\n      t,\n      singularLabel,\n      setModified,\n      router,\n      admin,\n    ],\n  )\n\n  const confirm = useCallback(async () => {\n    setHasClicked(false)\n    await handleClick(true)\n  }, [handleClick])\n\n  return (\n    <React.Fragment>\n      <PopupList.Button id=\"action-duplicate\" onClick={() => handleClick(false)}>\n        {t('general:duplicate')}\n      </PopupList.Button>\n      {modified && hasClicked && (\n        <Modal className={`${baseClass}__modal`} slug={modalSlug}>\n          <MinimalTemplate className={`${baseClass}__modal-template`}>\n            <h1>{t('general:confirmDuplication')}</h1>\n            <p>{t('general:unsavedChangesDuplicate')}</p>\n            <Button\n              buttonStyle=\"secondary\"\n              id=\"confirm-cancel\"\n              onClick={() => toggleModal(modalSlug)}\n              type=\"button\"\n            >\n              {t('general:cancel')}\n            </Button>\n            <Button id=\"confirm-duplicate\" onClick={confirm}>\n              {t('general:duplicateWithoutSaving')}\n            </Button>\n          </MinimalTemplate>\n        </Modal>\n      )}\n    </React.Fragment>\n  )\n}\n"],"names":["facelessUIImport","getTranslation","useRouter","React","useCallback","useState","toast","useForm","useFormModified","useConfig","useLocale","useTranslation","MinimalTemplate","requests","Button","PopupList","baseClass","DuplicateDocument","id","slug","singularLabel","Modal","useModal","router","modified","toggleModal","locale","setModified","routes","api","serverURL","admin","hasClicked","setHasClicked","i18n","t","modalSlug","handleClick","override","post","code","body","JSON","stringify","headers","language","credentials","then","res","doc","errors","message","json","status","success","label","autoClose","push","error","confirm","Fragment","onClick","className","h1","p","buttonStyle","type"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
+{"version":3,"sources":["../../../src/elements/DuplicateDocument/index.tsx"],"sourcesContent":["'use client'\n\nimport type { SanitizedCollectionConfig } from 'payload/types'\n\nimport * as facelessUIImport from '@faceless-ui/modal'\nimport { getTranslation } from '@payloadcms/translations'\nimport { useRouter } from 'next/navigation.js'\nimport React, { useCallback, useState } from 'react'\nimport { toast } from 'react-toastify'\n\nimport { useForm, useFormModified } from '../../forms/Form/context.js'\nimport { useConfig } from '../../providers/Config/index.js'\nimport { useLocale } from '../../providers/Locale/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { MinimalTemplate } from '../../templates/Minimal/index.js'\nimport { requests } from '../../utilities/api.js'\nimport { Button } from '../Button/index.js'\nimport { PopupList } from '../Popup/index.js'\nimport './index.scss'\n\nconst baseClass = 'duplicate'\n\nexport type Props = {\n  id: string\n  singularLabel: SanitizedCollectionConfig['labels']['singular']\n  slug: string\n}\n\nexport const DuplicateDocument: React.FC<Props> = ({ id, slug, singularLabel }) => {\n  const { Modal, useModal } = facelessUIImport\n\n  const router = useRouter()\n  const modified = useFormModified()\n  const { toggleModal } = useModal()\n  const locale = useLocale()\n  const { setModified } = useForm()\n  const {\n    routes: { api },\n    serverURL,\n  } = useConfig()\n  const {\n    routes: { admin },\n  } = useConfig()\n  const [hasClicked, setHasClicked] = useState<boolean>(false)\n  const { i18n, t } = useTranslation()\n\n  const modalSlug = `duplicate-${id}`\n\n  const handleClick = useCallback(\n    async (override = false) => {\n      setHasClicked(true)\n\n      if (modified && !override) {\n        toggleModal(modalSlug)\n        return\n      }\n      await requests\n        .post(`${serverURL}${api}/${slug}/${id}/duplicate?locale=${locale.code}`, {\n          body: JSON.stringify({}),\n          headers: {\n            'Accept-Language': i18n.language,\n            'Content-Type': 'application/json',\n            credentials: 'include',\n          },\n        })\n        .then(async (res) => {\n          const { doc, errors, message } = await res.json()\n          if (res.status < 400) {\n            toast.success(\n              message ||\n                t('general:successfullyDuplicated', { label: getTranslation(singularLabel, i18n) }),\n              {\n                autoClose: 3000,\n              },\n            )\n            setModified(false)\n            router.push(`${admin}/collections/${slug}/${doc.id}?locale=${locale.code}`)\n          } else {\n            toast.error(\n              errors?.[0].message ||\n                message ||\n                t('error:unspecific', { label: getTranslation(singularLabel, i18n) }),\n              { autoClose: 5000 },\n            )\n          }\n        })\n    },\n    [\n      locale,\n      modified,\n      serverURL,\n      api,\n      slug,\n      id,\n      i18n,\n      toggleModal,\n      modalSlug,\n      t,\n      singularLabel,\n      setModified,\n      router,\n      admin,\n    ],\n  )\n\n  const confirm = useCallback(async () => {\n    setHasClicked(false)\n    await handleClick(true)\n  }, [handleClick])\n\n  return (\n    <React.Fragment>\n      <PopupList.Button id=\"action-duplicate\" onClick={() => handleClick(false)}>\n        {t('general:duplicate')}\n      </PopupList.Button>\n      {modified && hasClicked && (\n        <Modal className={`${baseClass}__modal`} slug={modalSlug}>\n          <MinimalTemplate className={`${baseClass}__modal-template`}>\n            <h1>{t('general:confirmDuplication')}</h1>\n            <p>{t('general:unsavedChangesDuplicate')}</p>\n            <Button\n              buttonStyle=\"secondary\"\n              id=\"confirm-cancel\"\n              onClick={() => toggleModal(modalSlug)}\n              type=\"button\"\n            >\n              {t('general:cancel')}\n            </Button>\n            <Button id=\"confirm-duplicate\" onClick={confirm}>\n              {t('general:duplicateWithoutSaving')}\n            </Button>\n          </MinimalTemplate>\n        </Modal>\n      )}\n    </React.Fragment>\n  )\n}\n"],"names":["facelessUIImport","getTranslation","useRouter","React","useCallback","useState","toast","useForm","useFormModified","useConfig","useLocale","useTranslation","MinimalTemplate","requests","Button","PopupList","baseClass","DuplicateDocument","id","slug","singularLabel","Modal","useModal","router","modified","toggleModal","locale","setModified","routes","api","serverURL","admin","hasClicked","setHasClicked","i18n","t","modalSlug","handleClick","override","post","code","body","JSON","stringify","headers","language","credentials","then","res","doc","errors","message","json","status","success","label","autoClose","push","error","confirm","Fragment","onClick","className","h1","p","buttonStyle","type"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}

package/dist/elements/EditMany/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/EditMany/index.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAgC,MAAM,OAAO,CAAA;AAoBpD,OAAO,cAAc,CAAA;AAIrB,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,eAAe,CAAA;AAE3D,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,sCAAsC,CAAA;AAEpE,MAAM,MAAM,aAAa,GAAG;IAC1B,UAAU,EAAE,sBAAsB,CAAA;IAClC,QAAQ,EAAE,QAAQ,CAAA;CACnB,CAAA;AA8DD,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CAoJ5C,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/EditMany/index.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAgC,MAAM,OAAO,CAAA;AAoBpD,OAAO,cAAc,CAAA;AAIrB,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,eAAe,CAAA;AAE3D,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,sCAAsC,CAAA;AAEpE,MAAM,MAAM,aAAa,GAAG;IAC1B,UAAU,EAAE,sBAAsB,CAAA;IAClC,QAAQ,EAAE,QAAQ,CAAA;CACnB,CAAA;AAgED,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CAoJ5C,CAAA"}