@payloadcms/ui 3.68.0-internal-debug.591ab42 → 3.68.0-internal-debug.e9b66ee

package/dist/elements/LivePreview/Window/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/elements/LivePreview/Window/index.tsx"],"sourcesContent":["'use client'\n\nimport type { EditViewProps } from 'payload'\n\nimport { reduceFieldsToValues } from 'payload/shared'\nimport React, { useEffect } from 'react'\n\nimport { useAllFormFields } from '../../../forms/Form/context.js'\nimport { useDocumentEvents } from '../../../providers/DocumentEvents/index.js'\nimport { useDocumentInfo } from '../../../providers/DocumentInfo/index.js'\nimport { useLivePreviewContext } from '../../../providers/LivePreview/context.js'\nimport { useLocale } from '../../../providers/Locale/index.js'\nimport { ShimmerEffect } from '../../ShimmerEffect/index.js'\nimport { DeviceContainer } from '../Device/index.js'\nimport { IFrame } from '../IFrame/index.js'\nimport { LivePreviewToolbar } from '../Toolbar/index.js'\nimport './index.scss'\n\nconst baseClass = 'live-preview-window'\n\nexport const LivePreviewWindow: React.FC<EditViewProps> = (props) => {\n  const {\n    appIsReady,\n    breakpoint,\n    iframeRef,\n    isLivePreviewing,\n    loadedURL,\n    popupRef,\n    previewWindowType,\n    url,\n  } = useLivePreviewContext()\n\n  const locale = useLocale()\n\n  const { mostRecentUpdate } = useDocumentEvents()\n\n  const [formState] = useAllFormFields()\n  const { id, collectionSlug, globalSlug } = useDocumentInfo()\n\n  /**\n   * For client-side apps, send data through `window.postMessage`\n   * The preview could either be an iframe embedded on the page\n   * Or it could be a separate popup window\n   * We need to transmit data to both accordingly\n   */\n  useEffect(() => {\n    if (!isLivePreviewing || !appIsReady) {\n      return\n    }\n\n    // For performance, do not reduce fields to values until after the iframe or popup has loaded\n    if (formState) {\n      const values = reduceFieldsToValues(formState, true)\n\n      if (!values.id) {\n        values.id = id\n      }\n\n      const message = {\n        type: 'payload-live-preview',\n        collectionSlug,\n        data: values,\n        externallyUpdatedRelationship: mostRecentUpdate,\n        globalSlug,\n        locale: locale.code,\n      }\n\n      // Post message to external popup window\n      if (previewWindowType === 'popup' && popupRef.current) {\n        popupRef.current.postMessage(message, url)\n      }\n\n      // Post message to embedded iframe\n      if (previewWindowType === 'iframe' && iframeRef.current) {\n        iframeRef.current.contentWindow?.postMessage(message, url)\n      }\n    }\n  }, [\n    formState,\n    url,\n    collectionSlug,\n    globalSlug,\n    id,\n    previewWindowType,\n    popupRef,\n    appIsReady,\n    iframeRef,\n    mostRecentUpdate,\n    locale,\n    isLivePreviewing,\n    loadedURL,\n  ])\n\n  /**\n   * To support SSR, we transmit a `window.postMessage` event without a payload\n   * This is because the event will ultimately trigger a server-side roundtrip\n   * i.e., save, save draft, autosave, etc. will fire `router.refresh()`\n   */\n  useEffect(() => {\n    if (!isLivePreviewing || !appIsReady) {\n      return\n    }\n\n    const message = {\n      type: 'payload-document-event',\n    }\n\n    // Post message to external popup window\n    if (previewWindowType === 'popup' && popupRef.current) {\n      popupRef.current.postMessage(message, url)\n    }\n\n    // Post message to embedded iframe\n    if (previewWindowType === 'iframe' && iframeRef.current) {\n      iframeRef.current.contentWindow?.postMessage(message, url)\n    }\n  }, [mostRecentUpdate, iframeRef, popupRef, previewWindowType, url, isLivePreviewing, appIsReady])\n\n  if (previewWindowType !== 'iframe') {\n    return null\n  }\n\n  return (\n    <div\n      className={[\n        baseClass,\n        isLivePreviewing && `${baseClass}--is-live-previewing`,\n        breakpoint && breakpoint !== 'responsive' && `${baseClass}--has-breakpoint`,\n      ]\n        .filter(Boolean)\n        .join(' ')}\n    >\n      <div className={`${baseClass}__wrapper`}>\n        <LivePreviewToolbar {...props} />\n        <div className={`${baseClass}__main`}>\n          <DeviceContainer>{url ? <IFrame /> : <ShimmerEffect height=\"100%\" />}</DeviceContainer>\n        </div>\n      </div>\n    </div>\n  )\n}\n"],"names":["reduceFieldsToValues","React","useEffect","useAllFormFields","useDocumentEvents","useDocumentInfo","useLivePreviewContext","useLocale","ShimmerEffect","DeviceContainer","IFrame","LivePreviewToolbar","baseClass","LivePreviewWindow","props","appIsReady","breakpoint","iframeRef","isLivePreviewing","loadedURL","popupRef","previewWindowType","url","locale","mostRecentUpdate","formState","id","collectionSlug","globalSlug","values","message","type","data","externallyUpdatedRelationship","code","current","postMessage","contentWindow","div","className","filter","Boolean","join","height"],"mappings":"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"}
+{"version":3,"sources":["../../../../src/elements/LivePreview/Window/index.tsx"],"sourcesContent":["'use client'\n\nimport type { EditViewProps } from 'payload'\n\nimport { reduceFieldsToValues } from 'payload/shared'\nimport React, { useEffect } from 'react'\n\nimport { useAllFormFields } from '../../../forms/Form/context.js'\nimport { useDocumentEvents } from '../../../providers/DocumentEvents/index.js'\nimport { useDocumentInfo } from '../../../providers/DocumentInfo/index.js'\nimport { useLivePreviewContext } from '../../../providers/LivePreview/context.js'\nimport { useLocale } from '../../../providers/Locale/index.js'\nimport { ShimmerEffect } from '../../ShimmerEffect/index.js'\nimport { DeviceContainer } from '../Device/index.js'\nimport { IFrame } from '../IFrame/index.js'\nimport { LivePreviewToolbar } from '../Toolbar/index.js'\nimport './index.scss'\n\nconst baseClass = 'live-preview-window'\n\nexport const LivePreviewWindow: React.FC<EditViewProps> = (props) => {\n  const {\n    appIsReady,\n    breakpoint,\n    iframeRef,\n    isLivePreviewing,\n    loadedURL,\n    popupRef,\n    previewWindowType,\n    url,\n  } = useLivePreviewContext()\n\n  const locale = useLocale()\n\n  const { mostRecentUpdate } = useDocumentEvents()\n\n  const [formState] = useAllFormFields()\n  const { id, collectionSlug, globalSlug } = useDocumentInfo()\n\n  /**\n   * For client-side apps, send data through `window.postMessage`\n   * The preview could either be an iframe embedded on the page\n   * Or it could be a separate popup window\n   * We need to transmit data to both accordingly\n   */\n  useEffect(() => {\n    if (!isLivePreviewing || !appIsReady) {\n      return\n    }\n\n    // For performance, do not reduce fields to values until after the iframe or popup has loaded\n    if (formState) {\n      const values = reduceFieldsToValues(formState, true)\n\n      if (!values.id) {\n        values.id = id\n      }\n\n      const message = {\n        type: 'payload-live-preview',\n        collectionSlug,\n        data: values,\n        externallyUpdatedRelationship: mostRecentUpdate,\n        globalSlug,\n        locale: locale.code,\n      }\n\n      // Post message to external popup window\n      if (previewWindowType === 'popup' && popupRef.current) {\n        popupRef.current.postMessage(message, url)\n      }\n\n      // Post message to embedded iframe\n      if (previewWindowType === 'iframe' && iframeRef.current) {\n        iframeRef.current.contentWindow?.postMessage(message, url)\n      }\n    }\n  }, [\n    formState,\n    url,\n    collectionSlug,\n    globalSlug,\n    id,\n    previewWindowType,\n    popupRef,\n    appIsReady,\n    iframeRef,\n    mostRecentUpdate,\n    locale,\n    isLivePreviewing,\n    loadedURL,\n  ])\n\n  /**\n   * To support SSR, we transmit a `window.postMessage` event without a payload\n   * This is because the event will ultimately trigger a server-side roundtrip\n   * i.e., save, save draft, autosave, etc. will fire `router.refresh()`\n   */\n  useEffect(() => {\n    if (!isLivePreviewing || !appIsReady) {\n      return\n    }\n\n    const message = {\n      type: 'payload-document-event',\n    }\n\n    // Post message to external popup window\n    if (previewWindowType === 'popup' && popupRef.current) {\n      popupRef.current.postMessage(message, url)\n    }\n\n    // Post message to embedded iframe\n    if (previewWindowType === 'iframe' && iframeRef.current) {\n      iframeRef.current.contentWindow?.postMessage(message, url)\n    }\n  }, [mostRecentUpdate, iframeRef, popupRef, previewWindowType, url, isLivePreviewing, appIsReady])\n\n  if (previewWindowType !== 'iframe') {\n    return null\n  }\n\n  return (\n    <div\n      className={[\n        baseClass,\n        isLivePreviewing && `${baseClass}--is-live-previewing`,\n        breakpoint && breakpoint !== 'responsive' && `${baseClass}--has-breakpoint`,\n      ]\n        .filter(Boolean)\n        .join(' ')}\n    >\n      <div className={`${baseClass}__wrapper`}>\n        <LivePreviewToolbar {...props} />\n        <div className={`${baseClass}__main`}>\n          <DeviceContainer>{url ? <IFrame /> : <ShimmerEffect height=\"100%\" />}</DeviceContainer>\n        </div>\n      </div>\n    </div>\n  )\n}\n"],"names":["reduceFieldsToValues","useEffect","useAllFormFields","useDocumentEvents","useDocumentInfo","useLivePreviewContext","useLocale","ShimmerEffect","DeviceContainer","IFrame","LivePreviewToolbar","baseClass","LivePreviewWindow","props","appIsReady","breakpoint","iframeRef","isLivePreviewing","loadedURL","popupRef","previewWindowType","url","locale","mostRecentUpdate","formState","id","collectionSlug","globalSlug","values","message","type","data","externallyUpdatedRelationship","code","current","postMessage","contentWindow","div","className","filter","Boolean","join","height"],"mappings":"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"}

package/dist/elements/Loading/index.js

@@ -1,5 +1,4 @@
 'use client';
-import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
 import { getTranslation } from '@payloadcms/translations';
 import React from 'react';
 import { useLoadingOverlay } from '../../elements/LoadingOverlay/index.js';
@@ -9,74 +8,23 @@ import './index.scss';
 const baseClass = 'loading-overlay';
 export const LoadingOverlay = ({ animationDuration, loadingText, overlayType, show = true })=>{
     const { t } = useTranslation();
-    return /*#__PURE__*/ _jsxDEV("div", {
-        className: [
-            baseClass,
-            show ? `${baseClass}--entering` : `${baseClass}--exiting`,
-            overlayType ? `${baseClass}--${overlayType}` : ''
-        ].filter(Boolean).join(' '),
-        style: {
-            animationDuration: animationDuration || '500ms'
-        },
-        children: [
-            /*#__PURE__*/ _jsxDEV("div", {
-                className: `${baseClass}__bars`,
-                children: [
-                    /*#__PURE__*/ _jsxDEV("div", {
-                        className: `${baseClass}__bar`
-                    }, void 0, false, {
-                        fileName: "src/elements/Loading/index.tsx",
-                        lineNumber: 43,
-                        columnNumber: 9
-                    }, this),
-                    /*#__PURE__*/ _jsxDEV("div", {
-                        className: `${baseClass}__bar`
-                    }, void 0, false, {
-                        fileName: "src/elements/Loading/index.tsx",
-                        lineNumber: 44,
-                        columnNumber: 9
-                    }, this),
-                    /*#__PURE__*/ _jsxDEV("div", {
-                        className: `${baseClass}__bar`
-                    }, void 0, false, {
-                        fileName: "src/elements/Loading/index.tsx",
-                        lineNumber: 45,
-                        columnNumber: 9
-                    }, this),
-                    /*#__PURE__*/ _jsxDEV("div", {
-                        className: `${baseClass}__bar`
-                    }, void 0, false, {
-                        fileName: "src/elements/Loading/index.tsx",
-                        lineNumber: 46,
-                        columnNumber: 9
-                    }, this),
-                    /*#__PURE__*/ _jsxDEV("div", {
-                        className: `${baseClass}__bar`
-                    }, void 0, false, {
-                        fileName: "src/elements/Loading/index.tsx",
-                        lineNumber: 47,
-                        columnNumber: 9
-                    }, this)
-                ]
-            }, void 0, true, {
-                fileName: "src/elements/Loading/index.tsx",
-                lineNumber: 42,
-                columnNumber: 7
-            }, this),
-            /*#__PURE__*/ _jsxDEV("span", {
-                className: `${baseClass}__text`,
-                children: loadingText || t('general:loading')
-            }, void 0, false, {
-                fileName: "src/elements/Loading/index.tsx",
-                lineNumber: 50,
-                columnNumber: 7
-            }, this)
-        ]
-    }, void 0, true, {
-        fileName: "src/elements/Loading/index.tsx",
-        lineNumber: 30,
-        columnNumber: 5
-    }, this);
+    return <div className={[
+        baseClass,
+        show ? `${baseClass}--entering` : `${baseClass}--exiting`,
+        overlayType ? `${baseClass}--${overlayType}` : ''
+    ].filter(Boolean).join(' ')} style={{
+        animationDuration: animationDuration || '500ms'
+    }}>
+      <div className={`${baseClass}__bars`}>
+        <div className={`${baseClass}__bar`}/>
+        <div className={`${baseClass}__bar`}/>
+        <div className={`${baseClass}__bar`}/>
+        <div className={`${baseClass}__bar`}/>
+        <div className={`${baseClass}__bar`}/>
+      </div>
+
+      <span className={`${baseClass}__text`}>{loadingText || t('general:loading')}</span>
+    </div>;
 };
 export const LoadingOverlayToggle = ({ name: key, type = 'fullscreen', loadingText, show })=>{
     const { toggleLoadingOverlay } = useLoadingOverlay();
@@ -111,16 +59,7 @@ export const FormLoadingOverlayToggle = ({ name, type = 'fullscreen', action, fo
         loading: t('general:loading'),
         update: t('general:updating')
     };
-    return /*#__PURE__*/ _jsxDEV(LoadingOverlayToggle, {
-        loadingText: `${labels[action]} ${loadingSuffix ? getTranslation(loadingSuffix, i18n) : ''}`.trim(),
-        name: name,
-        show: formIsLoading || isProcessing,
-        type: type
-    }, void 0, false, {
-        fileName: "src/elements/Loading/index.tsx",
-        lineNumber: 114,
-        columnNumber: 5
-    }, this);
+    return <LoadingOverlayToggle loadingText={`${labels[action]} ${loadingSuffix ? getTranslation(loadingSuffix, i18n) : ''}`.trim()} name={name} show={formIsLoading || isProcessing} type={type}/>;
 };
 
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/Loading/index.tsx"],"sourcesContent":["'use client'\nimport { getTranslation } from '@payloadcms/translations'\nimport React from 'react'\n\nimport type { LoadingOverlayTypes } from '../../elements/LoadingOverlay/types.js'\n\nimport { useLoadingOverlay } from '../../elements/LoadingOverlay/index.js'\nimport { useFormProcessing } from '../../forms/Form/context.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport './index.scss'\n\nconst baseClass = 'loading-overlay'\n\ntype LoadingOverlayProps = {\n  animationDuration?: string\n  loadingText?: string\n  overlayType?: string\n  show?: boolean\n}\n\nexport const LoadingOverlay: React.FC<LoadingOverlayProps> = ({\n  animationDuration,\n  loadingText,\n  overlayType,\n  show = true,\n}) => {\n  const { t } = useTranslation()\n\n  return (\n    <div\n      className={[\n        baseClass,\n        show ? `${baseClass}--entering` : `${baseClass}--exiting`,\n        overlayType ? `${baseClass}--${overlayType}` : '',\n      ]\n        .filter(Boolean)\n        .join(' ')}\n      style={{\n        animationDuration: animationDuration || '500ms',\n      }}\n    >\n      <div className={`${baseClass}__bars`}>\n        <div className={`${baseClass}__bar`} />\n        <div className={`${baseClass}__bar`} />\n        <div className={`${baseClass}__bar`} />\n        <div className={`${baseClass}__bar`} />\n        <div className={`${baseClass}__bar`} />\n      </div>\n\n      <span className={`${baseClass}__text`}>{loadingText || t('general:loading')}</span>\n    </div>\n  )\n}\n\nexport type UseLoadingOverlayToggleProps = {\n  loadingText?: string\n  name: string\n  show: boolean\n  type?: LoadingOverlayTypes\n}\nexport const LoadingOverlayToggle: React.FC<UseLoadingOverlayToggleProps> = ({\n  name: key,\n  type = 'fullscreen',\n  loadingText,\n  show,\n}) => {\n  const { toggleLoadingOverlay } = useLoadingOverlay()\n\n  React.useEffect(() => {\n    toggleLoadingOverlay({\n      type,\n      isLoading: show,\n      key,\n      loadingText: loadingText || undefined,\n    })\n\n    return () => {\n      toggleLoadingOverlay({\n        type,\n        isLoading: false,\n        key,\n      })\n    }\n  }, [show, toggleLoadingOverlay, key, type, loadingText])\n\n  return null\n}\n\nexport type FormLoadingOverlayToggleProps = {\n  action: 'create' | 'loading' | 'update'\n  formIsLoading?: boolean\n  loadingSuffix?: string\n  name: string\n  type?: LoadingOverlayTypes\n}\n\nexport const FormLoadingOverlayToggle: React.FC<FormLoadingOverlayToggleProps> = ({\n  name,\n  type = 'fullscreen',\n  action,\n  formIsLoading = false,\n  loadingSuffix,\n}) => {\n  const isProcessing = useFormProcessing()\n  const { i18n, t } = useTranslation()\n\n  const labels = {\n    create: t('general:creating'),\n    loading: t('general:loading'),\n    update: t('general:updating'),\n  }\n\n  return (\n    <LoadingOverlayToggle\n      loadingText={`${labels[action]} ${\n        loadingSuffix ? getTranslation(loadingSuffix, i18n) : ''\n      }`.trim()}\n      name={name}\n      show={formIsLoading || isProcessing}\n      type={type}\n    />\n  )\n}\n"],"names":["getTranslation","React","useLoadingOverlay","useFormProcessing","useTranslation","baseClass","LoadingOverlay","animationDuration","loadingText","overlayType","show","t","div","className","filter","Boolean","join","style","span","LoadingOverlayToggle","name","key","type","toggleLoadingOverlay","useEffect","isLoading","undefined","FormLoadingOverlayToggle","action","formIsLoading","loadingSuffix","isProcessing","i18n","labels","create","loading","update","trim"],"mappings":"AAAA;;AACA,SAASA,cAAc,QAAQ,2BAA0B;AACzD,OAAOC,WAAW,QAAO;AAIzB,SAASC,iBAAiB,QAAQ,yCAAwC;AAC1E,SAASC,iBAAiB,QAAQ,8BAA6B;AAC/D,SAASC,cAAc,QAAQ,uCAAsC;AACrE,OAAO,eAAc;AAErB,MAAMC,YAAY;AASlB,OAAO,MAAMC,iBAAgD,CAAC,EAC5DC,iBAAiB,EACjBC,WAAW,EACXC,WAAW,EACXC,OAAO,IAAI,EACZ;IACC,MAAM,EAAEC,CAAC,EAAE,GAAGP;IAEd,qBACE,QAACQ;QACCC,WAAW;YACTR;YACAK,OAAO,GAAGL,UAAU,UAAU,CAAC,GAAG,GAAGA,UAAU,SAAS,CAAC;YACzDI,cAAc,GAAGJ,UAAU,EAAE,EAAEI,aAAa,GAAG;SAChD,CACEK,MAAM,CAACC,SACPC,IAAI,CAAC;QACRC,OAAO;YACLV,mBAAmBA,qBAAqB;QAC1C;;0BAEA,QAACK;gBAAIC,WAAW,GAAGR,UAAU,MAAM,CAAC;;kCAClC,QAACO;wBAAIC,WAAW,GAAGR,UAAU,KAAK,CAAC;;;;;;kCACnC,QAACO;wBAAIC,WAAW,GAAGR,UAAU,KAAK,CAAC;;;;;;kCACnC,QAACO;wBAAIC,WAAW,GAAGR,UAAU,KAAK,CAAC;;;;;;kCACnC,QAACO;wBAAIC,WAAW,GAAGR,UAAU,KAAK,CAAC;;;;;;kCACnC,QAACO;wBAAIC,WAAW,GAAGR,UAAU,KAAK,CAAC;;;;;;;;;;;;0BAGrC,QAACa;gBAAKL,WAAW,GAAGR,UAAU,MAAM,CAAC;0BAAGG,eAAeG,EAAE;;;;;;;;;;;;AAG/D,EAAC;AAQD,OAAO,MAAMQ,uBAA+D,CAAC,EAC3EC,MAAMC,GAAG,EACTC,OAAO,YAAY,EACnBd,WAAW,EACXE,IAAI,EACL;IACC,MAAM,EAAEa,oBAAoB,EAAE,GAAGrB;IAEjCD,MAAMuB,SAAS,CAAC;QACdD,qBAAqB;YACnBD;YACAG,WAAWf;YACXW;YACAb,aAAaA,eAAekB;QAC9B;QAEA,OAAO;YACLH,qBAAqB;gBACnBD;gBACAG,WAAW;gBACXJ;YACF;QACF;IACF,GAAG;QAACX;QAAMa;QAAsBF;QAAKC;QAAMd;KAAY;IAEvD,OAAO;AACT,EAAC;AAUD,OAAO,MAAMmB,2BAAoE,CAAC,EAChFP,IAAI,EACJE,OAAO,YAAY,EACnBM,MAAM,EACNC,gBAAgB,KAAK,EACrBC,aAAa,EACd;IACC,MAAMC,eAAe5B;IACrB,MAAM,EAAE6B,IAAI,EAAErB,CAAC,EAAE,GAAGP;IAEpB,MAAM6B,SAAS;QACbC,QAAQvB,EAAE;QACVwB,SAASxB,EAAE;QACXyB,QAAQzB,EAAE;IACZ;IAEA,qBACE,QAACQ;QACCX,aAAa,GAAGyB,MAAM,CAACL,OAAO,CAAC,CAAC,EAC9BE,gBAAgB9B,eAAe8B,eAAeE,QAAQ,IACtD,CAACK,IAAI;QACPjB,MAAMA;QACNV,MAAMmB,iBAAiBE;QACvBT,MAAMA;;;;;;AAGZ,EAAC"}
+{"version":3,"sources":["../../../src/elements/Loading/index.tsx"],"sourcesContent":["'use client'\nimport { getTranslation } from '@payloadcms/translations'\nimport React from 'react'\n\nimport type { LoadingOverlayTypes } from '../../elements/LoadingOverlay/types.js'\n\nimport { useLoadingOverlay } from '../../elements/LoadingOverlay/index.js'\nimport { useFormProcessing } from '../../forms/Form/context.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport './index.scss'\n\nconst baseClass = 'loading-overlay'\n\ntype LoadingOverlayProps = {\n  animationDuration?: string\n  loadingText?: string\n  overlayType?: string\n  show?: boolean\n}\n\nexport const LoadingOverlay: React.FC<LoadingOverlayProps> = ({\n  animationDuration,\n  loadingText,\n  overlayType,\n  show = true,\n}) => {\n  const { t } = useTranslation()\n\n  return (\n    <div\n      className={[\n        baseClass,\n        show ? `${baseClass}--entering` : `${baseClass}--exiting`,\n        overlayType ? `${baseClass}--${overlayType}` : '',\n      ]\n        .filter(Boolean)\n        .join(' ')}\n      style={{\n        animationDuration: animationDuration || '500ms',\n      }}\n    >\n      <div className={`${baseClass}__bars`}>\n        <div className={`${baseClass}__bar`} />\n        <div className={`${baseClass}__bar`} />\n        <div className={`${baseClass}__bar`} />\n        <div className={`${baseClass}__bar`} />\n        <div className={`${baseClass}__bar`} />\n      </div>\n\n      <span className={`${baseClass}__text`}>{loadingText || t('general:loading')}</span>\n    </div>\n  )\n}\n\nexport type UseLoadingOverlayToggleProps = {\n  loadingText?: string\n  name: string\n  show: boolean\n  type?: LoadingOverlayTypes\n}\nexport const LoadingOverlayToggle: React.FC<UseLoadingOverlayToggleProps> = ({\n  name: key,\n  type = 'fullscreen',\n  loadingText,\n  show,\n}) => {\n  const { toggleLoadingOverlay } = useLoadingOverlay()\n\n  React.useEffect(() => {\n    toggleLoadingOverlay({\n      type,\n      isLoading: show,\n      key,\n      loadingText: loadingText || undefined,\n    })\n\n    return () => {\n      toggleLoadingOverlay({\n        type,\n        isLoading: false,\n        key,\n      })\n    }\n  }, [show, toggleLoadingOverlay, key, type, loadingText])\n\n  return null\n}\n\nexport type FormLoadingOverlayToggleProps = {\n  action: 'create' | 'loading' | 'update'\n  formIsLoading?: boolean\n  loadingSuffix?: string\n  name: string\n  type?: LoadingOverlayTypes\n}\n\nexport const FormLoadingOverlayToggle: React.FC<FormLoadingOverlayToggleProps> = ({\n  name,\n  type = 'fullscreen',\n  action,\n  formIsLoading = false,\n  loadingSuffix,\n}) => {\n  const isProcessing = useFormProcessing()\n  const { i18n, t } = useTranslation()\n\n  const labels = {\n    create: t('general:creating'),\n    loading: t('general:loading'),\n    update: t('general:updating'),\n  }\n\n  return (\n    <LoadingOverlayToggle\n      loadingText={`${labels[action]} ${\n        loadingSuffix ? getTranslation(loadingSuffix, i18n) : ''\n      }`.trim()}\n      name={name}\n      show={formIsLoading || isProcessing}\n      type={type}\n    />\n  )\n}\n"],"names":["getTranslation","React","useLoadingOverlay","useFormProcessing","useTranslation","baseClass","LoadingOverlay","animationDuration","loadingText","overlayType","show","t","div","className","filter","Boolean","join","style","span","LoadingOverlayToggle","name","key","type","toggleLoadingOverlay","useEffect","isLoading","undefined","FormLoadingOverlayToggle","action","formIsLoading","loadingSuffix","isProcessing","i18n","labels","create","loading","update","trim"],"mappings":"AAAA;AACA,SAASA,cAAc,QAAQ,2BAA0B;AACzD,OAAOC,WAAW,QAAO;AAIzB,SAASC,iBAAiB,QAAQ,yCAAwC;AAC1E,SAASC,iBAAiB,QAAQ,8BAA6B;AAC/D,SAASC,cAAc,QAAQ,uCAAsC;AACrE,OAAO,eAAc;AAErB,MAAMC,YAAY;AASlB,OAAO,MAAMC,iBAAgD,CAAC,EAC5DC,iBAAiB,EACjBC,WAAW,EACXC,WAAW,EACXC,OAAO,IAAI,EACZ;IACC,MAAM,EAAEC,CAAC,EAAE,GAAGP;IAEd,QACGQ,IACCC,WAAW;QACTR;QACAK,OAAO,GAAGL,UAAU,UAAU,CAAC,GAAG,GAAGA,UAAU,SAAS,CAAC;QACzDI,cAAc,GAAGJ,UAAU,EAAE,EAAEI,aAAa,GAAG;KAChD,CACEK,MAAM,CAACC,SACPC,IAAI,CAAC,MACRC,OAAO;QACLV,mBAAmBA,qBAAqB;IAC1C,GACD;MACC,CAACK,IAAIC,WAAW,GAAGR,UAAU,MAAM,CAAC,EAAE;QACpC,CAACO,IAAIC,WAAW,GAAGR,UAAU,KAAK,CAAC,GAAI;QACvC,CAACO,IAAIC,WAAW,GAAGR,UAAU,KAAK,CAAC,GAAI;QACvC,CAACO,IAAIC,WAAW,GAAGR,UAAU,KAAK,CAAC,GAAI;QACvC,CAACO,IAAIC,WAAW,GAAGR,UAAU,KAAK,CAAC,GAAI;QACvC,CAACO,IAAIC,WAAW,GAAGR,UAAU,KAAK,CAAC,GAAI;MACzC,EAAEO,IAAI;;MAEN,CAACM,KAAKL,WAAW,GAAGR,UAAU,MAAM,CAAC,GAAGG,eAAeG,EAAE,qBAAqBO,KAAK;IACrF,EAAEN;AAEN,EAAC;AAQD,OAAO,MAAMO,uBAA+D,CAAC,EAC3EC,MAAMC,GAAG,EACTC,OAAO,YAAY,EACnBd,WAAW,EACXE,IAAI,EACL;IACC,MAAM,EAAEa,oBAAoB,EAAE,GAAGrB;IAEjCD,MAAMuB,SAAS,CAAC;QACdD,qBAAqB;YACnBD;YACAG,WAAWf;YACXW;YACAb,aAAaA,eAAekB;QAC9B;QAEA,OAAO;YACLH,qBAAqB;gBACnBD;gBACAG,WAAW;gBACXJ;YACF;QACF;IACF,GAAG;QAACX;QAAMa;QAAsBF;QAAKC;QAAMd;KAAY;IAEvD,OAAO;AACT,EAAC;AAUD,OAAO,MAAMmB,2BAAoE,CAAC,EAChFP,IAAI,EACJE,OAAO,YAAY,EACnBM,MAAM,EACNC,gBAAgB,KAAK,EACrBC,aAAa,EACd;IACC,MAAMC,eAAe5B;IACrB,MAAM,EAAE6B,IAAI,EAAErB,CAAC,EAAE,GAAGP;IAEpB,MAAM6B,SAAS;QACbC,QAAQvB,EAAE;QACVwB,SAASxB,EAAE;QACXyB,QAAQzB,EAAE;IACZ;IAEA,QACGQ,qBACCX,aAAa,GAAGyB,MAAM,CAACL,OAAO,CAAC,CAAC,EAC9BE,gBAAgB9B,eAAe8B,eAAeE,QAAQ,IACtD,CAACK,IAAI,IACPjB,MAAMA,MACNV,MAAMmB,iBAAiBE,cACvBT,MAAMA;AAGZ,EAAC"}

package/dist/elements/LoadingOverlay/index.js

@@ -1,12 +1,11 @@
 'use client';
-import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
 import React, { createContext } from 'react';
 import { LoadingOverlay } from '../../elements/Loading/index.js';
 import { useDelayedRender } from '../../hooks/useDelayedRender.js';
 import { useTranslation } from '../../providers/Translation/index.js';
 import { defaultLoadingOverlayState, reducer } from './reducer.js';
 const animatedDuration = 250;
-const Context = /*#__PURE__*/ createContext({
+const Context = createContext({
     isOnScreen: false,
     toggleLoadingOverlay: undefined
 });
@@ -45,29 +44,13 @@ export const LoadingOverlayProvider = ({ children })=>{
         triggerDelayedRender,
         fallbackText
     ]);
-    return /*#__PURE__*/ _jsxDEV(Context, {
-        value: {
-            isOnScreen: isMounted,
-            toggleLoadingOverlay
-        },
-        children: [
-            isMounted && /*#__PURE__*/ _jsxDEV(LoadingOverlay, {
-                animationDuration: `${animatedDuration}ms`,
-                loadingText: overlays.loadingText || fallbackText,
-                overlayType: overlays.overlayType,
-                show: !isUnmounting
-            }, void 0, false, {
-                fileName: "src/elements/LoadingOverlay/index.tsx",
-                lineNumber: 64,
-                columnNumber: 9
-            }, this),
-            children
-        ]
-    }, void 0, true, {
-        fileName: "src/elements/LoadingOverlay/index.tsx",
-        lineNumber: 57,
-        columnNumber: 5
-    }, this);
+    return <Context value={{
+        isOnScreen: isMounted,
+        toggleLoadingOverlay
+    }}>
+      {isMounted && <LoadingOverlay animationDuration={`${animatedDuration}ms`} loadingText={overlays.loadingText || fallbackText} overlayType={overlays.overlayType} show={!isUnmounting}/>}
+      {children}
+    </Context>;
 };
 export const useLoadingOverlay = ()=>{
     const contextHook = React.use(Context);

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/LoadingOverlay/index.tsx"],"sourcesContent":["'use client'\nimport React, { createContext } from 'react'\n\nimport type { LoadingOverlayContext, ToggleLoadingOverlay } from './types.js'\n\nimport { LoadingOverlay } from '../../elements/Loading/index.js'\nimport { useDelayedRender } from '../../hooks/useDelayedRender.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { defaultLoadingOverlayState, reducer } from './reducer.js'\n\nconst animatedDuration = 250\n\nconst Context = createContext({\n  isOnScreen: false,\n  toggleLoadingOverlay: undefined,\n})\n\nexport const LoadingOverlayProvider: React.FC<{ children?: React.ReactNode }> = ({ children }) => {\n  const { t } = useTranslation()\n  const fallbackText = t('general:loading')\n  const [overlays, dispatchOverlay] = React.useReducer(reducer, defaultLoadingOverlayState)\n\n  const { isMounted, isUnmounting, triggerDelayedRender } = useDelayedRender({\n    delayBeforeShow: 1000,\n    inTimeout: animatedDuration,\n    minShowTime: 500,\n    outTimeout: animatedDuration,\n    show: overlays.isLoading,\n  })\n\n  const toggleLoadingOverlay = React.useCallback<ToggleLoadingOverlay>(\n    ({ type, isLoading, key, loadingText = fallbackText }) => {\n      if (isLoading) {\n        triggerDelayedRender()\n        dispatchOverlay({\n          type: 'add',\n          payload: {\n            type,\n            key,\n            loadingText,\n          },\n        })\n      } else {\n        dispatchOverlay({\n          type: 'remove',\n          payload: {\n            type,\n            key,\n          },\n        })\n      }\n    },\n    [triggerDelayedRender, fallbackText],\n  )\n\n  return (\n    <Context\n      value={{\n        isOnScreen: isMounted,\n        toggleLoadingOverlay,\n      }}\n    >\n      {isMounted && (\n        <LoadingOverlay\n          animationDuration={`${animatedDuration}ms`}\n          loadingText={overlays.loadingText || fallbackText}\n          overlayType={overlays.overlayType}\n          show={!isUnmounting}\n        />\n      )}\n      {children}\n    </Context>\n  )\n}\n\nexport const useLoadingOverlay = (): LoadingOverlayContext => {\n  const contextHook = React.use(Context)\n  if (contextHook === undefined) {\n    throw new Error('useLoadingOverlay must be used within a LoadingOverlayProvider')\n  }\n\n  return contextHook\n}\n"],"names":["React","createContext","LoadingOverlay","useDelayedRender","useTranslation","defaultLoadingOverlayState","reducer","animatedDuration","Context","isOnScreen","toggleLoadingOverlay","undefined","LoadingOverlayProvider","children","t","fallbackText","overlays","dispatchOverlay","useReducer","isMounted","isUnmounting","triggerDelayedRender","delayBeforeShow","inTimeout","minShowTime","outTimeout","show","isLoading","useCallback","type","key","loadingText","payload","value","animationDuration","overlayType","useLoadingOverlay","contextHook","use","Error"],"mappings":"AAAA;;AACA,OAAOA,SAASC,aAAa,QAAQ,QAAO;AAI5C,SAASC,cAAc,QAAQ,kCAAiC;AAChE,SAASC,gBAAgB,QAAQ,kCAAiC;AAClE,SAASC,cAAc,QAAQ,uCAAsC;AACrE,SAASC,0BAA0B,EAAEC,OAAO,QAAQ,eAAc;AAElE,MAAMC,mBAAmB;AAEzB,MAAMC,wBAAUP,cAAc;IAC5BQ,YAAY;IACZC,sBAAsBC;AACxB;AAEA,OAAO,MAAMC,yBAAmE,CAAC,EAAEC,QAAQ,EAAE;IAC3F,MAAM,EAAEC,CAAC,EAAE,GAAGV;IACd,MAAMW,eAAeD,EAAE;IACvB,MAAM,CAACE,UAAUC,gBAAgB,GAAGjB,MAAMkB,UAAU,CAACZ,SAASD;IAE9D,MAAM,EAAEc,SAAS,EAAEC,YAAY,EAAEC,oBAAoB,EAAE,GAAGlB,iBAAiB;QACzEmB,iBAAiB;QACjBC,WAAWhB;QACXiB,aAAa;QACbC,YAAYlB;QACZmB,MAAMV,SAASW,SAAS;IAC1B;IAEA,MAAMjB,uBAAuBV,MAAM4B,WAAW,CAC5C,CAAC,EAAEC,IAAI,EAAEF,SAAS,EAAEG,GAAG,EAAEC,cAAchB,YAAY,EAAE;QACnD,IAAIY,WAAW;YACbN;YACAJ,gBAAgB;gBACdY,MAAM;gBACNG,SAAS;oBACPH;oBACAC;oBACAC;gBACF;YACF;QACF,OAAO;YACLd,gBAAgB;gBACdY,MAAM;gBACNG,SAAS;oBACPH;oBACAC;gBACF;YACF;QACF;IACF,GACA;QAACT;QAAsBN;KAAa;IAGtC,qBACE,QAACP;QACCyB,OAAO;YACLxB,YAAYU;YACZT;QACF;;YAECS,2BACC,QAACjB;gBACCgC,mBAAmB,GAAG3B,iBAAiB,EAAE,CAAC;gBAC1CwB,aAAaf,SAASe,WAAW,IAAIhB;gBACrCoB,aAAanB,SAASmB,WAAW;gBACjCT,MAAM,CAACN;;;;;;YAGVP;;;;;;;AAGP,EAAC;AAED,OAAO,MAAMuB,oBAAoB;IAC/B,MAAMC,cAAcrC,MAAMsC,GAAG,CAAC9B;IAC9B,IAAI6B,gBAAgB1B,WAAW;QAC7B,MAAM,IAAI4B,MAAM;IAClB;IAEA,OAAOF;AACT,EAAC"}
+{"version":3,"sources":["../../../src/elements/LoadingOverlay/index.tsx"],"sourcesContent":["'use client'\nimport React, { createContext } from 'react'\n\nimport type { LoadingOverlayContext, ToggleLoadingOverlay } from './types.js'\n\nimport { LoadingOverlay } from '../../elements/Loading/index.js'\nimport { useDelayedRender } from '../../hooks/useDelayedRender.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { defaultLoadingOverlayState, reducer } from './reducer.js'\n\nconst animatedDuration = 250\n\nconst Context = createContext({\n  isOnScreen: false,\n  toggleLoadingOverlay: undefined,\n})\n\nexport const LoadingOverlayProvider: React.FC<{ children?: React.ReactNode }> = ({ children }) => {\n  const { t } = useTranslation()\n  const fallbackText = t('general:loading')\n  const [overlays, dispatchOverlay] = React.useReducer(reducer, defaultLoadingOverlayState)\n\n  const { isMounted, isUnmounting, triggerDelayedRender } = useDelayedRender({\n    delayBeforeShow: 1000,\n    inTimeout: animatedDuration,\n    minShowTime: 500,\n    outTimeout: animatedDuration,\n    show: overlays.isLoading,\n  })\n\n  const toggleLoadingOverlay = React.useCallback<ToggleLoadingOverlay>(\n    ({ type, isLoading, key, loadingText = fallbackText }) => {\n      if (isLoading) {\n        triggerDelayedRender()\n        dispatchOverlay({\n          type: 'add',\n          payload: {\n            type,\n            key,\n            loadingText,\n          },\n        })\n      } else {\n        dispatchOverlay({\n          type: 'remove',\n          payload: {\n            type,\n            key,\n          },\n        })\n      }\n    },\n    [triggerDelayedRender, fallbackText],\n  )\n\n  return (\n    <Context\n      value={{\n        isOnScreen: isMounted,\n        toggleLoadingOverlay,\n      }}\n    >\n      {isMounted && (\n        <LoadingOverlay\n          animationDuration={`${animatedDuration}ms`}\n          loadingText={overlays.loadingText || fallbackText}\n          overlayType={overlays.overlayType}\n          show={!isUnmounting}\n        />\n      )}\n      {children}\n    </Context>\n  )\n}\n\nexport const useLoadingOverlay = (): LoadingOverlayContext => {\n  const contextHook = React.use(Context)\n  if (contextHook === undefined) {\n    throw new Error('useLoadingOverlay must be used within a LoadingOverlayProvider')\n  }\n\n  return contextHook\n}\n"],"names":["React","createContext","LoadingOverlay","useDelayedRender","useTranslation","defaultLoadingOverlayState","reducer","animatedDuration","Context","isOnScreen","toggleLoadingOverlay","undefined","LoadingOverlayProvider","children","t","fallbackText","overlays","dispatchOverlay","useReducer","isMounted","isUnmounting","triggerDelayedRender","delayBeforeShow","inTimeout","minShowTime","outTimeout","show","isLoading","useCallback","type","key","loadingText","payload","value","animationDuration","overlayType","useLoadingOverlay","contextHook","use","Error"],"mappings":"AAAA;AACA,OAAOA,SAASC,aAAa,QAAQ,QAAO;AAI5C,SAASC,cAAc,QAAQ,kCAAiC;AAChE,SAASC,gBAAgB,QAAQ,kCAAiC;AAClE,SAASC,cAAc,QAAQ,uCAAsC;AACrE,SAASC,0BAA0B,EAAEC,OAAO,QAAQ,eAAc;AAElE,MAAMC,mBAAmB;AAEzB,MAAMC,UAAUP,cAAc;IAC5BQ,YAAY;IACZC,sBAAsBC;AACxB;AAEA,OAAO,MAAMC,yBAAmE,CAAC,EAAEC,QAAQ,EAAE;IAC3F,MAAM,EAAEC,CAAC,EAAE,GAAGV;IACd,MAAMW,eAAeD,EAAE;IACvB,MAAM,CAACE,UAAUC,gBAAgB,GAAGjB,MAAMkB,UAAU,CAACZ,SAASD;IAE9D,MAAM,EAAEc,SAAS,EAAEC,YAAY,EAAEC,oBAAoB,EAAE,GAAGlB,iBAAiB;QACzEmB,iBAAiB;QACjBC,WAAWhB;QACXiB,aAAa;QACbC,YAAYlB;QACZmB,MAAMV,SAASW,SAAS;IAC1B;IAEA,MAAMjB,uBAAuBV,MAAM4B,WAAW,CAC5C,CAAC,EAAEC,IAAI,EAAEF,SAAS,EAAEG,GAAG,EAAEC,cAAchB,YAAY,EAAE;QACnD,IAAIY,WAAW;YACbN;YACAJ,gBAAgB;gBACdY,MAAM;gBACNG,SAAS;oBACPH;oBACAC;oBACAC;gBACF;YACF;QACF,OAAO;YACLd,gBAAgB;gBACdY,MAAM;gBACNG,SAAS;oBACPH;oBACAC;gBACF;YACF;QACF;IACF,GACA;QAACT;QAAsBN;KAAa;IAGtC,QACGP,QACCyB,OAAO;QACLxB,YAAYU;QACZT;IACF,GACD;MACC,CAACS,cACEjB,eACCgC,mBAAmB,GAAG3B,iBAAiB,EAAE,CAAC,EAC1CwB,aAAaf,SAASe,WAAW,IAAIhB,cACrCoB,aAAanB,SAASmB,WAAW,EACjCT,MAAM,CAACN,gBAET;MACF,CAACP,SAAS;IACZ,EAAEL;AAEN,EAAC;AAED,OAAO,MAAM4B,oBAAoB;IAC/B,MAAMC,cAAcrC,MAAMsC,GAAG,CAAC9B;IAC9B,IAAI6B,gBAAgB1B,WAAW;QAC7B,MAAM,IAAI4B,MAAM;IAClB;IAEA,OAAOF;AACT,EAAC"}

package/dist/elements/Localizer/LocalizerLabel/index.js

@@ -1,7 +1,5 @@
 'use client';
-import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
 import { getTranslation } from '@payloadcms/translations';
-import React from 'react';
 import { ChevronIcon } from '../../../icons/Chevron/index.js';
 import { useLocale } from '../../../providers/Locale/index.js';
 import { useTranslation } from '../../../providers/Translation/index.js';
@@ -11,55 +9,18 @@ export const LocalizerLabel = (props)=>{
     const { ariaLabel, className } = props;
     const locale = useLocale();
     const { i18n, t } = useTranslation();
-    return /*#__PURE__*/ _jsxDEV("div", {
-        "aria-label": ariaLabel || t('general:locale'),
-        className: [
-            baseClass,
-            className
-        ].filter(Boolean).join(' '),
-        "data-locale": locale ? locale.code : undefined,
-        children: [
-            /*#__PURE__*/ _jsxDEV("div", {
-                className: `${baseClass}__label`,
-                children: [
-                    `${t('general:locale')}:`,
-                    " "
-                ]
-            }, void 0, true, {
-                fileName: "src/elements/Localizer/LocalizerLabel/index.tsx",
-                lineNumber: 26,
-                columnNumber: 7
-            }, this),
-            /*#__PURE__*/ _jsxDEV("div", {
-                className: `${baseClass}__current`,
-                children: [
-                    /*#__PURE__*/ _jsxDEV("span", {
-                        className: `${baseClass}__current-label`,
-                        children: `${getTranslation(locale.label, i18n)}`
-                    }, void 0, false, {
-                        fileName: "src/elements/Localizer/LocalizerLabel/index.tsx",
-                        lineNumber: 28,
-                        columnNumber: 9
-                    }, this),
-                    /*#__PURE__*/ _jsxDEV(ChevronIcon, {
-                        className: `${baseClass}__chevron`
-                    }, void 0, false, {
-                        fileName: "src/elements/Localizer/LocalizerLabel/index.tsx",
-                        lineNumber: 31,
-                        columnNumber: 9
-                    }, this)
-                ]
-            }, void 0, true, {
-                fileName: "src/elements/Localizer/LocalizerLabel/index.tsx",
-                lineNumber: 27,
-                columnNumber: 7
-            }, this)
-        ]
-    }, void 0, true, {
-        fileName: "src/elements/Localizer/LocalizerLabel/index.tsx",
-        lineNumber: 21,
-        columnNumber: 5
-    }, this);
+    return <div aria-label={ariaLabel || t('general:locale')} className={[
+        baseClass,
+        className
+    ].filter(Boolean).join(' ')} data-locale={locale ? locale.code : undefined}>
+      <div className={`${baseClass}__label`}>{`${t('general:locale')}:`}&nbsp;</div>
+      <div className={`${baseClass}__current`}>
+        <span className={`${baseClass}__current-label`}>
+          {`${getTranslation(locale.label, i18n)}`}
+        </span>
+        <ChevronIcon className={`${baseClass}__chevron`}/>
+      </div>
+    </div>;
 };
 
 //# sourceMappingURL=index.js.map

package/dist/elements/Localizer/LocalizerLabel/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/elements/Localizer/LocalizerLabel/index.tsx"],"sourcesContent":["'use client'\nimport { getTranslation } from '@payloadcms/translations'\nimport React from 'react'\n\nimport { ChevronIcon } from '../../../icons/Chevron/index.js'\nimport { useLocale } from '../../../providers/Locale/index.js'\nimport { useTranslation } from '../../../providers/Translation/index.js'\nimport './index.scss'\n\nconst baseClass = 'localizer-button'\n\nexport const LocalizerLabel: React.FC<{\n  ariaLabel?: string\n  className?: string\n}> = (props) => {\n  const { ariaLabel, className } = props\n  const locale = useLocale()\n  const { i18n, t } = useTranslation()\n\n  return (\n    <div\n      aria-label={ariaLabel || t('general:locale')}\n      className={[baseClass, className].filter(Boolean).join(' ')}\n      data-locale={locale ? locale.code : undefined}\n    >\n      <div className={`${baseClass}__label`}>{`${t('general:locale')}:`}&nbsp;</div>\n      <div className={`${baseClass}__current`}>\n        <span className={`${baseClass}__current-label`}>\n          {`${getTranslation(locale.label, i18n)}`}\n        </span>\n        <ChevronIcon className={`${baseClass}__chevron`} />\n      </div>\n    </div>\n  )\n}\n"],"names":["getTranslation","React","ChevronIcon","useLocale","useTranslation","baseClass","LocalizerLabel","props","ariaLabel","className","locale","i18n","t","div","aria-label","filter","Boolean","join","data-locale","code","undefined","span","label"],"mappings":"AAAA;;AACA,SAASA,cAAc,QAAQ,2BAA0B;AACzD,OAAOC,WAAW,QAAO;AAEzB,SAASC,WAAW,QAAQ,kCAAiC;AAC7D,SAASC,SAAS,QAAQ,qCAAoC;AAC9D,SAASC,cAAc,QAAQ,0CAAyC;AACxE,OAAO,eAAc;AAErB,MAAMC,YAAY;AAElB,OAAO,MAAMC,iBAGR,CAACC;IACJ,MAAM,EAAEC,SAAS,EAAEC,SAAS,EAAE,GAAGF;IACjC,MAAMG,SAASP;IACf,MAAM,EAAEQ,IAAI,EAAEC,CAAC,EAAE,GAAGR;IAEpB,qBACE,QAACS;QACCC,cAAYN,aAAaI,EAAE;QAC3BH,WAAW;YAACJ;YAAWI;SAAU,CAACM,MAAM,CAACC,SAASC,IAAI,CAAC;QACvDC,eAAaR,SAASA,OAAOS,IAAI,GAAGC;;0BAEpC,QAACP;gBAAIJ,WAAW,GAAGJ,UAAU,OAAO,CAAC;;oBAAG,GAAGO,EAAE,kBAAkB,CAAC,CAAC;oBAAC;;;;;;;0BAClE,QAACC;gBAAIJ,WAAW,GAAGJ,UAAU,SAAS,CAAC;;kCACrC,QAACgB;wBAAKZ,WAAW,GAAGJ,UAAU,eAAe,CAAC;kCAC3C,GAAGL,eAAeU,OAAOY,KAAK,EAAEX,OAAO;;;;;;kCAE1C,QAACT;wBAAYO,WAAW,GAAGJ,UAAU,SAAS,CAAC;;;;;;;;;;;;;;;;;;AAIvD,EAAC"}
+{"version":3,"sources":["../../../../src/elements/Localizer/LocalizerLabel/index.tsx"],"sourcesContent":["'use client'\nimport { getTranslation } from '@payloadcms/translations'\nimport React from 'react'\n\nimport { ChevronIcon } from '../../../icons/Chevron/index.js'\nimport { useLocale } from '../../../providers/Locale/index.js'\nimport { useTranslation } from '../../../providers/Translation/index.js'\nimport './index.scss'\n\nconst baseClass = 'localizer-button'\n\nexport const LocalizerLabel: React.FC<{\n  ariaLabel?: string\n  className?: string\n}> = (props) => {\n  const { ariaLabel, className } = props\n  const locale = useLocale()\n  const { i18n, t } = useTranslation()\n\n  return (\n    <div\n      aria-label={ariaLabel || t('general:locale')}\n      className={[baseClass, className].filter(Boolean).join(' ')}\n      data-locale={locale ? locale.code : undefined}\n    >\n      <div className={`${baseClass}__label`}>{`${t('general:locale')}:`}&nbsp;</div>\n      <div className={`${baseClass}__current`}>\n        <span className={`${baseClass}__current-label`}>\n          {`${getTranslation(locale.label, i18n)}`}\n        </span>\n        <ChevronIcon className={`${baseClass}__chevron`} />\n      </div>\n    </div>\n  )\n}\n"],"names":["getTranslation","ChevronIcon","useLocale","useTranslation","baseClass","LocalizerLabel","props","ariaLabel","className","locale","i18n","t","div","aria-label","filter","Boolean","join","data-locale","code","undefined","span","label"],"mappings":"AAAA;AACA,SAASA,cAAc,QAAQ,2BAA0B;AAGzD,SAASC,WAAW,QAAQ,kCAAiC;AAC7D,SAASC,SAAS,QAAQ,qCAAoC;AAC9D,SAASC,cAAc,QAAQ,0CAAyC;AACxE,OAAO,eAAc;AAErB,MAAMC,YAAY;AAElB,OAAO,MAAMC,iBAGR,CAACC;IACJ,MAAM,EAAEC,SAAS,EAAEC,SAAS,EAAE,GAAGF;IACjC,MAAMG,SAASP;IACf,MAAM,EAAEQ,IAAI,EAAEC,CAAC,EAAE,GAAGR;IAEpB,QACGS,IACCC,YAAYN,aAAaI,EAAE,mBAC3BH,WAAW;QAACJ;QAAWI;KAAU,CAACM,MAAM,CAACC,SAASC,IAAI,CAAC,MACvDC,aAAaR,SAASA,OAAOS,IAAI,GAAGC,WACrC;MACC,CAACP,IAAIJ,WAAW,GAAGJ,UAAU,OAAO,CAAC,GAAG,GAAGO,EAAE,kBAAkB,CAAC,CAAC,CAAC,MAAM,EAAEC,IAAI;MAC9E,CAACA,IAAIJ,WAAW,GAAGJ,UAAU,SAAS,CAAC,EAAE;QACvC,CAACgB,KAAKZ,WAAW,GAAGJ,UAAU,eAAe,CAAC,EAAE;UAC9C,CAAC,GAAGJ,eAAeS,OAAOY,KAAK,EAAEX,OAAO,CAAC;QAC3C,EAAEU,KAAK;QACP,CAACnB,YAAYO,WAAW,GAAGJ,UAAU,SAAS,CAAC,GAAI;MACrD,EAAEQ,IAAI;IACR,EAAEA;AAEN,EAAC"}

package/dist/elements/Localizer/index.js

@@ -1,9 +1,8 @@
 'use client';
-import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
 import { getTranslation } from '@payloadcms/translations';
 import { useRouter } from 'next/navigation.js';
 import * as qs from 'qs-esm';
-import React, { Fragment } from 'react';
+import { Fragment } from 'react';
 import { useConfig } from '../../providers/Config/index.js';
 import { useLocale, useLocaleLoading } from '../../providers/Locale/index.js';
 import { useRouteTransition } from '../../providers/RouteTransition/index.js';
@@ -22,92 +21,44 @@ export const Localizer = (props)=>{
     const locale = useLocale();
     if (localization) {
         const { locales } = localization;
-        return /*#__PURE__*/ _jsxDEV("div", {
-            className: [
-                baseClass,
-                className
-            ].filter(Boolean).join(' '),
-            children: /*#__PURE__*/ _jsxDEV(Popup, {
-                button: /*#__PURE__*/ _jsxDEV(LocalizerLabel, {}, void 0, false, {
-                    fileName: "src/elements/Localizer/index.tsx",
-                    lineNumber: 39,
-                    columnNumber: 19
-                }, void 0),
-                horizontalAlign: "right",
-                render: ({ close })=>/*#__PURE__*/ _jsxDEV(PopupList.ButtonGroup, {
-                        children: locales.map((localeOption)=>{
-                            const localeOptionLabel = getTranslation(localeOption.label, i18n);
-                            return /*#__PURE__*/ _jsxDEV(PopupList.Button, {
-                                active: locale.code === localeOption.code,
-                                disabled: locale.code === localeOption.code,
-                                onClick: ()=>{
-                                    setLocaleIsLoading(true);
-                                    close();
-                                    // can't use `useSearchParams` here because it is stale due to `window.history.pushState` in `ListQueryProvider`
-                                    const searchParams = new URLSearchParams(window.location.search);
-                                    const url = qs.stringify({
-                                        ...qs.parse(searchParams.toString(), {
-                                            depth: 10,
-                                            ignoreQueryPrefix: true
-                                        }),
-                                        locale: localeOption.code
-                                    }, {
-                                        addQueryPrefix: true
-                                    });
-                                    startRouteTransition(()=>{
-                                        router.push(url);
-                                    });
-                                },
-                                children: localeOptionLabel !== localeOption.code ? /*#__PURE__*/ _jsxDEV(Fragment, {
-                                    children: [
-                                        localeOptionLabel,
-                                        " ",
-                                        /*#__PURE__*/ _jsxDEV("span", {
-                                            className: `${baseClass}__locale-code`,
-                                            "data-locale": localeOption.code,
-                                            children: `(${localeOption.code})`
-                                        }, void 0, false, {
-                                            fileName: "src/elements/Localizer/index.tsx",
-                                            lineNumber: 78,
-                                            columnNumber: 25
-                                        }, void 0)
-                                    ]
-                                }, void 0, true, {
-                                    fileName: "src/elements/Localizer/index.tsx",
-                                    lineNumber: 75,
-                                    columnNumber: 23
-                                }, void 0) : /*#__PURE__*/ _jsxDEV("span", {
-                                    className: `${baseClass}__locale-code`,
-                                    "data-locale": localeOption.code,
-                                    children: localeOptionLabel
-                                }, void 0, false, {
-                                    fileName: "src/elements/Localizer/index.tsx",
-                                    lineNumber: 86,
-                                    columnNumber: 23
-                                }, void 0)
-                            }, localeOption.code, false, {
-                                fileName: "src/elements/Localizer/index.tsx",
-                                lineNumber: 47,
-                                columnNumber: 19
-                            }, void 0);
-                        })
-                    }, void 0, false, {
-                        fileName: "src/elements/Localizer/index.tsx",
-                        lineNumber: 42,
-                        columnNumber: 13
-                    }, void 0),
-                showScrollbar: true,
-                size: "large"
-            }, void 0, false, {
-                fileName: "src/elements/Localizer/index.tsx",
-                lineNumber: 38,
-                columnNumber: 9
-            }, this)
-        }, void 0, false, {
-            fileName: "src/elements/Localizer/index.tsx",
-            lineNumber: 37,
-            columnNumber: 7
-        }, this);
+        return <div className={[
+            baseClass,
+            className
+        ].filter(Boolean).join(' ')}>
+        <Popup button={<LocalizerLabel/>} horizontalAlign="right" render={({ close })=><PopupList.ButtonGroup>
+              {locales.map((localeOption)=>{
+                const localeOptionLabel = getTranslation(localeOption.label, i18n);
+                return <PopupList.Button active={locale.code === localeOption.code} disabled={locale.code === localeOption.code} key={localeOption.code} onClick={()=>{
+                    setLocaleIsLoading(true);
+                    close();
+                    // can't use `useSearchParams` here because it is stale due to `window.history.pushState` in `ListQueryProvider`
+                    const searchParams = new URLSearchParams(window.location.search);
+                    const url = qs.stringify({
+                        ...qs.parse(searchParams.toString(), {
+                            depth: 10,
+                            ignoreQueryPrefix: true
+                        }),
+                        locale: localeOption.code
+                    }, {
+                        addQueryPrefix: true
+                    });
+                    startRouteTransition(()=>{
+                        router.push(url);
+                    });
+                }}>
+                    {localeOptionLabel !== localeOption.code ? <Fragment>
+                        {localeOptionLabel}
+                        &nbsp;
+                        <span className={`${baseClass}__locale-code`} data-locale={localeOption.code}>
+                          {`(${localeOption.code})`}
+                        </span>
+                      </Fragment> : <span className={`${baseClass}__locale-code`} data-locale={localeOption.code}>
+                        {localeOptionLabel}
+                      </span>}
+                  </PopupList.Button>;
+            })}
+            </PopupList.ButtonGroup>} showScrollbar size="large"/>
+      </div>;
     }
     return null;
 };

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/Localizer/index.tsx"],"sourcesContent":["'use client'\nimport { getTranslation } from '@payloadcms/translations'\nimport { useRouter } from 'next/navigation.js'\nimport * as qs from 'qs-esm'\nimport React, { Fragment } from 'react'\n\nimport { useConfig } from '../../providers/Config/index.js'\nimport { useLocale, useLocaleLoading } from '../../providers/Locale/index.js'\nimport { useRouteTransition } from '../../providers/RouteTransition/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { Popup, PopupList } from '../Popup/index.js'\nimport './index.scss'\nimport { LocalizerLabel } from './LocalizerLabel/index.js'\n\nconst baseClass = 'localizer'\n\nexport const Localizer: React.FC<{\n  className?: string\n}> = (props) => {\n  const { className } = props\n  const {\n    config: { localization },\n  } = useConfig()\n\n  const router = useRouter()\n  const { startRouteTransition } = useRouteTransition()\n\n  const { setLocaleIsLoading } = useLocaleLoading()\n\n  const { i18n } = useTranslation()\n  const locale = useLocale()\n\n  if (localization) {\n    const { locales } = localization\n\n    return (\n      <div className={[baseClass, className].filter(Boolean).join(' ')}>\n        <Popup\n          button={<LocalizerLabel />}\n          horizontalAlign=\"right\"\n          render={({ close }) => (\n            <PopupList.ButtonGroup>\n              {locales.map((localeOption) => {\n                const localeOptionLabel = getTranslation(localeOption.label, i18n)\n\n                return (\n                  <PopupList.Button\n                    active={locale.code === localeOption.code}\n                    disabled={locale.code === localeOption.code}\n                    key={localeOption.code}\n                    onClick={() => {\n                      setLocaleIsLoading(true)\n                      close()\n\n                      // can't use `useSearchParams` here because it is stale due to `window.history.pushState` in `ListQueryProvider`\n                      const searchParams = new URLSearchParams(window.location.search)\n\n                      const url = qs.stringify(\n                        {\n                          ...qs.parse(searchParams.toString(), {\n                            depth: 10,\n                            ignoreQueryPrefix: true,\n                          }),\n                          locale: localeOption.code,\n                        },\n                        { addQueryPrefix: true },\n                      )\n\n                      startRouteTransition(() => {\n                        router.push(url)\n                      })\n                    }}\n                  >\n                    {localeOptionLabel !== localeOption.code ? (\n                      <Fragment>\n                        {localeOptionLabel}\n                        &nbsp;\n                        <span\n                          className={`${baseClass}__locale-code`}\n                          data-locale={localeOption.code}\n                        >\n                          {`(${localeOption.code})`}\n                        </span>\n                      </Fragment>\n                    ) : (\n                      <span className={`${baseClass}__locale-code`} data-locale={localeOption.code}>\n                        {localeOptionLabel}\n                      </span>\n                    )}\n                  </PopupList.Button>\n                )\n              })}\n            </PopupList.ButtonGroup>\n          )}\n          showScrollbar\n          size=\"large\"\n        />\n      </div>\n    )\n  }\n\n  return null\n}\n"],"names":["getTranslation","useRouter","qs","React","Fragment","useConfig","useLocale","useLocaleLoading","useRouteTransition","useTranslation","Popup","PopupList","LocalizerLabel","baseClass","Localizer","props","className","config","localization","router","startRouteTransition","setLocaleIsLoading","i18n","locale","locales","div","filter","Boolean","join","button","horizontalAlign","render","close","ButtonGroup","map","localeOption","localeOptionLabel","label","Button","active","code","disabled","onClick","searchParams","URLSearchParams","window","location","search","url","stringify","parse","toString","depth","ignoreQueryPrefix","addQueryPrefix","push","span","data-locale","showScrollbar","size"],"mappings":"AAAA;;AACA,SAASA,cAAc,QAAQ,2BAA0B;AACzD,SAASC,SAAS,QAAQ,qBAAoB;AAC9C,YAAYC,QAAQ,SAAQ;AAC5B,OAAOC,SAASC,QAAQ,QAAQ,QAAO;AAEvC,SAASC,SAAS,QAAQ,kCAAiC;AAC3D,SAASC,SAAS,EAAEC,gBAAgB,QAAQ,kCAAiC;AAC7E,SAASC,kBAAkB,QAAQ,2CAA0C;AAC7E,SAASC,cAAc,QAAQ,uCAAsC;AACrE,SAASC,KAAK,EAAEC,SAAS,QAAQ,oBAAmB;AACpD,OAAO,eAAc;AACrB,SAASC,cAAc,QAAQ,4BAA2B;AAE1D,MAAMC,YAAY;AAElB,OAAO,MAAMC,YAER,CAACC;IACJ,MAAM,EAAEC,SAAS,EAAE,GAAGD;IACtB,MAAM,EACJE,QAAQ,EAAEC,YAAY,EAAE,EACzB,GAAGb;IAEJ,MAAMc,SAASlB;IACf,MAAM,EAAEmB,oBAAoB,EAAE,GAAGZ;IAEjC,MAAM,EAAEa,kBAAkB,EAAE,GAAGd;IAE/B,MAAM,EAAEe,IAAI,EAAE,GAAGb;IACjB,MAAMc,SAASjB;IAEf,IAAIY,cAAc;QAChB,MAAM,EAAEM,OAAO,EAAE,GAAGN;QAEpB,qBACE,QAACO;YAAIT,WAAW;gBAACH;gBAAWG;aAAU,CAACU,MAAM,CAACC,SAASC,IAAI,CAAC;sBAC1D,cAAA,QAAClB;gBACCmB,sBAAQ,QAACjB;;;;;gBACTkB,iBAAgB;gBAChBC,QAAQ,CAAC,EAAEC,KAAK,EAAE,iBAChB,QAACrB,UAAUsB,WAAW;kCACnBT,QAAQU,GAAG,CAAC,CAACC;4BACZ,MAAMC,oBAAoBpC,eAAemC,aAAaE,KAAK,EAAEf;4BAE7D,qBACE,QAACX,UAAU2B,MAAM;gCACfC,QAAQhB,OAAOiB,IAAI,KAAKL,aAAaK,IAAI;gCACzCC,UAAUlB,OAAOiB,IAAI,KAAKL,aAAaK,IAAI;gCAE3CE,SAAS;oCACPrB,mBAAmB;oCACnBW;oCAEA,gHAAgH;oCAChH,MAAMW,eAAe,IAAIC,gBAAgBC,OAAOC,QAAQ,CAACC,MAAM;oCAE/D,MAAMC,MAAM9C,GAAG+C,SAAS,CACtB;wCACE,GAAG/C,GAAGgD,KAAK,CAACP,aAAaQ,QAAQ,IAAI;4CACnCC,OAAO;4CACPC,mBAAmB;wCACrB,EAAE;wCACF9B,QAAQY,aAAaK,IAAI;oCAC3B,GACA;wCAAEc,gBAAgB;oCAAK;oCAGzBlC,qBAAqB;wCACnBD,OAAOoC,IAAI,CAACP;oCACd;gCACF;0CAECZ,sBAAsBD,aAAaK,IAAI,iBACtC,QAACpC;;wCACEgC;wCAAkB;sDAEnB,QAACoB;4CACCxC,WAAW,GAAGH,UAAU,aAAa,CAAC;4CACtC4C,eAAatB,aAAaK,IAAI;sDAE7B,CAAC,CAAC,EAAEL,aAAaK,IAAI,CAAC,CAAC,CAAC;;;;;;;;;;;2DAI7B,QAACgB;oCAAKxC,WAAW,GAAGH,UAAU,aAAa,CAAC;oCAAE4C,eAAatB,aAAaK,IAAI;8CACzEJ;;;;;;+BArCAD,aAAaK,IAAI;;;;;wBA0C5B;;;;;;gBAGJkB,aAAa;gBACbC,MAAK;;;;;;;;;;;IAIb;IAEA,OAAO;AACT,EAAC"}
+{"version":3,"sources":["../../../src/elements/Localizer/index.tsx"],"sourcesContent":["'use client'\nimport { getTranslation } from '@payloadcms/translations'\nimport { useRouter } from 'next/navigation.js'\nimport * as qs from 'qs-esm'\nimport React, { Fragment } from 'react'\n\nimport { useConfig } from '../../providers/Config/index.js'\nimport { useLocale, useLocaleLoading } from '../../providers/Locale/index.js'\nimport { useRouteTransition } from '../../providers/RouteTransition/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { Popup, PopupList } from '../Popup/index.js'\nimport './index.scss'\nimport { LocalizerLabel } from './LocalizerLabel/index.js'\n\nconst baseClass = 'localizer'\n\nexport const Localizer: React.FC<{\n  className?: string\n}> = (props) => {\n  const { className } = props\n  const {\n    config: { localization },\n  } = useConfig()\n\n  const router = useRouter()\n  const { startRouteTransition } = useRouteTransition()\n\n  const { setLocaleIsLoading } = useLocaleLoading()\n\n  const { i18n } = useTranslation()\n  const locale = useLocale()\n\n  if (localization) {\n    const { locales } = localization\n\n    return (\n      <div className={[baseClass, className].filter(Boolean).join(' ')}>\n        <Popup\n          button={<LocalizerLabel />}\n          horizontalAlign=\"right\"\n          render={({ close }) => (\n            <PopupList.ButtonGroup>\n              {locales.map((localeOption) => {\n                const localeOptionLabel = getTranslation(localeOption.label, i18n)\n\n                return (\n                  <PopupList.Button\n                    active={locale.code === localeOption.code}\n                    disabled={locale.code === localeOption.code}\n                    key={localeOption.code}\n                    onClick={() => {\n                      setLocaleIsLoading(true)\n                      close()\n\n                      // can't use `useSearchParams` here because it is stale due to `window.history.pushState` in `ListQueryProvider`\n                      const searchParams = new URLSearchParams(window.location.search)\n\n                      const url = qs.stringify(\n                        {\n                          ...qs.parse(searchParams.toString(), {\n                            depth: 10,\n                            ignoreQueryPrefix: true,\n                          }),\n                          locale: localeOption.code,\n                        },\n                        { addQueryPrefix: true },\n                      )\n\n                      startRouteTransition(() => {\n                        router.push(url)\n                      })\n                    }}\n                  >\n                    {localeOptionLabel !== localeOption.code ? (\n                      <Fragment>\n                        {localeOptionLabel}\n                        &nbsp;\n                        <span\n                          className={`${baseClass}__locale-code`}\n                          data-locale={localeOption.code}\n                        >\n                          {`(${localeOption.code})`}\n                        </span>\n                      </Fragment>\n                    ) : (\n                      <span className={`${baseClass}__locale-code`} data-locale={localeOption.code}>\n                        {localeOptionLabel}\n                      </span>\n                    )}\n                  </PopupList.Button>\n                )\n              })}\n            </PopupList.ButtonGroup>\n          )}\n          showScrollbar\n          size=\"large\"\n        />\n      </div>\n    )\n  }\n\n  return null\n}\n"],"names":["getTranslation","useRouter","qs","Fragment","useConfig","useLocale","useLocaleLoading","useRouteTransition","useTranslation","Popup","PopupList","LocalizerLabel","baseClass","Localizer","props","className","config","localization","router","startRouteTransition","setLocaleIsLoading","i18n","locale","locales","div","filter","Boolean","join","button","horizontalAlign","render","close","ButtonGroup","map","localeOption","localeOptionLabel","label","Button","active","code","disabled","key","onClick","searchParams","URLSearchParams","window","location","search","url","stringify","parse","toString","depth","ignoreQueryPrefix","addQueryPrefix","push","span","data-locale","showScrollbar","size"],"mappings":"AAAA;AACA,SAASA,cAAc,QAAQ,2BAA0B;AACzD,SAASC,SAAS,QAAQ,qBAAoB;AAC9C,YAAYC,QAAQ,SAAQ;AAC5B,SAAgBC,QAAQ,QAAQ,QAAO;AAEvC,SAASC,SAAS,QAAQ,kCAAiC;AAC3D,SAASC,SAAS,EAAEC,gBAAgB,QAAQ,kCAAiC;AAC7E,SAASC,kBAAkB,QAAQ,2CAA0C;AAC7E,SAASC,cAAc,QAAQ,uCAAsC;AACrE,SAASC,KAAK,EAAEC,SAAS,QAAQ,oBAAmB;AACpD,OAAO,eAAc;AACrB,SAASC,cAAc,QAAQ,4BAA2B;AAE1D,MAAMC,YAAY;AAElB,OAAO,MAAMC,YAER,CAACC;IACJ,MAAM,EAAEC,SAAS,EAAE,GAAGD;IACtB,MAAM,EACJE,QAAQ,EAAEC,YAAY,EAAE,EACzB,GAAGb;IAEJ,MAAMc,SAASjB;IACf,MAAM,EAAEkB,oBAAoB,EAAE,GAAGZ;IAEjC,MAAM,EAAEa,kBAAkB,EAAE,GAAGd;IAE/B,MAAM,EAAEe,IAAI,EAAE,GAAGb;IACjB,MAAMc,SAASjB;IAEf,IAAIY,cAAc;QAChB,MAAM,EAAEM,OAAO,EAAE,GAAGN;QAEpB,QACGO,IAAIT,WAAW;YAACH;YAAWG;SAAU,CAACU,MAAM,CAACC,SAASC,IAAI,CAAC,MAAM;QAChE,CAAClB,MACCmB,SAASjB,kBACTkB,gBAAgB,QAChBC,QAAQ,CAAC,EAAEC,KAAK,EAAE,IACfrB,UAAUsB,YAAY;cACrB,CAACT,QAAQU,GAAG,CAAC,CAACC;gBACZ,MAAMC,oBAAoBnC,eAAekC,aAAaE,KAAK,EAAEf;gBAE7D,QACGX,UAAU2B,OACTC,QAAQhB,OAAOiB,IAAI,KAAKL,aAAaK,IAAI,EACzCC,UAAUlB,OAAOiB,IAAI,KAAKL,aAAaK,IAAI,EAC3CE,KAAKP,aAAaK,IAAI,EACtBG,SAAS;oBACPtB,mBAAmB;oBACnBW;oBAEA,gHAAgH;oBAChH,MAAMY,eAAe,IAAIC,gBAAgBC,OAAOC,QAAQ,CAACC,MAAM;oBAE/D,MAAMC,MAAM9C,GAAG+C,SAAS,CACtB;wBACE,GAAG/C,GAAGgD,KAAK,CAACP,aAAaQ,QAAQ,IAAI;4BACnCC,OAAO;4BACPC,mBAAmB;wBACrB,EAAE;wBACF/B,QAAQY,aAAaK,IAAI;oBAC3B,GACA;wBAAEe,gBAAgB;oBAAK;oBAGzBnC,qBAAqB;wBACnBD,OAAOqC,IAAI,CAACP;oBACd;gBACF,GACD;oBACC,CAACb,sBAAsBD,aAAaK,IAAI,IACrCpC,SAAS;wBACR,CAACgC,kBAAkB;;wBAEnB,CAACqB,KACCzC,WAAW,GAAGH,UAAU,aAAa,CAAC,EACtC6C,aAAavB,aAAaK,IAAI,EAC/B;0BACC,CAAC,CAAC,CAAC,EAAEL,aAAaK,IAAI,CAAC,CAAC,CAAC,CAAC;wBAC5B,EAAEiB,KAAK;sBACT,EAAErD,aAEDqD,KAAKzC,WAAW,GAAGH,UAAU,aAAa,CAAC,EAAE6C,aAAavB,aAAaK,IAAI,EAAE;wBAC5E,CAACJ,kBAAkB;sBACrB,EAAEqB,MACF;kBACJ,EAAE9C,UAAU2B;YAEhB,GAAG;YACL,EAAE3B,UAAUsB,cAEd0B,cACAC,KAAK,SACL;MACJ,EAAEnC;IAEN;IAEA,OAAO;AACT,EAAC"}

package/dist/elements/Locked/index.js

@@ -1,6 +1,5 @@
 'use client';
-import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
-import React, { useState } from 'react';
+import { useState } from 'react';
 import { LockIcon } from '../../icons/Lock/index.js';
 import { useTranslation } from '../../providers/Translation/index.js';
 import { isClientUserObject } from '../../utilities/isClientUserObject.js';
@@ -11,38 +10,13 @@ export const Locked = ({ className, user })=>{
     const [hovered, setHovered] = useState(false);
     const { t } = useTranslation();
     const userToUse = isClientUserObject(user) ? user.email ?? user.id : t('general:anotherUser');
-    return /*#__PURE__*/ _jsxDEV("div", {
-        className: [
-            baseClass,
-            className
-        ].filter(Boolean).join(' '),
-        onMouseEnter: ()=>setHovered(true),
-        onMouseLeave: ()=>setHovered(false),
-        role: "button",
-        tabIndex: 0,
-        children: [
-            /*#__PURE__*/ _jsxDEV(Tooltip, {
-                alignCaret: "left",
-                className: `${baseClass}__tooltip`,
-                position: "top",
-                show: hovered,
-                children: `${userToUse} ${t('general:isEditing')}`
-            }, void 0, false, {
-                fileName: "src/elements/Locked/index.tsx",
-                lineNumber: 31,
-                columnNumber: 7
-            }, this),
-            /*#__PURE__*/ _jsxDEV(LockIcon, {}, void 0, false, {
-                fileName: "src/elements/Locked/index.tsx",
-                lineNumber: 37,
-                columnNumber: 7
-            }, this)
-        ]
-    }, void 0, true, {
-        fileName: "src/elements/Locked/index.tsx",
-        lineNumber: 24,
-        columnNumber: 5
-    }, this);
+    return <div className={[
+        baseClass,
+        className
+    ].filter(Boolean).join(' ')} onMouseEnter={()=>setHovered(true)} onMouseLeave={()=>setHovered(false)} role="button" tabIndex={0}>
+      <Tooltip alignCaret="left" className={`${baseClass}__tooltip`} position="top" show={hovered}>{`${userToUse} ${t('general:isEditing')}`}</Tooltip>
+      <LockIcon/>
+    </div>;
 };
 
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/Locked/index.tsx"],"sourcesContent":["'use client'\nimport type { ClientUser } from 'payload'\n\nimport React, { useState } from 'react'\n\nimport { LockIcon } from '../../icons/Lock/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { isClientUserObject } from '../../utilities/isClientUserObject.js'\nimport { Tooltip } from '../Tooltip/index.js'\nimport './index.scss'\n\nconst baseClass = 'locked'\n\nexport const Locked: React.FC<{\n  className?: string\n  user: ClientUser\n}> = ({ className, user }) => {\n  const [hovered, setHovered] = useState(false)\n  const { t } = useTranslation()\n\n  const userToUse = isClientUserObject(user) ? (user.email ?? user.id) : t('general:anotherUser')\n\n  return (\n    <div\n      className={[baseClass, className].filter(Boolean).join(' ')}\n      onMouseEnter={() => setHovered(true)}\n      onMouseLeave={() => setHovered(false)}\n      role=\"button\"\n      tabIndex={0}\n    >\n      <Tooltip\n        alignCaret=\"left\"\n        className={`${baseClass}__tooltip`}\n        position=\"top\"\n        show={hovered}\n      >{`${userToUse} ${t('general:isEditing')}`}</Tooltip>\n      <LockIcon />\n    </div>\n  )\n}\n"],"names":["React","useState","LockIcon","useTranslation","isClientUserObject","Tooltip","baseClass","Locked","className","user","hovered","setHovered","t","userToUse","email","id","div","filter","Boolean","join","onMouseEnter","onMouseLeave","role","tabIndex","alignCaret","position","show"],"mappings":"AAAA;;AAGA,OAAOA,SAASC,QAAQ,QAAQ,QAAO;AAEvC,SAASC,QAAQ,QAAQ,4BAA2B;AACpD,SAASC,cAAc,QAAQ,uCAAsC;AACrE,SAASC,kBAAkB,QAAQ,wCAAuC;AAC1E,SAASC,OAAO,QAAQ,sBAAqB;AAC7C,OAAO,eAAc;AAErB,MAAMC,YAAY;AAElB,OAAO,MAAMC,SAGR,CAAC,EAAEC,SAAS,EAAEC,IAAI,EAAE;IACvB,MAAM,CAACC,SAASC,WAAW,GAAGV,SAAS;IACvC,MAAM,EAAEW,CAAC,EAAE,GAAGT;IAEd,MAAMU,YAAYT,mBAAmBK,QAASA,KAAKK,KAAK,IAAIL,KAAKM,EAAE,GAAIH,EAAE;IAEzE,qBACE,QAACI;QACCR,WAAW;YAACF;YAAWE;SAAU,CAACS,MAAM,CAACC,SAASC,IAAI,CAAC;QACvDC,cAAc,IAAMT,WAAW;QAC/BU,cAAc,IAAMV,WAAW;QAC/BW,MAAK;QACLC,UAAU;;0BAEV,QAAClB;gBACCmB,YAAW;gBACXhB,WAAW,GAAGF,UAAU,SAAS,CAAC;gBAClCmB,UAAS;gBACTC,MAAMhB;0BACN,GAAGG,UAAU,CAAC,EAAED,EAAE,sBAAsB;;;;;;0BAC1C,QAACV;;;;;;;;;;;AAGP,EAAC"}
+{"version":3,"sources":["../../../src/elements/Locked/index.tsx"],"sourcesContent":["'use client'\nimport type { ClientUser } from 'payload'\n\nimport React, { useState } from 'react'\n\nimport { LockIcon } from '../../icons/Lock/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { isClientUserObject } from '../../utilities/isClientUserObject.js'\nimport { Tooltip } from '../Tooltip/index.js'\nimport './index.scss'\n\nconst baseClass = 'locked'\n\nexport const Locked: React.FC<{\n  className?: string\n  user: ClientUser\n}> = ({ className, user }) => {\n  const [hovered, setHovered] = useState(false)\n  const { t } = useTranslation()\n\n  const userToUse = isClientUserObject(user) ? (user.email ?? user.id) : t('general:anotherUser')\n\n  return (\n    <div\n      className={[baseClass, className].filter(Boolean).join(' ')}\n      onMouseEnter={() => setHovered(true)}\n      onMouseLeave={() => setHovered(false)}\n      role=\"button\"\n      tabIndex={0}\n    >\n      <Tooltip\n        alignCaret=\"left\"\n        className={`${baseClass}__tooltip`}\n        position=\"top\"\n        show={hovered}\n      >{`${userToUse} ${t('general:isEditing')}`}</Tooltip>\n      <LockIcon />\n    </div>\n  )\n}\n"],"names":["useState","LockIcon","useTranslation","isClientUserObject","Tooltip","baseClass","Locked","className","user","hovered","setHovered","t","userToUse","email","id","div","filter","Boolean","join","onMouseEnter","onMouseLeave","role","tabIndex","alignCaret","position","show"],"mappings":"AAAA;AAGA,SAAgBA,QAAQ,QAAQ,QAAO;AAEvC,SAASC,QAAQ,QAAQ,4BAA2B;AACpD,SAASC,cAAc,QAAQ,uCAAsC;AACrE,SAASC,kBAAkB,QAAQ,wCAAuC;AAC1E,SAASC,OAAO,QAAQ,sBAAqB;AAC7C,OAAO,eAAc;AAErB,MAAMC,YAAY;AAElB,OAAO,MAAMC,SAGR,CAAC,EAAEC,SAAS,EAAEC,IAAI,EAAE;IACvB,MAAM,CAACC,SAASC,WAAW,GAAGV,SAAS;IACvC,MAAM,EAAEW,CAAC,EAAE,GAAGT;IAEd,MAAMU,YAAYT,mBAAmBK,QAASA,KAAKK,KAAK,IAAIL,KAAKM,EAAE,GAAIH,EAAE;IAEzE,QACGI,IACCR,WAAW;QAACF;QAAWE;KAAU,CAACS,MAAM,CAACC,SAASC,IAAI,CAAC,MACvDC,cAAc,IAAMT,WAAW,OAC/BU,cAAc,IAAMV,WAAW,QAC/BW,KAAK,SACLC,UAAU,GACX;MACC,CAAClB,QACCmB,WAAW,OACXhB,WAAW,GAAGF,UAAU,SAAS,CAAC,EAClCmB,SAAS,MACTC,MAAMhB,UACN,GAAGG,UAAU,CAAC,EAAED,EAAE,sBAAsB,GAAGP,QAAQ;MACrD,CAACH,UAAW;IACd,EAAEc;AAEN,EAAC"}