@payloadcms/ui 3.0.0-canary.a0b06af → 3.0.0-canary.a5aaf21

package/dist/elements/LoadingOverlay/index.js

@@ -1,4 +1,6 @@
 'use client';
+
+import { c as _c } from "react/compiler-runtime";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React, { createContext } from 'react';
 import { LoadingOverlay } from '../../elements/Loading/index.js';
@@ -6,67 +8,126 @@ 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({
-    isOnScreen: false,
-    toggleLoadingOverlay: undefined
+const Context = /*#__PURE__*/createContext({
+  isOnScreen: false,
+  toggleLoadingOverlay: undefined
 });
-export const LoadingOverlayProvider = ({ children })=>{
-    const { t } = useTranslation();
-    const fallbackText = t('general:loading');
-    const [overlays, dispatchOverlay] = React.useReducer(reducer, defaultLoadingOverlayState);
-    const { isMounted, isUnmounting, triggerDelayedRender } = useDelayedRender({
-        delayBeforeShow: 1000,
-        inTimeout: animatedDuration,
-        minShowTime: 500,
-        outTimeout: animatedDuration,
-        show: overlays.isLoading
-    });
-    const toggleLoadingOverlay = React.useCallback(({ type, isLoading, key, loadingText = fallbackText })=>{
-        if (isLoading) {
-            triggerDelayedRender();
-            dispatchOverlay({
-                type: 'add',
-                payload: {
-                    type,
-                    key,
-                    loadingText
-                }
-            });
-        } else {
-            dispatchOverlay({
-                type: 'remove',
-                payload: {
-                    type,
-                    key
-                }
-            });
-        }
-    }, [
-        triggerDelayedRender,
-        fallbackText
-    ]);
-    return /*#__PURE__*/ _jsxs(Context.Provider, {
-        value: {
-            isOnScreen: isMounted,
-            toggleLoadingOverlay
-        },
-        children: [
-            isMounted && /*#__PURE__*/ _jsx(LoadingOverlay, {
-                animationDuration: `${animatedDuration}ms`,
-                loadingText: overlays.loadingText || fallbackText,
-                overlayType: overlays.overlayType,
-                show: !isUnmounting
-            }),
-            children
-        ]
+export const LoadingOverlayProvider = t0 => {
+  const $ = _c(19);
+  const {
+    children
+  } = t0;
+  const {
+    t
+  } = useTranslation();
+  let t1;
+  if ($[0] !== t) {
+    t1 = t("general:loading");
+    $[0] = t;
+    $[1] = t1;
+  } else {
+    t1 = $[1];
+  }
+  const fallbackText = t1;
+  const [overlays, dispatchOverlay] = React.useReducer(reducer, defaultLoadingOverlayState);
+  let t2;
+  if ($[2] !== overlays.isLoading) {
+    t2 = {
+      delayBeforeShow: 1000,
+      inTimeout: animatedDuration,
+      minShowTime: 500,
+      outTimeout: animatedDuration,
+      show: overlays.isLoading
+    };
+    $[2] = overlays.isLoading;
+    $[3] = t2;
+  } else {
+    t2 = $[3];
+  }
+  const {
+    isMounted,
+    isUnmounting,
+    triggerDelayedRender
+  } = useDelayedRender(t2);
+  let t3;
+  if ($[4] !== fallbackText || $[5] !== triggerDelayedRender) {
+    t3 = t4 => {
+      const {
+        type,
+        isLoading,
+        key,
+        loadingText: t5
+      } = t4;
+      const loadingText = t5 === undefined ? fallbackText : t5;
+      if (isLoading) {
+        triggerDelayedRender();
+        dispatchOverlay({
+          type: "add",
+          payload: {
+            type,
+            key,
+            loadingText
+          }
+        });
+      } else {
+        dispatchOverlay({
+          type: "remove",
+          payload: {
+            type,
+            key
+          }
+        });
+      }
+    };
+    $[4] = fallbackText;
+    $[5] = triggerDelayedRender;
+    $[6] = t3;
+  } else {
+    t3 = $[6];
+  }
+  const toggleLoadingOverlay = t3;
+  let t4;
+  if ($[7] !== isMounted || $[8] !== toggleLoadingOverlay || $[9] !== overlays || $[10] !== fallbackText || $[11] !== isUnmounting || $[12] !== children) {
+    let t5;
+    if ($[14] !== isMounted || $[15] !== overlays || $[16] !== fallbackText || $[17] !== isUnmounting) {
+      t5 = isMounted && _jsx(LoadingOverlay, {
+        animationDuration: `${animatedDuration}ms`,
+        loadingText: overlays.loadingText || fallbackText,
+        overlayType: overlays.overlayType,
+        show: !isUnmounting
+      });
+      $[14] = isMounted;
+      $[15] = overlays;
+      $[16] = fallbackText;
+      $[17] = isUnmounting;
+      $[18] = t5;
+    } else {
+      t5 = $[18];
+    }
+    t4 = _jsxs(Context.Provider, {
+      value: {
+        isOnScreen: isMounted,
+        toggleLoadingOverlay
+      },
+      children: [t5, children]
     });
+    $[7] = isMounted;
+    $[8] = toggleLoadingOverlay;
+    $[9] = overlays;
+    $[10] = fallbackText;
+    $[11] = isUnmounting;
+    $[12] = children;
+    $[13] = t4;
+  } else {
+    t4 = $[13];
+  }
+  return t4;
 };
-export const useLoadingOverlay = ()=>{
-    const contextHook = React.useContext(Context);
-    if (contextHook === undefined) {
-        throw new Error('useLoadingOverlay must be used within a LoadingOverlayProvider');
-    }
-    return contextHook;
+export const useLoadingOverlay = () => {
+  const contextHook = React.useContext(Context);
+  if (contextHook === undefined) {
+    throw new Error("useLoadingOverlay must be used within a LoadingOverlayProvider");
+  }
+  return contextHook;
 };
-
 //# sourceMappingURL=index.js.map

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.Provider\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.Provider>\n  )\n}\n\nexport const useLoadingOverlay = (): LoadingOverlayContext => {\n  const contextHook = React.useContext(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","Provider","value","animationDuration","overlayType","useLoadingOverlay","contextHook","useContext","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,MAACP,QAAQyB,QAAQ;QACfC,OAAO;YACLzB,YAAYU;YACZT;QACF;;YAECS,2BACC,KAACjB;gBACCiC,mBAAmB,CAAC,EAAE5B,iBAAiB,EAAE,CAAC;gBAC1CwB,aAAaf,SAASe,WAAW,IAAIhB;gBACrCqB,aAAapB,SAASoB,WAAW;gBACjCV,MAAM,CAACN;;YAGVP;;;AAGP,EAAC;AAED,OAAO,MAAMwB,oBAAoB;IAC/B,MAAMC,cAActC,MAAMuC,UAAU,CAAC/B;IACrC,IAAI8B,gBAAgB3B,WAAW;QAC7B,MAAM,IAAI6B,MAAM;IAClB;IAEA,OAAOF;AACT,EAAC"}
+{"version":3,"file":"index.js","names":["c","_c","React","createContext","LoadingOverlay","useDelayedRender","useTranslation","defaultLoadingOverlayState","reducer","animatedDuration","Context","isOnScreen","toggleLoadingOverlay","undefined","LoadingOverlayProvider","t0","$","children","t","t1","fallbackText","overlays","dispatchOverlay","useReducer","t2","isLoading","delayBeforeShow","inTimeout","minShowTime","outTimeout","show","isMounted","isUnmounting","triggerDelayedRender","t3","t4","type","key","loadingText","t5","payload","_jsx","animationDuration","overlayType","_jsxs","Provider","value","useLoadingOverlay","contextHook","useContext","Error"],"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.Provider\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.Provider>\n  )\n}\n\nexport const useLoadingOverlay = (): LoadingOverlayContext => {\n  const contextHook = React.useContext(Context)\n  if (contextHook === undefined) {\n    throw new Error('useLoadingOverlay must be used within a LoadingOverlayProvider')\n  }\n\n  return contextHook\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/elements/LoadingOverlay/reducer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"reducer.d.ts","sourceRoot":"","sources":["../../../src/elements/LoadingOverlay/reducer.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,YAAY,CAAA;AAE/C,eAAO,MAAM,0BAA0B;;;;;CAKtC,CAAA;AAED,eAAO,MAAM,OAAO,UAAW,KAAK,UAAU,MAAM,KAAG,KAmBtD,CAAA"}
+{"version":3,"file":"reducer.d.ts","sourceRoot":"","sources":["../../../src/elements/LoadingOverlay/reducer.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,YAAY,CAAA;AAE/C,eAAO,MAAM,0BAA0B;;;;;CAKtC,CAAA;AAED,eAAO,MAAM,OAAO,UAAW,KAAK,UAAU,MAAM,KAAG,KAmBtD,CAAA"}

package/dist/elements/LoadingOverlay/reducer.js

@@ -1,31 +1,34 @@
+'use client';
+
 export const defaultLoadingOverlayState = {
-    isLoading: false,
-    loaders: [],
-    loadingText: '',
-    overlayType: null
+  isLoading: false,
+  loaders: [],
+  loadingText: '',
+  overlayType: null
 };
-export const reducer = (state, action)=>{
-    const loadersCopy = [
-        ...state.loaders
-    ];
-    const { type = 'fullscreen', key = 'user', loadingText } = action.payload;
-    if (action.type === 'add') {
-        loadersCopy.push({
-            type,
-            key,
-            loadingText
-        });
-    } else if (action.type === 'remove') {
-        const index = loadersCopy.findIndex((item)=>item.key === key && item.type === type);
-        loadersCopy.splice(index, 1);
-    }
-    const nextLoader = loadersCopy?.length > 0 ? loadersCopy[loadersCopy.length - 1] : null;
-    return {
-        isLoading: Boolean(nextLoader),
-        loaders: loadersCopy,
-        loadingText: nextLoader?.loadingText || state?.loadingText,
-        overlayType: nextLoader?.type || state?.overlayType
-    };
+export const reducer = (state, action) => {
+  const loadersCopy = [...state.loaders];
+  const {
+    type = 'fullscreen',
+    key = 'user',
+    loadingText
+  } = action.payload;
+  if (action.type === 'add') {
+    loadersCopy.push({
+      type,
+      key,
+      loadingText
+    });
+  } else if (action.type === 'remove') {
+    const index = loadersCopy.findIndex(item => item.key === key && item.type === type);
+    loadersCopy.splice(index, 1);
+  }
+  const nextLoader = loadersCopy?.length > 0 ? loadersCopy[loadersCopy.length - 1] : null;
+  return {
+    isLoading: Boolean(nextLoader),
+    loaders: loadersCopy,
+    loadingText: nextLoader?.loadingText || state?.loadingText,
+    overlayType: nextLoader?.type || state?.overlayType
+  };
 };
-
 //# sourceMappingURL=reducer.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/LoadingOverlay/reducer.ts"],"sourcesContent":["import type { Action, State } from './types.js'\n\nexport const defaultLoadingOverlayState = {\n  isLoading: false,\n  loaders: [],\n  loadingText: '',\n  overlayType: null,\n}\n\nexport const reducer = (state: State, action: Action): State => {\n  const loadersCopy = [...state.loaders]\n  const { type = 'fullscreen', key = 'user', loadingText } = action.payload\n\n  if (action.type === 'add') {\n    loadersCopy.push({ type, key, loadingText })\n  } else if (action.type === 'remove') {\n    const index = loadersCopy.findIndex((item) => item.key === key && item.type === type)\n    loadersCopy.splice(index, 1)\n  }\n\n  const nextLoader = loadersCopy?.length > 0 ? loadersCopy[loadersCopy.length - 1] : null\n\n  return {\n    isLoading: Boolean(nextLoader),\n    loaders: loadersCopy,\n    loadingText: nextLoader?.loadingText || state?.loadingText,\n    overlayType: nextLoader?.type || state?.overlayType,\n  }\n}\n"],"names":["defaultLoadingOverlayState","isLoading","loaders","loadingText","overlayType","reducer","state","action","loadersCopy","type","key","payload","push","index","findIndex","item","splice","nextLoader","length","Boolean"],"mappings":"AAEA,OAAO,MAAMA,6BAA6B;IACxCC,WAAW;IACXC,SAAS,EAAE;IACXC,aAAa;IACbC,aAAa;AACf,EAAC;AAED,OAAO,MAAMC,UAAU,CAACC,OAAcC;IACpC,MAAMC,cAAc;WAAIF,MAAMJ,OAAO;KAAC;IACtC,MAAM,EAAEO,OAAO,YAAY,EAAEC,MAAM,MAAM,EAAEP,WAAW,EAAE,GAAGI,OAAOI,OAAO;IAEzE,IAAIJ,OAAOE,IAAI,KAAK,OAAO;QACzBD,YAAYI,IAAI,CAAC;YAAEH;YAAMC;YAAKP;QAAY;IAC5C,OAAO,IAAII,OAAOE,IAAI,KAAK,UAAU;QACnC,MAAMI,QAAQL,YAAYM,SAAS,CAAC,CAACC,OAASA,KAAKL,GAAG,KAAKA,OAAOK,KAAKN,IAAI,KAAKA;QAChFD,YAAYQ,MAAM,CAACH,OAAO;IAC5B;IAEA,MAAMI,aAAaT,aAAaU,SAAS,IAAIV,WAAW,CAACA,YAAYU,MAAM,GAAG,EAAE,GAAG;IAEnF,OAAO;QACLjB,WAAWkB,QAAQF;QACnBf,SAASM;QACTL,aAAac,YAAYd,eAAeG,OAAOH;QAC/CC,aAAaa,YAAYR,QAAQH,OAAOF;IAC1C;AACF,EAAC"}
+{"version":3,"file":"reducer.js","names":["defaultLoadingOverlayState","isLoading","loaders","loadingText","overlayType","reducer","state","action","loadersCopy","type","key","payload","push","index","findIndex","item","splice","nextLoader","length","Boolean"],"sources":["../../../src/elements/LoadingOverlay/reducer.ts"],"sourcesContent":["'use client'\nimport type { Action, State } from './types.js'\n\nexport const defaultLoadingOverlayState = {\n  isLoading: false,\n  loaders: [],\n  loadingText: '',\n  overlayType: null,\n}\n\nexport const reducer = (state: State, action: Action): State => {\n  const loadersCopy = [...state.loaders]\n  const { type = 'fullscreen', key = 'user', loadingText } = action.payload\n\n  if (action.type === 'add') {\n    loadersCopy.push({ type, key, loadingText })\n  } else if (action.type === 'remove') {\n    const index = loadersCopy.findIndex((item) => item.key === key && item.type === type)\n    loadersCopy.splice(index, 1)\n  }\n\n  const nextLoader = loadersCopy?.length > 0 ? loadersCopy[loadersCopy.length - 1] : null\n\n  return {\n    isLoading: Boolean(nextLoader),\n    loaders: loadersCopy,\n    loadingText: nextLoader?.loadingText || state?.loadingText,\n    overlayType: nextLoader?.type || state?.overlayType,\n  }\n}\n"],"mappings":"AAAA;;AAGA,OAAO,MAAMA,0BAAA,GAA6B;EACxCC,SAAA,EAAW;EACXC,OAAA,EAAS,EAAE;EACXC,WAAA,EAAa;EACbC,WAAA,EAAa;AACf;AAEA,OAAO,MAAMC,OAAA,GAAUA,CAACC,KAAA,EAAcC,MAAA;EACpC,MAAMC,WAAA,GAAc,C,GAAIF,KAAA,CAAMJ,OAAO,CAAC;EACtC,MAAM;IAAEO,IAAA,GAAO,YAAY;IAAEC,GAAA,GAAM,MAAM;IAAEP;EAAW,CAAE,GAAGI,MAAA,CAAOI,OAAO;EAEzE,IAAIJ,MAAA,CAAOE,IAAI,KAAK,OAAO;IACzBD,WAAA,CAAYI,IAAI,CAAC;MAAEH,IAAA;MAAMC,GAAA;MAAKP;IAAY;EAC5C,OAAO,IAAII,MAAA,CAAOE,IAAI,KAAK,UAAU;IACnC,MAAMI,KAAA,GAAQL,WAAA,CAAYM,SAAS,CAAEC,IAAA,IAASA,IAAA,CAAKL,GAAG,KAAKA,GAAA,IAAOK,IAAA,CAAKN,IAAI,KAAKA,IAAA;IAChFD,WAAA,CAAYQ,MAAM,CAACH,KAAA,EAAO;EAC5B;EAEA,MAAMI,UAAA,GAAaT,WAAA,EAAaU,MAAA,GAAS,IAAIV,WAAW,CAACA,WAAA,CAAYU,MAAM,GAAG,EAAE,GAAG;EAEnF,OAAO;IACLjB,SAAA,EAAWkB,OAAA,CAAQF,UAAA;IACnBf,OAAA,EAASM,WAAA;IACTL,WAAA,EAAac,UAAA,EAAYd,WAAA,IAAeG,KAAA,EAAOH,WAAA;IAC/CC,WAAA,EAAaa,UAAA,EAAYR,IAAA,IAAQH,KAAA,EAAOF;EAC1C;AACF","ignoreList":[]}

package/dist/elements/LoadingOverlay/types.js

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

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/LoadingOverlay/types.ts"],"sourcesContent":["export type LoadingOverlayTypes = 'fullscreen' | 'withoutNav'\n\ntype ToggleLoadingOverlayOptions = {\n  isLoading?: boolean\n  key: string\n  loadingText?: string\n  type?: LoadingOverlayTypes\n}\nexport type ToggleLoadingOverlay = (options: ToggleLoadingOverlayOptions) => void\n\ntype Add = {\n  payload: {\n    key: string\n    loadingText?: string\n    type: LoadingOverlayTypes\n  }\n  type: 'add'\n}\ntype Remove = {\n  payload: {\n    key: string\n    loadingText?: never\n    type: LoadingOverlayTypes\n  }\n  type: 'remove'\n}\nexport type Action = Add | Remove\nexport type State = {\n  isLoading: boolean\n  loaders: {\n    key: string\n    loadingText: string\n    type: LoadingOverlayTypes\n  }[]\n  loadingText: string\n  overlayType: LoadingOverlayTypes | null\n}\n\nexport type LoadingOverlayContext = {\n  isOnScreen: boolean\n  toggleLoadingOverlay: ToggleLoadingOverlay\n}\n"],"names":[],"mappings":"AAsCA,WAGC"}
+{"version":3,"file":"types.js","names":[],"sources":["../../../src/elements/LoadingOverlay/types.ts"],"sourcesContent":["export type LoadingOverlayTypes = 'fullscreen' | 'withoutNav'\n\ntype ToggleLoadingOverlayOptions = {\n  isLoading?: boolean\n  key: string\n  loadingText?: string\n  type?: LoadingOverlayTypes\n}\nexport type ToggleLoadingOverlay = (options: ToggleLoadingOverlayOptions) => void\n\ntype Add = {\n  payload: {\n    key: string\n    loadingText?: string\n    type: LoadingOverlayTypes\n  }\n  type: 'add'\n}\ntype Remove = {\n  payload: {\n    key: string\n    loadingText?: never\n    type: LoadingOverlayTypes\n  }\n  type: 'remove'\n}\nexport type Action = Add | Remove\nexport type State = {\n  isLoading: boolean\n  loaders: {\n    key: string\n    loadingText: string\n    type: LoadingOverlayTypes\n  }[]\n  loadingText: string\n  overlayType: LoadingOverlayTypes | null\n}\n\nexport type LoadingOverlayContext = {\n  isOnScreen: boolean\n  toggleLoadingOverlay: ToggleLoadingOverlay\n}\n"],"mappings":"AAsCA","ignoreList":[]}

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

@@ -1,4 +1,6 @@
 'use client';
+
+import { c as _c } from "react/compiler-runtime";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { getTranslation } from '@payloadcms/translations';
 import React from 'react';
@@ -7,32 +9,64 @@ import { useLocale } from '../../../providers/Locale/index.js';
 import { useTranslation } from '../../../providers/Translation/index.js';
 import './index.scss';
 const baseClass = 'localizer-button';
-export const LocalizerLabel = (props)=>{
-    const { ariaLabel, className } = props;
-    const locale = useLocale();
-    const { i18n, t } = useTranslation();
-    return /*#__PURE__*/ _jsxs("div", {
-        "aria-label": ariaLabel || t('general:locale'),
-        className: [
-            baseClass,
-            className
-        ].filter(Boolean).join(' '),
-        children: [
-            /*#__PURE__*/ _jsx("div", {
-                className: `${baseClass}__label`,
-                children: `${t('general:locale')}:`
-            }),
-            "  ",
-            /*#__PURE__*/ _jsx("span", {
-                className: `${baseClass}__current-label`,
-                children: `${getTranslation(locale.label, i18n)}`
-            }),
-            " ",
-            /*#__PURE__*/ _jsx(ChevronIcon, {
-                className: `${baseClass}__chevron`
-            })
-        ]
+export const LocalizerLabel = props => {
+  const $ = _c(11);
+  const {
+    ariaLabel,
+    className
+  } = props;
+  const locale = useLocale();
+  const {
+    i18n,
+    t
+  } = useTranslation();
+  let t0;
+  if ($[0] !== ariaLabel || $[1] !== t) {
+    t0 = ariaLabel || t("general:locale");
+    $[0] = ariaLabel;
+    $[1] = t;
+    $[2] = t0;
+  } else {
+    t0 = $[2];
+  }
+  let t1;
+  if ($[3] !== className) {
+    t1 = [baseClass, className].filter(Boolean);
+    $[3] = className;
+    $[4] = t1;
+  } else {
+    t1 = $[4];
+  }
+  const t2 = t1.join(" ");
+  const t3 = `${t("general:locale")}:`;
+  let t4;
+  if ($[5] !== t3 || $[6] !== locale.label || $[7] !== i18n || $[8] !== t0 || $[9] !== t2) {
+    t4 = _jsxs("div", {
+      "aria-label": t0,
+      className: t2,
+      children: [_jsxs("div", {
+        className: `${baseClass}__label`,
+        children: [t3, "\xA0"]
+      }), _jsxs("div", {
+        className: `${baseClass}__current`,
+        children: [_jsx("span", {
+          className: `${baseClass}__current-label`,
+          children: `${getTranslation(locale.label, i18n)}`
+        }), _jsx(ChevronIcon, {
+          className: `${baseClass}__chevron`,
+          size: "small"
+        })]
+      })]
     });
+    $[5] = t3;
+    $[6] = locale.label;
+    $[7] = i18n;
+    $[8] = t0;
+    $[9] = t2;
+    $[10] = t4;
+  } else {
+    t4 = $[10];
+  }
+  return t4;
 };
-
 //# 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    >\n      <div className={`${baseClass}__label`}>{`${t('general:locale')}:`}</div>\n      &nbsp;&nbsp;\n      <span className={`${baseClass}__current-label`}>\n        {`${getTranslation(locale.label, i18n)}`}\n      </span>\n      &nbsp;\n      <ChevronIcon className={`${baseClass}__chevron`} />\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","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,MAACS;QACCC,cAAYN,aAAaI,EAAE;QAC3BH,WAAW;YAACJ;YAAWI;SAAU,CAACM,MAAM,CAACC,SAASC,IAAI,CAAC;;0BAEvD,KAACJ;gBAAIJ,WAAW,CAAC,EAAEJ,UAAU,OAAO,CAAC;0BAAG,CAAC,EAAEO,EAAE,kBAAkB,CAAC,CAAC;;YAAO;0BAExE,KAACM;gBAAKT,WAAW,CAAC,EAAEJ,UAAU,eAAe,CAAC;0BAC3C,CAAC,EAAEL,eAAeU,OAAOS,KAAK,EAAER,MAAM,CAAC;;YACnC;0BAEP,KAACT;gBAAYO,WAAW,CAAC,EAAEJ,UAAU,SAAS,CAAC;;;;AAGrD,EAAC"}
+{"version":3,"file":"index.js","names":["c","_c","getTranslation","React","ChevronIcon","useLocale","useTranslation","baseClass","LocalizerLabel","props","$","ariaLabel","className","locale","i18n","t","t0","t1","filter","Boolean","t2","join","t3","t4","label","_jsxs","children","_jsx","size"],"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    >\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`} size=\"small\" />\n      </div>\n    </div>\n  )\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AACA,SAASC,cAAc,QAAQ;AAC/B,OAAOC,KAAA,MAAW;AAElB,SAASC,WAAW,QAAQ;AAC5B,SAASC,SAAS,QAAQ;AAC1B,SAASC,cAAc,QAAQ;AAC/B,OAAO;AAEP,MAAMC,SAAA,GAAY;AAElB,OAAO,MAAMC,cAAA,GAGRC,KAAA;EAAA,MAAAC,CAAA,GAAAT,EAAA;EACH;IAAAU,SAAA;IAAAC;EAAA,IAAiCH,KAAA;EACjC,MAAAI,MAAA,GAAeR,SAAA;EACf;IAAAS,IAAA;IAAAC;EAAA,IAAoBT,cAAA;EAAA,IAAAU,EAAA;EAAA,IAAAN,CAAA,QAAAC,SAAA,IAAAD,CAAA,QAAAK,CAAA;IAIJC,EAAA,GAAAL,SAAA,IAAaI,CAAA,CAAE;IAAAL,CAAA,MAAAC,SAAA;IAAAD,CAAA,MAAAK,CAAA;IAAAL,CAAA,MAAAM,EAAA;EAAA;IAAAA,EAAA,GAAAN,CAAA;EAAA;EAAA,IAAAO,EAAA;EAAA,IAAAP,CAAA,QAAAE,SAAA;IAChBK,EAAA,IAAAV,SAAA,EAAYK,SAAA,EAAAM,MAAA,CAAAC,OAAkB;IAAAT,CAAA,MAAAE,SAAA;IAAAF,CAAA,MAAAO,EAAA;EAAA;IAAAA,EAAA,GAAAP,CAAA;EAAA;EAA9B,MAAAU,EAAA,GAAAH,EAA8B,CAAAI,IAAA,CAAc;EAEf,MAAAC,EAAA,MAAGP,CAAA,CAAE,oBAAoB;EAAA,IAAAQ,EAAA;EAAA,IAAAb,CAAA,QAAAY,EAAA,IAAAZ,CAAA,QAAAG,MAAA,CAAAW,KAAA,IAAAd,CAAA,QAAAI,IAAA,IAAAJ,CAAA,QAAAM,EAAA,IAAAN,CAAA,QAAAU,EAAA;IAJnEG,EAAA,GAAAE,KAAA,CAAC;MAAA,cACaT,EAAe;MAAAJ,SAAA,EAChBQ,EAA4C;MAAAM,QAAA,GAEvDD,KAAA,CAAC;QAAAb,SAAA,EAAe,GAAAL,SAAA,SAAqB;QAAAmB,QAAA,GAAGJ,EAAyB,EAAC;MAAA,C,GAClEG,KAAA,CAAC;QAAAb,SAAA,EAAe,GAAAL,SAAA,WAAuB;QAAAmB,QAAA,GACrCC,IAAA,CAAC;UAAAf,SAAA,EAAgB,GAAAL,SAAA,iBAA6B;UAAAmB,QAAA,EAC3C,GAAGxB,cAAA,CAAeW,MAAA,CAAAW,KAAA,EAAcV,IAAA;QAAO,C,GAE1Ca,IAAA,CAAAvB,WAAA;UAAAQ,SAAA,EAAwB,GAAAL,SAAA,WAAuB;UAAAqB,IAAA,EAAO;QAAA,C;;;;;;;;;;;;SAT1DL,E;CAaJ","ignoreList":[]}

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

@@ -5,6 +5,10 @@
   align-items: center;
   white-space: nowrap;
   display: flex;
+  padding-inline-start: base(0.4);
+  padding-inline-end: base(0.4);
+  background-color: var(--theme-elevation-100);
+  border-radius: var(--style-radius-s);
 
   &__label {
     color: var(--theme-elevation-500);
@@ -16,6 +20,12 @@
     }
   }
 
+  &__current {
+    display: flex;
+    align-items: center;
+    gap: base(0.3);
+  }
+
   button {
     color: currentColor;
     padding: 0;

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/Localizer/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAA;AASzB,OAAO,cAAc,CAAA;AAIrB,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,CAuDA,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/Localizer/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAA;AAOzB,OAAO,cAAc,CAAA;AAKrB,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,CAgDA,CAAA"}

package/dist/elements/Localizer/index.js

@@ -1,63 +1,101 @@
 'use client';
+
+import { c as _c } from "react/compiler-runtime";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { getTranslation } from '@payloadcms/translations';
-import { useRouter } from 'next/navigation.js';
 import React from 'react';
 import { useConfig } from '../../providers/Config/index.js';
 import { useLocale } from '../../providers/Locale/index.js';
-import { useRouteCache } from '../../providers/RouteCache/index.js';
 import { useSearchParams } from '../../providers/SearchParams/index.js';
 import { useTranslation } from '../../providers/Translation/index.js';
 import { Popup, PopupList } from '../Popup/index.js';
-import { LocalizerLabel } from './LocalizerLabel/index.js';
 import './index.scss';
+import { LocalizerLabel } from './LocalizerLabel/index.js';
 const baseClass = 'localizer';
-export const Localizer = (props)=>{
-    const { className } = props;
-    const config = useConfig();
-    const { localization } = config;
-    const { i18n } = useTranslation();
-    const locale = useLocale();
-    const { stringifyParams } = useSearchParams();
-    const router = useRouter();
-    const { clearRouteCache } = useRouteCache();
-    if (localization) {
-        const { locales } = localization;
-        return /*#__PURE__*/ _jsx("div", {
-            className: [
-                baseClass,
-                className
-            ].filter(Boolean).join(' '),
-            children: /*#__PURE__*/ _jsx(Popup, {
-                button: /*#__PURE__*/ _jsx(LocalizerLabel, {}),
-                horizontalAlign: "right",
-                render: ({ close })=>/*#__PURE__*/ _jsx(PopupList.ButtonGroup, {
-                        children: locales.map((localeOption)=>{
-                            const localeOptionLabel = getTranslation(localeOption.label, i18n);
-                            return /*#__PURE__*/ _jsxs(PopupList.Button, {
-                                active: locale.code === localeOption.code,
-                                onClick: ()=>{
-                                    router.replace(stringifyParams({
-                                        params: {
-                                            locale: localeOption.code
-                                        }
-                                    }));
-                                    clearRouteCache();
-                                    close();
-                                },
-                                children: [
-                                    localeOptionLabel,
-                                    localeOptionLabel !== localeOption.code && ` (${localeOption.code})`
-                                ]
-                            }, localeOption.code);
-                        })
-                    }),
-                showScrollbar: true,
-                size: "large"
+export const Localizer = props => {
+  const $ = _c(13);
+  const {
+    className
+  } = props;
+  const {
+    config
+  } = useConfig();
+  const {
+    localization
+  } = config;
+  const {
+    i18n
+  } = useTranslation();
+  const locale = useLocale();
+  const {
+    stringifyParams
+  } = useSearchParams();
+  if (localization) {
+    const {
+      locales
+    } = localization;
+    let t0;
+    if ($[0] !== className) {
+      t0 = [baseClass, className].filter(Boolean);
+      $[0] = className;
+      $[1] = t0;
+    } else {
+      t0 = $[1];
+    }
+    const t1 = t0.join(" ");
+    let t2;
+    if ($[2] !== locales || $[3] !== i18n || $[4] !== locale.code || $[5] !== stringifyParams || $[6] !== t1) {
+      let t3;
+      if ($[8] !== locales || $[9] !== i18n || $[10] !== locale.code || $[11] !== stringifyParams) {
+        t3 = t4 => {
+          const {
+            close
+          } = t4;
+          return _jsx(PopupList.ButtonGroup, {
+            children: locales.map(localeOption => {
+              const localeOptionLabel = getTranslation(localeOption.label, i18n);
+              return _jsxs(PopupList.Button, {
+                active: locale.code === localeOption.code,
+                href: stringifyParams({
+                  params: {
+                    locale: localeOption.code
+                  }
+                }),
+                onClick: close,
+                children: [localeOptionLabel, localeOptionLabel !== localeOption.code && ` (${localeOption.code})`]
+              }, localeOption.code);
             })
-        });
+          });
+        };
+        $[8] = locales;
+        $[9] = i18n;
+        $[10] = locale.code;
+        $[11] = stringifyParams;
+        $[12] = t3;
+      } else {
+        t3 = $[12];
+      }
+      t2 = _jsx("div", {
+        className: t1,
+        children: _jsx(Popup, {
+          button: _jsx(LocalizerLabel, {}),
+          horizontalAlign: "right",
+          render: t3,
+          showScrollbar: true,
+          size: "large"
+        })
+      });
+      $[2] = locales;
+      $[3] = i18n;
+      $[4] = locale.code;
+      $[5] = stringifyParams;
+      $[6] = t1;
+      $[7] = t2;
+    } else {
+      t2 = $[7];
     }
-    return null;
+    return t2;
+  }
+  return null;
 };
-
 //# sourceMappingURL=index.js.map