@payloadcms/ui 3.68.0-internal-debug.e9b66ee → 3.68.0-internal-debug.654e4ad

package/dist/elements/Hamburger/index.js

@@ -1,4 +1,6 @@
 'use client';
+import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
+import React from 'react';
 import { ChevronIcon } from '../../icons/Chevron/index.js';
 import { CloseMenuIcon } from '../../icons/CloseMenu/index.js';
 import { MenuIcon } from '../../icons/Menu/index.js';
@@ -8,15 +10,52 @@ const baseClass = 'hamburger';
 export const Hamburger = (props)=>{
     const { t } = useTranslation();
     const { closeIcon = 'x', isActive = false } = props;
-    return <div className={baseClass}>
-      {!isActive && <div aria-label={t('general:open')} className={`${baseClass}__open-icon`} title={t('general:open')}>
-          <MenuIcon/>
-        </div>}
-      {isActive && <div aria-label={closeIcon === 'collapse' ? t('general:collapse') : t('general:close')} className={`${baseClass}__close-icon`} title={closeIcon === 'collapse' ? t('general:collapse') : t('general:close')}>
-          {closeIcon === 'x' && <CloseMenuIcon/>}
-          {closeIcon === 'collapse' && <ChevronIcon direction="left"/>}
-        </div>}
-    </div>;
+    return /*#__PURE__*/ _jsxDEV("div", {
+        className: baseClass,
+        children: [
+            !isActive && /*#__PURE__*/ _jsxDEV("div", {
+                "aria-label": t('general:open'),
+                className: `${baseClass}__open-icon`,
+                title: t('general:open'),
+                children: /*#__PURE__*/ _jsxDEV(MenuIcon, {}, void 0, false, {
+                    fileName: "src/elements/Hamburger/index.tsx",
+                    lineNumber: 27,
+                    columnNumber: 11
+                }, this)
+            }, void 0, false, {
+                fileName: "src/elements/Hamburger/index.tsx",
+                lineNumber: 22,
+                columnNumber: 9
+            }, this),
+            isActive && /*#__PURE__*/ _jsxDEV("div", {
+                "aria-label": closeIcon === 'collapse' ? t('general:collapse') : t('general:close'),
+                className: `${baseClass}__close-icon`,
+                title: closeIcon === 'collapse' ? t('general:collapse') : t('general:close'),
+                children: [
+                    closeIcon === 'x' && /*#__PURE__*/ _jsxDEV(CloseMenuIcon, {}, void 0, false, {
+                        fileName: "src/elements/Hamburger/index.tsx",
+                        lineNumber: 36,
+                        columnNumber: 33
+                    }, this),
+                    closeIcon === 'collapse' && /*#__PURE__*/ _jsxDEV(ChevronIcon, {
+                        direction: "left"
+                    }, void 0, false, {
+                        fileName: "src/elements/Hamburger/index.tsx",
+                        lineNumber: 37,
+                        columnNumber: 40
+                    }, this)
+                ]
+            }, void 0, true, {
+                fileName: "src/elements/Hamburger/index.tsx",
+                lineNumber: 31,
+                columnNumber: 9
+            }, this)
+        ]
+    }, void 0, true, {
+        fileName: "src/elements/Hamburger/index.tsx",
+        lineNumber: 20,
+        columnNumber: 5
+    }, this);
 };
 
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/Hamburger/index.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\n\nimport { ChevronIcon } from '../../icons/Chevron/index.js'\nimport { CloseMenuIcon } from '../../icons/CloseMenu/index.js'\nimport { MenuIcon } from '../../icons/Menu/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport './index.scss'\n\nconst baseClass = 'hamburger'\n\nexport const Hamburger: React.FC<{\n  readonly closeIcon?: 'collapse' | 'x'\n  readonly isActive?: boolean\n}> = (props) => {\n  const { t } = useTranslation()\n  const { closeIcon = 'x', isActive = false } = props\n\n  return (\n    <div className={baseClass}>\n      {!isActive && (\n        <div\n          aria-label={t('general:open')}\n          className={`${baseClass}__open-icon`}\n          title={t('general:open')}\n        >\n          <MenuIcon />\n        </div>\n      )}\n      {isActive && (\n        <div\n          aria-label={closeIcon === 'collapse' ? t('general:collapse') : t('general:close')}\n          className={`${baseClass}__close-icon`}\n          title={closeIcon === 'collapse' ? t('general:collapse') : t('general:close')}\n        >\n          {closeIcon === 'x' && <CloseMenuIcon />}\n          {closeIcon === 'collapse' && <ChevronIcon direction=\"left\" />}\n        </div>\n      )}\n    </div>\n  )\n}\n"],"names":["ChevronIcon","CloseMenuIcon","MenuIcon","useTranslation","baseClass","Hamburger","props","t","closeIcon","isActive","div","className","aria-label","title","direction"],"mappings":"AAAA;AAGA,SAASA,WAAW,QAAQ,+BAA8B;AAC1D,SAASC,aAAa,QAAQ,iCAAgC;AAC9D,SAASC,QAAQ,QAAQ,4BAA2B;AACpD,SAASC,cAAc,QAAQ,uCAAsC;AACrE,OAAO,eAAc;AAErB,MAAMC,YAAY;AAElB,OAAO,MAAMC,YAGR,CAACC;IACJ,MAAM,EAAEC,CAAC,EAAE,GAAGJ;IACd,MAAM,EAAEK,YAAY,GAAG,EAAEC,WAAW,KAAK,EAAE,GAAGH;IAE9C,QACGI,IAAIC,WAAWP,WAAW;MACzB,CAAC,CAACK,aACCC,IACCE,YAAYL,EAAE,iBACdI,WAAW,GAAGP,UAAU,WAAW,CAAC,EACpCS,OAAON,EAAE,iBACV;UACC,CAACL,UAAW;QACd,EAAEQ,KACF;MACF,CAACD,aACEC,IACCE,YAAYJ,cAAc,aAAaD,EAAE,sBAAsBA,EAAE,kBACjEI,WAAW,GAAGP,UAAU,YAAY,CAAC,EACrCS,OAAOL,cAAc,aAAaD,EAAE,sBAAsBA,EAAE,kBAC7D;UACC,CAACC,cAAc,QAAQP,gBAAiB;UACxC,CAACO,cAAc,eAAeR,YAAYc,UAAU,SAAU;QAChE,EAAEJ,KACF;IACJ,EAAEA;AAEN,EAAC"}
+{"version":3,"sources":["../../../src/elements/Hamburger/index.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\n\nimport { ChevronIcon } from '../../icons/Chevron/index.js'\nimport { CloseMenuIcon } from '../../icons/CloseMenu/index.js'\nimport { MenuIcon } from '../../icons/Menu/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport './index.scss'\n\nconst baseClass = 'hamburger'\n\nexport const Hamburger: React.FC<{\n  readonly closeIcon?: 'collapse' | 'x'\n  readonly isActive?: boolean\n}> = (props) => {\n  const { t } = useTranslation()\n  const { closeIcon = 'x', isActive = false } = props\n\n  return (\n    <div className={baseClass}>\n      {!isActive && (\n        <div\n          aria-label={t('general:open')}\n          className={`${baseClass}__open-icon`}\n          title={t('general:open')}\n        >\n          <MenuIcon />\n        </div>\n      )}\n      {isActive && (\n        <div\n          aria-label={closeIcon === 'collapse' ? t('general:collapse') : t('general:close')}\n          className={`${baseClass}__close-icon`}\n          title={closeIcon === 'collapse' ? t('general:collapse') : t('general:close')}\n        >\n          {closeIcon === 'x' && <CloseMenuIcon />}\n          {closeIcon === 'collapse' && <ChevronIcon direction=\"left\" />}\n        </div>\n      )}\n    </div>\n  )\n}\n"],"names":["React","ChevronIcon","CloseMenuIcon","MenuIcon","useTranslation","baseClass","Hamburger","props","t","closeIcon","isActive","div","className","aria-label","title","direction"],"mappings":"AAAA;;AACA,OAAOA,WAAW,QAAO;AAEzB,SAASC,WAAW,QAAQ,+BAA8B;AAC1D,SAASC,aAAa,QAAQ,iCAAgC;AAC9D,SAASC,QAAQ,QAAQ,4BAA2B;AACpD,SAASC,cAAc,QAAQ,uCAAsC;AACrE,OAAO,eAAc;AAErB,MAAMC,YAAY;AAElB,OAAO,MAAMC,YAGR,CAACC;IACJ,MAAM,EAAEC,CAAC,EAAE,GAAGJ;IACd,MAAM,EAAEK,YAAY,GAAG,EAAEC,WAAW,KAAK,EAAE,GAAGH;IAE9C,qBACE,QAACI;QAAIC,WAAWP;;YACb,CAACK,0BACA,QAACC;gBACCE,cAAYL,EAAE;gBACdI,WAAW,GAAGP,UAAU,WAAW,CAAC;gBACpCS,OAAON,EAAE;0BAET,cAAA,QAACL;;;;;;;;;;YAGJO,0BACC,QAACC;gBACCE,cAAYJ,cAAc,aAAaD,EAAE,sBAAsBA,EAAE;gBACjEI,WAAW,GAAGP,UAAU,YAAY,CAAC;gBACrCS,OAAOL,cAAc,aAAaD,EAAE,sBAAsBA,EAAE;;oBAE3DC,cAAc,qBAAO,QAACP;;;;;oBACtBO,cAAc,4BAAc,QAACR;wBAAYc,WAAU;;;;;;;;;;;;;;;;;;AAK9D,EAAC"}

package/dist/elements/IDLabel/index.js

@@ -1,4 +1,6 @@
 'use client';
+import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
+import React from 'react';
 import './index.scss';
 import { Link } from '../../elements/Link/index.js';
 import { useConfig } from '../../providers/Config/index.js';
@@ -15,14 +17,29 @@ export const IDLabel = ({ id, className, prefix = 'ID:' })=>{
         adminRoute,
         path: `/${collectionSlug ? `collections/${collectionSlug}` : `globals/${globalSlug}`}/${id}`
     });
-    return <div className={[
-        baseClass,
-        className
-    ].filter(Boolean).join(' ')} title={id}>
-      {prefix}
-      &nbsp;
-      {drawerDepth > 1 ? <Link href={docPath}>{sanitizeID(id)}</Link> : sanitizeID(id)}
-    </div>;
+    return /*#__PURE__*/ _jsxDEV("div", {
+        className: [
+            baseClass,
+            className
+        ].filter(Boolean).join(' '),
+        title: id,
+        children: [
+            prefix,
+            " ",
+            drawerDepth > 1 ? /*#__PURE__*/ _jsxDEV(Link, {
+                href: docPath,
+                children: sanitizeID(id)
+            }, void 0, false, {
+                fileName: "src/elements/IDLabel/index.tsx",
+                lineNumber: 37,
+                columnNumber: 26
+            }, this) : sanitizeID(id)
+        ]
+    }, void 0, true, {
+        fileName: "src/elements/IDLabel/index.tsx",
+        lineNumber: 34,
+        columnNumber: 5
+    }, this);
 };
 
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/IDLabel/index.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\n\nimport './index.scss'\nimport { Link } from '../../elements/Link/index.js'\nimport { useConfig } from '../../providers/Config/index.js'\nimport { useDocumentInfo } from '../../providers/DocumentInfo/index.js'\nimport { formatAdminURL } from '../../utilities/formatAdminURL.js'\nimport { sanitizeID } from '../../utilities/sanitizeID.js'\nimport { useDrawerDepth } from '../Drawer/index.js'\n\nconst baseClass = 'id-label'\n\nexport const IDLabel: React.FC<{ className?: string; id: string; prefix?: string }> = ({\n  id,\n  className,\n  prefix = 'ID:',\n}) => {\n  const {\n    config: {\n      routes: { admin: adminRoute },\n    },\n  } = useConfig()\n\n  const { collectionSlug, globalSlug } = useDocumentInfo()\n  const drawerDepth = useDrawerDepth()\n\n  const docPath = formatAdminURL({\n    adminRoute,\n    path: `/${collectionSlug ? `collections/${collectionSlug}` : `globals/${globalSlug}`}/${id}`,\n  })\n\n  return (\n    <div className={[baseClass, className].filter(Boolean).join(' ')} title={id}>\n      {prefix}\n      &nbsp;\n      {drawerDepth > 1 ? <Link href={docPath}>{sanitizeID(id)}</Link> : sanitizeID(id)}\n    </div>\n  )\n}\n"],"names":["Link","useConfig","useDocumentInfo","formatAdminURL","sanitizeID","useDrawerDepth","baseClass","IDLabel","id","className","prefix","config","routes","admin","adminRoute","collectionSlug","globalSlug","drawerDepth","docPath","path","div","filter","Boolean","join","title","href"],"mappings":"AAAA;AAGA,OAAO,eAAc;AACrB,SAASA,IAAI,QAAQ,+BAA8B;AACnD,SAASC,SAAS,QAAQ,kCAAiC;AAC3D,SAASC,eAAe,QAAQ,wCAAuC;AACvE,SAASC,cAAc,QAAQ,oCAAmC;AAClE,SAASC,UAAU,QAAQ,gCAA+B;AAC1D,SAASC,cAAc,QAAQ,qBAAoB;AAEnD,MAAMC,YAAY;AAElB,OAAO,MAAMC,UAAyE,CAAC,EACrFC,EAAE,EACFC,SAAS,EACTC,SAAS,KAAK,EACf;IACC,MAAM,EACJC,QAAQ,EACNC,QAAQ,EAAEC,OAAOC,UAAU,EAAE,EAC9B,EACF,GAAGb;IAEJ,MAAM,EAAEc,cAAc,EAAEC,UAAU,EAAE,GAAGd;IACvC,MAAMe,cAAcZ;IAEpB,MAAMa,UAAUf,eAAe;QAC7BW;QACAK,MAAM,CAAC,CAAC,EAAEJ,iBAAiB,CAAC,YAAY,EAAEA,gBAAgB,GAAG,CAAC,QAAQ,EAAEC,YAAY,CAAC,CAAC,EAAER,IAAI;IAC9F;IAEA,QACGY,IAAIX,WAAW;QAACH;QAAWG;KAAU,CAACY,MAAM,CAACC,SAASC,IAAI,CAAC,MAAMC,OAAOhB,IAAI;MAC3E,CAACE,OAAO;;MAER,CAACO,cAAc,KAAKjB,KAAKyB,MAAMP,UAAUd,WAAWI,MAAMR,QAAQI,WAAWI,IAAI;IACnF,EAAEY;AAEN,EAAC"}
+{"version":3,"sources":["../../../src/elements/IDLabel/index.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\n\nimport './index.scss'\nimport { Link } from '../../elements/Link/index.js'\nimport { useConfig } from '../../providers/Config/index.js'\nimport { useDocumentInfo } from '../../providers/DocumentInfo/index.js'\nimport { formatAdminURL } from '../../utilities/formatAdminURL.js'\nimport { sanitizeID } from '../../utilities/sanitizeID.js'\nimport { useDrawerDepth } from '../Drawer/index.js'\n\nconst baseClass = 'id-label'\n\nexport const IDLabel: React.FC<{ className?: string; id: string; prefix?: string }> = ({\n  id,\n  className,\n  prefix = 'ID:',\n}) => {\n  const {\n    config: {\n      routes: { admin: adminRoute },\n    },\n  } = useConfig()\n\n  const { collectionSlug, globalSlug } = useDocumentInfo()\n  const drawerDepth = useDrawerDepth()\n\n  const docPath = formatAdminURL({\n    adminRoute,\n    path: `/${collectionSlug ? `collections/${collectionSlug}` : `globals/${globalSlug}`}/${id}`,\n  })\n\n  return (\n    <div className={[baseClass, className].filter(Boolean).join(' ')} title={id}>\n      {prefix}\n      &nbsp;\n      {drawerDepth > 1 ? <Link href={docPath}>{sanitizeID(id)}</Link> : sanitizeID(id)}\n    </div>\n  )\n}\n"],"names":["React","Link","useConfig","useDocumentInfo","formatAdminURL","sanitizeID","useDrawerDepth","baseClass","IDLabel","id","className","prefix","config","routes","admin","adminRoute","collectionSlug","globalSlug","drawerDepth","docPath","path","div","filter","Boolean","join","title","href"],"mappings":"AAAA;;AACA,OAAOA,WAAW,QAAO;AAEzB,OAAO,eAAc;AACrB,SAASC,IAAI,QAAQ,+BAA8B;AACnD,SAASC,SAAS,QAAQ,kCAAiC;AAC3D,SAASC,eAAe,QAAQ,wCAAuC;AACvE,SAASC,cAAc,QAAQ,oCAAmC;AAClE,SAASC,UAAU,QAAQ,gCAA+B;AAC1D,SAASC,cAAc,QAAQ,qBAAoB;AAEnD,MAAMC,YAAY;AAElB,OAAO,MAAMC,UAAyE,CAAC,EACrFC,EAAE,EACFC,SAAS,EACTC,SAAS,KAAK,EACf;IACC,MAAM,EACJC,QAAQ,EACNC,QAAQ,EAAEC,OAAOC,UAAU,EAAE,EAC9B,EACF,GAAGb;IAEJ,MAAM,EAAEc,cAAc,EAAEC,UAAU,EAAE,GAAGd;IACvC,MAAMe,cAAcZ;IAEpB,MAAMa,UAAUf,eAAe;QAC7BW;QACAK,MAAM,CAAC,CAAC,EAAEJ,iBAAiB,CAAC,YAAY,EAAEA,gBAAgB,GAAG,CAAC,QAAQ,EAAEC,YAAY,CAAC,CAAC,EAAER,IAAI;IAC9F;IAEA,qBACE,QAACY;QAAIX,WAAW;YAACH;YAAWG;SAAU,CAACY,MAAM,CAACC,SAASC,IAAI,CAAC;QAAMC,OAAOhB;;YACtEE;YAAO;YAEPO,cAAc,kBAAI,QAACjB;gBAAKyB,MAAMP;0BAAUd,WAAWI;;;;;uBAAcJ,WAAWI;;;;;;;AAGnF,EAAC"}

package/dist/elements/LeaveWithoutSaving/index.js

@@ -1,4 +1,5 @@
 'use client';
+import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
 import React, { useCallback } from 'react';
 import { useForm, useFormModified } from '../../forms/Form/index.js';
 import { useAuth } from '../../providers/Auth/index.js';
@@ -56,11 +57,31 @@ export const LeaveWithoutSaving = ({ disablePreventLeave = false, onConfirm, onP
     }, [
         onConfirm
     ]);
-    return <LeaveWithoutSavingModal modalSlug={modalSlug} onCancel={onCancel} onConfirm={handleConfirm}/>;
+    return /*#__PURE__*/ _jsxDEV(LeaveWithoutSavingModal, {
+        modalSlug: modalSlug,
+        onCancel: onCancel,
+        onConfirm: handleConfirm
+    }, void 0, false, {
+        fileName: "src/elements/LeaveWithoutSaving/index.tsx",
+        lineNumber: 66,
+        columnNumber: 5
+    }, this);
 };
 export const LeaveWithoutSavingModal = ({ modalSlug, onCancel, onConfirm })=>{
     const { t } = useTranslation();
-    return <ConfirmationModal body={t('general:changesNotSaved')} cancelLabel={t('general:stayOnThisPage')} confirmLabel={t('general:leaveAnyway')} heading={t('general:leaveWithoutSaving')} modalSlug={modalSlug} onCancel={onCancel} onConfirm={onConfirm}/>;
+    return /*#__PURE__*/ _jsxDEV(ConfirmationModal, {
+        body: t('general:changesNotSaved'),
+        cancelLabel: t('general:stayOnThisPage'),
+        confirmLabel: t('general:leaveAnyway'),
+        heading: t('general:leaveWithoutSaving'),
+        modalSlug: modalSlug,
+        onCancel: onCancel,
+        onConfirm: onConfirm
+    }, void 0, false, {
+        fileName: "src/elements/LeaveWithoutSaving/index.tsx",
+        lineNumber: 82,
+        columnNumber: 5
+    }, this);
 };
 
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/LeaveWithoutSaving/index.tsx"],"sourcesContent":["'use client'\nimport React, { useCallback } from 'react'\n\nimport type { OnCancel } from '../ConfirmationModal/index.js'\n\nimport { useForm, useFormModified } from '../../forms/Form/index.js'\nimport { useAuth } from '../../providers/Auth/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { ConfirmationModal } from '../ConfirmationModal/index.js'\nimport { useModal } from '../Modal/index.js'\nimport { usePreventLeave } from './usePreventLeave.js'\n\ntype LeaveWithoutSavingProps = {\n  disablePreventLeave?: boolean\n  modalSlug?: string\n  onConfirm?: () => Promise<void> | void\n  onPrevent?: (nextHref: null | string) => void\n}\n\nconst leaveWithoutSavingModalSlug = 'leave-without-saving'\n\nexport const LeaveWithoutSaving: React.FC<LeaveWithoutSavingProps> = ({\n  disablePreventLeave = false,\n  onConfirm,\n  onPrevent,\n}) => {\n  const modalSlug = leaveWithoutSavingModalSlug\n  const { closeModal, openModal } = useModal()\n  const modified = useFormModified()\n  const { isValid } = useForm()\n  const { user } = useAuth()\n  const [hasAccepted, setHasAccepted] = React.useState(false)\n\n  const prevent = !disablePreventLeave && Boolean((modified || !isValid) && user)\n\n  const handlePrevent = useCallback(() => {\n    const activeHref = (document.activeElement as HTMLAnchorElement)?.href || null\n    if (onPrevent) {\n      onPrevent(activeHref)\n    }\n    openModal(modalSlug)\n  }, [openModal, onPrevent, modalSlug])\n\n  const handleAccept = useCallback(() => {\n    closeModal(modalSlug)\n  }, [closeModal, modalSlug])\n\n  usePreventLeave({ hasAccepted, onAccept: handleAccept, onPrevent: handlePrevent, prevent })\n\n  const onCancel: OnCancel = useCallback(() => {\n    closeModal(modalSlug)\n  }, [closeModal, modalSlug])\n\n  const handleConfirm = useCallback(async () => {\n    if (onConfirm) {\n      try {\n        await onConfirm()\n      } catch (err) {\n        console.error('Error in LeaveWithoutSaving onConfirm:', err)\n      }\n    }\n    setHasAccepted(true)\n  }, [onConfirm])\n\n  return (\n    <LeaveWithoutSavingModal modalSlug={modalSlug} onCancel={onCancel} onConfirm={handleConfirm} />\n  )\n}\n\nexport const LeaveWithoutSavingModal = ({\n  modalSlug,\n  onCancel,\n  onConfirm,\n}: {\n  modalSlug: string\n  onCancel?: OnCancel\n  onConfirm: () => Promise<void> | void\n}) => {\n  const { t } = useTranslation()\n\n  return (\n    <ConfirmationModal\n      body={t('general:changesNotSaved')}\n      cancelLabel={t('general:stayOnThisPage')}\n      confirmLabel={t('general:leaveAnyway')}\n      heading={t('general:leaveWithoutSaving')}\n      modalSlug={modalSlug}\n      onCancel={onCancel}\n      onConfirm={onConfirm}\n    />\n  )\n}\n"],"names":["React","useCallback","useForm","useFormModified","useAuth","useTranslation","ConfirmationModal","useModal","usePreventLeave","leaveWithoutSavingModalSlug","LeaveWithoutSaving","disablePreventLeave","onConfirm","onPrevent","modalSlug","closeModal","openModal","modified","isValid","user","hasAccepted","setHasAccepted","useState","prevent","Boolean","handlePrevent","activeHref","document","activeElement","href","handleAccept","onAccept","onCancel","handleConfirm","err","console","error","LeaveWithoutSavingModal","t","body","cancelLabel","confirmLabel","heading"],"mappings":"AAAA;AACA,OAAOA,SAASC,WAAW,QAAQ,QAAO;AAI1C,SAASC,OAAO,EAAEC,eAAe,QAAQ,4BAA2B;AACpE,SAASC,OAAO,QAAQ,gCAA+B;AACvD,SAASC,cAAc,QAAQ,uCAAsC;AACrE,SAASC,iBAAiB,QAAQ,gCAA+B;AACjE,SAASC,QAAQ,QAAQ,oBAAmB;AAC5C,SAASC,eAAe,QAAQ,uBAAsB;AAStD,MAAMC,8BAA8B;AAEpC,OAAO,MAAMC,qBAAwD,CAAC,EACpEC,sBAAsB,KAAK,EAC3BC,SAAS,EACTC,SAAS,EACV;IACC,MAAMC,YAAYL;IAClB,MAAM,EAAEM,UAAU,EAAEC,SAAS,EAAE,GAAGT;IAClC,MAAMU,WAAWd;IACjB,MAAM,EAAEe,OAAO,EAAE,GAAGhB;IACpB,MAAM,EAAEiB,IAAI,EAAE,GAAGf;IACjB,MAAM,CAACgB,aAAaC,eAAe,GAAGrB,MAAMsB,QAAQ,CAAC;IAErD,MAAMC,UAAU,CAACZ,uBAAuBa,QAAQ,AAACP,CAAAA,YAAY,CAACC,OAAM,KAAMC;IAE1E,MAAMM,gBAAgBxB,YAAY;QAChC,MAAMyB,aAAa,AAACC,SAASC,aAAa,EAAwBC,QAAQ;QAC1E,IAAIhB,WAAW;YACbA,UAAUa;QACZ;QACAV,UAAUF;IACZ,GAAG;QAACE;QAAWH;QAAWC;KAAU;IAEpC,MAAMgB,eAAe7B,YAAY;QAC/Bc,WAAWD;IACb,GAAG;QAACC;QAAYD;KAAU;IAE1BN,gBAAgB;QAAEY;QAAaW,UAAUD;QAAcjB,WAAWY;QAAeF;IAAQ;IAEzF,MAAMS,WAAqB/B,YAAY;QACrCc,WAAWD;IACb,GAAG;QAACC;QAAYD;KAAU;IAE1B,MAAMmB,gBAAgBhC,YAAY;QAChC,IAAIW,WAAW;YACb,IAAI;gBACF,MAAMA;YACR,EAAE,OAAOsB,KAAK;gBACZC,QAAQC,KAAK,CAAC,0CAA0CF;YAC1D;QACF;QACAb,eAAe;IACjB,GAAG;QAACT;KAAU;IAEd,QACGyB,wBAAwBvB,WAAWA,WAAWkB,UAAUA,UAAUpB,WAAWqB;AAElF,EAAC;AAED,OAAO,MAAMI,0BAA0B,CAAC,EACtCvB,SAAS,EACTkB,QAAQ,EACRpB,SAAS,EAKV;IACC,MAAM,EAAE0B,CAAC,EAAE,GAAGjC;IAEd,QACGC,kBACCiC,MAAMD,EAAE,4BACRE,aAAaF,EAAE,2BACfG,cAAcH,EAAE,wBAChBI,SAASJ,EAAE,+BACXxB,WAAWA,WACXkB,UAAUA,UACVpB,WAAWA;AAGjB,EAAC"}
+{"version":3,"sources":["../../../src/elements/LeaveWithoutSaving/index.tsx"],"sourcesContent":["'use client'\nimport React, { useCallback } from 'react'\n\nimport type { OnCancel } from '../ConfirmationModal/index.js'\n\nimport { useForm, useFormModified } from '../../forms/Form/index.js'\nimport { useAuth } from '../../providers/Auth/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { ConfirmationModal } from '../ConfirmationModal/index.js'\nimport { useModal } from '../Modal/index.js'\nimport { usePreventLeave } from './usePreventLeave.js'\n\ntype LeaveWithoutSavingProps = {\n  disablePreventLeave?: boolean\n  modalSlug?: string\n  onConfirm?: () => Promise<void> | void\n  onPrevent?: (nextHref: null | string) => void\n}\n\nconst leaveWithoutSavingModalSlug = 'leave-without-saving'\n\nexport const LeaveWithoutSaving: React.FC<LeaveWithoutSavingProps> = ({\n  disablePreventLeave = false,\n  onConfirm,\n  onPrevent,\n}) => {\n  const modalSlug = leaveWithoutSavingModalSlug\n  const { closeModal, openModal } = useModal()\n  const modified = useFormModified()\n  const { isValid } = useForm()\n  const { user } = useAuth()\n  const [hasAccepted, setHasAccepted] = React.useState(false)\n\n  const prevent = !disablePreventLeave && Boolean((modified || !isValid) && user)\n\n  const handlePrevent = useCallback(() => {\n    const activeHref = (document.activeElement as HTMLAnchorElement)?.href || null\n    if (onPrevent) {\n      onPrevent(activeHref)\n    }\n    openModal(modalSlug)\n  }, [openModal, onPrevent, modalSlug])\n\n  const handleAccept = useCallback(() => {\n    closeModal(modalSlug)\n  }, [closeModal, modalSlug])\n\n  usePreventLeave({ hasAccepted, onAccept: handleAccept, onPrevent: handlePrevent, prevent })\n\n  const onCancel: OnCancel = useCallback(() => {\n    closeModal(modalSlug)\n  }, [closeModal, modalSlug])\n\n  const handleConfirm = useCallback(async () => {\n    if (onConfirm) {\n      try {\n        await onConfirm()\n      } catch (err) {\n        console.error('Error in LeaveWithoutSaving onConfirm:', err)\n      }\n    }\n    setHasAccepted(true)\n  }, [onConfirm])\n\n  return (\n    <LeaveWithoutSavingModal modalSlug={modalSlug} onCancel={onCancel} onConfirm={handleConfirm} />\n  )\n}\n\nexport const LeaveWithoutSavingModal = ({\n  modalSlug,\n  onCancel,\n  onConfirm,\n}: {\n  modalSlug: string\n  onCancel?: OnCancel\n  onConfirm: () => Promise<void> | void\n}) => {\n  const { t } = useTranslation()\n\n  return (\n    <ConfirmationModal\n      body={t('general:changesNotSaved')}\n      cancelLabel={t('general:stayOnThisPage')}\n      confirmLabel={t('general:leaveAnyway')}\n      heading={t('general:leaveWithoutSaving')}\n      modalSlug={modalSlug}\n      onCancel={onCancel}\n      onConfirm={onConfirm}\n    />\n  )\n}\n"],"names":["React","useCallback","useForm","useFormModified","useAuth","useTranslation","ConfirmationModal","useModal","usePreventLeave","leaveWithoutSavingModalSlug","LeaveWithoutSaving","disablePreventLeave","onConfirm","onPrevent","modalSlug","closeModal","openModal","modified","isValid","user","hasAccepted","setHasAccepted","useState","prevent","Boolean","handlePrevent","activeHref","document","activeElement","href","handleAccept","onAccept","onCancel","handleConfirm","err","console","error","LeaveWithoutSavingModal","t","body","cancelLabel","confirmLabel","heading"],"mappings":"AAAA;;AACA,OAAOA,SAASC,WAAW,QAAQ,QAAO;AAI1C,SAASC,OAAO,EAAEC,eAAe,QAAQ,4BAA2B;AACpE,SAASC,OAAO,QAAQ,gCAA+B;AACvD,SAASC,cAAc,QAAQ,uCAAsC;AACrE,SAASC,iBAAiB,QAAQ,gCAA+B;AACjE,SAASC,QAAQ,QAAQ,oBAAmB;AAC5C,SAASC,eAAe,QAAQ,uBAAsB;AAStD,MAAMC,8BAA8B;AAEpC,OAAO,MAAMC,qBAAwD,CAAC,EACpEC,sBAAsB,KAAK,EAC3BC,SAAS,EACTC,SAAS,EACV;IACC,MAAMC,YAAYL;IAClB,MAAM,EAAEM,UAAU,EAAEC,SAAS,EAAE,GAAGT;IAClC,MAAMU,WAAWd;IACjB,MAAM,EAAEe,OAAO,EAAE,GAAGhB;IACpB,MAAM,EAAEiB,IAAI,EAAE,GAAGf;IACjB,MAAM,CAACgB,aAAaC,eAAe,GAAGrB,MAAMsB,QAAQ,CAAC;IAErD,MAAMC,UAAU,CAACZ,uBAAuBa,QAAQ,AAACP,CAAAA,YAAY,CAACC,OAAM,KAAMC;IAE1E,MAAMM,gBAAgBxB,YAAY;QAChC,MAAMyB,aAAa,AAACC,SAASC,aAAa,EAAwBC,QAAQ;QAC1E,IAAIhB,WAAW;YACbA,UAAUa;QACZ;QACAV,UAAUF;IACZ,GAAG;QAACE;QAAWH;QAAWC;KAAU;IAEpC,MAAMgB,eAAe7B,YAAY;QAC/Bc,WAAWD;IACb,GAAG;QAACC;QAAYD;KAAU;IAE1BN,gBAAgB;QAAEY;QAAaW,UAAUD;QAAcjB,WAAWY;QAAeF;IAAQ;IAEzF,MAAMS,WAAqB/B,YAAY;QACrCc,WAAWD;IACb,GAAG;QAACC;QAAYD;KAAU;IAE1B,MAAMmB,gBAAgBhC,YAAY;QAChC,IAAIW,WAAW;YACb,IAAI;gBACF,MAAMA;YACR,EAAE,OAAOsB,KAAK;gBACZC,QAAQC,KAAK,CAAC,0CAA0CF;YAC1D;QACF;QACAb,eAAe;IACjB,GAAG;QAACT;KAAU;IAEd,qBACE,QAACyB;QAAwBvB,WAAWA;QAAWkB,UAAUA;QAAUpB,WAAWqB;;;;;;AAElF,EAAC;AAED,OAAO,MAAMI,0BAA0B,CAAC,EACtCvB,SAAS,EACTkB,QAAQ,EACRpB,SAAS,EAKV;IACC,MAAM,EAAE0B,CAAC,EAAE,GAAGjC;IAEd,qBACE,QAACC;QACCiC,MAAMD,EAAE;QACRE,aAAaF,EAAE;QACfG,cAAcH,EAAE;QAChBI,SAASJ,EAAE;QACXxB,WAAWA;QACXkB,UAAUA;QACVpB,WAAWA;;;;;;AAGjB,EAAC"}

package/dist/elements/Link/index.js

@@ -1,6 +1,8 @@
 'use client';
+import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
 import NextLinkImport from 'next/link.js';
 import { useRouter } from 'next/navigation.js';
+import React from 'react';
 import { useRouteTransition } from '../../providers/RouteTransition/index.js';
 import { formatUrl } from './formatUrl.js';
 const NextLink = 'default' in NextLinkImport ? NextLinkImport.default : NextLinkImport;
@@ -18,33 +20,41 @@ function isModifiedEvent(event) {
    */ export const Link = ({ children, href, onClick, preventDefault = true, ref, replace, scroll, ...rest })=>{
     const router = useRouter();
     const { startRouteTransition } = useRouteTransition();
-    return <NextLink href={href} onClick={(e)=>{
-        if (isModifiedEvent(e)) {
-            return;
-        }
-        if (onClick) {
-            onClick(e);
-        }
-        // We need a preventDefault here so that a clicked link doesn't trigger twice,
-        // once for default browser navigation and once for startRouteTransition
-        if (preventDefault) {
-            e.preventDefault();
-        }
-        startRouteTransition(()=>{
-            const url = typeof href === 'string' ? href : formatUrl(href);
-            if (replace) {
-                void router.replace(url, {
-                    scroll
-                });
-            } else {
-                void router.push(url, {
-                    scroll
-                });
+    return /*#__PURE__*/ _jsxDEV(NextLink, {
+        href: href,
+        onClick: (e)=>{
+            if (isModifiedEvent(e)) {
+                return;
             }
-        });
-    }} ref={ref} {...rest}>
-      {children}
-    </NextLink>;
+            if (onClick) {
+                onClick(e);
+            }
+            // We need a preventDefault here so that a clicked link doesn't trigger twice,
+            // once for default browser navigation and once for startRouteTransition
+            if (preventDefault) {
+                e.preventDefault();
+            }
+            startRouteTransition(()=>{
+                const url = typeof href === 'string' ? href : formatUrl(href);
+                if (replace) {
+                    void router.replace(url, {
+                        scroll
+                    });
+                } else {
+                    void router.push(url, {
+                        scroll
+                    });
+                }
+            });
+        },
+        ref: ref,
+        ...rest,
+        children: children
+    }, void 0, false, {
+        fileName: "src/elements/Link/index.tsx",
+        lineNumber: 48,
+        columnNumber: 5
+    }, this);
 };
 
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/Link/index.tsx"],"sourcesContent":["'use client'\nimport NextLinkImport from 'next/link.js'\nimport { useRouter } from 'next/navigation.js'\nimport React from 'react'\n\nimport { useRouteTransition } from '../../providers/RouteTransition/index.js'\nimport { formatUrl } from './formatUrl.js'\n\nconst NextLink = 'default' in NextLinkImport ? NextLinkImport.default : NextLinkImport\n\n// Copied from  https://github.com/vercel/next.js/blob/canary/packages/next/src/client/link.tsx#L180-L191\nfunction isModifiedEvent(event: React.MouseEvent): boolean {\n  const eventTarget = event.currentTarget as HTMLAnchorElement | SVGAElement\n  const target = eventTarget.getAttribute('target')\n  return (\n    (target && target !== '_self') ||\n    event.metaKey ||\n    event.ctrlKey ||\n    event.shiftKey ||\n    event.altKey || // triggers resource download\n    (event.nativeEvent && event.nativeEvent.which === 2)\n  )\n}\n\ntype Props = {\n  /**\n   * Disable the e.preventDefault() call on click if you want to handle it yourself via onClick\n   *\n   * @default true\n   */\n  preventDefault?: boolean\n} & Parameters<typeof NextLink>[0]\n\nexport const Link: React.FC<Props> = ({\n  children,\n  href,\n  onClick,\n  preventDefault = true,\n  ref,\n  replace,\n  scroll,\n  ...rest\n}) => {\n  const router = useRouter()\n  const { startRouteTransition } = useRouteTransition()\n\n  return (\n    <NextLink\n      href={href}\n      onClick={(e) => {\n        if (isModifiedEvent(e)) {\n          return\n        }\n\n        if (onClick) {\n          onClick(e)\n        }\n\n        // We need a preventDefault here so that a clicked link doesn't trigger twice,\n        // once for default browser navigation and once for startRouteTransition\n        if (preventDefault) {\n          e.preventDefault()\n        }\n\n        startRouteTransition(() => {\n          const url = typeof href === 'string' ? href : formatUrl(href)\n\n          if (replace) {\n            void router.replace(url, { scroll })\n          } else {\n            void router.push(url, { scroll })\n          }\n        })\n      }}\n      ref={ref}\n      {...rest}\n    >\n      {children}\n    </NextLink>\n  )\n}\n"],"names":["NextLinkImport","useRouter","useRouteTransition","formatUrl","NextLink","default","isModifiedEvent","event","eventTarget","currentTarget","target","getAttribute","metaKey","ctrlKey","shiftKey","altKey","nativeEvent","which","Link","children","href","onClick","preventDefault","ref","replace","scroll","rest","router","startRouteTransition","e","url","push"],"mappings":"AAAA;AACA,OAAOA,oBAAoB,eAAc;AACzC,SAASC,SAAS,QAAQ,qBAAoB;AAG9C,SAASC,kBAAkB,QAAQ,2CAA0C;AAC7E,SAASC,SAAS,QAAQ,iBAAgB;AAE1C,MAAMC,WAAW,aAAaJ,iBAAiBA,eAAeK,OAAO,GAAGL;AAExE,yGAAyG;AACzG,SAASM,gBAAgBC,KAAuB;IAC9C,MAAMC,cAAcD,MAAME,aAAa;IACvC,MAAMC,SAASF,YAAYG,YAAY,CAAC;IACxC,OACE,AAACD,UAAUA,WAAW,WACtBH,MAAMK,OAAO,IACbL,MAAMM,OAAO,IACbN,MAAMO,QAAQ,IACdP,MAAMQ,MAAM,IAAI,6BAA6B;IAC5CR,MAAMS,WAAW,IAAIT,MAAMS,WAAW,CAACC,KAAK,KAAK;AAEtD;AAGE;;;;GAIC,GAIH,OAAO,MAAMC,OAAwB,CAAC,EACpCC,QAAQ,EACRC,IAAI,EACJC,OAAO,EACPC,iBAAiB,IAAI,EACrBC,GAAG,EACHC,OAAO,EACPC,MAAM,EACN,GAAGC,MACJ;IACC,MAAMC,SAAS1B;IACf,MAAM,EAAE2B,oBAAoB,EAAE,GAAG1B;IAEjC,QACGE,SACCgB,MAAMA,MACNC,SAAS,CAACQ;QACR,IAAIvB,gBAAgBuB,IAAI;YACtB;QACF;QAEA,IAAIR,SAAS;YACXA,QAAQQ;QACV;QAEA,8EAA8E;QAC9E,wEAAwE;QACxE,IAAIP,gBAAgB;YAClBO,EAAEP,cAAc;QAClB;QAEAM,qBAAqB;YACnB,MAAME,MAAM,OAAOV,SAAS,WAAWA,OAAOjB,UAAUiB;YAExD,IAAII,SAAS;gBACX,KAAKG,OAAOH,OAAO,CAACM,KAAK;oBAAEL;gBAAO;YACpC,OAAO;gBACL,KAAKE,OAAOI,IAAI,CAACD,KAAK;oBAAEL;gBAAO;YACjC;QACF;IACF,GACAF,KAAKA,MACJ,GAAGG,IAAI,EACT;MACC,CAACP,SAAS;IACZ,EAAEf;AAEN,EAAC"}
+{"version":3,"sources":["../../../src/elements/Link/index.tsx"],"sourcesContent":["'use client'\nimport NextLinkImport from 'next/link.js'\nimport { useRouter } from 'next/navigation.js'\nimport React from 'react'\n\nimport { useRouteTransition } from '../../providers/RouteTransition/index.js'\nimport { formatUrl } from './formatUrl.js'\n\nconst NextLink = 'default' in NextLinkImport ? NextLinkImport.default : NextLinkImport\n\n// Copied from  https://github.com/vercel/next.js/blob/canary/packages/next/src/client/link.tsx#L180-L191\nfunction isModifiedEvent(event: React.MouseEvent): boolean {\n  const eventTarget = event.currentTarget as HTMLAnchorElement | SVGAElement\n  const target = eventTarget.getAttribute('target')\n  return (\n    (target && target !== '_self') ||\n    event.metaKey ||\n    event.ctrlKey ||\n    event.shiftKey ||\n    event.altKey || // triggers resource download\n    (event.nativeEvent && event.nativeEvent.which === 2)\n  )\n}\n\ntype Props = {\n  /**\n   * Disable the e.preventDefault() call on click if you want to handle it yourself via onClick\n   *\n   * @default true\n   */\n  preventDefault?: boolean\n} & Parameters<typeof NextLink>[0]\n\nexport const Link: React.FC<Props> = ({\n  children,\n  href,\n  onClick,\n  preventDefault = true,\n  ref,\n  replace,\n  scroll,\n  ...rest\n}) => {\n  const router = useRouter()\n  const { startRouteTransition } = useRouteTransition()\n\n  return (\n    <NextLink\n      href={href}\n      onClick={(e) => {\n        if (isModifiedEvent(e)) {\n          return\n        }\n\n        if (onClick) {\n          onClick(e)\n        }\n\n        // We need a preventDefault here so that a clicked link doesn't trigger twice,\n        // once for default browser navigation and once for startRouteTransition\n        if (preventDefault) {\n          e.preventDefault()\n        }\n\n        startRouteTransition(() => {\n          const url = typeof href === 'string' ? href : formatUrl(href)\n\n          if (replace) {\n            void router.replace(url, { scroll })\n          } else {\n            void router.push(url, { scroll })\n          }\n        })\n      }}\n      ref={ref}\n      {...rest}\n    >\n      {children}\n    </NextLink>\n  )\n}\n"],"names":["NextLinkImport","useRouter","React","useRouteTransition","formatUrl","NextLink","default","isModifiedEvent","event","eventTarget","currentTarget","target","getAttribute","metaKey","ctrlKey","shiftKey","altKey","nativeEvent","which","Link","children","href","onClick","preventDefault","ref","replace","scroll","rest","router","startRouteTransition","e","url","push"],"mappings":"AAAA;;AACA,OAAOA,oBAAoB,eAAc;AACzC,SAASC,SAAS,QAAQ,qBAAoB;AAC9C,OAAOC,WAAW,QAAO;AAEzB,SAASC,kBAAkB,QAAQ,2CAA0C;AAC7E,SAASC,SAAS,QAAQ,iBAAgB;AAE1C,MAAMC,WAAW,aAAaL,iBAAiBA,eAAeM,OAAO,GAAGN;AAExE,yGAAyG;AACzG,SAASO,gBAAgBC,KAAuB;IAC9C,MAAMC,cAAcD,MAAME,aAAa;IACvC,MAAMC,SAASF,YAAYG,YAAY,CAAC;IACxC,OACE,AAACD,UAAUA,WAAW,WACtBH,MAAMK,OAAO,IACbL,MAAMM,OAAO,IACbN,MAAMO,QAAQ,IACdP,MAAMQ,MAAM,IAAI,6BAA6B;IAC5CR,MAAMS,WAAW,IAAIT,MAAMS,WAAW,CAACC,KAAK,KAAK;AAEtD;AAGE;;;;GAIC,GAIH,OAAO,MAAMC,OAAwB,CAAC,EACpCC,QAAQ,EACRC,IAAI,EACJC,OAAO,EACPC,iBAAiB,IAAI,EACrBC,GAAG,EACHC,OAAO,EACPC,MAAM,EACN,GAAGC,MACJ;IACC,MAAMC,SAAS3B;IACf,MAAM,EAAE4B,oBAAoB,EAAE,GAAG1B;IAEjC,qBACE,QAACE;QACCgB,MAAMA;QACNC,SAAS,CAACQ;YACR,IAAIvB,gBAAgBuB,IAAI;gBACtB;YACF;YAEA,IAAIR,SAAS;gBACXA,QAAQQ;YACV;YAEA,8EAA8E;YAC9E,wEAAwE;YACxE,IAAIP,gBAAgB;gBAClBO,EAAEP,cAAc;YAClB;YAEAM,qBAAqB;gBACnB,MAAME,MAAM,OAAOV,SAAS,WAAWA,OAAOjB,UAAUiB;gBAExD,IAAII,SAAS;oBACX,KAAKG,OAAOH,OAAO,CAACM,KAAK;wBAAEL;oBAAO;gBACpC,OAAO;oBACL,KAAKE,OAAOI,IAAI,CAACD,KAAK;wBAAEL;oBAAO;gBACjC;YACF;QACF;QACAF,KAAKA;QACJ,GAAGG,IAAI;kBAEPP;;;;;;AAGP,EAAC"}

package/dist/elements/ListControls/index.js

@@ -1,4 +1,5 @@
 'use client';
+import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
 import { useWindowInfo } from '@faceless-ui/window-info';
 import { getTranslation } from '@payloadcms/translations';
 import { validateWhereQuery } from 'payload/shared';
@@ -72,38 +73,204 @@ const baseClass = 'list-controls';
         i18n,
         searchLabel
     ]);
-    return <div className={baseClass}>
-      {collectionConfig?.enableQueryPresets && !disableQueryPresets && <QueryPresetBar activePreset={activePreset} collectionSlug={collectionSlug} queryPresetPermissions={queryPresetPermissions}/>}
-      <SearchBar Actions={[
-        !smallBreak && <React.Fragment key="before-actions">{beforeActions && beforeActions}</React.Fragment>,
-        enableColumns && <Pill aria-controls={`${baseClass}-columns`} aria-expanded={visibleDrawer === 'columns'} className={`${baseClass}__toggle-columns`} icon={<ChevronIcon direction={visibleDrawer === 'columns' ? 'up' : 'down'}/>} id="toggle-list-columns" key="toggle-list-columns" onClick={()=>setVisibleDrawer(visibleDrawer !== 'columns' ? 'columns' : undefined)} pillStyle="light" size="small">
-              {t('general:columns')}
-            </Pill>,
-        enableFilters && <Pill aria-controls={`${baseClass}-where`} aria-expanded={visibleDrawer === 'where'} className={`${baseClass}__toggle-where`} icon={<ChevronIcon direction={visibleDrawer === 'where' ? 'up' : 'down'}/>} id="toggle-list-filters" key="toggle-list-filters" onClick={()=>setVisibleDrawer(visibleDrawer !== 'where' ? 'where' : undefined)} pillStyle="light" size="small">
-              {t('general:filters')}
-            </Pill>,
-        enableSort && <Pill aria-controls={`${baseClass}-sort`} aria-expanded={visibleDrawer === 'sort'} className={`${baseClass}__toggle-sort`} icon={<ChevronIcon/>} id="toggle-list-sort" key="toggle-list-sort" onClick={()=>setVisibleDrawer(visibleDrawer !== 'sort' ? 'sort' : undefined)} pillStyle="light" size="small">
-              {t('general:sort')}
-            </Pill>,
-        collectionConfig.admin.groupBy && <Pill aria-controls={`${baseClass}-group-by`} aria-expanded={visibleDrawer === 'group-by'} className={`${baseClass}__toggle-group-by`} icon={<ChevronIcon direction={visibleDrawer === 'group-by' ? 'up' : 'down'}/>} id="toggle-group-by" key="toggle-group-by" onClick={()=>setVisibleDrawer(visibleDrawer !== 'group-by' ? 'group-by' : undefined)} pillStyle="light" size="small">
-              {t('general:groupByLabel', {
-            label: ''
-        })}
-            </Pill>,
-        listMenuItems && Array.isArray(listMenuItems) && listMenuItems.length > 0 && <Popup button={<Dots ariaLabel={t('general:moreOptions')}/>} className={`${baseClass}__popup`} horizontalAlign="right" id="list-menu" key="list-menu" size="small" verticalAlign="bottom">
-              {listMenuItems.map((item, i)=><Fragment key={`list-menu-item-${i}`}>{item}</Fragment>)}
-            </Popup>
-    ].filter(Boolean)} key={collectionSlug} label={searchLabelTranslated.current} onSearchChange={handleSearchChange} searchQueryParam={query?.search}/>
-      {enableColumns && <AnimateHeight className={`${baseClass}__columns`} height={visibleDrawer === 'columns' ? 'auto' : 0} id={`${baseClass}-columns`}>
-          <ColumnSelector collectionSlug={collectionConfig.slug}/>
-        </AnimateHeight>}
-      <AnimateHeight className={`${baseClass}__where`} height={visibleDrawer === 'where' ? 'auto' : 0} id={`${baseClass}-where`}>
-        <WhereBuilder collectionPluralLabel={collectionConfig?.labels?.plural} collectionSlug={collectionConfig.slug} fields={collectionConfig?.fields} renderedFilters={renderedFilters} resolvedFilterOptions={resolvedFilterOptions}/>
-      </AnimateHeight>
-      {collectionConfig.admin.groupBy && <AnimateHeight className={`${baseClass}__group-by`} height={visibleDrawer === 'group-by' ? 'auto' : 0} id={`${baseClass}-group-by`}>
-          <GroupByBuilder collectionSlug={collectionConfig.slug} fields={collectionConfig.fields}/>
-        </AnimateHeight>}
-    </div>;
+    return /*#__PURE__*/ _jsxDEV("div", {
+        className: baseClass,
+        children: [
+            collectionConfig?.enableQueryPresets && !disableQueryPresets && /*#__PURE__*/ _jsxDEV(QueryPresetBar, {
+                activePreset: activePreset,
+                collectionSlug: collectionSlug,
+                queryPresetPermissions: queryPresetPermissions
+            }, void 0, false, {
+                fileName: "src/elements/ListControls/index.tsx",
+                lineNumber: 128,
+                columnNumber: 9
+            }, this),
+            /*#__PURE__*/ _jsxDEV(SearchBar, {
+                Actions: [
+                    !smallBreak && /*#__PURE__*/ _jsxDEV(React.Fragment, {
+                        children: beforeActions && beforeActions
+                    }, "before-actions", false, {
+                        fileName: "src/elements/ListControls/index.tsx",
+                        lineNumber: 137,
+                        columnNumber: 13
+                    }, void 0),
+                    enableColumns && /*#__PURE__*/ _jsxDEV(Pill, {
+                        "aria-controls": `${baseClass}-columns`,
+                        "aria-expanded": visibleDrawer === 'columns',
+                        className: `${baseClass}__toggle-columns`,
+                        icon: /*#__PURE__*/ _jsxDEV(ChevronIcon, {
+                            direction: visibleDrawer === 'columns' ? 'up' : 'down'
+                        }, void 0, false, {
+                            fileName: "src/elements/ListControls/index.tsx",
+                            lineNumber: 144,
+                            columnNumber: 21
+                        }, void 0),
+                        id: "toggle-list-columns",
+                        onClick: ()=>setVisibleDrawer(visibleDrawer !== 'columns' ? 'columns' : undefined),
+                        pillStyle: "light",
+                        size: "small",
+                        children: t('general:columns')
+                    }, "toggle-list-columns", false, {
+                        fileName: "src/elements/ListControls/index.tsx",
+                        lineNumber: 140,
+                        columnNumber: 13
+                    }, void 0),
+                    enableFilters && /*#__PURE__*/ _jsxDEV(Pill, {
+                        "aria-controls": `${baseClass}-where`,
+                        "aria-expanded": visibleDrawer === 'where',
+                        className: `${baseClass}__toggle-where`,
+                        icon: /*#__PURE__*/ _jsxDEV(ChevronIcon, {
+                            direction: visibleDrawer === 'where' ? 'up' : 'down'
+                        }, void 0, false, {
+                            fileName: "src/elements/ListControls/index.tsx",
+                            lineNumber: 159,
+                            columnNumber: 21
+                        }, void 0),
+                        id: "toggle-list-filters",
+                        onClick: ()=>setVisibleDrawer(visibleDrawer !== 'where' ? 'where' : undefined),
+                        pillStyle: "light",
+                        size: "small",
+                        children: t('general:filters')
+                    }, "toggle-list-filters", false, {
+                        fileName: "src/elements/ListControls/index.tsx",
+                        lineNumber: 155,
+                        columnNumber: 13
+                    }, void 0),
+                    enableSort && /*#__PURE__*/ _jsxDEV(Pill, {
+                        "aria-controls": `${baseClass}-sort`,
+                        "aria-expanded": visibleDrawer === 'sort',
+                        className: `${baseClass}__toggle-sort`,
+                        icon: /*#__PURE__*/ _jsxDEV(ChevronIcon, {}, void 0, false, {
+                            fileName: "src/elements/ListControls/index.tsx",
+                            lineNumber: 174,
+                            columnNumber: 21
+                        }, void 0),
+                        id: "toggle-list-sort",
+                        onClick: ()=>setVisibleDrawer(visibleDrawer !== 'sort' ? 'sort' : undefined),
+                        pillStyle: "light",
+                        size: "small",
+                        children: t('general:sort')
+                    }, "toggle-list-sort", false, {
+                        fileName: "src/elements/ListControls/index.tsx",
+                        lineNumber: 170,
+                        columnNumber: 13
+                    }, void 0),
+                    collectionConfig.admin.groupBy && /*#__PURE__*/ _jsxDEV(Pill, {
+                        "aria-controls": `${baseClass}-group-by`,
+                        "aria-expanded": visibleDrawer === 'group-by',
+                        className: `${baseClass}__toggle-group-by`,
+                        icon: /*#__PURE__*/ _jsxDEV(ChevronIcon, {
+                            direction: visibleDrawer === 'group-by' ? 'up' : 'down'
+                        }, void 0, false, {
+                            fileName: "src/elements/ListControls/index.tsx",
+                            lineNumber: 189,
+                            columnNumber: 21
+                        }, void 0),
+                        id: "toggle-group-by",
+                        onClick: ()=>setVisibleDrawer(visibleDrawer !== 'group-by' ? 'group-by' : undefined),
+                        pillStyle: "light",
+                        size: "small",
+                        children: t('general:groupByLabel', {
+                            label: ''
+                        })
+                    }, "toggle-group-by", false, {
+                        fileName: "src/elements/ListControls/index.tsx",
+                        lineNumber: 185,
+                        columnNumber: 13
+                    }, void 0),
+                    listMenuItems && Array.isArray(listMenuItems) && listMenuItems.length > 0 && /*#__PURE__*/ _jsxDEV(Popup, {
+                        button: /*#__PURE__*/ _jsxDEV(Dots, {
+                            ariaLabel: t('general:moreOptions')
+                        }, void 0, false, {
+                            fileName: "src/elements/ListControls/index.tsx",
+                            lineNumber: 205,
+                            columnNumber: 23
+                        }, void 0),
+                        className: `${baseClass}__popup`,
+                        horizontalAlign: "right",
+                        id: "list-menu",
+                        size: "small",
+                        verticalAlign: "bottom",
+                        children: listMenuItems.map((item, i)=>/*#__PURE__*/ _jsxDEV(Fragment, {
+                                children: item
+                            }, `list-menu-item-${i}`, false, {
+                                fileName: "src/elements/ListControls/index.tsx",
+                                lineNumber: 214,
+                                columnNumber: 17
+                            }, void 0))
+                    }, "list-menu", false, {
+                        fileName: "src/elements/ListControls/index.tsx",
+                        lineNumber: 204,
+                        columnNumber: 13
+                    }, void 0)
+                ].filter(Boolean),
+                label: searchLabelTranslated.current,
+                onSearchChange: handleSearchChange,
+                searchQueryParam: query?.search
+            }, collectionSlug, false, {
+                fileName: "src/elements/ListControls/index.tsx",
+                lineNumber: 134,
+                columnNumber: 7
+            }, this),
+            enableColumns && /*#__PURE__*/ _jsxDEV(AnimateHeight, {
+                className: `${baseClass}__columns`,
+                height: visibleDrawer === 'columns' ? 'auto' : 0,
+                id: `${baseClass}-columns`,
+                children: /*#__PURE__*/ _jsxDEV(ColumnSelector, {
+                    collectionSlug: collectionConfig.slug
+                }, void 0, false, {
+                    fileName: "src/elements/ListControls/index.tsx",
+                    lineNumber: 230,
+                    columnNumber: 11
+                }, this)
+            }, void 0, false, {
+                fileName: "src/elements/ListControls/index.tsx",
+                lineNumber: 225,
+                columnNumber: 9
+            }, this),
+            /*#__PURE__*/ _jsxDEV(AnimateHeight, {
+                className: `${baseClass}__where`,
+                height: visibleDrawer === 'where' ? 'auto' : 0,
+                id: `${baseClass}-where`,
+                children: /*#__PURE__*/ _jsxDEV(WhereBuilder, {
+                    collectionPluralLabel: collectionConfig?.labels?.plural,
+                    collectionSlug: collectionConfig.slug,
+                    fields: collectionConfig?.fields,
+                    renderedFilters: renderedFilters,
+                    resolvedFilterOptions: resolvedFilterOptions
+                }, void 0, false, {
+                    fileName: "src/elements/ListControls/index.tsx",
+                    lineNumber: 238,
+                    columnNumber: 9
+                }, this)
+            }, void 0, false, {
+                fileName: "src/elements/ListControls/index.tsx",
+                lineNumber: 233,
+                columnNumber: 7
+            }, this),
+            collectionConfig.admin.groupBy && /*#__PURE__*/ _jsxDEV(AnimateHeight, {
+                className: `${baseClass}__group-by`,
+                height: visibleDrawer === 'group-by' ? 'auto' : 0,
+                id: `${baseClass}-group-by`,
+                children: /*#__PURE__*/ _jsxDEV(GroupByBuilder, {
+                    collectionSlug: collectionConfig.slug,
+                    fields: collectionConfig.fields
+                }, void 0, false, {
+                    fileName: "src/elements/ListControls/index.tsx",
+                    lineNumber: 252,
+                    columnNumber: 11
+                }, this)
+            }, void 0, false, {
+                fileName: "src/elements/ListControls/index.tsx",
+                lineNumber: 247,
+                columnNumber: 9
+            }, this)
+        ]
+    }, void 0, true, {
+        fileName: "src/elements/ListControls/index.tsx",
+        lineNumber: 126,
+        columnNumber: 5
+    }, this);
 };
 
 //# sourceMappingURL=index.js.map