quirk-ui 0.0.459 → 0.0.461

package/dist/core/components/Modal/index.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../assets/index33.css');const e=require("react/jsx-runtime"),r=require("react"),_=require("react-dom"),h=require("../../../x-Dft9NVe_.cjs"),j="_overlay_140ia_1",x="_modal_140ia_16",b="_closeButton_140ia_26",g="_content_140ia_37",o={overlay:j,modal:x,closeButton:b,content:g};function $({content:u,trigger:m,isOpen:c,onOpen:n,onClose:s,className:i}){const[t,f]=r.useState(!1),a=c!==void 0,d=a?c:t,l=()=>{a?t?s==null||s():n==null||n():f(!d)};r.useEffect(()=>{if(typeof document<"u")return document.body.style.overflow=t?"hidden":"",()=>{document.body.style.overflow=""}},[t]);const y=d?e.jsx("div",{className:o.overlay,onClick:l,children:e.jsxs("div",{className:`${i??""} ${o.modal}`,onClick:v=>v.stopPropagation(),children:[e.jsx("button",{"aria-label":"Close",className:`${o.closeButton} modalClose`,onClick:l,children:e.jsx(h.X,{size:21})}),e.jsx("div",{className:`${o.content} modalContent`,children:u})]})}):null;return e.jsxs(e.Fragment,{children:[e.jsx("div",{className:i??void 0,onClick:l,children:m}),typeof window<"u"&&_.createPortal(y,document.body)]})}exports.Modal=$;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../assets/index33.css');const e=require("react/jsx-runtime"),y=require("react"),j=require("react-dom"),x=require("../../../x-Dft9NVe_.cjs"),f="_overlay_140ia_1",h="_modal_140ia_16",g="_closeButton_140ia_26",$="_content_140ia_37",t={overlay:f,modal:h,closeButton:g,content:$};function b({content:d,trigger:u,isOpen:l,onOpen:o,onClose:s,className:c}){const[a,m]=y.useState(!1),i=l!==void 0,r=i?l:a,n=()=>{i?a?s==null||s():o==null||o():m(!r)},_=r?e.jsx("div",{className:t.overlay,onClick:n,children:e.jsxs("div",{className:`${c??""} ${t.modal}`,onClick:v=>v.stopPropagation(),children:[e.jsx("button",{"aria-label":"Close",className:`${t.closeButton} modalClose`,onClick:n,children:e.jsx(x.X,{size:21})}),e.jsx("div",{className:`${t.content} modalContent`,children:d})]})}):null;return e.jsxs(e.Fragment,{children:[e.jsx("div",{className:c??void 0,onClick:n,children:u}),typeof window<"u"&&j.createPortal(_,document.body)]})}exports.Modal=b;

package/dist/core/components/Modal/index.mjs

@@ -1,54 +1,47 @@
-import { jsxs as r, Fragment as _, jsx as o } from "react/jsx-runtime";
-import { useState as h, useEffect as p } from "react";
-import { createPortal as b } from "react-dom";
+import { jsxs as r, Fragment as h, jsx as o } from "react/jsx-runtime";
+import { useState as p } from "react";
+import { createPortal as y } from "react-dom";
 import { X as C } from "../../../x-CnsEH4Ox.js";
-import '../../../assets/index33.css';const g = "_overlay_140ia_1", k = "_modal_140ia_16", w = "_closeButton_140ia_26", B = "_content_140ia_37", e = {
+import '../../../assets/index33.css';const g = "_overlay_140ia_1", k = "_modal_140ia_16", B = "_closeButton_140ia_26", N = "_content_140ia_37", t = {
   overlay: g,
   modal: k,
-  closeButton: w,
-  content: B
+  closeButton: B,
+  content: N
 };
-function P({
+function w({
   content: m,
-  trigger: f,
-  isOpen: i,
-  onOpen: n,
+  trigger: _,
+  isOpen: a,
+  onOpen: e,
   onClose: l,
-  className: s
+  className: i
 }) {
-  const [t, u] = h(!1), a = i !== void 0, d = a ? i : t, c = () => {
-    a ? t ? l == null || l() : n == null || n() : u(!d);
-  };
-  p(() => {
-    if (typeof document < "u")
-      return document.body.style.overflow = t ? "hidden" : "", () => {
-        document.body.style.overflow = "";
-      };
-  }, [t]);
-  const v = d ? /* @__PURE__ */ o("div", { className: e.overlay, onClick: c, children: /* @__PURE__ */ r(
+  const [s, u] = p(!1), c = a !== void 0, d = c ? a : s, n = () => {
+    c ? s ? l == null || l() : e == null || e() : u(!d);
+  }, f = d ? /* @__PURE__ */ o("div", { className: t.overlay, onClick: n, children: /* @__PURE__ */ r(
     "div",
     {
-      className: `${s ?? ""} ${e.modal}`,
-      onClick: (y) => y.stopPropagation(),
+      className: `${i ?? ""} ${t.modal}`,
+      onClick: (v) => v.stopPropagation(),
       children: [
         /* @__PURE__ */ o(
           "button",
           {
             "aria-label": "Close",
-            className: `${e.closeButton} modalClose`,
-            onClick: c,
+            className: `${t.closeButton} modalClose`,
+            onClick: n,
             children: /* @__PURE__ */ o(C, { size: 21 })
           }
         ),
-        /* @__PURE__ */ o("div", { className: `${e.content} modalContent`, children: m })
+        /* @__PURE__ */ o("div", { className: `${t.content} modalContent`, children: m })
       ]
     }
   ) }) : null;
-  return /* @__PURE__ */ r(_, { children: [
-    /* @__PURE__ */ o("div", { className: s ?? void 0, onClick: c, children: f }),
-    typeof window < "u" && b(v, document.body)
+  return /* @__PURE__ */ r(h, { children: [
+    /* @__PURE__ */ o("div", { className: i ?? void 0, onClick: n, children: _ }),
+    typeof window < "u" && y(f, document.body)
   ] });
 }
 export {
-  P as Modal
+  w as Modal
 };

package/dist/core/components/NavBar/index.cjs

@@ -1,16 +1,16 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),r=require("react"),ae=require("../Modal/index.cjs"),O=require("../../../index-DpYgzTme.cjs"),te=require("../ButtonGroup/index.cjs"),e=require("../../../NavLink-By_lBPb-.cjs"),I=require("../../../external-link-DDShu-48.cjs"),ve=require("../../../x-Dft9NVe_.cjs"),D=require("../../../createLucideIcon-DpotSgUx.cjs"),pe=require("../../../chevron-down-DfK1XBl3.cjs");/**
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),r=require("react"),ie=require("../Modal/index.cjs"),q=require("../../../index-DpYgzTme.cjs"),ce=require("../ButtonGroup/index.cjs"),e=require("../../../NavLink-By_lBPb-.cjs"),D=require("../../../external-link-DDShu-48.cjs"),Ne=require("../../../x-Dft9NVe_.cjs"),G=require("../../../createLucideIcon-DpotSgUx.cjs"),$e=require("../../../chevron-down-DfK1XBl3.cjs");/**
  * @license lucide-react v0.488.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
- */const Ne=[["path",{d:"M21.54 15H17a2 2 0 0 0-2 2v4.54",key:"1djwo0"}],["path",{d:"M7 3.34V5a3 3 0 0 0 3 3a2 2 0 0 1 2 2c0 1.1.9 2 2 2a2 2 0 0 0 2-2c0-1.1.9-2 2-2h3.17",key:"1tzkfa"}],["path",{d:"M11 21.95V18a2 2 0 0 0-2-2a2 2 0 0 1-2-2v-1a2 2 0 0 0-2-2H2.05",key:"14pb5j"}],["circle",{cx:"12",cy:"12",r:"10",key:"1mglay"}]],$e=D.createLucideIcon("earth",Ne);/**
+ */const ge=[["path",{d:"M21.54 15H17a2 2 0 0 0-2 2v4.54",key:"1djwo0"}],["path",{d:"M7 3.34V5a3 3 0 0 0 3 3a2 2 0 0 1 2 2c0 1.1.9 2 2 2a2 2 0 0 0 2-2c0-1.1.9-2 2-2h3.17",key:"1tzkfa"}],["path",{d:"M11 21.95V18a2 2 0 0 0-2-2a2 2 0 0 1-2-2v-1a2 2 0 0 0-2-2H2.05",key:"14pb5j"}],["circle",{cx:"12",cy:"12",r:"10",key:"1mglay"}]],we=G.createLucideIcon("earth",ge);/**
  * @license lucide-react v0.488.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
- */const ge=[["line",{x1:"4",x2:"20",y1:"12",y2:"12",key:"1e0a9i"}],["line",{x1:"4",x2:"20",y1:"6",y2:"6",key:"1owob3"}],["line",{x1:"4",x2:"20",y1:"18",y2:"18",key:"yk5zj1"}]],we=D.createLucideIcon("menu",ge);/**
+ */const Ce=[["line",{x1:"4",x2:"20",y1:"12",y2:"12",key:"1e0a9i"}],["line",{x1:"4",x2:"20",y1:"6",y2:"6",key:"1owob3"}],["line",{x1:"4",x2:"20",y1:"18",y2:"18",key:"yk5zj1"}]],Le=G.createLucideIcon("menu",Ce);/**
  * @license lucide-react v0.488.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
- */const Ce=[["circle",{cx:"11",cy:"11",r:"8",key:"4ej97u"}],["path",{d:"m21 21-4.3-4.3",key:"1qie3q"}]],Le=D.createLucideIcon("search",Ce),_e={standard:e.styles.standard,transparent:e.styles.transparent},Se={left:e.styles.left,center:e.styles.center,right:e.styles.right},Me=({spotlight:a,renderText:b})=>{var t,C,j,p,k,L,m,_,S,M,y;const w=(t=a.image)==null?void 0:t.asset.altText,x=((C=a.callToAction.linkOptions)==null?void 0:C.linkType)==="external";let u="#";return((j=a.callToAction.linkOptions)==null?void 0:j.linkType)==="external"&&((p=a.callToAction.linkOptions)!=null&&p.externalUrl)?u=(k=a.callToAction.linkOptions)==null?void 0:k.externalUrl:((L=a.callToAction.linkOptions)==null?void 0:L.linkType)==="internal"&&((_=(m=a.callToAction.linkOptions)==null?void 0:m.internalUrl)!=null&&_.slug.current)&&(u=`/${(M=(S=a.callToAction.linkOptions)==null?void 0:S.internalUrl)==null?void 0:M.slug.current}`),s.jsxs("div",{className:e.styles.spotlight,children:[a.image&&s.jsx("div",{className:e.styles.imageWrapper,children:s.jsx("img",{src:(a==null?void 0:a.image.imageUrl)??"",alt:w||a.image.asset.description||"Content image",width:600,height:400})}),s.jsxs("div",{className:e.styles.content,children:[a.title&&s.jsx("div",{className:e.styles.title,children:b==null?void 0:b(a.title,e.styles.title)}),a.description&&s.jsx("div",{className:e.styles.description,children:b==null?void 0:b(a.description,e.styles.description)})]}),((y=a.callToAction)==null?void 0:y.linkOptions)&&s.jsx("div",{className:e.styles.actions,children:s.jsx(O.CallToAction,{as:"a",variant:a.callToAction.variant??"primary",href:u,target:x?"_blank":"_self",rel:x?"noopener noreferrer":"","aria-label":a.callToAction.ariaLabel||a.callToAction.label,children:a.callToAction.label})})]})};function Ee({renderText:a,title:b,logo:w,items:x,groups:u,utilityItems:t,isSticky:C=!1,showSearch:j=!0,showLocaleSelect:p=!0,alignment:k="right",variant:L="standard",navigationType:m="default",searchComponent:_,localeSelectComponent:S,className:M}){const[y,G]=r.useState(!1),[U,f]=r.useState(null),[ie,ce]=r.useState(0),[re,oe]=r.useState(!1),[de,ye]=r.useState(null),[o,N]=r.useState([]),[E,q]=r.useState(0),[ue,X]=r.useState(null),[$,he]=r.useState(!1),[A,T]=r.useState("forward"),B=()=>s.jsx("div",{className:`${e.styles.linkWrapper} ${e.styles.parent} ${e.styles.searchWrapper}`,children:s.jsx("div",{className:e.styles.linkItem,children:s.jsx(ae.Modal,{className:e.styles.searchModal,trigger:s.jsx("button",{title:"Search","aria-label":"Search",className:e.styles.search,children:s.jsx(Le,{size:16})}),content:_})})}),H=()=>s.jsx("div",{className:`${e.styles.linkWrapper} ${e.styles.parent} `,children:s.jsx("div",{className:e.styles.linkItem,children:s.jsx(ae.Modal,{className:e.styles.localeModal,trigger:s.jsx("button",{title:"Locale Select","aria-label":"Locale Select",role:"menuitem",className:e.styles.locale,children:s.jsx($e,{size:16})}),content:S})})});r.useEffect(()=>{if(typeof window<"u"){const n=()=>{const l=window.innerWidth<768;he(l)};return n(),window.addEventListener("resize",n),()=>window.removeEventListener("resize",n)}},[]);const be=()=>{N([])},fe=n=>{T("forward"),N([{title:n.title,primary:n.primaryItems??[],secondary:n.secondaryItems??[],description:""}])},V=n=>{T("forward"),N(l=>[...l,{title:n.label,primary:n.sublinks??[],secondary:[],description:n.description}])},xe=()=>{T("backward"),N(n=>n.slice(0,-1))},F=r.useRef(null),g=r.useRef(null),W=r.useRef(new Map),me=()=>{G(n=>{const l=!n;return l||(N([]),T("forward"),f(null)),l})},J=n=>{const l=W.current.get(n);if(l&&g.current){const d=l.getBoundingClientRect(),h=g.current.getBoundingClientRect(),c=d.left-h.left+d.width/2;ye(c)}},je=n=>{f(l=>l===n?null:n)},K=r.useCallback(n=>{F.current&&!F.current.contains(n.target)&&f(null)},[]),Q=r.useCallback(()=>{Y(),typeof window<"u"&&window.innerWidth>768&&(G(!1),f(null),typeof document<"u"&&(document.body.style.overflow=""))},[]),Y=r.useCallback(()=>{if(g.current){const n=g.current.getBoundingClientRect().width;ce(n),oe(!0)}},[]);r.useEffect(()=>{const n=typeof window<"u",l=typeof document<"u";return n&&window.addEventListener("resize",Q),l&&document.addEventListener("click",K),Y(),()=>{n&&window.removeEventListener("resize",Q),l&&document.removeEventListener("click",K)}},[]),r.useEffect(()=>{if(typeof document<"u")return document.body.style.overflow=y?"hidden":"",()=>{document.body.style.overflow=""}},[y]);const ke=n=>n.map((l,d)=>{var Z,P,ee,se,ne;const h=`group-${d}`,z=ue===d,c=(Z=l.primaryItems)==null?void 0:Z[E??0];return s.jsxs("div",{className:`${e.styles.linkWrapper} ${e.styles.parent}`,onMouseEnter:()=>{X(d),f(h),J(h)},onMouseLeave:()=>{X(null),q(0),f(null)},children:[s.jsx("div",{className:e.styles.linkItem,children:s.jsxs("button",{ref:i=>{W.current.set(h,i)},role:"menuitem","aria-haspopup":"true","aria-expanded":z,"aria-controls":`submenu-${d}`,className:`${e.styles.sublinkToggle} ${z?e.styles.open:""} `,children:[l.title,s.jsx(pe.ChevronDown,{size:18,className:e.styles.chevron})]})}),s.jsx("div",{id:`submenu-${d}`,className:`${e.styles.sublinks} ${z?e.styles.show:""}`,role:"menu","aria-label":`${l.title} submenu`,children:s.jsx("div",{children:s.jsxs("div",{className:`${e.styles.sublinksInner} ${l.spotlight?e.styles.withSpotlight:e.styles.withoutSpotlight}`,children:[s.jsxs("div",{className:`${e.styles.sublinksColumn} ${e.styles.primaryColumn}`,children:[s.jsx("div",{className:e.styles.linkItem}),(P=l.primaryItems)==null?void 0:P.map((i,v)=>i.href?s.jsxs("a",{href:i.href,className:`${e.styles.link} ${E===v?e.styles.open:""}`,target:i.isExternal?"_blank":"_self",rel:i.isExternal?"noopener noreferrer":void 0,onClick:()=>{var le;f(null),(le=i.onClick)==null||le.call(i)},onMouseEnter:()=>i.sublinks?q(v):null,role:"menuitem",children:[s.jsxs("span",{className:e.styles.linkContent,children:[i.label,i.subtitle&&s.jsx("span",{className:e.styles.subtitle,children:i.subtitle})]}),i.isExternal&&s.jsx(I.ExternalLink,{className:e.styles.newTabIcon,size:16})]},i._key??v):s.jsx("button",{className:`${e.styles.sublinkToggle} ${E===v?e.styles.open:""}`,onMouseEnter:()=>q(v),children:s.jsxs("span",{className:e.styles.linkContent,children:[i.label,i.subtitle&&s.jsx("span",{className:e.styles.subtitle,children:i.subtitle})]})},i._key??v))]}),(c==null?void 0:c.sublinks)&&((ee=c==null?void 0:c.sublinks)==null?void 0:ee.length)>0&&s.jsxs("div",{className:`${e.styles.sublinksColumn} ${e.styles.fadeInFromLeft}`,children:[(c==null?void 0:c.description)&&s.jsxs("div",{className:e.styles.sublinksDescription,children:[s.jsx("p",{children:"TEXT HERE"}),a==null?void 0:a(c.description)]}),(c==null?void 0:c.sublinks)&&R(c.sublinks,`${h}-${E}`)]},`${c.label}-${(se=c==null?void 0:c.sublinks)==null?void 0:se.length}`),(l==null?void 0:l.secondaryItems)&&((ne=l==null?void 0:l.secondaryItems)==null?void 0:ne.length)>0&&s.jsx("div",{className:`${e.styles.sublinksColumn} ${e.styles.secondaryColumn}`,children:l.secondaryItems&&l.secondaryItems.length>0&&R(l.secondaryItems,`${h}-secondary`)}),l.spotlight&&s.jsx("div",{className:`${e.styles.sublinksColumn} ${e.styles.spotlightColumn}`,children:s.jsx(Me,{spotlight:l.spotlight,renderText:a??(i=>String(i))})})]})})})]},l._key??`group-${d}`)}),R=(n,l="")=>n.map(d=>{const h=`${l}/${d.label}`;return s.jsx(e.NavLink,{link:d,path:h,parentPath:l,openPath:U,togglePath:je,updateTriangleIndicator:J,setOpenPath:f,renderLinks:R,buttonRefs:W},d._key??h)});return s.jsx("header",{ref:F,className:`${M??""} ${Se[k]} ${_e[L]} ${e.styles.navbar} ${C?e.styles.sticky:""} ${u&&u.length?e.styles.advanced:e.styles.default}`,"aria-label":"Main navigation",children:s.jsxs("div",{className:`${e.styles.container} ${(!t||t.length===0)&&k!=="center"?e.styles.twoColumn:""}`,children:[w?s.jsx("div",{className:e.styles.logo,children:w}):s.jsx("div",{className:e.styles.title,children:b}),s.jsx("nav",{ref:g,style:{left:k==="center"?`calc(50% - ${ie/2}px)`:"0"},className:`${e.styles.nav} ${y?e.styles.open:""} ${re?e.styles.visible:e.styles.hidden}`,id:"main-menu",role:"menubar","aria-label":"Main navigation",children:s.jsxs("div",{className:e.styles.navInner,children:[s.jsx("svg",{style:{left:`${de}px`},className:`${e.styles.triangle} ${U?e.styles.show:""}`,width:16,height:12,viewBox:"0 0 100 75",xmlns:"http://www.w3.org/2000/svg",children:s.jsx("polygon",{points:"50,5 95,70 5,70",strokeLinejoin:"round",fill:"white",stroke:"white"})}),m==="default"&&x&&s.jsxs("div",{className:e.styles.grid,children:[x&&x.length>0&&R(x),j&&!$&&s.jsxs(s.Fragment,{children:[s.jsx("span",{className:e.styles.separator}),s.jsx(B,{})]}),p&&s.jsx(H,{})]}),!$&&m==="advanced"&&u&&s.jsxs("div",{className:e.styles.grid,children:[u.length>0&&ke(u),j&&s.jsxs(s.Fragment,{children:[s.jsx("span",{className:e.styles.separator}),s.jsx(B,{})]}),p&&s.jsx(H,{})]}),$&&m==="advanced"&&y&&o.length===0&&u&&s.jsx("div",{className:`${e.styles.mobileMenu}`,children:u.map((n,l)=>s.jsx("div",{className:`${e.styles.mobileMenuItem} ${A==="forward"?e.styles.fadeInFromLeft:e.styles.fadeInFromRight}`,children:s.jsx("button",{className:e.styles.sublinkToggle,onClick:()=>fe(n),children:n.title})},n._key??l))}),$&&m==="advanced"&&y&&o.length>0&&s.jsxs("div",{className:`${e.styles.mobileMenuSlide} `,children:[s.jsx("button",{className:e.styles.back,onClick:o.length===1?be:xe,children:s.jsx(O.ChevronLeft,{size:18,"aria-hidden":"true",focusable:"false"})}),o[o.length-1].description&&s.jsx("div",{className:`${e.styles.sublinksDescription} ${A==="forward"?e.styles.fadeInFromLeft:e.styles.fadeInFromRight}`,children:a==null?void 0:a(o[o.length-1].description)}),o[o.length-1].primary.map((n,l)=>s.jsx("div",{className:`${e.styles.mobileMenuItem} ${A==="forward"?e.styles.fadeInFromLeft:e.styles.fadeInFromRight}`,children:n.sublinks?s.jsx("button",{className:e.styles.sublinkToggle,onClick:()=>V(n),children:s.jsxs("span",{className:e.styles.linkContent,children:[n.label,n.subtitle&&s.jsx("span",{className:e.styles.subtitle,children:n.subtitle})]})}):s.jsxs("a",{href:n.href,className:e.styles.link,target:n.isExternal?"_blank":"_self",rel:n.isExternal?"noopener noreferrer":void 0,role:"menuitem",children:[s.jsxs("span",{className:e.styles.linkContent,children:[n.label,n.subtitle&&s.jsx("span",{className:e.styles.subtitle,children:n.subtitle})]}),n.isExternal&&s.jsx(I.ExternalLink,{className:e.styles.newTabIcon,size:16})]})},n._key??`primary-${l}`)),o[o.length-1].secondary.length>0&&s.jsx("hr",{className:e.styles.groupDivider}),o[o.length-1].secondary.map((n,l)=>s.jsx("div",{className:`${e.styles.mobileMenuItem} ${A==="forward"?e.styles.fadeInFromLeft:e.styles.fadeInFromRight}`,children:n.sublinks?s.jsx("button",{className:e.styles.sublinkToggle,onClick:()=>V(n),children:n.label}):s.jsxs("a",{href:n.href,className:e.styles.link,target:n.isExternal?"_blank":"_self",rel:n.isExternal?"noopener noreferrer":void 0,role:"menuitem",children:[n.label,n.isExternal&&s.jsx(I.ExternalLink,{className:e.styles.newTabIcon,size:16})]})},n._key??`secondary-${l}`))]},`stack-${o.length}`)]})}),t&&t.length>0&&s.jsx("nav",{className:e.styles.utility,"aria-label":"Utility navigation",children:s.jsx(te.ButtonGroup,{children:t.map((n,l)=>s.jsx(O.CallToAction,{as:"a",href:n.href??"/",variant:n.variant??"primary",displayType:n.displayType??"text",imageSrc:n.imageSrc,imageAlt:n.imageAlt,"aria-label":n.ariaLabel??n.label,icon:n.icon,iconAlignment:n.iconAlignment,children:n.imageSrc?s.jsx("img",{src:n.imageSrc,alt:n.imageAlt??n.ariaLabel??n.label}):n.label},n._key||l))})}),t&&t.length>0&&s.jsx("nav",{"aria-label":"Utility navigation",className:`${e.styles.utilityMobile} ${y?e.styles.open:""}`,children:s.jsx(te.ButtonGroup,{alignment:"center",children:s.jsx(O.CallToAction,{as:"a",href:t[1].href??"/",variant:t[1].variant??"primary",displayType:t[1].displayType??"text",imageSrc:t[1].imageSrc,imageAlt:t[1].imageAlt,"aria-label":t[1].ariaLabel??t[1].label,icon:t[1].icon,iconAlignment:t[1].iconAlignment,children:t[1].imageSrc?s.jsx("img",{src:t[1].imageSrc,"aria-label":t[1].imageAlt??t[1].ariaLabel??t[1].label}):t[1].label})})}),s.jsxs("div",{className:e.styles.mobileButtons,children:[$&&j&&s.jsx(B,{}),s.jsx("button",{className:e.styles.menuToggle,onClick:me,"aria-label":y?"Close menu":"Open menu","aria-expanded":y,"aria-controls":"main-menu",children:y?s.jsx(ve.X,{size:24}):s.jsx(we,{size:24})})]})]})})}exports.Navbar=Ee;
+ */const _e=[["circle",{cx:"11",cy:"11",r:"8",key:"4ej97u"}],["path",{d:"m21 21-4.3-4.3",key:"1qie3q"}]],Se=G.createLucideIcon("search",_e),Me={standard:e.styles.standard,transparent:e.styles.transparent},Ee={left:e.styles.left,center:e.styles.center,right:e.styles.right},Ae=({spotlight:a,renderText:b})=>{var t,C,j,p,k,L,m,_,S,M,y;const w=(t=a.image)==null?void 0:t.asset.altText,x=((C=a.callToAction.linkOptions)==null?void 0:C.linkType)==="external";let u="#";return((j=a.callToAction.linkOptions)==null?void 0:j.linkType)==="external"&&((p=a.callToAction.linkOptions)!=null&&p.externalUrl)?u=(k=a.callToAction.linkOptions)==null?void 0:k.externalUrl:((L=a.callToAction.linkOptions)==null?void 0:L.linkType)==="internal"&&((_=(m=a.callToAction.linkOptions)==null?void 0:m.internalUrl)!=null&&_.slug.current)&&(u=`/${(M=(S=a.callToAction.linkOptions)==null?void 0:S.internalUrl)==null?void 0:M.slug.current}`),s.jsxs("div",{className:e.styles.spotlight,children:[a.image&&s.jsx("div",{className:e.styles.imageWrapper,children:s.jsx("img",{src:(a==null?void 0:a.image.imageUrl)??"",alt:w||a.image.asset.description||"Content image",width:600,height:400})}),s.jsxs("div",{className:e.styles.content,children:[a.title&&s.jsx("div",{className:e.styles.title,children:b==null?void 0:b(a.title,e.styles.title)}),a.description&&s.jsx("div",{className:e.styles.description,children:b==null?void 0:b(a.description,e.styles.description)})]}),((y=a.callToAction)==null?void 0:y.linkOptions)&&s.jsx("div",{className:e.styles.actions,children:s.jsx(q.CallToAction,{as:"a",variant:a.callToAction.variant??"primary",href:u,target:x?"_blank":"_self",rel:x?"noopener noreferrer":"","aria-label":a.callToAction.ariaLabel||a.callToAction.label,children:a.callToAction.label})})]})};function Te({renderText:a,title:b,logo:w,items:x,groups:u,utilityItems:t,isSticky:C=!1,showSearch:j=!0,showLocaleSelect:p=!0,alignment:k="right",variant:L="standard",navigationType:m="default",searchComponent:_,localeSelectComponent:S,className:M}){const[y,U]=r.useState(!1),[X,E]=r.useState(!1),[H,f]=r.useState(null),[re,oe]=r.useState(0),[de,ye]=r.useState(!1),[ue,he]=r.useState(null),[o,N]=r.useState([]),[A,B]=r.useState(0),[be,V]=r.useState(null),[$,fe]=r.useState(!1),[T,O]=r.useState("forward"),F=()=>s.jsx("div",{className:`${e.styles.linkWrapper} ${e.styles.parent} ${e.styles.searchWrapper}`,children:s.jsx("div",{className:e.styles.linkItem,children:s.jsx(ie.Modal,{className:e.styles.searchModal,onOpen:()=>E(!0),onClose:()=>E(!1),trigger:s.jsx("button",{title:"Search","aria-label":"Search",className:e.styles.search,children:s.jsx(Se,{size:16})}),content:_})})}),J=()=>s.jsx("div",{className:`${e.styles.linkWrapper} ${e.styles.parent} `,children:s.jsx("div",{className:e.styles.linkItem,children:s.jsx(ie.Modal,{className:e.styles.localeModal,onOpen:()=>E(!0),onClose:()=>E(!1),trigger:s.jsx("button",{title:"Locale Select","aria-label":"Locale Select",role:"menuitem",className:e.styles.locale,children:s.jsx(we,{size:16})}),content:S})})});r.useEffect(()=>{if(typeof window<"u"){const n=()=>{const l=window.innerWidth<768;fe(l)};return n(),window.addEventListener("resize",n),()=>window.removeEventListener("resize",n)}},[]);const xe=()=>{N([])},me=n=>{O("forward"),N([{title:n.title,primary:n.primaryItems??[],secondary:n.secondaryItems??[],description:""}])},K=n=>{O("forward"),N(l=>[...l,{title:n.label,primary:n.sublinks??[],secondary:[],description:n.description}])},je=()=>{O("backward"),N(n=>n.slice(0,-1))},W=r.useRef(null),g=r.useRef(null),I=r.useRef(new Map),ke=()=>{U(n=>{const l=!n;return l||(N([]),O("forward"),f(null)),l})},Q=n=>{const l=I.current.get(n);if(l&&g.current){const d=l.getBoundingClientRect(),h=g.current.getBoundingClientRect(),c=d.left-h.left+d.width/2;he(c)}},ve=n=>{f(l=>l===n?null:n)},Y=r.useCallback(n=>{W.current&&!W.current.contains(n.target)&&f(null)},[]),Z=r.useCallback(()=>{P(),typeof window<"u"&&window.innerWidth>768&&(U(!1),f(null),typeof document<"u"&&(document.body.style.overflow=""))},[]),P=r.useCallback(()=>{if(g.current){const n=g.current.getBoundingClientRect().width;oe(n),ye(!0)}},[]);r.useEffect(()=>{const n=typeof window<"u",l=typeof document<"u";return n&&window.addEventListener("resize",Z),l&&document.addEventListener("click",Y),P(),()=>{n&&window.removeEventListener("resize",Z),l&&document.removeEventListener("click",Y)}},[]),r.useEffect(()=>{if(typeof document<"u")return document.body.style.overflow=y||X?"hidden":"",()=>{document.body.style.overflow=""}},[y,X]);const pe=n=>n.map((l,d)=>{var ee,se,ne,le,ae;const h=`group-${d}`,z=be===d,c=(ee=l.primaryItems)==null?void 0:ee[A??0];return s.jsxs("div",{className:`${e.styles.linkWrapper} ${e.styles.parent}`,onMouseEnter:()=>{V(d),f(h),Q(h)},onMouseLeave:()=>{V(null),B(0),f(null)},children:[s.jsx("div",{className:e.styles.linkItem,children:s.jsxs("button",{ref:i=>{I.current.set(h,i)},role:"menuitem","aria-haspopup":"true","aria-expanded":z,"aria-controls":`submenu-${d}`,className:`${e.styles.sublinkToggle} ${z?e.styles.open:""} `,children:[l.title,s.jsx($e.ChevronDown,{size:18,className:e.styles.chevron})]})}),s.jsx("div",{id:`submenu-${d}`,className:`${e.styles.sublinks} ${z?e.styles.show:""}`,role:"menu","aria-label":`${l.title} submenu`,children:s.jsx("div",{children:s.jsxs("div",{className:`${e.styles.sublinksInner} ${l.spotlight?e.styles.withSpotlight:e.styles.withoutSpotlight}`,children:[s.jsxs("div",{className:`${e.styles.sublinksColumn} ${e.styles.primaryColumn}`,children:[s.jsx("div",{className:e.styles.linkItem}),(se=l.primaryItems)==null?void 0:se.map((i,v)=>i.href?s.jsxs("a",{href:i.href,className:`${e.styles.link} ${A===v?e.styles.open:""}`,target:i.isExternal?"_blank":"_self",rel:i.isExternal?"noopener noreferrer":void 0,onClick:()=>{var te;f(null),(te=i.onClick)==null||te.call(i)},onMouseEnter:()=>i.sublinks?B(v):null,role:"menuitem",children:[s.jsxs("span",{className:e.styles.linkContent,children:[i.label,i.subtitle&&s.jsx("span",{className:e.styles.subtitle,children:i.subtitle})]}),i.isExternal&&s.jsx(D.ExternalLink,{className:e.styles.newTabIcon,size:16})]},i._key??v):s.jsx("button",{className:`${e.styles.sublinkToggle} ${A===v?e.styles.open:""}`,onMouseEnter:()=>B(v),children:s.jsxs("span",{className:e.styles.linkContent,children:[i.label,i.subtitle&&s.jsx("span",{className:e.styles.subtitle,children:i.subtitle})]})},i._key??v))]}),(c==null?void 0:c.sublinks)&&((ne=c==null?void 0:c.sublinks)==null?void 0:ne.length)>0&&s.jsxs("div",{className:`${e.styles.sublinksColumn} ${e.styles.fadeInFromLeft}`,children:[(c==null?void 0:c.description)&&s.jsxs("div",{className:e.styles.sublinksDescription,children:[s.jsx("p",{children:"TEXT HERE"}),a==null?void 0:a(c.description)]}),(c==null?void 0:c.sublinks)&&R(c.sublinks,`${h}-${A}`)]},`${c.label}-${(le=c==null?void 0:c.sublinks)==null?void 0:le.length}`),(l==null?void 0:l.secondaryItems)&&((ae=l==null?void 0:l.secondaryItems)==null?void 0:ae.length)>0&&s.jsx("div",{className:`${e.styles.sublinksColumn} ${e.styles.secondaryColumn}`,children:l.secondaryItems&&l.secondaryItems.length>0&&R(l.secondaryItems,`${h}-secondary`)}),l.spotlight&&s.jsx("div",{className:`${e.styles.sublinksColumn} ${e.styles.spotlightColumn}`,children:s.jsx(Ae,{spotlight:l.spotlight,renderText:a??(i=>String(i))})})]})})})]},l._key??`group-${d}`)}),R=(n,l="")=>n.map(d=>{const h=`${l}/${d.label}`;return s.jsx(e.NavLink,{link:d,path:h,parentPath:l,openPath:H,togglePath:ve,updateTriangleIndicator:Q,setOpenPath:f,renderLinks:R,buttonRefs:I},d._key??h)});return s.jsx("header",{ref:W,className:`${M??""} ${Ee[k]} ${Me[L]} ${e.styles.navbar} ${C?e.styles.sticky:""} ${u&&u.length?e.styles.advanced:e.styles.default}`,"aria-label":"Main navigation",children:s.jsxs("div",{className:`${e.styles.container} ${(!t||t.length===0)&&k!=="center"?e.styles.twoColumn:""}`,children:[w?s.jsx("div",{className:e.styles.logo,children:w}):s.jsx("div",{className:e.styles.title,children:b}),s.jsx("nav",{ref:g,style:{left:k==="center"?`calc(50% - ${re/2}px)`:"0"},className:`${e.styles.nav} ${y?e.styles.open:""} ${de?e.styles.visible:e.styles.hidden}`,id:"main-menu",role:"menubar","aria-label":"Main navigation",children:s.jsxs("div",{className:e.styles.navInner,children:[s.jsx("svg",{style:{left:`${ue}px`},className:`${e.styles.triangle} ${H?e.styles.show:""}`,width:16,height:12,viewBox:"0 0 100 75",xmlns:"http://www.w3.org/2000/svg",children:s.jsx("polygon",{points:"50,5 95,70 5,70",strokeLinejoin:"round",fill:"white",stroke:"white"})}),m==="default"&&x&&s.jsxs("div",{className:e.styles.grid,children:[x&&x.length>0&&R(x),j&&!$&&s.jsxs(s.Fragment,{children:[s.jsx("span",{className:e.styles.separator}),s.jsx(F,{})]}),p&&s.jsx(J,{})]}),!$&&m==="advanced"&&u&&s.jsxs("div",{className:e.styles.grid,children:[u.length>0&&pe(u),j&&s.jsxs(s.Fragment,{children:[s.jsx("span",{className:e.styles.separator}),s.jsx(F,{})]}),p&&s.jsx(J,{})]}),$&&m==="advanced"&&y&&o.length===0&&u&&s.jsx("div",{className:`${e.styles.mobileMenu}`,children:u.map((n,l)=>s.jsx("div",{className:`${e.styles.mobileMenuItem} ${T==="forward"?e.styles.fadeInFromLeft:e.styles.fadeInFromRight}`,children:s.jsx("button",{className:e.styles.sublinkToggle,onClick:()=>me(n),children:n.title})},n._key??l))}),$&&m==="advanced"&&y&&o.length>0&&s.jsxs("div",{className:`${e.styles.mobileMenuSlide} `,children:[s.jsx("button",{className:e.styles.back,onClick:o.length===1?xe:je,children:s.jsx(q.ChevronLeft,{size:18,"aria-hidden":"true",focusable:"false"})}),o[o.length-1].description&&s.jsx("div",{className:`${e.styles.sublinksDescription} ${T==="forward"?e.styles.fadeInFromLeft:e.styles.fadeInFromRight}`,children:a==null?void 0:a(o[o.length-1].description)}),o[o.length-1].primary.map((n,l)=>s.jsx("div",{className:`${e.styles.mobileMenuItem} ${T==="forward"?e.styles.fadeInFromLeft:e.styles.fadeInFromRight}`,children:n.sublinks?s.jsx("button",{className:e.styles.sublinkToggle,onClick:()=>K(n),children:s.jsxs("span",{className:e.styles.linkContent,children:[n.label,n.subtitle&&s.jsx("span",{className:e.styles.subtitle,children:n.subtitle})]})}):s.jsxs("a",{href:n.href,className:e.styles.link,target:n.isExternal?"_blank":"_self",rel:n.isExternal?"noopener noreferrer":void 0,role:"menuitem",children:[s.jsxs("span",{className:e.styles.linkContent,children:[n.label,n.subtitle&&s.jsx("span",{className:e.styles.subtitle,children:n.subtitle})]}),n.isExternal&&s.jsx(D.ExternalLink,{className:e.styles.newTabIcon,size:16})]})},n._key??`primary-${l}`)),o[o.length-1].secondary.length>0&&s.jsx("hr",{className:e.styles.groupDivider}),o[o.length-1].secondary.map((n,l)=>s.jsx("div",{className:`${e.styles.mobileMenuItem} ${T==="forward"?e.styles.fadeInFromLeft:e.styles.fadeInFromRight}`,children:n.sublinks?s.jsx("button",{className:e.styles.sublinkToggle,onClick:()=>K(n),children:n.label}):s.jsxs("a",{href:n.href,className:e.styles.link,target:n.isExternal?"_blank":"_self",rel:n.isExternal?"noopener noreferrer":void 0,role:"menuitem",children:[n.label,n.isExternal&&s.jsx(D.ExternalLink,{className:e.styles.newTabIcon,size:16})]})},n._key??`secondary-${l}`))]},`stack-${o.length}`)]})}),t&&t.length>0&&s.jsx("nav",{className:e.styles.utility,"aria-label":"Utility navigation",children:s.jsx(ce.ButtonGroup,{children:t.map((n,l)=>s.jsx(q.CallToAction,{as:"a",href:n.href??"/",variant:n.variant??"primary",displayType:n.displayType??"text",imageSrc:n.imageSrc,imageAlt:n.imageAlt,"aria-label":n.ariaLabel??n.label,icon:n.icon,iconAlignment:n.iconAlignment,children:n.imageSrc?s.jsx("img",{src:n.imageSrc,alt:n.imageAlt??n.ariaLabel??n.label}):n.label},n._key||l))})}),t&&t.length>0&&s.jsx("nav",{"aria-label":"Utility navigation",className:`${e.styles.utilityMobile} ${y?e.styles.open:""}`,children:s.jsx(ce.ButtonGroup,{alignment:"center",children:s.jsx(q.CallToAction,{as:"a",href:t[1].href??"/",variant:t[1].variant??"primary",displayType:t[1].displayType??"text",imageSrc:t[1].imageSrc,imageAlt:t[1].imageAlt,"aria-label":t[1].ariaLabel??t[1].label,icon:t[1].icon,iconAlignment:t[1].iconAlignment,children:t[1].imageSrc?s.jsx("img",{src:t[1].imageSrc,"aria-label":t[1].imageAlt??t[1].ariaLabel??t[1].label}):t[1].label})})}),s.jsxs("div",{className:e.styles.mobileButtons,children:[$&&j&&s.jsx(F,{}),s.jsx("button",{className:e.styles.menuToggle,onClick:ke,"aria-label":y?"Close menu":"Open menu","aria-expanded":y,"aria-controls":"main-menu",children:y?s.jsx(Ne.X,{size:24}):s.jsx(Le,{size:24})})]})]})})}exports.Navbar=Te;

package/dist/core/components/NavBar/index.mjs

@@ -1,20 +1,20 @@
-import { jsx as a, jsxs as c, Fragment as oe } from "react/jsx-runtime";
-import { useState as f, useEffect as U, useRef as I, useCallback as G } from "react";
-import { Modal as te } from "../Modal/index.mjs";
-import { a as Le, C as H } from "../../../index-CIb65n0z.js";
-import { ButtonGroup as de } from "../ButtonGroup/index.mjs";
-import { s as e, N as Me } from "../../../NavLink-CQpDLYjg.js";
-import { E as X } from "../../../external-link-BOPobeQJ.js";
-import { X as Ee } from "../../../x-CnsEH4Ox.js";
-import { c as V } from "../../../createLucideIcon-C8GTh_Qx.js";
-import { C as Ae } from "../../../chevron-down-DSUzBz9F.js";
+import { jsx as a, jsxs as c, Fragment as de } from "react/jsx-runtime";
+import { useState as f, useEffect as U, useRef as G, useCallback as X } from "react";
+import { Modal as he } from "../Modal/index.mjs";
+import { a as Ee, C as V } from "../../../index-CIb65n0z.js";
+import { ButtonGroup as me } from "../ButtonGroup/index.mjs";
+import { s as e, N as Ae } from "../../../NavLink-CQpDLYjg.js";
+import { E as H } from "../../../external-link-BOPobeQJ.js";
+import { X as _e } from "../../../x-CnsEH4Ox.js";
+import { c as q } from "../../../createLucideIcon-C8GTh_Qx.js";
+import { C as Se } from "../../../chevron-down-DSUzBz9F.js";
 /**
  * @license lucide-react v0.488.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const _e = [
+const Oe = [
   ["path", { d: "M21.54 15H17a2 2 0 0 0-2 2v4.54", key: "1djwo0" }],
   [
     "path",
@@ -25,47 +25,47 @@ const _e = [
   ],
   ["path", { d: "M11 21.95V18a2 2 0 0 0-2-2a2 2 0 0 1-2-2v-1a2 2 0 0 0-2-2H2.05", key: "14pb5j" }],
   ["circle", { cx: "12", cy: "12", r: "10", key: "1mglay" }]
-], Se = V("earth", _e);
+], ze = q("earth", Oe);
 /**
  * @license lucide-react v0.488.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const ze = [
+const xe = [
   ["line", { x1: "4", x2: "20", y1: "12", y2: "12", key: "1e0a9i" }],
   ["line", { x1: "4", x2: "20", y1: "6", y2: "6", key: "1owob3" }],
   ["line", { x1: "4", x2: "20", y1: "18", y2: "18", key: "yk5zj1" }]
-], xe = V("menu", ze);
+], Re = q("menu", xe);
 /**
  * @license lucide-react v0.488.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const Re = [
+const Te = [
   ["circle", { cx: "11", cy: "11", r: "8", key: "4ej97u" }],
   ["path", { d: "m21 21-4.3-4.3", key: "1qie3q" }]
-], Te = V("search", Re), Oe = {
+], We = q("search", Te), Fe = {
   standard: e.standard,
   transparent: e.transparent
-}, We = {
+}, Be = {
   left: e.left,
   center: e.center,
   right: e.right
-}, Fe = ({
+}, je = ({
   spotlight: s,
   renderText: u
 }) => {
-  var i, E, N, w, $, A, p, _, S, z, h;
-  const M = (i = s.image) == null ? void 0 : i.asset.altText, k = ((E = s.callToAction.linkOptions) == null ? void 0 : E.linkType) === "external";
+  var i, E, N, w, $, A, p, _, S, O, h;
+  const L = (i = s.image) == null ? void 0 : i.asset.altText, k = ((E = s.callToAction.linkOptions) == null ? void 0 : E.linkType) === "external";
   let m = "#";
-  return ((N = s.callToAction.linkOptions) == null ? void 0 : N.linkType) === "external" && ((w = s.callToAction.linkOptions) != null && w.externalUrl) ? m = ($ = s.callToAction.linkOptions) == null ? void 0 : $.externalUrl : ((A = s.callToAction.linkOptions) == null ? void 0 : A.linkType) === "internal" && ((_ = (p = s.callToAction.linkOptions) == null ? void 0 : p.internalUrl) != null && _.slug.current) && (m = `/${(z = (S = s.callToAction.linkOptions) == null ? void 0 : S.internalUrl) == null ? void 0 : z.slug.current}`), /* @__PURE__ */ c("div", { className: e.spotlight, children: [
+  return ((N = s.callToAction.linkOptions) == null ? void 0 : N.linkType) === "external" && ((w = s.callToAction.linkOptions) != null && w.externalUrl) ? m = ($ = s.callToAction.linkOptions) == null ? void 0 : $.externalUrl : ((A = s.callToAction.linkOptions) == null ? void 0 : A.linkType) === "internal" && ((_ = (p = s.callToAction.linkOptions) == null ? void 0 : p.internalUrl) != null && _.slug.current) && (m = `/${(O = (S = s.callToAction.linkOptions) == null ? void 0 : S.internalUrl) == null ? void 0 : O.slug.current}`), /* @__PURE__ */ c("div", { className: e.spotlight, children: [
     s.image && /* @__PURE__ */ a("div", { className: e.imageWrapper, children: /* @__PURE__ */ a(
       "img",
       {
         src: (s == null ? void 0 : s.image.imageUrl) ?? "",
-        alt: M || s.image.asset.description || "Content image",
+        alt: L || s.image.asset.description || "Content image",
         width: 600,
         height: 400
       }
@@ -75,7 +75,7 @@ const Re = [
       s.description && /* @__PURE__ */ a("div", { className: e.description, children: u == null ? void 0 : u(s.description, e.description) })
     ] }),
     ((h = s.callToAction) == null ? void 0 : h.linkOptions) && /* @__PURE__ */ a("div", { className: e.actions, children: /* @__PURE__ */ a(
-      H,
+      V,
       {
         as: "a",
         variant: s.callToAction.variant ?? "primary",
@@ -88,10 +88,10 @@ const Re = [
     ) })
   ] });
 };
-function Je({
+function Qe({
   renderText: s,
   title: u,
-  logo: M,
+  logo: L,
   items: k,
   groups: m,
   utilityItems: i,
@@ -103,35 +103,39 @@ function Je({
   navigationType: p = "default",
   searchComponent: _,
   localeSelectComponent: S,
-  className: z
+  className: O
 }) {
-  const [h, q] = f(!1), [J, v] = f(null), [he, me] = f(0), [be, fe] = f(!1), [ue, ve] = f(null), [t, y] = f([]), [x, F] = f(
+  const [h, J] = f(!1), [K, z] = f(!1), [Q, v] = f(null), [fe, be] = f(0), [ue, ve] = f(!1), [ke, pe] = f(null), [t, y] = f([]), [x, B] = f(
     0
-  ), [ke, K] = f(null), [C, pe] = f(!1), [R, T] = f("forward"), B = () => /* @__PURE__ */ a(
+  ), [Ne, Y] = f(null), [C, $e] = f(!1), [R, T] = f("forward"), j = () => /* @__PURE__ */ a(
     "div",
     {
       className: `${e.linkWrapper} ${e.parent} ${e.searchWrapper}`,
       children: /* @__PURE__ */ a("div", { className: e.linkItem, children: /* @__PURE__ */ a(
-        te,
+        he,
         {
           className: e.searchModal,
+          onOpen: () => z(!0),
+          onClose: () => z(!1),
           trigger: /* @__PURE__ */ a(
             "button",
             {
               title: "Search",
               "aria-label": "Search",
               className: e.search,
-              children: /* @__PURE__ */ a(Te, { size: 16 })
+              children: /* @__PURE__ */ a(We, { size: 16 })
             }
           ),
           content: _
         }
       ) })
     }
-  ), Q = () => /* @__PURE__ */ a("div", { className: `${e.linkWrapper} ${e.parent} `, children: /* @__PURE__ */ a("div", { className: e.linkItem, children: /* @__PURE__ */ a(
-    te,
+  ), Z = () => /* @__PURE__ */ a("div", { className: `${e.linkWrapper} ${e.parent} `, children: /* @__PURE__ */ a("div", { className: e.linkItem, children: /* @__PURE__ */ a(
+    he,
     {
       className: e.localeModal,
+      onOpen: () => z(!0),
+      onClose: () => z(!1),
       trigger: /* @__PURE__ */ a(
         "button",
         {
@@ -139,7 +143,7 @@ function Je({
           "aria-label": "Locale Select",
           role: "menuitem",
           className: e.locale,
-          children: /* @__PURE__ */ a(Se, { size: 16 })
+          children: /* @__PURE__ */ a(ze, { size: 16 })
         }
       ),
       content: S
@@ -149,14 +153,14 @@ function Je({
     if (typeof window < "u") {
       const n = () => {
         const l = window.innerWidth < 768;
-        pe(l);
+        $e(l);
       };
       return n(), window.addEventListener("resize", n), () => window.removeEventListener("resize", n);
     }
   }, []);
-  const Ne = () => {
+  const ge = () => {
     y([]);
-  }, $e = (n) => {
+  }, we = (n) => {
     T("forward"), y([
       {
         title: n.title,
@@ -165,7 +169,7 @@ function Je({
         description: ""
       }
     ]);
-  }, Y = (n) => {
+  }, P = (n) => {
     T("forward"), y((l) => [
       ...l,
       {
@@ -175,70 +179,70 @@ function Je({
         description: n.description
       }
     ]);
-  }, ge = () => {
+  }, ye = () => {
     T("backward"), y((n) => n.slice(0, -1));
-  }, j = I(null), L = I(null), D = I(/* @__PURE__ */ new Map()), we = () => {
-    q((n) => {
+  }, D = G(null), M = G(null), I = G(/* @__PURE__ */ new Map()), Ce = () => {
+    J((n) => {
       const l = !n;
       return l || (y([]), T("forward"), v(null)), l;
     });
-  }, Z = (n) => {
-    const l = D.current.get(n);
-    if (l && L.current) {
-      const d = l.getBoundingClientRect(), b = L.current.getBoundingClientRect(), o = d.left - b.left + d.width / 2;
-      ve(o);
+  }, ee = (n) => {
+    const l = I.current.get(n);
+    if (l && M.current) {
+      const d = l.getBoundingClientRect(), b = M.current.getBoundingClientRect(), o = d.left - b.left + d.width / 2;
+      pe(o);
     }
-  }, ye = (n) => {
+  }, Me = (n) => {
     v((l) => l === n ? null : n);
-  }, P = G((n) => {
-    j.current && !j.current.contains(n.target) && v(null);
-  }, []), ee = G(() => {
-    ne(), typeof window < "u" && window.innerWidth > 768 && (q(!1), v(null), typeof document < "u" && (document.body.style.overflow = ""));
-  }, []), ne = G(() => {
-    if (L.current) {
-      const n = L.current.getBoundingClientRect().width;
-      me(n), fe(!0);
+  }, ne = X((n) => {
+    D.current && !D.current.contains(n.target) && v(null);
+  }, []), ae = X(() => {
+    le(), typeof window < "u" && window.innerWidth > 768 && (J(!1), v(null), typeof document < "u" && (document.body.style.overflow = ""));
+  }, []), le = X(() => {
+    if (M.current) {
+      const n = M.current.getBoundingClientRect().width;
+      be(n), ve(!0);
     }
   }, []);
   U(() => {
     const n = typeof window < "u", l = typeof document < "u";
-    return n && window.addEventListener("resize", ee), l && document.addEventListener("click", P), ne(), () => {
-      n && window.removeEventListener("resize", ee), l && document.removeEventListener("click", P);
+    return n && window.addEventListener("resize", ae), l && document.addEventListener("click", ne), le(), () => {
+      n && window.removeEventListener("resize", ae), l && document.removeEventListener("click", ne);
     };
   }, []), U(() => {
     if (typeof document < "u")
-      return document.body.style.overflow = h ? "hidden" : "", () => {
+      return document.body.style.overflow = h || K ? "hidden" : "", () => {
         document.body.style.overflow = "";
       };
-  }, [h]);
-  const Ce = (n) => n.map((l, d) => {
-    var ae, le, se, ie, ce;
-    const b = `group-${d}`, W = ke === d, o = (ae = l.primaryItems) == null ? void 0 : ae[x ?? 0];
+  }, [h, K]);
+  const Le = (n) => n.map((l, d) => {
+    var se, ie, ce, re, oe;
+    const b = `group-${d}`, F = Ne === d, o = (se = l.primaryItems) == null ? void 0 : se[x ?? 0];
     return /* @__PURE__ */ c(
       "div",
       {
         className: `${e.linkWrapper} ${e.parent}`,
         onMouseEnter: () => {
-          K(d), v(b), Z(b);
+          Y(d), v(b), ee(b);
         },
         onMouseLeave: () => {
-          K(null), F(0), v(null);
+          Y(null), B(0), v(null);
         },
         children: [
           /* @__PURE__ */ a("div", { className: e.linkItem, children: /* @__PURE__ */ c(
             "button",
             {
               ref: (r) => {
-                D.current.set(b, r);
+                I.current.set(b, r);
               },
               role: "menuitem",
               "aria-haspopup": "true",
-              "aria-expanded": W,
+              "aria-expanded": F,
               "aria-controls": `submenu-${d}`,
-              className: `${e.sublinkToggle} ${W ? e.open : ""} `,
+              className: `${e.sublinkToggle} ${F ? e.open : ""} `,
               children: [
                 l.title,
-                /* @__PURE__ */ a(Ae, { size: 18, className: e.chevron })
+                /* @__PURE__ */ a(Se, { size: 18, className: e.chevron })
               ]
             }
           ) }),
@@ -246,7 +250,7 @@ function Je({
             "div",
             {
               id: `submenu-${d}`,
-              className: `${e.sublinks} ${W ? e.show : ""}`,
+              className: `${e.sublinks} ${F ? e.show : ""}`,
               role: "menu",
               "aria-label": `${l.title} submenu`,
               children: /* @__PURE__ */ a("div", { children: /* @__PURE__ */ c(
@@ -260,7 +264,7 @@ function Je({
                         className: `${e.sublinksColumn} ${e.primaryColumn}`,
                         children: [
                           /* @__PURE__ */ a("div", { className: e.linkItem }),
-                          (le = l.primaryItems) == null ? void 0 : le.map(
+                          (ie = l.primaryItems) == null ? void 0 : ie.map(
                             (r, g) => r.href ? /* @__PURE__ */ c(
                               "a",
                               {
@@ -269,10 +273,10 @@ function Je({
                                 target: r.isExternal ? "_blank" : "_self",
                                 rel: r.isExternal ? "noopener noreferrer" : void 0,
                                 onClick: () => {
-                                  var re;
-                                  v(null), (re = r.onClick) == null || re.call(r);
+                                  var te;
+                                  v(null), (te = r.onClick) == null || te.call(r);
                                 },
-                                onMouseEnter: () => r.sublinks ? F(g) : null,
+                                onMouseEnter: () => r.sublinks ? B(g) : null,
                                 role: "menuitem",
                                 children: [
                                   /* @__PURE__ */ c("span", { className: e.linkContent, children: [
@@ -280,7 +284,7 @@ function Je({
                                     r.subtitle && /* @__PURE__ */ a("span", { className: e.subtitle, children: r.subtitle })
                                   ] }),
                                   r.isExternal && /* @__PURE__ */ a(
-                                    X,
+                                    H,
                                     {
                                       className: e.newTabIcon,
                                       size: 16
@@ -293,7 +297,7 @@ function Je({
                               "button",
                               {
                                 className: `${e.sublinkToggle} ${x === g ? e.open : ""}`,
-                                onMouseEnter: () => F(g),
+                                onMouseEnter: () => B(g),
                                 children: /* @__PURE__ */ c("span", { className: e.linkContent, children: [
                                   r.label,
                                   r.subtitle && /* @__PURE__ */ a("span", { className: e.subtitle, children: r.subtitle })
@@ -305,7 +309,7 @@ function Je({
                         ]
                       }
                     ),
-                    (o == null ? void 0 : o.sublinks) && ((se = o == null ? void 0 : o.sublinks) == null ? void 0 : se.length) > 0 && /* @__PURE__ */ c(
+                    (o == null ? void 0 : o.sublinks) && ((ce = o == null ? void 0 : o.sublinks) == null ? void 0 : ce.length) > 0 && /* @__PURE__ */ c(
                       "div",
                       {
                         className: `${e.sublinksColumn} ${e.fadeInFromLeft}`,
@@ -314,19 +318,19 @@ function Je({
                             /* @__PURE__ */ a("p", { children: "TEXT HERE" }),
                             s == null ? void 0 : s(o.description)
                           ] }),
-                          (o == null ? void 0 : o.sublinks) && O(
+                          (o == null ? void 0 : o.sublinks) && W(
                             o.sublinks,
                             `${b}-${x}`
                           )
                         ]
                       },
-                      `${o.label}-${(ie = o == null ? void 0 : o.sublinks) == null ? void 0 : ie.length}`
+                      `${o.label}-${(re = o == null ? void 0 : o.sublinks) == null ? void 0 : re.length}`
                     ),
-                    (l == null ? void 0 : l.secondaryItems) && ((ce = l == null ? void 0 : l.secondaryItems) == null ? void 0 : ce.length) > 0 && /* @__PURE__ */ a(
+                    (l == null ? void 0 : l.secondaryItems) && ((oe = l == null ? void 0 : l.secondaryItems) == null ? void 0 : oe.length) > 0 && /* @__PURE__ */ a(
                       "div",
                       {
                         className: `${e.sublinksColumn} ${e.secondaryColumn}`,
-                        children: l.secondaryItems && l.secondaryItems.length > 0 && O(l.secondaryItems, `${b}-secondary`)
+                        children: l.secondaryItems && l.secondaryItems.length > 0 && W(l.secondaryItems, `${b}-secondary`)
                       }
                     ),
                     l.spotlight && /* @__PURE__ */ a(
@@ -334,7 +338,7 @@ function Je({
                       {
                         className: `${e.sublinksColumn} ${e.spotlightColumn}`,
                         children: /* @__PURE__ */ a(
-                          Fe,
+                          je,
                           {
                             spotlight: l.spotlight,
                             renderText: s ?? ((r) => String(r))
@@ -351,20 +355,20 @@ function Je({
       },
       l._key ?? `group-${d}`
     );
-  }), O = (n, l = "") => n.map((d) => {
+  }), W = (n, l = "") => n.map((d) => {
     const b = `${l}/${d.label}`;
     return /* @__PURE__ */ a(
-      Me,
+      Ae,
       {
         link: d,
         path: b,
         parentPath: l,
-        openPath: J,
-        togglePath: ye,
-        updateTriangleIndicator: Z,
+        openPath: Q,
+        togglePath: Me,
+        updateTriangleIndicator: ee,
         setOpenPath: v,
-        renderLinks: O,
-        buttonRefs: D
+        renderLinks: W,
+        buttonRefs: I
       },
       d._key ?? b
     );
@@ -372,23 +376,23 @@ function Je({
   return /* @__PURE__ */ a(
     "header",
     {
-      ref: j,
-      className: `${z ?? ""} ${We[$]} ${Oe[A]} ${e.navbar} ${E ? e.sticky : ""} ${m && m.length ? e.advanced : e.default}`,
+      ref: D,
+      className: `${O ?? ""} ${Be[$]} ${Fe[A]} ${e.navbar} ${E ? e.sticky : ""} ${m && m.length ? e.advanced : e.default}`,
       "aria-label": "Main navigation",
       children: /* @__PURE__ */ c(
         "div",
         {
           className: `${e.container} ${(!i || i.length === 0) && $ !== "center" ? e.twoColumn : ""}`,
           children: [
-            M ? /* @__PURE__ */ a("div", { className: e.logo, children: M }) : /* @__PURE__ */ a("div", { className: e.title, children: u }),
+            L ? /* @__PURE__ */ a("div", { className: e.logo, children: L }) : /* @__PURE__ */ a("div", { className: e.title, children: u }),
             /* @__PURE__ */ a(
               "nav",
               {
-                ref: L,
+                ref: M,
                 style: {
-                  left: $ === "center" ? `calc(50% - ${he / 2}px)` : "0"
+                  left: $ === "center" ? `calc(50% - ${fe / 2}px)` : "0"
                 },
-                className: `${e.nav} ${h ? e.open : ""} ${be ? e.visible : e.hidden}`,
+                className: `${e.nav} ${h ? e.open : ""} ${ue ? e.visible : e.hidden}`,
                 id: "main-menu",
                 role: "menubar",
                 "aria-label": "Main navigation",
@@ -396,8 +400,8 @@ function Je({
                   /* @__PURE__ */ a(
                     "svg",
                     {
-                      style: { left: `${ue}px` },
-                      className: `${e.triangle} ${J ? e.show : ""}`,
+                      style: { left: `${ke}px` },
+                      className: `${e.triangle} ${Q ? e.show : ""}`,
                       width: 16,
                       height: 12,
                       viewBox: "0 0 100 75",
@@ -414,20 +418,20 @@ function Je({
                     }
                   ),
                   p === "default" && k && /* @__PURE__ */ c("div", { className: e.grid, children: [
-                    k && k.length > 0 && O(k),
-                    N && !C && /* @__PURE__ */ c(oe, { children: [
+                    k && k.length > 0 && W(k),
+                    N && !C && /* @__PURE__ */ c(de, { children: [
                       /* @__PURE__ */ a("span", { className: e.separator }),
-                      /* @__PURE__ */ a(B, {})
+                      /* @__PURE__ */ a(j, {})
                     ] }),
-                    w && /* @__PURE__ */ a(Q, {})
+                    w && /* @__PURE__ */ a(Z, {})
                   ] }),
                   !C && p === "advanced" && m && /* @__PURE__ */ c("div", { className: e.grid, children: [
-                    m.length > 0 && Ce(m),
-                    N && /* @__PURE__ */ c(oe, { children: [
+                    m.length > 0 && Le(m),
+                    N && /* @__PURE__ */ c(de, { children: [
                       /* @__PURE__ */ a("span", { className: e.separator }),
-                      /* @__PURE__ */ a(B, {})
+                      /* @__PURE__ */ a(j, {})
                     ] }),
-                    w && /* @__PURE__ */ a(Q, {})
+                    w && /* @__PURE__ */ a(Z, {})
                   ] }),
                   C && p === "advanced" && h && t.length === 0 && m && /* @__PURE__ */ a("div", { className: `${e.mobileMenu}`, children: m.map((n, l) => /* @__PURE__ */ a(
                     "div",
@@ -437,7 +441,7 @@ function Je({
                         "button",
                         {
                           className: e.sublinkToggle,
-                          onClick: () => $e(n),
+                          onClick: () => we(n),
                           children: n.title
                         }
                       )
@@ -453,9 +457,9 @@ function Je({
                           "button",
                           {
                             className: e.back,
-                            onClick: t.length === 1 ? Ne : ge,
+                            onClick: t.length === 1 ? ge : ye,
                             children: /* @__PURE__ */ a(
-                              Le,
+                              Ee,
                               {
                                 size: 18,
                                 "aria-hidden": "true",
@@ -481,7 +485,7 @@ function Je({
                               "button",
                               {
                                 className: e.sublinkToggle,
-                                onClick: () => Y(n),
+                                onClick: () => P(n),
                                 children: /* @__PURE__ */ c("span", { className: e.linkContent, children: [
                                   n.label,
                                   n.subtitle && /* @__PURE__ */ a("span", { className: e.subtitle, children: n.subtitle })
@@ -501,7 +505,7 @@ function Je({
                                     n.subtitle && /* @__PURE__ */ a("span", { className: e.subtitle, children: n.subtitle })
                                   ] }),
                                   n.isExternal && /* @__PURE__ */ a(
-                                    X,
+                                    H,
                                     {
                                       className: e.newTabIcon,
                                       size: 16
@@ -523,7 +527,7 @@ function Je({
                                 "button",
                                 {
                                   className: e.sublinkToggle,
-                                  onClick: () => Y(n),
+                                  onClick: () => P(n),
                                   children: n.label
                                 }
                               ) : /* @__PURE__ */ c(
@@ -537,7 +541,7 @@ function Je({
                                   children: [
                                     n.label,
                                     n.isExternal && /* @__PURE__ */ a(
-                                      X,
+                                      H,
                                       {
                                         className: e.newTabIcon,
                                         size: 16
@@ -557,8 +561,8 @@ function Je({
                 ] })
               }
             ),
-            i && i.length > 0 && /* @__PURE__ */ a("nav", { className: e.utility, "aria-label": "Utility navigation", children: /* @__PURE__ */ a(de, { children: i.map((n, l) => /* @__PURE__ */ a(
-              H,
+            i && i.length > 0 && /* @__PURE__ */ a("nav", { className: e.utility, "aria-label": "Utility navigation", children: /* @__PURE__ */ a(me, { children: i.map((n, l) => /* @__PURE__ */ a(
+              V,
               {
                 as: "a",
                 href: n.href ?? "/",
@@ -584,8 +588,8 @@ function Je({
               {
                 "aria-label": "Utility navigation",
                 className: `${e.utilityMobile} ${h ? e.open : ""}`,
-                children: /* @__PURE__ */ a(de, { alignment: "center", children: /* @__PURE__ */ a(
-                  H,
+                children: /* @__PURE__ */ a(me, { alignment: "center", children: /* @__PURE__ */ a(
+                  V,
                   {
                     as: "a",
                     href: i[1].href ?? "/",
@@ -608,16 +612,16 @@ function Je({
               }
             ),
             /* @__PURE__ */ c("div", { className: e.mobileButtons, children: [
-              C && N && /* @__PURE__ */ a(B, {}),
+              C && N && /* @__PURE__ */ a(j, {}),
               /* @__PURE__ */ a(
                 "button",
                 {
                   className: e.menuToggle,
-                  onClick: we,
+                  onClick: Ce,
                   "aria-label": h ? "Close menu" : "Open menu",
                   "aria-expanded": h,
                   "aria-controls": "main-menu",
-                  children: h ? /* @__PURE__ */ a(Ee, { size: 24 }) : /* @__PURE__ */ a(xe, { size: 24 })
+                  children: h ? /* @__PURE__ */ a(_e, { size: 24 }) : /* @__PURE__ */ a(Re, { size: 24 })
                 }
               )
             ] })
@@ -628,5 +632,5 @@ function Je({
   );
 }
 export {
-  Je as Navbar
+  Qe as Navbar
 };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "quirk-ui",
   "private": false,
-  "version": "0.0.459",
+  "version": "0.0.461",
   "type": "module",
   "exports": {
     ".": {