quirk-ui 0.0.464 → 0.0.465

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -13,4 +13,4 @@
13
13
  *
14
14
  * This source code is licensed under the ISC license.
15
15
  * See the LICENSE file in the root directory of this source tree.
16
- */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},Ee=({spotlight:a,renderText:b})=>{var t,C,j,p,k,L,x,_,S,E,y;const w=(t=a.image)==null?void 0:t.asset.altText,f=((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"&&((_=(x=a.callToAction.linkOptions)==null?void 0:x.internalUrl)!=null&&_.slug.current)&&(u=`/${(E=(S=a.callToAction.linkOptions)==null?void 0:S.internalUrl)==null?void 0:E.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:f?"_blank":"_self",rel:f?"noopener noreferrer":"","aria-label":a.callToAction.ariaLabel||a.callToAction.label,children:a.callToAction.label})})]})};function Me({renderText:a,title:b,logo:w,items:f,groups:u,utilityItems:t,isSticky:C=!1,showSearch:j=!0,showLocaleSelect:p=!0,alignment:k="right",variant:L="standard",navigationType:x="default",searchComponent:_,localeSelectComponent:S,className:E}){const[y,G]=r.useState(!1),[U,m]=r.useState(null),[ie,ce]=r.useState(0),[re,oe]=r.useState(!1),[de,ye]=r.useState(null),[o,N]=r.useState([]),[M,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([])},me=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}])},fe=()=>{T("backward"),N(n=>n.slice(0,-1))},F=r.useRef(null),g=r.useRef(null),W=r.useRef(new Map),xe=()=>{G(n=>{const l=!n;return l||(N([]),T("forward"),m(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=>{m(l=>l===n?null:n)},K=r.useCallback(n=>{F.current&&!F.current.contains(n.target)&&m(null)},[]),Q=r.useCallback(()=>{Y(),typeof window<"u"&&window.innerWidth>768&&(G(!1),m(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"){const n=document.documentElement;return y?n.classList.add("no-scroll"):n.classList.remove("no-scroll"),()=>{n.classList.remove("no-scroll")}}},[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[M??0];return s.jsxs("div",{className:`${e.styles.linkWrapper} ${e.styles.parent}`,onMouseEnter:()=>{X(d),m(h),J(h)},onMouseLeave:()=>{X(null),q(0),m(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} ${M===v?e.styles.open:""}`,target:i.isExternal?"_blank":"_self",rel:i.isExternal?"noopener noreferrer":void 0,onClick:()=>{var le;m(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} ${M===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}-${M}`)]},`${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(Ee,{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:m,renderLinks:R,buttonRefs:W},d._key??h)});return s.jsx("header",{ref:F,className:`${E??""} ${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"})}),x==="default"&&f&&s.jsxs("div",{className:e.styles.grid,children:[f&&f.length>0&&R(f),j&&!$&&s.jsxs(s.Fragment,{children:[s.jsx("span",{className:e.styles.separator}),s.jsx(B,{})]}),p&&s.jsx(H,{})]}),!$&&x==="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,{})]}),$&&x==="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:()=>me(n),children:n.title})},n._key??l))}),$&&x==="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:fe,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:xe,"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=Me;
16
+ */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},Ee=({spotlight:a,renderText:b})=>{var t,C,j,p,k,L,x,_,S,E,d;const w=(t=a.image)==null?void 0:t.asset.altText,f=((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"&&((_=(x=a.callToAction.linkOptions)==null?void 0:x.internalUrl)!=null&&_.slug.current)&&(u=`/${(E=(S=a.callToAction.linkOptions)==null?void 0:S.internalUrl)==null?void 0:E.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)})]}),((d=a.callToAction)==null?void 0:d.linkOptions)&&s.jsx("div",{className:e.styles.actions,children:s.jsx(O.CallToAction,{as:"a",variant:a.callToAction.variant??"primary",href:u,target:f?"_blank":"_self",rel:f?"noopener noreferrer":"","aria-label":a.callToAction.ariaLabel||a.callToAction.label,children:a.callToAction.label})})]})};function Me({renderText:a,title:b,logo:w,items:f,groups:u,utilityItems:t,isSticky:C=!1,showSearch:j=!0,showLocaleSelect:p=!0,alignment:k="right",variant:L="standard",navigationType:x="default",searchComponent:_,localeSelectComponent:S,className:E}){const[d,G]=r.useState(!1),[U,m]=r.useState(null),[ie,ce]=r.useState(0),[re,oe]=r.useState(!1),[de,ye]=r.useState(null),[o,N]=r.useState([]),[M,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([])},me=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}])},fe=()=>{T("backward"),N(n=>n.slice(0,-1))},F=r.useRef(null),g=r.useRef(null),W=r.useRef(new Map),xe=()=>{G(n=>{const l=!n;return l||(N([]),T("forward"),m(null)),l})},J=n=>{const l=W.current.get(n);if(l&&g.current){const y=l.getBoundingClientRect(),h=g.current.getBoundingClientRect(),c=y.left-h.left+y.width/2;ye(c)}},je=n=>{m(l=>l===n?null:n)},K=r.useCallback(n=>{F.current&&!F.current.contains(n.target)&&m(null)},[]),Q=r.useCallback(()=>{Y(),typeof window<"u"&&window.innerWidth>768&&(G(!1),m(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(console.log("OPEN",d),typeof document<"u"){const n=document.documentElement;return d?n.classList.add("no-scroll"):n.classList.remove("no-scroll"),()=>{n.classList.remove("no-scroll")}}},[d]);const ke=n=>n.map((l,y)=>{var Z,P,ee,se,ne;const h=`group-${y}`,z=ue===y,c=(Z=l.primaryItems)==null?void 0:Z[M??0];return s.jsxs("div",{className:`${e.styles.linkWrapper} ${e.styles.parent}`,onMouseEnter:()=>{X(y),m(h),J(h)},onMouseLeave:()=>{X(null),q(0),m(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-${y}`,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-${y}`,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} ${M===v?e.styles.open:""}`,target:i.isExternal?"_blank":"_self",rel:i.isExternal?"noopener noreferrer":void 0,onClick:()=>{var le;m(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} ${M===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}-${M}`)]},`${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(Ee,{spotlight:l.spotlight,renderText:a??(i=>String(i))})})]})})})]},l._key??`group-${y}`)}),R=(n,l="")=>n.map(y=>{const h=`${l}/${y.label}`;return s.jsx(e.NavLink,{link:y,path:h,parentPath:l,openPath:U,togglePath:je,updateTriangleIndicator:J,setOpenPath:m,renderLinks:R,buttonRefs:W},y._key??h)});return s.jsx("header",{ref:F,className:`${E??""} ${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} ${d?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"})}),x==="default"&&f&&s.jsxs("div",{className:e.styles.grid,children:[f&&f.length>0&&R(f),j&&!$&&s.jsxs(s.Fragment,{children:[s.jsx("span",{className:e.styles.separator}),s.jsx(B,{})]}),p&&s.jsx(H,{})]}),!$&&x==="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,{})]}),$&&x==="advanced"&&d&&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:()=>me(n),children:n.title})},n._key??l))}),$&&x==="advanced"&&d&&o.length>0&&s.jsxs("div",{className:`${e.styles.mobileMenuSlide} `,children:[s.jsx("button",{className:e.styles.back,onClick:o.length===1?be:fe,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} ${d?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:xe,"aria-label":d?"Close menu":"Open menu","aria-expanded":d,"aria-controls":"main-menu",children:d?s.jsx(ve.X,{size:24}):s.jsx(we,{size:24})})]})]})})}exports.Navbar=Me;
@@ -57,7 +57,7 @@ const Re = [
57
57
  spotlight: s,
58
58
  renderText: u
59
59
  }) => {
60
- var i, M, N, w, $, A, p, _, S, z, h;
60
+ var i, M, N, w, $, A, p, _, S, z, d;
61
61
  const E = (i = s.image) == null ? void 0 : i.asset.altText, k = ((M = s.callToAction.linkOptions) == null ? void 0 : M.linkType) === "external";
62
62
  let m = "#";
63
63
  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: [
@@ -74,7 +74,7 @@ const Re = [
74
74
  s.title && /* @__PURE__ */ a("div", { className: e.title, children: u == null ? void 0 : u(s.title, e.title) }),
75
75
  s.description && /* @__PURE__ */ a("div", { className: e.description, children: u == null ? void 0 : u(s.description, e.description) })
76
76
  ] }),
77
- ((h = s.callToAction) == null ? void 0 : h.linkOptions) && /* @__PURE__ */ a("div", { className: e.actions, children: /* @__PURE__ */ a(
77
+ ((d = s.callToAction) == null ? void 0 : d.linkOptions) && /* @__PURE__ */ a("div", { className: e.actions, children: /* @__PURE__ */ a(
78
78
  H,
79
79
  {
80
80
  as: "a",
@@ -105,7 +105,7 @@ function Je({
105
105
  localeSelectComponent: S,
106
106
  className: z
107
107
  }) {
108
- const [h, q] = b(!1), [J, v] = b(null), [he, me] = b(0), [fe, be] = b(!1), [ue, ve] = b(null), [t, y] = b([]), [x, F] = b(
108
+ const [d, q] = b(!1), [J, v] = b(null), [he, me] = b(0), [fe, be] = b(!1), [ue, ve] = b(null), [t, y] = b([]), [x, F] = b(
109
109
  0
110
110
  ), [ke, K] = b(null), [C, pe] = b(!1), [R, T] = b("forward"), B = () => /* @__PURE__ */ a(
111
111
  "div",
@@ -185,7 +185,7 @@ function Je({
185
185
  }, Z = (n) => {
186
186
  const l = D.current.get(n);
187
187
  if (l && L.current) {
188
- const d = l.getBoundingClientRect(), f = L.current.getBoundingClientRect(), o = d.left - f.left + d.width / 2;
188
+ const h = l.getBoundingClientRect(), f = L.current.getBoundingClientRect(), o = h.left - f.left + h.width / 2;
189
189
  ve(o);
190
190
  }
191
191
  }, ye = (n) => {
@@ -206,22 +206,22 @@ function Je({
206
206
  n && window.removeEventListener("resize", ee), l && document.removeEventListener("click", P);
207
207
  };
208
208
  }, []), U(() => {
209
- if (typeof document < "u") {
209
+ if (console.log("OPEN", d), typeof document < "u") {
210
210
  const n = document.documentElement;
211
- return h ? n.classList.add("no-scroll") : n.classList.remove("no-scroll"), () => {
211
+ return d ? n.classList.add("no-scroll") : n.classList.remove("no-scroll"), () => {
212
212
  n.classList.remove("no-scroll");
213
213
  };
214
214
  }
215
- }, [h]);
216
- const Ce = (n) => n.map((l, d) => {
215
+ }, [d]);
216
+ const Ce = (n) => n.map((l, h) => {
217
217
  var ae, le, se, ie, ce;
218
- const f = `group-${d}`, W = ke === d, o = (ae = l.primaryItems) == null ? void 0 : ae[x ?? 0];
218
+ const f = `group-${h}`, W = ke === h, o = (ae = l.primaryItems) == null ? void 0 : ae[x ?? 0];
219
219
  return /* @__PURE__ */ c(
220
220
  "div",
221
221
  {
222
222
  className: `${e.linkWrapper} ${e.parent}`,
223
223
  onMouseEnter: () => {
224
- K(d), v(f), Z(f);
224
+ K(h), v(f), Z(f);
225
225
  },
226
226
  onMouseLeave: () => {
227
227
  K(null), F(0), v(null);
@@ -236,7 +236,7 @@ function Je({
236
236
  role: "menuitem",
237
237
  "aria-haspopup": "true",
238
238
  "aria-expanded": W,
239
- "aria-controls": `submenu-${d}`,
239
+ "aria-controls": `submenu-${h}`,
240
240
  className: `${e.sublinkToggle} ${W ? e.open : ""} `,
241
241
  children: [
242
242
  l.title,
@@ -247,7 +247,7 @@ function Je({
247
247
  /* @__PURE__ */ a(
248
248
  "div",
249
249
  {
250
- id: `submenu-${d}`,
250
+ id: `submenu-${h}`,
251
251
  className: `${e.sublinks} ${W ? e.show : ""}`,
252
252
  role: "menu",
253
253
  "aria-label": `${l.title} submenu`,
@@ -351,14 +351,14 @@ function Je({
351
351
  )
352
352
  ]
353
353
  },
354
- l._key ?? `group-${d}`
354
+ l._key ?? `group-${h}`
355
355
  );
356
- }), O = (n, l = "") => n.map((d) => {
357
- const f = `${l}/${d.label}`;
356
+ }), O = (n, l = "") => n.map((h) => {
357
+ const f = `${l}/${h.label}`;
358
358
  return /* @__PURE__ */ a(
359
359
  Ee,
360
360
  {
361
- link: d,
361
+ link: h,
362
362
  path: f,
363
363
  parentPath: l,
364
364
  openPath: J,
@@ -368,7 +368,7 @@ function Je({
368
368
  renderLinks: O,
369
369
  buttonRefs: D
370
370
  },
371
- d._key ?? f
371
+ h._key ?? f
372
372
  );
373
373
  });
374
374
  return /* @__PURE__ */ a(
@@ -390,7 +390,7 @@ function Je({
390
390
  style: {
391
391
  left: $ === "center" ? `calc(50% - ${he / 2}px)` : "0"
392
392
  },
393
- className: `${e.nav} ${h ? e.open : ""} ${fe ? e.visible : e.hidden}`,
393
+ className: `${e.nav} ${d ? e.open : ""} ${fe ? e.visible : e.hidden}`,
394
394
  id: "main-menu",
395
395
  role: "menubar",
396
396
  "aria-label": "Main navigation",
@@ -431,7 +431,7 @@ function Je({
431
431
  ] }),
432
432
  w && /* @__PURE__ */ a(Q, {})
433
433
  ] }),
434
- C && p === "advanced" && h && t.length === 0 && m && /* @__PURE__ */ a("div", { className: `${e.mobileMenu}`, children: m.map((n, l) => /* @__PURE__ */ a(
434
+ C && p === "advanced" && d && t.length === 0 && m && /* @__PURE__ */ a("div", { className: `${e.mobileMenu}`, children: m.map((n, l) => /* @__PURE__ */ a(
435
435
  "div",
436
436
  {
437
437
  className: `${e.mobileMenuItem} ${R === "forward" ? e.fadeInFromLeft : e.fadeInFromRight}`,
@@ -446,7 +446,7 @@ function Je({
446
446
  },
447
447
  n._key ?? l
448
448
  )) }),
449
- C && p === "advanced" && h && t.length > 0 && /* @__PURE__ */ c(
449
+ C && p === "advanced" && d && t.length > 0 && /* @__PURE__ */ c(
450
450
  "div",
451
451
  {
452
452
  className: `${e.mobileMenuSlide} `,
@@ -585,7 +585,7 @@ function Je({
585
585
  "nav",
586
586
  {
587
587
  "aria-label": "Utility navigation",
588
- className: `${e.utilityMobile} ${h ? e.open : ""}`,
588
+ className: `${e.utilityMobile} ${d ? e.open : ""}`,
589
589
  children: /* @__PURE__ */ a(de, { alignment: "center", children: /* @__PURE__ */ a(
590
590
  H,
591
591
  {
@@ -616,10 +616,10 @@ function Je({
616
616
  {
617
617
  className: e.menuToggle,
618
618
  onClick: we,
619
- "aria-label": h ? "Close menu" : "Open menu",
620
- "aria-expanded": h,
619
+ "aria-label": d ? "Close menu" : "Open menu",
620
+ "aria-expanded": d,
621
621
  "aria-controls": "main-menu",
622
- children: h ? /* @__PURE__ */ a(Me, { size: 24 }) : /* @__PURE__ */ a(xe, { size: 24 })
622
+ children: d ? /* @__PURE__ */ a(Me, { size: 24 }) : /* @__PURE__ */ a(xe, { size: 24 })
623
623
  }
624
624
  )
625
625
  ] })
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "quirk-ui",
3
3
  "private": false,
4
- "version": "0.0.464",
4
+ "version": "0.0.465",
5
5
  "type": "module",
6
6
  "exports": {
7
7
  ".": {