quirk-ui 0.1.185 → 0.1.186

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.
Files changed (3) hide show
  1. package/dist/core/components/NavBar/index.cjs +2 -2
  2. package/dist/core/components/NavBar/index.mjs +97 -88
  3. package/package.json +1 -1
package/dist/core/components/NavBar/index.cjs CHANGED
@@ -1,4 +1,4 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),a=require("react"),re=require("../Modal/index.cjs"),I=require("../../../index-0SVQqhAg.cjs"),oe=require("../ButtonGroup/index.cjs"),s=require("../../../NavLink-D7gEjWa8.cjs"),P=require("../../../chevron-right-motlyADs.cjs"),_e=require("../../../x-Dft9NVe_.cjs"),ce=require("../../../createLucideIcon-DpotSgUx.cjs"),de=require("../../../external-link-DDShu-48.cjs"),Ie=require("../../../chevron-down-DfK1XBl3.cjs");/**
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),a=require("react"),re=require("../Modal/index.cjs"),_=require("../../../index-0SVQqhAg.cjs"),oe=require("../ButtonGroup/index.cjs"),e=require("../../../NavLink-D7gEjWa8.cjs"),P=require("../../../chevron-right-motlyADs.cjs"),Me=require("../../../x-Dft9NVe_.cjs"),ce=require("../../../createLucideIcon-DpotSgUx.cjs"),de=require("../../../external-link-DDShu-48.cjs"),_e=require("../../../chevron-down-DfK1XBl3.cjs");/**
2
2
  * @license lucide-react v0.488.0 - ISC
3
3
  *
4
4
  * This source code is licensed under the ISC license.
@@ -8,4 +8,4 @@
8
8
  *
9
9
  * This source code is licensed under the ISC license.
10
10
  * See the LICENSE file in the root directory of this source tree.
11
- */const ze=[["circle",{cx:"11",cy:"11",r:"8",key:"4ej97u"}],["path",{d:"m21 21-4.3-4.3",key:"1qie3q"}]],Ae=ce.createLucideIcon("search",ze),Re={standard:s.styles.standard,transparent:s.styles.transparent},qe={left:s.styles.left,center:s.styles.center,right:s.styles.right},De=({spotlight:t,renderText:f})=>{var y,k,v,g,N,R;const d=t.callToAction;if(!d)return null;const p=((y=d.linkOptions)==null?void 0:y.linkType)==="external";let u="#";return p&&((k=d.linkOptions)!=null&&k.externalUrl)?u=d.linkOptions.externalUrl:((v=d.linkOptions)==null?void 0:v.linkType)==="internal"&&((N=(g=d.linkOptions)==null?void 0:g.internalUrl)!=null&&N.slug.current)&&(u=`/${d.linkOptions.internalUrl.slug.current}`),e.jsxs("div",{className:s.styles.spotlight,children:[t.image&&e.jsx("div",{className:s.styles.imageWrapper,children:e.jsx("img",{src:((R=t.image.imageUrls)==null?void 0:R.medium)??"",alt:t.image.asset.altText||t.image.asset.description||"Content image",width:600,height:400})}),e.jsxs("div",{className:s.styles.content,children:[t.title&&e.jsx("div",{className:s.styles.title,children:f==null?void 0:f(t.title,s.styles.title)}),t.description&&e.jsx("div",{className:s.styles.description,children:f==null?void 0:f(t.description,s.styles.description)})]}),d.linkOptions&&e.jsx("div",{className:s.styles.actions,children:e.jsx(I.Button,{as:"a",variant:d.variant??"primary",href:u,target:p?"_blank":"_self",rel:p?"noopener noreferrer":void 0,"aria-label":d.ariaLabel||d.label,children:d.label})})]})};function O({item:t,animationDirection:f,onNavigate:d,onClose:p}){var k;const u=(((k=t.sublinks)==null?void 0:k.length)??0)>0,y=f==="forward"?s.styles.slideIn:s.styles.slideInBack;return e.jsx("div",{className:`${s.styles.mobileItem} ${y}`,role:"menuitem",children:u?e.jsxs("button",{className:s.styles.mobileTrigger,onClick:()=>d(t),children:[e.jsxs("span",{className:s.styles.mobileItemLabel,children:[t.label,t.subtitle&&e.jsx("span",{className:s.styles.mobileItemSubtitle,children:t.subtitle})]}),e.jsx(P.ChevronRight,{size:16,className:s.styles.mobileChevron,"aria-hidden":"true"})]}):e.jsxs("a",{href:t.href??"#",className:s.styles.mobileLink,target:t.isExternal?"_blank":"_self",rel:t.isExternal?"noopener noreferrer":void 0,onClick:p,children:[e.jsxs("span",{className:s.styles.mobileItemLabel,children:[t.label,t.subtitle&&e.jsx("span",{className:s.styles.mobileItemSubtitle,children:t.subtitle})]}),t.isExternal&&e.jsx(de.ExternalLink,{size:14,className:s.styles.newTabIcon,"aria-hidden":"true"})]})})}function Oe({renderText:t,title:f,logo:d,items:p,groups:u,utilityItems:y,isSticky:k=!1,showSearch:v=!0,showLocaleSelect:g=!0,showThemeToggle:N=!0,themeToggleComponent:R,alignment:X="right",variant:F="standard",navigationType:C="default",searchComponent:ue,localeSelectComponent:ye,className:me,style:he,...be}){const[m,S]=a.useState(!1),[T,j]=a.useState(null),[fe,pe]=a.useState(!1),[J,xe]=a.useState(!1),[ve,je]=a.useState(null),[h,E]=a.useState([]),[w,G]=a.useState([]),[q,U]=a.useState(0),[ke,Q]=a.useState(null),[$,ge]=a.useState(!1),[B,L]=a.useState("forward"),W=a.useRef(null),M=a.useRef(null),Z=a.useRef(null),Y=a.useRef(new Map),ee=()=>e.jsx("div",{className:`${s.styles.linkWrapper} ${s.styles.parent}`,role:"presentation",children:e.jsx("div",{className:`${s.styles.linkItem} ${s.styles.themeToggle}`,role:"presentation",children:R})}),K=()=>e.jsx("div",{className:`${s.styles.linkWrapper} ${s.styles.parent} ${s.styles.searchWrapper}`,children:e.jsx("div",{className:s.styles.linkItem,children:e.jsx(re.Modal,{size:"lg",className:s.styles.searchModal,trigger:e.jsx("button",{title:"Search","aria-label":"Search",className:s.styles.search,children:e.jsx(Ae,{size:16,"aria-hidden":"true"})}),content:ue})})}),se=()=>e.jsx("div",{className:`${s.styles.linkWrapper} ${s.styles.parent}`,children:e.jsx("div",{className:s.styles.linkItem,children:e.jsx(re.Modal,{className:s.styles.localeModal,trigger:e.jsx("button",{title:"Locale Select","aria-label":"Locale Select",className:s.styles.locale,children:e.jsx(Be,{size:16,"aria-hidden":"true"})}),content:ye})})}),le=()=>{S(l=>{const n=!l;return n||(E([]),G([]),L("forward"),j(null)),n})},ne=a.useCallback(l=>{const n=Y.current.get(l);if(n&&M.current){const c=n.getBoundingClientRect(),i=M.current.getBoundingClientRect();je(c.left-i.left+c.width/2)}},[]),Ne=a.useCallback(l=>{j(n=>n===l?null:l)},[]),V=a.useCallback(l=>{W.current&&!W.current.contains(l.target)&&j(null)},[]),H=a.useCallback(()=>{typeof window<"u"&&window.innerWidth>768&&(S(!1),j(null))},[]),we=()=>E([]),te=l=>{L("forward"),G(n=>[...n,{title:l.label,primary:l.sublinks??[],secondary:[],description:l.description}])},$e=()=>{L("backward"),G(l=>l.slice(0,-1))},Ce=l=>{L("forward"),E([{title:l.title,primary:l.primaryItems??[],secondary:l.secondaryItems??[],description:""}])},ae=l=>{L("forward"),E(n=>[...n,{title:l.label,primary:l.sublinks??[],secondary:[],description:l.description}])},Se=()=>{L("backward"),E(l=>l.slice(0,-1))};a.useEffect(()=>{if(typeof window>"u")return;const l=()=>ge(window.innerWidth<768);return l(),window.addEventListener("resize",l),()=>window.removeEventListener("resize",l)},[]),a.useEffect(()=>{if(typeof window>"u")return;const l=()=>xe(window.scrollY>10);return l(),window.addEventListener("scroll",l,{passive:!0}),()=>window.removeEventListener("scroll",l)},[]),a.useEffect(()=>{const l=typeof window<"u",n=typeof document<"u";return l&&window.addEventListener("resize",H),n&&document.addEventListener("click",V),pe(!0),()=>{l&&window.removeEventListener("resize",H),n&&document.removeEventListener("click",V)}},[H,V]),a.useEffect(()=>{if(!(typeof document>"u")){if(m){const l=window.scrollY;document.body.style.position="fixed",document.body.style.top=`-${l}px`,document.body.style.width="100%",document.body.style.overflowY="scroll"}else{const l=Math.abs(parseInt(document.body.style.top||"0",10));document.body.style.position="",document.body.style.top="",document.body.style.width="",document.body.style.overflowY="",window.scrollTo(0,l)}return()=>{const l=Math.abs(parseInt(document.body.style.top||"0",10));document.body.style.position="",document.body.style.top="",document.body.style.width="",document.body.style.overflowY="",l&&window.scrollTo(0,l)}}},[m]),a.useEffect(()=>{var c;if(!m)return;if(typeof window<"u"&&typeof window.matchMedia=="function"&&window.matchMedia("(pointer: fine)").matches){const i=(c=M.current)==null?void 0:c.querySelector('a[href], button:not([disabled]), input, select, textarea, [tabindex]:not([tabindex="-1"])');i==null||i.focus()}const n=i=>{var A;if(i.key==="Escape"){le(),(A=Z.current)==null||A.focus();return}if(i.key!=="Tab"||!M.current)return;const x=Array.from(M.current.querySelectorAll('a[href], button:not([disabled]), input, select, textarea, [tabindex]:not([tabindex="-1"])')).filter(o=>!o.closest("[aria-hidden=true]"));if(x.length===0)return;const b=x[0],z=x[x.length-1];i.shiftKey?document.activeElement===b&&(i.preventDefault(),z.focus()):document.activeElement===z&&(i.preventDefault(),b.focus())};return document.addEventListener("keydown",n),()=>document.removeEventListener("keydown",n)},[m]);const D=(l,n="")=>l.map((c,i)=>{const x=`${n}/${c._key??c.label}-${i}`;return e.jsx(s.NavLink,{link:c,path:x,parentPath:n,openPath:T,togglePath:Ne,updateTriangleIndicator:ne,setOpenPath:j,renderLinks:D,buttonRefs:Y},x)}),Le=l=>l.map((n,c)=>{var z,A;const i=`group-${c}`,x=ke===c,b=(z=n.primaryItems)==null?void 0:z[q??0];return e.jsxs("div",{className:`${s.styles.linkWrapper} ${s.styles.parent}`,onMouseEnter:()=>{Q(c),j(i),ne(i)},children:[e.jsx("div",{className:s.styles.linkItem,children:e.jsxs("button",{ref:o=>{Y.current.set(i,o)},"aria-haspopup":!0,"aria-expanded":x,"aria-controls":`submenu-${c}`,className:`${s.styles.sublinkToggle} ${x?s.styles.open:""}`,children:[n.title,e.jsx(Ie.ChevronDown,{size:18,className:s.styles.chevron,"aria-hidden":"true"})]})}),e.jsx("div",{id:`submenu-${c}`,className:`${s.styles.sublinks} ${x?s.styles.show:""}`,role:"menu","aria-label":`${n.title} submenu`,onMouseLeave:()=>{Q(null),U(0),j(null)},children:e.jsx("div",{children:e.jsxs("div",{className:`${s.styles.sublinksInner} ${n.spotlight?s.styles.withSpotlight:s.styles.withoutSpotlight}`,children:[e.jsxs("div",{className:`${s.styles.sublinksColumn} ${s.styles.primaryColumn}`,children:[e.jsx("div",{className:s.styles.linkItem}),(A=n.primaryItems)==null?void 0:A.map((o,_)=>o.href?e.jsx("div",{role:"menuitem",children:e.jsxs("a",{href:o.href,className:`${s.styles.link} ${q===_?s.styles.open:""}`,target:o.isExternal?"_blank":"_self",rel:o.isExternal?"noopener noreferrer":void 0,onClick:()=>{var ie;j(null),(ie=o.onClick)==null||ie.call(o)},onMouseEnter:()=>U(_),children:[e.jsxs("span",{className:s.styles.linkContent,children:[o.label,o.subtitle&&e.jsx("span",{className:s.styles.subtitle,children:o.subtitle})]}),o.isExternal&&e.jsx(de.ExternalLink,{className:s.styles.newTabIcon,size:16,"aria-hidden":"true"})]})},o._key??_):e.jsx("div",{role:"menuitem",children:e.jsx("button",{className:`${s.styles.sublinkToggle} ${q===_?s.styles.open:""}`,onMouseEnter:()=>U(_),children:e.jsxs("span",{className:s.styles.linkContent,children:[o.label,o.subtitle&&e.jsx("span",{className:s.styles.subtitle,children:o.subtitle})]})})},o._key??_))]}),(b==null?void 0:b.sublinks)&&b.sublinks.length>0&&e.jsxs("div",{className:`${s.styles.sublinksColumn} ${s.styles.fadeInFromLeft}`,children:[b.description&&e.jsx("div",{className:s.styles.sublinksDescription,children:t==null?void 0:t(b.description)}),D(b.sublinks,`${i}-${q}`)]},`${b.label}-${b.sublinks.length}`),n.secondaryItems&&n.secondaryItems.length>0&&e.jsx("div",{className:`${s.styles.sublinksColumn} ${s.styles.secondaryColumn}`,children:D(n.secondaryItems,`${i}-secondary`)}),n.spotlight&&e.jsx("div",{className:`${s.styles.sublinksColumn} ${s.styles.spotlightColumn}`,children:e.jsx(De,{spotlight:n.spotlight,renderText:t})})]})})})]},n._key??`group-${c}`)}),Me=[s.styles.navbar,qe[X],Re[F],k?s.styles.sticky:"",u!=null&&u.length?s.styles.advanced:s.styles.default,me??""].filter(Boolean).join(" "),r=y&&y.length>0?y[Math.min(1,y.length-1)]:null;return e.jsx("header",{ref:W,className:Me,style:he,"aria-label":"Site header",...be,children:e.jsxs("div",{className:`${s.styles.container} ${(!y||y.length===0)&&X!=="center"?s.styles.twoColumn:""}`,children:[d?e.jsx("div",{className:s.styles.logo,children:d}):f?e.jsx("div",{className:s.styles.title,children:f}):null,e.jsx("nav",{ref:M,"aria-modal":m?"true":void 0,className:`${s.styles.nav} ${m?s.styles.open:""} ${fe?s.styles.visible:s.styles.hidden}`,id:"main-menu","aria-label":"Primary navigation",children:e.jsxs("div",{className:s.styles.navInner,children:[e.jsx("svg",{style:{left:`${ve}px`},className:`${s.styles.triangle} ${T?s.styles.show:""}`,width:16,height:12,viewBox:"0 0 100 75",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:e.jsx("polygon",{points:"50,5 95,70 5,70",strokeLinejoin:"round",fill:"white",stroke:"white"})}),C==="default"&&p&&!$&&e.jsxs("div",{className:s.styles.grid,children:[p.length>0&&e.jsx("div",{role:"menubar",className:s.styles.menubar,children:D(p)}),(v||g||N)&&e.jsxs(e.Fragment,{children:[e.jsx("span",{className:s.styles.separator,"aria-hidden":"true"}),e.jsxs("div",{role:"toolbar","aria-label":"Site controls",className:s.styles.toolbar,children:[N&&e.jsx(ee,{}),v&&e.jsx(K,{}),g&&e.jsx(se,{})]})]})]}),C==="default"&&p&&$&&m&&w.length===0&&e.jsx("div",{className:s.styles.mobileMenu,children:p.map((l,n)=>e.jsx(O,{item:l,animationDirection:B,onNavigate:te,onClose:()=>S(!1)},l._key??n))}),C==="default"&&$&&m&&w.length>0&&e.jsxs("div",{className:s.styles.mobilePanel,children:[e.jsxs("button",{className:s.styles.mobileBack,"aria-label":"Go back",onClick:$e,children:[e.jsx(P.ChevronLeft,{size:18,"aria-hidden":"true"}),e.jsx("span",{children:w[w.length-1].title})]}),w[w.length-1].primary.map((l,n)=>e.jsx(O,{item:l,animationDirection:B,onNavigate:te,onClose:()=>S(!1)},l._key??n))]},`dstack-${w.length}`),!$&&C==="advanced"&&u&&e.jsxs("div",{className:s.styles.grid,children:[u.length>0&&e.jsx("div",{role:"menubar",className:s.styles.menubar,children:Le(u)}),(v||g||N)&&e.jsxs(e.Fragment,{children:[e.jsx("span",{className:s.styles.separator,"aria-hidden":"true"}),e.jsxs("div",{role:"toolbar","aria-label":"Site controls",className:s.styles.toolbar,children:[N&&e.jsx(ee,{}),v&&e.jsx(K,{}),g&&e.jsx(se,{})]})]})]}),$&&C==="advanced"&&m&&h.length===0&&u&&e.jsx("div",{className:s.styles.mobileMenu,children:u.map((l,n)=>e.jsx("div",{className:`${s.styles.mobileItem} ${B==="forward"?s.styles.slideIn:s.styles.slideInBack}`,children:e.jsxs("button",{className:s.styles.mobileTrigger,onClick:()=>Ce(l),children:[e.jsx("span",{className:s.styles.mobileItemLabel,children:l.title}),e.jsx(P.ChevronRight,{size:16,className:s.styles.mobileChevron,"aria-hidden":"true"})]})},l._key??n))}),$&&C==="advanced"&&m&&h.length>0&&e.jsxs("div",{className:s.styles.mobilePanel,children:[e.jsxs("button",{className:s.styles.mobileBack,"aria-label":"Go back",onClick:h.length===1?we:Se,children:[e.jsx(P.ChevronLeft,{size:18,"aria-hidden":"true"}),e.jsx("span",{children:h[h.length-1].title})]}),h[h.length-1].primary.map((l,n)=>e.jsx(O,{item:l,animationDirection:B,onNavigate:ae,onClose:()=>S(!1)},l._key??`primary-${n}`)),h[h.length-1].secondary.length>0&&e.jsx("hr",{className:s.styles.mobileDivider}),h[h.length-1].secondary.map((l,n)=>e.jsx(O,{item:l,animationDirection:B,onNavigate:ae,onClose:()=>S(!1)},l._key??`secondary-${n}`))]},`astack-${h.length}`)]})}),y&&y.length>0&&e.jsx("nav",{className:s.styles.utility,"data-scrolled":J,"aria-label":"Utility navigation",children:e.jsx(oe.ButtonGroup,{spacing:"sm",children:y.map((l,n)=>{const c=F=="transparent"&&l.variant==="link"&&J?s.styles.utilityScrolled:s.styles.utilityDefault,i=l.imageSrc?e.jsx("img",{src:l.imageSrc,alt:l.imageAlt??l.ariaLabel}):l.label;return l.modalPayload?e.jsx(I.Button,{as:"modal",size:"sm",modalPayload:l.modalPayload,variant:l.variant??"primary","aria-label":l.ariaLabel,icon:l.icon,iconAlignment:l.iconAlignment,className:c,children:i},l._key??n):e.jsx(I.Button,{as:"a",size:"sm",href:l.href??"/",variant:l.variant??"primary",displayType:l.displayType??"text",imageSrc:l.imageSrc,imageAlt:l.imageAlt,"aria-label":l.ariaLabel,icon:l.icon,iconAlignment:l.iconAlignment,className:c,children:i},l._key??n)})})}),r&&e.jsx("nav",{"aria-label":"Utility navigation",className:`${s.styles.utilityMobile} ${m?s.styles.open:""}`,children:e.jsx(oe.ButtonGroup,{alignment:"center",children:r.modalPayload?e.jsx(I.Button,{as:"modal",size:"md",modalPayload:r.modalPayload,variant:r.variant??"primary","aria-label":r.ariaLabel,icon:r.icon,iconAlignment:r.iconAlignment,children:r.label}):e.jsx(I.Button,{as:"a",size:"sm",href:r.href??"/",variant:r.variant??"primary",displayType:r.displayType??"text",imageSrc:r.imageSrc,imageAlt:r.imageAlt,"aria-label":r.ariaLabel,icon:r.icon,iconAlignment:r.iconAlignment,children:r.imageSrc?e.jsx("img",{src:r.imageSrc,alt:r.imageAlt??r.ariaLabel}):r.label})})}),e.jsxs("div",{className:s.styles.mobileButtons,children:[$&&v&&e.jsx(K,{}),e.jsx("button",{ref:Z,className:s.styles.menuToggle,onClick:le,"aria-label":m?"Close menu":"Open menu","aria-expanded":m,"aria-controls":"main-menu",children:m?e.jsx(_e.X,{size:24,"aria-hidden":"true"}):e.jsx(I.Menu,{size:24,"aria-hidden":"true"})})]})]})})}exports.Navbar=Oe;
11
+ */const ze=[["circle",{cx:"11",cy:"11",r:"8",key:"4ej97u"}],["path",{d:"m21 21-4.3-4.3",key:"1qie3q"}]],Ae=ce.createLucideIcon("search",ze),Re={standard:e.styles.standard,transparent:e.styles.transparent},qe={left:e.styles.left,center:e.styles.center,right:e.styles.right},De=({spotlight:t,renderText:f})=>{var y,$,x,k,g,R;const d=t.callToAction;if(!d)return null;const p=((y=d.linkOptions)==null?void 0:y.linkType)==="external";let u="#";return p&&(($=d.linkOptions)!=null&&$.externalUrl)?u=d.linkOptions.externalUrl:((x=d.linkOptions)==null?void 0:x.linkType)==="internal"&&((g=(k=d.linkOptions)==null?void 0:k.internalUrl)!=null&&g.slug.current)&&(u=`/${d.linkOptions.internalUrl.slug.current}`),s.jsxs("div",{className:e.styles.spotlight,children:[t.image&&s.jsx("div",{className:e.styles.imageWrapper,children:s.jsx("img",{src:((R=t.image.imageUrls)==null?void 0:R.medium)??"",alt:t.image.asset.altText||t.image.asset.description||"Content image",width:600,height:400})}),s.jsxs("div",{className:e.styles.content,children:[t.title&&s.jsx("div",{className:e.styles.title,children:f==null?void 0:f(t.title,e.styles.title)}),t.description&&s.jsx("div",{className:e.styles.description,children:f==null?void 0:f(t.description,e.styles.description)})]}),d.linkOptions&&s.jsx("div",{className:e.styles.actions,children:s.jsx(_.Button,{as:"a",variant:d.variant??"primary",href:u,target:p?"_blank":"_self",rel:p?"noopener noreferrer":void 0,"aria-label":d.ariaLabel||d.label,children:d.label})})]})};function O({item:t,animationDirection:f,onNavigate:d,onClose:p,isTopLevel:u=!1}){var x;const y=(((x=t.sublinks)==null?void 0:x.length)??0)>0,$=f==="forward"?e.styles.slideIn:e.styles.slideInBack;return s.jsx("div",{className:`${e.styles.mobileItem} ${$} ${u?e.styles.parentItem:""}`,role:"menuitem",children:y?s.jsxs("button",{className:e.styles.mobileTrigger,onClick:()=>d(t),children:[s.jsxs("span",{className:e.styles.mobileItemLabel,children:[t.label,t.subtitle&&s.jsx("span",{className:e.styles.mobileItemSubtitle,children:t.subtitle})]}),s.jsx(P.ChevronRight,{size:16,className:e.styles.mobileChevron,"aria-hidden":"true"})]}):s.jsxs("a",{href:t.href??"#",className:e.styles.mobileLink,target:t.isExternal?"_blank":"_self",rel:t.isExternal?"noopener noreferrer":void 0,onClick:p,children:[s.jsxs("span",{className:e.styles.mobileItemLabel,children:[t.label,t.subtitle&&s.jsx("span",{className:e.styles.mobileItemSubtitle,children:t.subtitle})]}),t.isExternal&&s.jsx(de.ExternalLink,{size:14,className:e.styles.newTabIcon,"aria-hidden":"true"})]})})}function Oe({renderText:t,title:f,logo:d,items:p,groups:u,utilityItems:y,isSticky:$=!1,showSearch:x=!0,showLocaleSelect:k=!0,showThemeToggle:g=!0,themeToggleComponent:R,alignment:T="right",variant:X="standard",navigationType:C="default",searchComponent:ue,localeSelectComponent:ye,className:me,style:he,...be}){const[m,S]=a.useState(!1),[F,j]=a.useState(null),[fe,pe]=a.useState(!1),[J,xe]=a.useState(!1),[ve,je]=a.useState(null),[h,E]=a.useState([]),[N,G]=a.useState([]),[q,U]=a.useState(0),[ke,Q]=a.useState(null),[w,ge]=a.useState(!1),[B,L]=a.useState("forward"),W=a.useRef(null),I=a.useRef(null),Z=a.useRef(null),Y=a.useRef(new Map),ee=()=>s.jsx("div",{className:`${e.styles.linkWrapper} ${e.styles.parent}`,role:"presentation",children:s.jsx("div",{className:`${e.styles.linkItem} ${e.styles.themeToggle}`,role:"presentation",children:R})}),K=()=>s.jsx("div",{className:`${e.styles.linkWrapper} ${e.styles.parent} ${e.styles.searchWrapper}`,children:s.jsx("div",{className:e.styles.linkItem,children:s.jsx(re.Modal,{size:"lg",className:e.styles.searchModal,trigger:s.jsx("button",{title:"Search","aria-label":"Search",className:e.styles.search,children:s.jsx(Ae,{size:16,"aria-hidden":"true"})}),content:ue})})}),se=()=>s.jsx("div",{className:`${e.styles.linkWrapper} ${e.styles.parent}`,children:s.jsx("div",{className:e.styles.linkItem,children:s.jsx(re.Modal,{className:e.styles.localeModal,trigger:s.jsx("button",{title:"Locale Select","aria-label":"Locale Select",className:e.styles.locale,children:s.jsx(Be,{size:16,"aria-hidden":"true"})}),content:ye})})}),le=()=>{S(l=>{const n=!l;return n||(E([]),G([]),L("forward"),j(null)),n})},ne=a.useCallback(l=>{const n=Y.current.get(l);if(n&&I.current){const c=n.getBoundingClientRect(),i=I.current.getBoundingClientRect();je(c.left-i.left+c.width/2)}},[]),Ne=a.useCallback(l=>{j(n=>n===l?null:l)},[]),V=a.useCallback(l=>{W.current&&!W.current.contains(l.target)&&j(null)},[]),H=a.useCallback(()=>{typeof window<"u"&&window.innerWidth>768&&(S(!1),j(null))},[]),we=()=>E([]),te=l=>{L("forward"),G(n=>[...n,{title:l.label,primary:l.sublinks??[],secondary:[],description:l.description}])},$e=()=>{L("backward"),G(l=>l.slice(0,-1))},Ce=l=>{L("forward"),E([{title:l.title,primary:l.primaryItems??[],secondary:l.secondaryItems??[],description:""}])},ae=l=>{L("forward"),E(n=>[...n,{title:l.label,primary:l.sublinks??[],secondary:[],description:l.description}])},Se=()=>{L("backward"),E(l=>l.slice(0,-1))};a.useEffect(()=>{if(typeof window>"u")return;const l=()=>ge(window.innerWidth<768);return l(),window.addEventListener("resize",l),()=>window.removeEventListener("resize",l)},[]),a.useEffect(()=>{if(typeof window>"u")return;const l=()=>xe(window.scrollY>10);return l(),window.addEventListener("scroll",l,{passive:!0}),()=>window.removeEventListener("scroll",l)},[]),a.useEffect(()=>{const l=typeof window<"u",n=typeof document<"u";return l&&window.addEventListener("resize",H),n&&document.addEventListener("click",V),pe(!0),()=>{l&&window.removeEventListener("resize",H),n&&document.removeEventListener("click",V)}},[H,V]),a.useEffect(()=>{if(!(typeof document>"u")){if(m){const l=window.scrollY;document.body.style.position="fixed",document.body.style.top=`-${l}px`,document.body.style.width="100%",document.body.style.overflowY="scroll"}else{const l=Math.abs(parseInt(document.body.style.top||"0",10));document.body.style.position="",document.body.style.top="",document.body.style.width="",document.body.style.overflowY="",window.scrollTo(0,l)}return()=>{const l=Math.abs(parseInt(document.body.style.top||"0",10));document.body.style.position="",document.body.style.top="",document.body.style.width="",document.body.style.overflowY="",l&&window.scrollTo(0,l)}}},[m]),a.useEffect(()=>{var c;if(!m)return;if(typeof window<"u"&&typeof window.matchMedia=="function"&&window.matchMedia("(pointer: fine)").matches){const i=(c=I.current)==null?void 0:c.querySelector('a[href], button:not([disabled]), input, select, textarea, [tabindex]:not([tabindex="-1"])');i==null||i.focus()}const n=i=>{var A;if(i.key==="Escape"){le(),(A=Z.current)==null||A.focus();return}if(i.key!=="Tab"||!I.current)return;const v=Array.from(I.current.querySelectorAll('a[href], button:not([disabled]), input, select, textarea, [tabindex]:not([tabindex="-1"])')).filter(o=>!o.closest("[aria-hidden=true]"));if(v.length===0)return;const b=v[0],z=v[v.length-1];i.shiftKey?document.activeElement===b&&(i.preventDefault(),z.focus()):document.activeElement===z&&(i.preventDefault(),b.focus())};return document.addEventListener("keydown",n),()=>document.removeEventListener("keydown",n)},[m]);const D=(l,n="")=>l.map((c,i)=>{const v=`${n}/${c._key??c.label}-${i}`;return s.jsx(e.NavLink,{link:c,path:v,parentPath:n,openPath:F,togglePath:Ne,updateTriangleIndicator:ne,setOpenPath:j,renderLinks:D,buttonRefs:Y},v)}),Le=l=>l.map((n,c)=>{var z,A;const i=`group-${c}`,v=ke===c,b=(z=n.primaryItems)==null?void 0:z[q??0];return s.jsxs("div",{className:`${e.styles.linkWrapper} ${e.styles.parent}`,onMouseEnter:()=>{Q(c),j(i),ne(i)},children:[s.jsx("div",{className:e.styles.linkItem,children:s.jsxs("button",{ref:o=>{Y.current.set(i,o)},"aria-haspopup":!0,"aria-expanded":v,"aria-controls":`submenu-${c}`,className:`${e.styles.sublinkToggle} ${v?e.styles.open:""}`,children:[n.title,s.jsx(_e.ChevronDown,{size:18,className:e.styles.chevron,"aria-hidden":"true"})]})}),s.jsx("div",{id:`submenu-${c}`,className:`${e.styles.sublinks} ${v?e.styles.show:""}`,role:"menu","aria-label":`${n.title} submenu`,onMouseLeave:()=>{Q(null),U(0),j(null)},children:s.jsx("div",{children:s.jsxs("div",{className:`${e.styles.sublinksInner} ${n.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}),(A=n.primaryItems)==null?void 0:A.map((o,M)=>o.href?s.jsx("div",{role:"menuitem",children:s.jsxs("a",{href:o.href,className:`${e.styles.link} ${q===M?e.styles.open:""}`,target:o.isExternal?"_blank":"_self",rel:o.isExternal?"noopener noreferrer":void 0,onClick:()=>{var ie;j(null),(ie=o.onClick)==null||ie.call(o)},onMouseEnter:()=>U(M),children:[s.jsxs("span",{className:e.styles.linkContent,children:[o.label,o.subtitle&&s.jsx("span",{className:e.styles.subtitle,children:o.subtitle})]}),o.isExternal&&s.jsx(de.ExternalLink,{className:e.styles.newTabIcon,size:16,"aria-hidden":"true"})]})},o._key??M):s.jsx("div",{role:"menuitem",children:s.jsx("button",{className:`${e.styles.sublinkToggle} ${q===M?e.styles.open:""}`,onMouseEnter:()=>U(M),children:s.jsxs("span",{className:e.styles.linkContent,children:[o.label,o.subtitle&&s.jsx("span",{className:e.styles.subtitle,children:o.subtitle})]})})},o._key??M))]}),(b==null?void 0:b.sublinks)&&b.sublinks.length>0&&s.jsxs("div",{className:`${e.styles.sublinksColumn} ${e.styles.fadeInFromLeft}`,children:[b.description&&s.jsx("div",{className:e.styles.sublinksDescription,children:t==null?void 0:t(b.description)}),D(b.sublinks,`${i}-${q}`)]},`${b.label}-${b.sublinks.length}`),n.secondaryItems&&n.secondaryItems.length>0&&s.jsx("div",{className:`${e.styles.sublinksColumn} ${e.styles.secondaryColumn}`,children:D(n.secondaryItems,`${i}-secondary`)}),n.spotlight&&s.jsx("div",{className:`${e.styles.sublinksColumn} ${e.styles.spotlightColumn}`,children:s.jsx(De,{spotlight:n.spotlight,renderText:t})})]})})})]},n._key??`group-${c}`)}),Ie=[e.styles.navbar,qe[T],Re[X],$?e.styles.sticky:"",u!=null&&u.length?e.styles.advanced:e.styles.default,me??""].filter(Boolean).join(" "),r=y&&y.length>0?y[Math.min(1,y.length-1)]:null;return s.jsx("header",{ref:W,className:Ie,style:he,"aria-label":"Site header",...be,children:s.jsxs("div",{className:`${e.styles.container} ${(!y||y.length===0)&&T!=="center"?e.styles.twoColumn:""}`,children:[d?s.jsx("div",{className:e.styles.logo,children:d}):f?s.jsx("div",{className:e.styles.title,children:f}):null,s.jsx("nav",{ref:I,"aria-modal":m?"true":void 0,className:`${e.styles.nav} ${m?e.styles.open:""} ${fe?e.styles.visible:e.styles.hidden}`,id:"main-menu","aria-label":"Primary navigation",children:s.jsxs("div",{className:e.styles.navInner,children:[s.jsx("svg",{style:{left:`${ve}px`},className:`${e.styles.triangle} ${F?e.styles.show:""}`,width:16,height:12,viewBox:"0 0 100 75",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:s.jsx("polygon",{points:"50,5 95,70 5,70",strokeLinejoin:"round",fill:"white",stroke:"white"})}),C==="default"&&p&&!w&&s.jsxs("div",{className:e.styles.grid,children:[p.length>0&&s.jsx("div",{role:"menubar",className:e.styles.menubar,children:D(p)}),(x||k||g)&&s.jsxs(s.Fragment,{children:[s.jsx("span",{className:e.styles.separator,"aria-hidden":"true"}),s.jsxs("div",{role:"toolbar","aria-label":"Site controls",className:e.styles.toolbar,children:[g&&s.jsx(ee,{}),x&&s.jsx(K,{}),k&&s.jsx(se,{})]})]})]}),C==="default"&&p&&w&&m&&N.length===0&&s.jsx("div",{className:e.styles.mobileMenu,children:p.map((l,n)=>s.jsx(O,{item:l,animationDirection:B,onNavigate:te,onClose:()=>S(!1),isTopLevel:!0},l._key??n))}),C==="default"&&w&&m&&N.length>0&&s.jsxs("div",{className:e.styles.mobilePanel,children:[s.jsxs("button",{className:e.styles.mobileBack,"aria-label":"Go back",onClick:$e,children:[s.jsx(P.ChevronLeft,{size:18,"aria-hidden":"true"}),s.jsx("span",{children:N[N.length-1].title})]}),N[N.length-1].primary.map((l,n)=>s.jsx(O,{item:l,animationDirection:B,onNavigate:te,onClose:()=>S(!1)},l._key??n))]},`dstack-${N.length}`),!w&&C==="advanced"&&u&&s.jsxs("div",{className:e.styles.grid,children:[u.length>0&&s.jsx("div",{role:"menubar",className:e.styles.menubar,children:Le(u)}),(x||k||g)&&s.jsxs(s.Fragment,{children:[s.jsx("span",{className:e.styles.separator,"aria-hidden":"true"}),s.jsxs("div",{role:"toolbar","aria-label":"Site controls",className:e.styles.toolbar,children:[g&&s.jsx(ee,{}),x&&s.jsx(K,{}),k&&s.jsx(se,{})]})]})]}),w&&C==="advanced"&&m&&h.length===0&&u&&s.jsx("div",{className:e.styles.mobileMenu,children:u.map((l,n)=>s.jsx("div",{className:`${e.styles.mobileItem} ${B==="forward"?e.styles.slideIn:e.styles.slideInBack} ${e.styles.parentItem}`,children:s.jsxs("button",{className:e.styles.mobileTrigger,onClick:()=>Ce(l),children:[s.jsx("span",{className:e.styles.mobileItemLabel,children:l.title}),s.jsx(P.ChevronRight,{size:16,className:e.styles.mobileChevron,"aria-hidden":"true"})]})},l._key??n))}),w&&C==="advanced"&&m&&h.length>0&&s.jsxs("div",{className:e.styles.mobilePanel,children:[s.jsxs("button",{className:e.styles.mobileBack,"aria-label":"Go back",onClick:h.length===1?we:Se,children:[s.jsx(P.ChevronLeft,{size:18,"aria-hidden":"true"}),s.jsx("span",{children:h[h.length-1].title})]}),h[h.length-1].primary.map((l,n)=>s.jsx(O,{item:l,animationDirection:B,onNavigate:ae,onClose:()=>S(!1)},l._key??`primary-${n}`)),h[h.length-1].secondary.length>0&&s.jsx("hr",{className:e.styles.mobileDivider}),h[h.length-1].secondary.map((l,n)=>s.jsx(O,{item:l,animationDirection:B,onNavigate:ae,onClose:()=>S(!1)},l._key??`secondary-${n}`))]},`astack-${h.length}`)]})}),y&&y.length>0&&s.jsx("nav",{className:e.styles.utility,"data-scrolled":J,"aria-label":"Utility navigation",children:s.jsx(oe.ButtonGroup,{spacing:"sm",children:y.map((l,n)=>{const c=X=="transparent"&&l.variant==="link"&&J?e.styles.utilityScrolled:e.styles.utilityDefault,i=l.imageSrc?s.jsx("img",{src:l.imageSrc,alt:l.imageAlt??l.ariaLabel}):l.label;return l.modalPayload?s.jsx(_.Button,{as:"modal",size:"sm",modalPayload:l.modalPayload,variant:l.variant??"primary","aria-label":l.ariaLabel,icon:l.icon,iconAlignment:l.iconAlignment,className:c,children:i},l._key??n):s.jsx(_.Button,{as:"a",size:"sm",href:l.href??"/",variant:l.variant??"primary",displayType:l.displayType??"text",imageSrc:l.imageSrc,imageAlt:l.imageAlt,"aria-label":l.ariaLabel,icon:l.icon,iconAlignment:l.iconAlignment,className:c,children:i},l._key??n)})})}),r&&s.jsx("nav",{"aria-label":"Utility navigation",className:`${e.styles.utilityMobile} ${m?e.styles.open:""}`,children:s.jsx(oe.ButtonGroup,{alignment:"center",children:r.modalPayload?s.jsx(_.Button,{as:"modal",size:"md",modalPayload:r.modalPayload,variant:r.variant??"primary","aria-label":r.ariaLabel,icon:r.icon,iconAlignment:r.iconAlignment,children:r.label}):s.jsx(_.Button,{as:"a",size:"sm",href:r.href??"/",variant:r.variant??"primary",displayType:r.displayType??"text",imageSrc:r.imageSrc,imageAlt:r.imageAlt,"aria-label":r.ariaLabel,icon:r.icon,iconAlignment:r.iconAlignment,children:r.imageSrc?s.jsx("img",{src:r.imageSrc,alt:r.imageAlt??r.ariaLabel}):r.label})})}),s.jsxs("div",{className:e.styles.mobileButtons,children:[w&&x&&s.jsx(K,{}),s.jsx("button",{ref:Z,className:e.styles.menuToggle,onClick:le,"aria-label":m?"Close menu":"Open menu","aria-expanded":m,"aria-controls":"main-menu",children:m?s.jsx(Me.X,{size:24,"aria-hidden":"true"}):s.jsx(_.Menu,{size:24,"aria-hidden":"true"})})]})]})})}exports.Navbar=Oe;
package/dist/core/components/NavBar/index.mjs CHANGED
@@ -1,5 +1,5 @@
1
1
  import { jsx as a, jsxs as i, Fragment as de } from "react/jsx-runtime";
2
- import { useState as k, useRef as G, useCallback as Y, useEffect as O } from "react";
2
+ import { useState as N, useRef as G, useCallback as Y, useEffect as O } from "react";
3
3
  import { Modal as me } from "../Modal/index.mjs";
4
4
  import { B as P, M as Oe } from "../../../index-aWdsapYP.js";
5
5
  import { ButtonGroup as ue } from "../ButtonGroup/index.mjs";
@@ -47,12 +47,12 @@ const Ye = [
47
47
  spotlight: t,
48
48
  renderText: f
49
49
  }) => {
50
- var u, w, N, $, C, R;
50
+ var u, M, y, w, $, R;
51
51
  const d = t.callToAction;
52
52
  if (!d) return null;
53
53
  const v = ((u = d.linkOptions) == null ? void 0 : u.linkType) === "external";
54
54
  let m = "#";
55
- return v && ((w = d.linkOptions) != null && w.externalUrl) ? m = d.linkOptions.externalUrl : ((N = d.linkOptions) == null ? void 0 : N.linkType) === "internal" && ((C = ($ = d.linkOptions) == null ? void 0 : $.internalUrl) != null && C.slug.current) && (m = `/${d.linkOptions.internalUrl.slug.current}`), /* @__PURE__ */ i("div", { className: e.spotlight, children: [
55
+ return v && ((M = d.linkOptions) != null && M.externalUrl) ? m = d.linkOptions.externalUrl : ((y = d.linkOptions) == null ? void 0 : y.linkType) === "internal" && (($ = (w = d.linkOptions) == null ? void 0 : w.internalUrl) != null && $.slug.current) && (m = `/${d.linkOptions.internalUrl.slug.current}`), /* @__PURE__ */ i("div", { className: e.spotlight, children: [
56
56
  t.image && /* @__PURE__ */ a("div", { className: e.imageWrapper, children: /* @__PURE__ */ a(
57
57
  "img",
58
58
  {
@@ -84,54 +84,62 @@ function j({
84
84
  item: t,
85
85
  animationDirection: f,
86
86
  onNavigate: d,
87
- onClose: v
87
+ onClose: v,
88
+ isTopLevel: m = !1
88
89
  }) {
89
- var w;
90
- const m = (((w = t.sublinks) == null ? void 0 : w.length) ?? 0) > 0, u = f === "forward" ? e.slideIn : e.slideInBack;
91
- return /* @__PURE__ */ a("div", { className: `${e.mobileItem} ${u}`, role: "menuitem", children: m ? /* @__PURE__ */ i(
92
- "button",
93
- {
94
- className: e.mobileTrigger,
95
- onClick: () => d(t),
96
- children: [
97
- /* @__PURE__ */ i("span", { className: e.mobileItemLabel, children: [
98
- t.label,
99
- t.subtitle && /* @__PURE__ */ a("span", { className: e.mobileItemSubtitle, children: t.subtitle })
100
- ] }),
101
- /* @__PURE__ */ a(
102
- be,
103
- {
104
- size: 16,
105
- className: e.mobileChevron,
106
- "aria-hidden": "true"
107
- }
108
- )
109
- ]
110
- }
111
- ) : /* @__PURE__ */ i(
112
- "a",
90
+ var y;
91
+ const u = (((y = t.sublinks) == null ? void 0 : y.length) ?? 0) > 0, M = f === "forward" ? e.slideIn : e.slideInBack;
92
+ return /* @__PURE__ */ a(
93
+ "div",
113
94
  {
114
- href: t.href ?? "#",
115
- className: e.mobileLink,
116
- target: t.isExternal ? "_blank" : "_self",
117
- rel: t.isExternal ? "noopener noreferrer" : void 0,
118
- onClick: v,
119
- children: [
120
- /* @__PURE__ */ i("span", { className: e.mobileItemLabel, children: [
121
- t.label,
122
- t.subtitle && /* @__PURE__ */ a("span", { className: e.mobileItemSubtitle, children: t.subtitle })
123
- ] }),
124
- t.isExternal && /* @__PURE__ */ a(
125
- fe,
126
- {
127
- size: 14,
128
- className: e.newTabIcon,
129
- "aria-hidden": "true"
130
- }
131
- )
132
- ]
95
+ className: `${e.mobileItem} ${M} ${m ? e.parentItem : ""}`,
96
+ role: "menuitem",
97
+ children: u ? /* @__PURE__ */ i(
98
+ "button",
99
+ {
100
+ className: e.mobileTrigger,
101
+ onClick: () => d(t),
102
+ children: [
103
+ /* @__PURE__ */ i("span", { className: e.mobileItemLabel, children: [
104
+ t.label,
105
+ t.subtitle && /* @__PURE__ */ a("span", { className: e.mobileItemSubtitle, children: t.subtitle })
106
+ ] }),
107
+ /* @__PURE__ */ a(
108
+ be,
109
+ {
110
+ size: 16,
111
+ className: e.mobileChevron,
112
+ "aria-hidden": "true"
113
+ }
114
+ )
115
+ ]
116
+ }
117
+ ) : /* @__PURE__ */ i(
118
+ "a",
119
+ {
120
+ href: t.href ?? "#",
121
+ className: e.mobileLink,
122
+ target: t.isExternal ? "_blank" : "_self",
123
+ rel: t.isExternal ? "noopener noreferrer" : void 0,
124
+ onClick: v,
125
+ children: [
126
+ /* @__PURE__ */ i("span", { className: e.mobileItemLabel, children: [
127
+ t.label,
128
+ t.subtitle && /* @__PURE__ */ a("span", { className: e.mobileItemSubtitle, children: t.subtitle })
129
+ ] }),
130
+ t.isExternal && /* @__PURE__ */ a(
131
+ fe,
132
+ {
133
+ size: 14,
134
+ className: e.newTabIcon,
135
+ "aria-hidden": "true"
136
+ }
137
+ )
138
+ ]
139
+ }
140
+ )
133
141
  }
134
- ) });
142
+ );
135
143
  }
136
144
  function tn({
137
145
  renderText: t,
@@ -140,10 +148,10 @@ function tn({
140
148
  items: v,
141
149
  groups: m,
142
150
  utilityItems: u,
143
- isSticky: w = !1,
144
- showSearch: N = !0,
145
- showLocaleSelect: $ = !0,
146
- showThemeToggle: C = !0,
151
+ isSticky: M = !1,
152
+ showSearch: y = !0,
153
+ showLocaleSelect: w = !0,
154
+ showThemeToggle: $ = !0,
147
155
  themeToggleComponent: R,
148
156
  alignment: J = "right",
149
157
  variant: Q = "standard",
@@ -154,9 +162,9 @@ function tn({
154
162
  style: Ne,
155
163
  ...ge
156
164
  }) {
157
- const [h, S] = k(!1), [Z, g] = k(null), [we, $e] = k(!1), [ee, Ce] = k(!1), [Me, Ie] = k(null), [b, A] = k([]), [M, q] = k([]), [U, K] = k(
165
+ const [h, S] = N(!1), [Z, g] = N(null), [we, $e] = N(!1), [ee, Ce] = N(!1), [Ie, Me] = N(null), [b, A] = N([]), [C, q] = N([]), [U, K] = N(
158
166
  0
159
- ), [Le, ne] = k(null), [I, Se] = k(!1), [x, E] = k("forward"), V = G(null), z = G(null), ae = G(null), H = G(/* @__PURE__ */ new Map()), le = () => /* @__PURE__ */ a(
167
+ ), [Le, ne] = N(null), [I, Se] = N(!1), [x, E] = N("forward"), V = G(null), z = G(null), ae = G(null), H = G(/* @__PURE__ */ new Map()), le = () => /* @__PURE__ */ a(
160
168
  "div",
161
169
  {
162
170
  className: `${e.linkWrapper} ${e.parent}`,
@@ -216,13 +224,13 @@ function tn({
216
224
  const l = H.current.get(n);
217
225
  if (l && z.current) {
218
226
  const c = l.getBoundingClientRect(), s = z.current.getBoundingClientRect();
219
- Ie(c.left - s.left + c.width / 2);
227
+ Me(c.left - s.left + c.width / 2);
220
228
  }
221
229
  }, []), Ee = Y((n) => {
222
230
  g((l) => l === n ? null : n);
223
- }, []), F = Y((n) => {
231
+ }, []), T = Y((n) => {
224
232
  V.current && !V.current.contains(n.target) && g(null);
225
- }, []), T = Y(() => {
233
+ }, []), F = Y(() => {
226
234
  typeof window < "u" && window.innerWidth > 768 && (S(!1), g(null));
227
235
  }, []), ze = () => A([]), re = (n) => {
228
236
  E("forward"), q((l) => [
@@ -268,10 +276,10 @@ function tn({
268
276
  return n(), window.addEventListener("scroll", n, { passive: !0 }), () => window.removeEventListener("scroll", n);
269
277
  }, []), O(() => {
270
278
  const n = typeof window < "u", l = typeof document < "u";
271
- return n && window.addEventListener("resize", T), l && document.addEventListener("click", F), $e(!0), () => {
272
- n && window.removeEventListener("resize", T), l && document.removeEventListener("click", F);
279
+ return n && window.addEventListener("resize", F), l && document.addEventListener("click", T), $e(!0), () => {
280
+ n && window.removeEventListener("resize", F), l && document.removeEventListener("click", T);
273
281
  };
274
- }, [T, F]), O(() => {
282
+ }, [F, T]), O(() => {
275
283
  if (!(typeof document > "u")) {
276
284
  if (h) {
277
285
  const n = window.scrollY;
@@ -301,24 +309,24 @@ function tn({
301
309
  return;
302
310
  }
303
311
  if (s.key !== "Tab" || !z.current) return;
304
- const y = Array.from(
312
+ const k = Array.from(
305
313
  z.current.querySelectorAll(
306
314
  'a[href], button:not([disabled]), input, select, textarea, [tabindex]:not([tabindex="-1"])'
307
315
  )
308
316
  ).filter((o) => !o.closest("[aria-hidden=true]"));
309
- if (y.length === 0) return;
310
- const p = y[0], B = y[y.length - 1];
317
+ if (k.length === 0) return;
318
+ const p = k[0], B = k[k.length - 1];
311
319
  s.shiftKey ? document.activeElement === p && (s.preventDefault(), B.focus()) : document.activeElement === B && (s.preventDefault(), p.focus());
312
320
  };
313
321
  return document.addEventListener("keydown", l), () => document.removeEventListener("keydown", l);
314
322
  }, [h]);
315
323
  const W = (n, l = "") => n.map((c, s) => {
316
- const y = `${l}/${c._key ?? c.label}-${s}`;
324
+ const k = `${l}/${c._key ?? c.label}-${s}`;
317
325
  return /* @__PURE__ */ a(
318
326
  Pe,
319
327
  {
320
328
  link: c,
321
- path: y,
329
+ path: k,
322
330
  parentPath: l,
323
331
  openPath: Z,
324
332
  togglePath: Ee,
@@ -327,11 +335,11 @@ function tn({
327
335
  renderLinks: W,
328
336
  buttonRefs: H
329
337
  },
330
- y
338
+ k
331
339
  );
332
340
  }), Be = (n) => n.map((l, c) => {
333
341
  var B, D;
334
- const s = `group-${c}`, y = Le === c, p = (B = l.primaryItems) == null ? void 0 : B[U ?? 0];
342
+ const s = `group-${c}`, k = Le === c, p = (B = l.primaryItems) == null ? void 0 : B[U ?? 0];
335
343
  return /* @__PURE__ */ i(
336
344
  "div",
337
345
  {
@@ -347,9 +355,9 @@ function tn({
347
355
  H.current.set(s, o);
348
356
  },
349
357
  "aria-haspopup": !0,
350
- "aria-expanded": y,
358
+ "aria-expanded": k,
351
359
  "aria-controls": `submenu-${c}`,
352
- className: `${e.sublinkToggle} ${y ? e.open : ""}`,
360
+ className: `${e.sublinkToggle} ${k ? e.open : ""}`,
353
361
  children: [
354
362
  l.title,
355
363
  /* @__PURE__ */ a(
@@ -367,7 +375,7 @@ function tn({
367
375
  "div",
368
376
  {
369
377
  id: `submenu-${c}`,
370
- className: `${e.sublinks} ${y ? e.show : ""}`,
378
+ className: `${e.sublinks} ${k ? e.show : ""}`,
371
379
  role: "menu",
372
380
  "aria-label": `${l.title} submenu`,
373
381
  onMouseLeave: () => {
@@ -474,7 +482,7 @@ function tn({
474
482
  e.navbar,
475
483
  Ke[J],
476
484
  qe[Q],
477
- w ? e.sticky : "",
485
+ M ? e.sticky : "",
478
486
  // isScrolled ? styles.scrolled : "",
479
487
  m != null && m.length ? e.advanced : e.default,
480
488
  ke ?? ""
@@ -505,7 +513,7 @@ function tn({
505
513
  /* @__PURE__ */ a(
506
514
  "svg",
507
515
  {
508
- style: { left: `${Me}px` },
516
+ style: { left: `${Ie}px` },
509
517
  className: `${e.triangle} ${Z ? e.show : ""}`,
510
518
  width: 16,
511
519
  height: 12,
@@ -525,7 +533,7 @@ function tn({
525
533
  ),
526
534
  L === "default" && v && !I && /* @__PURE__ */ i("div", { className: e.grid, children: [
527
535
  v.length > 0 && /* @__PURE__ */ a("div", { role: "menubar", className: e.menubar, children: W(v) }),
528
- (N || $ || C) && /* @__PURE__ */ i(de, { children: [
536
+ (y || w || $) && /* @__PURE__ */ i(de, { children: [
529
537
  /* @__PURE__ */ a("span", { className: e.separator, "aria-hidden": "true" }),
530
538
  /* @__PURE__ */ i(
531
539
  "div",
@@ -534,25 +542,26 @@ function tn({
534
542
  "aria-label": "Site controls",
535
543
  className: e.toolbar,
536
544
  children: [
537
- C && /* @__PURE__ */ a(le, {}),
538
- N && /* @__PURE__ */ a(X, {}),
539
- $ && /* @__PURE__ */ a(ie, {})
545
+ $ && /* @__PURE__ */ a(le, {}),
546
+ y && /* @__PURE__ */ a(X, {}),
547
+ w && /* @__PURE__ */ a(ie, {})
540
548
  ]
541
549
  }
542
550
  )
543
551
  ] })
544
552
  ] }),
545
- L === "default" && v && I && h && M.length === 0 && /* @__PURE__ */ a("div", { className: e.mobileMenu, children: v.map((n, l) => /* @__PURE__ */ a(
553
+ L === "default" && v && I && h && C.length === 0 && /* @__PURE__ */ a("div", { className: e.mobileMenu, children: v.map((n, l) => /* @__PURE__ */ a(
546
554
  j,
547
555
  {
548
556
  item: n,
549
557
  animationDirection: x,
550
558
  onNavigate: re,
551
- onClose: () => S(!1)
559
+ onClose: () => S(!1),
560
+ isTopLevel: !0
552
561
  },
553
562
  n._key ?? l
554
563
  )) }),
555
- L === "default" && I && h && M.length > 0 && /* @__PURE__ */ i(
564
+ L === "default" && I && h && C.length > 0 && /* @__PURE__ */ i(
556
565
  "div",
557
566
  {
558
567
  className: e.mobilePanel,
@@ -565,11 +574,11 @@ function tn({
565
574
  onClick: _e,
566
575
  children: [
567
576
  /* @__PURE__ */ a(he, { size: 18, "aria-hidden": "true" }),
568
- /* @__PURE__ */ a("span", { children: M[M.length - 1].title })
577
+ /* @__PURE__ */ a("span", { children: C[C.length - 1].title })
569
578
  ]
570
579
  }
571
580
  ),
572
- M[M.length - 1].primary.map(
581
+ C[C.length - 1].primary.map(
573
582
  (n, l) => /* @__PURE__ */ a(
574
583
  j,
575
584
  {
@@ -583,11 +592,11 @@ function tn({
583
592
  )
584
593
  ]
585
594
  },
586
- `dstack-${M.length}`
595
+ `dstack-${C.length}`
587
596
  ),
588
597
  !I && L === "advanced" && m && /* @__PURE__ */ i("div", { className: e.grid, children: [
589
598
  m.length > 0 && /* @__PURE__ */ a("div", { role: "menubar", className: e.menubar, children: Be(m) }),
590
- (N || $ || C) && /* @__PURE__ */ i(de, { children: [
599
+ (y || w || $) && /* @__PURE__ */ i(de, { children: [
591
600
  /* @__PURE__ */ a("span", { className: e.separator, "aria-hidden": "true" }),
592
601
  /* @__PURE__ */ i(
593
602
  "div",
@@ -596,9 +605,9 @@ function tn({
596
605
  "aria-label": "Site controls",
597
606
  className: e.toolbar,
598
607
  children: [
599
- C && /* @__PURE__ */ a(le, {}),
600
- N && /* @__PURE__ */ a(X, {}),
601
- $ && /* @__PURE__ */ a(ie, {})
608
+ $ && /* @__PURE__ */ a(le, {}),
609
+ y && /* @__PURE__ */ a(X, {}),
610
+ w && /* @__PURE__ */ a(ie, {})
602
611
  ]
603
612
  }
604
613
  )
@@ -607,7 +616,7 @@ function tn({
607
616
  I && L === "advanced" && h && b.length === 0 && m && /* @__PURE__ */ a("div", { className: e.mobileMenu, children: m.map((n, l) => /* @__PURE__ */ a(
608
617
  "div",
609
618
  {
610
- className: `${e.mobileItem} ${x === "forward" ? e.slideIn : e.slideInBack}`,
619
+ className: `${e.mobileItem} ${x === "forward" ? e.slideIn : e.slideInBack} ${e.parentItem}`,
611
620
  children: /* @__PURE__ */ i(
612
621
  "button",
613
622
  {
@@ -767,7 +776,7 @@ function tn({
767
776
  }
768
777
  ),
769
778
  /* @__PURE__ */ i("div", { className: e.mobileButtons, children: [
770
- I && N && /* @__PURE__ */ a(X, {}),
779
+ I && y && /* @__PURE__ */ a(X, {}),
771
780
  /* @__PURE__ */ a(
772
781
  "button",
773
782
  {
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "quirk-ui",
3
3
  "private": false,
4
- "version": "0.1.185",
4
+ "version": "0.1.186",
5
5
  "type": "module",
6
6
  "exports": {
7
7
  ".": {