@payloadcms/ui 4.0.0-internal.d3909a9 → 4.0.0-internal.d7d662c

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["c","_c","React","useState","LockIcon","useTranslation","isClientUserObject","Tooltip","baseClass","Locked","t0","$","className","user","hovered","setHovered","t","userToUse","email","id","tooltipLabel","t1","filter","Boolean","t2","join","t3","t4","Symbol","for","t5","t6","t7","_jsxs","onBlur","onFocus","onKeyDown","_temp","onMouseEnter","onMouseLeave","role","tabIndex","children","_jsx","alignCaret","position","show","e","key","preventDefault"],"sources":["../../../src/elements/Locked/index.tsx"],"sourcesContent":["'use client'\nimport type { User } 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.css'\n\nconst baseClass = 'locked'\n\nexport const Locked: React.FC<{\n  className?: string\n  user: User\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  const tooltipLabel = `${userToUse} ${t('general:isEditing')}`\n\n  return (\n    <div\n      aria-label={tooltipLabel}\n      className={[baseClass, className].filter(Boolean).join(' ')}\n      onBlur={() => setHovered(false)}\n      onFocus={() => setHovered(true)}\n      onKeyDown={(e) => {\n        if (e.key === ' ') {\n          e.preventDefault() // prevent page scroll when focused\n        }\n      }}\n      onMouseEnter={() => setHovered(true)}\n      onMouseLeave={() => setHovered(false)}\n      role=\"button\"\n      tabIndex={0}\n    >\n      <LockIcon />\n      <Tooltip\n        alignCaret=\"center\"\n        className={`${baseClass}__tooltip`}\n        position=\"bottom\"\n        show={hovered}\n      >\n        {tooltipLabel}\n      </Tooltip>\n    </div>\n  )\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AAGA,OAAOC,KAAA,IAASC,QAAQ,QAAQ;AAEhC,SAASC,QAAQ,QAAQ;AACzB,SAASC,cAAc,QAAQ;AAC/B,SAASC,kBAAkB,QAAQ;AACnC,SAASC,OAAO,QAAQ;AACxB,OAAO;AAEP,MAAMC,SAAA,GAAY;AAElB,OAAO,MAAMC,MAAA,GAGRC,EAAA;EAAA,MAAAC,CAAA,GAAAV,EAAA;EAAC;IAAAW,SAAA;IAAAC;EAAA,IAAAH,EAAmB;EACvB,OAAAI,OAAA,EAAAC,UAAA,IAA8BZ,QAAA,MAAS;EACvC;IAAAa;EAAA,IAAcX,cAAA;EAEd,MAAAY,SAAA,GAAkBX,kBAAA,CAAmBO,IAAA,IAASA,IAAA,CAAAK,KAAA,IAAcL,IAAA,CAAAM,EAAO,GAAIH,CAAA,CAAE;EACzE,MAAAI,YAAA,GAAqB,GAAGH,SAAA,IAAaD,CAAA,CAAE,sBAAsB;EAAA,IAAAK,EAAA;EAAA,IAAAV,CAAA,QAAAC,SAAA;IAK9CS,EAAA,IAAAb,SAAA,EAAYI,SAAA,EAAAU,MAAA,CAAAC,OAAkB;IAAAZ,CAAA,MAAAC,SAAA;IAAAD,CAAA,MAAAU,EAAA;EAAA;IAAAA,EAAA,GAAAV,CAAA;EAAA;EAA9B,MAAAa,EAAA,GAAAH,EAA8B,CAAAI,IAAA,CAAc;EAAA,IAAAC,EAAA;EAAA,IAAAC,EAAA;EAAA,IAAAhB,CAAA,QAAAiB,MAAA,CAAAC,GAAA;IAC/CH,EAAA,GAAAA,CAAA,KAAMX,UAAA,MAAW;IAChBY,EAAA,GAAAA,CAAA,KAAMZ,UAAA,KAAW;IAAAJ,CAAA,MAAAe,EAAA;IAAAf,CAAA,MAAAgB,EAAA;EAAA;IAAAD,EAAA,GAAAf,CAAA;IAAAgB,EAAA,GAAAhB,CAAA;EAAA;EAAA,IAAAmB,EAAA;EAAA,IAAAC,EAAA;EAAA,IAAApB,CAAA,QAAAiB,MAAA,CAAAC,GAAA;IAMZC,EAAA,GAAAA,CAAA,KAAMf,UAAA,KAAW;IACjBgB,EAAA,GAAAA,CAAA,KAAMhB,UAAA,MAAW;IAAAJ,CAAA,MAAAmB,EAAA;IAAAnB,CAAA,MAAAoB,EAAA;EAAA;IAAAD,EAAA,GAAAnB,CAAA;IAAAoB,EAAA,GAAApB,CAAA;EAAA;EAAA,IAAAqB,EAAA;EAAA,IAAArB,CAAA,QAAAG,OAAA,IAAAH,CAAA,QAAAa,EAAA,IAAAb,CAAA,QAAAS,YAAA;IAXjCY,EAAA,GAAAC,KAAA,CAAC;MAAA,cACab,YAAA;MAAAR,SAAA,EACDY,EAA4C;MAAAU,MAAA,EAC/CR,EAAiB;MAAAS,OAAA,EAChBR,EAAiB;MAAAS,SAAA,EAAAC,KAAA;MAAAC,YAAA,EAMZR,EAAiB;MAAAS,YAAA,EACjBR,EAAiB;MAAAS,IAAA,EAC1B;MAAAC,QAAA;MAAAC,QAAA,GAGLC,IAAA,CAAAvC,QAAA,IAAC,GACDuC,IAAA,CAAApC,OAAA;QAAAqC,UAAA,EACa;QAAAhC,SAAA,EACA,GAAAJ,SAAA,WAAuB;QAAAqC,QAAA,EACzB;QAAAC,IAAA,EACHhC,OAAA;QAAA4B,QAAA,EAELtB;MAAA,C;;;;;;;;;SAtBLY,E;CA0BJ;AAlCK,SAAAK,MAAAU,CAAA;EAAA,IAcOA,CAAA,CAAAC,GAAA,KAAU;IACZD,CAAA,CAAAE,cAAA,CAAgB;EAAA;AAAA","ignoreList":[]}
+{"version":3,"file":"index.js","names":["c","_c","React","useState","LockIcon","useTranslation","isClientUserObject","Tooltip","baseClass","Locked","t0","$","className","user","hovered","setHovered","t","t1","email","id","userToUse","t2","tooltipLabel","t3","filter","Boolean","t4","join","t5","t6","Symbol","for","t7","t8","t9","_jsxs","onBlur","onFocus","onKeyDown","_temp","onMouseEnter","onMouseLeave","role","tabIndex","children","_jsx","alignCaret","position","show","e","key","preventDefault"],"sources":["../../../src/elements/Locked/index.tsx"],"sourcesContent":["'use client'\nimport type { User } 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.css'\n\nconst baseClass = 'locked'\n\nexport const Locked: React.FC<{\n  className?: string\n  user: User\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  const tooltipLabel = `${userToUse} ${t('general:isEditing')}`\n\n  return (\n    <div\n      aria-label={tooltipLabel}\n      className={[baseClass, className].filter(Boolean).join(' ')}\n      onBlur={() => setHovered(false)}\n      onFocus={() => setHovered(true)}\n      onKeyDown={(e) => {\n        if (e.key === ' ') {\n          e.preventDefault() // prevent page scroll when focused\n        }\n      }}\n      onMouseEnter={() => setHovered(true)}\n      onMouseLeave={() => setHovered(false)}\n      role=\"button\"\n      tabIndex={0}\n    >\n      <LockIcon />\n      <Tooltip\n        alignCaret=\"center\"\n        className={`${baseClass}__tooltip`}\n        position=\"bottom\"\n        show={hovered}\n      >\n        {tooltipLabel}\n      </Tooltip>\n    </div>\n  )\n}\n"],"mappings":"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","ignoreList":[]}

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["c","_c","formatAdminURL","React","LogOutIcon","useConfig","useTranslation","Link","baseClass","Logout","t0","$","tabIndex","t1","undefined","t","config","admin","t2","routes","t3","t4","logout","logoutRoute","adminRoute","t5","_jsx","className","href","path","prefetch","title","children"],"sources":["../../../src/elements/Logout/index.tsx"],"sourcesContent":["'use client'\nimport { formatAdminURL } from 'payload/shared'\nimport React from 'react'\n\nimport { LogOutIcon } from '../../icons/LogOut/index.js'\nimport { useConfig } from '../../providers/Config/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { Link } from '../Link/index.js'\n\nconst baseClass = 'nav'\n\nexport const Logout: React.FC<{\n  tabIndex?: number\n}> = ({ tabIndex = 0 }) => {\n  const { t } = useTranslation()\n  const { config } = useConfig()\n\n  const {\n    admin: {\n      routes: { logout: logoutRoute },\n    },\n    routes: { admin: adminRoute },\n  } = config\n\n  return (\n    <Link\n      aria-label={t('authentication:logOut')}\n      className={`${baseClass}__log-out`}\n      href={formatAdminURL({\n        adminRoute,\n        path: logoutRoute,\n      })}\n      prefetch={false}\n      tabIndex={tabIndex}\n      title={t('authentication:logOut')}\n    >\n      <LogOutIcon />\n    </Link>\n  )\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AACA,SAASC,cAAc,QAAQ;AAC/B,OAAOC,KAAA,MAAW;AAElB,SAASC,UAAU,QAAQ;AAC3B,SAASC,SAAS,QAAQ;AAC1B,SAASC,cAAc,QAAQ;AAC/B,SAASC,IAAI,QAAQ;AAErB,MAAMC,SAAA,GAAY;AAElB,OAAO,MAAMC,MAAA,GAERC,EAAA;EAAA,MAAAC,CAAA,GAAAV,EAAA;EAAC;IAAAW,QAAA,EAAAC;EAAA,IAAAH,EAAgB;EAAd,MAAAE,QAAA,GAAAC,EAAY,KAAAC,SAAA,OAAZD,EAAY;EAClB;IAAAE;EAAA,IAAcT,cAAA;EACd;IAAAU;EAAA,IAAmBX,SAAA;EAEnB;IAAAY,KAAA,EAAAC,EAAA;IAAAC,MAAA,EAAAC;EAAA,IAKIJ,MAAA;EAJK;IAAAG,MAAA,EAAAE;EAAA,IAAAH,EAEN;EADS;IAAAI,MAAA,EAAAC;EAAA,IAAAF,EAAuB;EAEzB;IAAAJ,KAAA,EAAAO;EAAA,IAAAJ,EAAqB;EAAA,IAAAK,EAAA;EAAA,IAAAd,CAAA,QAAAa,UAAA,IAAAb,CAAA,QAAAY,WAAA,IAAAZ,CAAA,QAAAI,CAAA,IAAAJ,CAAA,QAAAC,QAAA;IAI7Ba,EAAA,GAAAC,IAAA,CAAAnB,IAAA;MAAA,cACcQ,CAAA,CAAE;MAAAY,SAAA,EACH,GAAAnB,SAAA,WAAuB;MAAAoB,IAAA,EAC5B1B,cAAA;QAAAsB,UAAA;QAAAK,IAAA,EAEEN;MAAA,CACR;MAAAO,QAAA;MAAAlB,QAAA;MAAAmB,KAAA,EAGOhB,CAAA,CAAE;MAAAiB,QAAA,EAETN,IAAA,CAAAtB,UAAA,IAAC;IAAA,C;;;;;;;;;SAXHqB,E;CAcJ","ignoreList":[]}
+{"version":3,"file":"index.js","names":["c","_c","formatAdminURL","React","LogOutIcon","useConfig","useTranslation","Link","baseClass","Logout","t0","$","tabIndex","t1","undefined","t","config","admin","t2","routes","t3","t4","logout","logoutRoute","adminRoute","t5","_jsx","className","href","path","prefetch","title","children"],"sources":["../../../src/elements/Logout/index.tsx"],"sourcesContent":["'use client'\nimport { formatAdminURL } from 'payload/shared'\nimport React from 'react'\n\nimport { LogOutIcon } from '../../icons/LogOut/index.js'\nimport { useConfig } from '../../providers/Config/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { Link } from '../Link/index.js'\n\nconst baseClass = 'nav'\n\nexport const Logout: React.FC<{\n  tabIndex?: number\n}> = ({ tabIndex = 0 }) => {\n  const { t } = useTranslation()\n  const { config } = useConfig()\n\n  const {\n    admin: {\n      routes: { logout: logoutRoute },\n    },\n    routes: { admin: adminRoute },\n  } = config\n\n  return (\n    <Link\n      aria-label={t('authentication:logOut')}\n      className={`${baseClass}__log-out`}\n      href={formatAdminURL({\n        adminRoute,\n        path: logoutRoute,\n      })}\n      prefetch={false}\n      tabIndex={tabIndex}\n      title={t('authentication:logOut')}\n    >\n      <LogOutIcon />\n    </Link>\n  )\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AACA,SAASC,cAAc,QAAQ;AAC/B,OAAOC,KAAA,MAAW;AAElB,SAASC,UAAU,QAAQ;AAC3B,SAASC,SAAS,QAAQ;AAC1B,SAASC,cAAc,QAAQ;AAC/B,SAASC,IAAI,QAAQ;AAErB,MAAMC,SAAA,GAAY;AAElB,OAAO,MAAMC,MAAA,GAERC,EAAA;EAAA,MAAAC,CAAA,GAAAV,EAAA;EAAC;IAAAW,QAAA,EAAAC;EAAA,IAAAH,EAAgB;EAAd,MAAAE,QAAA,GAAAC,EAAY,KAAZC,SAAY,GAAZ,CAAY,GAAZD,EAAY;EAClB;IAAAE;EAAA,IAAcT,cAAA;EACd;IAAAU;EAAA,IAAmBX,SAAA;EAEnB;IAAAY,KAAA,EAAAC,EAAA;IAAAC,MAAA,EAAAC;EAAA,IAKIJ,MAAA;EAJK;IAAAG,MAAA,EAAAE;EAAA,IAAAH,EAEN;EADS;IAAAI,MAAA,EAAAC;EAAA,IAAAF,EAAuB;EAEzB;IAAAJ,KAAA,EAAAO;EAAA,IAAAJ,EAAqB;EAAA,IAAAK,EAAA;EAAA,IAAAd,CAAA,QAAAa,UAAA,IAAAb,CAAA,QAAAY,WAAA,IAAAZ,CAAA,QAAAI,CAAA,IAAAJ,CAAA,QAAAC,QAAA;IAI7Ba,EAAA,GAAAC,IAAA,CAACnB,IAAA;MAAA,cACaQ,CAAA,CAAE;MAAAY,SAAA,EACH,GAAGnB,SAAA,WAAoB;MAAAoB,IAAA,EAC5B1B,cAAA,CAAe;QAAAsB,UAAA;QAAAK,IAAA,EAEbN;MACR;MAAAO,QAAA,EACU;MAAAlB,QAAA;MAAAmB,KAAA,EAEHhB,CAAA,CAAE;MAAAiB,QAAA,EAETN,IAAA,CAACtB,UAAA;;;;;;;;;;SAXHqB,E;CAcJ","ignoreList":[]}

package/dist/elements/MiniCarousel/index.js

@@ -1,5 +1,6 @@
 'use client';
 
+import { c as _c } from "react/compiler-runtime";
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import React from 'react';
 import { useTranslation } from '../../providers/Translation/index.js';
@@ -26,13 +27,15 @@ const MiniCarouselItem = ({
     })
   });
 };
-export const MiniCarousel = ({
-  doc,
-  imageCacheTag,
-  onSelect,
-  selectedSize,
-  uploadConfig
-}) => {
+export const MiniCarousel = t0 => {
+  const $ = _c(18);
+  const {
+    doc,
+    imageCacheTag,
+    onSelect,
+    selectedSize,
+    uploadConfig
+  } = t0;
   const {
     t
   } = useTranslation();
@@ -43,42 +46,103 @@ export const MiniCarousel = ({
     url: originalUrl,
     variants: sizes
   } = doc;
-  const orderedSizeKeys = React.useMemo(() => {
+  let t1;
+  bb0: {
     if (!variants || variants.length === 0) {
-      return Object.keys(sizes || {});
+      let t2;
+      if ($[0] !== sizes) {
+        t2 = Object.keys(sizes || {});
+        $[0] = sizes;
+        $[1] = t2;
+      } else {
+        t2 = $[1];
+      }
+      t1 = t2;
+      break bb0;
     }
-    return variants.map(({
-      name
-    }) => name).filter(name_0 => sizes?.[name_0]?.url);
-  }, [variants, sizes]);
+    let t2;
+    if ($[2] !== sizes || $[3] !== variants) {
+      let t3;
+      if ($[5] !== sizes) {
+        t3 = name_0 => sizes?.[name_0]?.url;
+        $[5] = sizes;
+        $[6] = t3;
+      } else {
+        t3 = $[6];
+      }
+      t2 = variants.map(_temp).filter(t3);
+      $[2] = sizes;
+      $[3] = variants;
+      $[4] = t2;
+    } else {
+      t2 = $[4];
+    }
+    t1 = t2;
+  }
+  const orderedSizeKeys = t1;
   if (!originalUrl) {
     return null;
   }
-  return /*#__PURE__*/_jsxs("div", {
-    className: [baseClass, 'scrollbar-thin'].join(' '),
-    children: [/*#__PURE__*/_jsx(MiniCarouselItem, {
-      active: selectedSize === null,
-      imageCacheTag: imageCacheTag,
-      label: t('general:original'),
-      onClick: () => onSelect(null),
-      url: originalUrl
-    }), orderedSizeKeys.length > 0 && /*#__PURE__*/_jsxs(_Fragment, {
-      children: [/*#__PURE__*/_jsx("div", {
-        className: `${baseClass}__divider`
-      }), orderedSizeKeys.map(key => {
-        const sizeData = sizes?.[key];
-        if (!sizeData?.url) {
-          return null;
-        }
-        return /*#__PURE__*/_jsx(MiniCarouselItem, {
-          active: selectedSize === key,
-          imageCacheTag: imageCacheTag,
-          label: key,
-          onClick: () => onSelect(key),
-          url: sizeData.url
-        }, key);
+  let t2;
+  if ($[7] === Symbol.for("react.memo_cache_sentinel")) {
+    t2 = [baseClass, "scrollbar-thin"];
+    $[7] = t2;
+  } else {
+    t2 = $[7];
+  }
+  let t3;
+  if ($[8] !== imageCacheTag || $[9] !== onSelect || $[10] !== orderedSizeKeys || $[11] !== originalUrl || $[12] !== selectedSize || $[13] !== sizes || $[14] !== t) {
+    let t4;
+    if ($[16] !== onSelect) {
+      t4 = () => onSelect(null);
+      $[16] = onSelect;
+      $[17] = t4;
+    } else {
+      t4 = $[17];
+    }
+    t3 = _jsxs("div", {
+      className: t2.join(" "),
+      children: [_jsx(MiniCarouselItem, {
+        active: selectedSize === null,
+        imageCacheTag,
+        label: t("general:original"),
+        onClick: t4,
+        url: originalUrl
+      }), orderedSizeKeys.length > 0 && _jsxs(_Fragment, {
+        children: [_jsx("div", {
+          className: `${baseClass}__divider`
+        }), orderedSizeKeys.map(key => {
+          const sizeData = sizes?.[key];
+          if (!sizeData?.url) {
+            return null;
+          }
+          return _jsx(MiniCarouselItem, {
+            active: selectedSize === key,
+            imageCacheTag,
+            label: key,
+            onClick: () => onSelect(key),
+            url: sizeData.url
+          }, key);
+        })]
       })]
-    })]
-  });
+    });
+    $[8] = imageCacheTag;
+    $[9] = onSelect;
+    $[10] = orderedSizeKeys;
+    $[11] = originalUrl;
+    $[12] = selectedSize;
+    $[13] = sizes;
+    $[14] = t;
+    $[15] = t3;
+  } else {
+    t3 = $[15];
+  }
+  return t3;
 };
+function _temp(t0) {
+  const {
+    name
+  } = t0;
+  return name;
+}
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["React","useTranslation","appendCacheTag","baseClass","MiniCarouselItem","active","imageCacheTag","label","onClick","url","src","_jsx","className","filter","Boolean","join","type","alt","MiniCarousel","doc","onSelect","selectedSize","uploadConfig","t","variants","originalUrl","sizes","orderedSizeKeys","useMemo","length","Object","keys","map","name","_jsxs","_Fragment","key","sizeData"],"sources":["../../../src/elements/MiniCarousel/index.tsx"],"sourcesContent":["'use client'\nimport type { Data, FileSizes, SanitizedCollectionConfig } from 'payload'\n\nimport React from 'react'\n\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { appendCacheTag } from '../../utilities/appendCacheTag.js'\nimport './index.css'\n\nconst baseClass = 'mini-carousel'\n\ntype MiniCarouselItemProps = {\n  active: boolean\n  imageCacheTag?: false | string\n  label: string\n  onClick: () => void\n  url: string\n}\n\nconst MiniCarouselItem: React.FC<MiniCarouselItemProps> = ({\n  active,\n  imageCacheTag,\n  label,\n  onClick,\n  url,\n}) => {\n  const src = appendCacheTag(url, imageCacheTag)\n\n  return (\n    <button\n      aria-label={label}\n      aria-pressed={active ? 'true' : 'false'}\n      className={[`${baseClass}__item`, active && `${baseClass}__item--active`]\n        .filter(Boolean)\n        .join(' ')}\n      onClick={onClick}\n      type=\"button\"\n    >\n      <img alt={label} src={src} />\n    </button>\n  )\n}\n\nexport type MiniCarouselProps = {\n  doc: {\n    url?: string\n    variants?: FileSizes\n  } & Data\n  imageCacheTag?: false | string\n  onSelect: (sizeKey: null | string) => void\n  selectedSize: null | string\n  uploadConfig: SanitizedCollectionConfig['upload']\n}\n\nexport const MiniCarousel: React.FC<MiniCarouselProps> = ({\n  doc,\n  imageCacheTag,\n  onSelect,\n  selectedSize,\n  uploadConfig,\n}) => {\n  const { t } = useTranslation()\n  const { variants } = uploadConfig\n  const { url: originalUrl, variants: sizes } = doc\n\n  const orderedSizeKeys = React.useMemo(() => {\n    if (!variants || variants.length === 0) {\n      return Object.keys(sizes || {})\n    }\n    return variants.map(({ name }) => name).filter((name) => sizes?.[name]?.url)\n  }, [variants, sizes])\n\n  if (!originalUrl) {\n    return null\n  }\n\n  return (\n    <div className={[baseClass, 'scrollbar-thin'].join(' ')}>\n      <MiniCarouselItem\n        active={selectedSize === null}\n        imageCacheTag={imageCacheTag}\n        label={t('general:original')}\n        onClick={() => onSelect(null)}\n        url={originalUrl}\n      />\n\n      {orderedSizeKeys.length > 0 && (\n        <>\n          <div className={`${baseClass}__divider`} />\n          {orderedSizeKeys.map((key) => {\n            const sizeData = sizes?.[key]\n            if (!sizeData?.url) {\n              return null\n            }\n            return (\n              <MiniCarouselItem\n                active={selectedSize === key}\n                imageCacheTag={imageCacheTag}\n                key={key}\n                label={key}\n                onClick={() => onSelect(key)}\n                url={sizeData.url}\n              />\n            )\n          })}\n        </>\n      )}\n    </div>\n  )\n}\n"],"mappings":"AAAA;;;AAGA,OAAOA,KAAA,MAAW;AAElB,SAASC,cAAc,QAAQ;AAC/B,SAASC,cAAc,QAAQ;AAC/B,OAAO;AAEP,MAAMC,SAAA,GAAY;AAUlB,MAAMC,gBAAA,GAAoDA,CAAC;EACzDC,MAAM;EACNC,aAAa;EACbC,KAAK;EACLC,OAAO;EACPC;AAAG,CACJ;EACC,MAAMC,GAAA,GAAMR,cAAA,CAAeO,GAAA,EAAKH,aAAA;EAEhC,oBACEK,IAAA,CAAC;IACC,cAAYJ,KAAA;IACZ,gBAAcF,MAAA,GAAS,SAAS;IAChCO,SAAA,EAAW,CAAC,GAAGT,SAAA,QAAiB,EAAEE,MAAA,IAAU,GAAGF,SAAA,gBAAyB,CAAC,CACtEU,MAAM,CAACC,OAAA,EACPC,IAAI,CAAC;IACRP,OAAA,EAASA,OAAA;IACTQ,IAAA,EAAK;cAEL,aAAAL,IAAA,CAAC;MAAIM,GAAA,EAAKV,KAAA;MAAOG,GAAA,EAAKA;;;AAG5B;AAaA,OAAO,MAAMQ,YAAA,GAA4CA,CAAC;EACxDC,GAAG;EACHb,aAAa;EACbc,QAAQ;EACRC,YAAY;EACZC;AAAY,CACb;EACC,MAAM;IAAEC;EAAC,CAAE,GAAGtB,cAAA;EACd,MAAM;IAAEuB;EAAQ,CAAE,GAAGF,YAAA;EACrB,MAAM;IAAEb,GAAA,EAAKgB,WAAW;IAAED,QAAA,EAAUE;EAAK,CAAE,GAAGP,GAAA;EAE9C,MAAMQ,eAAA,GAAkB3B,KAAA,CAAM4B,OAAO,CAAC;IACpC,IAAI,CAACJ,QAAA,IAAYA,QAAA,CAASK,MAAM,KAAK,GAAG;MACtC,OAAOC,MAAA,CAAOC,IAAI,CAACL,KAAA,IAAS,CAAC;IAC/B;IACA,OAAOF,QAAA,CAASQ,GAAG,CAAC,CAAC;MAAEC;IAAI,CAAE,KAAKA,IAAA,EAAMpB,MAAM,CAAEoB,MAAA,IAASP,KAAA,GAAQO,MAAA,CAAK,EAAExB,GAAA;EAC1E,GAAG,CAACe,QAAA,EAAUE,KAAA,CAAM;EAEpB,IAAI,CAACD,WAAA,EAAa;IAChB,OAAO;EACT;EAEA,oBACES,KAAA,CAAC;IAAItB,SAAA,EAAW,CAACT,SAAA,EAAW,iBAAiB,CAACY,IAAI,CAAC;4BACjDJ,IAAA,CAACP,gBAAA;MACCC,MAAA,EAAQgB,YAAA,KAAiB;MACzBf,aAAA,EAAeA,aAAA;MACfC,KAAA,EAAOgB,CAAA,CAAE;MACTf,OAAA,EAASA,CAAA,KAAMY,QAAA,CAAS;MACxBX,GAAA,EAAKgB;QAGNE,eAAA,CAAgBE,MAAM,GAAG,kBACxBK,KAAA,CAAAC,SAAA;8BACExB,IAAA,CAAC;QAAIC,SAAA,EAAW,GAAGT,SAAA;UAClBwB,eAAA,CAAgBK,GAAG,CAAEI,GAAA;QACpB,MAAMC,QAAA,GAAWX,KAAA,GAAQU,GAAA,CAAI;QAC7B,IAAI,CAACC,QAAA,EAAU5B,GAAA,EAAK;UAClB,OAAO;QACT;QACA,oBACEE,IAAA,CAACP,gBAAA;UACCC,MAAA,EAAQgB,YAAA,KAAiBe,GAAA;UACzB9B,aAAA,EAAeA,aAAA;UAEfC,KAAA,EAAO6B,GAAA;UACP5B,OAAA,EAASA,CAAA,KAAMY,QAAA,CAASgB,GAAA;UACxB3B,GAAA,EAAK4B,QAAA,CAAS5B;WAHT2B,GAAA;MAMX;;;AAKV","ignoreList":[]}
+{"version":3,"file":"index.js","names":["c","_c","React","useTranslation","appendCacheTag","baseClass","MiniCarouselItem","active","imageCacheTag","label","onClick","url","src","_jsx","className","filter","Boolean","join","type","alt","MiniCarousel","t0","$","doc","onSelect","selectedSize","uploadConfig","t","variants","originalUrl","sizes","t1","bb0","length","t2","Object","keys","t3","name_0","name","map","_temp","orderedSizeKeys","Symbol","for","t4","_jsxs","children","_Fragment","key","sizeData"],"sources":["../../../src/elements/MiniCarousel/index.tsx"],"sourcesContent":["'use client'\nimport type { Data, FileSizes, SanitizedCollectionConfig } from 'payload'\n\nimport React from 'react'\n\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { appendCacheTag } from '../../utilities/appendCacheTag.js'\nimport './index.css'\n\nconst baseClass = 'mini-carousel'\n\ntype MiniCarouselItemProps = {\n  active: boolean\n  imageCacheTag?: false | string\n  label: string\n  onClick: () => void\n  url: string\n}\n\nconst MiniCarouselItem: React.FC<MiniCarouselItemProps> = ({\n  active,\n  imageCacheTag,\n  label,\n  onClick,\n  url,\n}) => {\n  const src = appendCacheTag(url, imageCacheTag)\n\n  return (\n    <button\n      aria-label={label}\n      aria-pressed={active ? 'true' : 'false'}\n      className={[`${baseClass}__item`, active && `${baseClass}__item--active`]\n        .filter(Boolean)\n        .join(' ')}\n      onClick={onClick}\n      type=\"button\"\n    >\n      <img alt={label} src={src} />\n    </button>\n  )\n}\n\nexport type MiniCarouselProps = {\n  doc: {\n    url?: string\n    variants?: FileSizes\n  } & Data\n  imageCacheTag?: false | string\n  onSelect: (sizeKey: null | string) => void\n  selectedSize: null | string\n  uploadConfig: SanitizedCollectionConfig['upload']\n}\n\nexport const MiniCarousel: React.FC<MiniCarouselProps> = ({\n  doc,\n  imageCacheTag,\n  onSelect,\n  selectedSize,\n  uploadConfig,\n}) => {\n  const { t } = useTranslation()\n  const { variants } = uploadConfig\n  const { url: originalUrl, variants: sizes } = doc\n\n  const orderedSizeKeys = React.useMemo(() => {\n    if (!variants || variants.length === 0) {\n      return Object.keys(sizes || {})\n    }\n    return variants.map(({ name }) => name).filter((name) => sizes?.[name]?.url)\n  }, [variants, sizes])\n\n  if (!originalUrl) {\n    return null\n  }\n\n  return (\n    <div className={[baseClass, 'scrollbar-thin'].join(' ')}>\n      <MiniCarouselItem\n        active={selectedSize === null}\n        imageCacheTag={imageCacheTag}\n        label={t('general:original')}\n        onClick={() => onSelect(null)}\n        url={originalUrl}\n      />\n\n      {orderedSizeKeys.length > 0 && (\n        <>\n          <div className={`${baseClass}__divider`} />\n          {orderedSizeKeys.map((key) => {\n            const sizeData = sizes?.[key]\n            if (!sizeData?.url) {\n              return null\n            }\n            return (\n              <MiniCarouselItem\n                active={selectedSize === key}\n                imageCacheTag={imageCacheTag}\n                key={key}\n                label={key}\n                onClick={() => onSelect(key)}\n                url={sizeData.url}\n              />\n            )\n          })}\n        </>\n      )}\n    </div>\n  )\n}\n"],"mappings":"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","ignoreList":[]}

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/Modal/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AAE3C,OAAO,EAAE,KAAK,IAAI,aAAa,EAAY,MAAM,oBAAoB,CAAA;AACrE,OAAO,KAA6B,MAAM,OAAO,CAAA;AAEjD,OAAO,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAA;AAE7C,eAAO,MAAM,KAAK,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CAAC,OAAO,aAAa,CAAC,CA2EhE,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/Modal/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AAE3C,OAAO,EAAE,KAAK,IAAI,aAAa,EAAY,MAAM,oBAAoB,CAAA;AACrE,OAAO,KAAsD,MAAM,OAAO,CAAA;AAI1E,OAAO,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAA;AAE7C,eAAO,MAAM,KAAK,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CAAC,OAAO,aAAa,CAAC,CA+FhE,CAAA"}

package/dist/elements/Modal/index.js

@@ -2,7 +2,8 @@
 
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Modal as FacelessModal, useModal } from '@faceless-ui/modal';
-import React, { useEffect, useMemo } from 'react';
+import React, { useEffect, useLayoutEffect, useMemo, useRef } from 'react';
+import { useModalFocus } from '../../providers/ModalFocus/index.js';
 export { useModal } from '@faceless-ui/modal';
 export const Modal = props => {
   const {
@@ -18,6 +19,16 @@ export const Modal = props => {
     modalState
   } = useModal();
   const isOpen = Boolean(modalState[slug]?.isOpen);
+  const popupFocusTargetsRef = useRef([]);
+  const {
+    getReturnFocusTargets
+  } = useModalFocus();
+  useLayoutEffect(() => {
+    if (isOpen) {
+      // Freeze each modal's targets before focus moves into it or a nested modal.
+      popupFocusTargetsRef.current = getReturnFocusTargets();
+    }
+  }, [getReturnFocusTargets, isOpen]);
   const options = useMemo(() => ({
     escapeDeactivates: false,
     initialFocus: () => {
@@ -28,6 +39,7 @@ export const Modal = props => {
       }
       return heading ?? modal;
     },
+    setReturnFocus: opener => (popupFocusTargetsRef.current.length ? popupFocusTargetsRef.current : [opener]).find(element => element?.isConnected && element !== document.body && element !== document.documentElement && !element.closest('[inert]') && !element.matches(':disabled') && element.getClientRects().length > 0 && getComputedStyle(element).visibility !== 'hidden') ?? false,
     ...focusTrapOptions
   }), [modalID, focusTrapOptions]);
   useEffect(() => {

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["Modal","FacelessModal","useModal","React","useEffect","useMemo","props","id","slug","ariaLabel","ariaLabelledBy","focusTrapOptions","trapFocus","modalID","modalState","isOpen","Boolean","options","escapeDeactivates","initialFocus","modal","document","getElementById","heading","querySelector","tabIndex","hasFocusedTitle","updateTitle","setAttribute","removeAttribute","undefined","closest","activeElement","body","focus","preventScroll","observer","MutationObserver","observe","childList","subtree","disconnect","_jsx"],"sources":["../../../src/elements/Modal/index.tsx"],"sourcesContent":["'use client'\n\nimport type { ComponentProps } from 'react'\n\nimport { Modal as FacelessModal, useModal } from '@faceless-ui/modal'\nimport React, { useEffect, useMemo } from 'react'\n\nexport { useModal } from '@faceless-ui/modal'\n\nexport const Modal: React.FC<ComponentProps<typeof FacelessModal>> = (props) => {\n  const {\n    id,\n    slug,\n    'aria-label': ariaLabel,\n    'aria-labelledby': ariaLabelledBy,\n    focusTrapOptions,\n    trapFocus = true,\n  } = props\n  const modalID = id || slug\n  const { modalState } = useModal()\n  const isOpen = Boolean(modalState[slug]?.isOpen)\n  const options = useMemo(\n    () => ({\n      escapeDeactivates: false,\n      initialFocus: () => {\n        const modal = document.getElementById(modalID)\n        const heading = modal?.querySelector<HTMLElement>('h1, h2, h3, h4, h5, h6')\n\n        if (heading) {\n          heading.tabIndex = -1\n        }\n        return heading ?? modal\n      },\n      ...focusTrapOptions,\n    }),\n    [modalID, focusTrapOptions],\n  )\n\n  useEffect(() => {\n    if (!isOpen || ariaLabel || ariaLabelledBy) {\n      return\n    }\n\n    let hasFocusedTitle = false\n\n    const updateTitle = () => {\n      const modal = document.getElementById(modalID)\n      const heading = modal?.querySelector<HTMLElement>('h1, h2, h3, h4, h5, h6')\n\n      if (modal && heading) {\n        if (!heading.id) {\n          heading.id = `modal-title-${slug}`\n        }\n        modal.setAttribute('aria-labelledby', heading.id)\n        modal.removeAttribute('aria-label')\n        if (\n          !hasFocusedTitle &&\n          trapFocus &&\n          focusTrapOptions?.initialFocus === undefined &&\n          !modal.closest('[inert]') &&\n          (document.activeElement === modal || document.activeElement === document.body)\n        ) {\n          heading.tabIndex = -1\n          heading.focus({ preventScroll: true })\n          hasFocusedTitle = document.activeElement === heading\n        }\n      }\n    }\n\n    updateTitle()\n    const observer = new MutationObserver(updateTitle)\n    observer.observe(document.body, { childList: true, subtree: true })\n    return () => observer.disconnect()\n  }, [isOpen, modalID, slug, ariaLabel, ariaLabelledBy, trapFocus, focusTrapOptions?.initialFocus])\n\n  return (\n    <FacelessModal\n      {...props}\n      data-payload-modal-slug={slug}\n      focusTrapOptions={options}\n      id={modalID}\n      tabIndex={-1}\n    />\n  )\n}\n"],"mappings":"AAAA;;;AAIA,SAASA,KAAA,IAASC,aAAa,EAAEC,QAAQ,QAAQ;AACjD,OAAOC,KAAA,IAASC,SAAS,EAAEC,OAAO,QAAQ;AAE1C,SAASH,QAAQ,QAAQ;AAEzB,OAAO,MAAMF,KAAA,GAAyDM,KAAA;EACpE,MAAM;IACJC,EAAE;IACFC,IAAI;IACJ,cAAcC,SAAS;IACvB,mBAAmBC,cAAc;IACjCC,gBAAgB;IAChBC,SAAA,GAAY;EAAI,CACjB,GAAGN,KAAA;EACJ,MAAMO,OAAA,GAAUN,EAAA,IAAMC,IAAA;EACtB,MAAM;IAAEM;EAAU,CAAE,GAAGZ,QAAA;EACvB,MAAMa,MAAA,GAASC,OAAA,CAAQF,UAAU,CAACN,IAAA,CAAK,EAAEO,MAAA;EACzC,MAAME,OAAA,GAAUZ,OAAA,CACd,OAAO;IACLa,iBAAA,EAAmB;IACnBC,YAAA,EAAcA,CAAA;MACZ,MAAMC,KAAA,GAAQC,QAAA,CAASC,cAAc,CAACT,OAAA;MACtC,MAAMU,OAAA,GAAUH,KAAA,EAAOI,aAAA,CAA2B;MAElD,IAAID,OAAA,EAAS;QACXA,OAAA,CAAQE,QAAQ,GAAG,CAAC;MACtB;MACA,OAAOF,OAAA,IAAWH,KAAA;IACpB;IACA,GAAGT;EACL,IACA,CAACE,OAAA,EAASF,gBAAA,CAAiB;EAG7BP,SAAA,CAAU;IACR,IAAI,CAACW,MAAA,IAAUN,SAAA,IAAaC,cAAA,EAAgB;MAC1C;IACF;IAEA,IAAIgB,eAAA,GAAkB;IAEtB,MAAMC,WAAA,GAAcA,CAAA;MAClB,MAAMP,OAAA,GAAQC,QAAA,CAASC,cAAc,CAACT,OAAA;MACtC,MAAMU,SAAA,GAAUH,OAAA,EAAOI,aAAA,CAA2B;MAElD,IAAIJ,OAAA,IAASG,SAAA,EAAS;QACpB,IAAI,CAACA,SAAA,CAAQhB,EAAE,EAAE;UACfgB,SAAA,CAAQhB,EAAE,GAAG,eAAeC,IAAA,EAAM;QACpC;QACAY,OAAA,CAAMQ,YAAY,CAAC,mBAAmBL,SAAA,CAAQhB,EAAE;QAChDa,OAAA,CAAMS,eAAe,CAAC;QACtB,IACE,CAACH,eAAA,IACDd,SAAA,IACAD,gBAAA,EAAkBQ,YAAA,KAAiBW,SAAA,IACnC,CAACV,OAAA,CAAMW,OAAO,CAAC,eACdV,QAAA,CAASW,aAAa,KAAKZ,OAAA,IAASC,QAAA,CAASW,aAAa,KAAKX,QAAA,CAASY,IAAI,CAAD,EAC5E;UACAV,SAAA,CAAQE,QAAQ,GAAG,CAAC;UACpBF,SAAA,CAAQW,KAAK,CAAC;YAAEC,aAAA,EAAe;UAAK;UACpCT,eAAA,GAAkBL,QAAA,CAASW,aAAa,KAAKT,SAAA;QAC/C;MACF;IACF;IAEAI,WAAA;IACA,MAAMS,QAAA,GAAW,IAAIC,gBAAA,CAAiBV,WAAA;IACtCS,QAAA,CAASE,OAAO,CAACjB,QAAA,CAASY,IAAI,EAAE;MAAEM,SAAA,EAAW;MAAMC,OAAA,EAAS;IAAK;IACjE,OAAO,MAAMJ,QAAA,CAASK,UAAU;EAClC,GAAG,CAAC1B,MAAA,EAAQF,OAAA,EAASL,IAAA,EAAMC,SAAA,EAAWC,cAAA,EAAgBE,SAAA,EAAWD,gBAAA,EAAkBQ,YAAA,CAAa;EAEhG,oBACEuB,IAAA,CAACzC,aAAA;IACE,GAAGK,KAAK;IACT,2BAAyBE,IAAA;IACzBG,gBAAA,EAAkBM,OAAA;IAClBV,EAAA,EAAIM,OAAA;IACJY,QAAA,EAAU,CAAC;;AAGjB","ignoreList":[]}
+{"version":3,"file":"index.js","names":["Modal","FacelessModal","useModal","React","useEffect","useLayoutEffect","useMemo","useRef","useModalFocus","props","id","slug","ariaLabel","ariaLabelledBy","focusTrapOptions","trapFocus","modalID","modalState","isOpen","Boolean","popupFocusTargetsRef","getReturnFocusTargets","current","options","escapeDeactivates","initialFocus","modal","document","getElementById","heading","querySelector","tabIndex","setReturnFocus","opener","length","find","element","isConnected","body","documentElement","closest","matches","getClientRects","getComputedStyle","visibility","hasFocusedTitle","updateTitle","setAttribute","removeAttribute","undefined","activeElement","focus","preventScroll","observer","MutationObserver","observe","childList","subtree","disconnect","_jsx"],"sources":["../../../src/elements/Modal/index.tsx"],"sourcesContent":["'use client'\n\nimport type { ComponentProps } from 'react'\n\nimport { Modal as FacelessModal, useModal } from '@faceless-ui/modal'\nimport React, { useEffect, useLayoutEffect, useMemo, useRef } from 'react'\n\nimport { useModalFocus } from '../../providers/ModalFocus/index.js'\n\nexport { useModal } from '@faceless-ui/modal'\n\nexport const Modal: React.FC<ComponentProps<typeof FacelessModal>> = (props) => {\n  const {\n    id,\n    slug,\n    'aria-label': ariaLabel,\n    'aria-labelledby': ariaLabelledBy,\n    focusTrapOptions,\n    trapFocus = true,\n  } = props\n  const modalID = id || slug\n  const { modalState } = useModal()\n  const isOpen = Boolean(modalState[slug]?.isOpen)\n  const popupFocusTargetsRef = useRef<readonly HTMLElement[]>([])\n  const { getReturnFocusTargets } = useModalFocus()\n\n  useLayoutEffect(() => {\n    if (isOpen) {\n      // Freeze each modal's targets before focus moves into it or a nested modal.\n      popupFocusTargetsRef.current = getReturnFocusTargets()\n    }\n  }, [getReturnFocusTargets, isOpen])\n  const options = useMemo(\n    () => ({\n      escapeDeactivates: false,\n      initialFocus: () => {\n        const modal = document.getElementById(modalID)\n        const heading = modal?.querySelector<HTMLElement>('h1, h2, h3, h4, h5, h6')\n\n        if (heading) {\n          heading.tabIndex = -1\n        }\n        return heading ?? modal\n      },\n      setReturnFocus: (opener: HTMLElement) =>\n        (popupFocusTargetsRef.current.length ? popupFocusTargetsRef.current : [opener]).find(\n          (element) =>\n            element?.isConnected &&\n            element !== document.body &&\n            element !== document.documentElement &&\n            !element.closest('[inert]') &&\n            !element.matches(':disabled') &&\n            element.getClientRects().length > 0 &&\n            getComputedStyle(element).visibility !== 'hidden',\n        ) ?? false,\n      ...focusTrapOptions,\n    }),\n    [modalID, focusTrapOptions],\n  )\n\n  useEffect(() => {\n    if (!isOpen || ariaLabel || ariaLabelledBy) {\n      return\n    }\n\n    let hasFocusedTitle = false\n\n    const updateTitle = () => {\n      const modal = document.getElementById(modalID)\n      const heading = modal?.querySelector<HTMLElement>('h1, h2, h3, h4, h5, h6')\n\n      if (modal && heading) {\n        if (!heading.id) {\n          heading.id = `modal-title-${slug}`\n        }\n        modal.setAttribute('aria-labelledby', heading.id)\n        modal.removeAttribute('aria-label')\n        if (\n          !hasFocusedTitle &&\n          trapFocus &&\n          focusTrapOptions?.initialFocus === undefined &&\n          !modal.closest('[inert]') &&\n          (document.activeElement === modal || document.activeElement === document.body)\n        ) {\n          heading.tabIndex = -1\n          heading.focus({ preventScroll: true })\n          hasFocusedTitle = document.activeElement === heading\n        }\n      }\n    }\n\n    updateTitle()\n    const observer = new MutationObserver(updateTitle)\n    observer.observe(document.body, { childList: true, subtree: true })\n    return () => observer.disconnect()\n  }, [isOpen, modalID, slug, ariaLabel, ariaLabelledBy, trapFocus, focusTrapOptions?.initialFocus])\n\n  return (\n    <FacelessModal\n      {...props}\n      data-payload-modal-slug={slug}\n      focusTrapOptions={options}\n      id={modalID}\n      tabIndex={-1}\n    />\n  )\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/elements/Nav/NavSidebarToggle/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["c","_c","React","useTranslation","SidebarToggle","useNav","NavSidebarToggle","t0","$","baseClass","navOpen","setNavOpen","t","t1","t2","_jsx","className","onClick","tabIndex","undefined","type","children","isActive"],"sources":["../../../../src/elements/Nav/NavSidebarToggle/index.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\n\nimport { useTranslation } from '../../../providers/Translation/index.js'\nimport { SidebarToggle } from '../../SidebarToggle/index.js'\nimport { useNav } from '../context.js'\n\n/**\n * @internal\n */\nexport const NavSidebarToggle: React.FC<{\n  baseClass?: string\n}> = ({ baseClass }) => {\n  const { navOpen, setNavOpen } = useNav()\n  const { t } = useTranslation()\n\n  return (\n    <button\n      aria-expanded={navOpen}\n      aria-label={t('general:hideSidebar')}\n      className={`${baseClass}__close`}\n      onClick={() => {\n        setNavOpen(false, true)\n      }}\n      tabIndex={!navOpen ? -1 : undefined}\n      type=\"button\"\n    >\n      <SidebarToggle isActive />\n    </button>\n  )\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AACA,OAAOC,KAAA,MAAW;AAElB,SAASC,cAAc,QAAQ;AAC/B,SAASC,aAAa,QAAQ;AAC9B,SAASC,MAAM,QAAQ;AAEvB;;;AAGA,OAAO,MAAMC,gBAAA,GAERC,EAAA;EAAA,MAAAC,CAAA,GAAAP,EAAA;EAAC;IAAAQ;EAAA,IAAAF,EAAa;EACjB;IAAAG,OAAA;IAAAC;EAAA,IAAgCN,MAAA;EAChC;IAAAO;EAAA,IAAcT,cAAA;EAAA,IAAAU,EAAA;EAAA,IAAAL,CAAA,QAAAC,SAAA,IAAAD,CAAA,QAAAE,OAAA,IAAAF,CAAA,QAAAG,UAAA,IAAAH,CAAA,QAAAI,CAAA;IAAA,IAAAE,EAAA;IAAA,IAAAN,CAAA,QAAAG,UAAA;MAODG,EAAA,GAAAA,CAAA;QACPH,UAAA,YAAkB;MAAA;MACpBH,CAAA,MAAAG,UAAA;MAAAH,CAAA,MAAAM,EAAA;IAAA;MAAAA,EAAA,GAAAN,CAAA;IAAA;IANFK,EAAA,GAAAE,IAAA,CAAC;MAAA,iBACgBL,OAAA;MAAA,cACHE,CAAA,CAAE;MAAAI,SAAA,EACH,GAAGP,SAAA,SAAkB;MAAAQ,OAAA,EACvBH,EAET;MAAAI,QAAA,EACU,CAACR,OAAA,QAAAS,SAAe;MAAAC,IAAA,EACrB;MAAAC,QAAA,EAELN,IAAA,CAAAX,aAAA;QAAAkB,QAAA;MAAA,C;;;;;;;;;;SAVFT,E;CAaJ","ignoreList":[]}
+{"version":3,"file":"index.js","names":["c","_c","React","useTranslation","SidebarToggle","useNav","NavSidebarToggle","t0","$","baseClass","navOpen","setNavOpen","t","t1","t2","_jsx","className","onClick","tabIndex","undefined","type","children","isActive"],"sources":["../../../../src/elements/Nav/NavSidebarToggle/index.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\n\nimport { useTranslation } from '../../../providers/Translation/index.js'\nimport { SidebarToggle } from '../../SidebarToggle/index.js'\nimport { useNav } from '../context.js'\n\n/**\n * @internal\n */\nexport const NavSidebarToggle: React.FC<{\n  baseClass?: string\n}> = ({ baseClass }) => {\n  const { navOpen, setNavOpen } = useNav()\n  const { t } = useTranslation()\n\n  return (\n    <button\n      aria-expanded={navOpen}\n      aria-label={t('general:hideSidebar')}\n      className={`${baseClass}__close`}\n      onClick={() => {\n        setNavOpen(false, true)\n      }}\n      tabIndex={!navOpen ? -1 : undefined}\n      type=\"button\"\n    >\n      <SidebarToggle isActive />\n    </button>\n  )\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AACA,OAAOC,KAAA,MAAW;AAElB,SAASC,cAAc,QAAQ;AAC/B,SAASC,aAAa,QAAQ;AAC9B,SAASC,MAAM,QAAQ;AAEvB;;;AAGA,OAAO,MAAMC,gBAAA,GAERC,EAAA;EAAA,MAAAC,CAAA,GAAAP,EAAA;EAAC;IAAAQ;EAAA,IAAAF,EAAa;EACjB;IAAAG,OAAA;IAAAC;EAAA,IAAgCN,MAAA;EAChC;IAAAO;EAAA,IAAcT,cAAA;EAAA,IAAAU,EAAA;EAAA,IAAAL,CAAA,QAAAC,SAAA,IAAAD,CAAA,QAAAE,OAAA,IAAAF,CAAA,QAAAG,UAAA,IAAAH,CAAA,QAAAI,CAAA;IAAA,IAAAE,EAAA;IAAA,IAAAN,CAAA,QAAAG,UAAA;MAODG,EAAA,GAAAA,CAAA;QACPH,UAAA,CAAW,OAAO;MAAA,CACpB;MAAAH,CAAA,MAAAG,UAAA;MAAAH,CAAA,MAAAM,EAAA;IAAA;MAAAA,EAAA,GAAAN,CAAA;IAAA;IANFK,EAAA,GAAAE,IAAA,CAAC;MAAA,iBACgBL,OAAA;MAAA,cACHE,CAAA,CAAE;MAAAI,SAAA,EACH,GAAGP,SAAA,SAAkB;MAAAQ,OAAA,EACvBH,EAET;MAAAI,QAAA,EACU,CAACR,OAAe,GAAhB,EAAgB,GAAhBS,SAAgB;MAAAC,IAAA,EACrB;MAAAC,QAAA,EAELN,IAAA,CAACX,aAAA;QAAAkB,QAAA,EAAsB;;;;;;;;;;;SAVzBT,E;CAaJ","ignoreList":[]}

package/dist/elements/Nav/NavWrapper/index.js

@@ -39,28 +39,27 @@ export const NavWrapper = props => {
   const t3 = t2.join(" ");
   const t4 = !navOpen ? true : undefined;
   const t5 = !isEmbedded && header;
-  const t6 = `${baseClass}__scroll`;
-  let t7;
-  if ($[4] !== children || $[5] !== navRef || $[6] !== t3 || $[7] !== t4 || $[8] !== t5 || $[9] !== t6) {
-    t7 = _jsxs("aside", {
+  let t6;
+  if ($[4] !== baseClass || $[5] !== children || $[6] !== navRef || $[7] !== t3 || $[8] !== t4 || $[9] !== t5) {
+    t6 = _jsxs("aside", {
       className: t3,
       inert: t4,
       children: [t5, _jsx("div", {
-        className: t6,
+        className: `${baseClass}__scroll`,
         ref: navRef,
         children
       })]
     });
-    $[4] = children;
-    $[5] = navRef;
-    $[6] = t3;
-    $[7] = t4;
-    $[8] = t5;
-    $[9] = t6;
-    $[10] = t7;
+    $[4] = baseClass;
+    $[5] = children;
+    $[6] = navRef;
+    $[7] = t3;
+    $[8] = t4;
+    $[9] = t5;
+    $[10] = t6;
   } else {
-    t7 = $[10];
+    t6 = $[10];
   }
-  return t7;
+  return t6;
 };
 //# sourceMappingURL=index.js.map

package/dist/elements/Nav/NavWrapper/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["c","_c","React","useEmbed","useNav","NavWrapper","props","$","baseClass","children","header","hydrated","navOpen","navRef","isEmbedded","t0","t1","t2","filter","Boolean","t3","join","t4","undefined","t5","t6","t7","_jsxs","className","inert","_jsx","ref"],"sources":["../../../../src/elements/Nav/NavWrapper/index.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\n\nimport { useEmbed } from '../../../providers/Embed/index.js'\nimport { useNav } from '../context.js'\nimport './index.css'\n\n/**\n * @internal\n */\nexport const NavWrapper: React.FC<{\n  baseClass?: string\n  children: React.ReactNode\n  header?: React.ReactNode\n}> = (props) => {\n  const { baseClass, children, header } = props\n\n  const { hydrated, navOpen, navRef } = useNav()\n  const { isEmbedded } = useEmbed()\n\n  return (\n    <aside\n      className={[\n        baseClass,\n        navOpen && `${baseClass}--nav-open`,\n        hydrated && `${baseClass}--nav-hydrated`,\n      ]\n        .filter(Boolean)\n        .join(' ')}\n      inert={!navOpen ? true : undefined}\n    >\n      {!isEmbedded && header}\n      <div className={`${baseClass}__scroll`} ref={navRef}>\n        {children}\n      </div>\n    </aside>\n  )\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AACA,OAAOC,KAAA,MAAW;AAElB,SAASC,QAAQ,QAAQ;AACzB,SAASC,MAAM,QAAQ;AACvB,OAAO;AAEP;;;AAGA,OAAO,MAAMC,UAAA,GAIRC,KAAA;EAAA,MAAAC,CAAA,GAAAN,EAAA;EACH;IAAAO,SAAA;IAAAC,QAAA;IAAAC;EAAA,IAAwCJ,KAAA;EAExC;IAAAK,QAAA;IAAAC,OAAA;IAAAC;EAAA,IAAsCT,MAAA;EACtC;IAAAU;EAAA,IAAuBX,QAAA;EAMjB,MAAAY,EAAA,GAAAH,OAAA,IAAW,GAAGJ,SAAA,YAAqB;EACnC,MAAAQ,EAAA,GAAAL,QAAA,IAAY,GAAGH,SAAA,gBAAyB;EAAA,IAAAS,EAAA;EAAA,IAAAV,CAAA,QAAAC,SAAA,IAAAD,CAAA,QAAAQ,EAAA,IAAAR,CAAA,QAAAS,EAAA;IAH/BC,EAAA,IACTT,SAAA,EACAO,EAAmC,EACnCC,EAAwC,EAAAE,MAAA,CAAAC,OAEhC;IAAAZ,CAAA,MAAAC,SAAA;IAAAD,CAAA,MAAAQ,EAAA;IAAAR,CAAA,MAAAS,EAAA;IAAAT,CAAA,MAAAU,EAAA;EAAA;IAAAA,EAAA,GAAAV,CAAA;EAAA;EALC,MAAAa,EAAA,GAAAH,EAKD,CAAAI,IAAA,CACF;EACD,MAAAC,EAAA,IAACV,OAAA,UAAAW,SAAiB;EAExB,MAAAC,EAAA,IAACV,UAAA,IAAcJ,MAAA;EACA,MAAAe,EAAA,MAAGjB,SAAA,UAAmB;EAAA,IAAAkB,EAAA;EAAA,IAAAnB,CAAA,QAAAE,QAAA,IAAAF,CAAA,QAAAM,MAAA,IAAAN,CAAA,QAAAa,EAAA,IAAAb,CAAA,QAAAe,EAAA,IAAAf,CAAA,QAAAiB,EAAA,IAAAjB,CAAA,QAAAkB,EAAA;IAXxCC,EAAA,GAAAC,KAAA,CAAC;MAAAC,SAAA,EACYR,EAMH;MAAAS,KAAA,EACDP,EAAkB;MAAAb,QAAA,GAExBe,EAAe,EAChBM,IAAA,CAAC;QAAAF,SAAA,EAAeH,EAAsB;QAAAM,GAAA,EAAOlB,MAAA;QAAAJ;MAAA,C;;;;;;;;;;;;SAX/CiB,E;CAgBJ","ignoreList":[]}
+{"version":3,"file":"index.js","names":["c","_c","React","useEmbed","useNav","NavWrapper","props","$","baseClass","children","header","hydrated","navOpen","navRef","isEmbedded","t0","t1","t2","filter","Boolean","t3","join","t4","undefined","t5","t6","_jsxs","className","inert","_jsx","ref"],"sources":["../../../../src/elements/Nav/NavWrapper/index.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\n\nimport { useEmbed } from '../../../providers/Embed/index.js'\nimport { useNav } from '../context.js'\nimport './index.css'\n\n/**\n * @internal\n */\nexport const NavWrapper: React.FC<{\n  baseClass?: string\n  children: React.ReactNode\n  header?: React.ReactNode\n}> = (props) => {\n  const { baseClass, children, header } = props\n\n  const { hydrated, navOpen, navRef } = useNav()\n  const { isEmbedded } = useEmbed()\n\n  return (\n    <aside\n      className={[\n        baseClass,\n        navOpen && `${baseClass}--nav-open`,\n        hydrated && `${baseClass}--nav-hydrated`,\n      ]\n        .filter(Boolean)\n        .join(' ')}\n      inert={!navOpen ? true : undefined}\n    >\n      {!isEmbedded && header}\n      <div className={`${baseClass}__scroll`} ref={navRef}>\n        {children}\n      </div>\n    </aside>\n  )\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AACA,OAAOC,KAAA,MAAW;AAElB,SAASC,QAAQ,QAAQ;AACzB,SAASC,MAAM,QAAQ;AACvB,OAAO;AAEP;;;AAGA,OAAO,MAAMC,UAAA,GAIRC,KAAA;EAAA,MAAAC,CAAA,GAAAN,EAAA;EACH;IAAAO,SAAA;IAAAC,QAAA;IAAAC;EAAA,IAAwCJ,KAAA;EAExC;IAAAK,QAAA;IAAAC,OAAA;IAAAC;EAAA,IAAsCT,MAAA;EACtC;IAAAU;EAAA,IAAuBX,QAAA;EAMjB,MAAAY,EAAA,GAAAH,OAAmC,IAAnC,GAAcJ,SAAA,YAAqB;EACnC,MAAAQ,EAAA,GAAAL,QAAwC,IAAxC,GAAeH,SAAA,gBAAyB;EAAA,IAAAS,EAAA;EAAA,IAAAV,CAAA,QAAAC,SAAA,IAAAD,CAAA,QAAAQ,EAAA,IAAAR,CAAA,QAAAS,EAAA;IAH/BC,EAAA,IACTT,SAAA,EACAO,EAAmC,EACnCC,EAAwC,CACzC,CAAAE,MACQ,CAACC,OAAA;IAAAZ,CAAA,MAAAC,SAAA;IAAAD,CAAA,MAAAQ,EAAA;IAAAR,CAAA,MAAAS,EAAA;IAAAT,CAAA,MAAAU,EAAA;EAAA;IAAAA,EAAA,GAAAV,CAAA;EAAA;EALC,MAAAa,EAAA,GAAAH,EAKD,CAAAI,IACH,CAAC;EACD,MAAAC,EAAA,IAACV,OAAiB,GAAlB,IAAkB,GAAlBW,SAAkB;EAExB,MAAAC,EAAA,IAACV,UAAc,IAAfJ,MAAe;EAAA,IAAAe,EAAA;EAAA,IAAAlB,CAAA,QAAAC,SAAA,IAAAD,CAAA,QAAAE,QAAA,IAAAF,CAAA,QAAAM,MAAA,IAAAN,CAAA,QAAAa,EAAA,IAAAb,CAAA,QAAAe,EAAA,IAAAf,CAAA,QAAAiB,EAAA;IAVlBC,EAAA,GAAAC,KAAA,CAAC;MAAAC,SAAA,EACYP,EAMH;MAAAQ,KAAA,EACDN,EAAkB;MAAAb,QAAA,E,CAExBe,EAAe,EAChBK,IAAA,CAAC;QAAAF,SAAA,EAAe,GAAGnB,SAAA,UAAmB;QAAAsB,GAAA,EAAOjB,MAAA;QAAAJ;;;;;;;;;;;;;SAX/CgB,E;CAgBJ","ignoreList":[]}

package/dist/elements/Nav/SettingsMenuButton/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["c","_c","React","Fragment","GearIcon","useTranslation","Popup","baseClass","SettingsMenuButton","t0","$","settingsMenu","t","length","t1","_jsx","button","ariaLabel","id","popupType","size","verticalAlign","children","map","_temp","item","i"],"sources":["../../../../src/elements/Nav/SettingsMenuButton/index.tsx"],"sourcesContent":["'use client'\nimport React, { Fragment } from 'react'\n\nimport { GearIcon } from '../../../icons/Gear/index.js'\nimport { useTranslation } from '../../../providers/Translation/index.js'\nimport { Popup } from '../../Popup/index.js'\nimport './index.css'\n\nconst baseClass = 'settings-menu-button'\n\nexport type SettingsMenuButtonProps = {\n  settingsMenu?: React.ReactNode[]\n}\n\nexport const SettingsMenuButton: React.FC<SettingsMenuButtonProps> = ({ settingsMenu }) => {\n  const { t } = useTranslation()\n\n  if (!settingsMenu || settingsMenu.length === 0) {\n    return null\n  }\n\n  return (\n    <Popup\n      button={<GearIcon ariaLabel={t('general:menu')} />}\n      className={baseClass}\n      horizontalAlign=\"left\"\n      id=\"settings-menu\"\n      popupType=\"menu\"\n      size=\"small\"\n      verticalAlign=\"bottom\"\n    >\n      {settingsMenu.map((item, i) => (\n        <Fragment key={`settings-menu-item-${i}`}>{item}</Fragment>\n      ))}\n    </Popup>\n  )\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AACA,OAAOC,KAAA,IAASC,QAAQ,QAAQ;AAEhC,SAASC,QAAQ,QAAQ;AACzB,SAASC,cAAc,QAAQ;AAC/B,SAASC,KAAK,QAAQ;AACtB,OAAO;AAEP,MAAMC,SAAA,GAAY;AAMlB,OAAO,MAAMC,kBAAA,GAAwDC,EAAA;EAAA,MAAAC,CAAA,GAAAT,EAAA;EAAC;IAAAU;EAAA,IAAAF,EAAgB;EACpF;IAAAG;EAAA,IAAcP,cAAA;EAAA,IAEV,CAACM,YAAA,IAAgBA,YAAA,CAAAE,MAAA,MAAwB;IAAA;EAAA;EAAA,IAAAC,EAAA;EAAA,IAAAJ,CAAA,QAAAC,YAAA,IAAAD,CAAA,QAAAE,CAAA;IAK3CE,EAAA,GAAAC,IAAA,CAAAT,KAAA;MAAAU,MAAA,EACUD,IAAA,CAAAX,QAAA;QAAAa,SAAA,EAAqBL,CAAA,CAAE;MAAA,C;;uBAEf;MAAAM,EAAA,EACb;MAAAC,SAAA,EACO;MAAAC,IAAA,EACL;MAAAC,aAAA,EACS;MAAAC,QAAA,EAEbX,YAAA,CAAAY,GAAA,CAAAC,KACyC;IAAA,C;;;;;;;SAV5CV,E;CAcJ;AAtBqE,SAAAU,MAAAC,IAAA,EAAAC,CAAA;EAAA,OAkB7DX,IAAA,CAAAZ,QAAA;IAAAmB,QAAA,EAA2CG;EAAA,GAA5B,sBAAsBC,CAAA,EAAG;AAAA","ignoreList":[]}
+{"version":3,"file":"index.js","names":["c","_c","React","Fragment","GearIcon","useTranslation","Popup","baseClass","SettingsMenuButton","t0","$","settingsMenu","t","length","t1","_jsx","button","ariaLabel","horizontalAlign","id","popupType","size","verticalAlign","children","map","_temp","item","i"],"sources":["../../../../src/elements/Nav/SettingsMenuButton/index.tsx"],"sourcesContent":["'use client'\nimport React, { Fragment } from 'react'\n\nimport { GearIcon } from '../../../icons/Gear/index.js'\nimport { useTranslation } from '../../../providers/Translation/index.js'\nimport { Popup } from '../../Popup/index.js'\nimport './index.css'\n\nconst baseClass = 'settings-menu-button'\n\nexport type SettingsMenuButtonProps = {\n  settingsMenu?: React.ReactNode[]\n}\n\nexport const SettingsMenuButton: React.FC<SettingsMenuButtonProps> = ({ settingsMenu }) => {\n  const { t } = useTranslation()\n\n  if (!settingsMenu || settingsMenu.length === 0) {\n    return null\n  }\n\n  return (\n    <Popup\n      button={<GearIcon ariaLabel={t('general:menu')} />}\n      className={baseClass}\n      horizontalAlign=\"left\"\n      id=\"settings-menu\"\n      popupType=\"menu\"\n      size=\"small\"\n      verticalAlign=\"bottom\"\n    >\n      {settingsMenu.map((item, i) => (\n        <Fragment key={`settings-menu-item-${i}`}>{item}</Fragment>\n      ))}\n    </Popup>\n  )\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AACA,OAAOC,KAAA,IAASC,QAAQ,QAAQ;AAEhC,SAASC,QAAQ,QAAQ;AACzB,SAASC,cAAc,QAAQ;AAC/B,SAASC,KAAK,QAAQ;AACtB,OAAO;AAEP,MAAMC,SAAA,GAAY;AAMlB,OAAO,MAAMC,kBAAA,GAAwDC,EAAA;EAAA,MAAAC,CAAA,GAAAT,EAAA;EAAC;IAAAU;EAAA,IAAAF,EAAgB;EACpF;IAAAG;EAAA,IAAcP,cAAA;EAEd,IAAI,CAACM,YAAwC,IAAxBA,YAAA,CAAAE,MAAmB,KAAK;IAAA,OACpC;EAAA;EACT,IAAAC,EAAA;EAAA,IAAAJ,CAAA,QAAAC,YAAA,IAAAD,CAAA,QAAAE,CAAA;IAGEE,EAAA,GAAAC,IAAA,CAACT,KAAA;MAAAU,MAAA,EACSD,IAAA,CAACX,QAAA;QAAAa,SAAA,EAAoBL,CAAA,CAAE;;iBACpBL,SAAA;MAAAW,eAAA,EACK;MAAAC,EAAA,EACb;MAAAC,SAAA,EACO;MAAAC,IAAA,EACL;MAAAC,aAAA,EACS;MAAAC,QAAA,EAEbZ,YAAA,CAAAa,GAAgB,CAACC,KACwB;;;;;;;;SAV5CX,E;CAcJ;AAtBqE,SAAAW,MAAAC,IAAA,EAAAC,CAAA;EAAA,OAkB7DZ,IAAA,CAACZ,QAAA;IAAAoB,QAAA,EAA0CG;KAA5B,sBAAsBC,CAAA,EAAG;AAAA","ignoreList":[]}

package/dist/elements/Nav/SidebarTabs/TabError/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["c","_c","React","useTranslation","baseClass","TabError","t0","$","message","onRetry","t","t1","_jsx","className","children","_jsxs","onClick","type"],"sources":["../../../../../src/elements/Nav/SidebarTabs/TabError/index.tsx"],"sourcesContent":["'use client'\n\nimport React from 'react'\n\nimport { useTranslation } from '../../../../providers/Translation/index.js'\nimport './index.css'\n\nconst baseClass = 'sidebar-tab-error'\n\nexport type TabErrorProps = {\n  message: string\n  onRetry: () => void\n}\n\nexport const TabError: React.FC<TabErrorProps> = ({ message, onRetry }) => {\n  const { t } = useTranslation()\n  return (\n    <div className={baseClass}>\n      <div className={`${baseClass}__content`}>\n        <span>{message}</span>\n        <button className={`${baseClass}__retry`} onClick={onRetry} type=\"button\">\n          {t('general:retry')}\n        </button>\n      </div>\n    </div>\n  )\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AAEA,OAAOC,KAAA,MAAW;AAElB,SAASC,cAAc,QAAQ;AAC/B,OAAO;AAEP,MAAMC,SAAA,GAAY;AAOlB,OAAO,MAAMC,QAAA,GAAoCC,EAAA;EAAA,MAAAC,CAAA,GAAAN,EAAA;EAAC;IAAAO,OAAA;IAAAC;EAAA,IAAAH,EAAoB;EACpE;IAAAI;EAAA,IAAcP,cAAA;EAAA,IAAAQ,EAAA;EAAA,IAAAJ,CAAA,QAAAC,OAAA,IAAAD,CAAA,QAAAE,OAAA,IAAAF,CAAA,QAAAG,CAAA;IAEZC,EAAA,GAAAC,IAAA,CAAC;MAAAC,SAAA,EAAAT,SAAA;MAAAU,QAAA,EACCC,KAAA,CAAC;QAAAF,SAAA,EAAe,GAAAT,SAAA,WAAuB;QAAAU,QAAA,GACrCF,IAAA,CAAC;UAAAE,QAAA,EAAMN;QAAA,C,GACPI,IAAA,CAAC;UAAAC,SAAA,EAAkB,GAAAT,SAAA,SAAqB;UAAAY,OAAA,EAAWP,OAAA;UAAAQ,IAAA,EAAc;UAAAH,QAAA,EAC9DJ,CAAA,CAAE;QAAA,C;;;;;;;;;;SAJTC,E;CASJ","ignoreList":[]}
+{"version":3,"file":"index.js","names":["c","_c","React","useTranslation","baseClass","TabError","t0","$","message","onRetry","t","t1","_jsx","className","children","_jsxs","onClick","type"],"sources":["../../../../../src/elements/Nav/SidebarTabs/TabError/index.tsx"],"sourcesContent":["'use client'\n\nimport React from 'react'\n\nimport { useTranslation } from '../../../../providers/Translation/index.js'\nimport './index.css'\n\nconst baseClass = 'sidebar-tab-error'\n\nexport type TabErrorProps = {\n  message: string\n  onRetry: () => void\n}\n\nexport const TabError: React.FC<TabErrorProps> = ({ message, onRetry }) => {\n  const { t } = useTranslation()\n  return (\n    <div className={baseClass}>\n      <div className={`${baseClass}__content`}>\n        <span>{message}</span>\n        <button className={`${baseClass}__retry`} onClick={onRetry} type=\"button\">\n          {t('general:retry')}\n        </button>\n      </div>\n    </div>\n  )\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AAEA,OAAOC,KAAA,MAAW;AAElB,SAASC,cAAc,QAAQ;AAC/B,OAAO;AAEP,MAAMC,SAAA,GAAY;AAOlB,OAAO,MAAMC,QAAA,GAAoCC,EAAA;EAAA,MAAAC,CAAA,GAAAN,EAAA;EAAC;IAAAO,OAAA;IAAAC;EAAA,IAAAH,EAAoB;EACpE;IAAAI;EAAA,IAAcP,cAAA;EAAA,IAAAQ,EAAA;EAAA,IAAAJ,CAAA,QAAAC,OAAA,IAAAD,CAAA,QAAAE,OAAA,IAAAF,CAAA,QAAAG,CAAA;IAEZC,EAAA,GAAAC,IAAA,CAAC;MAAAC,SAAA,EAAeT,SAAA;MAAAU,QAAA,EACdC,KAAA,CAAC;QAAAF,SAAA,EAAe,GAAGT,SAAA,WAAoB;QAAAU,QAAA,E,CACrCF,IAAA,CAAC;UAAAE,QAAA,EAAMN;YACPI,IAAA,CAAC;UAAAC,SAAA,EAAkB,GAAGT,SAAA,SAAkB;UAAAY,OAAA,EAAWP,OAAA;UAAAQ,IAAA,EAAc;UAAAH,QAAA,EAC9DJ,CAAA,CAAE;;;;;;;;;;;SAJTC,E;CASJ","ignoreList":[]}

package/dist/elements/Nav/SidebarTabs/index.client.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.client.d.ts","sourceRoot":"","sources":["../../../../src/elements/Nav/SidebarTabs/index.client.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAwC,MAAM,OAAO,CAAA;AAW5D,MAAM,MAAM,WAAW,GAAG;IACxB,IAAI,EAAE,KAAK,CAAC,SAAS,CAAA;IACrB,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB,KAAK,EAAE,MAAM,CAAA;IACb,oEAAoE;IACpE,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,IAAI,EAAE,MAAM,CAAA;CACb,CAAA;AAED,MAAM,MAAM,sBAAsB,GAAG;IACnC,SAAS,EAAE,MAAM,CAAA;IACjB,kBAAkB,EAAE,MAAM,CAAA;IAC1B,kBAAkB,EAAE,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC,SAAS,CAAC,CAAA;IACnD;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,IAAI,EAAE,WAAW,EAAE,CAAA;CACpB,CAAA;AAED,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,sBAAsB,CAmM9D,CAAA"}
+{"version":3,"file":"index.client.d.ts","sourceRoot":"","sources":["../../../../src/elements/Nav/SidebarTabs/index.client.tsx"],"names":[],"mappings":"AAGA,OAAO,KAA+C,MAAM,OAAO,CAAA;AAWnE,MAAM,MAAM,WAAW,GAAG;IACxB,IAAI,EAAE,KAAK,CAAC,SAAS,CAAA;IACrB,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB,KAAK,EAAE,MAAM,CAAA;IACb,oEAAoE;IACpE,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,IAAI,EAAE,MAAM,CAAA;CACb,CAAA;AAED,MAAM,MAAM,sBAAsB,GAAG;IACnC,SAAS,EAAE,MAAM,CAAA;IACjB,kBAAkB,EAAE,MAAM,CAAA;IAC1B,kBAAkB,EAAE,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC,SAAS,CAAC,CAAA;IACnD;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,IAAI,EAAE,WAAW,EAAE,CAAA;CACpB,CAAA;AAED,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,sBAAsB,CAkN9D,CAAA"}

package/dist/elements/Nav/SidebarTabs/index.client.js

@@ -2,7 +2,7 @@
 
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { PREFERENCE_KEYS } from 'payload/shared';
-import React, { useCallback, useRef, useState } from 'react';
+import React, { useCallback, useId, useRef, useState } from 'react';
 import { usePreferences } from '../../../providers/Preferences/index.js';
 import { useServerFunctions } from '../../../providers/ServerFunctions/index.js';
 import { SidebarTabsProvider } from '../../../providers/SidebarTabs/index.js';
@@ -22,12 +22,15 @@ export const SidebarTabsClient = ({
   const {
     serverFunction
   } = useServerFunctions();
+  const tabsID = useId();
   const [activeTabID, setActiveTabID] = useState(initialActiveTabID);
   const [tabContent, setTabContent] = useState(initialTabContents);
   const [loadingTab, setLoadingTab] = useState(null);
   const [hoveredTab, setHoveredTab] = useState(null);
   const loadingTabsRef = useRef(new Set());
   const tabContentRef = useRef(initialTabContents);
+  // The retry button calls loadTabContent through this, since loadTabContent can't call itself
+  const loadTabContentRef = useRef(null);
   // Update cached content when server provides new initialTabContents
   // This is needed because useState only uses initialValue on first mount
   React.useEffect(() => {
@@ -83,7 +86,7 @@ export const SidebarTabsClient = ({
         delete clearedContent[tabSlug];
         tabContentRef.current = clearedContent;
         setTabContent(clearedContent);
-        void loadTabContent(tabSlug, {
+        void loadTabContentRef.current?.(tabSlug, {
           serverArgs
         });
       };
@@ -98,9 +101,12 @@ export const SidebarTabsClient = ({
       setTabContent(newContent);
     } finally {
       loadingTabsRef.current.delete(tabSlug);
-      setLoadingTab(null);
+      setLoadingTab(currentTab => currentTab === tabSlug ? null : currentTab);
     }
   }, [serverFunction]);
+  React.useEffect(() => {
+    loadTabContentRef.current = loadTabContent;
+  }, [loadTabContent]);
   const reloadTabContent = useCallback((tabSlug_0, serverArgs_0) => {
     // Clear cached content to force reload
     const clearedContent_0 = {
@@ -156,8 +162,10 @@ export const SidebarTabsClient = ({
         children: tabs.map((tab_0, index) => {
           const isActive = tab_0.slug === activeTabID;
           return /*#__PURE__*/_jsxs("button", {
+            "aria-controls": `${tabsID}-panel-${tab_0.slug}`,
             "aria-selected": isActive,
             className: `${baseClass}__tab ${isActive ? `${baseClass}__tab--active` : ''}`,
+            id: `${tabsID}-tab-${tab_0.slug}`,
             onClick: () => handleTabChange(tab_0.slug),
             onKeyDown: e_0 => handleTabKeyDown(e_0, index),
             onMouseEnter: () => setHoveredTab(tab_0.slug),
@@ -179,26 +187,29 @@ export const SidebarTabsClient = ({
             })]
           }, tab_0.slug);
         })
-      }), /*#__PURE__*/_jsxs("div", {
+      }), /*#__PURE__*/_jsx("div", {
         className: `${baseClass}__content`,
-        role: "tabpanel",
-        children: [/*#__PURE__*/_jsx(DelayedSpinner, {
-          baseClass: baseClass,
-          delay: loadingDelay,
-          isLoading: loadingTab === activeTabID
-        }), tabs.map(tab_1 => {
+        children: tabs.map(tab_1 => {
           const content = tabContent[tab_1.slug];
-          if (!content) {
-            return null;
-          }
-          const isActive_0 = tab_1.slug === activeTabID && loadingTab !== activeTabID;
-          return /*#__PURE__*/_jsx("div", {
-            style: isActive_0 ? undefined : {
-              display: 'none'
-            },
-            children: content
+          const isActive_0 = tab_1.slug === activeTabID;
+          return /*#__PURE__*/_jsxs("div", {
+            "aria-labelledby": `${tabsID}-tab-${tab_1.slug}`,
+            hidden: !isActive_0,
+            id: `${tabsID}-panel-${tab_1.slug}`,
+            role: "tabpanel",
+            tabIndex: 0,
+            children: [/*#__PURE__*/_jsx(DelayedSpinner, {
+              baseClass: baseClass,
+              delay: loadingDelay,
+              isLoading: isActive_0 && loadingTab === tab_1.slug
+            }), /*#__PURE__*/_jsx("div", {
+              style: loadingTab === tab_1.slug ? {
+                display: 'none'
+              } : undefined,
+              children: content
+            })]
           }, tab_1.slug);
-        })]
+        })
       })]
     })
   });