@payloadcms/ui 3.68.0-internal-debug.e9b66ee → 3.68.0-internal.10bf491

package/dist/elements/FolderView/SortByPill/index.js

@@ -1,3 +1,5 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import React from 'react';
 import { ChevronIcon } from '../../../icons/Chevron/index.js';
 import { SortDownIcon, SortUpIcon } from '../../../icons/Sort/index.js';
 import { useFolder } from '../../../providers/Folders/index.js';
@@ -6,80 +8,105 @@ import { Pill } from '../../Pill/index.js';
 import { Popup, PopupList } from '../../Popup/index.js';
 import './index.scss';
 const baseClass = 'sort-by-pill';
-const sortOnOptions = [
-    {
-        label: (t)=>t('general:name'),
-        value: 'name'
-    },
-    {
-        label: (t)=>t('general:createdAt'),
-        value: 'createdAt'
-    },
-    {
-        label: (t)=>t('general:updatedAt'),
-        value: 'updatedAt'
-    }
-];
-const orderOnOptions = [
-    {
-        label: (t)=><>
-        <SortUpIcon/>
-        {t('general:ascending')}
-      </>,
-        value: 'asc'
-    },
-    {
-        label: (t)=><>
-        <SortDownIcon/>
-        {t('general:descending')}
-      </>,
-        value: 'desc'
-    }
-];
+const sortOnOptions = [{
+  label: t => t('general:name'),
+  value: 'name'
+}, {
+  label: t => t('general:createdAt'),
+  value: 'createdAt'
+}, {
+  label: t => t('general:updatedAt'),
+  value: 'updatedAt'
+}];
+const orderOnOptions = [{
+  label: t => /*#__PURE__*/_jsxs(_Fragment, {
+    children: [/*#__PURE__*/_jsx(SortUpIcon, {}), t('general:ascending')]
+  }),
+  value: 'asc'
+}, {
+  label: t => /*#__PURE__*/_jsxs(_Fragment, {
+    children: [/*#__PURE__*/_jsx(SortDownIcon, {}), t('general:descending')]
+  }),
+  value: 'desc'
+}];
 export function SortByPill() {
-    const { refineFolderData, sort } = useFolder();
-    const { t } = useTranslation();
-    const sortDirection = sort.startsWith('-') ? 'desc' : 'asc';
-    const [selectedSortOption] = sortOnOptions.filter(({ value })=>value === (sort.startsWith('-') ? sort.slice(1) : sort)) || sortOnOptions;
-    const [selectedOrderOption] = orderOnOptions.filter(({ value })=>value === sortDirection);
-    return <Popup button={<Pill className={`${baseClass}__trigger`} icon={<ChevronIcon/>} size="small">
-          {sortDirection === 'asc' ? <SortUpIcon className={`${baseClass}__sort-icon`}/> : <SortDownIcon className={`${baseClass}__sort-icon`}/>}
-          {selectedSortOption?.label(t)}
-        </Pill>} className={baseClass} horizontalAlign="right" render={({ close })=><>
-          <PopupList.GroupLabel label="Sort by"/>
-          <PopupList.ButtonGroup>
-            {sortOnOptions.map(({ label, value })=><PopupList.Button active={selectedSortOption?.value === value} key={value} onClick={()=>{
-                refineFolderData({
-                    query: {
-                        page: '1',
-                        sort: sortDirection === 'desc' ? `-${value}` : value
-                    },
-                    updateURL: true
-                });
-                close();
-            }}>
-                {label(t)}
-              </PopupList.Button>)}
-          </PopupList.ButtonGroup>
-          <PopupList.Divider/>
-          <PopupList.GroupLabel label="Order"/>
-          <PopupList.ButtonGroup>
-            {orderOnOptions.map(({ label, value })=><PopupList.Button active={selectedOrderOption?.value === value} className={`${baseClass}__order-option`} key={value} onClick={()=>{
-                if (sortDirection !== value) {
-                    refineFolderData({
-                        query: {
-                            page: '1',
-                            sort: value === 'desc' ? `-${selectedSortOption?.value}` : selectedSortOption?.value
-                        },
-                        updateURL: true
-                    });
-                    close();
-                }
-            }}>
-                {label(t)}
-              </PopupList.Button>)}
-          </PopupList.ButtonGroup>
-        </>} showScrollbar verticalAlign="bottom"/>;
+  const {
+    refineFolderData,
+    sort
+  } = useFolder();
+  const {
+    t
+  } = useTranslation();
+  const sortDirection = sort.startsWith('-') ? 'desc' : 'asc';
+  const [selectedSortOption] = sortOnOptions.filter(({
+    value
+  }) => value === (sort.startsWith('-') ? sort.slice(1) : sort)) || sortOnOptions;
+  const [selectedOrderOption] = orderOnOptions.filter(({
+    value
+  }) => value === sortDirection);
+  return /*#__PURE__*/_jsx(Popup, {
+    button: /*#__PURE__*/_jsxs(Pill, {
+      className: `${baseClass}__trigger`,
+      icon: /*#__PURE__*/_jsx(ChevronIcon, {}),
+      size: "small",
+      children: [sortDirection === 'asc' ? /*#__PURE__*/_jsx(SortUpIcon, {
+        className: `${baseClass}__sort-icon`
+      }) : /*#__PURE__*/_jsx(SortDownIcon, {
+        className: `${baseClass}__sort-icon`
+      }), selectedSortOption?.label(t)]
+    }),
+    className: baseClass,
+    horizontalAlign: "right",
+    render: ({
+      close
+    }) => /*#__PURE__*/_jsxs(_Fragment, {
+      children: [/*#__PURE__*/_jsx(PopupList.GroupLabel, {
+        label: "Sort by"
+      }), /*#__PURE__*/_jsx(PopupList.ButtonGroup, {
+        children: sortOnOptions.map(({
+          label,
+          value
+        }) => /*#__PURE__*/_jsx(PopupList.Button, {
+          active: selectedSortOption?.value === value,
+          onClick: () => {
+            refineFolderData({
+              query: {
+                page: '1',
+                sort: sortDirection === 'desc' ? `-${value}` : value
+              },
+              updateURL: true
+            });
+            close();
+          },
+          children: label(t)
+        }, value))
+      }), /*#__PURE__*/_jsx(PopupList.Divider, {}), /*#__PURE__*/_jsx(PopupList.GroupLabel, {
+        label: "Order"
+      }), /*#__PURE__*/_jsx(PopupList.ButtonGroup, {
+        children: orderOnOptions.map(({
+          label,
+          value
+        }) => /*#__PURE__*/_jsx(PopupList.Button, {
+          active: selectedOrderOption?.value === value,
+          className: `${baseClass}__order-option`,
+          onClick: () => {
+            if (sortDirection !== value) {
+              refineFolderData({
+                query: {
+                  page: '1',
+                  sort: value === 'desc' ? `-${selectedSortOption?.value}` : selectedSortOption?.value
+                },
+                updateURL: true
+              });
+              close();
+            }
+          },
+          children: label(t)
+        }, value))
+      })]
+    }),
+    showScrollbar: true,
+    verticalAlign: "bottom"
+  });
 }
-
 //# sourceMappingURL=index.js.map

package/dist/elements/FolderView/SortByPill/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/elements/FolderView/SortByPill/index.tsx"],"sourcesContent":["import type { TFunction } from '@payloadcms/translations'\nimport type { FolderSortKeys } from 'payload'\n\nimport React from 'react'\n\nimport { ChevronIcon } from '../../../icons/Chevron/index.js'\nimport { SortDownIcon, SortUpIcon } from '../../../icons/Sort/index.js'\nimport { useFolder } from '../../../providers/Folders/index.js'\nimport { useTranslation } from '../../../providers/Translation/index.js'\nimport { Pill } from '../../Pill/index.js'\nimport { Popup, PopupList } from '../../Popup/index.js'\nimport './index.scss'\n\nconst baseClass = 'sort-by-pill'\n\nconst sortOnOptions: {\n  label: (t: TFunction) => React.ReactNode\n  value: FolderSortKeys\n}[] = [\n  { label: (t) => t('general:name'), value: 'name' },\n  { label: (t) => t('general:createdAt'), value: 'createdAt' },\n  { label: (t) => t('general:updatedAt'), value: 'updatedAt' },\n]\nconst orderOnOptions: {\n  label: (t: TFunction) => React.ReactNode\n  value: 'asc' | 'desc'\n}[] = [\n  {\n    label: (t) => (\n      <>\n        <SortUpIcon />\n        {t('general:ascending')}\n      </>\n    ),\n    value: 'asc',\n  },\n  {\n    label: (t) => (\n      <>\n        <SortDownIcon />\n        {t('general:descending')}\n      </>\n    ),\n    value: 'desc',\n  },\n]\nexport function SortByPill() {\n  const { refineFolderData, sort } = useFolder()\n  const { t } = useTranslation()\n  const sortDirection = sort.startsWith('-') ? 'desc' : 'asc'\n  const [selectedSortOption] =\n    sortOnOptions.filter(({ value }) => value === (sort.startsWith('-') ? sort.slice(1) : sort)) ||\n    sortOnOptions\n  const [selectedOrderOption] = orderOnOptions.filter(({ value }) => value === sortDirection)\n\n  return (\n    <Popup\n      button={\n        <Pill className={`${baseClass}__trigger`} icon={<ChevronIcon />} size=\"small\">\n          {sortDirection === 'asc' ? (\n            <SortUpIcon className={`${baseClass}__sort-icon`} />\n          ) : (\n            <SortDownIcon className={`${baseClass}__sort-icon`} />\n          )}\n          {selectedSortOption?.label(t)}\n        </Pill>\n      }\n      className={baseClass}\n      horizontalAlign=\"right\"\n      render={({ close }) => (\n        <>\n          <PopupList.GroupLabel label=\"Sort by\" />\n          <PopupList.ButtonGroup>\n            {sortOnOptions.map(({ label, value }) => (\n              <PopupList.Button\n                active={selectedSortOption?.value === value}\n                key={value}\n                onClick={() => {\n                  refineFolderData({\n                    query: {\n                      page: '1',\n                      sort: sortDirection === 'desc' ? `-${value}` : value,\n                    },\n                    updateURL: true,\n                  })\n                  close()\n                }}\n              >\n                {label(t)}\n              </PopupList.Button>\n            ))}\n          </PopupList.ButtonGroup>\n          <PopupList.Divider />\n          <PopupList.GroupLabel label=\"Order\" />\n          <PopupList.ButtonGroup>\n            {orderOnOptions.map(({ label, value }) => (\n              <PopupList.Button\n                active={selectedOrderOption?.value === value}\n                className={`${baseClass}__order-option`}\n                key={value}\n                onClick={() => {\n                  if (sortDirection !== value) {\n                    refineFolderData({\n                      query: {\n                        page: '1',\n                        sort:\n                          value === 'desc'\n                            ? `-${selectedSortOption?.value}`\n                            : selectedSortOption?.value,\n                      },\n                      updateURL: true,\n                    })\n                    close()\n                  }\n                }}\n              >\n                {label(t)}\n              </PopupList.Button>\n            ))}\n          </PopupList.ButtonGroup>\n        </>\n      )}\n      showScrollbar\n      verticalAlign=\"bottom\"\n    />\n  )\n}\n"],"names":["ChevronIcon","SortDownIcon","SortUpIcon","useFolder","useTranslation","Pill","Popup","PopupList","baseClass","sortOnOptions","label","t","value","orderOnOptions","SortByPill","refineFolderData","sort","sortDirection","startsWith","selectedSortOption","filter","slice","selectedOrderOption","button","className","icon","size","horizontalAlign","render","close","GroupLabel","ButtonGroup","map","Button","active","key","onClick","query","page","updateURL","Divider","showScrollbar","verticalAlign"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["React","ChevronIcon","SortDownIcon","SortUpIcon","useFolder","useTranslation","Pill","Popup","PopupList","baseClass","sortOnOptions","label","t","value","orderOnOptions","_jsxs","_Fragment","_jsx","SortByPill","refineFolderData","sort","sortDirection","startsWith","selectedSortOption","filter","slice","selectedOrderOption","button","className","icon","size","horizontalAlign","render","close","GroupLabel","ButtonGroup","map","Button","active","onClick","query","page","updateURL","Divider","showScrollbar","verticalAlign"],"sources":["../../../../src/elements/FolderView/SortByPill/index.tsx"],"sourcesContent":["import type { TFunction } from '@payloadcms/translations'\nimport type { FolderSortKeys } from 'payload'\n\nimport React from 'react'\n\nimport { ChevronIcon } from '../../../icons/Chevron/index.js'\nimport { SortDownIcon, SortUpIcon } from '../../../icons/Sort/index.js'\nimport { useFolder } from '../../../providers/Folders/index.js'\nimport { useTranslation } from '../../../providers/Translation/index.js'\nimport { Pill } from '../../Pill/index.js'\nimport { Popup, PopupList } from '../../Popup/index.js'\nimport './index.scss'\n\nconst baseClass = 'sort-by-pill'\n\nconst sortOnOptions: {\n  label: (t: TFunction) => React.ReactNode\n  value: FolderSortKeys\n}[] = [\n  { label: (t) => t('general:name'), value: 'name' },\n  { label: (t) => t('general:createdAt'), value: 'createdAt' },\n  { label: (t) => t('general:updatedAt'), value: 'updatedAt' },\n]\nconst orderOnOptions: {\n  label: (t: TFunction) => React.ReactNode\n  value: 'asc' | 'desc'\n}[] = [\n  {\n    label: (t) => (\n      <>\n        <SortUpIcon />\n        {t('general:ascending')}\n      </>\n    ),\n    value: 'asc',\n  },\n  {\n    label: (t) => (\n      <>\n        <SortDownIcon />\n        {t('general:descending')}\n      </>\n    ),\n    value: 'desc',\n  },\n]\nexport function SortByPill() {\n  const { refineFolderData, sort } = useFolder()\n  const { t } = useTranslation()\n  const sortDirection = sort.startsWith('-') ? 'desc' : 'asc'\n  const [selectedSortOption] =\n    sortOnOptions.filter(({ value }) => value === (sort.startsWith('-') ? sort.slice(1) : sort)) ||\n    sortOnOptions\n  const [selectedOrderOption] = orderOnOptions.filter(({ value }) => value === sortDirection)\n\n  return (\n    <Popup\n      button={\n        <Pill className={`${baseClass}__trigger`} icon={<ChevronIcon />} size=\"small\">\n          {sortDirection === 'asc' ? (\n            <SortUpIcon className={`${baseClass}__sort-icon`} />\n          ) : (\n            <SortDownIcon className={`${baseClass}__sort-icon`} />\n          )}\n          {selectedSortOption?.label(t)}\n        </Pill>\n      }\n      className={baseClass}\n      horizontalAlign=\"right\"\n      render={({ close }) => (\n        <>\n          <PopupList.GroupLabel label=\"Sort by\" />\n          <PopupList.ButtonGroup>\n            {sortOnOptions.map(({ label, value }) => (\n              <PopupList.Button\n                active={selectedSortOption?.value === value}\n                key={value}\n                onClick={() => {\n                  refineFolderData({\n                    query: {\n                      page: '1',\n                      sort: sortDirection === 'desc' ? `-${value}` : value,\n                    },\n                    updateURL: true,\n                  })\n                  close()\n                }}\n              >\n                {label(t)}\n              </PopupList.Button>\n            ))}\n          </PopupList.ButtonGroup>\n          <PopupList.Divider />\n          <PopupList.GroupLabel label=\"Order\" />\n          <PopupList.ButtonGroup>\n            {orderOnOptions.map(({ label, value }) => (\n              <PopupList.Button\n                active={selectedOrderOption?.value === value}\n                className={`${baseClass}__order-option`}\n                key={value}\n                onClick={() => {\n                  if (sortDirection !== value) {\n                    refineFolderData({\n                      query: {\n                        page: '1',\n                        sort:\n                          value === 'desc'\n                            ? `-${selectedSortOption?.value}`\n                            : selectedSortOption?.value,\n                      },\n                      updateURL: true,\n                    })\n                    close()\n                  }\n                }}\n              >\n                {label(t)}\n              </PopupList.Button>\n            ))}\n          </PopupList.ButtonGroup>\n        </>\n      )}\n      showScrollbar\n      verticalAlign=\"bottom\"\n    />\n  )\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/elements/FolderView/ToggleViewButtons/index.js

@@ -1,23 +1,31 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { GridViewIcon } from '../../../icons/GridView/index.js';
 import { ListViewIcon } from '../../../icons/ListView/index.js';
 import { Button } from '../../Button/index.js';
 import './index.scss';
 const baseClass = 'folder-view-toggle-button';
-export function ToggleViewButtons({ activeView, setActiveView }) {
-    return <>
-      <Button buttonStyle="pill" className={[
-        baseClass,
-        activeView === 'grid' && `${baseClass}--active`
-    ].filter(Boolean).join(' ')} icon={<GridViewIcon/>} margin={false} onClick={()=>{
+export function ToggleViewButtons({
+  activeView,
+  setActiveView
+}) {
+  return /*#__PURE__*/_jsxs(_Fragment, {
+    children: [/*#__PURE__*/_jsx(Button, {
+      buttonStyle: "pill",
+      className: [baseClass, activeView === 'grid' && `${baseClass}--active`].filter(Boolean).join(' '),
+      icon: /*#__PURE__*/_jsx(GridViewIcon, {}),
+      margin: false,
+      onClick: () => {
         setActiveView('grid');
-    }}/>
-      <Button buttonStyle="pill" className={[
-        baseClass,
-        activeView === 'list' && `${baseClass}--active`
-    ].filter(Boolean).join(' ')} icon={<ListViewIcon/>} margin={false} onClick={()=>{
+      }
+    }), /*#__PURE__*/_jsx(Button, {
+      buttonStyle: "pill",
+      className: [baseClass, activeView === 'list' && `${baseClass}--active`].filter(Boolean).join(' '),
+      icon: /*#__PURE__*/_jsx(ListViewIcon, {}),
+      margin: false,
+      onClick: () => {
         setActiveView('list');
-    }}/>
-    </>;
+      }
+    })]
+  });
 }
-
 //# sourceMappingURL=index.js.map

package/dist/elements/FolderView/ToggleViewButtons/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/elements/FolderView/ToggleViewButtons/index.tsx"],"sourcesContent":["import { GridViewIcon } from '../../../icons/GridView/index.js'\nimport { ListViewIcon } from '../../../icons/ListView/index.js'\nimport { Button } from '../../Button/index.js'\nimport './index.scss'\n\nconst baseClass = 'folder-view-toggle-button'\n\ntype Props = {\n  activeView: 'grid' | 'list'\n  setActiveView: (view: 'grid' | 'list') => void\n}\nexport function ToggleViewButtons({ activeView, setActiveView }: Props) {\n  return (\n    <>\n      <Button\n        buttonStyle=\"pill\"\n        className={[baseClass, activeView === 'grid' && `${baseClass}--active`]\n          .filter(Boolean)\n          .join(' ')}\n        icon={<GridViewIcon />}\n        margin={false}\n        onClick={() => {\n          setActiveView('grid')\n        }}\n      />\n      <Button\n        buttonStyle=\"pill\"\n        className={[baseClass, activeView === 'list' && `${baseClass}--active`]\n          .filter(Boolean)\n          .join(' ')}\n        icon={<ListViewIcon />}\n        margin={false}\n        onClick={() => {\n          setActiveView('list')\n        }}\n      />\n    </>\n  )\n}\n"],"names":["GridViewIcon","ListViewIcon","Button","baseClass","ToggleViewButtons","activeView","setActiveView","buttonStyle","className","filter","Boolean","join","icon","margin","onClick"],"mappings":"AAAA,SAASA,YAAY,QAAQ,mCAAkC;AAC/D,SAASC,YAAY,QAAQ,mCAAkC;AAC/D,SAASC,MAAM,QAAQ,wBAAuB;AAC9C,OAAO,eAAc;AAErB,MAAMC,YAAY;AAMlB,OAAO,SAASC,kBAAkB,EAAEC,UAAU,EAAEC,aAAa,EAAS;IACpE,SACI;MACA,CAACJ,OACCK,YAAY,OACZC,WAAW;QAACL;QAAWE,eAAe,UAAU,GAAGF,UAAU,QAAQ,CAAC;KAAC,CACpEM,MAAM,CAACC,SACPC,IAAI,CAAC,MACRC,OAAOZ,gBACPa,QAAQ,OACRC,SAAS;QACPR,cAAc;IAChB,IACA;MACF,CAACJ,OACCK,YAAY,OACZC,WAAW;QAACL;QAAWE,eAAe,UAAU,GAAGF,UAAU,QAAQ,CAAC;KAAC,CACpEM,MAAM,CAACC,SACPC,IAAI,CAAC,MACRC,OAAOX,gBACPY,QAAQ,OACRC,SAAS;QACPR,cAAc;IAChB,IACA;IACJ;AAEJ"}
+{"version":3,"file":"index.js","names":["GridViewIcon","ListViewIcon","Button","baseClass","ToggleViewButtons","activeView","setActiveView","_jsxs","_Fragment","_jsx","buttonStyle","className","filter","Boolean","join","icon","margin","onClick"],"sources":["../../../../src/elements/FolderView/ToggleViewButtons/index.tsx"],"sourcesContent":["import { GridViewIcon } from '../../../icons/GridView/index.js'\nimport { ListViewIcon } from '../../../icons/ListView/index.js'\nimport { Button } from '../../Button/index.js'\nimport './index.scss'\n\nconst baseClass = 'folder-view-toggle-button'\n\ntype Props = {\n  activeView: 'grid' | 'list'\n  setActiveView: (view: 'grid' | 'list') => void\n}\nexport function ToggleViewButtons({ activeView, setActiveView }: Props) {\n  return (\n    <>\n      <Button\n        buttonStyle=\"pill\"\n        className={[baseClass, activeView === 'grid' && `${baseClass}--active`]\n          .filter(Boolean)\n          .join(' ')}\n        icon={<GridViewIcon />}\n        margin={false}\n        onClick={() => {\n          setActiveView('grid')\n        }}\n      />\n      <Button\n        buttonStyle=\"pill\"\n        className={[baseClass, activeView === 'list' && `${baseClass}--active`]\n          .filter(Boolean)\n          .join(' ')}\n        icon={<ListViewIcon />}\n        margin={false}\n        onClick={() => {\n          setActiveView('list')\n        }}\n      />\n    </>\n  )\n}\n"],"mappings":";AAAA,SAASA,YAAY,QAAQ;AAC7B,SAASC,YAAY,QAAQ;AAC7B,SAASC,MAAM,QAAQ;AACvB,OAAO;AAEP,MAAMC,SAAA,GAAY;AAMlB,OAAO,SAASC,kBAAkB;EAAEC,UAAU;EAAEC;AAAa,CAAS;EACpE,oBACEC,KAAA,CAAAC,SAAA;4BACEC,IAAA,CAACP,MAAA;MACCQ,WAAA,EAAY;MACZC,SAAA,EAAW,CAACR,SAAA,EAAWE,UAAA,KAAe,UAAU,GAAGF,SAAA,UAAmB,CAAC,CACpES,MAAM,CAACC,OAAA,EACPC,IAAI,CAAC;MACRC,IAAA,eAAMN,IAAA,CAACT,YAAA;MACPgB,MAAA,EAAQ;MACRC,OAAA,EAASA,CAAA;QACPX,aAAA,CAAc;MAChB;qBAEFG,IAAA,CAACP,MAAA;MACCQ,WAAA,EAAY;MACZC,SAAA,EAAW,CAACR,SAAA,EAAWE,UAAA,KAAe,UAAU,GAAGF,SAAA,UAAmB,CAAC,CACpES,MAAM,CAACC,OAAA,EACPC,IAAI,CAAC;MACRC,IAAA,eAAMN,IAAA,CAACR,YAAA;MACPe,MAAA,EAAQ;MACRC,OAAA,EAASA,CAAA;QACPX,aAAA,CAAc;MAChB;;;AAIR","ignoreList":[]}

package/dist/elements/FullscreenModal/index.js

@@ -1,13 +1,29 @@
 'use client';
+
+import { c as _c } from "react/compiler-runtime";
+import { jsx as _jsx } from "react/jsx-runtime";
 import { Modal } from '@faceless-ui/modal';
+import React from 'react';
 import { useEditDepth } from '../../providers/EditDepth/index.js';
 export function FullscreenModal(props) {
-    const currentDepth = useEditDepth();
-    return <Modal // Fixes https://github.com/payloadcms/payload/issues/13778
-    closeOnBlur={false} {...props} style={{
-        ...props.style || {},
+  const $ = _c(3);
+  const currentDepth = useEditDepth();
+  let t0;
+  if ($[0] !== currentDepth || $[1] !== props) {
+    t0 = _jsx(Modal, {
+      closeOnBlur: false,
+      ...props,
+      style: {
+        ...(props.style || {}),
         zIndex: `calc(100 + ${currentDepth || 0} + 1)`
-    }}/>;
+      }
+    });
+    $[0] = currentDepth;
+    $[1] = props;
+    $[2] = t0;
+  } else {
+    t0 = $[2];
+  }
+  return t0;
 }
-
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/FullscreenModal/index.tsx"],"sourcesContent":["'use client'\nimport type { Modal as ModalType } from '@faceless-ui/modal'\n\nimport { Modal } from '@faceless-ui/modal'\nimport React from 'react'\n\nimport { useEditDepth } from '../../providers/EditDepth/index.js'\n\nexport function FullscreenModal(props: Parameters<typeof ModalType>[0]) {\n  const currentDepth = useEditDepth()\n\n  return (\n    <Modal\n      // Fixes https://github.com/payloadcms/payload/issues/13778\n      closeOnBlur={false}\n      {...props}\n      style={{\n        ...(props.style || {}),\n        zIndex: `calc(100 + ${currentDepth || 0} + 1)`,\n      }}\n    />\n  )\n}\n"],"names":["Modal","useEditDepth","FullscreenModal","props","currentDepth","closeOnBlur","style","zIndex"],"mappings":"AAAA;AAGA,SAASA,KAAK,QAAQ,qBAAoB;AAG1C,SAASC,YAAY,QAAQ,qCAAoC;AAEjE,OAAO,SAASC,gBAAgBC,KAAsC;IACpE,MAAMC,eAAeH;IAErB,QACGD,MACC,2DAA2D;IAC3DK,aAAa,QACZ,GAAGF,KAAK,EACTG,OAAO;QACL,GAAIH,MAAMG,KAAK,IAAI,CAAC,CAAC;QACrBC,QAAQ,CAAC,WAAW,EAAEH,gBAAgB,EAAE,KAAK,CAAC;IAChD;AAGN"}
+{"version":3,"file":"index.js","names":["c","_c","Modal","React","useEditDepth","FullscreenModal","props","$","currentDepth","t0","_jsx","closeOnBlur","style","zIndex"],"sources":["../../../src/elements/FullscreenModal/index.tsx"],"sourcesContent":["'use client'\nimport type { Modal as ModalType } from '@faceless-ui/modal'\n\nimport { Modal } from '@faceless-ui/modal'\nimport React from 'react'\n\nimport { useEditDepth } from '../../providers/EditDepth/index.js'\n\nexport function FullscreenModal(props: Parameters<typeof ModalType>[0]) {\n  const currentDepth = useEditDepth()\n\n  return (\n    <Modal\n      // Fixes https://github.com/payloadcms/payload/issues/13778\n      closeOnBlur={false}\n      {...props}\n      style={{\n        ...(props.style || {}),\n        zIndex: `calc(100 + ${currentDepth || 0} + 1)`,\n      }}\n    />\n  )\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AAGA,SAASC,KAAK,QAAQ;AACtB,OAAOC,KAAA,MAAW;AAElB,SAASC,YAAY,QAAQ;AAE7B,OAAO,SAAAC,gBAAAC,KAAA;EAAA,MAAAC,CAAA,GAAAN,EAAA;EACL,MAAAO,YAAA,GAAqBJ,YAAA;EAAA,IAAAK,EAAA;EAAA,IAAAF,CAAA,QAAAC,YAAA,IAAAD,CAAA,QAAAD,KAAA;IAGnBG,EAAA,GAAAC,IAAA,CAAAR,KAAA;MAAAS,WAAA;MAAA,GAGML,KAAK;MAAAM,KAAA;QAAA,IAEHN,KAAA,CAAAM,KAAA,MAAiB;QAAAC,MAAA,EACb,cAAcL,YAAA,KAAgB;MAAQ;IAAA,C;;;;;;;SANlDC,E","ignoreList":[]}

package/dist/elements/GenerateConfirmation/index.js

@@ -1,4 +1,7 @@
 'use client';
+
+import { c as _c } from "react/compiler-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useModal } from '@faceless-ui/modal';
 import React, { useCallback } from 'react';
 import { toast } from 'sonner';
@@ -8,30 +11,85 @@ import { Button } from '../Button/index.js';
 import { ConfirmationModal } from '../ConfirmationModal/index.js';
 import { Translation } from '../Translation/index.js';
 export function GenerateConfirmation(props) {
-    const { highlightField, setKey } = props;
-    const { id } = useDocumentInfo();
-    const { toggleModal } = useModal();
-    const { t } = useTranslation();
-    const modalSlug = `generate-confirmation-${id}`;
-    const handleGenerate = useCallback(()=>{
-        setKey();
-        toast.success(t('authentication:newAPIKeyGenerated'));
-        highlightField(true);
-    }, [
-        highlightField,
-        setKey,
-        t
-    ]);
-    return <React.Fragment>
-      <Button buttonStyle="secondary" onClick={()=>{
-        toggleModal(modalSlug);
-    }} size="small">
-        {t('authentication:generateNewAPIKey')}
-      </Button>
-      <ConfirmationModal body={<Translation elements={{
-        1: ({ children })=><strong>{children}</strong>
-    }} i18nKey="authentication:generatingNewAPIKeyWillInvalidate" t={t}/>} confirmLabel={t('authentication:generate')} heading={t('authentication:confirmGeneration')} modalSlug={modalSlug} onConfirm={handleGenerate}/>
-    </React.Fragment>;
+  const $ = _c(12);
+  const {
+    highlightField,
+    setKey
+  } = props;
+  const {
+    id
+  } = useDocumentInfo();
+  const {
+    toggleModal
+  } = useModal();
+  const {
+    t
+  } = useTranslation();
+  const modalSlug = `generate-confirmation-${id}`;
+  let t0;
+  if ($[0] !== highlightField || $[1] !== setKey || $[2] !== t) {
+    t0 = () => {
+      setKey();
+      toast.success(t("authentication:newAPIKeyGenerated"));
+      highlightField(true);
+    };
+    $[0] = highlightField;
+    $[1] = setKey;
+    $[2] = t;
+    $[3] = t0;
+  } else {
+    t0 = $[3];
+  }
+  const handleGenerate = t0;
+  let t1;
+  if ($[4] !== modalSlug || $[5] !== toggleModal) {
+    t1 = () => {
+      toggleModal(modalSlug);
+    };
+    $[4] = modalSlug;
+    $[5] = toggleModal;
+    $[6] = t1;
+  } else {
+    t1 = $[6];
+  }
+  let t2;
+  if ($[7] !== handleGenerate || $[8] !== modalSlug || $[9] !== t || $[10] !== t1) {
+    t2 = _jsxs(React.Fragment, {
+      children: [_jsx(Button, {
+        buttonStyle: "secondary",
+        onClick: t1,
+        size: "small",
+        children: t("authentication:generateNewAPIKey")
+      }), _jsx(ConfirmationModal, {
+        body: _jsx(Translation, {
+          elements: {
+            1: _temp
+          },
+          i18nKey: "authentication:generatingNewAPIKeyWillInvalidate",
+          t
+        }),
+        confirmLabel: t("authentication:generate"),
+        heading: t("authentication:confirmGeneration"),
+        modalSlug,
+        onConfirm: handleGenerate
+      })]
+    });
+    $[7] = handleGenerate;
+    $[8] = modalSlug;
+    $[9] = t;
+    $[10] = t1;
+    $[11] = t2;
+  } else {
+    t2 = $[11];
+  }
+  return t2;
+}
+function _temp(t0) {
+  const {
+    children
+  } = t0;
+  return _jsx("strong", {
+    children
+  });
 }
-
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/GenerateConfirmation/index.tsx"],"sourcesContent":["'use client'\nimport { useModal } from '@faceless-ui/modal'\nimport React, { useCallback } from 'react'\nimport { toast } from 'sonner'\n\nimport { useDocumentInfo } from '../../providers/DocumentInfo/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { Button } from '../Button/index.js'\nimport { ConfirmationModal } from '../ConfirmationModal/index.js'\nimport { Translation } from '../Translation/index.js'\n\nexport type GenerateConfirmationProps = {\n  highlightField: (Boolean) => void\n  setKey: () => void\n}\n\nexport function GenerateConfirmation(props: GenerateConfirmationProps) {\n  const { highlightField, setKey } = props\n\n  const { id } = useDocumentInfo()\n  const { toggleModal } = useModal()\n  const { t } = useTranslation()\n\n  const modalSlug = `generate-confirmation-${id}`\n\n  const handleGenerate = useCallback(() => {\n    setKey()\n    toast.success(t('authentication:newAPIKeyGenerated'))\n    highlightField(true)\n  }, [highlightField, setKey, t])\n\n  return (\n    <React.Fragment>\n      <Button\n        buttonStyle=\"secondary\"\n        onClick={() => {\n          toggleModal(modalSlug)\n        }}\n        size=\"small\"\n      >\n        {t('authentication:generateNewAPIKey')}\n      </Button>\n      <ConfirmationModal\n        body={\n          <Translation\n            elements={{\n              1: ({ children }) => <strong>{children}</strong>,\n            }}\n            i18nKey=\"authentication:generatingNewAPIKeyWillInvalidate\"\n            t={t}\n          />\n        }\n        confirmLabel={t('authentication:generate')}\n        heading={t('authentication:confirmGeneration')}\n        modalSlug={modalSlug}\n        onConfirm={handleGenerate}\n      />\n    </React.Fragment>\n  )\n}\n"],"names":["useModal","React","useCallback","toast","useDocumentInfo","useTranslation","Button","ConfirmationModal","Translation","GenerateConfirmation","props","highlightField","setKey","id","toggleModal","t","modalSlug","handleGenerate","success","Fragment","buttonStyle","onClick","size","body","elements","children","strong","i18nKey","confirmLabel","heading","onConfirm"],"mappings":"AAAA;AACA,SAASA,QAAQ,QAAQ,qBAAoB;AAC7C,OAAOC,SAASC,WAAW,QAAQ,QAAO;AAC1C,SAASC,KAAK,QAAQ,SAAQ;AAE9B,SAASC,eAAe,QAAQ,wCAAuC;AACvE,SAASC,cAAc,QAAQ,uCAAsC;AACrE,SAASC,MAAM,QAAQ,qBAAoB;AAC3C,SAASC,iBAAiB,QAAQ,gCAA+B;AACjE,SAASC,WAAW,QAAQ,0BAAyB;AAOrD,OAAO,SAASC,qBAAqBC,KAAgC;IACnE,MAAM,EAAEC,cAAc,EAAEC,MAAM,EAAE,GAAGF;IAEnC,MAAM,EAAEG,EAAE,EAAE,GAAGT;IACf,MAAM,EAAEU,WAAW,EAAE,GAAGd;IACxB,MAAM,EAAEe,CAAC,EAAE,GAAGV;IAEd,MAAMW,YAAY,CAAC,sBAAsB,EAAEH,IAAI;IAE/C,MAAMI,iBAAiBf,YAAY;QACjCU;QACAT,MAAMe,OAAO,CAACH,EAAE;QAChBJ,eAAe;IACjB,GAAG;QAACA;QAAgBC;QAAQG;KAAE;IAE9B,QACGd,MAAMkB,SAAS;MACd,CAACb,OACCc,YAAY,YACZC,SAAS;QACPP,YAAYE;IACd,GACAM,KAAK,QACN;QACC,CAACP,EAAE,oCAAoC;MACzC,EAAET,OAAO;MACT,CAACC,kBACCgB,OACGf,YACCgB,UAAU;QACR,GAAG,CAAC,EAAEC,QAAQ,EAAE,IAAMC,QAAQD,WAAWC;IAC3C,GACAC,QAAQ,mDACRZ,GAAGA,MAGPa,cAAcb,EAAE,4BAChBc,SAASd,EAAE,qCACXC,WAAWA,WACXc,WAAWb,iBACX;IACJ,EAAEhB,MAAMkB;AAEZ"}
+{"version":3,"file":"index.js","names":["c","_c","useModal","React","useCallback","toast","useDocumentInfo","useTranslation","Button","ConfirmationModal","Translation","GenerateConfirmation","props","$","highlightField","setKey","id","toggleModal","t","modalSlug","t0","success","handleGenerate","t1","t2","_jsxs","Fragment","children","_jsx","buttonStyle","onClick","size","body","elements","1","_temp","i18nKey","heading","onConfirm"],"sources":["../../../src/elements/GenerateConfirmation/index.tsx"],"sourcesContent":["'use client'\nimport { useModal } from '@faceless-ui/modal'\nimport React, { useCallback } from 'react'\nimport { toast } from 'sonner'\n\nimport { useDocumentInfo } from '../../providers/DocumentInfo/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { Button } from '../Button/index.js'\nimport { ConfirmationModal } from '../ConfirmationModal/index.js'\nimport { Translation } from '../Translation/index.js'\n\nexport type GenerateConfirmationProps = {\n  highlightField: (Boolean) => void\n  setKey: () => void\n}\n\nexport function GenerateConfirmation(props: GenerateConfirmationProps) {\n  const { highlightField, setKey } = props\n\n  const { id } = useDocumentInfo()\n  const { toggleModal } = useModal()\n  const { t } = useTranslation()\n\n  const modalSlug = `generate-confirmation-${id}`\n\n  const handleGenerate = useCallback(() => {\n    setKey()\n    toast.success(t('authentication:newAPIKeyGenerated'))\n    highlightField(true)\n  }, [highlightField, setKey, t])\n\n  return (\n    <React.Fragment>\n      <Button\n        buttonStyle=\"secondary\"\n        onClick={() => {\n          toggleModal(modalSlug)\n        }}\n        size=\"small\"\n      >\n        {t('authentication:generateNewAPIKey')}\n      </Button>\n      <ConfirmationModal\n        body={\n          <Translation\n            elements={{\n              1: ({ children }) => <strong>{children}</strong>,\n            }}\n            i18nKey=\"authentication:generatingNewAPIKeyWillInvalidate\"\n            t={t}\n          />\n        }\n        confirmLabel={t('authentication:generate')}\n        heading={t('authentication:confirmGeneration')}\n        modalSlug={modalSlug}\n        onConfirm={handleGenerate}\n      />\n    </React.Fragment>\n  )\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AACA,SAASC,QAAQ,QAAQ;AACzB,OAAOC,KAAA,IAASC,WAAW,QAAQ;AACnC,SAASC,KAAK,QAAQ;AAEtB,SAASC,eAAe,QAAQ;AAChC,SAASC,cAAc,QAAQ;AAC/B,SAASC,MAAM,QAAQ;AACvB,SAASC,iBAAiB,QAAQ;AAClC,SAASC,WAAW,QAAQ;AAO5B,OAAO,SAAAC,qBAAAC,KAAA;EAAA,MAAAC,CAAA,GAAAZ,EAAA;EACL;IAAAa,cAAA;IAAAC;EAAA,IAAmCH,KAAA;EAEnC;IAAAI;EAAA,IAAeV,eAAA;EACf;IAAAW;EAAA,IAAwBf,QAAA;EACxB;IAAAgB;EAAA,IAAcX,cAAA;EAEd,MAAAY,SAAA,GAAkB,yBAAyBH,EAAA,EAAI;EAAA,IAAAI,EAAA;EAAA,IAAAP,CAAA,QAAAC,cAAA,IAAAD,CAAA,QAAAE,MAAA,IAAAF,CAAA,QAAAK,CAAA;IAEZE,EAAA,GAAAA,CAAA;MACjCL,MAAA;MACAV,KAAA,CAAAgB,OAAA,CAAcH,CAAA,CAAE;MAChBJ,cAAA,KAAe;IAAA;IACjBD,CAAA,MAAAC,cAAA;IAAAD,CAAA,MAAAE,MAAA;IAAAF,CAAA,MAAAK,CAAA;IAAAL,CAAA,MAAAO,EAAA;EAAA;IAAAA,EAAA,GAAAP,CAAA;EAAA;EAJA,MAAAS,cAAA,GAAuBF,EAIO;EAAA,IAAAG,EAAA;EAAA,IAAAV,CAAA,QAAAM,SAAA,IAAAN,CAAA,QAAAI,WAAA;IAMfM,EAAA,GAAAA,CAAA;MACPN,WAAA,CAAYE,SAAA;IAAA;IACdN,CAAA,MAAAM,SAAA;IAAAN,CAAA,MAAAI,WAAA;IAAAJ,CAAA,MAAAU,EAAA;EAAA;IAAAA,EAAA,GAAAV,CAAA;EAAA;EAAA,IAAAW,EAAA;EAAA,IAAAX,CAAA,QAAAS,cAAA,IAAAT,CAAA,QAAAM,SAAA,IAAAN,CAAA,QAAAK,CAAA,IAAAL,CAAA,SAAAU,EAAA;IALJC,EAAA,GAAAC,KAAA,CAAAtB,KAAA,CAAAuB,QAAA;MAAAC,QAAA,GACEC,IAAA,CAAApB,MAAA;QAAAqB,WAAA,EACc;QAAAC,OAAA,EACHP,EAET;QAAAQ,IAAA,EACK;QAAAJ,QAAA,EAEJT,CAAA,CAAE;MAAA,C,GAELU,IAAA,CAAAnB,iBAAA;QAAAuB,IAAA,EAEIJ,IAAA,CAAAlB,WAAA;UAAAuB,QAAA;YAAAC,CAAA,EAAAC;UAAA;UAAAC,OAAA,EAIU;UAAAlB;QAAA,C;sBAIEA,CAAA,CAAE;QAAAmB,OAAA,EACPnB,CAAA,CAAE;QAAAC,SAAA;QAAAmB,SAAA,EAEAhB;MAAA,C;;;;;;;;;;SAvBfE,E;;AAhBG,SAAAW,MAAAf,EAAA;EA8BW;IAAAO;EAAA,IAAAP,EAAY;EAAA,OAAKQ,IAAA,CAAC;IAAAD;EAAA,C","ignoreList":[]}