@payloadcms/ui 3.0.0-canary.cee5702 → 3.0.0-canary.d6053cd

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

@@ -1 +1 @@
-{"version":3,"file":"context.d.ts","sourceRoot":"","sources":["../../../src/elements/Nav/context.tsx"],"names":[],"mappings":"AAGA,OAAO,KAA4B,MAAM,OAAO,CAAA;AAIhD,KAAK,cAAc,GAAG;IACpB,OAAO,EAAE,OAAO,CAAA;IAChB,MAAM,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAA;IAC9C,UAAU,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAA;CACrC,CAAA;AAED,eAAO,MAAM,UAAU,+BAIrB,CAAA;AAEF,eAAO,MAAM,MAAM,sBAAqC,CAAA;AAYxD,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC;IACjC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAC1B,CA8DA,CAAA"}
+{"version":3,"file":"context.d.ts","sourceRoot":"","sources":["../../../src/elements/Nav/context.tsx"],"names":[],"mappings":"AAGA,OAAO,KAA4B,MAAM,OAAO,CAAA;AAIhD,KAAK,cAAc,GAAG;IACpB,OAAO,EAAE,OAAO,CAAA;IAChB,MAAM,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAA;IAC9C,UAAU,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAA;CACrC,CAAA;AAED,eAAO,MAAM,UAAU,+BAIrB,CAAA;AAEF,eAAO,MAAM,MAAM,sBAAqC,CAAA;AAYxD,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC;IACjC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAC1B,CA4DA,CAAA"}

package/dist/elements/Nav/context.js

@@ -1,6 +1,6 @@
 'use client';
 import { jsx as _jsx } from "react/jsx-runtime";
-import * as facelessUIImport from '@faceless-ui/window-info';
+import { useWindowInfo } from '@faceless-ui/window-info';
 import { clearAllBodyScrollLocks, disableBodyScroll, enableBodyScroll } from 'body-scroll-lock';
 import React, { useEffect, useRef } from 'react';
 import { usePreferences } from '../../providers/Preferences/index.js';
@@ -20,7 +20,6 @@ const getNavPreference = async (getPreference)=>{
     }
 };
 export const NavProvider = ({ children })=>{
-    const { useWindowInfo } = facelessUIImport;
     const { breakpoints: { l: largeBreak, m: midBreak, s: smallBreak } } = useWindowInfo();
     const { getPreference } = usePreferences();
     const navRef = useRef(null);

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/Nav/context.tsx"],"sourcesContent":["'use client'\nimport * as facelessUIImport from '@faceless-ui/window-info'\nimport { clearAllBodyScrollLocks, disableBodyScroll, enableBodyScroll } from 'body-scroll-lock'\nimport React, { useEffect, useRef } from 'react'\n\nimport { usePreferences } from '../../providers/Preferences/index.js'\n\ntype NavContextType = {\n  navOpen: boolean\n  navRef: React.RefObject<HTMLDivElement | null>\n  setNavOpen: (value: boolean) => void\n}\n\nexport const NavContext = React.createContext<NavContextType>({\n  navOpen: true,\n  navRef: null,\n  setNavOpen: () => {},\n})\n\nexport const useNav = () => React.useContext(NavContext)\n\nconst getNavPreference = async (getPreference): Promise<boolean> => {\n  const navPrefs = await getPreference('nav')\n  const preferredState = navPrefs?.open\n  if (typeof preferredState === 'boolean') {\n    return preferredState\n  } else {\n    return true\n  }\n}\n\nexport const NavProvider: React.FC<{\n  children: React.ReactNode\n}> = ({ children }) => {\n  const { useWindowInfo } = facelessUIImport\n\n  const {\n    breakpoints: { l: largeBreak, m: midBreak, s: smallBreak },\n  } = useWindowInfo()\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(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      setNavFromPreferences() // eslint-disable-line @typescript-eslint/no-floating-promises\n    }\n  }, [largeBreak, getPreference, setNavOpen])\n\n  // TODO: on smaller screens where the nav is a modal\n  // close the nav when the user navigates away\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        disableBodyScroll(navRef.current)\n      } else {\n        enableBodyScroll(navRef.current)\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 === false || midBreak === false || smallBreak === false) {\n      setNavOpen(false)\n    }\n  }, [largeBreak, midBreak, smallBreak])\n\n  // when the component unmounts, clear all body scroll locks\n  useEffect(() => {\n    return () => {\n      clearAllBodyScrollLocks()\n    }\n  }, [])\n\n  return (\n    <NavContext.Provider value={{ navOpen, navRef, setNavOpen }}>{children}</NavContext.Provider>\n  )\n}\n"],"names":["facelessUIImport","clearAllBodyScrollLocks","disableBodyScroll","enableBodyScroll","React","useEffect","useRef","usePreferences","NavContext","createContext","navOpen","navRef","setNavOpen","useNav","useContext","getNavPreference","getPreference","navPrefs","preferredState","open","NavProvider","children","useWindowInfo","breakpoints","l","largeBreak","m","midBreak","s","smallBreak","useState","setNavFromPreferences","current","Provider","value"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;;AACA,YAAYA,sBAAsB,2BAA0B;AAC5D,SAASC,uBAAuB,EAAEC,iBAAiB,EAAEC,gBAAgB,QAAQ,mBAAkB;AAC/F,OAAOC,SAASC,SAAS,EAAEC,MAAM,QAAQ,QAAO;AAEhD,SAASC,cAAc,QAAQ,uCAAsC;AAQrE,OAAO,MAAMC,2BAAaJ,MAAMK,aAAa,CAAiB;IAC5DC,SAAS;IACTC,QAAQ;IACRC,YAAY,KAAO;AACrB,GAAE;AAEF,OAAO,MAAMC,SAAS,IAAMT,MAAMU,UAAU,CAACN,YAAW;AAExD,MAAMO,mBAAmB,OAAOC;IAC9B,MAAMC,WAAW,MAAMD,cAAc;IACrC,MAAME,iBAAiBD,UAAUE;IACjC,IAAI,OAAOD,mBAAmB,WAAW;QACvC,OAAOA;IACT,OAAO;QACL,OAAO;IACT;AACF;AAEA,OAAO,MAAME,cAER,CAAC,EAAEC,QAAQ,EAAE;IAChB,MAAM,EAAEC,aAAa,EAAE,GAAGtB;IAE1B,MAAM,EACJuB,aAAa,EAAEC,GAAGC,UAAU,EAAEC,GAAGC,QAAQ,EAAEC,GAAGC,UAAU,EAAE,EAC3D,GAAGP;IAEJ,MAAM,EAAEN,aAAa,EAAE,GAAGT;IAC1B,MAAMI,SAASL,OAAO;IAEtB,kCAAkC;IAClC,kDAAkD;IAClD,0DAA0D;IAC1D,iDAAiD;IACjD,MAAM,CAACI,SAASE,WAAW,GAAGR,MAAM0B,QAAQ,CAAC;IAE7C,8DAA8D;IAC9DzB,UAAU;QACR,IAAIoB,eAAe,OAAO;YACxB,MAAMM,wBAAwB;gBAC5B,MAAMb,iBAAiB,MAAMH,iBAAiBC;gBAC9CJ,WAAWM;YACb;YAEAa,wBAAwB,8DAA8D;;QACxF;IACF,GAAG;QAACN;QAAYT;QAAeJ;KAAW;IAE1C,oDAAoD;IACpD,6CAA6C;IAE7C,0CAA0C;IAC1C,wDAAwD;IACxDP,UAAU;QACR,IAAIM,OAAOqB,OAAO,EAAE;YAClB,IAAItB,WAAWiB,UAAU;gBACvBzB,kBAAkBS,OAAOqB,OAAO;YAClC,OAAO;gBACL7B,iBAAiBQ,OAAOqB,OAAO;YACjC;QACF;IACF,GAAG;QAACtB;QAASiB;KAAS;IAEtB,8CAA8C;IAC9C,qDAAqD;IACrD,mCAAmC;IACnCtB,UAAU;QACR,IAAIoB,eAAe,SAASE,aAAa,SAASE,eAAe,OAAO;YACtEjB,WAAW;QACb;IACF,GAAG;QAACa;QAAYE;QAAUE;KAAW;IAErC,2DAA2D;IAC3DxB,UAAU;QACR,OAAO;YACLJ;QACF;IACF,GAAG,EAAE;IAEL,qBACE,KAACO,WAAWyB,QAAQ;QAACC,OAAO;YAAExB;YAASC;YAAQC;QAAW;kBAAIS;;AAElE,EAAC"}
+{"version":3,"sources":["../../../src/elements/Nav/context.tsx"],"sourcesContent":["'use client'\nimport { useWindowInfo } from '@faceless-ui/window-info'\nimport { clearAllBodyScrollLocks, disableBodyScroll, enableBodyScroll } from 'body-scroll-lock'\nimport React, { useEffect, useRef } from 'react'\n\nimport { usePreferences } from '../../providers/Preferences/index.js'\n\ntype NavContextType = {\n  navOpen: boolean\n  navRef: React.RefObject<HTMLDivElement | null>\n  setNavOpen: (value: boolean) => void\n}\n\nexport const NavContext = React.createContext<NavContextType>({\n  navOpen: true,\n  navRef: null,\n  setNavOpen: () => {},\n})\n\nexport const useNav = () => React.useContext(NavContext)\n\nconst getNavPreference = async (getPreference): Promise<boolean> => {\n  const navPrefs = await getPreference('nav')\n  const preferredState = navPrefs?.open\n  if (typeof preferredState === 'boolean') {\n    return preferredState\n  } else {\n    return true\n  }\n}\n\nexport const NavProvider: React.FC<{\n  children: React.ReactNode\n}> = ({ children }) => {\n  const {\n    breakpoints: { l: largeBreak, m: midBreak, s: smallBreak },\n  } = useWindowInfo()\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(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      setNavFromPreferences() // eslint-disable-line @typescript-eslint/no-floating-promises\n    }\n  }, [largeBreak, getPreference, setNavOpen])\n\n  // TODO: on smaller screens where the nav is a modal\n  // close the nav when the user navigates away\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        disableBodyScroll(navRef.current)\n      } else {\n        enableBodyScroll(navRef.current)\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 === false || midBreak === false || smallBreak === false) {\n      setNavOpen(false)\n    }\n  }, [largeBreak, midBreak, smallBreak])\n\n  // when the component unmounts, clear all body scroll locks\n  useEffect(() => {\n    return () => {\n      clearAllBodyScrollLocks()\n    }\n  }, [])\n\n  return (\n    <NavContext.Provider value={{ navOpen, navRef, setNavOpen }}>{children}</NavContext.Provider>\n  )\n}\n"],"names":["useWindowInfo","clearAllBodyScrollLocks","disableBodyScroll","enableBodyScroll","React","useEffect","useRef","usePreferences","NavContext","createContext","navOpen","navRef","setNavOpen","useNav","useContext","getNavPreference","getPreference","navPrefs","preferredState","open","NavProvider","children","breakpoints","l","largeBreak","m","midBreak","s","smallBreak","useState","setNavFromPreferences","current","Provider","value"],"mappings":"AAAA;;AACA,SAASA,aAAa,QAAQ,2BAA0B;AACxD,SAASC,uBAAuB,EAAEC,iBAAiB,EAAEC,gBAAgB,QAAQ,mBAAkB;AAC/F,OAAOC,SAASC,SAAS,EAAEC,MAAM,QAAQ,QAAO;AAEhD,SAASC,cAAc,QAAQ,uCAAsC;AAQrE,OAAO,MAAMC,2BAAaJ,MAAMK,aAAa,CAAiB;IAC5DC,SAAS;IACTC,QAAQ;IACRC,YAAY,KAAO;AACrB,GAAE;AAEF,OAAO,MAAMC,SAAS,IAAMT,MAAMU,UAAU,CAACN,YAAW;AAExD,MAAMO,mBAAmB,OAAOC;IAC9B,MAAMC,WAAW,MAAMD,cAAc;IACrC,MAAME,iBAAiBD,UAAUE;IACjC,IAAI,OAAOD,mBAAmB,WAAW;QACvC,OAAOA;IACT,OAAO;QACL,OAAO;IACT;AACF;AAEA,OAAO,MAAME,cAER,CAAC,EAAEC,QAAQ,EAAE;IAChB,MAAM,EACJC,aAAa,EAAEC,GAAGC,UAAU,EAAEC,GAAGC,QAAQ,EAAEC,GAAGC,UAAU,EAAE,EAC3D,GAAG5B;IAEJ,MAAM,EAAEgB,aAAa,EAAE,GAAGT;IAC1B,MAAMI,SAASL,OAAO;IAEtB,kCAAkC;IAClC,kDAAkD;IAClD,0DAA0D;IAC1D,iDAAiD;IACjD,MAAM,CAACI,SAASE,WAAW,GAAGR,MAAMyB,QAAQ,CAAC;IAE7C,8DAA8D;IAC9DxB,UAAU;QACR,IAAImB,eAAe,OAAO;YACxB,MAAMM,wBAAwB;gBAC5B,MAAMZ,iBAAiB,MAAMH,iBAAiBC;gBAC9CJ,WAAWM;YACb;YAEAY,wBAAwB,8DAA8D;;QACxF;IACF,GAAG;QAACN;QAAYR;QAAeJ;KAAW;IAE1C,oDAAoD;IACpD,6CAA6C;IAE7C,0CAA0C;IAC1C,wDAAwD;IACxDP,UAAU;QACR,IAAIM,OAAOoB,OAAO,EAAE;YAClB,IAAIrB,WAAWgB,UAAU;gBACvBxB,kBAAkBS,OAAOoB,OAAO;YAClC,OAAO;gBACL5B,iBAAiBQ,OAAOoB,OAAO;YACjC;QACF;IACF,GAAG;QAACrB;QAASgB;KAAS;IAEtB,8CAA8C;IAC9C,qDAAqD;IACrD,mCAAmC;IACnCrB,UAAU;QACR,IAAImB,eAAe,SAASE,aAAa,SAASE,eAAe,OAAO;YACtEhB,WAAW;QACb;IACF,GAAG;QAACY;QAAYE;QAAUE;KAAW;IAErC,2DAA2D;IAC3DvB,UAAU;QACR,OAAO;YACLJ;QACF;IACF,GAAG,EAAE;IAEL,qBACE,KAACO,WAAWwB,QAAQ;QAACC,OAAO;YAAEvB;YAASC;YAAQC;QAAW;kBAAIS;;AAElE,EAAC"}

package/dist/elements/NavGroup/index.js

@@ -2,9 +2,10 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React, { useEffect, useState } from 'react';
 import AnimateHeightImport from 'react-animate-height';
-import { Chevron } from '../../icons/Chevron/index.js';
+import { ChevronIcon } from '../../icons/Chevron/index.js';
 import { usePreferences } from '../../providers/Preferences/index.js';
 import { useNav } from '../Nav/context.js';
+import './index.scss';
 const AnimateHeight = AnimateHeightImport.default || AnimateHeightImport;
 const baseClass = 'nav-group';
 export const NavGroup = ({ children, label })=>{
@@ -61,7 +62,7 @@ export const NavGroup = ({ children, label })=>{
                         }),
                         /*#__PURE__*/ _jsx("div", {
                             className: `${baseClass}__indicator`,
-                            children: /*#__PURE__*/ _jsx(Chevron, {
+                            children: /*#__PURE__*/ _jsx(ChevronIcon, {
                                 className: `${baseClass}__indicator`,
                                 direction: !collapsed ? 'up' : undefined
                             })

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/NavGroup/index.tsx"],"sourcesContent":["'use client'\nimport React, { useEffect, useState } from 'react'\nimport AnimateHeightImport from 'react-animate-height'\n\nimport { Chevron } from '../../icons/Chevron/index.js'\nimport { usePreferences } from '../../providers/Preferences/index.js'\nimport { useNav } from '../Nav/context.js'\nimport './index.scss'\n\nconst AnimateHeight = (AnimateHeightImport.default ||\n  AnimateHeightImport) as typeof AnimateHeightImport.default\n\nconst baseClass = 'nav-group'\n\ntype Props = {\n  children: React.ReactNode\n  label: string\n}\n\nexport const NavGroup: React.FC<Props> = ({ children, label }) => {\n  const [collapsed, setCollapsed] = useState(true)\n  const [animate, setAnimate] = useState(false)\n  const { getPreference, setPreference } = usePreferences()\n  const { navOpen } = useNav()\n\n  const preferencesKey = `collapsed-${label}-groups`\n\n  useEffect(() => {\n    if (label) {\n      const setCollapsedFromPreferences = async () => {\n        const preferences = (await getPreference(preferencesKey)) || []\n        setCollapsed(preferences.indexOf(label) !== -1)\n      }\n      void setCollapsedFromPreferences()\n    }\n  }, [getPreference, label, preferencesKey])\n\n  if (label) {\n    const toggleCollapsed = async () => {\n      setAnimate(true)\n      let preferences: string[] = (await getPreference(preferencesKey)) || []\n      if (collapsed) {\n        preferences = preferences.filter((preference) => label !== preference)\n      } else {\n        preferences.push(label)\n      }\n      void setPreference(preferencesKey, preferences)\n      setCollapsed(!collapsed)\n    }\n\n    return (\n      <div\n        className={[`${baseClass}`, `${label}`, collapsed && `${baseClass}--collapsed`]\n          .filter(Boolean)\n          .join(' ')}\n        id={`nav-group-${label}`}\n      >\n        <button\n          className={[\n            `${baseClass}__toggle`,\n            `${baseClass}__toggle--${collapsed ? 'collapsed' : 'open'}`,\n          ]\n            .filter(Boolean)\n            .join(' ')}\n          onClick={toggleCollapsed}\n          tabIndex={!navOpen ? -1 : 0}\n          type=\"button\"\n        >\n          <div className={`${baseClass}__label`}>{label}</div>\n          <div className={`${baseClass}__indicator`}>\n            <Chevron\n              className={`${baseClass}__indicator`}\n              direction={!collapsed ? 'up' : undefined}\n            />\n          </div>\n        </button>\n        <AnimateHeight duration={animate ? 200 : 0} height={collapsed ? 0 : 'auto'}>\n          <div className={`${baseClass}__content`}>{children}</div>\n        </AnimateHeight>\n      </div>\n    )\n  }\n\n  return <React.Fragment>{children}</React.Fragment>\n}\n"],"names":["React","useEffect","useState","AnimateHeightImport","Chevron","usePreferences","useNav","AnimateHeight","default","baseClass","NavGroup","children","label","collapsed","setCollapsed","animate","setAnimate","getPreference","setPreference","navOpen","preferencesKey","setCollapsedFromPreferences","preferences","indexOf","toggleCollapsed","filter","preference","push","div","className","Boolean","join","id","button","onClick","tabIndex","type","direction","undefined","duration","height","Fragment"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;;AACA,OAAOA,SAASC,SAAS,EAAEC,QAAQ,QAAQ,QAAO;AAClD,OAAOC,yBAAyB,uBAAsB;AAEtD,SAASC,OAAO,QAAQ,+BAA8B;AACtD,SAASC,cAAc,QAAQ,uCAAsC;AACrE,SAASC,MAAM,QAAQ,oBAAmB;AAG1C,MAAMC,gBAAiBJ,oBAAoBK,OAAO,IAChDL;AAEF,MAAMM,YAAY;AAOlB,OAAO,MAAMC,WAA4B,CAAC,EAAEC,QAAQ,EAAEC,KAAK,EAAE;IAC3D,MAAM,CAACC,WAAWC,aAAa,GAAGZ,SAAS;IAC3C,MAAM,CAACa,SAASC,WAAW,GAAGd,SAAS;IACvC,MAAM,EAAEe,aAAa,EAAEC,aAAa,EAAE,GAAGb;IACzC,MAAM,EAAEc,OAAO,EAAE,GAAGb;IAEpB,MAAMc,iBAAiB,CAAC,UAAU,EAAER,MAAM,OAAO,CAAC;IAElDX,UAAU;QACR,IAAIW,OAAO;YACT,MAAMS,8BAA8B;gBAClC,MAAMC,cAAc,AAAC,MAAML,cAAcG,mBAAoB,EAAE;gBAC/DN,aAAaQ,YAAYC,OAAO,CAACX,WAAW,CAAC;YAC/C;YACA,KAAKS;QACP;IACF,GAAG;QAACJ;QAAeL;QAAOQ;KAAe;IAEzC,IAAIR,OAAO;QACT,MAAMY,kBAAkB;YACtBR,WAAW;YACX,IAAIM,cAAwB,AAAC,MAAML,cAAcG,mBAAoB,EAAE;YACvE,IAAIP,WAAW;gBACbS,cAAcA,YAAYG,MAAM,CAAC,CAACC,aAAed,UAAUc;YAC7D,OAAO;gBACLJ,YAAYK,IAAI,CAACf;YACnB;YACA,KAAKM,cAAcE,gBAAgBE;YACnCR,aAAa,CAACD;QAChB;QAEA,qBACE,MAACe;YACCC,WAAW;gBAAC,CAAC,EAAEpB,UAAU,CAAC;gBAAE,CAAC,EAAEG,MAAM,CAAC;gBAAEC,aAAa,CAAC,EAAEJ,UAAU,WAAW,CAAC;aAAC,CAC5EgB,MAAM,CAACK,SACPC,IAAI,CAAC;YACRC,IAAI,CAAC,UAAU,EAAEpB,MAAM,CAAC;;8BAExB,MAACqB;oBACCJ,WAAW;wBACT,CAAC,EAAEpB,UAAU,QAAQ,CAAC;wBACtB,CAAC,EAAEA,UAAU,UAAU,EAAEI,YAAY,cAAc,OAAO,CAAC;qBAC5D,CACEY,MAAM,CAACK,SACPC,IAAI,CAAC;oBACRG,SAASV;oBACTW,UAAU,CAAChB,UAAU,CAAC,IAAI;oBAC1BiB,MAAK;;sCAEL,KAACR;4BAAIC,WAAW,CAAC,EAAEpB,UAAU,OAAO,CAAC;sCAAGG;;sCACxC,KAACgB;4BAAIC,WAAW,CAAC,EAAEpB,UAAU,WAAW,CAAC;sCACvC,cAAA,KAACL;gCACCyB,WAAW,CAAC,EAAEpB,UAAU,WAAW,CAAC;gCACpC4B,WAAW,CAACxB,YAAY,OAAOyB;;;;;8BAIrC,KAAC/B;oBAAcgC,UAAUxB,UAAU,MAAM;oBAAGyB,QAAQ3B,YAAY,IAAI;8BAClE,cAAA,KAACe;wBAAIC,WAAW,CAAC,EAAEpB,UAAU,SAAS,CAAC;kCAAGE;;;;;IAIlD;IAEA,qBAAO,KAACX,MAAMyC,QAAQ;kBAAE9B;;AAC1B,EAAC"}
+{"version":3,"sources":["../../../src/elements/NavGroup/index.tsx"],"sourcesContent":["'use client'\nimport React, { useEffect, useState } from 'react'\nimport AnimateHeightImport from 'react-animate-height'\n\nimport { ChevronIcon } from '../../icons/Chevron/index.js'\nimport { usePreferences } from '../../providers/Preferences/index.js'\nimport { useNav } from '../Nav/context.js'\nimport './index.scss'\n\nconst AnimateHeight = (AnimateHeightImport.default ||\n  AnimateHeightImport) as typeof AnimateHeightImport.default\n\nconst baseClass = 'nav-group'\n\ntype Props = {\n  children: React.ReactNode\n  label: string\n}\n\nexport const NavGroup: React.FC<Props> = ({ children, label }) => {\n  const [collapsed, setCollapsed] = useState(true)\n  const [animate, setAnimate] = useState(false)\n  const { getPreference, setPreference } = usePreferences()\n  const { navOpen } = useNav()\n\n  const preferencesKey = `collapsed-${label}-groups`\n\n  useEffect(() => {\n    if (label) {\n      const setCollapsedFromPreferences = async () => {\n        const preferences = (await getPreference(preferencesKey)) || []\n        setCollapsed(preferences.indexOf(label) !== -1)\n      }\n      void setCollapsedFromPreferences()\n    }\n  }, [getPreference, label, preferencesKey])\n\n  if (label) {\n    const toggleCollapsed = async () => {\n      setAnimate(true)\n      let preferences: string[] = (await getPreference(preferencesKey)) || []\n      if (collapsed) {\n        preferences = preferences.filter((preference) => label !== preference)\n      } else {\n        preferences.push(label)\n      }\n      void setPreference(preferencesKey, preferences)\n      setCollapsed(!collapsed)\n    }\n\n    return (\n      <div\n        className={[`${baseClass}`, `${label}`, collapsed && `${baseClass}--collapsed`]\n          .filter(Boolean)\n          .join(' ')}\n        id={`nav-group-${label}`}\n      >\n        <button\n          className={[\n            `${baseClass}__toggle`,\n            `${baseClass}__toggle--${collapsed ? 'collapsed' : 'open'}`,\n          ]\n            .filter(Boolean)\n            .join(' ')}\n          onClick={toggleCollapsed}\n          tabIndex={!navOpen ? -1 : 0}\n          type=\"button\"\n        >\n          <div className={`${baseClass}__label`}>{label}</div>\n          <div className={`${baseClass}__indicator`}>\n            <ChevronIcon\n              className={`${baseClass}__indicator`}\n              direction={!collapsed ? 'up' : undefined}\n            />\n          </div>\n        </button>\n        <AnimateHeight duration={animate ? 200 : 0} height={collapsed ? 0 : 'auto'}>\n          <div className={`${baseClass}__content`}>{children}</div>\n        </AnimateHeight>\n      </div>\n    )\n  }\n\n  return <React.Fragment>{children}</React.Fragment>\n}\n"],"names":["React","useEffect","useState","AnimateHeightImport","ChevronIcon","usePreferences","useNav","AnimateHeight","default","baseClass","NavGroup","children","label","collapsed","setCollapsed","animate","setAnimate","getPreference","setPreference","navOpen","preferencesKey","setCollapsedFromPreferences","preferences","indexOf","toggleCollapsed","filter","preference","push","div","className","Boolean","join","id","button","onClick","tabIndex","type","direction","undefined","duration","height","Fragment"],"mappings":"AAAA;;AACA,OAAOA,SAASC,SAAS,EAAEC,QAAQ,QAAQ,QAAO;AAClD,OAAOC,yBAAyB,uBAAsB;AAEtD,SAASC,WAAW,QAAQ,+BAA8B;AAC1D,SAASC,cAAc,QAAQ,uCAAsC;AACrE,SAASC,MAAM,QAAQ,oBAAmB;AAC1C,OAAO,eAAc;AAErB,MAAMC,gBAAiBJ,oBAAoBK,OAAO,IAChDL;AAEF,MAAMM,YAAY;AAOlB,OAAO,MAAMC,WAA4B,CAAC,EAAEC,QAAQ,EAAEC,KAAK,EAAE;IAC3D,MAAM,CAACC,WAAWC,aAAa,GAAGZ,SAAS;IAC3C,MAAM,CAACa,SAASC,WAAW,GAAGd,SAAS;IACvC,MAAM,EAAEe,aAAa,EAAEC,aAAa,EAAE,GAAGb;IACzC,MAAM,EAAEc,OAAO,EAAE,GAAGb;IAEpB,MAAMc,iBAAiB,CAAC,UAAU,EAAER,MAAM,OAAO,CAAC;IAElDX,UAAU;QACR,IAAIW,OAAO;YACT,MAAMS,8BAA8B;gBAClC,MAAMC,cAAc,AAAC,MAAML,cAAcG,mBAAoB,EAAE;gBAC/DN,aAAaQ,YAAYC,OAAO,CAACX,WAAW,CAAC;YAC/C;YACA,KAAKS;QACP;IACF,GAAG;QAACJ;QAAeL;QAAOQ;KAAe;IAEzC,IAAIR,OAAO;QACT,MAAMY,kBAAkB;YACtBR,WAAW;YACX,IAAIM,cAAwB,AAAC,MAAML,cAAcG,mBAAoB,EAAE;YACvE,IAAIP,WAAW;gBACbS,cAAcA,YAAYG,MAAM,CAAC,CAACC,aAAed,UAAUc;YAC7D,OAAO;gBACLJ,YAAYK,IAAI,CAACf;YACnB;YACA,KAAKM,cAAcE,gBAAgBE;YACnCR,aAAa,CAACD;QAChB;QAEA,qBACE,MAACe;YACCC,WAAW;gBAAC,CAAC,EAAEpB,UAAU,CAAC;gBAAE,CAAC,EAAEG,MAAM,CAAC;gBAAEC,aAAa,CAAC,EAAEJ,UAAU,WAAW,CAAC;aAAC,CAC5EgB,MAAM,CAACK,SACPC,IAAI,CAAC;YACRC,IAAI,CAAC,UAAU,EAAEpB,MAAM,CAAC;;8BAExB,MAACqB;oBACCJ,WAAW;wBACT,CAAC,EAAEpB,UAAU,QAAQ,CAAC;wBACtB,CAAC,EAAEA,UAAU,UAAU,EAAEI,YAAY,cAAc,OAAO,CAAC;qBAC5D,CACEY,MAAM,CAACK,SACPC,IAAI,CAAC;oBACRG,SAASV;oBACTW,UAAU,CAAChB,UAAU,CAAC,IAAI;oBAC1BiB,MAAK;;sCAEL,KAACR;4BAAIC,WAAW,CAAC,EAAEpB,UAAU,OAAO,CAAC;sCAAGG;;sCACxC,KAACgB;4BAAIC,WAAW,CAAC,EAAEpB,UAAU,WAAW,CAAC;sCACvC,cAAA,KAACL;gCACCyB,WAAW,CAAC,EAAEpB,UAAU,WAAW,CAAC;gCACpC4B,WAAW,CAACxB,YAAY,OAAOyB;;;;;8BAIrC,KAAC/B;oBAAcgC,UAAUxB,UAAU,MAAM;oBAAGyB,QAAQ3B,YAAY,IAAI;8BAClE,cAAA,KAACe;wBAAIC,WAAW,CAAC,EAAEpB,UAAU,SAAS,CAAC;kCAAGE;;;;;IAIlD;IAEA,qBAAO,KAACX,MAAMyC,QAAQ;kBAAE9B;;AAC1B,EAAC"}

package/dist/elements/Pagination/ClickableArrow/index.js

@@ -1,7 +1,8 @@
 'use client';
 import { jsx as _jsx } from "react/jsx-runtime";
 import React from 'react';
-import { Chevron } from '../../../icons/Chevron/index.js';
+import { ChevronIcon } from '../../../icons/Chevron/index.js';
+import './index.scss';
 const baseClass = 'clickable-arrow';
 export const ClickableArrow = (props)=>{
     const { direction = 'right', isDisabled = false, updatePage } = props;
@@ -15,7 +16,7 @@ export const ClickableArrow = (props)=>{
         disabled: isDisabled,
         onClick: !isDisabled ? updatePage : undefined,
         type: "button",
-        children: /*#__PURE__*/ _jsx(Chevron, {})
+        children: /*#__PURE__*/ _jsx(ChevronIcon, {})
     });
 };
 

package/dist/elements/Pagination/ClickableArrow/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/elements/Pagination/ClickableArrow/index.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\n\nimport { Chevron } from '../../../icons/Chevron/index.js'\nimport './index.scss'\n\nconst baseClass = 'clickable-arrow'\n\nexport type ClickableArrowProps = {\n  direction?: 'left' | 'right'\n  isDisabled?: boolean\n  updatePage?: () => void\n}\n\nexport const ClickableArrow: React.FC<ClickableArrowProps> = (props) => {\n  const { direction = 'right', isDisabled = false, updatePage } = props\n\n  const classes = [\n    baseClass,\n    isDisabled && `${baseClass}--is-disabled`,\n    direction && `${baseClass}--${direction}`,\n  ]\n    .filter(Boolean)\n    .join(' ')\n\n  return (\n    <button\n      className={classes}\n      disabled={isDisabled}\n      onClick={!isDisabled ? updatePage : undefined}\n      type=\"button\"\n    >\n      <Chevron />\n    </button>\n  )\n}\n"],"names":["React","Chevron","baseClass","ClickableArrow","props","direction","isDisabled","updatePage","classes","filter","Boolean","join","button","className","disabled","onClick","undefined","type"],"rangeMappings":";;;;;;;;;;;;;;;;;;;","mappings":"AAAA;;AACA,OAAOA,WAAW,QAAO;AAEzB,SAASC,OAAO,QAAQ,kCAAiC;AAGzD,MAAMC,YAAY;AAQlB,OAAO,MAAMC,iBAAgD,CAACC;IAC5D,MAAM,EAAEC,YAAY,OAAO,EAAEC,aAAa,KAAK,EAAEC,UAAU,EAAE,GAAGH;IAEhE,MAAMI,UAAU;QACdN;QACAI,cAAc,CAAC,EAAEJ,UAAU,aAAa,CAAC;QACzCG,aAAa,CAAC,EAAEH,UAAU,EAAE,EAAEG,UAAU,CAAC;KAC1C,CACEI,MAAM,CAACC,SACPC,IAAI,CAAC;IAER,qBACE,KAACC;QACCC,WAAWL;QACXM,UAAUR;QACVS,SAAS,CAACT,aAAaC,aAAaS;QACpCC,MAAK;kBAEL,cAAA,KAAChB;;AAGP,EAAC"}
+{"version":3,"sources":["../../../../src/elements/Pagination/ClickableArrow/index.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\n\nimport { ChevronIcon } from '../../../icons/Chevron/index.js'\nimport './index.scss'\n\nconst baseClass = 'clickable-arrow'\n\nexport type ClickableArrowProps = {\n  direction?: 'left' | 'right'\n  isDisabled?: boolean\n  updatePage?: () => void\n}\n\nexport const ClickableArrow: React.FC<ClickableArrowProps> = (props) => {\n  const { direction = 'right', isDisabled = false, updatePage } = props\n\n  const classes = [\n    baseClass,\n    isDisabled && `${baseClass}--is-disabled`,\n    direction && `${baseClass}--${direction}`,\n  ]\n    .filter(Boolean)\n    .join(' ')\n\n  return (\n    <button\n      className={classes}\n      disabled={isDisabled}\n      onClick={!isDisabled ? updatePage : undefined}\n      type=\"button\"\n    >\n      <ChevronIcon />\n    </button>\n  )\n}\n"],"names":["React","ChevronIcon","baseClass","ClickableArrow","props","direction","isDisabled","updatePage","classes","filter","Boolean","join","button","className","disabled","onClick","undefined","type"],"mappings":"AAAA;;AACA,OAAOA,WAAW,QAAO;AAEzB,SAASC,WAAW,QAAQ,kCAAiC;AAC7D,OAAO,eAAc;AAErB,MAAMC,YAAY;AAQlB,OAAO,MAAMC,iBAAgD,CAACC;IAC5D,MAAM,EAAEC,YAAY,OAAO,EAAEC,aAAa,KAAK,EAAEC,UAAU,EAAE,GAAGH;IAEhE,MAAMI,UAAU;QACdN;QACAI,cAAc,CAAC,EAAEJ,UAAU,aAAa,CAAC;QACzCG,aAAa,CAAC,EAAEH,UAAU,EAAE,EAAEG,UAAU,CAAC;KAC1C,CACEI,MAAM,CAACC,SACPC,IAAI,CAAC;IAER,qBACE,KAACC;QACCC,WAAWL;QACXM,UAAUR;QACVS,SAAS,CAACT,aAAaC,aAAaS;QACpCC,MAAK;kBAEL,cAAA,KAAChB;;AAGP,EAAC"}

package/dist/elements/Pagination/Page/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/elements/Pagination/Page/index.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\n\nexport type PageProps = {\n  isCurrent?: boolean\n  isFirstPage?: boolean\n  isLastPage?: boolean\n  page?: number\n  updatePage?: (page) => void\n}\n\nconst baseClass = 'paginator__page'\n\nexport const Page: React.FC<PageProps> = ({\n  isCurrent,\n  isFirstPage = false,\n  isLastPage = false,\n  page = 1,\n  updatePage,\n}) => {\n  const classes = [\n    baseClass,\n    isCurrent && `${baseClass}--is-current`,\n    isFirstPage && `${baseClass}--is-first-page`,\n    isLastPage && `${baseClass}--is-last-page`,\n  ]\n    .filter(Boolean)\n    .join(' ')\n\n  return (\n    <button className={classes} onClick={() => updatePage(page)} type=\"button\">\n      {page}\n    </button>\n  )\n}\n"],"names":["React","baseClass","Page","isCurrent","isFirstPage","isLastPage","page","updatePage","classes","filter","Boolean","join","button","className","onClick","type"],"rangeMappings":";;;;;;;;;;;;;;;;;","mappings":"AAAA;;AACA,OAAOA,WAAW,QAAO;AAUzB,MAAMC,YAAY;AAElB,OAAO,MAAMC,OAA4B,CAAC,EACxCC,SAAS,EACTC,cAAc,KAAK,EACnBC,aAAa,KAAK,EAClBC,OAAO,CAAC,EACRC,UAAU,EACX;IACC,MAAMC,UAAU;QACdP;QACAE,aAAa,CAAC,EAAEF,UAAU,YAAY,CAAC;QACvCG,eAAe,CAAC,EAAEH,UAAU,eAAe,CAAC;QAC5CI,cAAc,CAAC,EAAEJ,UAAU,cAAc,CAAC;KAC3C,CACEQ,MAAM,CAACC,SACPC,IAAI,CAAC;IAER,qBACE,KAACC;QAAOC,WAAWL;QAASM,SAAS,IAAMP,WAAWD;QAAOS,MAAK;kBAC/DT;;AAGP,EAAC"}
+{"version":3,"sources":["../../../../src/elements/Pagination/Page/index.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\n\nexport type PageProps = {\n  isCurrent?: boolean\n  isFirstPage?: boolean\n  isLastPage?: boolean\n  page?: number\n  updatePage?: (page) => void\n}\n\nconst baseClass = 'paginator__page'\n\nexport const Page: React.FC<PageProps> = ({\n  isCurrent,\n  isFirstPage = false,\n  isLastPage = false,\n  page = 1,\n  updatePage,\n}) => {\n  const classes = [\n    baseClass,\n    isCurrent && `${baseClass}--is-current`,\n    isFirstPage && `${baseClass}--is-first-page`,\n    isLastPage && `${baseClass}--is-last-page`,\n  ]\n    .filter(Boolean)\n    .join(' ')\n\n  return (\n    <button className={classes} onClick={() => updatePage(page)} type=\"button\">\n      {page}\n    </button>\n  )\n}\n"],"names":["React","baseClass","Page","isCurrent","isFirstPage","isLastPage","page","updatePage","classes","filter","Boolean","join","button","className","onClick","type"],"mappings":"AAAA;;AACA,OAAOA,WAAW,QAAO;AAUzB,MAAMC,YAAY;AAElB,OAAO,MAAMC,OAA4B,CAAC,EACxCC,SAAS,EACTC,cAAc,KAAK,EACnBC,aAAa,KAAK,EAClBC,OAAO,CAAC,EACRC,UAAU,EACX;IACC,MAAMC,UAAU;QACdP;QACAE,aAAa,CAAC,EAAEF,UAAU,YAAY,CAAC;QACvCG,eAAe,CAAC,EAAEH,UAAU,eAAe,CAAC;QAC5CI,cAAc,CAAC,EAAEJ,UAAU,cAAc,CAAC;KAC3C,CACEQ,MAAM,CAACC,SACPC,IAAI,CAAC;IAER,qBACE,KAACC;QAAOC,WAAWL;QAASM,SAAS,IAAMP,WAAWD;QAAOS,MAAK;kBAC/DT;;AAGP,EAAC"}

package/dist/elements/Pagination/Separator/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/elements/Pagination/Separator/index.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\n\nexport const Separator: React.FC = () => <span className=\"paginator__separator\">&mdash;</span>\n"],"names":["React","Separator","span","className"],"rangeMappings":";;;;;;","mappings":"AAAA;;AACA,OAAOA,WAAW,QAAO;AAEzB,OAAO,MAAMC,YAAsB,kBAAM,KAACC;QAAKC,WAAU;kBAAuB;OAAc"}
+{"version":3,"sources":["../../../../src/elements/Pagination/Separator/index.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\n\nexport const Separator: React.FC = () => <span className=\"paginator__separator\">&mdash;</span>\n"],"names":["React","Separator","span","className"],"mappings":"AAAA;;AACA,OAAOA,WAAW,QAAO;AAEzB,OAAO,MAAMC,YAAsB,kBAAM,KAACC;QAAKC,WAAU;kBAAuB;OAAc"}

package/dist/elements/Pagination/index.js

@@ -4,6 +4,7 @@ import React from 'react';
 import { ClickableArrow } from './ClickableArrow/index.js';
 import { Page } from './Page/index.js';
 import { Separator } from './Separator/index.js';
+import './index.scss';
 const nodeTypes = {
     ClickableArrow,
     Page,

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/Pagination/index.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\n\nimport { ClickableArrow } from './ClickableArrow/index.js'\nimport { Page } from './Page/index.js'\nimport { Separator } from './Separator/index.js'\nimport './index.scss'\n\nconst nodeTypes = {\n  ClickableArrow,\n  Page,\n  Separator,\n}\n\nconst baseClass = 'paginator'\n\nexport type PaginationProps = {\n  hasNextPage?: boolean\n  hasPrevPage?: boolean\n  limit?: number\n  nextPage?: number\n  numberOfNeighbors?: number\n  onChange?: (page: number) => void\n  page?: number\n  prevPage?: number\n  totalPages?: number\n}\n\nexport type Node =\n  | {\n      props?: {\n        direction?: 'left' | 'right'\n        isDisabled?: boolean\n        isFirstPage?: boolean\n        isLastPage?: boolean\n        page?: number\n        updatePage: (page?: number) => void\n      }\n      type: 'ClickableArrow' | 'Page' | 'Separator'\n    }\n  | number\n\nexport const Pagination: React.FC<PaginationProps> = (props) => {\n  const {\n    hasNextPage = false,\n    hasPrevPage = false,\n    nextPage = null,\n    numberOfNeighbors = 1,\n    onChange,\n    page: currentPage,\n    prevPage = null,\n    totalPages = null,\n  } = props\n\n  if (!totalPages || totalPages <= 1) return null\n\n  const updatePage = (page) => {\n    if (typeof onChange === 'function') onChange(page)\n  }\n\n  // Create array of integers for each page\n  const pages = Array.from({ length: totalPages }, (_, index) => index + 1)\n\n  // Assign indices for start and end of the range of pages that should be shown in paginator\n  let rangeStartIndex = currentPage - 1 - numberOfNeighbors\n\n  // Sanitize rangeStartIndex in case it is less than zero for safe split\n  if (rangeStartIndex <= 0) rangeStartIndex = 0\n\n  const rangeEndIndex = currentPage - 1 + numberOfNeighbors + 1\n\n  // Slice out the range of pages that we want to render\n  const nodes: Node[] = pages.slice(rangeStartIndex, rangeEndIndex)\n\n  // Add prev separator if necessary\n  if (currentPage - numberOfNeighbors - 1 >= 2) nodes.unshift({ type: 'Separator' })\n  // Add first page if necessary\n  if (currentPage > numberOfNeighbors + 1) {\n    nodes.unshift({\n      type: 'Page',\n      props: {\n        isFirstPage: true,\n        page: 1,\n        updatePage,\n      },\n    })\n  }\n\n  // Add next separator if necessary\n  if (currentPage + numberOfNeighbors + 1 < totalPages) nodes.push({ type: 'Separator' })\n  // Add last page if necessary\n  if (rangeEndIndex < totalPages) {\n    nodes.push({\n      type: 'Page',\n      props: {\n        isLastPage: true,\n        page: totalPages,\n        updatePage,\n      },\n    })\n  }\n\n  // Add prev and next arrows based on necessity\n  nodes.unshift({\n    type: 'ClickableArrow',\n    props: {\n      direction: 'right',\n      isDisabled: !hasNextPage,\n      updatePage: () => updatePage(nextPage),\n    },\n  })\n\n  nodes.unshift({\n    type: 'ClickableArrow',\n    props: {\n      direction: 'left',\n      isDisabled: !hasPrevPage,\n      updatePage: () => updatePage(prevPage),\n    },\n  })\n\n  return (\n    <div className={baseClass}>\n      {nodes.map((node, i) => {\n        if (typeof node === 'number') {\n          return (\n            <Page isCurrent={currentPage === node} key={i} page={node} updatePage={updatePage} />\n          )\n        }\n\n        const NodeType = nodeTypes[node.type]\n\n        return <NodeType key={i} {...node.props} />\n      })}\n    </div>\n  )\n}\n"],"names":["React","ClickableArrow","Page","Separator","nodeTypes","baseClass","Pagination","props","hasNextPage","hasPrevPage","nextPage","numberOfNeighbors","onChange","page","currentPage","prevPage","totalPages","updatePage","pages","Array","from","length","_","index","rangeStartIndex","rangeEndIndex","nodes","slice","unshift","type","isFirstPage","push","isLastPage","direction","isDisabled","div","className","map","node","i","isCurrent","NodeType"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;;AACA,OAAOA,WAAW,QAAO;AAEzB,SAASC,cAAc,QAAQ,4BAA2B;AAC1D,SAASC,IAAI,QAAQ,kBAAiB;AACtC,SAASC,SAAS,QAAQ,uBAAsB;AAGhD,MAAMC,YAAY;IAChBH;IACAC;IACAC;AACF;AAEA,MAAME,YAAY;AA4BlB,OAAO,MAAMC,aAAwC,CAACC;IACpD,MAAM,EACJC,cAAc,KAAK,EACnBC,cAAc,KAAK,EACnBC,WAAW,IAAI,EACfC,oBAAoB,CAAC,EACrBC,QAAQ,EACRC,MAAMC,WAAW,EACjBC,WAAW,IAAI,EACfC,aAAa,IAAI,EAClB,GAAGT;IAEJ,IAAI,CAACS,cAAcA,cAAc,GAAG,OAAO;IAE3C,MAAMC,aAAa,CAACJ;QAClB,IAAI,OAAOD,aAAa,YAAYA,SAASC;IAC/C;IAEA,yCAAyC;IACzC,MAAMK,QAAQC,MAAMC,IAAI,CAAC;QAAEC,QAAQL;IAAW,GAAG,CAACM,GAAGC,QAAUA,QAAQ;IAEvE,2FAA2F;IAC3F,IAAIC,kBAAkBV,cAAc,IAAIH;IAExC,uEAAuE;IACvE,IAAIa,mBAAmB,GAAGA,kBAAkB;IAE5C,MAAMC,gBAAgBX,cAAc,IAAIH,oBAAoB;IAE5D,sDAAsD;IACtD,MAAMe,QAAgBR,MAAMS,KAAK,CAACH,iBAAiBC;IAEnD,kCAAkC;IAClC,IAAIX,cAAcH,oBAAoB,KAAK,GAAGe,MAAME,OAAO,CAAC;QAAEC,MAAM;IAAY;IAChF,8BAA8B;IAC9B,IAAIf,cAAcH,oBAAoB,GAAG;QACvCe,MAAME,OAAO,CAAC;YACZC,MAAM;YACNtB,OAAO;gBACLuB,aAAa;gBACbjB,MAAM;gBACNI;YACF;QACF;IACF;IAEA,kCAAkC;IAClC,IAAIH,cAAcH,oBAAoB,IAAIK,YAAYU,MAAMK,IAAI,CAAC;QAAEF,MAAM;IAAY;IACrF,6BAA6B;IAC7B,IAAIJ,gBAAgBT,YAAY;QAC9BU,MAAMK,IAAI,CAAC;YACTF,MAAM;YACNtB,OAAO;gBACLyB,YAAY;gBACZnB,MAAMG;gBACNC;YACF;QACF;IACF;IAEA,8CAA8C;IAC9CS,MAAME,OAAO,CAAC;QACZC,MAAM;QACNtB,OAAO;YACL0B,WAAW;YACXC,YAAY,CAAC1B;YACbS,YAAY,IAAMA,WAAWP;QAC/B;IACF;IAEAgB,MAAME,OAAO,CAAC;QACZC,MAAM;QACNtB,OAAO;YACL0B,WAAW;YACXC,YAAY,CAACzB;YACbQ,YAAY,IAAMA,WAAWF;QAC/B;IACF;IAEA,qBACE,KAACoB;QAAIC,WAAW/B;kBACbqB,MAAMW,GAAG,CAAC,CAACC,MAAMC;YAChB,IAAI,OAAOD,SAAS,UAAU;gBAC5B,qBACE,KAACpC;oBAAKsC,WAAW1B,gBAAgBwB;oBAAczB,MAAMyB;oBAAMrB,YAAYA;mBAA3BsB;YAEhD;YAEA,MAAME,WAAWrC,SAAS,CAACkC,KAAKT,IAAI,CAAC;YAErC,qBAAO,KAACY;gBAAkB,GAAGH,KAAK/B,KAAK;eAAjBgC;QACxB;;AAGN,EAAC"}
+{"version":3,"sources":["../../../src/elements/Pagination/index.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\n\nimport { ClickableArrow } from './ClickableArrow/index.js'\nimport { Page } from './Page/index.js'\nimport { Separator } from './Separator/index.js'\nimport './index.scss'\n\nconst nodeTypes = {\n  ClickableArrow,\n  Page,\n  Separator,\n}\n\nconst baseClass = 'paginator'\n\nexport type PaginationProps = {\n  hasNextPage?: boolean\n  hasPrevPage?: boolean\n  limit?: number\n  nextPage?: number\n  numberOfNeighbors?: number\n  onChange?: (page: number) => void\n  page?: number\n  prevPage?: number\n  totalPages?: number\n}\n\nexport type Node =\n  | {\n      props?: {\n        direction?: 'left' | 'right'\n        isDisabled?: boolean\n        isFirstPage?: boolean\n        isLastPage?: boolean\n        page?: number\n        updatePage: (page?: number) => void\n      }\n      type: 'ClickableArrow' | 'Page' | 'Separator'\n    }\n  | number\n\nexport const Pagination: React.FC<PaginationProps> = (props) => {\n  const {\n    hasNextPage = false,\n    hasPrevPage = false,\n    nextPage = null,\n    numberOfNeighbors = 1,\n    onChange,\n    page: currentPage,\n    prevPage = null,\n    totalPages = null,\n  } = props\n\n  if (!totalPages || totalPages <= 1) return null\n\n  const updatePage = (page) => {\n    if (typeof onChange === 'function') onChange(page)\n  }\n\n  // Create array of integers for each page\n  const pages = Array.from({ length: totalPages }, (_, index) => index + 1)\n\n  // Assign indices for start and end of the range of pages that should be shown in paginator\n  let rangeStartIndex = currentPage - 1 - numberOfNeighbors\n\n  // Sanitize rangeStartIndex in case it is less than zero for safe split\n  if (rangeStartIndex <= 0) rangeStartIndex = 0\n\n  const rangeEndIndex = currentPage - 1 + numberOfNeighbors + 1\n\n  // Slice out the range of pages that we want to render\n  const nodes: Node[] = pages.slice(rangeStartIndex, rangeEndIndex)\n\n  // Add prev separator if necessary\n  if (currentPage - numberOfNeighbors - 1 >= 2) nodes.unshift({ type: 'Separator' })\n  // Add first page if necessary\n  if (currentPage > numberOfNeighbors + 1) {\n    nodes.unshift({\n      type: 'Page',\n      props: {\n        isFirstPage: true,\n        page: 1,\n        updatePage,\n      },\n    })\n  }\n\n  // Add next separator if necessary\n  if (currentPage + numberOfNeighbors + 1 < totalPages) nodes.push({ type: 'Separator' })\n  // Add last page if necessary\n  if (rangeEndIndex < totalPages) {\n    nodes.push({\n      type: 'Page',\n      props: {\n        isLastPage: true,\n        page: totalPages,\n        updatePage,\n      },\n    })\n  }\n\n  // Add prev and next arrows based on necessity\n  nodes.unshift({\n    type: 'ClickableArrow',\n    props: {\n      direction: 'right',\n      isDisabled: !hasNextPage,\n      updatePage: () => updatePage(nextPage),\n    },\n  })\n\n  nodes.unshift({\n    type: 'ClickableArrow',\n    props: {\n      direction: 'left',\n      isDisabled: !hasPrevPage,\n      updatePage: () => updatePage(prevPage),\n    },\n  })\n\n  return (\n    <div className={baseClass}>\n      {nodes.map((node, i) => {\n        if (typeof node === 'number') {\n          return (\n            <Page isCurrent={currentPage === node} key={i} page={node} updatePage={updatePage} />\n          )\n        }\n\n        const NodeType = nodeTypes[node.type]\n\n        return <NodeType key={i} {...node.props} />\n      })}\n    </div>\n  )\n}\n"],"names":["React","ClickableArrow","Page","Separator","nodeTypes","baseClass","Pagination","props","hasNextPage","hasPrevPage","nextPage","numberOfNeighbors","onChange","page","currentPage","prevPage","totalPages","updatePage","pages","Array","from","length","_","index","rangeStartIndex","rangeEndIndex","nodes","slice","unshift","type","isFirstPage","push","isLastPage","direction","isDisabled","div","className","map","node","i","isCurrent","NodeType"],"mappings":"AAAA;;AACA,OAAOA,WAAW,QAAO;AAEzB,SAASC,cAAc,QAAQ,4BAA2B;AAC1D,SAASC,IAAI,QAAQ,kBAAiB;AACtC,SAASC,SAAS,QAAQ,uBAAsB;AAChD,OAAO,eAAc;AAErB,MAAMC,YAAY;IAChBH;IACAC;IACAC;AACF;AAEA,MAAME,YAAY;AA4BlB,OAAO,MAAMC,aAAwC,CAACC;IACpD,MAAM,EACJC,cAAc,KAAK,EACnBC,cAAc,KAAK,EACnBC,WAAW,IAAI,EACfC,oBAAoB,CAAC,EACrBC,QAAQ,EACRC,MAAMC,WAAW,EACjBC,WAAW,IAAI,EACfC,aAAa,IAAI,EAClB,GAAGT;IAEJ,IAAI,CAACS,cAAcA,cAAc,GAAG,OAAO;IAE3C,MAAMC,aAAa,CAACJ;QAClB,IAAI,OAAOD,aAAa,YAAYA,SAASC;IAC/C;IAEA,yCAAyC;IACzC,MAAMK,QAAQC,MAAMC,IAAI,CAAC;QAAEC,QAAQL;IAAW,GAAG,CAACM,GAAGC,QAAUA,QAAQ;IAEvE,2FAA2F;IAC3F,IAAIC,kBAAkBV,cAAc,IAAIH;IAExC,uEAAuE;IACvE,IAAIa,mBAAmB,GAAGA,kBAAkB;IAE5C,MAAMC,gBAAgBX,cAAc,IAAIH,oBAAoB;IAE5D,sDAAsD;IACtD,MAAMe,QAAgBR,MAAMS,KAAK,CAACH,iBAAiBC;IAEnD,kCAAkC;IAClC,IAAIX,cAAcH,oBAAoB,KAAK,GAAGe,MAAME,OAAO,CAAC;QAAEC,MAAM;IAAY;IAChF,8BAA8B;IAC9B,IAAIf,cAAcH,oBAAoB,GAAG;QACvCe,MAAME,OAAO,CAAC;YACZC,MAAM;YACNtB,OAAO;gBACLuB,aAAa;gBACbjB,MAAM;gBACNI;YACF;QACF;IACF;IAEA,kCAAkC;IAClC,IAAIH,cAAcH,oBAAoB,IAAIK,YAAYU,MAAMK,IAAI,CAAC;QAAEF,MAAM;IAAY;IACrF,6BAA6B;IAC7B,IAAIJ,gBAAgBT,YAAY;QAC9BU,MAAMK,IAAI,CAAC;YACTF,MAAM;YACNtB,OAAO;gBACLyB,YAAY;gBACZnB,MAAMG;gBACNC;YACF;QACF;IACF;IAEA,8CAA8C;IAC9CS,MAAME,OAAO,CAAC;QACZC,MAAM;QACNtB,OAAO;YACL0B,WAAW;YACXC,YAAY,CAAC1B;YACbS,YAAY,IAAMA,WAAWP;QAC/B;IACF;IAEAgB,MAAME,OAAO,CAAC;QACZC,MAAM;QACNtB,OAAO;YACL0B,WAAW;YACXC,YAAY,CAACzB;YACbQ,YAAY,IAAMA,WAAWF;QAC/B;IACF;IAEA,qBACE,KAACoB;QAAIC,WAAW/B;kBACbqB,MAAMW,GAAG,CAAC,CAACC,MAAMC;YAChB,IAAI,OAAOD,SAAS,UAAU;gBAC5B,qBACE,KAACpC;oBAAKsC,WAAW1B,gBAAgBwB;oBAAczB,MAAMyB;oBAAMrB,YAAYA;mBAA3BsB;YAEhD;YAEA,MAAME,WAAWrC,SAAS,CAACkC,KAAKT,IAAI,CAAC;YAErC,qBAAO,KAACY;gBAAkB,GAAGH,KAAK/B,KAAK;eAAjBgC;QACxB;;AAGN,EAAC"}

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/PerPage/index.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,MAAM,OAAO,CAAA;AAKzB,OAAO,cAAc,CAAA;AAMrB,MAAM,MAAM,YAAY,GAAG;IACzB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IACtC,KAAK,EAAE,MAAM,CAAA;IACb,MAAM,EAAE,MAAM,EAAE,CAAA;IAChB,SAAS,CAAC,EAAE,OAAO,CAAA;CACpB,CAAA;AAED,eAAO,MAAM,OAAO,EAAE,KAAK,CAAC,EAAE,CAAC,YAAY,CAoD1C,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/PerPage/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAA;AAKzB,OAAO,cAAc,CAAA;AAMrB,MAAM,MAAM,YAAY,GAAG;IACzB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IACtC,KAAK,EAAE,MAAM,CAAA;IACb,MAAM,EAAE,MAAM,EAAE,CAAA;IAChB,SAAS,CAAC,EAAE,OAAO,CAAA;CACpB,CAAA;AAED,eAAO,MAAM,OAAO,EAAE,KAAK,CAAC,EAAE,CAAC,YAAY,CAoD1C,CAAA"}

package/dist/elements/PerPage/index.js

@@ -1,12 +1,12 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 // TODO: abstract the `next/navigation` dependency out from this component
-import { collectionDefaults } from 'payload/config';
-import { isNumber } from 'payload/utilities';
+import { collectionDefaults, isNumber } from 'payload/shared';
 import React from 'react';
-import { Chevron } from '../../icons/Chevron/index.js';
+import { ChevronIcon } from '../../icons/Chevron/index.js';
 import { useTranslation } from '../../providers/Translation/index.js';
 import { Popup, PopupList } from '../Popup/index.js';
+import './index.scss';
 const baseClass = 'per-page';
 const defaultLimits = collectionDefaults.admin.pagination.limits;
 export const PerPage = ({ defaultLimit = 10, handleChange, limit, limits = defaultLimits })=>{
@@ -24,7 +24,7 @@ export const PerPage = ({ defaultLimit = 10, handleChange, limit, limits = defau
                         })
                     }),
                     " ",
-                    /*#__PURE__*/ _jsx(Chevron, {
+                    /*#__PURE__*/ _jsx(ChevronIcon, {
                         className: `${baseClass}__icon`
                     })
                 ]
@@ -43,7 +43,7 @@ export const PerPage = ({ defaultLimit = 10, handleChange, limit, limits = defau
                             children: [
                                 limitNumber === limitToUse && /*#__PURE__*/ _jsx("div", {
                                     className: `${baseClass}__chevron`,
-                                    children: /*#__PURE__*/ _jsx(Chevron, {
+                                    children: /*#__PURE__*/ _jsx(ChevronIcon, {
                                         direction: "right"
                                     })
                                 }),

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/PerPage/index.tsx"],"sourcesContent":["'use client'\n// TODO: abstract the `next/navigation` dependency out from this component\nimport { collectionDefaults } from 'payload/config'\nimport { isNumber } from 'payload/utilities'\nimport React from 'react'\n\nimport { Chevron } from '../../icons/Chevron/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { Popup, PopupList } from '../Popup/index.js'\nimport './index.scss'\n\nconst baseClass = 'per-page'\n\nconst defaultLimits = collectionDefaults.admin.pagination.limits\n\nexport type PerPageProps = {\n  defaultLimit?: number\n  handleChange?: (limit: number) => void\n  limit: number\n  limits: number[]\n  resetPage?: boolean\n}\n\nexport const PerPage: React.FC<PerPageProps> = ({\n  defaultLimit = 10,\n  handleChange,\n  limit,\n  limits = defaultLimits,\n}) => {\n  const { t } = useTranslation()\n\n  const limitToUse = isNumber(limit) ? limit : defaultLimit\n\n  return (\n    <div className={baseClass}>\n      <Popup\n        button={\n          <div className={`${baseClass}__base-button`}>\n            <span>{t('general:perPage', { limit: limitToUse })}</span>\n            &nbsp;\n            <Chevron className={`${baseClass}__icon`} />\n          </div>\n        }\n        horizontalAlign=\"right\"\n        render={({ close }) => (\n          <PopupList.ButtonGroup>\n            {limits.map((limitNumber, i) => (\n              <PopupList.Button\n                className={[\n                  `${baseClass}__button`,\n                  limitNumber === limitToUse && `${baseClass}__button-active`,\n                ]\n                  .filter(Boolean)\n                  .join(' ')}\n                key={i}\n                onClick={() => {\n                  close()\n                  if (handleChange) handleChange(limitNumber)\n                }}\n              >\n                {limitNumber === limitToUse && (\n                  <div className={`${baseClass}__chevron`}>\n                    <Chevron direction=\"right\" />\n                  </div>\n                )}\n                &nbsp;\n                <span>{limitNumber}</span>\n              </PopupList.Button>\n            ))}\n          </PopupList.ButtonGroup>\n        )}\n        size=\"small\"\n      />\n    </div>\n  )\n}\n"],"names":["collectionDefaults","isNumber","React","Chevron","useTranslation","Popup","PopupList","baseClass","defaultLimits","admin","pagination","limits","PerPage","defaultLimit","handleChange","limit","t","limitToUse","div","className","button","span","horizontalAlign","render","close","ButtonGroup","map","limitNumber","i","Button","filter","Boolean","join","onClick","direction","size"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;;AACA,0EAA0E;AAC1E,SAASA,kBAAkB,QAAQ,iBAAgB;AACnD,SAASC,QAAQ,QAAQ,oBAAmB;AAC5C,OAAOC,WAAW,QAAO;AAEzB,SAASC,OAAO,QAAQ,+BAA8B;AACtD,SAASC,cAAc,QAAQ,uCAAsC;AACrE,SAASC,KAAK,EAAEC,SAAS,QAAQ,oBAAmB;AAGpD,MAAMC,YAAY;AAElB,MAAMC,gBAAgBR,mBAAmBS,KAAK,CAACC,UAAU,CAACC,MAAM;AAUhE,OAAO,MAAMC,UAAkC,CAAC,EAC9CC,eAAe,EAAE,EACjBC,YAAY,EACZC,KAAK,EACLJ,SAASH,aAAa,EACvB;IACC,MAAM,EAAEQ,CAAC,EAAE,GAAGZ;IAEd,MAAMa,aAAahB,SAASc,SAASA,QAAQF;IAE7C,qBACE,KAACK;QAAIC,WAAWZ;kBACd,cAAA,KAACF;YACCe,sBACE,MAACF;gBAAIC,WAAW,CAAC,EAAEZ,UAAU,aAAa,CAAC;;kCACzC,KAACc;kCAAML,EAAE,mBAAmB;4BAAED,OAAOE;wBAAW;;oBAAU;kCAE1D,KAACd;wBAAQgB,WAAW,CAAC,EAAEZ,UAAU,MAAM,CAAC;;;;YAG5Ce,iBAAgB;YAChBC,QAAQ,CAAC,EAAEC,KAAK,EAAE,iBAChB,KAAClB,UAAUmB,WAAW;8BACnBd,OAAOe,GAAG,CAAC,CAACC,aAAaC,kBACxB,MAACtB,UAAUuB,MAAM;4BACfV,WAAW;gCACT,CAAC,EAAEZ,UAAU,QAAQ,CAAC;gCACtBoB,gBAAgBV,cAAc,CAAC,EAAEV,UAAU,eAAe,CAAC;6BAC5D,CACEuB,MAAM,CAACC,SACPC,IAAI,CAAC;4BAERC,SAAS;gCACPT;gCACA,IAAIV,cAAcA,aAAaa;4BACjC;;gCAECA,gBAAgBV,4BACf,KAACC;oCAAIC,WAAW,CAAC,EAAEZ,UAAU,SAAS,CAAC;8CACrC,cAAA,KAACJ;wCAAQ+B,WAAU;;;gCAErB;8CAEF,KAACb;8CAAMM;;;2BAZFC;;YAiBbO,MAAK;;;AAIb,EAAC"}
+{"version":3,"sources":["../../../src/elements/PerPage/index.tsx"],"sourcesContent":["'use client'\n// TODO: abstract the `next/navigation` dependency out from this component\nimport { collectionDefaults, isNumber } from 'payload/shared'\nimport React from 'react'\n\nimport { ChevronIcon } from '../../icons/Chevron/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { Popup, PopupList } from '../Popup/index.js'\nimport './index.scss'\n\nconst baseClass = 'per-page'\n\nconst defaultLimits = collectionDefaults.admin.pagination.limits\n\nexport type PerPageProps = {\n  defaultLimit?: number\n  handleChange?: (limit: number) => void\n  limit: number\n  limits: number[]\n  resetPage?: boolean\n}\n\nexport const PerPage: React.FC<PerPageProps> = ({\n  defaultLimit = 10,\n  handleChange,\n  limit,\n  limits = defaultLimits,\n}) => {\n  const { t } = useTranslation()\n\n  const limitToUse = isNumber(limit) ? limit : defaultLimit\n\n  return (\n    <div className={baseClass}>\n      <Popup\n        button={\n          <div className={`${baseClass}__base-button`}>\n            <span>{t('general:perPage', { limit: limitToUse })}</span>\n            &nbsp;\n            <ChevronIcon className={`${baseClass}__icon`} />\n          </div>\n        }\n        horizontalAlign=\"right\"\n        render={({ close }) => (\n          <PopupList.ButtonGroup>\n            {limits.map((limitNumber, i) => (\n              <PopupList.Button\n                className={[\n                  `${baseClass}__button`,\n                  limitNumber === limitToUse && `${baseClass}__button-active`,\n                ]\n                  .filter(Boolean)\n                  .join(' ')}\n                key={i}\n                onClick={() => {\n                  close()\n                  if (handleChange) handleChange(limitNumber)\n                }}\n              >\n                {limitNumber === limitToUse && (\n                  <div className={`${baseClass}__chevron`}>\n                    <ChevronIcon direction=\"right\" />\n                  </div>\n                )}\n                &nbsp;\n                <span>{limitNumber}</span>\n              </PopupList.Button>\n            ))}\n          </PopupList.ButtonGroup>\n        )}\n        size=\"small\"\n      />\n    </div>\n  )\n}\n"],"names":["collectionDefaults","isNumber","React","ChevronIcon","useTranslation","Popup","PopupList","baseClass","defaultLimits","admin","pagination","limits","PerPage","defaultLimit","handleChange","limit","t","limitToUse","div","className","button","span","horizontalAlign","render","close","ButtonGroup","map","limitNumber","i","Button","filter","Boolean","join","onClick","direction","size"],"mappings":"AAAA;;AACA,0EAA0E;AAC1E,SAASA,kBAAkB,EAAEC,QAAQ,QAAQ,iBAAgB;AAC7D,OAAOC,WAAW,QAAO;AAEzB,SAASC,WAAW,QAAQ,+BAA8B;AAC1D,SAASC,cAAc,QAAQ,uCAAsC;AACrE,SAASC,KAAK,EAAEC,SAAS,QAAQ,oBAAmB;AACpD,OAAO,eAAc;AAErB,MAAMC,YAAY;AAElB,MAAMC,gBAAgBR,mBAAmBS,KAAK,CAACC,UAAU,CAACC,MAAM;AAUhE,OAAO,MAAMC,UAAkC,CAAC,EAC9CC,eAAe,EAAE,EACjBC,YAAY,EACZC,KAAK,EACLJ,SAASH,aAAa,EACvB;IACC,MAAM,EAAEQ,CAAC,EAAE,GAAGZ;IAEd,MAAMa,aAAahB,SAASc,SAASA,QAAQF;IAE7C,qBACE,KAACK;QAAIC,WAAWZ;kBACd,cAAA,KAACF;YACCe,sBACE,MAACF;gBAAIC,WAAW,CAAC,EAAEZ,UAAU,aAAa,CAAC;;kCACzC,KAACc;kCAAML,EAAE,mBAAmB;4BAAED,OAAOE;wBAAW;;oBAAU;kCAE1D,KAACd;wBAAYgB,WAAW,CAAC,EAAEZ,UAAU,MAAM,CAAC;;;;YAGhDe,iBAAgB;YAChBC,QAAQ,CAAC,EAAEC,KAAK,EAAE,iBAChB,KAAClB,UAAUmB,WAAW;8BACnBd,OAAOe,GAAG,CAAC,CAACC,aAAaC,kBACxB,MAACtB,UAAUuB,MAAM;4BACfV,WAAW;gCACT,CAAC,EAAEZ,UAAU,QAAQ,CAAC;gCACtBoB,gBAAgBV,cAAc,CAAC,EAAEV,UAAU,eAAe,CAAC;6BAC5D,CACEuB,MAAM,CAACC,SACPC,IAAI,CAAC;4BAERC,SAAS;gCACPT;gCACA,IAAIV,cAAcA,aAAaa;4BACjC;;gCAECA,gBAAgBV,4BACf,KAACC;oCAAIC,WAAW,CAAC,EAAEZ,UAAU,SAAS,CAAC;8CACrC,cAAA,KAACJ;wCAAY+B,WAAU;;;gCAEzB;8CAEF,KAACb;8CAAMM;;;2BAZFC;;YAiBbO,MAAK;;;AAIb,EAAC"}

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

@@ -1,5 +1,5 @@
-import React from 'react';
 import type { HTMLAttributes } from 'react';
+import React from 'react';
 export type PillProps = {
     alignIcon?: 'left' | 'right';
     'aria-checked'?: boolean;
@@ -9,9 +9,9 @@ export type PillProps = {
     children?: React.ReactNode;
     className?: string;
     draggable?: boolean;
-    elementProps?: HTMLAttributes<HTMLElement> & {
+    elementProps?: {
         ref: React.RefCallback<HTMLElement>;
-    };
+    } & HTMLAttributes<HTMLElement>;
     icon?: React.ReactNode;
     id?: string;
     onClick?: () => void;

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/Pill/index.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AAE3C,MAAM,MAAM,SAAS,GAAG;IACtB,SAAS,CAAC,EAAE,MAAM,GAAG,OAAO,CAAA;IAC5B,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,YAAY,CAAC,EAAE,cAAc,CAAC,WAAW,CAAC,GAAG;QAC3C,GAAG,EAAE,KAAK,CAAC,WAAW,CAAC,WAAW,CAAC,CAAA;KACpC,CAAA;IACD,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACtB,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,SAAS,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,OAAO,GAAG,YAAY,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,CAAA;IACvF,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,EAAE,CAAC,EAAE,MAAM,CAAA;CACZ,CAAA;AAED,MAAM,MAAM,iBAAiB,GAAG;IAC9B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,EAAE,EAAE,MAAM,CAAA;IACV,IAAI,CAAC,EAAE,QAAQ,CAAA;CAChB,CAAA;AAGD,OAAO,cAAc,CAAA;AAmFrB,eAAO,MAAM,IAAI,EAAE,KAAK,CAAC,EAAE,CAAC,SAAS,CAKpC,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/Pill/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAe,cAAc,EAAE,MAAM,OAAO,CAAA;AAIxD,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,MAAM,MAAM,SAAS,GAAG;IACtB,SAAS,CAAC,EAAE,MAAM,GAAG,OAAO,CAAA;IAC5B,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,YAAY,CAAC,EAAE;QACb,GAAG,EAAE,KAAK,CAAC,WAAW,CAAC,WAAW,CAAC,CAAA;KACpC,GAAG,cAAc,CAAC,WAAW,CAAC,CAAA;IAC/B,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACtB,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,SAAS,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,OAAO,GAAG,YAAY,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,CAAA;IACvF,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,EAAE,CAAC,EAAE,MAAM,CAAA;CACZ,CAAA;AAED,MAAM,MAAM,iBAAiB,GAAG;IAC9B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,EAAE,EAAE,MAAM,CAAA;IACV,IAAI,CAAC,EAAE,QAAQ,CAAA;CAChB,CAAA;AAGD,OAAO,cAAc,CAAA;AAmFrB,eAAO,MAAM,IAAI,EAAE,KAAK,CAAC,EAAE,CAAC,SAAS,CAKpC,CAAA"}

package/dist/elements/Pill/index.js

@@ -4,6 +4,7 @@ import LinkWithDefault from 'next/link.js';
 const Link = LinkWithDefault.default;
 import React from 'react'; // TODO: abstract this out to support all routers
 import { useDraggableSortable } from '../DraggableSortable/useDraggableSortable/index.js';
+import './index.scss';
 const baseClass = 'pill';
 const DraggablePill = (props)=>{
     const { id, className } = props;

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/Pill/index.tsx"],"sourcesContent":["'use client'\nimport type { ElementType } from 'react'\n\nimport LinkWithDefault from 'next/link.js'\nconst Link = LinkWithDefault.default\nimport React from 'react' // TODO: abstract this out to support all routers\n\nimport type { HTMLAttributes } from 'react'\n\nexport type PillProps = {\n  alignIcon?: 'left' | 'right'\n  'aria-checked'?: boolean\n  'aria-controls'?: string\n  'aria-expanded'?: boolean\n  'aria-label'?: string\n  children?: React.ReactNode\n  className?: string\n  draggable?: boolean\n  elementProps?: HTMLAttributes<HTMLElement> & {\n    ref: React.RefCallback<HTMLElement>\n  }\n  icon?: React.ReactNode\n  id?: string\n  onClick?: () => void\n  pillStyle?: 'dark' | 'error' | 'light' | 'light-gray' | 'success' | 'warning' | 'white'\n  rounded?: boolean\n  to?: string\n}\n\nexport type RenderedTypeProps = {\n  children: React.ReactNode\n  className?: string\n  onClick?: () => void\n  to: string\n  type?: 'button'\n}\n\nimport { useDraggableSortable } from '../DraggableSortable/useDraggableSortable/index.js'\nimport './index.scss'\n\nconst baseClass = 'pill'\n\nconst DraggablePill: React.FC<PillProps> = (props) => {\n  const { id, className } = props\n\n  const { attributes, isDragging, listeners, setNodeRef, transform } = useDraggableSortable({\n    id,\n  })\n\n  return (\n    <StaticPill\n      {...props}\n      className={[isDragging && `${baseClass}--is-dragging`, className].filter(Boolean).join(' ')}\n      elementProps={{\n        ...listeners,\n        ...attributes,\n        ref: setNodeRef,\n        style: {\n          transform,\n        },\n      }}\n    />\n  )\n}\n\nconst StaticPill: React.FC<PillProps> = (props) => {\n  const {\n    alignIcon = 'right',\n    'aria-checked': ariaChecked,\n    'aria-controls': ariaControls,\n    'aria-expanded': ariaExpanded,\n    'aria-label': ariaLabel,\n    children,\n    className,\n    draggable,\n    elementProps,\n    icon,\n    onClick,\n    pillStyle = 'light',\n    rounded,\n    to,\n  } = props\n\n  const classes = [\n    baseClass,\n    `${baseClass}--style-${pillStyle}`,\n    className && className,\n    to && `${baseClass}--has-link`,\n    (to || onClick) && `${baseClass}--has-action`,\n    icon && `${baseClass}--has-icon`,\n    icon && `${baseClass}--align-icon-${alignIcon}`,\n    draggable && `${baseClass}--draggable`,\n    rounded && `${baseClass}--rounded`,\n  ]\n    .filter(Boolean)\n    .join(' ')\n\n  let Element: ElementType | React.FC<RenderedTypeProps> = 'div'\n\n  if (onClick && !to) Element = 'button'\n  if (to) Element = Link\n\n  return (\n    <Element\n      {...elementProps}\n      aria-checked={ariaChecked}\n      aria-controls={ariaControls}\n      aria-expanded={ariaExpanded}\n      aria-label={ariaLabel}\n      className={classes}\n      href={to || null}\n      onClick={onClick}\n      type={Element === 'button' ? 'button' : undefined}\n    >\n      {icon && alignIcon === 'left' && <span className={`${baseClass}__icon`}>{icon}</span>}\n      <span className={`${baseClass}__label`}>{children}</span>\n      {icon && alignIcon === 'right' && <span className={`${baseClass}__icon`}>{icon}</span>}\n    </Element>\n  )\n}\n\nexport const Pill: React.FC<PillProps> = (props) => {\n  const { draggable } = props\n\n  if (draggable) return <DraggablePill {...props} />\n  return <StaticPill {...props} />\n}\n"],"names":["LinkWithDefault","Link","default","React","useDraggableSortable","baseClass","DraggablePill","props","id","className","attributes","isDragging","listeners","setNodeRef","transform","StaticPill","filter","Boolean","join","elementProps","ref","style","alignIcon","ariaChecked","ariaControls","ariaExpanded","ariaLabel","children","draggable","icon","onClick","pillStyle","rounded","to","classes","Element","aria-checked","aria-controls","aria-expanded","aria-label","href","type","undefined","span","Pill"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;;AAGA,OAAOA,qBAAqB,eAAc;AAC1C,MAAMC,OAAOD,gBAAgBE,OAAO;AACpC,OAAOC,WAAW,QAAO,CAAC,iDAAiD;AAgC3E,SAASC,oBAAoB,QAAQ,qDAAoD;AAGzF,MAAMC,YAAY;AAElB,MAAMC,gBAAqC,CAACC;IAC1C,MAAM,EAAEC,EAAE,EAAEC,SAAS,EAAE,GAAGF;IAE1B,MAAM,EAAEG,UAAU,EAAEC,UAAU,EAAEC,SAAS,EAAEC,UAAU,EAAEC,SAAS,EAAE,GAAGV,qBAAqB;QACxFI;IACF;IAEA,qBACE,KAACO;QACE,GAAGR,KAAK;QACTE,WAAW;YAACE,cAAc,CAAC,EAAEN,UAAU,aAAa,CAAC;YAAEI;SAAU,CAACO,MAAM,CAACC,SAASC,IAAI,CAAC;QACvFC,cAAc;YACZ,GAAGP,SAAS;YACZ,GAAGF,UAAU;YACbU,KAAKP;YACLQ,OAAO;gBACLP;YACF;QACF;;AAGN;AAEA,MAAMC,aAAkC,CAACR;IACvC,MAAM,EACJe,YAAY,OAAO,EACnB,gBAAgBC,WAAW,EAC3B,iBAAiBC,YAAY,EAC7B,iBAAiBC,YAAY,EAC7B,cAAcC,SAAS,EACvBC,QAAQ,EACRlB,SAAS,EACTmB,SAAS,EACTT,YAAY,EACZU,IAAI,EACJC,OAAO,EACPC,YAAY,OAAO,EACnBC,OAAO,EACPC,EAAE,EACH,GAAG1B;IAEJ,MAAM2B,UAAU;QACd7B;QACA,CAAC,EAAEA,UAAU,QAAQ,EAAE0B,UAAU,CAAC;QAClCtB,aAAaA;QACbwB,MAAM,CAAC,EAAE5B,UAAU,UAAU,CAAC;QAC7B4B,CAAAA,MAAMH,OAAM,KAAM,CAAC,EAAEzB,UAAU,YAAY,CAAC;QAC7CwB,QAAQ,CAAC,EAAExB,UAAU,UAAU,CAAC;QAChCwB,QAAQ,CAAC,EAAExB,UAAU,aAAa,EAAEiB,UAAU,CAAC;QAC/CM,aAAa,CAAC,EAAEvB,UAAU,WAAW,CAAC;QACtC2B,WAAW,CAAC,EAAE3B,UAAU,SAAS,CAAC;KACnC,CACEW,MAAM,CAACC,SACPC,IAAI,CAAC;IAER,IAAIiB,UAAqD;IAEzD,IAAIL,WAAW,CAACG,IAAIE,UAAU;IAC9B,IAAIF,IAAIE,UAAUlC;IAElB,qBACE,MAACkC;QACE,GAAGhB,YAAY;QAChBiB,gBAAcb;QACdc,iBAAeb;QACfc,iBAAeb;QACfc,cAAYb;QACZjB,WAAWyB;QACXM,MAAMP,MAAM;QACZH,SAASA;QACTW,MAAMN,YAAY,WAAW,WAAWO;;YAEvCb,QAAQP,cAAc,wBAAU,KAACqB;gBAAKlC,WAAW,CAAC,EAAEJ,UAAU,MAAM,CAAC;0BAAGwB;;0BACzE,KAACc;gBAAKlC,WAAW,CAAC,EAAEJ,UAAU,OAAO,CAAC;0BAAGsB;;YACxCE,QAAQP,cAAc,yBAAW,KAACqB;gBAAKlC,WAAW,CAAC,EAAEJ,UAAU,MAAM,CAAC;0BAAGwB;;;;AAGhF;AAEA,OAAO,MAAMe,OAA4B,CAACrC;IACxC,MAAM,EAAEqB,SAAS,EAAE,GAAGrB;IAEtB,IAAIqB,WAAW,qBAAO,KAACtB;QAAe,GAAGC,KAAK;;IAC9C,qBAAO,KAACQ;QAAY,GAAGR,KAAK;;AAC9B,EAAC"}
+{"version":3,"sources":["../../../src/elements/Pill/index.tsx"],"sourcesContent":["'use client'\nimport type { ElementType, HTMLAttributes } from 'react'\n\nimport LinkWithDefault from 'next/link.js'\nconst Link = LinkWithDefault.default\nimport React from 'react' // TODO: abstract this out to support all routers\n\nexport type PillProps = {\n  alignIcon?: 'left' | 'right'\n  'aria-checked'?: boolean\n  'aria-controls'?: string\n  'aria-expanded'?: boolean\n  'aria-label'?: string\n  children?: React.ReactNode\n  className?: string\n  draggable?: boolean\n  elementProps?: {\n    ref: React.RefCallback<HTMLElement>\n  } & HTMLAttributes<HTMLElement>\n  icon?: React.ReactNode\n  id?: string\n  onClick?: () => void\n  pillStyle?: 'dark' | 'error' | 'light' | 'light-gray' | 'success' | 'warning' | 'white'\n  rounded?: boolean\n  to?: string\n}\n\nexport type RenderedTypeProps = {\n  children: React.ReactNode\n  className?: string\n  onClick?: () => void\n  to: string\n  type?: 'button'\n}\n\nimport { useDraggableSortable } from '../DraggableSortable/useDraggableSortable/index.js'\nimport './index.scss'\n\nconst baseClass = 'pill'\n\nconst DraggablePill: React.FC<PillProps> = (props) => {\n  const { id, className } = props\n\n  const { attributes, isDragging, listeners, setNodeRef, transform } = useDraggableSortable({\n    id,\n  })\n\n  return (\n    <StaticPill\n      {...props}\n      className={[isDragging && `${baseClass}--is-dragging`, className].filter(Boolean).join(' ')}\n      elementProps={{\n        ...listeners,\n        ...attributes,\n        ref: setNodeRef,\n        style: {\n          transform,\n        },\n      }}\n    />\n  )\n}\n\nconst StaticPill: React.FC<PillProps> = (props) => {\n  const {\n    alignIcon = 'right',\n    'aria-checked': ariaChecked,\n    'aria-controls': ariaControls,\n    'aria-expanded': ariaExpanded,\n    'aria-label': ariaLabel,\n    children,\n    className,\n    draggable,\n    elementProps,\n    icon,\n    onClick,\n    pillStyle = 'light',\n    rounded,\n    to,\n  } = props\n\n  const classes = [\n    baseClass,\n    `${baseClass}--style-${pillStyle}`,\n    className && className,\n    to && `${baseClass}--has-link`,\n    (to || onClick) && `${baseClass}--has-action`,\n    icon && `${baseClass}--has-icon`,\n    icon && `${baseClass}--align-icon-${alignIcon}`,\n    draggable && `${baseClass}--draggable`,\n    rounded && `${baseClass}--rounded`,\n  ]\n    .filter(Boolean)\n    .join(' ')\n\n  let Element: ElementType | React.FC<RenderedTypeProps> = 'div'\n\n  if (onClick && !to) Element = 'button'\n  if (to) Element = Link\n\n  return (\n    <Element\n      {...elementProps}\n      aria-checked={ariaChecked}\n      aria-controls={ariaControls}\n      aria-expanded={ariaExpanded}\n      aria-label={ariaLabel}\n      className={classes}\n      href={to || null}\n      onClick={onClick}\n      type={Element === 'button' ? 'button' : undefined}\n    >\n      {icon && alignIcon === 'left' && <span className={`${baseClass}__icon`}>{icon}</span>}\n      <span className={`${baseClass}__label`}>{children}</span>\n      {icon && alignIcon === 'right' && <span className={`${baseClass}__icon`}>{icon}</span>}\n    </Element>\n  )\n}\n\nexport const Pill: React.FC<PillProps> = (props) => {\n  const { draggable } = props\n\n  if (draggable) return <DraggablePill {...props} />\n  return <StaticPill {...props} />\n}\n"],"names":["LinkWithDefault","Link","default","React","useDraggableSortable","baseClass","DraggablePill","props","id","className","attributes","isDragging","listeners","setNodeRef","transform","StaticPill","filter","Boolean","join","elementProps","ref","style","alignIcon","ariaChecked","ariaControls","ariaExpanded","ariaLabel","children","draggable","icon","onClick","pillStyle","rounded","to","classes","Element","aria-checked","aria-controls","aria-expanded","aria-label","href","type","undefined","span","Pill"],"mappings":"AAAA;;AAGA,OAAOA,qBAAqB,eAAc;AAC1C,MAAMC,OAAOD,gBAAgBE,OAAO;AACpC,OAAOC,WAAW,QAAO,CAAC,iDAAiD;AA8B3E,SAASC,oBAAoB,QAAQ,qDAAoD;AACzF,OAAO,eAAc;AAErB,MAAMC,YAAY;AAElB,MAAMC,gBAAqC,CAACC;IAC1C,MAAM,EAAEC,EAAE,EAAEC,SAAS,EAAE,GAAGF;IAE1B,MAAM,EAAEG,UAAU,EAAEC,UAAU,EAAEC,SAAS,EAAEC,UAAU,EAAEC,SAAS,EAAE,GAAGV,qBAAqB;QACxFI;IACF;IAEA,qBACE,KAACO;QACE,GAAGR,KAAK;QACTE,WAAW;YAACE,cAAc,CAAC,EAAEN,UAAU,aAAa,CAAC;YAAEI;SAAU,CAACO,MAAM,CAACC,SAASC,IAAI,CAAC;QACvFC,cAAc;YACZ,GAAGP,SAAS;YACZ,GAAGF,UAAU;YACbU,KAAKP;YACLQ,OAAO;gBACLP;YACF;QACF;;AAGN;AAEA,MAAMC,aAAkC,CAACR;IACvC,MAAM,EACJe,YAAY,OAAO,EACnB,gBAAgBC,WAAW,EAC3B,iBAAiBC,YAAY,EAC7B,iBAAiBC,YAAY,EAC7B,cAAcC,SAAS,EACvBC,QAAQ,EACRlB,SAAS,EACTmB,SAAS,EACTT,YAAY,EACZU,IAAI,EACJC,OAAO,EACPC,YAAY,OAAO,EACnBC,OAAO,EACPC,EAAE,EACH,GAAG1B;IAEJ,MAAM2B,UAAU;QACd7B;QACA,CAAC,EAAEA,UAAU,QAAQ,EAAE0B,UAAU,CAAC;QAClCtB,aAAaA;QACbwB,MAAM,CAAC,EAAE5B,UAAU,UAAU,CAAC;QAC7B4B,CAAAA,MAAMH,OAAM,KAAM,CAAC,EAAEzB,UAAU,YAAY,CAAC;QAC7CwB,QAAQ,CAAC,EAAExB,UAAU,UAAU,CAAC;QAChCwB,QAAQ,CAAC,EAAExB,UAAU,aAAa,EAAEiB,UAAU,CAAC;QAC/CM,aAAa,CAAC,EAAEvB,UAAU,WAAW,CAAC;QACtC2B,WAAW,CAAC,EAAE3B,UAAU,SAAS,CAAC;KACnC,CACEW,MAAM,CAACC,SACPC,IAAI,CAAC;IAER,IAAIiB,UAAqD;IAEzD,IAAIL,WAAW,CAACG,IAAIE,UAAU;IAC9B,IAAIF,IAAIE,UAAUlC;IAElB,qBACE,MAACkC;QACE,GAAGhB,YAAY;QAChBiB,gBAAcb;QACdc,iBAAeb;QACfc,iBAAeb;QACfc,cAAYb;QACZjB,WAAWyB;QACXM,MAAMP,MAAM;QACZH,SAASA;QACTW,MAAMN,YAAY,WAAW,WAAWO;;YAEvCb,QAAQP,cAAc,wBAAU,KAACqB;gBAAKlC,WAAW,CAAC,EAAEJ,UAAU,MAAM,CAAC;0BAAGwB;;0BACzE,KAACc;gBAAKlC,WAAW,CAAC,EAAEJ,UAAU,OAAO,CAAC;0BAAGsB;;YACxCE,QAAQP,cAAc,yBAAW,KAACqB;gBAAKlC,WAAW,CAAC,EAAEJ,UAAU,MAAM,CAAC;0BAAGwB;;;;AAGhF;AAEA,OAAO,MAAMe,OAA4B,CAACrC;IACxC,MAAM,EAAEqB,SAAS,EAAE,GAAGrB;IAEtB,IAAIqB,WAAW,qBAAO,KAACtB;QAAe,GAAGC,KAAK;;IAC9C,qBAAO,KAACQ;QAAY,GAAGR,KAAK;;AAC9B,EAAC"}

package/dist/elements/Pill/index.scss

@@ -111,12 +111,18 @@
   }
 
   &--style-warning {
-    background: var(--theme-warning-500);
+    background: var(--theme-warning-150);
+    color: var(--theme-warning-800);
   }
 
   &--style-success {
-    background: var(--theme-success-500);
-    color: var(--color-base-800);
+    background: var(--theme-success-150);
+    color: var(--theme-success-800);
+  }
+
+  &--style-error {
+    background: var(--theme-error-150);
+    color: var(--theme-error-800);
   }
 
   &--style-dark {
@@ -138,21 +144,3 @@
     }
   }
 }
-
-html[data-theme='dark'] {
-  .pill {
-    &--style-error {
-      background: var(--theme-error-500);
-      color: var(--color-base-1000);
-    }
-  }
-}
-
-html[data-theme='light'] {
-  .pill {
-    &--style-error {
-      background: var(--theme-error-250);
-      color: var(--theme-error-750);
-    }
-  }
-}

package/dist/elements/Popup/PopupButtonList/index.js

@@ -2,6 +2,7 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import LinkImport from 'next/link.js';
 import * as React from 'react'; // TODO: abstract this out to support all routers
+import './index.scss';
 const Link = LinkImport.default || LinkImport;
 const baseClass = 'popup-button-list';
 export const ButtonGroup = ({ buttonSize = 'default', children, className, textAlign = 'left' })=>{

package/dist/elements/Popup/PopupButtonList/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/elements/Popup/PopupButtonList/index.tsx"],"sourcesContent":["'use client'\n// TODO: abstract the `next/link` dependency out from this component\nimport type { LinkProps } from 'next/link.js'\n\nimport LinkImport from 'next/link.js'\nimport * as React from 'react' // TODO: abstract this out to support all routers\n\nimport './index.scss'\n\nconst Link = (LinkImport.default || LinkImport) as unknown as typeof LinkImport.default\n\nconst baseClass = 'popup-button-list'\n\nexport const ButtonGroup: React.FC<{\n  buttonSize?: 'default' | 'small'\n  children: React.ReactNode\n  className?: string\n  textAlign?: 'center' | 'left' | 'right'\n}> = ({ buttonSize = 'default', children, className, textAlign = 'left' }) => {\n  const classes = [\n    baseClass,\n    className,\n    `${baseClass}__text-align--${textAlign}`,\n    `${baseClass}__button-size--${buttonSize}`,\n  ]\n    .filter(Boolean)\n    .join(' ')\n  return <div className={classes}>{children}</div>\n}\n\ntype MenuButtonProps = {\n  active?: boolean\n  children: React.ReactNode\n  className?: string\n  href?: LinkProps['href']\n  id?: string\n  onClick?: () => void\n}\n\nexport const Button: React.FC<MenuButtonProps> = ({\n  id,\n  active,\n  children,\n  className,\n  href,\n  onClick,\n}) => {\n  const classes = [`${baseClass}__button`, active && `${baseClass}__button--selected`, className]\n    .filter(Boolean)\n    .join(' ')\n\n  if (href) {\n    return (\n      <Link\n        className={classes}\n        href={href}\n        id={id}\n        onClick={() => {\n          if (onClick) {\n            onClick()\n          }\n        }}\n      >\n        {children}\n      </Link>\n    )\n  }\n\n  if (onClick) {\n    return (\n      <button\n        className={classes}\n        id={id}\n        onClick={() => {\n          if (onClick) {\n            onClick()\n          }\n        }}\n        type=\"button\"\n      >\n        {children}\n      </button>\n    )\n  }\n\n  return (\n    <div className={classes} id={id}>\n      {children}\n    </div>\n  )\n}\n"],"names":["LinkImport","React","Link","default","baseClass","ButtonGroup","buttonSize","children","className","textAlign","classes","filter","Boolean","join","div","Button","id","active","href","onClick","button","type"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;;AAIA,OAAOA,gBAAgB,eAAc;AACrC,YAAYC,WAAW,QAAO,CAAC,iDAAiD;AAIhF,MAAMC,OAAQF,WAAWG,OAAO,IAAIH;AAEpC,MAAMI,YAAY;AAElB,OAAO,MAAMC,cAKR,CAAC,EAAEC,aAAa,SAAS,EAAEC,QAAQ,EAAEC,SAAS,EAAEC,YAAY,MAAM,EAAE;IACvE,MAAMC,UAAU;QACdN;QACAI;QACA,CAAC,EAAEJ,UAAU,cAAc,EAAEK,UAAU,CAAC;QACxC,CAAC,EAAEL,UAAU,eAAe,EAAEE,WAAW,CAAC;KAC3C,CACEK,MAAM,CAACC,SACPC,IAAI,CAAC;IACR,qBAAO,KAACC;QAAIN,WAAWE;kBAAUH;;AACnC,EAAC;AAWD,OAAO,MAAMQ,SAAoC,CAAC,EAChDC,EAAE,EACFC,MAAM,EACNV,QAAQ,EACRC,SAAS,EACTU,IAAI,EACJC,OAAO,EACR;IACC,MAAMT,UAAU;QAAC,CAAC,EAAEN,UAAU,QAAQ,CAAC;QAAEa,UAAU,CAAC,EAAEb,UAAU,kBAAkB,CAAC;QAAEI;KAAU,CAC5FG,MAAM,CAACC,SACPC,IAAI,CAAC;IAER,IAAIK,MAAM;QACR,qBACE,KAAChB;YACCM,WAAWE;YACXQ,MAAMA;YACNF,IAAIA;YACJG,SAAS;gBACP,IAAIA,SAAS;oBACXA;gBACF;YACF;sBAECZ;;IAGP;IAEA,IAAIY,SAAS;QACX,qBACE,KAACC;YACCZ,WAAWE;YACXM,IAAIA;YACJG,SAAS;gBACP,IAAIA,SAAS;oBACXA;gBACF;YACF;YACAE,MAAK;sBAEJd;;IAGP;IAEA,qBACE,KAACO;QAAIN,WAAWE;QAASM,IAAIA;kBAC1BT;;AAGP,EAAC"}
+{"version":3,"sources":["../../../../src/elements/Popup/PopupButtonList/index.tsx"],"sourcesContent":["'use client'\n// TODO: abstract the `next/link` dependency out from this component\nimport type { LinkProps } from 'next/link.js'\n\nimport LinkImport from 'next/link.js'\nimport * as React from 'react' // TODO: abstract this out to support all routers\n\nimport './index.scss'\n\nconst Link = (LinkImport.default || LinkImport) as unknown as typeof LinkImport.default\n\nconst baseClass = 'popup-button-list'\n\nexport const ButtonGroup: React.FC<{\n  buttonSize?: 'default' | 'small'\n  children: React.ReactNode\n  className?: string\n  textAlign?: 'center' | 'left' | 'right'\n}> = ({ buttonSize = 'default', children, className, textAlign = 'left' }) => {\n  const classes = [\n    baseClass,\n    className,\n    `${baseClass}__text-align--${textAlign}`,\n    `${baseClass}__button-size--${buttonSize}`,\n  ]\n    .filter(Boolean)\n    .join(' ')\n  return <div className={classes}>{children}</div>\n}\n\ntype MenuButtonProps = {\n  active?: boolean\n  children: React.ReactNode\n  className?: string\n  href?: LinkProps['href']\n  id?: string\n  onClick?: () => void\n}\n\nexport const Button: React.FC<MenuButtonProps> = ({\n  id,\n  active,\n  children,\n  className,\n  href,\n  onClick,\n}) => {\n  const classes = [`${baseClass}__button`, active && `${baseClass}__button--selected`, className]\n    .filter(Boolean)\n    .join(' ')\n\n  if (href) {\n    return (\n      <Link\n        className={classes}\n        href={href}\n        id={id}\n        onClick={() => {\n          if (onClick) {\n            onClick()\n          }\n        }}\n      >\n        {children}\n      </Link>\n    )\n  }\n\n  if (onClick) {\n    return (\n      <button\n        className={classes}\n        id={id}\n        onClick={() => {\n          if (onClick) {\n            onClick()\n          }\n        }}\n        type=\"button\"\n      >\n        {children}\n      </button>\n    )\n  }\n\n  return (\n    <div className={classes} id={id}>\n      {children}\n    </div>\n  )\n}\n"],"names":["LinkImport","React","Link","default","baseClass","ButtonGroup","buttonSize","children","className","textAlign","classes","filter","Boolean","join","div","Button","id","active","href","onClick","button","type"],"mappings":"AAAA;;AAIA,OAAOA,gBAAgB,eAAc;AACrC,YAAYC,WAAW,QAAO,CAAC,iDAAiD;AAEhF,OAAO,eAAc;AAErB,MAAMC,OAAQF,WAAWG,OAAO,IAAIH;AAEpC,MAAMI,YAAY;AAElB,OAAO,MAAMC,cAKR,CAAC,EAAEC,aAAa,SAAS,EAAEC,QAAQ,EAAEC,SAAS,EAAEC,YAAY,MAAM,EAAE;IACvE,MAAMC,UAAU;QACdN;QACAI;QACA,CAAC,EAAEJ,UAAU,cAAc,EAAEK,UAAU,CAAC;QACxC,CAAC,EAAEL,UAAU,eAAe,EAAEE,WAAW,CAAC;KAC3C,CACEK,MAAM,CAACC,SACPC,IAAI,CAAC;IACR,qBAAO,KAACC;QAAIN,WAAWE;kBAAUH;;AACnC,EAAC;AAWD,OAAO,MAAMQ,SAAoC,CAAC,EAChDC,EAAE,EACFC,MAAM,EACNV,QAAQ,EACRC,SAAS,EACTU,IAAI,EACJC,OAAO,EACR;IACC,MAAMT,UAAU;QAAC,CAAC,EAAEN,UAAU,QAAQ,CAAC;QAAEa,UAAU,CAAC,EAAEb,UAAU,kBAAkB,CAAC;QAAEI;KAAU,CAC5FG,MAAM,CAACC,SACPC,IAAI,CAAC;IAER,IAAIK,MAAM;QACR,qBACE,KAAChB;YACCM,WAAWE;YACXQ,MAAMA;YACNF,IAAIA;YACJG,SAAS;gBACP,IAAIA,SAAS;oBACXA;gBACF;YACF;sBAECZ;;IAGP;IAEA,IAAIY,SAAS;QACX,qBACE,KAACC;YACCZ,WAAWE;YACXM,IAAIA;YACJG,SAAS;gBACP,IAAIA,SAAS;oBACXA;gBACF;YACF;YACAE,MAAK;sBAEJd;;IAGP;IAEA,qBACE,KAACO;QAAIN,WAAWE;QAASM,IAAIA;kBAC1BT;;AAGP,EAAC"}

package/dist/elements/Popup/PopupTrigger/index.js

@@ -1,6 +1,7 @@
 'use client';
 import { jsx as _jsx } from "react/jsx-runtime";
 import React from 'react';
+import './index.scss';
 const baseClass = 'popup-button';
 export const PopupTrigger = (props)=>{
     const { active, button, buttonType, className, setActive } = props;

package/dist/elements/Popup/PopupTrigger/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/elements/Popup/PopupTrigger/index.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\n\nimport './index.scss'\n\nconst baseClass = 'popup-button'\n\nexport type PopupTriggerProps = {\n  active: boolean\n  button: React.ReactNode\n  buttonType: 'custom' | 'default' | 'none'\n  className?: string\n  setActive: (active: boolean) => void\n}\n\nexport const PopupTrigger: React.FC<PopupTriggerProps> = (props) => {\n  const { active, button, buttonType, className, setActive } = props\n\n  const classes = [baseClass, className, `${baseClass}--${buttonType}`].filter(Boolean).join(' ')\n\n  const handleClick = () => {\n    setActive(!active)\n  }\n\n  if (buttonType === 'none') {\n    return null\n  }\n\n  if (buttonType === 'custom') {\n    return (\n      <div\n        className={classes}\n        onClick={handleClick}\n        onKeyDown={(e) => {\n          if (e.key === 'Enter') handleClick()\n        }}\n        role=\"button\"\n        tabIndex={0}\n      >\n        {button}\n      </div>\n    )\n  }\n\n  return (\n    <button className={classes} onClick={() => setActive(!active)} tabIndex={0} type=\"button\">\n      {button}\n    </button>\n  )\n}\n"],"names":["React","baseClass","PopupTrigger","props","active","button","buttonType","className","setActive","classes","filter","Boolean","join","handleClick","div","onClick","onKeyDown","e","key","role","tabIndex","type"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;;AACA,OAAOA,WAAW,QAAO;AAIzB,MAAMC,YAAY;AAUlB,OAAO,MAAMC,eAA4C,CAACC;IACxD,MAAM,EAAEC,MAAM,EAAEC,MAAM,EAAEC,UAAU,EAAEC,SAAS,EAAEC,SAAS,EAAE,GAAGL;IAE7D,MAAMM,UAAU;QAACR;QAAWM;QAAW,CAAC,EAAEN,UAAU,EAAE,EAAEK,WAAW,CAAC;KAAC,CAACI,MAAM,CAACC,SAASC,IAAI,CAAC;IAE3F,MAAMC,cAAc;QAClBL,UAAU,CAACJ;IACb;IAEA,IAAIE,eAAe,QAAQ;QACzB,OAAO;IACT;IAEA,IAAIA,eAAe,UAAU;QAC3B,qBACE,KAACQ;YACCP,WAAWE;YACXM,SAASF;YACTG,WAAW,CAACC;gBACV,IAAIA,EAAEC,GAAG,KAAK,SAASL;YACzB;YACAM,MAAK;YACLC,UAAU;sBAETf;;IAGP;IAEA,qBACE,KAACA;QAAOE,WAAWE;QAASM,SAAS,IAAMP,UAAU,CAACJ;QAASgB,UAAU;QAAGC,MAAK;kBAC9EhB;;AAGP,EAAC"}
+{"version":3,"sources":["../../../../src/elements/Popup/PopupTrigger/index.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\n\nimport './index.scss'\n\nconst baseClass = 'popup-button'\n\nexport type PopupTriggerProps = {\n  active: boolean\n  button: React.ReactNode\n  buttonType: 'custom' | 'default' | 'none'\n  className?: string\n  setActive: (active: boolean) => void\n}\n\nexport const PopupTrigger: React.FC<PopupTriggerProps> = (props) => {\n  const { active, button, buttonType, className, setActive } = props\n\n  const classes = [baseClass, className, `${baseClass}--${buttonType}`].filter(Boolean).join(' ')\n\n  const handleClick = () => {\n    setActive(!active)\n  }\n\n  if (buttonType === 'none') {\n    return null\n  }\n\n  if (buttonType === 'custom') {\n    return (\n      <div\n        className={classes}\n        onClick={handleClick}\n        onKeyDown={(e) => {\n          if (e.key === 'Enter') handleClick()\n        }}\n        role=\"button\"\n        tabIndex={0}\n      >\n        {button}\n      </div>\n    )\n  }\n\n  return (\n    <button className={classes} onClick={() => setActive(!active)} tabIndex={0} type=\"button\">\n      {button}\n    </button>\n  )\n}\n"],"names":["React","baseClass","PopupTrigger","props","active","button","buttonType","className","setActive","classes","filter","Boolean","join","handleClick","div","onClick","onKeyDown","e","key","role","tabIndex","type"],"mappings":"AAAA;;AACA,OAAOA,WAAW,QAAO;AAEzB,OAAO,eAAc;AAErB,MAAMC,YAAY;AAUlB,OAAO,MAAMC,eAA4C,CAACC;IACxD,MAAM,EAAEC,MAAM,EAAEC,MAAM,EAAEC,UAAU,EAAEC,SAAS,EAAEC,SAAS,EAAE,GAAGL;IAE7D,MAAMM,UAAU;QAACR;QAAWM;QAAW,CAAC,EAAEN,UAAU,EAAE,EAAEK,WAAW,CAAC;KAAC,CAACI,MAAM,CAACC,SAASC,IAAI,CAAC;IAE3F,MAAMC,cAAc;QAClBL,UAAU,CAACJ;IACb;IAEA,IAAIE,eAAe,QAAQ;QACzB,OAAO;IACT;IAEA,IAAIA,eAAe,UAAU;QAC3B,qBACE,KAACQ;YACCP,WAAWE;YACXM,SAASF;YACTG,WAAW,CAACC;gBACV,IAAIA,EAAEC,GAAG,KAAK,SAASL;YACzB;YACAM,MAAK;YACLC,UAAU;sBAETf;;IAGP;IAEA,qBACE,KAACA;QAAOE,WAAWE;QAASM,SAAS,IAAMP,UAAU,CAACJ;QAASgB,UAAU;QAAGC,MAAK;kBAC9EhB;;AAGP,EAAC"}

package/dist/elements/Popup/PopupTrigger/types.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/elements/Popup/PopupTrigger/types.ts"],"names":[],"rangeMappings":"","mappings":""}
+{"version":3,"sources":["../../../../src/elements/Popup/PopupTrigger/types.ts"],"names":[],"mappings":""}

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/Popup/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAA;AAE1C,OAAO,KAAK,SAAS,MAAM,4BAA4B,CAAA;AAGvD,OAAO,KAAmD,MAAM,OAAO,CAAA;AAIvE,OAAO,cAAc,CAAA;AAIrB,MAAM,MAAM,UAAU,GAAG;IACvB,eAAe,CAAC,EAAE,aAAa,CAAC,iBAAiB,CAAC,CAAA;IAClD,WAAW,CAAC,EAAE,KAAK,CAAC,gBAAgB,CAAC,WAAW,CAAC,CAAA;IACjD,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACxB,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,UAAU,CAAC,EAAE,QAAQ,GAAG,SAAS,GAAG,MAAM,CAAA;IAC1C,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,eAAe,CAAC,EAAE,QAAQ,GAAG,MAAM,GAAG,OAAO,CAAA;IAC7C,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAA;IACxC,MAAM,CAAC,EAAE,CAAC,GAAG,KAAA,KAAK,KAAK,CAAC,SAAS,CAAA;IACjC,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB,IAAI,CAAC,EAAE,aAAa,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAA;IACnD,aAAa,CAAC,EAAE,QAAQ,GAAG,KAAK,CAAA;CACjC,CAAA;AAED,eAAO,MAAM,KAAK,EAAE,KAAK,CAAC,EAAE,CAAC,UAAU,CAkKtC,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/Popup/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAA;AAE1C,OAAO,KAAK,SAAS,MAAM,4BAA4B,CAAA;AAGvD,OAAO,KAAmD,MAAM,OAAO,CAAA;AAIvE,OAAO,cAAc,CAAA;AAIrB,MAAM,MAAM,UAAU,GAAG;IACvB,eAAe,CAAC,EAAE,aAAa,CAAC,iBAAiB,CAAC,CAAA;IAClD,WAAW,CAAC,EAAE,KAAK,CAAC,gBAAgB,CAAC,WAAW,CAAC,CAAA;IACjD,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACxB,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,UAAU,CAAC,EAAE,QAAQ,GAAG,SAAS,GAAG,MAAM,CAAA;IAC1C,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,eAAe,CAAC,EAAE,QAAQ,GAAG,MAAM,GAAG,OAAO,CAAA;IAC7C,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAA;IACxC,MAAM,CAAC,EAAE,CAAC,GAAG,KAAA,KAAK,KAAK,CAAC,SAAS,CAAA;IACjC,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB,IAAI,CAAC,EAAE,aAAa,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAA;IACnD,aAAa,CAAC,EAAE,QAAQ,GAAG,KAAK,CAAA;CACjC,CAAA;AAED,eAAO,MAAM,KAAK,EAAE,KAAK,CAAC,EAAE,CAAC,UAAU,CAgKtC,CAAA"}

package/dist/elements/Popup/index.js

@@ -1,14 +1,14 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 export * as PopupList from './PopupButtonList/index.js';
-import * as facelessUIImport from '@faceless-ui/window-info';
+import { useWindowInfo } from '@faceless-ui/window-info';
 import React, { useCallback, useEffect, useRef, useState } from 'react';
 import { useIntersect } from '../../hooks/useIntersect.js';
 import { PopupTrigger } from './PopupTrigger/index.js';
+import './index.scss';
 const baseClass = 'popup';
 export const Popup = (props)=>{
     const { boundingRef, button, buttonClassName, buttonType = 'default', caret = true, children, className, forceOpen, horizontalAlign: horizontalAlignFromProps = 'left', initActive = false, onToggleOpen, render, showOnHover = false, showScrollbar = false, size = 'medium', verticalAlign: verticalAlignFromProps = 'top' } = props;
-    const { useWindowInfo } = facelessUIImport;
     const { height: windowHeight, width: windowWidth } = useWindowInfo();
     const [intersectionRef, intersectionEntry] = useIntersect({
         root: boundingRef?.current || null,

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/Popup/index.tsx"],"sourcesContent":["'use client'\nimport type { CSSProperties } from 'react'\n\nexport * as PopupList from './PopupButtonList/index.js'\n\nimport * as facelessUIImport from '@faceless-ui/window-info'\nimport React, { useCallback, useEffect, useRef, useState } from 'react'\n\nimport { useIntersect } from '../../hooks/useIntersect.js'\nimport { PopupTrigger } from './PopupTrigger/index.js'\nimport './index.scss'\n\nconst baseClass = 'popup'\n\nexport type PopupProps = {\n  backgroundColor?: CSSProperties['backgroundColor']\n  boundingRef?: React.MutableRefObject<HTMLElement>\n  button?: React.ReactNode\n  buttonClassName?: string\n  buttonType?: 'custom' | 'default' | 'none'\n  caret?: boolean\n  children?: React.ReactNode\n  className?: string\n  forceOpen?: boolean\n  horizontalAlign?: 'center' | 'left' | 'right'\n  initActive?: boolean\n  onToggleOpen?: (active: boolean) => void\n  render?: (any) => React.ReactNode\n  showOnHover?: boolean\n  showScrollbar?: boolean\n  size?: 'fit-content' | 'large' | 'medium' | 'small'\n  verticalAlign?: 'bottom' | 'top'\n}\n\nexport const Popup: React.FC<PopupProps> = (props) => {\n  const {\n    boundingRef,\n    button,\n    buttonClassName,\n    buttonType = 'default',\n    caret = true,\n    children,\n    className,\n    forceOpen,\n    horizontalAlign: horizontalAlignFromProps = 'left',\n    initActive = false,\n    onToggleOpen,\n    render,\n    showOnHover = false,\n    showScrollbar = false,\n    size = 'medium',\n    verticalAlign: verticalAlignFromProps = 'top',\n  } = props\n  const { useWindowInfo } = facelessUIImport\n\n  const { height: windowHeight, width: windowWidth } = useWindowInfo()\n  const [intersectionRef, intersectionEntry] = useIntersect({\n    root: boundingRef?.current || null,\n    rootMargin: '-100px 0px 0px 0px',\n    threshold: 1,\n  })\n\n  const contentRef = useRef(null)\n  const [active, setActive] = useState(initActive)\n  const [verticalAlign, setVerticalAlign] = useState(verticalAlignFromProps)\n  const [horizontalAlign, setHorizontalAlign] = useState(horizontalAlignFromProps)\n\n  const setPosition = useCallback(\n    ({ horizontal = false, vertical = false }) => {\n      if (contentRef.current) {\n        const bounds = contentRef.current.getBoundingClientRect()\n\n        const {\n          bottom: contentBottomPos,\n          left: contentLeftPos,\n          right: contentRightPos,\n          top: contentTopPos,\n        } = bounds\n\n        let boundingTopPos = 100\n        let boundingRightPos = document.documentElement.clientWidth\n        let boundingBottomPos = document.documentElement.clientHeight\n        let boundingLeftPos = 0\n\n        if (boundingRef?.current) {\n          ;({\n            bottom: boundingBottomPos,\n            left: boundingLeftPos,\n            right: boundingRightPos,\n            top: boundingTopPos,\n          } = boundingRef.current.getBoundingClientRect())\n        }\n\n        if (horizontal) {\n          if (contentRightPos > boundingRightPos && contentLeftPos > boundingLeftPos) {\n            setHorizontalAlign('right')\n          } else if (contentLeftPos < boundingLeftPos && contentRightPos < boundingRightPos) {\n            setHorizontalAlign('left')\n          }\n        }\n\n        if (vertical) {\n          if (contentTopPos < boundingTopPos && contentBottomPos < boundingBottomPos) {\n            setVerticalAlign('bottom')\n          } else if (contentBottomPos > boundingBottomPos && contentTopPos > boundingTopPos) {\n            setVerticalAlign('top')\n          }\n        }\n      }\n    },\n    [boundingRef],\n  )\n\n  const handleClickOutside = useCallback(\n    (e) => {\n      if (contentRef.current.contains(e.target)) {\n        return\n      }\n\n      setActive(false)\n    },\n    [contentRef],\n  )\n\n  useEffect(() => {\n    setPosition({ horizontal: true })\n  }, [intersectionEntry, setPosition, windowWidth])\n\n  useEffect(() => {\n    setPosition({ vertical: true })\n  }, [intersectionEntry, setPosition, windowHeight])\n\n  useEffect(() => {\n    if (typeof onToggleOpen === 'function') onToggleOpen(active)\n\n    if (active) {\n      document.addEventListener('mousedown', handleClickOutside)\n    } else {\n      document.removeEventListener('mousedown', handleClickOutside)\n    }\n\n    return () => {\n      document.removeEventListener('mousedown', handleClickOutside)\n    }\n  }, [active, handleClickOutside, onToggleOpen])\n\n  useEffect(() => {\n    setActive(forceOpen)\n  }, [forceOpen])\n\n  const classes = [\n    baseClass,\n    className,\n    `${baseClass}--size-${size}`,\n    `${baseClass}--v-align-${verticalAlign}`,\n    `${baseClass}--h-align-${horizontalAlign}`,\n    active && `${baseClass}--active`,\n    showScrollbar && `${baseClass}--show-scrollbar`,\n  ]\n    .filter(Boolean)\n    .join(' ')\n\n  return (\n    <div className={classes}>\n      <div className={`${baseClass}__trigger-wrap`}>\n        {showOnHover ? (\n          <div\n            className={`${baseClass}__on-hover-watch`}\n            onMouseEnter={() => setActive(true)}\n            onMouseLeave={() => setActive(false)}\n          >\n            <PopupTrigger\n              {...{ active, button, buttonType, className: buttonClassName, setActive }}\n            />\n          </div>\n        ) : (\n          <PopupTrigger\n            {...{ active, button, buttonType, className: buttonClassName, setActive }}\n          />\n        )}\n      </div>\n\n      <div className={`${baseClass}__content`} ref={contentRef}>\n        <div className={`${baseClass}__hide-scrollbar`} ref={intersectionRef}>\n          <div className={`${baseClass}__scroll-container`}>\n            <div className={`${baseClass}__scroll-content`}>\n              {render && render({ close: () => setActive(false) })}\n              {children && children}\n            </div>\n          </div>\n        </div>\n\n        {caret && <div className={`${baseClass}__caret`} />}\n      </div>\n    </div>\n  )\n}\n"],"names":["PopupList","facelessUIImport","React","useCallback","useEffect","useRef","useState","useIntersect","PopupTrigger","baseClass","Popup","props","boundingRef","button","buttonClassName","buttonType","caret","children","className","forceOpen","horizontalAlign","horizontalAlignFromProps","initActive","onToggleOpen","render","showOnHover","showScrollbar","size","verticalAlign","verticalAlignFromProps","useWindowInfo","height","windowHeight","width","windowWidth","intersectionRef","intersectionEntry","root","current","rootMargin","threshold","contentRef","active","setActive","setVerticalAlign","setHorizontalAlign","setPosition","horizontal","vertical","bounds","getBoundingClientRect","bottom","contentBottomPos","left","contentLeftPos","right","contentRightPos","top","contentTopPos","boundingTopPos","boundingRightPos","document","documentElement","clientWidth","boundingBottomPos","clientHeight","boundingLeftPos","handleClickOutside","e","contains","target","addEventListener","removeEventListener","classes","filter","Boolean","join","div","onMouseEnter","onMouseLeave","ref","close"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
+{"version":3,"sources":["../../../src/elements/Popup/index.tsx"],"sourcesContent":["'use client'\nimport type { CSSProperties } from 'react'\n\nexport * as PopupList from './PopupButtonList/index.js'\n\nimport { useWindowInfo } from '@faceless-ui/window-info'\nimport React, { useCallback, useEffect, useRef, useState } from 'react'\n\nimport { useIntersect } from '../../hooks/useIntersect.js'\nimport { PopupTrigger } from './PopupTrigger/index.js'\nimport './index.scss'\n\nconst baseClass = 'popup'\n\nexport type PopupProps = {\n  backgroundColor?: CSSProperties['backgroundColor']\n  boundingRef?: React.MutableRefObject<HTMLElement>\n  button?: React.ReactNode\n  buttonClassName?: string\n  buttonType?: 'custom' | 'default' | 'none'\n  caret?: boolean\n  children?: React.ReactNode\n  className?: string\n  forceOpen?: boolean\n  horizontalAlign?: 'center' | 'left' | 'right'\n  initActive?: boolean\n  onToggleOpen?: (active: boolean) => void\n  render?: (any) => React.ReactNode\n  showOnHover?: boolean\n  showScrollbar?: boolean\n  size?: 'fit-content' | 'large' | 'medium' | 'small'\n  verticalAlign?: 'bottom' | 'top'\n}\n\nexport const Popup: React.FC<PopupProps> = (props) => {\n  const {\n    boundingRef,\n    button,\n    buttonClassName,\n    buttonType = 'default',\n    caret = true,\n    children,\n    className,\n    forceOpen,\n    horizontalAlign: horizontalAlignFromProps = 'left',\n    initActive = false,\n    onToggleOpen,\n    render,\n    showOnHover = false,\n    showScrollbar = false,\n    size = 'medium',\n    verticalAlign: verticalAlignFromProps = 'top',\n  } = props\n  const { height: windowHeight, width: windowWidth } = useWindowInfo()\n  const [intersectionRef, intersectionEntry] = useIntersect({\n    root: boundingRef?.current || null,\n    rootMargin: '-100px 0px 0px 0px',\n    threshold: 1,\n  })\n\n  const contentRef = useRef(null)\n  const [active, setActive] = useState(initActive)\n  const [verticalAlign, setVerticalAlign] = useState(verticalAlignFromProps)\n  const [horizontalAlign, setHorizontalAlign] = useState(horizontalAlignFromProps)\n\n  const setPosition = useCallback(\n    ({ horizontal = false, vertical = false }) => {\n      if (contentRef.current) {\n        const bounds = contentRef.current.getBoundingClientRect()\n\n        const {\n          bottom: contentBottomPos,\n          left: contentLeftPos,\n          right: contentRightPos,\n          top: contentTopPos,\n        } = bounds\n\n        let boundingTopPos = 100\n        let boundingRightPos = document.documentElement.clientWidth\n        let boundingBottomPos = document.documentElement.clientHeight\n        let boundingLeftPos = 0\n\n        if (boundingRef?.current) {\n          ;({\n            bottom: boundingBottomPos,\n            left: boundingLeftPos,\n            right: boundingRightPos,\n            top: boundingTopPos,\n          } = boundingRef.current.getBoundingClientRect())\n        }\n\n        if (horizontal) {\n          if (contentRightPos > boundingRightPos && contentLeftPos > boundingLeftPos) {\n            setHorizontalAlign('right')\n          } else if (contentLeftPos < boundingLeftPos && contentRightPos < boundingRightPos) {\n            setHorizontalAlign('left')\n          }\n        }\n\n        if (vertical) {\n          if (contentTopPos < boundingTopPos && contentBottomPos < boundingBottomPos) {\n            setVerticalAlign('bottom')\n          } else if (contentBottomPos > boundingBottomPos && contentTopPos > boundingTopPos) {\n            setVerticalAlign('top')\n          }\n        }\n      }\n    },\n    [boundingRef],\n  )\n\n  const handleClickOutside = useCallback(\n    (e) => {\n      if (contentRef.current.contains(e.target)) {\n        return\n      }\n\n      setActive(false)\n    },\n    [contentRef],\n  )\n\n  useEffect(() => {\n    setPosition({ horizontal: true })\n  }, [intersectionEntry, setPosition, windowWidth])\n\n  useEffect(() => {\n    setPosition({ vertical: true })\n  }, [intersectionEntry, setPosition, windowHeight])\n\n  useEffect(() => {\n    if (typeof onToggleOpen === 'function') onToggleOpen(active)\n\n    if (active) {\n      document.addEventListener('mousedown', handleClickOutside)\n    } else {\n      document.removeEventListener('mousedown', handleClickOutside)\n    }\n\n    return () => {\n      document.removeEventListener('mousedown', handleClickOutside)\n    }\n  }, [active, handleClickOutside, onToggleOpen])\n\n  useEffect(() => {\n    setActive(forceOpen)\n  }, [forceOpen])\n\n  const classes = [\n    baseClass,\n    className,\n    `${baseClass}--size-${size}`,\n    `${baseClass}--v-align-${verticalAlign}`,\n    `${baseClass}--h-align-${horizontalAlign}`,\n    active && `${baseClass}--active`,\n    showScrollbar && `${baseClass}--show-scrollbar`,\n  ]\n    .filter(Boolean)\n    .join(' ')\n\n  return (\n    <div className={classes}>\n      <div className={`${baseClass}__trigger-wrap`}>\n        {showOnHover ? (\n          <div\n            className={`${baseClass}__on-hover-watch`}\n            onMouseEnter={() => setActive(true)}\n            onMouseLeave={() => setActive(false)}\n          >\n            <PopupTrigger\n              {...{ active, button, buttonType, className: buttonClassName, setActive }}\n            />\n          </div>\n        ) : (\n          <PopupTrigger\n            {...{ active, button, buttonType, className: buttonClassName, setActive }}\n          />\n        )}\n      </div>\n\n      <div className={`${baseClass}__content`} ref={contentRef}>\n        <div className={`${baseClass}__hide-scrollbar`} ref={intersectionRef}>\n          <div className={`${baseClass}__scroll-container`}>\n            <div className={`${baseClass}__scroll-content`}>\n              {render && render({ close: () => setActive(false) })}\n              {children && children}\n            </div>\n          </div>\n        </div>\n\n        {caret && <div className={`${baseClass}__caret`} />}\n      </div>\n    </div>\n  )\n}\n"],"names":["PopupList","useWindowInfo","React","useCallback","useEffect","useRef","useState","useIntersect","PopupTrigger","baseClass","Popup","props","boundingRef","button","buttonClassName","buttonType","caret","children","className","forceOpen","horizontalAlign","horizontalAlignFromProps","initActive","onToggleOpen","render","showOnHover","showScrollbar","size","verticalAlign","verticalAlignFromProps","height","windowHeight","width","windowWidth","intersectionRef","intersectionEntry","root","current","rootMargin","threshold","contentRef","active","setActive","setVerticalAlign","setHorizontalAlign","setPosition","horizontal","vertical","bounds","getBoundingClientRect","bottom","contentBottomPos","left","contentLeftPos","right","contentRightPos","top","contentTopPos","boundingTopPos","boundingRightPos","document","documentElement","clientWidth","boundingBottomPos","clientHeight","boundingLeftPos","handleClickOutside","e","contains","target","addEventListener","removeEventListener","classes","filter","Boolean","join","div","onMouseEnter","onMouseLeave","ref","close"],"mappings":"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"}

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/PreviewButton/index.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\n\nimport { Button } from '../Button/index.js'\nimport { usePreviewURL } from './usePreviewURL.js'\n\nconst baseClass = 'preview-btn'\n\nconst DefaultPreviewButton: React.FC = () => {\n  const { generatePreviewURL, label } = usePreviewURL()\n\n  return (\n    <Button\n      buttonStyle=\"secondary\"\n      className={baseClass}\n      // disabled={disabled}\n      onClick={() =>\n        generatePreviewURL({\n          openPreviewWindow: true,\n        })\n      }\n      size=\"small\"\n    >\n      {label}\n    </Button>\n  )\n}\n\ntype Props = {\n  CustomComponent?: React.ReactNode\n}\n\nexport const PreviewButton: React.FC<Props> = ({ CustomComponent }) => {\n  if (CustomComponent) return CustomComponent\n\n  return <DefaultPreviewButton />\n}\n"],"names":["React","Button","usePreviewURL","baseClass","DefaultPreviewButton","generatePreviewURL","label","buttonStyle","className","onClick","openPreviewWindow","size","PreviewButton","CustomComponent"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;;AACA,OAAOA,WAAW,QAAO;AAEzB,SAASC,MAAM,QAAQ,qBAAoB;AAC3C,SAASC,aAAa,QAAQ,qBAAoB;AAElD,MAAMC,YAAY;AAElB,MAAMC,uBAAiC;IACrC,MAAM,EAAEC,kBAAkB,EAAEC,KAAK,EAAE,GAAGJ;IAEtC,qBACE,KAACD;QACCM,aAAY;QACZC,WAAWL;QACX,sBAAsB;QACtBM,SAAS,IACPJ,mBAAmB;gBACjBK,mBAAmB;YACrB;QAEFC,MAAK;kBAEJL;;AAGP;AAMA,OAAO,MAAMM,gBAAiC,CAAC,EAAEC,eAAe,EAAE;IAChE,IAAIA,iBAAiB,OAAOA;IAE5B,qBAAO,KAACT;AACV,EAAC"}
+{"version":3,"sources":["../../../src/elements/PreviewButton/index.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\n\nimport { Button } from '../Button/index.js'\nimport { usePreviewURL } from './usePreviewURL.js'\n\nconst baseClass = 'preview-btn'\n\nconst DefaultPreviewButton: React.FC = () => {\n  const { generatePreviewURL, label } = usePreviewURL()\n\n  return (\n    <Button\n      buttonStyle=\"secondary\"\n      className={baseClass}\n      // disabled={disabled}\n      onClick={() =>\n        generatePreviewURL({\n          openPreviewWindow: true,\n        })\n      }\n      size=\"small\"\n    >\n      {label}\n    </Button>\n  )\n}\n\ntype Props = {\n  CustomComponent?: React.ReactNode\n}\n\nexport const PreviewButton: React.FC<Props> = ({ CustomComponent }) => {\n  if (CustomComponent) return CustomComponent\n\n  return <DefaultPreviewButton />\n}\n"],"names":["React","Button","usePreviewURL","baseClass","DefaultPreviewButton","generatePreviewURL","label","buttonStyle","className","onClick","openPreviewWindow","size","PreviewButton","CustomComponent"],"mappings":"AAAA;;AACA,OAAOA,WAAW,QAAO;AAEzB,SAASC,MAAM,QAAQ,qBAAoB;AAC3C,SAASC,aAAa,QAAQ,qBAAoB;AAElD,MAAMC,YAAY;AAElB,MAAMC,uBAAiC;IACrC,MAAM,EAAEC,kBAAkB,EAAEC,KAAK,EAAE,GAAGJ;IAEtC,qBACE,KAACD;QACCM,aAAY;QACZC,WAAWL;QACX,sBAAsB;QACtBM,SAAS,IACPJ,mBAAmB;gBACjBK,mBAAmB;YACrB;QAEFC,MAAK;kBAEJL;;AAGP;AAMA,OAAO,MAAMM,gBAAiC,CAAC,EAAEC,eAAe,EAAE;IAChE,IAAIA,iBAAiB,OAAOA;IAE5B,qBAAO,KAACT;AACV,EAAC"}

package/dist/elements/PreviewButton/usePreviewURL.js

@@ -1,6 +1,6 @@
 'use client';
 import { useCallback, useRef, useState } from 'react';
-import { toast } from 'react-toastify';
+import { toast } from 'sonner';
 import { useConfig } from '../../providers/Config/index.js';
 import { useDocumentInfo } from '../../providers/DocumentInfo/index.js';
 import { useLocale } from '../../providers/Locale/index.js';

package/dist/elements/PreviewButton/usePreviewURL.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/PreviewButton/usePreviewURL.tsx"],"sourcesContent":["'use client'\nimport { useCallback, useRef, useState } from 'react'\nimport { toast } from 'react-toastify'\n\nimport { useConfig } from '../../providers/Config/index.js'\nimport { useDocumentInfo } from '../../providers/DocumentInfo/index.js'\nimport { useLocale } from '../../providers/Locale/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\n\nexport const usePreviewURL = (): {\n  generatePreviewURL: ({ openPreviewWindow }: { openPreviewWindow?: boolean }) => void\n  isLoading: boolean\n  label: string\n  previewURL: string\n} => {\n  const { id, collectionSlug, globalSlug } = useDocumentInfo()\n\n  const [isLoading, setIsLoading] = useState(false)\n  const [previewURL, setPreviewURL] = useState('')\n  const { code: locale } = useLocale()\n\n  const {\n    routes: { api },\n    serverURL,\n  } = useConfig()\n\n  const { t } = useTranslation()\n\n  const isGeneratingPreviewURL = useRef(false)\n\n  // we need to regenerate the preview URL every time the button is clicked\n  // to do this we need to fetch the document data fresh from the API\n  // this will ensure the latest data is used when generating the preview URL\n  const generatePreviewURL = useCallback(\n    async ({ openPreviewWindow = false }) => {\n      if (isGeneratingPreviewURL.current) return\n      isGeneratingPreviewURL.current = true\n\n      try {\n        setIsLoading(true)\n\n        let url = `${serverURL}${api}`\n        if (collectionSlug) url = `${url}/${collectionSlug}/${id}/preview`\n        if (globalSlug) url = `${url}/globals/${globalSlug}/preview`\n\n        const res = await fetch(`${url}${locale ? `?locale=${locale}` : ''}`)\n\n        if (!res.ok) throw new Error()\n        const newPreviewURL = await res.json()\n        if (!newPreviewURL) throw new Error()\n        setPreviewURL(newPreviewURL)\n        setIsLoading(false)\n        isGeneratingPreviewURL.current = false\n        if (openPreviewWindow) window.open(newPreviewURL, '_blank')\n      } catch (err) {\n        setIsLoading(false)\n        isGeneratingPreviewURL.current = false\n        toast.error(t('error:previewing'))\n      }\n    },\n    [serverURL, api, collectionSlug, globalSlug, id, locale, t],\n  )\n\n  return {\n    generatePreviewURL,\n    isLoading,\n    label: isLoading ? t('general:loading') : t('version:preview'),\n    previewURL,\n  }\n}\n"],"names":["useCallback","useRef","useState","toast","useConfig","useDocumentInfo","useLocale","useTranslation","usePreviewURL","id","collectionSlug","globalSlug","isLoading","setIsLoading","previewURL","setPreviewURL","code","locale","routes","api","serverURL","t","isGeneratingPreviewURL","generatePreviewURL","openPreviewWindow","current","url","res","fetch","ok","Error","newPreviewURL","json","window","open","err","error","label"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;AACA,SAASA,WAAW,EAAEC,MAAM,EAAEC,QAAQ,QAAQ,QAAO;AACrD,SAASC,KAAK,QAAQ,iBAAgB;AAEtC,SAASC,SAAS,QAAQ,kCAAiC;AAC3D,SAASC,eAAe,QAAQ,wCAAuC;AACvE,SAASC,SAAS,QAAQ,kCAAiC;AAC3D,SAASC,cAAc,QAAQ,uCAAsC;AAErE,OAAO,MAAMC,gBAAgB;IAM3B,MAAM,EAAEC,EAAE,EAAEC,cAAc,EAAEC,UAAU,EAAE,GAAGN;IAE3C,MAAM,CAACO,WAAWC,aAAa,GAAGX,SAAS;IAC3C,MAAM,CAACY,YAAYC,cAAc,GAAGb,SAAS;IAC7C,MAAM,EAAEc,MAAMC,MAAM,EAAE,GAAGX;IAEzB,MAAM,EACJY,QAAQ,EAAEC,GAAG,EAAE,EACfC,SAAS,EACV,GAAGhB;IAEJ,MAAM,EAAEiB,CAAC,EAAE,GAAGd;IAEd,MAAMe,yBAAyBrB,OAAO;IAEtC,yEAAyE;IACzE,mEAAmE;IACnE,2EAA2E;IAC3E,MAAMsB,qBAAqBvB,YACzB,OAAO,EAAEwB,oBAAoB,KAAK,EAAE;QAClC,IAAIF,uBAAuBG,OAAO,EAAE;QACpCH,uBAAuBG,OAAO,GAAG;QAEjC,IAAI;YACFZ,aAAa;YAEb,IAAIa,MAAM,CAAC,EAAEN,UAAU,EAAED,IAAI,CAAC;YAC9B,IAAIT,gBAAgBgB,MAAM,CAAC,EAAEA,IAAI,CAAC,EAAEhB,eAAe,CAAC,EAAED,GAAG,QAAQ,CAAC;YAClE,IAAIE,YAAYe,MAAM,CAAC,EAAEA,IAAI,SAAS,EAAEf,WAAW,QAAQ,CAAC;YAE5D,MAAMgB,MAAM,MAAMC,MAAM,CAAC,EAAEF,IAAI,EAAET,SAAS,CAAC,QAAQ,EAAEA,OAAO,CAAC,GAAG,GAAG,CAAC;YAEpE,IAAI,CAACU,IAAIE,EAAE,EAAE,MAAM,IAAIC;YACvB,MAAMC,gBAAgB,MAAMJ,IAAIK,IAAI;YACpC,IAAI,CAACD,eAAe,MAAM,IAAID;YAC9Bf,cAAcgB;YACdlB,aAAa;YACbS,uBAAuBG,OAAO,GAAG;YACjC,IAAID,mBAAmBS,OAAOC,IAAI,CAACH,eAAe;QACpD,EAAE,OAAOI,KAAK;YACZtB,aAAa;YACbS,uBAAuBG,OAAO,GAAG;YACjCtB,MAAMiC,KAAK,CAACf,EAAE;QAChB;IACF,GACA;QAACD;QAAWD;QAAKT;QAAgBC;QAAYF;QAAIQ;QAAQI;KAAE;IAG7D,OAAO;QACLE;QACAX;QACAyB,OAAOzB,YAAYS,EAAE,qBAAqBA,EAAE;QAC5CP;IACF;AACF,EAAC"}
+{"version":3,"sources":["../../../src/elements/PreviewButton/usePreviewURL.tsx"],"sourcesContent":["'use client'\nimport { useCallback, useRef, useState } from 'react'\nimport { toast } from 'sonner'\n\nimport { useConfig } from '../../providers/Config/index.js'\nimport { useDocumentInfo } from '../../providers/DocumentInfo/index.js'\nimport { useLocale } from '../../providers/Locale/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\n\nexport const usePreviewURL = (): {\n  generatePreviewURL: ({ openPreviewWindow }: { openPreviewWindow?: boolean }) => void\n  isLoading: boolean\n  label: string\n  previewURL: string\n} => {\n  const { id, collectionSlug, globalSlug } = useDocumentInfo()\n\n  const [isLoading, setIsLoading] = useState(false)\n  const [previewURL, setPreviewURL] = useState('')\n  const { code: locale } = useLocale()\n\n  const {\n    routes: { api },\n    serverURL,\n  } = useConfig()\n\n  const { t } = useTranslation()\n\n  const isGeneratingPreviewURL = useRef(false)\n\n  // we need to regenerate the preview URL every time the button is clicked\n  // to do this we need to fetch the document data fresh from the API\n  // this will ensure the latest data is used when generating the preview URL\n  const generatePreviewURL = useCallback(\n    async ({ openPreviewWindow = false }) => {\n      if (isGeneratingPreviewURL.current) return\n      isGeneratingPreviewURL.current = true\n\n      try {\n        setIsLoading(true)\n\n        let url = `${serverURL}${api}`\n        if (collectionSlug) url = `${url}/${collectionSlug}/${id}/preview`\n        if (globalSlug) url = `${url}/globals/${globalSlug}/preview`\n\n        const res = await fetch(`${url}${locale ? `?locale=${locale}` : ''}`)\n\n        if (!res.ok) throw new Error()\n        const newPreviewURL = await res.json()\n        if (!newPreviewURL) throw new Error()\n        setPreviewURL(newPreviewURL)\n        setIsLoading(false)\n        isGeneratingPreviewURL.current = false\n        if (openPreviewWindow) window.open(newPreviewURL, '_blank')\n      } catch (err) {\n        setIsLoading(false)\n        isGeneratingPreviewURL.current = false\n        toast.error(t('error:previewing'))\n      }\n    },\n    [serverURL, api, collectionSlug, globalSlug, id, locale, t],\n  )\n\n  return {\n    generatePreviewURL,\n    isLoading,\n    label: isLoading ? t('general:loading') : t('version:preview'),\n    previewURL,\n  }\n}\n"],"names":["useCallback","useRef","useState","toast","useConfig","useDocumentInfo","useLocale","useTranslation","usePreviewURL","id","collectionSlug","globalSlug","isLoading","setIsLoading","previewURL","setPreviewURL","code","locale","routes","api","serverURL","t","isGeneratingPreviewURL","generatePreviewURL","openPreviewWindow","current","url","res","fetch","ok","Error","newPreviewURL","json","window","open","err","error","label"],"mappings":"AAAA;AACA,SAASA,WAAW,EAAEC,MAAM,EAAEC,QAAQ,QAAQ,QAAO;AACrD,SAASC,KAAK,QAAQ,SAAQ;AAE9B,SAASC,SAAS,QAAQ,kCAAiC;AAC3D,SAASC,eAAe,QAAQ,wCAAuC;AACvE,SAASC,SAAS,QAAQ,kCAAiC;AAC3D,SAASC,cAAc,QAAQ,uCAAsC;AAErE,OAAO,MAAMC,gBAAgB;IAM3B,MAAM,EAAEC,EAAE,EAAEC,cAAc,EAAEC,UAAU,EAAE,GAAGN;IAE3C,MAAM,CAACO,WAAWC,aAAa,GAAGX,SAAS;IAC3C,MAAM,CAACY,YAAYC,cAAc,GAAGb,SAAS;IAC7C,MAAM,EAAEc,MAAMC,MAAM,EAAE,GAAGX;IAEzB,MAAM,EACJY,QAAQ,EAAEC,GAAG,EAAE,EACfC,SAAS,EACV,GAAGhB;IAEJ,MAAM,EAAEiB,CAAC,EAAE,GAAGd;IAEd,MAAMe,yBAAyBrB,OAAO;IAEtC,yEAAyE;IACzE,mEAAmE;IACnE,2EAA2E;IAC3E,MAAMsB,qBAAqBvB,YACzB,OAAO,EAAEwB,oBAAoB,KAAK,EAAE;QAClC,IAAIF,uBAAuBG,OAAO,EAAE;QACpCH,uBAAuBG,OAAO,GAAG;QAEjC,IAAI;YACFZ,aAAa;YAEb,IAAIa,MAAM,CAAC,EAAEN,UAAU,EAAED,IAAI,CAAC;YAC9B,IAAIT,gBAAgBgB,MAAM,CAAC,EAAEA,IAAI,CAAC,EAAEhB,eAAe,CAAC,EAAED,GAAG,QAAQ,CAAC;YAClE,IAAIE,YAAYe,MAAM,CAAC,EAAEA,IAAI,SAAS,EAAEf,WAAW,QAAQ,CAAC;YAE5D,MAAMgB,MAAM,MAAMC,MAAM,CAAC,EAAEF,IAAI,EAAET,SAAS,CAAC,QAAQ,EAAEA,OAAO,CAAC,GAAG,GAAG,CAAC;YAEpE,IAAI,CAACU,IAAIE,EAAE,EAAE,MAAM,IAAIC;YACvB,MAAMC,gBAAgB,MAAMJ,IAAIK,IAAI;YACpC,IAAI,CAACD,eAAe,MAAM,IAAID;YAC9Bf,cAAcgB;YACdlB,aAAa;YACbS,uBAAuBG,OAAO,GAAG;YACjC,IAAID,mBAAmBS,OAAOC,IAAI,CAACH,eAAe;QACpD,EAAE,OAAOI,KAAK;YACZtB,aAAa;YACbS,uBAAuBG,OAAO,GAAG;YACjCtB,MAAMiC,KAAK,CAACf,EAAE;QAChB;IACF,GACA;QAACD;QAAWD;QAAKT;QAAgBC;QAAYF;QAAIQ;QAAQI;KAAE;IAG7D,OAAO;QACLE;QACAX;QACAyB,OAAOzB,YAAYS,EAAE,qBAAqBA,EAAE;QAC5CP;IACF;AACF,EAAC"}