@payloadcms/ui 4.0.0-internal.38b7f1d → 4.0.0-internal.5f0cd13

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

@@ -1 +1 @@
-{"version":3,"file":"context.js","names":["useWindowInfo","usePathname","PREFERENCE_KEYS","React","useEffect","useRef","usePreferences","NavContext","createContext","hydrated","navOpen","navRef","setNavOpen","shouldAnimate","useNav","use","getNavPreference","getPreference","navPrefs","NAV","preferredState","open","NavProvider","children","initialIsOpen","breakpoints","l","largeBreak","m","midBreak","s","smallBreak","pathname","useState","setShouldAnimate","setHydrated","setNavFromPreferences","current","style","overscrollBehavior","timeout","setTimeout","clearTimeout","_jsx","value"],"sources":["../../../src/elements/Nav/context.tsx"],"sourcesContent":["'use client'\nimport { useWindowInfo } from '@faceless-ui/window-info'\nimport { usePathname } from 'next/navigation.js'\nimport { PREFERENCE_KEYS } from 'payload/shared'\nimport React, { useEffect, useRef } from 'react'\n\nimport { usePreferences } from '../../providers/Preferences/index.js'\n\ntype NavContextType = {\n  hydrated: boolean\n  navOpen: boolean\n  navRef: React.RefObject<HTMLDivElement | null>\n  setNavOpen: (value: boolean) => void\n  shouldAnimate: boolean\n}\n\n/**\n * @internal\n */\nexport const NavContext = React.createContext<NavContextType>({\n  hydrated: false,\n  navOpen: true,\n  navRef: null,\n  setNavOpen: () => {},\n  shouldAnimate: false,\n})\n\nexport const useNav = () => React.use(NavContext)\n\nconst getNavPreference = async (getPreference): Promise<boolean> => {\n  const navPrefs = await getPreference(PREFERENCE_KEYS.NAV)\n  const preferredState = navPrefs?.open\n  if (typeof preferredState === 'boolean') {\n    return preferredState\n  } else {\n    return true\n  }\n}\n\n/**\n * @internal\n */\nexport const NavProvider: React.FC<{\n  children: React.ReactNode\n  initialIsOpen?: boolean\n}> = ({ children, initialIsOpen }) => {\n  const {\n    breakpoints: { l: largeBreak, m: midBreak, s: smallBreak },\n  } = useWindowInfo()\n\n  const pathname = usePathname()\n\n  const { getPreference } = usePreferences()\n  const navRef = useRef(null)\n\n  // initialize the nav to be closed\n  // this is because getting the preference is async\n  // so instead of closing it after the preference is loaded\n  // we will open it after the preference is loaded\n  const [navOpen, setNavOpen] = React.useState(initialIsOpen)\n\n  const [shouldAnimate, setShouldAnimate] = React.useState(false)\n  const [hydrated, setHydrated] = React.useState(false)\n\n  // on load check the user's preference and set \"initial\" state\n  useEffect(() => {\n    if (largeBreak === false) {\n      const setNavFromPreferences = async () => {\n        const preferredState = await getNavPreference(getPreference)\n        setNavOpen(preferredState)\n      }\n\n      void setNavFromPreferences()\n    }\n  }, [largeBreak, getPreference, setNavOpen])\n\n  // on smaller screens where the nav is a modal\n  // close the nav when the user navigates away\n  useEffect(() => {\n    if (smallBreak === true) {\n      setNavOpen(false)\n    }\n  }, [pathname])\n\n  // on open and close, lock the body scroll\n  // do not do this on desktop, the sidebar is not a modal\n  useEffect(() => {\n    if (navRef.current) {\n      if (navOpen && midBreak) {\n        navRef.current.style.overscrollBehavior = 'contain'\n      } else {\n        navRef.current.style.overscrollBehavior = 'auto'\n      }\n    }\n  }, [navOpen, midBreak])\n\n  // on smaller screens where the nav is a modal\n  // close the nav when the user resizes down to mobile\n  // the sidebar is a modal on mobile\n  useEffect(() => {\n    if (largeBreak === true || midBreak === true || smallBreak === true) {\n      setNavOpen(false)\n    }\n    setHydrated(true)\n\n    const timeout = setTimeout(() => {\n      setShouldAnimate(true)\n    }, 100)\n    return () => {\n      clearTimeout(timeout)\n    }\n  }, [largeBreak, midBreak, smallBreak])\n\n  // when the component unmounts, clear all body scroll locks\n  useEffect(() => {\n    return () => {\n      if (navRef.current) {\n        navRef.current.style.overscrollBehavior = 'auto'\n      }\n    }\n  }, [])\n\n  return (\n    <NavContext value={{ hydrated, navOpen, navRef, setNavOpen, shouldAnimate }}>\n      {children}\n    </NavContext>\n  )\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"context.js","names":["useWindowInfo","PREFERENCE_KEYS","React","useEffect","useRef","usePreferences","usePathname","NavContext","createContext","hydrated","navOpen","navRef","setNavOpen","useNav","use","getNavPreference","getPreference","navPrefs","NAV","preferredState","open","NavProvider","children","initialIsOpen","breakpoints","l","largeBreak","m","midBreak","s","smallBreak","pathname","useState","setHydrated","setNavFromPreferences","current","style","overscrollBehavior","_jsx","value"],"sources":["../../../src/elements/Nav/context.tsx"],"sourcesContent":["'use client'\nimport { useWindowInfo } from '@faceless-ui/window-info'\nimport { PREFERENCE_KEYS } from 'payload/shared'\nimport React, { useEffect, useRef } from 'react'\n\nimport { usePreferences } from '../../providers/Preferences/index.js'\nimport { usePathname } from '../../providers/RouterAdapter/index.js'\n\ntype NavContextType = {\n  hydrated: boolean\n  navOpen: boolean\n  navRef: React.RefObject<HTMLDivElement | null>\n  setNavOpen: (value: boolean) => void\n}\n\n/**\n * @internal\n */\nexport const NavContext = React.createContext<NavContextType>({\n  hydrated: false,\n  navOpen: true,\n  navRef: null,\n  setNavOpen: () => {},\n})\n\nexport const useNav = () => React.use(NavContext)\n\nconst getNavPreference = async (getPreference): Promise<boolean> => {\n  const navPrefs = await getPreference(PREFERENCE_KEYS.NAV)\n  const preferredState = navPrefs?.open\n  if (typeof preferredState === 'boolean') {\n    return preferredState\n  } else {\n    return true\n  }\n}\n\n/**\n * @internal\n */\nexport const NavProvider: React.FC<{\n  children: React.ReactNode\n  initialIsOpen?: boolean\n}> = ({ children, initialIsOpen }) => {\n  const {\n    breakpoints: { l: largeBreak, m: midBreak, s: smallBreak },\n  } = useWindowInfo()\n\n  const pathname = usePathname()\n\n  const { getPreference } = usePreferences()\n  const navRef = useRef(null)\n\n  // initialize the nav to be closed\n  // this is because getting the preference is async\n  // so instead of closing it after the preference is loaded\n  // we will open it after the preference is loaded\n  const [navOpen, setNavOpen] = React.useState(initialIsOpen)\n\n  const [hydrated, setHydrated] = React.useState(false)\n\n  // on load check the user's preference and set \"initial\" state\n  useEffect(() => {\n    if (largeBreak === false) {\n      const setNavFromPreferences = async () => {\n        const preferredState = await getNavPreference(getPreference)\n        setNavOpen(preferredState)\n      }\n\n      void setNavFromPreferences()\n    }\n  }, [largeBreak, getPreference, setNavOpen])\n\n  // on smaller screens where the nav is a modal\n  // close the nav when the user navigates away\n  useEffect(() => {\n    if (smallBreak === true) {\n      setNavOpen(false)\n    }\n  }, [pathname])\n\n  // on open and close, lock the body scroll\n  // do not do this on desktop, the sidebar is not a modal\n  useEffect(() => {\n    if (navRef.current) {\n      if (navOpen && midBreak) {\n        navRef.current.style.overscrollBehavior = 'contain'\n      } else {\n        navRef.current.style.overscrollBehavior = 'auto'\n      }\n    }\n  }, [navOpen, midBreak])\n\n  // on smaller screens where the nav is a modal\n  // close the nav when the user resizes down to mobile\n  // the sidebar is a modal on mobile\n  useEffect(() => {\n    if (largeBreak === true || midBreak === true || smallBreak === true) {\n      setNavOpen(false)\n    }\n    setHydrated(true)\n  }, [largeBreak, midBreak, smallBreak])\n\n  // when the component unmounts, clear all body scroll locks\n  useEffect(() => {\n    return () => {\n      if (navRef.current) {\n        navRef.current.style.overscrollBehavior = 'auto'\n      }\n    }\n  }, [])\n\n  return <NavContext value={{ hydrated, navOpen, navRef, setNavOpen }}>{children}</NavContext>\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/elements/Nav/getNavPrefs.d.ts

@@ -0,0 +1,3 @@
+import type { NavPreferences, PayloadRequest } from 'payload';
+export declare const getNavPrefs: (req: PayloadRequest) => Promise<NavPreferences>;
+//# sourceMappingURL=getNavPrefs.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"getNavPrefs.d.ts","sourceRoot":"","sources":["../../../src/elements/Nav/getNavPrefs.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,SAAS,CAAA;AAK7D,eAAO,MAAM,WAAW,QAAqB,cAAc,KAAG,OAAO,CAAC,cAAc,CAoElF,CAAA"}

package/dist/elements/Nav/getNavPrefs.js

@@ -0,0 +1,61 @@
+import { PREFERENCE_KEYS } from 'payload/shared';
+import { cache } from 'react';
+export const getNavPrefs = cache(async req => {
+  if (!req?.user?.collection) {
+    return {
+      activeTab: undefined,
+      groups: {},
+      open: true
+    };
+  }
+  const navPrefs = await req.payload.find({
+    collection: 'payload-preferences',
+    depth: 0,
+    limit: 1,
+    pagination: false,
+    req,
+    where: {
+      and: [{
+        key: {
+          equals: PREFERENCE_KEYS.NAV
+        }
+      }, {
+        'user.relationTo': {
+          equals: req.user.collection
+        }
+      }, {
+        'user.value': {
+          equals: req?.user?.id
+        }
+      }]
+    }
+  })?.then(res => res?.docs?.[0]?.value);
+  const sidebarPrefs = await req.payload.find({
+    collection: 'payload-preferences',
+    depth: 0,
+    limit: 1,
+    pagination: false,
+    req,
+    where: {
+      and: [{
+        key: {
+          equals: PREFERENCE_KEYS.NAV_SIDEBAR_ACTIVE_TAB
+        }
+      }, {
+        'user.relationTo': {
+          equals: req.user.collection
+        }
+      }, {
+        'user.value': {
+          equals: req?.user?.id
+        }
+      }]
+    }
+  })?.then(res => res?.docs?.[0]?.value);
+  return {
+    activeTab: sidebarPrefs?.activeTab,
+    groups: navPrefs?.groups ?? {},
+    open: navPrefs?.open ?? true
+  };
+});
+//# sourceMappingURL=getNavPrefs.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"getNavPrefs.js","names":["PREFERENCE_KEYS","cache","getNavPrefs","req","user","collection","activeTab","undefined","groups","open","navPrefs","payload","find","depth","limit","pagination","where","and","key","equals","NAV","id","then","res","docs","value","sidebarPrefs","NAV_SIDEBAR_ACTIVE_TAB"],"sources":["../../../src/elements/Nav/getNavPrefs.ts"],"sourcesContent":["import type { NavPreferences, PayloadRequest } from 'payload'\n\nimport { PREFERENCE_KEYS } from 'payload/shared'\nimport { cache } from 'react'\n\nexport const getNavPrefs = cache(async (req: PayloadRequest): Promise<NavPreferences> => {\n  if (!req?.user?.collection) {\n    return { activeTab: undefined, groups: {}, open: true }\n  }\n\n  const navPrefs = await req.payload\n    .find({\n      collection: 'payload-preferences',\n      depth: 0,\n      limit: 1,\n      pagination: false,\n      req,\n      where: {\n        and: [\n          {\n            key: {\n              equals: PREFERENCE_KEYS.NAV,\n            },\n          },\n          {\n            'user.relationTo': {\n              equals: req.user.collection,\n            },\n          },\n          {\n            'user.value': {\n              equals: req?.user?.id,\n            },\n          },\n        ],\n      },\n    })\n    ?.then((res) => res?.docs?.[0]?.value)\n\n  const sidebarPrefs = await req.payload\n    .find({\n      collection: 'payload-preferences',\n      depth: 0,\n      limit: 1,\n      pagination: false,\n      req,\n      where: {\n        and: [\n          {\n            key: {\n              equals: PREFERENCE_KEYS.NAV_SIDEBAR_ACTIVE_TAB,\n            },\n          },\n          {\n            'user.relationTo': {\n              equals: req.user.collection,\n            },\n          },\n          {\n            'user.value': {\n              equals: req?.user?.id,\n            },\n          },\n        ],\n      },\n    })\n    ?.then((res) => res?.docs?.[0]?.value)\n\n  return {\n    activeTab: sidebarPrefs?.activeTab,\n    groups: navPrefs?.groups ?? {},\n    open: navPrefs?.open ?? true,\n  }\n})\n"],"mappings":"AAEA,SAASA,eAAe,QAAQ;AAChC,SAASC,KAAK,QAAQ;AAEtB,OAAO,MAAMC,WAAA,GAAcD,KAAA,CAAM,MAAOE,GAAA;EACtC,IAAI,CAACA,GAAA,EAAKC,IAAA,EAAMC,UAAA,EAAY;IAC1B,OAAO;MAAEC,SAAA,EAAWC,SAAA;MAAWC,MAAA,EAAQ,CAAC;MAAGC,IAAA,EAAM;IAAK;EACxD;EAEA,MAAMC,QAAA,GAAW,MAAMP,GAAA,CAAIQ,OAAO,CAC/BC,IAAI,CAAC;IACJP,UAAA,EAAY;IACZQ,KAAA,EAAO;IACPC,KAAA,EAAO;IACPC,UAAA,EAAY;IACZZ,GAAA;IACAa,KAAA,EAAO;MACLC,GAAA,EAAK,CACH;QACEC,GAAA,EAAK;UACHC,MAAA,EAAQnB,eAAA,CAAgBoB;QAC1B;MACF,GACA;QACE,mBAAmB;UACjBD,MAAA,EAAQhB,GAAA,CAAIC,IAAI,CAACC;QACnB;MACF,GACA;QACE,cAAc;UACZc,MAAA,EAAQhB,GAAA,EAAKC,IAAA,EAAMiB;QACrB;MACF;IAEJ;EACF,IACEC,IAAA,CAAMC,GAAA,IAAQA,GAAA,EAAKC,IAAA,GAAO,EAAE,EAAEC,KAAA;EAElC,MAAMC,YAAA,GAAe,MAAMvB,GAAA,CAAIQ,OAAO,CACnCC,IAAI,CAAC;IACJP,UAAA,EAAY;IACZQ,KAAA,EAAO;IACPC,KAAA,EAAO;IACPC,UAAA,EAAY;IACZZ,GAAA;IACAa,KAAA,EAAO;MACLC,GAAA,EAAK,CACH;QACEC,GAAA,EAAK;UACHC,MAAA,EAAQnB,eAAA,CAAgB2B;QAC1B;MACF,GACA;QACE,mBAAmB;UACjBR,MAAA,EAAQhB,GAAA,CAAIC,IAAI,CAACC;QACnB;MACF,GACA;QACE,cAAc;UACZc,MAAA,EAAQhB,GAAA,EAAKC,IAAA,EAAMiB;QACrB;MACF;IAEJ;EACF,IACEC,IAAA,CAAMC,GAAA,IAAQA,GAAA,EAAKC,IAAA,GAAO,EAAE,EAAEC,KAAA;EAElC,OAAO;IACLnB,SAAA,EAAWoB,YAAA,EAAcpB,SAAA;IACzBE,MAAA,EAAQE,QAAA,EAAUF,MAAA,IAAU,CAAC;IAC7BC,IAAA,EAAMC,QAAA,EAAUD,IAAA,IAAQ;EAC1B;AACF","ignoreList":[]}

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

@@ -0,0 +1,11 @@
+import type { NavPreferences } from 'payload';
+import React from 'react';
+import type { groupNavItems } from '../../utilities/groupNavItems.js';
+/**
+ * @internal
+ */
+export declare const DefaultNavClient: React.FC<{
+    groups: ReturnType<typeof groupNavItems>;
+    navPreferences: NavPreferences;
+}>;
+//# sourceMappingURL=index.client.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.client.d.ts","sourceRoot":"","sources":["../../../src/elements/Nav/index.client.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAA;AAI7C,OAAO,KAAmB,MAAM,OAAO,CAAA;AAEvC,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,kCAAkC,CAAA;AAUrE;;GAEG;AACH,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC;IACtC,MAAM,EAAE,UAAU,CAAC,OAAO,aAAa,CAAC,CAAA;IACxC,cAAc,EAAE,cAAc,CAAA;CAC/B,CA+DA,CAAA"}

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

@@ -0,0 +1,121 @@
+'use client';
+
+import { c as _c } from "react/compiler-runtime";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { getTranslation } from '@payloadcms/translations';
+import { EntityType, formatAdminURL } from 'payload/shared';
+import React, { Fragment } from 'react';
+import { useConfig } from '../../providers/Config/index.js';
+import { usePathname } from '../../providers/RouterAdapter/index.js';
+import { useTranslation } from '../../providers/Translation/index.js';
+import { Link } from '../Link/index.js';
+import { NavGroup } from '../NavGroup/index.js';
+const baseClass = 'nav';
+/**
+ * @internal
+ */
+export const DefaultNavClient = t0 => {
+  const $ = _c(11);
+  const {
+    groups,
+    navPreferences
+  } = t0;
+  const pathname = usePathname();
+  const {
+    config: t1
+  } = useConfig();
+  const {
+    routes: t2
+  } = t1;
+  const {
+    admin: adminRoute
+  } = t2;
+  const {
+    i18n
+  } = useTranslation();
+  let t3;
+  if ($[0] !== adminRoute || $[1] !== groups || $[2] !== i18n || $[3] !== navPreferences?.groups || $[4] !== pathname) {
+    let t4;
+    if ($[6] !== adminRoute || $[7] !== i18n || $[8] !== navPreferences?.groups || $[9] !== pathname) {
+      t4 = (t5, key) => {
+        const {
+          entities,
+          label
+        } = t5;
+        return _jsx(NavGroup, {
+          isOpen: navPreferences?.groups?.[label]?.open,
+          label,
+          children: entities.map((t6, i) => {
+            const {
+              slug,
+              type,
+              label: label_0
+            } = t6;
+            let href;
+            let id;
+            if (type === EntityType.collection) {
+              href = formatAdminURL({
+                adminRoute,
+                path: `/collections/${slug}`
+              });
+              id = `nav-${slug}`;
+            }
+            if (type === EntityType.global) {
+              href = formatAdminURL({
+                adminRoute,
+                path: `/globals/${slug}`
+              });
+              id = `nav-global-${slug}`;
+            }
+            const isActive = pathname.startsWith(href) && ["/", undefined].includes(pathname[href.length]);
+            const linkClass = `${baseClass}__link${isActive ? ` ${baseClass}__link--selected` : ""}`;
+            const Label = _jsx("span", {
+              className: `${baseClass}__link-label`,
+              children: getTranslation(label_0, i18n)
+            });
+            if (pathname === href) {
+              return _jsx("div", {
+                className: `${baseClass}__link-wrapper`,
+                children: _jsx("div", {
+                  className: linkClass,
+                  id,
+                  children: Label
+                })
+              }, i);
+            }
+            return _jsx("div", {
+              className: `${baseClass}__link-wrapper`,
+              children: _jsx(Link, {
+                className: linkClass,
+                href,
+                id,
+                prefetch: false,
+                children: Label
+              })
+            }, i);
+          })
+        }, key);
+      };
+      $[6] = adminRoute;
+      $[7] = i18n;
+      $[8] = navPreferences?.groups;
+      $[9] = pathname;
+      $[10] = t4;
+    } else {
+      t4 = $[10];
+    }
+    t3 = _jsx(Fragment, {
+      children: groups.map(t4)
+    });
+    $[0] = adminRoute;
+    $[1] = groups;
+    $[2] = i18n;
+    $[3] = navPreferences?.groups;
+    $[4] = pathname;
+    $[5] = t3;
+  } else {
+    t3 = $[5];
+  }
+  return t3;
+};
+//# sourceMappingURL=index.client.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.client.js","names":["c","_c","getTranslation","EntityType","formatAdminURL","React","Fragment","useConfig","usePathname","useTranslation","Link","NavGroup","baseClass","DefaultNavClient","t0","$","groups","navPreferences","pathname","config","t1","routes","t2","admin","adminRoute","i18n","t3","t4","t5","key","entities","label","_jsx","isOpen","open","children","map","t6","i","slug","type","label_0","href","id","collection","global","isActive","startsWith","undefined","includes","length","linkClass","Label","className","prefetch"],"sources":["../../../src/elements/Nav/index.client.tsx"],"sourcesContent":["'use client'\n\nimport type { NavPreferences } from 'payload'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport { EntityType, formatAdminURL } from 'payload/shared'\nimport React, { Fragment } from 'react'\n\nimport type { groupNavItems } from '../../utilities/groupNavItems.js'\n\nimport { useConfig } from '../../providers/Config/index.js'\nimport { usePathname } from '../../providers/RouterAdapter/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { Link } from '../Link/index.js'\nimport { NavGroup } from '../NavGroup/index.js'\n\nconst baseClass = 'nav'\n\n/**\n * @internal\n */\nexport const DefaultNavClient: React.FC<{\n  groups: ReturnType<typeof groupNavItems>\n  navPreferences: NavPreferences\n}> = ({ groups, navPreferences }) => {\n  const pathname = usePathname()\n\n  const {\n    config: {\n      routes: { admin: adminRoute },\n    },\n  } = useConfig()\n\n  const { i18n } = useTranslation()\n\n  return (\n    <Fragment>\n      {groups.map(({ entities, label }, key) => {\n        return (\n          <NavGroup isOpen={navPreferences?.groups?.[label]?.open} key={key} label={label}>\n            {entities.map(({ slug, type, label }, i) => {\n              let href: string\n              let id: string\n\n              if (type === EntityType.collection) {\n                href = formatAdminURL({ adminRoute, path: `/collections/${slug}` })\n                id = `nav-${slug}`\n              }\n\n              if (type === EntityType.global) {\n                href = formatAdminURL({ adminRoute, path: `/globals/${slug}` })\n                id = `nav-global-${slug}`\n              }\n\n              const isActive =\n                pathname.startsWith(href) && ['/', undefined].includes(pathname[href.length])\n\n              const linkClass = `${baseClass}__link${isActive ? ` ${baseClass}__link--selected` : ''}`\n\n              const Label = (\n                <span className={`${baseClass}__link-label`}>{getTranslation(label, i18n)}</span>\n              )\n\n              // If the URL matches the link exactly\n              if (pathname === href) {\n                return (\n                  <div className={`${baseClass}__link-wrapper`} key={i}>\n                    <div className={linkClass} id={id}>\n                      {Label}\n                    </div>\n                  </div>\n                )\n              }\n\n              return (\n                <div className={`${baseClass}__link-wrapper`} key={i}>\n                  <Link className={linkClass} href={href} id={id} prefetch={false}>\n                    {Label}\n                  </Link>\n                </div>\n              )\n            })}\n          </NavGroup>\n        )\n      })}\n    </Fragment>\n  )\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/elements/Nav/index.css

@@ -0,0 +1,132 @@
+@layer payload-default {
+  .nav {
+    position: sticky;
+    top: 0;
+    left: 0;
+    flex-shrink: 0;
+    height: 100vh;
+    width: var(--nav-width);
+    border-right: 1px solid var(--color-border);
+    overflow: hidden;
+    --nav-padding-inline-start: var(--spacer-2-5);
+    --nav-padding-inline-end: var(--spacer-2-5);
+    --nav-padding-block-start: var(--spacer-2-5);
+    --nav-padding-block-end: var(--spacer-5);
+  }
+
+  [dir='rtl'] .nav {
+    border-right: none;
+    border-left: 1px solid var(--color-border);
+  }
+
+  .nav__mobile-close {
+    display: none;
+    background: none;
+    border: 0;
+    outline: 0;
+    padding: var(--spacer-3) 0;
+  }
+
+  .nav__scroll {
+    height: 100%;
+    display: flex;
+    flex-direction: column;
+    padding: var(--nav-padding-block-start) var(--nav-padding-inline-end)
+      var(--nav-padding-block-end) var(--nav-padding-inline-start);
+    overflow-y: auto;
+
+    &::-webkit-scrollbar {
+      display: none;
+    }
+  }
+
+  .nav__wrap {
+    width: 100%;
+    display: flex;
+    flex-direction: column;
+    align-items: flex-start;
+    flex-grow: 1;
+  }
+
+  .nav__label {
+    color: var(--color-text-tertiary);
+  }
+
+  .nav__controls {
+    display: flex;
+    flex-direction: column;
+    gap: var(--spacer-2-5);
+    margin-top: auto;
+    margin-bottom: 0;
+
+    > :first-child {
+      margin-top: var(--spacer-3);
+    }
+  }
+
+  .nav__log-out {
+    border-radius: var(--button-radius);
+  }
+
+  .nav__log-out:hover g {
+    transform: translateX(calc(-1 * var(--spacer-1) * 0.5));
+  }
+
+  .nav__link-wrapper {
+    padding-block: var(--spacer-1);
+    width: calc(100% + var(--spacer-1));
+    margin-left: calc(-1 * var(--spacer-1));
+
+    &:first-child {
+      padding-block-start: 0;
+    }
+  }
+
+  .nav__link {
+    display: flex;
+    align-items: center;
+    position: relative;
+    padding-block: var(--spacer-1);
+    padding-inline: var(--spacer-2);
+    text-decoration: none;
+  }
+
+  a.nav__link {
+    border-radius: var(--button-radius);
+
+    &:hover {
+      background: var(--color-bg-secondary);
+      text-decoration: none;
+    }
+  }
+
+  .nav__link--selected {
+    font-weight: 600;
+    border-radius: var(--button-radius);
+    background: var(--color-bg-selected);
+  }
+
+  @media (max-width: 1024px) {
+    .nav__scroll {
+      --nav-padding-inline-start: var(--spacer-2);
+      --nav-padding-inline-end: var(--spacer-2);
+    }
+  }
+
+  @media (max-width: 768px) {
+    .nav__scroll {
+      --nav-padding-inline-start: var(--gutter-h);
+      --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

@@ -0,0 +1,8 @@
+import type { PayloadRequest, ServerProps } from 'payload';
+import React from 'react';
+import './index.css';
+export type NavProps = {
+    req?: PayloadRequest;
+} & ServerProps;
+export declare const DefaultNav: React.FC<NavProps>;
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +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"}

package/dist/elements/Nav/index.js

@@ -0,0 +1,207 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+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';
+/* eslint-enable payload/no-imports-from-exports-dir */
+import { AlignJustifiedIcon } from '../../icons/AlignJustified/index.js';
+import { groupNavItems } from '../../utilities/groupNavItems.js';
+import { RenderServerComponent } from '../RenderServerComponent/index.js';
+import { SidebarTabs } from './SidebarTabs/index.js';
+import './index.css';
+const baseClass = 'nav';
+import { getNavPrefs } from './getNavPrefs.js';
+export const DefaultNav = async props => {
+  const {
+    documentSubViewType,
+    i18n,
+    locale,
+    params,
+    payload,
+    permissions,
+    req,
+    searchParams,
+    user,
+    viewType,
+    visibleEntities
+  } = props;
+  if (!payload?.config) {
+    return null;
+  }
+  const {
+    admin: {
+      components: {
+        afterNav,
+        afterNavLinks,
+        beforeNav,
+        beforeNavLinks,
+        logout,
+        settingsMenu
+      }
+    },
+    collections,
+    globals
+  } = payload.config;
+  // Group collections and globals for nav display
+  // These groups are passed to SidebarTabs -> CollectionsTab to avoid recomputing
+  const groups = groupNavItems([...collections.filter(({
+    slug
+  }) => visibleEntities.collections.includes(slug)).map(collection => ({
+    type: EntityType.collection,
+    entity: collection
+  })), ...globals.filter(({
+    slug
+  }) => visibleEntities.globals.includes(slug)).map(global => ({
+    type: EntityType.global,
+    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,
+      viewType
+    },
+    Component: item,
+    importMap: payload.importMap,
+    key: `settings-menu-item-${index}`,
+    serverProps: {
+      i18n,
+      locale,
+      params,
+      payload,
+      permissions,
+      searchParams,
+      user
+    }
+  })) : [];
+  const RenderedBeforeNav = RenderServerComponent({
+    clientProps: {
+      documentSubViewType,
+      viewType
+    },
+    Component: beforeNav,
+    importMap: payload.importMap,
+    serverProps: {
+      i18n,
+      locale,
+      params,
+      payload,
+      permissions,
+      searchParams,
+      user
+    }
+  });
+  const RenderedBeforeNavLinks = RenderServerComponent({
+    clientProps: {
+      documentSubViewType,
+      viewType
+    },
+    Component: beforeNavLinks,
+    importMap: payload.importMap,
+    serverProps: {
+      i18n,
+      locale,
+      params,
+      payload,
+      permissions,
+      searchParams,
+      user
+    }
+  });
+  const RenderedAfterNavLinks = RenderServerComponent({
+    clientProps: {
+      documentSubViewType,
+      viewType
+    },
+    Component: afterNavLinks,
+    importMap: payload.importMap,
+    serverProps: {
+      i18n,
+      locale,
+      params,
+      payload,
+      permissions,
+      searchParams,
+      user
+    }
+  });
+  const RenderedAfterNav = RenderServerComponent({
+    clientProps: {
+      documentSubViewType,
+      viewType
+    },
+    Component: afterNav,
+    importMap: payload.importMap,
+    serverProps: {
+      i18n,
+      locale,
+      params,
+      payload,
+      permissions,
+      searchParams,
+      user
+    }
+  });
+  // Build the full tabs array, starting with the default nav tab
+  const allTabs = [{
+    slug: 'nav',
+    components: {
+      Content: /*#__PURE__*/_jsxs(_Fragment, {
+        children: [RenderedBeforeNavLinks, /*#__PURE__*/_jsx(DefaultNavClient, {
+          groups: groups,
+          navPreferences: navPreferences
+        }), RenderedAfterNavLinks]
+      }),
+      Icon: /*#__PURE__*/_jsx(AlignJustifiedIcon, {
+        size: 24
+      })
+    },
+    isDefaultActive: true,
+    label: i18n.t('general:collections')
+  }, ...(payload.config.admin?.components?.sidebar?.tabs?.filter(tab => !tab.disabled) || [])];
+  return /*#__PURE__*/_jsxs(NavWrapper, {
+    baseClass: baseClass,
+    children: [RenderedBeforeNav, /*#__PURE__*/_jsxs("nav", {
+      className: `${baseClass}__wrap`,
+      children: [/*#__PURE__*/_jsx(SidebarTabs, {
+        documentSubViewType: documentSubViewType,
+        i18n: i18n,
+        locale: locale,
+        navPreferences: navPreferences,
+        params: params,
+        payload: payload,
+        permissions: permissions,
+        req: req,
+        searchParams: searchParams,
+        server: req?.server,
+        tabs: allTabs,
+        user: user,
+        viewType: viewType
+      }), /*#__PURE__*/_jsxs("div", {
+        className: `${baseClass}__controls`,
+        children: [/*#__PURE__*/_jsx(SettingsMenuButton, {
+          settingsMenu: RenderedSettingsMenu
+        }), LogoutComponent]
+      })]
+    }), RenderedAfterNav]
+  });
+};
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +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":[]}

package/dist/elements/NavGroup/index.css

@@ -28,7 +28,7 @@
     font-size: var(--text-body-medium-strong-font-size);
     font-weight: var(--text-body-medium-strong-font-weight);
     line-height: var(--text-body-medium-strong-line-height);
-    border-radius: var(--radius-medium);
+    border-radius: var(--button-radius);
 
     &:hover,
     &:focus-visible {
@@ -61,8 +61,8 @@
   }
 
   .nav-group--collapsed .collapsible__toggle {
-    border-bottom-right-radius: var(--radius-medium);
-    border-bottom-left-radius: var(--radius-medium);
+    border-bottom-right-radius: var(--button-radius);
+    border-bottom-left-radius: var(--button-radius);
   }
 
   .nav-group--collapsed .nav-group__content {