@payloadcms/ui 4.0.0-internal.5f0cd13 → 4.0.0-internal.656159a

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","t1","filter","Boolean","t2","join","t3","t4","Symbol","for","t5","t6","_jsxs","onMouseEnter","onMouseLeave","role","tabIndex","children","_jsx","alignCaret","position","show","staticPositioning"],"sources":["../../../src/elements/Locked/index.tsx"],"sourcesContent":["'use client'\nimport type { ClientUser } from 'payload'\n\nimport React, { useState } from 'react'\n\nimport { LockIcon } from '../../icons/Lock/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { isClientUserObject } from '../../utilities/isClientUserObject.js'\nimport { Tooltip } from '../Tooltip/index.js'\nimport './index.css'\n\nconst baseClass = 'locked'\n\nexport const Locked: React.FC<{\n  className?: string\n  user: ClientUser\n}> = ({ className, user }) => {\n  const [hovered, setHovered] = useState(false)\n  const { t } = useTranslation()\n\n  const userToUse = isClientUserObject(user) ? (user.email ?? user.id) : t('general:anotherUser')\n\n  return (\n    <div\n      className={[baseClass, className].filter(Boolean).join(' ')}\n      onMouseEnter={() => setHovered(true)}\n      onMouseLeave={() => setHovered(false)}\n      role=\"button\"\n      tabIndex={0}\n    >\n      <Tooltip\n        alignCaret=\"left\"\n        className={`${baseClass}__tooltip`}\n        position=\"bottom\"\n        show={hovered}\n        staticPositioning\n      >{`${userToUse} ${t('general:isEditing')}`}</Tooltip>\n      <LockIcon />\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;EAAA,IAAAI,EAAA;EAAA,IAAAT,CAAA,QAAAC,SAAA;IAI1DQ,EAAA,IAAAZ,SAAA,EAAYI,SAAA,EAAAS,MAAA,CAAAC,OAAkB;IAAAX,CAAA,MAAAC,SAAA;IAAAD,CAAA,MAAAS,EAAA;EAAA;IAAAA,EAAA,GAAAT,CAAA;EAAA;EAA9B,MAAAY,EAAA,GAAAH,EAA8B,CAAAI,IAAA,CAAc;EAAA,IAAAC,EAAA;EAAA,IAAAC,EAAA;EAAA,IAAAf,CAAA,QAAAgB,MAAA,CAAAC,GAAA;IACzCH,EAAA,GAAAA,CAAA,KAAMV,UAAA,KAAW;IACjBW,EAAA,GAAAA,CAAA,KAAMX,UAAA,MAAW;IAAAJ,CAAA,MAAAc,EAAA;IAAAd,CAAA,MAAAe,EAAA;EAAA;IAAAD,EAAA,GAAAd,CAAA;IAAAe,EAAA,GAAAf,CAAA;EAAA;EAU7B,MAAAkB,EAAA,MAAGZ,SAAA,IAAaD,CAAA,CAAE,sBAAsB;EAAA,IAAAc,EAAA;EAAA,IAAAnB,CAAA,QAAAG,OAAA,IAAAH,CAAA,QAAAY,EAAA,IAAAZ,CAAA,QAAAkB,EAAA;IAb5CC,EAAA,GAAAC,KAAA,CAAC;MAAAnB,SAAA,EACYW,EAA4C;MAAAS,YAAA,EACzCP,EAAiB;MAAAQ,YAAA,EACjBP,EAAiB;MAAAQ,IAAA,EAC1B;MAAAC,QAAA;MAAAC,QAAA,GAGLC,IAAA,CAAA9B,OAAA;QAAA+B,UAAA,EACa;QAAA1B,SAAA,EACA,GAAAJ,SAAA,WAAuB;QAAA+B,QAAA,EACzB;QAAAC,IAAA,EACH1B,OAAA;QAAA2B,iBAAA;QAAAL,QAAA,EAENP;MAAwC,C,GAC1CQ,IAAA,CAAAjC,QAAA,IAAC;IAAA,C;;;;;;;;SAdH0B,E;CAiBJ","ignoreList":[]}
+{"version":3,"file":"index.js","names":["React","useCallback","useEffect","useRef","useState","createPortal","LockIcon","useTranslation","isClientUserObject","Tooltip","baseClass","Locked","className","user","anchorRef","hovered","setHovered","anchorRect","setAnchorRect","t","userToUse","email","id","tooltipLabel","updateAnchorRect","node","current","getBoundingClientRect","window","addEventListener","removeEventListener","_jsxs","filter","Boolean","join","onBlur","onFocus","onKeyDown","e","key","preventDefault","onMouseEnter","onMouseLeave","ref","role","tabIndex","_jsx","style","height","left","top","width","alignCaret","position","show","document","body"],"sources":["../../../src/elements/Locked/index.tsx"],"sourcesContent":["'use client'\nimport type { User } from 'payload'\n\nimport React, { useCallback, useEffect, useRef, useState } from 'react'\nimport { createPortal } from 'react-dom'\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 anchorRef = useRef<HTMLDivElement>(null)\n  const [hovered, setHovered] = useState(false)\n  const [anchorRect, setAnchorRect] = useState<DOMRect | null>(null)\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  const updateAnchorRect = useCallback(() => {\n    const node = anchorRef.current\n\n    if (!node) {\n      return\n    }\n\n    setAnchorRect(node.getBoundingClientRect())\n  }, [])\n\n  useEffect(() => {\n    if (!hovered) {\n      return\n    }\n\n    // Keep the portaled tooltip aligned to the icon as the page or an overflow\n    // container scrolls.\n    window.addEventListener('scroll', updateAnchorRect, true)\n    window.addEventListener('resize', updateAnchorRect)\n\n    return () => {\n      window.removeEventListener('scroll', updateAnchorRect, true)\n      window.removeEventListener('resize', updateAnchorRect)\n    }\n  }, [hovered, updateAnchorRect])\n\n  return (\n    <div\n      aria-label={tooltipLabel}\n      className={[baseClass, className].filter(Boolean).join(' ')}\n      onBlur={() => setHovered(false)}\n      onFocus={() => {\n        updateAnchorRect()\n        setHovered(true)\n      }}\n      onKeyDown={(e) => {\n        if (e.key === ' ') {\n          e.preventDefault() // prevent page scroll when focused\n        }\n      }}\n      onMouseEnter={() => {\n        updateAnchorRect()\n        setHovered(true)\n      }}\n      onMouseLeave={() => setHovered(false)}\n      ref={anchorRef}\n      role=\"button\"\n      tabIndex={0}\n    >\n      <LockIcon />\n      {hovered &&\n        anchorRect &&\n        createPortal(\n          <div\n            className={`${baseClass}__tooltip-anchor`}\n            style={{\n              height: anchorRect.height,\n              left: anchorRect.left,\n              top: anchorRect.top,\n              width: anchorRect.width,\n            }}\n          >\n            <Tooltip alignCaret=\"center\" className={`${baseClass}__tooltip`} position=\"bottom\" show>\n              {tooltipLabel}\n            </Tooltip>\n          </div>,\n          document.body,\n        )}\n    </div>\n  )\n}\n"],"mappings":"AAAA;;;AAGA,OAAOA,KAAA,IAASC,WAAW,EAAEC,SAAS,EAAEC,MAAM,EAAEC,QAAQ,QAAQ;AAChE,SAASC,YAAY,QAAQ;AAE7B,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,GAGRA,CAAC;EAAEC,SAAS;EAAEC;AAAI,CAAE;EACvB,MAAMC,SAAA,GAAYX,MAAA,CAAuB;EACzC,MAAM,CAACY,OAAA,EAASC,UAAA,CAAW,GAAGZ,QAAA,CAAS;EACvC,MAAM,CAACa,UAAA,EAAYC,aAAA,CAAc,GAAGd,QAAA,CAAyB;EAC7D,MAAM;IAAEe;EAAC,CAAE,GAAGZ,cAAA;EAEd,MAAMa,SAAA,GAAYZ,kBAAA,CAAmBK,IAAA,IAASA,IAAA,CAAKQ,KAAK,IAAIR,IAAA,CAAKS,EAAE,GAAIH,CAAA,CAAE;EACzE,MAAMI,YAAA,GAAe,GAAGH,SAAA,IAAaD,CAAA,CAAE,sBAAsB;EAE7D,MAAMK,gBAAA,GAAmBvB,WAAA,CAAY;IACnC,MAAMwB,IAAA,GAAOX,SAAA,CAAUY,OAAO;IAE9B,IAAI,CAACD,IAAA,EAAM;MACT;IACF;IAEAP,aAAA,CAAcO,IAAA,CAAKE,qBAAqB;EAC1C,GAAG,EAAE;EAELzB,SAAA,CAAU;IACR,IAAI,CAACa,OAAA,EAAS;MACZ;IACF;IAEA;IACA;IACAa,MAAA,CAAOC,gBAAgB,CAAC,UAAUL,gBAAA,EAAkB;IACpDI,MAAA,CAAOC,gBAAgB,CAAC,UAAUL,gBAAA;IAElC,OAAO;MACLI,MAAA,CAAOE,mBAAmB,CAAC,UAAUN,gBAAA,EAAkB;MACvDI,MAAA,CAAOE,mBAAmB,CAAC,UAAUN,gBAAA;IACvC;EACF,GAAG,CAACT,OAAA,EAASS,gBAAA,CAAiB;EAE9B,oBACEO,KAAA,CAAC;IACC,cAAYR,YAAA;IACZX,SAAA,EAAW,CAACF,SAAA,EAAWE,SAAA,CAAU,CAACoB,MAAM,CAACC,OAAA,EAASC,IAAI,CAAC;IACvDC,MAAA,EAAQA,CAAA,KAAMnB,UAAA,CAAW;IACzBoB,OAAA,EAASA,CAAA;MACPZ,gBAAA;MACAR,UAAA,CAAW;IACb;IACAqB,SAAA,EAAYC,CAAA;MACV,IAAIA,CAAA,CAAEC,GAAG,KAAK,KAAK;QACjBD,CAAA,CAAEE,cAAc,IAAG;MACrB;IACF;IACAC,YAAA,EAAcA,CAAA;MACZjB,gBAAA;MACAR,UAAA,CAAW;IACb;IACA0B,YAAA,EAAcA,CAAA,KAAM1B,UAAA,CAAW;IAC/B2B,GAAA,EAAK7B,SAAA;IACL8B,IAAA,EAAK;IACLC,QAAA,EAAU;4BAEVC,IAAA,CAACxC,QAAA,OACAS,OAAA,IACCE,UAAA,iBACAZ,YAAA,cACEyC,IAAA,CAAC;MACClC,SAAA,EAAW,GAAGF,SAAA,kBAA2B;MACzCqC,KAAA,EAAO;QACLC,MAAA,EAAQ/B,UAAA,CAAW+B,MAAM;QACzBC,IAAA,EAAMhC,UAAA,CAAWgC,IAAI;QACrBC,GAAA,EAAKjC,UAAA,CAAWiC,GAAG;QACnBC,KAAA,EAAOlC,UAAA,CAAWkC;MACpB;gBAEA,aAAAL,IAAA,CAACrC,OAAA;QAAQ2C,UAAA,EAAW;QAASxC,SAAA,EAAW,GAAGF,SAAA,WAAoB;QAAE2C,QAAA,EAAS;QAASC,IAAI;kBACpF/B;;QAGLgC,QAAA,CAASC,IAAI;;AAIvB","ignoreList":[]}

package/dist/elements/MenuSeparator/index.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import '../Popup/PopupDivider/index.css';
+export declare const MenuSeparator: React.FC;
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/MenuSeparator/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,iCAAiC,CAAA;AAIxC,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAEjC,CAAA"}

package/dist/elements/MenuSeparator/index.js

@@ -0,0 +1,10 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import React from 'react';
+import '../Popup/PopupDivider/index.css';
+const baseClass = 'popup-divider';
+export const MenuSeparator = () => {
+  return /*#__PURE__*/_jsx("hr", {
+    className: baseClass
+  });
+};
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["React","baseClass","MenuSeparator","_jsx","className"],"sources":["../../../src/elements/MenuSeparator/index.tsx"],"sourcesContent":["import React from 'react'\n\nimport '../Popup/PopupDivider/index.css'\n\nconst baseClass = 'popup-divider'\n\nexport const MenuSeparator: React.FC = () => {\n  return <hr className={baseClass} />\n}\n"],"mappings":";AAAA,OAAOA,KAAA,MAAW;AAElB,OAAO;AAEP,MAAMC,SAAA,GAAY;AAElB,OAAO,MAAMC,aAAA,GAA0BA,CAAA;EACrC,oBAAOC,IAAA,CAAC;IAAGC,SAAA,EAAWH;;AACxB","ignoreList":[]}

package/dist/elements/MiniCarousel/index.css

@@ -0,0 +1,94 @@
+@layer payload-default {
+  .mini-carousel {
+    display: flex;
+    flex-direction: column;
+    align-items: stretch;
+    gap: var(--spacer-3);
+    padding: var(--spacer-2-5);
+    height: 100%;
+    flex-shrink: 0;
+    overflow-y: auto;
+    background: var(--color-bg-secondary);
+    border-right: var(--stroke-width-small) solid var(--color-border);
+    /* Honor the scroll-driven height below instead of stretching to the flex line. */
+    align-self: flex-start;
+    /* Scroll-driven: grow to fill the gap as the header scrolls away. Falls back to static height. */
+    animation: mini-carousel-fill-scrolled-chrome linear both;
+    animation-timeline: scroll(root block);
+    animation-range: 0 calc(var(--app-header-height) + var(--doc-header-height));
+  }
+
+  @keyframes mini-carousel-fill-scrolled-chrome {
+    to {
+      height: calc(100% + var(--app-header-height) + var(--doc-header-height));
+    }
+  }
+
+  .mini-carousel__item {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    aspect-ratio: 1/1;
+    flex-shrink: 0;
+    padding: var(--spacer-1);
+    border-radius: var(--radius-medium);
+    border: var(--stroke-width-small) solid var(--color-border);
+    background: var(--color-bg-secondary);
+    cursor: pointer;
+    overflow: hidden;
+    width: 48px;
+    height: 48px;
+  }
+
+  .mini-carousel__item img {
+    width: 100%;
+    height: 100%;
+    object-fit: contain;
+  }
+
+  .mini-carousel__item--active {
+    border-color: var(--color-border-selected);
+  }
+
+  .mini-carousel__item:hover:not(.mini-carousel__item--active) {
+    border-color: var(--color-border-hover);
+  }
+
+  .mini-carousel__divider {
+    width: 100%;
+    height: var(--stroke-width-small);
+    background: var(--color-border);
+    flex-shrink: 0;
+  }
+
+  /* Stacked layout: disable scroll-driven growth and fill via stretch. */
+  @container edit-main (max-width: 1024px) {
+    .mini-carousel {
+      align-self: stretch;
+      height: auto;
+      animation: none;
+    }
+  }
+
+  @container edit-main (max-width: 768px) {
+    .mini-carousel {
+      flex-direction: row;
+      align-items: center;
+      width: 100%;
+      overflow-x: auto;
+      overflow-y: hidden;
+      border-right: 0;
+      border-top: var(--stroke-width-small) solid var(--color-border);
+    }
+
+    .mini-carousel__item {
+      width: 48px;
+    }
+
+    .mini-carousel__divider {
+      width: var(--stroke-width-small);
+      height: 48px;
+      margin: 0 var(--spacer-2);
+    }
+  }
+}

package/dist/elements/MiniCarousel/index.d.ts

@@ -0,0 +1,15 @@
+import type { Data, FileSizes, SanitizedCollectionConfig } from 'payload';
+import React from 'react';
+import './index.css';
+export type MiniCarouselProps = {
+    doc: {
+        sizes?: FileSizes;
+        url?: string;
+    } & Data;
+    imageCacheTag?: false | string;
+    onSelect: (sizeKey: null | string) => void;
+    selectedSize: null | string;
+    uploadConfig: SanitizedCollectionConfig['upload'];
+};
+export declare const MiniCarousel: React.FC<MiniCarouselProps>;
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/MiniCarousel/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,SAAS,EAAE,yBAAyB,EAAE,MAAM,SAAS,CAAA;AAEzE,OAAO,KAAK,MAAM,OAAO,CAAA;AAIzB,OAAO,aAAa,CAAA;AAoCpB,MAAM,MAAM,iBAAiB,GAAG;IAC9B,GAAG,EAAE;QACH,KAAK,CAAC,EAAE,SAAS,CAAA;QACjB,GAAG,CAAC,EAAE,MAAM,CAAA;KACb,GAAG,IAAI,CAAA;IACR,aAAa,CAAC,EAAE,KAAK,GAAG,MAAM,CAAA;IAC9B,QAAQ,EAAE,CAAC,OAAO,EAAE,IAAI,GAAG,MAAM,KAAK,IAAI,CAAA;IAC1C,YAAY,EAAE,IAAI,GAAG,MAAM,CAAA;IAC3B,YAAY,EAAE,yBAAyB,CAAC,QAAQ,CAAC,CAAA;CAClD,CAAA;AAED,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAuDpD,CAAA"}

package/dist/elements/MiniCarousel/index.js

@@ -0,0 +1,84 @@
+'use client';
+
+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';
+import { appendCacheTag } from '../../utilities/appendCacheTag.js';
+import './index.css';
+const baseClass = 'mini-carousel';
+const MiniCarouselItem = ({
+  active,
+  imageCacheTag,
+  label,
+  onClick,
+  url
+}) => {
+  const src = appendCacheTag(url, imageCacheTag);
+  return /*#__PURE__*/_jsx("button", {
+    "aria-label": label,
+    "aria-pressed": active ? 'true' : 'false',
+    className: [`${baseClass}__item`, active && `${baseClass}__item--active`].filter(Boolean).join(' '),
+    onClick: onClick,
+    type: "button",
+    children: /*#__PURE__*/_jsx("img", {
+      alt: label,
+      src: src
+    })
+  });
+};
+export const MiniCarousel = ({
+  doc,
+  imageCacheTag,
+  onSelect,
+  selectedSize,
+  uploadConfig
+}) => {
+  const {
+    t
+  } = useTranslation();
+  const {
+    imageSizes
+  } = uploadConfig;
+  const {
+    sizes,
+    url: originalUrl
+  } = doc;
+  const orderedSizeKeys = React.useMemo(() => {
+    if (!imageSizes || imageSizes.length === 0) {
+      return Object.keys(sizes || {});
+    }
+    return imageSizes.map(({
+      name
+    }) => name).filter(name_0 => sizes?.[name_0]?.url);
+  }, [imageSizes, sizes]);
+  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);
+      })]
+    })]
+  });
+};
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +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","imageSizes","sizes","originalUrl","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    sizes?: FileSizes\n    url?: string\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 { imageSizes } = uploadConfig\n  const { sizes, url: originalUrl } = doc\n\n  const orderedSizeKeys = React.useMemo(() => {\n    if (!imageSizes || imageSizes.length === 0) {\n      return Object.keys(sizes || {})\n    }\n    return imageSizes.map(({ name }) => name).filter((name) => sizes?.[name]?.url)\n  }, [imageSizes, 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;EAAU,CAAE,GAAGF,YAAA;EACvB,MAAM;IAAEG,KAAK;IAAEhB,GAAA,EAAKiB;EAAW,CAAE,GAAGP,GAAA;EAEpC,MAAMQ,eAAA,GAAkB3B,KAAA,CAAM4B,OAAO,CAAC;IACpC,IAAI,CAACJ,UAAA,IAAcA,UAAA,CAAWK,MAAM,KAAK,GAAG;MAC1C,OAAOC,MAAA,CAAOC,IAAI,CAACN,KAAA,IAAS,CAAC;IAC/B;IACA,OAAOD,UAAA,CAAWQ,GAAG,CAAC,CAAC;MAAEC;IAAI,CAAE,KAAKA,IAAA,EAAMpB,MAAM,CAAEoB,MAAA,IAASR,KAAA,GAAQQ,MAAA,CAAK,EAAExB,GAAA;EAC5E,GAAG,CAACe,UAAA,EAAYC,KAAA,CAAM;EAEtB,IAAI,CAACC,WAAA,EAAa;IAChB,OAAO;EACT;EAEA,oBACEQ,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,EAAKiB;QAGNC,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,GAAWZ,KAAA,GAAQW,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":[]}

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

@@ -1,18 +1,2 @@
-import { Modal, useModal } from '@faceless-ui/modal';
-import React from 'react';
-import './index.css';
-export { Modal, useModal };
-export type AlertModalProps = {
-    readonly actions?: React.ReactNode;
-    readonly children: React.ReactNode;
-    readonly className?: string;
-    readonly closeOnBlur?: boolean;
-    readonly compact?: boolean;
-    readonly headerActions?: React.ReactNode;
-    readonly onClose?: () => void;
-    readonly slug: string;
-    readonly title?: React.ReactNode;
-    readonly zIndex?: number;
-};
-export declare const AlertModal: React.FC<AlertModalProps>;
+export { Modal, useModal } from '@faceless-ui/modal';
 //# sourceMappingURL=index.d.ts.map

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":"AACA,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAA;AACpD,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,aAAa,CAAA;AAEpB,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAE,CAAA;AAI1B,MAAM,MAAM,eAAe,GAAG;IAC5B,QAAQ,CAAC,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAClC,QAAQ,CAAC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IAClC,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAA;IAC3B,QAAQ,CAAC,WAAW,CAAC,EAAE,OAAO,CAAA;IAC9B,QAAQ,CAAC,OAAO,CAAC,EAAE,OAAO,CAAA;IAC1B,QAAQ,CAAC,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACxC,QAAQ,CAAC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IAC7B,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAA;IACrB,QAAQ,CAAC,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAChC,QAAQ,CAAC,MAAM,CAAC,EAAE,MAAM,CAAA;CACzB,CAAA;AAED,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAkChD,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/Modal/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAA"}

package/dist/elements/Modal/index.js

@@ -1,47 +1,4 @@
 'use client';
 
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Modal, useModal } from '@faceless-ui/modal';
-import React from 'react';
-import './index.css';
-export { Modal, useModal };
-const baseClass = 'alert-modal';
-export const AlertModal = ({
-  slug,
-  actions,
-  children,
-  className,
-  closeOnBlur = false,
-  compact,
-  headerActions,
-  onClose,
-  title,
-  zIndex
-}) => {
-  return /*#__PURE__*/_jsx(Modal, {
-    className: `${baseClass}${compact ? ` ${baseClass}--compact` : ''}${className ? ` ${className}` : ''}`,
-    closeOnBlur: closeOnBlur,
-    onClose: onClose,
-    slug: slug,
-    style: zIndex != null ? {
-      zIndex
-    } : undefined,
-    children: /*#__PURE__*/_jsxs("div", {
-      className: `${baseClass}__wrapper`,
-      children: [title || headerActions ? /*#__PURE__*/_jsxs("div", {
-        className: `${baseClass}__header${headerActions ? ` ${baseClass}__header--with-actions` : ''}`,
-        children: [title ? /*#__PURE__*/_jsx("h4", {
-          className: `${baseClass}__title`,
-          children: title
-        }) : null, headerActions]
-      }) : null, /*#__PURE__*/_jsx("div", {
-        className: `${baseClass}__content`,
-        children: children
-      }), actions ? /*#__PURE__*/_jsx("div", {
-        className: `${baseClass}__controls`,
-        children: actions
-      }) : null]
-    })
-  });
-};
+export { Modal, useModal } from '@faceless-ui/modal';
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["Modal","useModal","React","baseClass","AlertModal","slug","actions","children","className","closeOnBlur","compact","headerActions","onClose","title","zIndex","_jsx","style","undefined","_jsxs"],"sources":["../../../src/elements/Modal/index.tsx"],"sourcesContent":["'use client'\nimport { Modal, useModal } from '@faceless-ui/modal'\nimport React from 'react'\n\nimport './index.css'\n\nexport { Modal, useModal }\n\nconst baseClass = 'alert-modal'\n\nexport type AlertModalProps = {\n  readonly actions?: React.ReactNode\n  readonly children: React.ReactNode\n  readonly className?: string\n  readonly closeOnBlur?: boolean\n  readonly compact?: boolean\n  readonly headerActions?: React.ReactNode\n  readonly onClose?: () => void\n  readonly slug: string\n  readonly title?: React.ReactNode\n  readonly zIndex?: number\n}\n\nexport const AlertModal: React.FC<AlertModalProps> = ({\n  slug,\n  actions,\n  children,\n  className,\n  closeOnBlur = false,\n  compact,\n  headerActions,\n  onClose,\n  title,\n  zIndex,\n}) => {\n  return (\n    <Modal\n      className={`${baseClass}${compact ? ` ${baseClass}--compact` : ''}${className ? ` ${className}` : ''}`}\n      closeOnBlur={closeOnBlur}\n      onClose={onClose}\n      slug={slug}\n      style={zIndex != null ? { zIndex } : undefined}\n    >\n      <div className={`${baseClass}__wrapper`}>\n        {title || headerActions ? (\n          <div\n            className={`${baseClass}__header${headerActions ? ` ${baseClass}__header--with-actions` : ''}`}\n          >\n            {title ? <h4 className={`${baseClass}__title`}>{title}</h4> : null}\n            {headerActions}\n          </div>\n        ) : null}\n        <div className={`${baseClass}__content`}>{children}</div>\n        {actions ? <div className={`${baseClass}__controls`}>{actions}</div> : null}\n      </div>\n    </Modal>\n  )\n}\n"],"mappings":"AAAA;;;AACA,SAASA,KAAK,EAAEC,QAAQ,QAAQ;AAChC,OAAOC,KAAA,MAAW;AAElB,OAAO;AAEP,SAASF,KAAK,EAAEC,QAAQ;AAExB,MAAME,SAAA,GAAY;AAelB,OAAO,MAAMC,UAAA,GAAwCA,CAAC;EACpDC,IAAI;EACJC,OAAO;EACPC,QAAQ;EACRC,SAAS;EACTC,WAAA,GAAc,KAAK;EACnBC,OAAO;EACPC,aAAa;EACbC,OAAO;EACPC,KAAK;EACLC;AAAM,CACP;EACC,oBACEC,IAAA,CAACf,KAAA;IACCQ,SAAA,EAAW,GAAGL,SAAA,GAAYO,OAAA,GAAU,IAAIP,SAAA,WAAoB,GAAG,KAAKK,SAAA,GAAY,IAAIA,SAAA,EAAW,GAAG,IAAI;IACtGC,WAAA,EAAaA,WAAA;IACbG,OAAA,EAASA,OAAA;IACTP,IAAA,EAAMA,IAAA;IACNW,KAAA,EAAOF,MAAA,IAAU,OAAO;MAAEA;IAAO,IAAIG,SAAA;cAErC,aAAAC,KAAA,CAAC;MAAIV,SAAA,EAAW,GAAGL,SAAA,WAAoB;iBACpCU,KAAA,IAASF,aAAA,gBACRO,KAAA,CAAC;QACCV,SAAA,EAAW,GAAGL,SAAA,WAAoBQ,aAAA,GAAgB,IAAIR,SAAA,wBAAiC,GAAG,IAAI;mBAE7FU,KAAA,gBAAQE,IAAA,CAAC;UAAGP,SAAA,EAAW,GAAGL,SAAA,SAAkB;oBAAGU;aAAc,MAC7DF,aAAA;WAED,M,aACJI,IAAA,CAAC;QAAIP,SAAA,EAAW,GAAGL,SAAA,WAAoB;kBAAGI;UACzCD,OAAA,gBAAUS,IAAA,CAAC;QAAIP,SAAA,EAAW,GAAGL,SAAA,YAAqB;kBAAGG;WAAiB;;;AAI/E","ignoreList":[]}
+{"version":3,"file":"index.js","names":["Modal","useModal"],"sources":["../../../src/elements/Modal/index.tsx"],"sourcesContent":["'use client'\nexport { Modal, useModal } from '@faceless-ui/modal'\n"],"mappings":"AAAA;;AACA,SAASA,KAAK,EAAEC,QAAQ,QAAQ","ignoreList":[]}

package/dist/elements/Nav/NavWrapper/{index.scss → index.css}

@@ -1,5 +1,3 @@
-@import '../../../scss/styles.scss';
-
 @layer payload-default {
   .nav {
     position: sticky;
@@ -8,10 +6,10 @@
     flex-shrink: 0;
     height: 100vh;
     width: var(--nav-width);
-    border-right: 1px solid var(--theme-elevation-100);
+    border-right: var(--stroke-width-small) solid var(--color-border);
     [dir='rtl'] & {
       border-right: none;
-      border-left: 1px solid var(--theme-elevation-100);
+      border-left: var(--stroke-width-small) solid var(--color-border);
     }
   }
 }

package/dist/elements/Nav/NavWrapper/index.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import './index.scss';
+import './index.css';
 /**
  * @internal
  */

package/dist/elements/Nav/NavWrapper/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/Nav/NavWrapper/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,cAAc,CAAA;AAErB;;GAEG;AACH,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC;IAChC,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAC1B,CAqBA,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/Nav/NavWrapper/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,aAAa,CAAA;AAEpB;;GAEG;AACH,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC;IAChC,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAC1B,CAqBA,CAAA"}

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

@@ -4,7 +4,7 @@ import { c as _c } from "react/compiler-runtime";
 import { jsx as _jsx } from "react/jsx-runtime";
 import React from 'react';
 import { useNav } from '../context.js';
-import './index.scss';
+import './index.css';
 /**
  * @internal
  */

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["c","_c","React","useNav","NavWrapper","props","$","baseClass","children","hydrated","navOpen","navRef","t0","t1","t2","filter","Boolean","t3","join","t4","undefined","t5","t6","_jsx","className","inert","ref"],"sources":["../../../../src/elements/Nav/NavWrapper/index.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\n\nimport { useNav } from '../context.js'\nimport './index.scss'\n\n/**\n * @internal\n */\nexport const NavWrapper: React.FC<{\n  baseClass?: string\n  children: React.ReactNode\n}> = (props) => {\n  const { baseClass, children } = props\n\n  const { hydrated, navOpen, navRef } = useNav()\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      <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,MAAM,QAAQ;AACvB,OAAO;AAEP;;;AAGA,OAAO,MAAMC,UAAA,GAGRC,KAAA;EAAA,MAAAC,CAAA,GAAAL,EAAA;EACH;IAAAM,SAAA;IAAAC;EAAA,IAAgCH,KAAA;EAEhC;IAAAI,QAAA;IAAAC,OAAA;IAAAC;EAAA,IAAsCR,MAAA;EAMhC,MAAAS,EAAA,GAAAF,OAAA,IAAW,GAAGH,SAAA,YAAqB;EACnC,MAAAM,EAAA,GAAAJ,QAAA,IAAY,GAAGF,SAAA,gBAAyB;EAAA,IAAAO,EAAA;EAAA,IAAAR,CAAA,QAAAC,SAAA,IAAAD,CAAA,QAAAM,EAAA,IAAAN,CAAA,QAAAO,EAAA;IAH/BC,EAAA,IACTP,SAAA,EACAK,EAAmC,EACnCC,EAAwC,EAAAE,MAAA,CAAAC,OAEhC;IAAAV,CAAA,MAAAC,SAAA;IAAAD,CAAA,MAAAM,EAAA;IAAAN,CAAA,MAAAO,EAAA;IAAAP,CAAA,MAAAQ,EAAA;EAAA;IAAAA,EAAA,GAAAR,CAAA;EAAA;EALC,MAAAW,EAAA,GAAAH,EAKD,CAAAI,IAAA,CACF;EACD,MAAAC,EAAA,IAACT,OAAA,UAAAU,SAAiB;EAET,MAAAC,EAAA,MAAGd,SAAA,UAAmB;EAAA,IAAAe,EAAA;EAAA,IAAAhB,CAAA,QAAAE,QAAA,IAAAF,CAAA,QAAAK,MAAA,IAAAL,CAAA,QAAAW,EAAA,IAAAX,CAAA,QAAAa,EAAA,IAAAb,CAAA,QAAAe,EAAA;IAVxCC,EAAA,GAAAC,IAAA,CAAC;MAAAC,SAAA,EACYP,EAMH;MAAAQ,KAAA,EACDN,EAAkB;MAAAX,QAAA,EAEzBe,IAAA,CAAC;QAAAC,SAAA,EAAeH,EAAsB;QAAAK,GAAA,EAAOf,MAAA;QAAAH;MAAA,C;;;;;;;;;;;SAV/Cc,E;CAeJ","ignoreList":[]}
+{"version":3,"file":"index.js","names":["c","_c","React","useNav","NavWrapper","props","$","baseClass","children","hydrated","navOpen","navRef","t0","t1","t2","filter","Boolean","t3","join","t4","undefined","t5","t6","_jsx","className","inert","ref"],"sources":["../../../../src/elements/Nav/NavWrapper/index.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\n\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}> = (props) => {\n  const { baseClass, children } = props\n\n  const { hydrated, navOpen, navRef } = useNav()\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      <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,MAAM,QAAQ;AACvB,OAAO;AAEP;;;AAGA,OAAO,MAAMC,UAAA,GAGRC,KAAA;EAAA,MAAAC,CAAA,GAAAL,EAAA;EACH;IAAAM,SAAA;IAAAC;EAAA,IAAgCH,KAAA;EAEhC;IAAAI,QAAA;IAAAC,OAAA;IAAAC;EAAA,IAAsCR,MAAA;EAMhC,MAAAS,EAAA,GAAAF,OAAA,IAAW,GAAGH,SAAA,YAAqB;EACnC,MAAAM,EAAA,GAAAJ,QAAA,IAAY,GAAGF,SAAA,gBAAyB;EAAA,IAAAO,EAAA;EAAA,IAAAR,CAAA,QAAAC,SAAA,IAAAD,CAAA,QAAAM,EAAA,IAAAN,CAAA,QAAAO,EAAA;IAH/BC,EAAA,IACTP,SAAA,EACAK,EAAmC,EACnCC,EAAwC,EAAAE,MAAA,CAAAC,OAEhC;IAAAV,CAAA,MAAAC,SAAA;IAAAD,CAAA,MAAAM,EAAA;IAAAN,CAAA,MAAAO,EAAA;IAAAP,CAAA,MAAAQ,EAAA;EAAA;IAAAA,EAAA,GAAAR,CAAA;EAAA;EALC,MAAAW,EAAA,GAAAH,EAKD,CAAAI,IAAA,CACF;EACD,MAAAC,EAAA,IAACT,OAAA,UAAAU,SAAiB;EAET,MAAAC,EAAA,MAAGd,SAAA,UAAmB;EAAA,IAAAe,EAAA;EAAA,IAAAhB,CAAA,QAAAE,QAAA,IAAAF,CAAA,QAAAK,MAAA,IAAAL,CAAA,QAAAW,EAAA,IAAAX,CAAA,QAAAa,EAAA,IAAAb,CAAA,QAAAe,EAAA;IAVxCC,EAAA,GAAAC,IAAA,CAAC;MAAAC,SAAA,EACYP,EAMH;MAAAQ,KAAA,EACDN,EAAkB;MAAAX,QAAA,EAEzBe,IAAA,CAAC;QAAAC,SAAA,EAAeH,EAAsB;QAAAK,GAAA,EAAOf,MAAA;QAAAH;MAAA,C;;;;;;;;;;;SAV/Cc,E;CAeJ","ignoreList":[]}

package/dist/elements/Nav/SettingsMenuButton/index.css

@@ -0,0 +1,5 @@
+@layer payload-default {
+  .settings-menu-button.popup--h-align-left .popup__content {
+    left: calc(var(--nav-padding-inline-start) * -0.5);
+  }
+}

package/dist/elements/Nav/SettingsMenuButton/index.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import './index.scss';
+import './index.css';
 export type SettingsMenuButtonProps = {
     settingsMenu?: React.ReactNode[];
 };

package/dist/elements/Nav/SettingsMenuButton/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/Nav/SettingsMenuButton/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAmB,MAAM,OAAO,CAAA;AAKvC,OAAO,cAAc,CAAA;AAIrB,MAAM,MAAM,uBAAuB,GAAG;IACpC,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,EAAE,CAAA;CACjC,CAAA;AAED,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CAqBhE,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/Nav/SettingsMenuButton/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAmB,MAAM,OAAO,CAAA;AAKvC,OAAO,aAAa,CAAA;AAIpB,MAAM,MAAM,uBAAuB,GAAG;IACpC,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,EAAE,CAAA;CACjC,CAAA;AAED,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CAqBhE,CAAA"}

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

@@ -6,7 +6,7 @@ import React, { Fragment } from 'react';
 import { GearIcon } from '../../../icons/Gear/index.js';
 import { useTranslation } from '../../../providers/Translation/index.js';
 import { Popup } from '../../Popup/index.js';
-import './index.scss';
+import './index.css';
 const baseClass = 'settings-menu-button';
 export const SettingsMenuButton = t0 => {
   const $ = _c(3);

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","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.scss'\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      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,IAAA,EACE;MAAAC,aAAA,EACS;MAAAC,QAAA,EAEbV,YAAA,CAAAW,GAAA,CAAAC,KACyC;IAAA,C;;;;;;;SAT5CT,E;CAaJ;AArBqE,SAAAS,MAAAC,IAAA,EAAAC,CAAA;EAAA,OAiB7DV,IAAA,CAAAZ,QAAA;IAAAkB,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","id","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      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,IAAA,EACE;MAAAC,aAAA,EACS;MAAAC,QAAA,EAEbV,YAAA,CAAAW,GAAA,CAAAC,KACyC;IAAA,C;;;;;;;SAT5CT,E;CAaJ;AArBqE,SAAAS,MAAAC,IAAA,EAAAC,CAAA;EAAA,OAiB7DV,IAAA,CAAAZ,QAAA;IAAAkB,QAAA,EAA2CG;EAAA,GAA5B,sBAAsBC,CAAA,EAAG;AAAA","ignoreList":[]}

package/dist/elements/Nav/SidebarTabs/index.css

@@ -38,6 +38,12 @@
     &:hover {
       color: var(--color-icon);
     }
+
+    &:focus-visible {
+      outline: var(--accessibility-outline);
+      outline-offset: var(--accessibility-outline-offset);
+      border-radius: var(--button-radius);
+    }
   }
 
   .sidebar-tabs__tab--active {

package/dist/elements/Nav/index.css

@@ -6,7 +6,7 @@
     flex-shrink: 0;
     height: 100vh;
     width: var(--nav-width);
-    border-right: 1px solid var(--color-border);
+    border-right: var(--stroke-width-small) solid var(--color-border);
     overflow: hidden;
     --nav-padding-inline-start: var(--spacer-2-5);
     --nav-padding-inline-end: var(--spacer-2-5);
@@ -16,7 +16,7 @@
 
   [dir='rtl'] .nav {
     border-right: none;
-    border-left: 1px solid var(--color-border);
+    border-left: var(--stroke-width-small) solid var(--color-border);
   }
 
   .nav__mobile-close {
@@ -119,11 +119,6 @@
       --nav-padding-inline-end: var(--gutter-h);
     }
 
-    .nav__link {
-      font-size: var(--text-body-small-font-size);
-      line-height: var(--spacer-4);
-    }
-
     .nav__mobile-close {
       display: flex;
       align-items: center;

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/Nav/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,WAAW,EAAE,MAAM,SAAS,CAAA;AAG1D,OAAO,KAAK,MAAM,OAAO,CAAA;AAgBzB,OAAO,aAAa,CAAA;AAMpB,MAAM,MAAM,QAAQ,GAAG;IACrB,GAAG,CAAC,EAAE,cAAc,CAAA;CACrB,GAAG,WAAW,CAAA;AAEf,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,QAAQ,CA0NzC,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/Nav/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,WAAW,EAAE,MAAM,SAAS,CAAA;AAG1D,OAAO,KAAK,MAAM,OAAO,CAAA;AAWzB,OAAO,aAAa,CAAA;AAMpB,MAAM,MAAM,QAAQ,GAAG;IACrB,GAAG,CAAC,EAAE,cAAc,CAAA;CACrB,GAAG,WAAW,CAAA;AAEf,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,QAAQ,CAsMzC,CAAA"}

package/dist/elements/Nav/index.js

@@ -2,7 +2,7 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
 import { EntityType } from 'payload';
 import React from 'react';
 /* eslint-disable payload/no-imports-from-exports-dir -- Server component must reference exports dir for proper client boundary */
-import { DefaultNavClient, Logout, NavWrapper, SettingsMenuButton } from '../../exports/client/index.js';
+import { DefaultNavClient, NavWrapper, SettingsMenuButton } from '../../exports/client/index.js';
 /* eslint-enable payload/no-imports-from-exports-dir */
 import { AlignJustifiedIcon } from '../../icons/AlignJustified/index.js';
 import { groupNavItems } from '../../utilities/groupNavItems.js';
@@ -35,7 +35,6 @@ export const DefaultNav = async props => {
         afterNavLinks,
         beforeNav,
         beforeNavLinks,
-        logout,
         settingsMenu
       }
     },
@@ -56,24 +55,6 @@ export const DefaultNav = async props => {
     entity: global
   }))], permissions, i18n);
   const navPreferences = await getNavPrefs(req);
-  const LogoutComponent = RenderServerComponent({
-    clientProps: {
-      documentSubViewType,
-      viewType
-    },
-    Component: logout?.Button,
-    Fallback: Logout,
-    importMap: payload.importMap,
-    serverProps: {
-      i18n,
-      locale,
-      params,
-      payload,
-      permissions,
-      searchParams,
-      user
-    }
-  });
   const RenderedSettingsMenu = settingsMenu && Array.isArray(settingsMenu) ? settingsMenu.map((item, index) => RenderServerComponent({
     clientProps: {
       documentSubViewType,
@@ -195,11 +176,11 @@ export const DefaultNav = async props => {
         tabs: allTabs,
         user: user,
         viewType: viewType
-      }), /*#__PURE__*/_jsxs("div", {
+      }), /*#__PURE__*/_jsx("div", {
         className: `${baseClass}__controls`,
-        children: [/*#__PURE__*/_jsx(SettingsMenuButton, {
+        children: /*#__PURE__*/_jsx(SettingsMenuButton, {
           settingsMenu: RenderedSettingsMenu
-        }), LogoutComponent]
+        })
       })]
     }), RenderedAfterNav]
   });

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["EntityType","React","DefaultNavClient","Logout","NavWrapper","SettingsMenuButton","AlignJustifiedIcon","groupNavItems","RenderServerComponent","SidebarTabs","baseClass","getNavPrefs","DefaultNav","props","documentSubViewType","i18n","locale","params","payload","permissions","req","searchParams","user","viewType","visibleEntities","config","admin","components","afterNav","afterNavLinks","beforeNav","beforeNavLinks","logout","settingsMenu","collections","globals","groups","filter","slug","includes","map","collection","type","entity","global","navPreferences","LogoutComponent","clientProps","Component","Button","Fallback","importMap","serverProps","RenderedSettingsMenu","Array","isArray","item","index","key","RenderedBeforeNav","RenderedBeforeNavLinks","RenderedAfterNavLinks","RenderedAfterNav","allTabs","Content","_jsxs","_Fragment","_jsx","Icon","size","isDefaultActive","label","t","sidebar","tabs","tab","disabled","className","server"],"sources":["../../../src/elements/Nav/index.tsx"],"sourcesContent":["import type { PayloadRequest, ServerProps } from 'payload'\n\nimport { EntityType } from 'payload'\nimport React from 'react'\n\nimport type { EntityToGroup } from '../../utilities/groupNavItems.js'\n\n/* eslint-disable payload/no-imports-from-exports-dir -- Server component must reference exports dir for proper client boundary */\nimport {\n  DefaultNavClient,\n  Logout,\n  NavWrapper,\n  SettingsMenuButton,\n} from '../../exports/client/index.js'\n/* eslint-enable payload/no-imports-from-exports-dir */\nimport { AlignJustifiedIcon } from '../../icons/AlignJustified/index.js'\nimport { groupNavItems } from '../../utilities/groupNavItems.js'\nimport { RenderServerComponent } from '../RenderServerComponent/index.js'\nimport { SidebarTabs } from './SidebarTabs/index.js'\nimport './index.css'\n\nconst baseClass = 'nav'\n\nimport { getNavPrefs } from './getNavPrefs.js'\n\nexport type NavProps = {\n  req?: PayloadRequest\n} & ServerProps\n\nexport const DefaultNav: React.FC<NavProps> = async (props) => {\n  const {\n    documentSubViewType,\n    i18n,\n    locale,\n    params,\n    payload,\n    permissions,\n    req,\n    searchParams,\n    user,\n    viewType,\n    visibleEntities,\n  } = props\n\n  if (!payload?.config) {\n    return null\n  }\n\n  const {\n    admin: {\n      components: { afterNav, afterNavLinks, beforeNav, beforeNavLinks, logout, settingsMenu },\n    },\n    collections,\n    globals,\n  } = payload.config\n\n  // Group collections and globals for nav display\n  // These groups are passed to SidebarTabs -> CollectionsTab to avoid recomputing\n  const groups = groupNavItems(\n    [\n      ...collections\n        .filter(({ slug }) => visibleEntities.collections.includes(slug))\n        .map(\n          (collection) =>\n            ({\n              type: EntityType.collection,\n              entity: collection,\n            }) satisfies EntityToGroup,\n        ),\n      ...globals\n        .filter(({ slug }) => visibleEntities.globals.includes(slug))\n        .map(\n          (global) =>\n            ({\n              type: EntityType.global,\n              entity: global,\n            }) satisfies EntityToGroup,\n        ),\n    ],\n    permissions,\n    i18n,\n  )\n\n  const navPreferences = await getNavPrefs(req)\n\n  const LogoutComponent = RenderServerComponent({\n    clientProps: {\n      documentSubViewType,\n      viewType,\n    },\n    Component: logout?.Button,\n    Fallback: Logout,\n    importMap: payload.importMap,\n    serverProps: {\n      i18n,\n      locale,\n      params,\n      payload,\n      permissions,\n      searchParams,\n      user,\n    },\n  })\n\n  const RenderedSettingsMenu =\n    settingsMenu && Array.isArray(settingsMenu)\n      ? settingsMenu.map((item, index) =>\n          RenderServerComponent({\n            clientProps: {\n              documentSubViewType,\n              viewType,\n            },\n            Component: item,\n            importMap: payload.importMap,\n            key: `settings-menu-item-${index}`,\n            serverProps: {\n              i18n,\n              locale,\n              params,\n              payload,\n              permissions,\n              searchParams,\n              user,\n            },\n          }),\n        )\n      : []\n\n  const RenderedBeforeNav = RenderServerComponent({\n    clientProps: {\n      documentSubViewType,\n      viewType,\n    },\n    Component: beforeNav,\n    importMap: payload.importMap,\n    serverProps: {\n      i18n,\n      locale,\n      params,\n      payload,\n      permissions,\n      searchParams,\n      user,\n    },\n  })\n\n  const RenderedBeforeNavLinks = RenderServerComponent({\n    clientProps: {\n      documentSubViewType,\n      viewType,\n    },\n    Component: beforeNavLinks,\n    importMap: payload.importMap,\n    serverProps: {\n      i18n,\n      locale,\n      params,\n      payload,\n      permissions,\n      searchParams,\n      user,\n    },\n  })\n\n  const RenderedAfterNavLinks = RenderServerComponent({\n    clientProps: {\n      documentSubViewType,\n      viewType,\n    },\n    Component: afterNavLinks,\n    importMap: payload.importMap,\n    serverProps: {\n      i18n,\n      locale,\n      params,\n      payload,\n      permissions,\n      searchParams,\n      user,\n    },\n  })\n\n  const RenderedAfterNav = RenderServerComponent({\n    clientProps: {\n      documentSubViewType,\n      viewType,\n    },\n    Component: afterNav,\n    importMap: payload.importMap,\n    serverProps: {\n      i18n,\n      locale,\n      params,\n      payload,\n      permissions,\n      searchParams,\n      user,\n    },\n  })\n\n  // Build the full tabs array, starting with the default nav tab\n  const allTabs = [\n    {\n      slug: 'nav',\n      components: {\n        Content: (\n          <>\n            {RenderedBeforeNavLinks}\n            <DefaultNavClient groups={groups} navPreferences={navPreferences} />\n            {RenderedAfterNavLinks}\n          </>\n        ),\n        Icon: <AlignJustifiedIcon size={24} />,\n      },\n      isDefaultActive: true,\n      label: i18n.t('general:collections'),\n    },\n    ...(payload.config.admin?.components?.sidebar?.tabs?.filter((tab) => !tab.disabled) || []),\n  ]\n\n  return (\n    <NavWrapper baseClass={baseClass}>\n      {RenderedBeforeNav}\n      <nav className={`${baseClass}__wrap`}>\n        <SidebarTabs\n          documentSubViewType={documentSubViewType}\n          i18n={i18n}\n          locale={locale}\n          navPreferences={navPreferences}\n          params={params}\n          payload={payload}\n          permissions={permissions}\n          req={req}\n          searchParams={searchParams}\n          server={req?.server}\n          tabs={allTabs}\n          user={user}\n          viewType={viewType}\n        />\n        <div className={`${baseClass}__controls`}>\n          <SettingsMenuButton settingsMenu={RenderedSettingsMenu} />\n          {LogoutComponent}\n        </div>\n      </nav>\n      {RenderedAfterNav}\n    </NavWrapper>\n  )\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"index.js","names":["EntityType","React","DefaultNavClient","NavWrapper","SettingsMenuButton","AlignJustifiedIcon","groupNavItems","RenderServerComponent","SidebarTabs","baseClass","getNavPrefs","DefaultNav","props","documentSubViewType","i18n","locale","params","payload","permissions","req","searchParams","user","viewType","visibleEntities","config","admin","components","afterNav","afterNavLinks","beforeNav","beforeNavLinks","settingsMenu","collections","globals","groups","filter","slug","includes","map","collection","type","entity","global","navPreferences","RenderedSettingsMenu","Array","isArray","item","index","clientProps","Component","importMap","key","serverProps","RenderedBeforeNav","RenderedBeforeNavLinks","RenderedAfterNavLinks","RenderedAfterNav","allTabs","Content","_jsxs","_Fragment","_jsx","Icon","size","isDefaultActive","label","t","sidebar","tabs","tab","disabled","className","server"],"sources":["../../../src/elements/Nav/index.tsx"],"sourcesContent":["import type { PayloadRequest, ServerProps } from 'payload'\n\nimport { EntityType } from 'payload'\nimport React from 'react'\n\nimport type { EntityToGroup } from '../../utilities/groupNavItems.js'\n\n/* eslint-disable payload/no-imports-from-exports-dir -- Server component must reference exports dir for proper client boundary */\nimport { DefaultNavClient, NavWrapper, SettingsMenuButton } from '../../exports/client/index.js'\n/* eslint-enable payload/no-imports-from-exports-dir */\nimport { AlignJustifiedIcon } from '../../icons/AlignJustified/index.js'\nimport { groupNavItems } from '../../utilities/groupNavItems.js'\nimport { RenderServerComponent } from '../RenderServerComponent/index.js'\nimport { SidebarTabs } from './SidebarTabs/index.js'\nimport './index.css'\n\nconst baseClass = 'nav'\n\nimport { getNavPrefs } from './getNavPrefs.js'\n\nexport type NavProps = {\n  req?: PayloadRequest\n} & ServerProps\n\nexport const DefaultNav: React.FC<NavProps> = async (props) => {\n  const {\n    documentSubViewType,\n    i18n,\n    locale,\n    params,\n    payload,\n    permissions,\n    req,\n    searchParams,\n    user,\n    viewType,\n    visibleEntities,\n  } = props\n\n  if (!payload?.config) {\n    return null\n  }\n\n  const {\n    admin: {\n      components: { afterNav, afterNavLinks, beforeNav, beforeNavLinks, settingsMenu },\n    },\n    collections,\n    globals,\n  } = payload.config\n\n  // Group collections and globals for nav display\n  // These groups are passed to SidebarTabs -> CollectionsTab to avoid recomputing\n  const groups = groupNavItems(\n    [\n      ...collections\n        .filter(({ slug }) => visibleEntities.collections.includes(slug))\n        .map(\n          (collection) =>\n            ({\n              type: EntityType.collection,\n              entity: collection,\n            }) satisfies EntityToGroup,\n        ),\n      ...globals\n        .filter(({ slug }) => visibleEntities.globals.includes(slug))\n        .map(\n          (global) =>\n            ({\n              type: EntityType.global,\n              entity: global,\n            }) satisfies EntityToGroup,\n        ),\n    ],\n    permissions,\n    i18n,\n  )\n\n  const navPreferences = await getNavPrefs(req)\n\n  const RenderedSettingsMenu =\n    settingsMenu && Array.isArray(settingsMenu)\n      ? settingsMenu.map((item, index) =>\n          RenderServerComponent({\n            clientProps: {\n              documentSubViewType,\n              viewType,\n            },\n            Component: item,\n            importMap: payload.importMap,\n            key: `settings-menu-item-${index}`,\n            serverProps: {\n              i18n,\n              locale,\n              params,\n              payload,\n              permissions,\n              searchParams,\n              user,\n            },\n          }),\n        )\n      : []\n\n  const RenderedBeforeNav = RenderServerComponent({\n    clientProps: {\n      documentSubViewType,\n      viewType,\n    },\n    Component: beforeNav,\n    importMap: payload.importMap,\n    serverProps: {\n      i18n,\n      locale,\n      params,\n      payload,\n      permissions,\n      searchParams,\n      user,\n    },\n  })\n\n  const RenderedBeforeNavLinks = RenderServerComponent({\n    clientProps: {\n      documentSubViewType,\n      viewType,\n    },\n    Component: beforeNavLinks,\n    importMap: payload.importMap,\n    serverProps: {\n      i18n,\n      locale,\n      params,\n      payload,\n      permissions,\n      searchParams,\n      user,\n    },\n  })\n\n  const RenderedAfterNavLinks = RenderServerComponent({\n    clientProps: {\n      documentSubViewType,\n      viewType,\n    },\n    Component: afterNavLinks,\n    importMap: payload.importMap,\n    serverProps: {\n      i18n,\n      locale,\n      params,\n      payload,\n      permissions,\n      searchParams,\n      user,\n    },\n  })\n\n  const RenderedAfterNav = RenderServerComponent({\n    clientProps: {\n      documentSubViewType,\n      viewType,\n    },\n    Component: afterNav,\n    importMap: payload.importMap,\n    serverProps: {\n      i18n,\n      locale,\n      params,\n      payload,\n      permissions,\n      searchParams,\n      user,\n    },\n  })\n\n  // Build the full tabs array, starting with the default nav tab\n  const allTabs = [\n    {\n      slug: 'nav',\n      components: {\n        Content: (\n          <>\n            {RenderedBeforeNavLinks}\n            <DefaultNavClient groups={groups} navPreferences={navPreferences} />\n            {RenderedAfterNavLinks}\n          </>\n        ),\n        Icon: <AlignJustifiedIcon size={24} />,\n      },\n      isDefaultActive: true,\n      label: i18n.t('general:collections'),\n    },\n    ...(payload.config.admin?.components?.sidebar?.tabs?.filter((tab) => !tab.disabled) || []),\n  ]\n\n  return (\n    <NavWrapper baseClass={baseClass}>\n      {RenderedBeforeNav}\n      <nav className={`${baseClass}__wrap`}>\n        <SidebarTabs\n          documentSubViewType={documentSubViewType}\n          i18n={i18n}\n          locale={locale}\n          navPreferences={navPreferences}\n          params={params}\n          payload={payload}\n          permissions={permissions}\n          req={req}\n          searchParams={searchParams}\n          server={req?.server}\n          tabs={allTabs}\n          user={user}\n          viewType={viewType}\n        />\n        <div className={`${baseClass}__controls`}>\n          <SettingsMenuButton settingsMenu={RenderedSettingsMenu} />\n        </div>\n      </nav>\n      {RenderedAfterNav}\n    </NavWrapper>\n  )\n}\n"],"mappings":"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","ignoreList":[]}