quirk-ui 0.0.412 → 0.0.414

package/dist/{NavLink-BlhKWQ4q.js → NavLink-B5joxE9Z.js}

@@ -1,8 +1,8 @@
-import { jsxs as i, jsx as s } from "react/jsx-runtime";
-import { useRef as k } from "react";
-import { E as v } from "./external-link-BOPobeQJ.js";
+import { jsxs as l, jsx as s } from "react/jsx-runtime";
+import { useRef as v } from "react";
+import { E as k } from "./external-link-BOPobeQJ.js";
 import { C as g } from "./chevron-down-DSUzBz9F.js";
-import './assets/NavLink.css';const f = "_navbar_1bon6_5", w = "_sticky_1bon6_19", C = "_left_1bon6_34", I = "_container_1bon6_35", N = "_logo_1bon6_39", x = "_nav_1bon6_5", T = "_center_1bon6_54", y = "_hidden_1bon6_60", E = "_visible_1bon6_67", S = "_right_1bon6_82", W = "_title_1bon6_89", $ = "_linkWrapper_1bon6_99", L = "_parent_1bon6_99", D = "_linkItem_1bon6_107", F = "_link_1bon6_99", M = "_sublinkToggle_1bon6_111", j = "_standard_1bon6_159", z = "_triangle_1bon6_167", R = "_transparent_1bon6_172", q = "_twoColumn_1bon6_276", A = "_navInner_1bon6_398", B = "_grid_1bon6_409", G = "_separator_1bon6_444", H = "_newTabIcon_1bon6_474", J = "_sublinksDescription_1bon6_486", K = "_linkContent_1bon6_489", Q = "_open_1bon6_500", U = "_sublinks_1bon6_486", V = "_show_1bon6_571", X = "_primaryColumn_1bon6_612", Y = "_sublinksInner_1bon6_629", Z = "_sublinksColumn_1bon6_647", O = "_chevron_1bon6_657", P = "_advanced_1bon6_839", nn = "_subtitle_1bon6_848", on = "_withSpotlight_1bon6_890", en = "_withoutSpotlight_1bon6_894", sn = "_searchWrapper_1bon6_940", tn = "_fadeInFromLeft_1bon6_962", o = {
+import './assets/NavLink.css';const f = "_navbar_1bon6_5", w = "_sticky_1bon6_19", C = "_left_1bon6_34", I = "_container_1bon6_35", N = "_logo_1bon6_39", x = "_nav_1bon6_5", T = "_center_1bon6_54", y = "_hidden_1bon6_60", E = "_visible_1bon6_67", S = "_right_1bon6_82", W = "_title_1bon6_89", $ = "_linkWrapper_1bon6_99", L = "_parent_1bon6_99", M = "_linkItem_1bon6_107", j = "_link_1bon6_99", z = "_sublinkToggle_1bon6_111", R = "_standard_1bon6_159", D = "_triangle_1bon6_167", q = "_transparent_1bon6_172", A = "_twoColumn_1bon6_276", B = "_navInner_1bon6_398", F = "_grid_1bon6_409", G = "_separator_1bon6_444", H = "_newTabIcon_1bon6_474", J = "_linkContent_1bon6_489", K = "_open_1bon6_500", Q = "_sublinks_1bon6_486", U = "_show_1bon6_571", V = "_primaryColumn_1bon6_612", X = "_sublinksInner_1bon6_629", Y = "_sublinksColumn_1bon6_647", Z = "_chevron_1bon6_657", O = "_advanced_1bon6_839", P = "_subtitle_1bon6_848", nn = "_withSpotlight_1bon6_890", on = "_withoutSpotlight_1bon6_894", en = "_searchWrapper_1bon6_940", o = {
   navbar: f,
   sticky: w,
   left: C,
@@ -16,38 +16,36 @@ import './assets/NavLink.css';const f = "_navbar_1bon6_5", w = "_sticky_1bon6_19
   title: W,
   linkWrapper: $,
   parent: L,
-  linkItem: D,
-  link: F,
-  sublinkToggle: M,
-  standard: j,
-  triangle: z,
-  transparent: R,
-  twoColumn: q,
-  navInner: A,
-  grid: B,
+  linkItem: M,
+  link: j,
+  sublinkToggle: z,
+  standard: R,
+  triangle: D,
+  transparent: q,
+  twoColumn: A,
+  navInner: B,
+  grid: F,
   separator: G,
   newTabIcon: H,
-  sublinksDescription: J,
-  linkContent: K,
-  open: Q,
-  sublinks: U,
-  show: V,
-  primaryColumn: X,
-  sublinksInner: Y,
-  sublinksColumn: Z,
-  chevron: O,
+  linkContent: J,
+  open: K,
+  sublinks: Q,
+  show: U,
+  primaryColumn: V,
+  sublinksInner: X,
+  sublinksColumn: Y,
+  chevron: Z,
   default: "_default_1bon6_773",
-  advanced: P,
-  subtitle: nn,
-  withSpotlight: on,
-  withoutSpotlight: en,
-  searchWrapper: sn,
-  fadeInFromLeft: tn
+  advanced: O,
+  subtitle: P,
+  withSpotlight: nn,
+  withoutSpotlight: on,
+  searchWrapper: en
 };
-function cn({
+function ln({
   link: n,
   path: e,
-  parentPath: l,
+  parentPath: i,
   openPath: d,
   togglePath: a,
   updateTriangleIndicator: m,
@@ -56,13 +54,13 @@ function cn({
   buttonRefs: h
 }) {
   var b;
-  const r = d === e, _ = !!((b = n.sublinks) != null && b.length), c = k(null);
-  return h.current.set(e, c.current), /* @__PURE__ */ i(
+  const r = d === e, _ = !!((b = n.sublinks) != null && b.length), c = v(null);
+  return h.current.set(e, c.current), /* @__PURE__ */ l(
     "div",
     {
-      className: `${o.linkWrapper} ${l ? "" : o.parent}`,
+      className: `${o.linkWrapper} ${i ? "" : o.parent}`,
       children: [
-        /* @__PURE__ */ s("div", { className: o.linkItem, children: n.href ? /* @__PURE__ */ i(
+        /* @__PURE__ */ s("div", { className: o.linkItem, children: n.href ? /* @__PURE__ */ l(
           "a",
           {
             href: n.href,
@@ -74,15 +72,15 @@ function cn({
               t(null), (u = n.onClick) == null || u.call(n);
             },
             onMouseEnter: () => {
-              l || t(null);
+              i || t(null);
             },
             role: "menuitem",
             children: [
               n.label,
-              n.isExternal && /* @__PURE__ */ s(v, { className: o.newTabIcon, size: 16 })
+              n.isExternal && /* @__PURE__ */ s(k, { className: o.newTabIcon, size: 16 })
             ]
           }
-        ) : /* @__PURE__ */ i(
+        ) : /* @__PURE__ */ l(
           "button",
           {
             ref: c,
@@ -115,6 +113,6 @@ function cn({
   );
 }
 export {
-  cn as N,
+  ln as N,
   o as s
 };

package/dist/NavLink-BSVUqHZT.cjs

@@ -0,0 +1 @@
+"use strict";require('./assets/NavLink.css');const e=require("react/jsx-runtime"),v=require("react"),k=require("./external-link-DDShu-48.cjs"),m=require("./chevron-down-DfK1XBl3.cjs"),g="_navbar_1bon6_5",w="_sticky_1bon6_19",C="_left_1bon6_34",x="_container_1bon6_35",f="_logo_1bon6_39",I="_nav_1bon6_5",N="_center_1bon6_54",j="_hidden_1bon6_60",$="_visible_1bon6_67",y="_right_1bon6_82",T="_title_1bon6_89",S="_linkWrapper_1bon6_99",W="_parent_1bon6_99",E="_linkItem_1bon6_107",q="_link_1bon6_99",L="_sublinkToggle_1bon6_111",M="_standard_1bon6_159",R="_triangle_1bon6_167",z="_transparent_1bon6_172",D="_twoColumn_1bon6_276",A="_navInner_1bon6_398",B="_grid_1bon6_409",F="_separator_1bon6_444",G="_newTabIcon_1bon6_474",H="_linkContent_1bon6_489",J="_open_1bon6_500",K="_sublinks_1bon6_486",Q="_show_1bon6_571",U="_primaryColumn_1bon6_612",V="_sublinksInner_1bon6_629",X="_sublinksColumn_1bon6_647",Y="_chevron_1bon6_657",Z="_advanced_1bon6_839",O="_subtitle_1bon6_848",P="_withSpotlight_1bon6_890",nn="_withoutSpotlight_1bon6_894",on="_searchWrapper_1bon6_940",o={navbar:g,sticky:w,left:C,container:x,logo:f,nav:I,center:N,hidden:j,visible:$,right:y,title:T,linkWrapper:S,parent:W,linkItem:E,link:q,sublinkToggle:L,standard:M,triangle:R,transparent:z,twoColumn:D,navInner:A,grid:B,separator:F,newTabIcon:G,linkContent:H,open:J,sublinks:K,show:Q,primaryColumn:U,sublinksInner:V,sublinksColumn:X,chevron:Y,default:"_default_1bon6_773",advanced:Z,subtitle:O,withSpotlight:P,withoutSpotlight:nn,searchWrapper:on};function en({link:n,path:s,parentPath:i,openPath:u,togglePath:l,updateTriangleIndicator:d,setOpenPath:t,renderLinks:h,buttonRefs:p}){var c;const r=u===s,_=!!((c=n.sublinks)!=null&&c.length),a=v.useRef(null);return p.current.set(s,a.current),e.jsxs("div",{className:`${o.linkWrapper} ${i?"":o.parent}`,children:[e.jsx("div",{className:o.linkItem,children:n.href?e.jsxs("a",{href:n.href,className:o.link,target:n.isExternal?"_blank":"_self",rel:n.isExternal?"noopener noreferrer":void 0,onClick:()=>{var b;t(null),(b=n.onClick)==null||b.call(n)},onMouseEnter:()=>{i||t(null)},role:"menuitem",children:[n.label,n.isExternal&&e.jsx(k.ExternalLink,{className:o.newTabIcon,size:16})]}):e.jsxs("button",{ref:a,"aria-haspopup":_?"true":void 0,"aria-expanded":r,className:`${o.sublinkToggle} ${r?o.open:""}`,onClick:()=>l(s),onMouseEnter:()=>{d(s),t(s)},children:[n.label,_&&e.jsx(m.ChevronDown,{size:18,className:o.chevron})]})}),_&&e.jsx("div",{className:`${o.sublinks} ${r?o.show:""}`,onMouseLeave:()=>l(s),role:"menu","aria-label":`${n.label} submenu`,children:e.jsx("div",{children:e.jsx("div",{className:o.sublinksInner,children:e.jsx("div",{className:o.sublinksColumn,children:h(n.sublinks,s)})})})})]},s)}exports.NavLink=en;exports.styles=o;

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

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require("react/jsx-runtime");require("react");const e=require("../../../NavLink-RigeMjDg.cjs");require("../../../external-link-DDShu-48.cjs");require("../../../chevron-down-DfK1XBl3.cjs");exports.NavLink=e.NavLink;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require("react/jsx-runtime");require("react");const e=require("../../../NavLink-BSVUqHZT.cjs");require("../../../external-link-DDShu-48.cjs");require("../../../chevron-down-DfK1XBl3.cjs");exports.NavLink=e.NavLink;

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

@@ -1,6 +1,6 @@
 import "react/jsx-runtime";
 import "react";
-import { N as a } from "../../../NavLink-BlhKWQ4q.js";
+import { N as a } from "../../../NavLink-B5joxE9Z.js";
 import "../../../external-link-BOPobeQJ.js";
 import "../../../chevron-down-DSUzBz9F.js";
 export {

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

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),i=require("react"),e=require("../../../NavLink-RigeMjDg.cjs"),ne=require("../../../chevron-down-DfK1XBl3.cjs"),te=require("../../../external-link-DDShu-48.cjs"),le={standard:e.styles.standard,transparent:e.styles.transparent},ae={left:e.styles.left,center:e.styles.center,right:e.styles.right};function ie({title:H,logo:g,items:y,groups:u,utilityItems:C,isSticky:V=!1,showSearch:L=!0,showLocaleSelect:E=!0,alignment:x="right",variant:A="standard",navigationType:R="default",className:I}){const[M,J]=i.useState(0),[b,c]=i.useState(null),[f,K]=i.useState(!1),[j,Q]=i.useState(!1),[S,U]=i.useState(!1),[Y,Z]=i.useState(null),[v,$]=i.useState(0),[P,W]=i.useState(null),N=i.useRef(null),h=i.useRef(null),k=i.useRef(new Map),_=()=>s.jsx("div",{className:`${e.styles.linkWrapper} ${e.styles.parent} ${e.styles.searchWrapper}`,children:s.jsx("div",{className:e.styles.linkItem})}),z=()=>s.jsx("div",{className:`${e.styles.linkWrapper} ${e.styles.parent} `,children:s.jsx("div",{className:e.styles.linkItem})}),w=t=>{const l=k.current.get(t);if(l&&h.current){const o=l.getBoundingClientRect(),r=h.current.getBoundingClientRect(),n=o.left-r.left+o.width/2;Z(n)}};console.log(w);const ee=t=>{c(l=>l===t?null:t)},se=t=>t.map((l,o)=>{var T,D,F,G;const r=`group-${o}`,p=P===o,n=(T=l.primaryItems)==null?void 0:T[v??0];return s.jsxs("div",{className:`${e.styles.linkWrapper} ${e.styles.parent}`,onMouseEnter:()=>{W(o),c(r),w(r)},onMouseLeave:()=>{W(null),$(0),c(null)},children:[s.jsx("div",{className:e.styles.linkItem,children:s.jsxs("button",{ref:a=>{k.current.set(r,a)},role:"menuitem","aria-haspopup":"true","aria-expanded":p,"aria-controls":`submenu-${o}`,className:`${e.styles.sublinkToggle} ${p?e.styles.open:""} `,children:[l.title,s.jsx(ne.ChevronDown,{size:18,className:e.styles.chevron})]})}),s.jsx("div",{id:`submenu-${o}`,className:`${e.styles.sublinks} ${p?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}),(D=l.primaryItems)==null?void 0:D.map((a,d)=>a.href?s.jsxs("a",{href:a.href,className:`${e.styles.link} ${v===d?e.styles.open:""}`,target:a.isExternal?"_blank":"_self",rel:a.isExternal?"noopener noreferrer":void 0,onClick:()=>{var X;c(null),(X=a.onClick)==null||X.call(a)},onMouseEnter:()=>a.sublinks?$(d):null,role:"menuitem",children:[s.jsxs("span",{className:e.styles.linkContent,children:[a.label,a.subtitle&&s.jsx("span",{className:e.styles.subtitle,children:a.subtitle})]}),a.isExternal&&s.jsx(te.ExternalLink,{className:e.styles.newTabIcon,size:16})]},a._key??d):s.jsx("button",{className:`${e.styles.sublinkToggle} ${v===d?e.styles.open:""}`,onMouseEnter:()=>$(d),children:s.jsxs("span",{className:e.styles.linkContent,children:[a.label,a.subtitle&&s.jsx("span",{className:e.styles.subtitle,children:a.subtitle})]})},a._key??d))]}),(n==null?void 0:n.sublinks)&&((F=n==null?void 0:n.sublinks)==null?void 0:F.length)>0&&s.jsxs("div",{className:`${e.styles.sublinksColumn} ${e.styles.fadeInFromLeft}`,children:[(n==null?void 0:n.description)&&s.jsx("div",{className:e.styles.sublinksDescription,children:n==null?void 0:n.description}),(n==null?void 0:n.sublinks)&&m(n.sublinks,`${r}-${v}`)]},`${n.label}-${(G=n==null?void 0:n.sublinks)==null?void 0:G.length}`)]})})})]},l._key??`group-${o}`)}),m=(t,l="")=>t.map(o=>{const r=`${l}/${o.label}`;return s.jsx(e.NavLink,{link:o,path:r,parentPath:l,openPath:b,togglePath:ee,updateTriangleIndicator:w,setOpenPath:c,renderLinks:m,buttonRefs:k},o._key??r)}),B=i.useCallback(t=>{N.current&&!N.current.contains(t.target)&&c(null)},[]),O=i.useCallback(()=>{q(),typeof window<"u"&&window.innerWidth>768&&(K(!1),c(null),typeof document<"u"&&(document.body.style.overflow=""))},[]),q=i.useCallback(()=>{if(h.current){const t=h.current.getBoundingClientRect().width;J(t),U(!0)}},[]);return i.useEffect(()=>{const t=typeof window<"u",l=typeof document<"u";return t&&window.addEventListener("resize",O),l&&document.addEventListener("click",B),q(),()=>{t&&window.removeEventListener("resize",O),l&&document.removeEventListener("click",B)}},[]),i.useEffect(()=>{if(typeof window<"u"){const t=()=>{const l=window.innerWidth<768;Q(l)};return t(),window.addEventListener("resize",t),()=>window.removeEventListener("resize",t)}},[]),i.useEffect(()=>{if(typeof document<"u")return document.body.style.overflow=f?"hidden":"",()=>{document.body.style.overflow=""}},[f]),s.jsx("header",{ref:N,className:`${I??""} ${ae[x]} ${le[A]} ${e.styles.navbar} ${V?e.styles.sticky:""} ${u&&u.length?e.styles.advanced:e.styles.default}`,role:"navigation","aria-label":"Main navigation",children:s.jsxs("div",{className:`${e.styles.container} ${(!C||C.length===0)&&x!=="center"?e.styles.twoColumn:""}`,children:[g?s.jsx("div",{className:e.styles.logo,children:g}):s.jsx("div",{className:e.styles.title,children:H}),s.jsx("nav",{ref:h,style:{left:x==="center"?`calc(50% - ${M/2}px)`:"0"},className:`${e.styles.nav} ${f?e.styles.open:""} ${S?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:`${Y}px`},className:`${e.styles.triangle} ${b?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"})}),R==="default"&&y&&s.jsxs("div",{className:e.styles.grid,children:[y&&y.length>0&&m(y),L&&!j&&s.jsxs(s.Fragment,{children:[s.jsx("span",{className:e.styles.separator}),s.jsx(_,{})]}),E&&s.jsx(z,{})]}),!j&&R==="advanced"&&u&&s.jsxs("div",{className:e.styles.grid,children:[u.length>0&&se(u),L&&s.jsxs(s.Fragment,{children:[s.jsx("span",{className:e.styles.separator}),s.jsx(_,{})]}),E&&s.jsx(z,{})]}),s.jsx("p",{children:"HELLO"}),s.jsxs("p",{children:["vis: ",S]}),s.jsxs("p",{children:["open: ",f]}),s.jsxs("p",{children:["path: ",b]}),s.jsxs("p",{children:["nav: ",M]}),s.jsxs("p",{children:["mobile: ",j]})]})})]})})}exports.Navbar=ie;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),a=require("react"),e=require("../../../NavLink-BSVUqHZT.cjs"),ee=require("../../../chevron-down-DfK1XBl3.cjs"),se=require("../../../external-link-DDShu-48.cjs"),ne={standard:e.styles.standard,transparent:e.styles.transparent},te={left:e.styles.left,center:e.styles.center,right:e.styles.right};function le({title:D,logo:k,items:y,groups:d,utilityItems:g,isSticky:G=!1,showSearch:C=!0,showLocaleSelect:E=!0,alignment:v="right",variant:X="standard",navigationType:L="default",className:F}){const[R,H]=a.useState(0),[p,c]=a.useState(null),[h,V]=a.useState(!1),[m,A]=a.useState(!1),[M,J]=a.useState(!1),[K,Q]=a.useState(null),[x,b]=a.useState(0),[U,I]=a.useState(null),j=a.useRef(null),u=a.useRef(null),$=a.useRef(new Map),S=()=>s.jsx("div",{className:`${e.styles.linkWrapper} ${e.styles.parent} ${e.styles.searchWrapper}`,children:s.jsx("div",{className:e.styles.linkItem})}),W=()=>s.jsx("div",{className:`${e.styles.linkWrapper} ${e.styles.parent} `,children:s.jsx("div",{className:e.styles.linkItem})}),w=n=>{const t=$.current.get(n);if(t&&u.current){const r=t.getBoundingClientRect(),i=u.current.getBoundingClientRect(),N=r.left-i.left+r.width/2;Q(N)}};console.log(w);const Y=n=>{c(t=>t===n?null:n)},Z=n=>n.map((t,r)=>{var q,P;const i=`group-${r}`,f=U===r,N=(q=t.primaryItems)==null?void 0:q[x??0];return console.log(N),s.jsxs("div",{className:`${e.styles.linkWrapper} ${e.styles.parent}`,onMouseEnter:()=>{I(r),c(i),w(i)},onMouseLeave:()=>{I(null),b(0),c(null)},children:[s.jsx("div",{className:e.styles.linkItem,children:s.jsxs("button",{ref:l=>{$.current.set(i,l)},role:"menuitem","aria-haspopup":"true","aria-expanded":f,"aria-controls":`submenu-${r}`,className:`${e.styles.sublinkToggle} ${f?e.styles.open:""} `,children:[t.title,s.jsx(ee.ChevronDown,{size:18,className:e.styles.chevron})]})}),s.jsx("div",{id:`submenu-${r}`,className:`${e.styles.sublinks} ${f?e.styles.show:""}`,role:"menu","aria-label":`${t.title} submenu`,children:s.jsx("div",{children:s.jsx("div",{className:`${e.styles.sublinksInner} ${t.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=t.primaryItems)==null?void 0:P.map((l,o)=>l.href?s.jsxs("a",{href:l.href,className:`${e.styles.link} ${x===o?e.styles.open:""}`,target:l.isExternal?"_blank":"_self",rel:l.isExternal?"noopener noreferrer":void 0,onClick:()=>{var T;c(null),(T=l.onClick)==null||T.call(l)},onMouseEnter:()=>l.sublinks?b(o):null,role:"menuitem",children:[s.jsxs("span",{className:e.styles.linkContent,children:[l.label,l.subtitle&&s.jsx("span",{className:e.styles.subtitle,children:l.subtitle})]}),l.isExternal&&s.jsx(se.ExternalLink,{className:e.styles.newTabIcon,size:16})]},l._key??o):s.jsx("button",{className:`${e.styles.sublinkToggle} ${x===o?e.styles.open:""}`,onMouseEnter:()=>b(o),children:s.jsxs("span",{className:e.styles.linkContent,children:[l.label,l.subtitle&&s.jsx("span",{className:e.styles.subtitle,children:l.subtitle})]})},l._key??o))]})})})})]},t._key??`group-${r}`)}),_=(n,t="")=>n.map(r=>{const i=`${t}/${r.label}`;return s.jsx(e.NavLink,{link:r,path:i,parentPath:t,openPath:p,togglePath:Y,updateTriangleIndicator:w,setOpenPath:c,renderLinks:_,buttonRefs:$},r._key??i)}),z=a.useCallback(n=>{j.current&&!j.current.contains(n.target)&&c(null)},[]),B=a.useCallback(()=>{O(),typeof window<"u"&&window.innerWidth>768&&(V(!1),c(null),typeof document<"u"&&(document.body.style.overflow=""))},[]),O=a.useCallback(()=>{if(u.current){const n=u.current.getBoundingClientRect().width;H(n),J(!0)}},[]);return a.useEffect(()=>{const n=typeof window<"u",t=typeof document<"u";return n&&window.addEventListener("resize",B),t&&document.addEventListener("click",z),O(),()=>{n&&window.removeEventListener("resize",B),t&&document.removeEventListener("click",z)}},[]),a.useEffect(()=>{if(typeof window<"u"){const n=()=>{const t=window.innerWidth<768;A(t)};return n(),window.addEventListener("resize",n),()=>window.removeEventListener("resize",n)}},[]),a.useEffect(()=>{if(typeof document<"u")return document.body.style.overflow=h?"hidden":"",()=>{document.body.style.overflow=""}},[h]),s.jsx("header",{ref:j,className:`${F??""} ${te[v]} ${ne[X]} ${e.styles.navbar} ${G?e.styles.sticky:""} ${d&&d.length?e.styles.advanced:e.styles.default}`,role:"navigation","aria-label":"Main navigation",children:s.jsxs("div",{className:`${e.styles.container} ${(!g||g.length===0)&&v!=="center"?e.styles.twoColumn:""}`,children:[k?s.jsx("div",{className:e.styles.logo,children:k}):s.jsx("div",{className:e.styles.title,children:D}),s.jsx("nav",{ref:u,style:{left:v==="center"?`calc(50% - ${R/2}px)`:"0"},className:`${e.styles.nav} ${h?e.styles.open:""} ${M?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:`${K}px`},className:`${e.styles.triangle} ${p?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"})}),L==="default"&&y&&s.jsxs("div",{className:e.styles.grid,children:[y&&y.length>0&&_(y),C&&!m&&s.jsxs(s.Fragment,{children:[s.jsx("span",{className:e.styles.separator}),s.jsx(S,{})]}),E&&s.jsx(W,{})]}),!m&&L==="advanced"&&d&&s.jsxs("div",{className:e.styles.grid,children:[d.length>0&&Z(d),C&&s.jsxs(s.Fragment,{children:[s.jsx("span",{className:e.styles.separator}),s.jsx(S,{})]}),E&&s.jsx(W,{})]}),s.jsx("p",{children:"HELLO"}),s.jsxs("p",{children:["vis: ",M]}),s.jsxs("p",{children:["open: ",h]}),s.jsxs("p",{children:["path: ",p]}),s.jsxs("p",{children:["nav: ",R]}),s.jsxs("p",{children:["mobile: ",m]})]})})]})})}exports.Navbar=le;

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

@@ -1,77 +1,77 @@
-import { jsx as n, jsxs as i, Fragment as J } from "react/jsx-runtime";
-import { useState as c, useRef as y, useCallback as M, useEffect as x } from "react";
-import { s as e, N as oe } from "../../../NavLink-BlhKWQ4q.js";
+import { jsx as n, jsxs as l, Fragment as A } from "react/jsx-runtime";
+import { useState as o, useRef as E, useCallback as L, useEffect as I } from "react";
+import { s as e, N as le } from "../../../NavLink-B5joxE9Z.js";
 import { C as re } from "../../../chevron-down-DSUzBz9F.js";
-import { E as ce } from "../../../external-link-BOPobeQJ.js";
-const de = {
+import { E as ie } from "../../../external-link-BOPobeQJ.js";
+const oe = {
   standard: e.standard,
   transparent: e.transparent
-}, ue = {
+}, ce = {
   left: e.left,
   center: e.center,
   right: e.right
 };
-function $e({
-  title: K,
-  logo: R,
-  items: p,
-  groups: h,
-  utilityItems: W,
-  isSticky: Q = !1,
-  showSearch: z = !0,
-  showLocaleSelect: B = !0,
-  alignment: m = "right",
-  variant: U = "standard",
-  navigationType: O = "default",
+function pe({
+  title: F,
+  logo: M,
+  items: f,
+  groups: u,
+  utilityItems: x,
+  isSticky: q = !1,
+  showSearch: R = !0,
+  showLocaleSelect: W = !0,
+  alignment: v = "right",
+  variant: J = "standard",
+  navigationType: z = "default",
   // searchComponent,
   // localeSelectComponent,
-  className: Y
+  className: K
 }) {
-  const [_, Z] = c(0), [N, d] = c(null), [v, P] = c(!1), [w, ee] = c(!1), [T, ne] = c(!1), [se, le] = c(null), [b, k] = c(
+  const [B, Q] = o(0), [b, c] = o(null), [m, U] = o(!1), [$, Y] = o(!1), [O, Z] = o(!1), [ee, ne] = o(null), [w, N] = o(
     0
-  ), [te, j] = c(null), g = y(null), f = y(null), C = y(/* @__PURE__ */ new Map()), D = () => /* @__PURE__ */ n(
+  ), [te, _] = o(null), k = E(null), h = E(null), g = E(/* @__PURE__ */ new Map()), P = () => /* @__PURE__ */ n(
     "div",
     {
       className: `${e.linkWrapper} ${e.parent} ${e.searchWrapper}`,
       children: /* @__PURE__ */ n("div", { className: e.linkItem })
     }
-  ), G = () => /* @__PURE__ */ n("div", { className: `${e.linkWrapper} ${e.parent} `, children: /* @__PURE__ */ n("div", { className: e.linkItem }) }), E = (l) => {
-    const t = C.current.get(l);
-    if (t && f.current) {
-      const o = t.getBoundingClientRect(), r = f.current.getBoundingClientRect(), s = o.left - r.left + o.width / 2;
-      le(s);
+  ), T = () => /* @__PURE__ */ n("div", { className: `${e.linkWrapper} ${e.parent} `, children: /* @__PURE__ */ n("div", { className: e.linkItem }) }), y = (t) => {
+    const s = g.current.get(t);
+    if (s && h.current) {
+      const r = s.getBoundingClientRect(), i = h.current.getBoundingClientRect(), C = r.left - i.left + r.width / 2;
+      ne(C);
     }
   };
-  console.log(E);
-  const ae = (l) => {
-    d((t) => t === l ? null : l);
-  }, ie = (l) => l.map((t, o) => {
-    var S, V, A, I;
-    const r = `group-${o}`, $ = te === o, s = (S = t.primaryItems) == null ? void 0 : S[b ?? 0];
-    return /* @__PURE__ */ i(
+  console.log(y);
+  const se = (t) => {
+    c((s) => s === t ? null : t);
+  }, ae = (t) => t.map((s, r) => {
+    var H, S;
+    const i = `group-${r}`, p = te === r, C = (H = s.primaryItems) == null ? void 0 : H[w ?? 0];
+    return console.log(C), /* @__PURE__ */ l(
       "div",
       {
         className: `${e.linkWrapper} ${e.parent}`,
         onMouseEnter: () => {
-          j(o), d(r), E(r);
+          _(r), c(i), y(i);
         },
         onMouseLeave: () => {
-          j(null), k(0), d(null);
+          _(null), N(0), c(null);
         },
         children: [
-          /* @__PURE__ */ n("div", { className: e.linkItem, children: /* @__PURE__ */ i(
+          /* @__PURE__ */ n("div", { className: e.linkItem, children: /* @__PURE__ */ l(
             "button",
             {
               ref: (a) => {
-                C.current.set(r, a);
+                g.current.set(i, a);
               },
               role: "menuitem",
               "aria-haspopup": "true",
-              "aria-expanded": $,
-              "aria-controls": `submenu-${o}`,
-              className: `${e.sublinkToggle} ${$ ? e.open : ""} `,
+              "aria-expanded": p,
+              "aria-controls": `submenu-${r}`,
+              className: `${e.sublinkToggle} ${p ? e.open : ""} `,
               children: [
-                t.title,
+                s.title,
                 /* @__PURE__ */ n(re, { size: 18, className: e.chevron })
               ]
             }
@@ -79,164 +79,148 @@ function $e({
           /* @__PURE__ */ n(
             "div",
             {
-              id: `submenu-${o}`,
-              className: `${e.sublinks} ${$ ? e.show : ""}`,
+              id: `submenu-${r}`,
+              className: `${e.sublinks} ${p ? e.show : ""}`,
               role: "menu",
-              "aria-label": `${t.title} submenu`,
-              children: /* @__PURE__ */ n("div", { children: /* @__PURE__ */ i(
+              "aria-label": `${s.title} submenu`,
+              children: /* @__PURE__ */ n("div", { children: /* @__PURE__ */ n(
                 "div",
                 {
-                  className: `${e.sublinksInner} ${t.spotlight ? e.withSpotlight : e.withoutSpotlight}`,
-                  children: [
-                    /* @__PURE__ */ i(
-                      "div",
-                      {
-                        className: `${e.sublinksColumn} ${e.primaryColumn}`,
-                        children: [
-                          /* @__PURE__ */ n("div", { className: e.linkItem }),
-                          (V = t.primaryItems) == null ? void 0 : V.map(
-                            (a, u) => a.href ? /* @__PURE__ */ i(
-                              "a",
-                              {
-                                href: a.href,
-                                className: `${e.link} ${b === u ? e.open : ""}`,
-                                target: a.isExternal ? "_blank" : "_self",
-                                rel: a.isExternal ? "noopener noreferrer" : void 0,
-                                onClick: () => {
-                                  var q;
-                                  d(null), (q = a.onClick) == null || q.call(a);
-                                },
-                                onMouseEnter: () => a.sublinks ? k(u) : null,
-                                role: "menuitem",
-                                children: [
-                                  /* @__PURE__ */ i("span", { className: e.linkContent, children: [
-                                    a.label,
-                                    a.subtitle && /* @__PURE__ */ n("span", { className: e.subtitle, children: a.subtitle })
-                                  ] }),
-                                  a.isExternal && /* @__PURE__ */ n(
-                                    ce,
-                                    {
-                                      className: e.newTabIcon,
-                                      size: 16
-                                    }
-                                  )
-                                ]
+                  className: `${e.sublinksInner} ${s.spotlight ? e.withSpotlight : e.withoutSpotlight}`,
+                  children: /* @__PURE__ */ l(
+                    "div",
+                    {
+                      className: `${e.sublinksColumn} ${e.primaryColumn}`,
+                      children: [
+                        /* @__PURE__ */ n("div", { className: e.linkItem }),
+                        (S = s.primaryItems) == null ? void 0 : S.map(
+                          (a, d) => a.href ? /* @__PURE__ */ l(
+                            "a",
+                            {
+                              href: a.href,
+                              className: `${e.link} ${w === d ? e.open : ""}`,
+                              target: a.isExternal ? "_blank" : "_self",
+                              rel: a.isExternal ? "noopener noreferrer" : void 0,
+                              onClick: () => {
+                                var V;
+                                c(null), (V = a.onClick) == null || V.call(a);
                               },
-                              a._key ?? u
-                            ) : /* @__PURE__ */ n(
-                              "button",
-                              {
-                                className: `${e.sublinkToggle} ${b === u ? e.open : ""}`,
-                                onMouseEnter: () => k(u),
-                                children: /* @__PURE__ */ i("span", { className: e.linkContent, children: [
+                              onMouseEnter: () => a.sublinks ? N(d) : null,
+                              role: "menuitem",
+                              children: [
+                                /* @__PURE__ */ l("span", { className: e.linkContent, children: [
                                   a.label,
                                   a.subtitle && /* @__PURE__ */ n("span", { className: e.subtitle, children: a.subtitle })
-                                ] })
-                              },
-                              a._key ?? u
-                            )
+                                ] }),
+                                a.isExternal && /* @__PURE__ */ n(
+                                  ie,
+                                  {
+                                    className: e.newTabIcon,
+                                    size: 16
+                                  }
+                                )
+                              ]
+                            },
+                            a._key ?? d
+                          ) : /* @__PURE__ */ n(
+                            "button",
+                            {
+                              className: `${e.sublinkToggle} ${w === d ? e.open : ""}`,
+                              onMouseEnter: () => N(d),
+                              children: /* @__PURE__ */ l("span", { className: e.linkContent, children: [
+                                a.label,
+                                a.subtitle && /* @__PURE__ */ n("span", { className: e.subtitle, children: a.subtitle })
+                              ] })
+                            },
+                            a._key ?? d
                           )
-                        ]
-                      }
-                    ),
-                    (s == null ? void 0 : s.sublinks) && ((A = s == null ? void 0 : s.sublinks) == null ? void 0 : A.length) > 0 && /* @__PURE__ */ i(
-                      "div",
-                      {
-                        className: `${e.sublinksColumn} ${e.fadeInFromLeft}`,
-                        children: [
-                          (s == null ? void 0 : s.description) && /* @__PURE__ */ n("div", { className: e.sublinksDescription, children: s == null ? void 0 : s.description }),
-                          (s == null ? void 0 : s.sublinks) && L(
-                            s.sublinks,
-                            `${r}-${b}`
-                          )
-                        ]
-                      },
-                      `${s.label}-${(I = s == null ? void 0 : s.sublinks) == null ? void 0 : I.length}`
-                    )
-                  ]
+                        )
+                      ]
+                    }
+                  )
                 }
               ) })
             }
           )
         ]
       },
-      t._key ?? `group-${o}`
+      s._key ?? `group-${r}`
     );
-  }), L = (l, t = "") => l.map((o) => {
-    const r = `${t}/${o.label}`;
+  }), j = (t, s = "") => t.map((r) => {
+    const i = `${s}/${r.label}`;
     return /* @__PURE__ */ n(
-      oe,
+      le,
       {
-        link: o,
-        path: r,
-        parentPath: t,
-        openPath: N,
-        togglePath: ae,
-        updateTriangleIndicator: E,
-        setOpenPath: d,
-        renderLinks: L,
-        buttonRefs: C
+        link: r,
+        path: i,
+        parentPath: s,
+        openPath: b,
+        togglePath: se,
+        updateTriangleIndicator: y,
+        setOpenPath: c,
+        renderLinks: j,
+        buttonRefs: g
       },
-      o._key ?? r
+      r._key ?? i
     );
-  }), X = M((l) => {
-    g.current && !g.current.contains(l.target) && d(null);
-  }, []), F = M(() => {
-    H(), typeof window < "u" && window.innerWidth > 768 && (P(!1), d(null), typeof document < "u" && (document.body.style.overflow = ""));
-  }, []), H = M(() => {
-    if (f.current) {
-      const l = f.current.getBoundingClientRect().width;
-      Z(l), ne(!0);
+  }), G = L((t) => {
+    k.current && !k.current.contains(t.target) && c(null);
+  }, []), X = L(() => {
+    D(), typeof window < "u" && window.innerWidth > 768 && (U(!1), c(null), typeof document < "u" && (document.body.style.overflow = ""));
+  }, []), D = L(() => {
+    if (h.current) {
+      const t = h.current.getBoundingClientRect().width;
+      Q(t), Z(!0);
     }
   }, []);
-  return x(() => {
-    const l = typeof window < "u", t = typeof document < "u";
-    return l && window.addEventListener("resize", F), t && document.addEventListener("click", X), H(), () => {
-      l && window.removeEventListener("resize", F), t && document.removeEventListener("click", X);
+  return I(() => {
+    const t = typeof window < "u", s = typeof document < "u";
+    return t && window.addEventListener("resize", X), s && document.addEventListener("click", G), D(), () => {
+      t && window.removeEventListener("resize", X), s && document.removeEventListener("click", G);
     };
-  }, []), x(() => {
+  }, []), I(() => {
     if (typeof window < "u") {
-      const l = () => {
-        const t = window.innerWidth < 768;
-        ee(t);
+      const t = () => {
+        const s = window.innerWidth < 768;
+        Y(s);
       };
-      return l(), window.addEventListener("resize", l), () => window.removeEventListener("resize", l);
+      return t(), window.addEventListener("resize", t), () => window.removeEventListener("resize", t);
     }
-  }, []), x(() => {
+  }, []), I(() => {
     if (typeof document < "u")
-      return document.body.style.overflow = v ? "hidden" : "", () => {
+      return document.body.style.overflow = m ? "hidden" : "", () => {
         document.body.style.overflow = "";
       };
-  }, [v]), /* @__PURE__ */ n(
+  }, [m]), /* @__PURE__ */ n(
     "header",
     {
-      ref: g,
-      className: `${Y ?? ""} ${ue[m]} ${de[U]} ${e.navbar} ${Q ? e.sticky : ""} ${h && h.length ? e.advanced : e.default}`,
+      ref: k,
+      className: `${K ?? ""} ${ce[v]} ${oe[J]} ${e.navbar} ${q ? e.sticky : ""} ${u && u.length ? e.advanced : e.default}`,
       role: "navigation",
       "aria-label": "Main navigation",
-      children: /* @__PURE__ */ i(
+      children: /* @__PURE__ */ l(
         "div",
         {
-          className: `${e.container} ${(!W || W.length === 0) && m !== "center" ? e.twoColumn : ""}`,
+          className: `${e.container} ${(!x || x.length === 0) && v !== "center" ? e.twoColumn : ""}`,
           children: [
-            R ? /* @__PURE__ */ n("div", { className: e.logo, children: R }) : /* @__PURE__ */ n("div", { className: e.title, children: K }),
+            M ? /* @__PURE__ */ n("div", { className: e.logo, children: M }) : /* @__PURE__ */ n("div", { className: e.title, children: F }),
             /* @__PURE__ */ n(
               "nav",
               {
-                ref: f,
+                ref: h,
                 style: {
-                  left: m === "center" ? `calc(50% - ${_ / 2}px)` : "0"
+                  left: v === "center" ? `calc(50% - ${B / 2}px)` : "0"
                 },
-                className: `${e.nav} ${v ? e.open : ""} ${T ? e.visible : e.hidden}`,
+                className: `${e.nav} ${m ? e.open : ""} ${O ? e.visible : e.hidden}`,
                 id: "main-menu",
                 role: "menubar",
                 "aria-label": "Main navigation",
-                children: /* @__PURE__ */ i("div", { className: e.navInner, children: [
+                children: /* @__PURE__ */ l("div", { className: e.navInner, children: [
                   /* @__PURE__ */ n(
                     "svg",
                     {
-                      style: { left: `${se}px` },
-                      className: `${e.triangle} ${N ? e.show : ""}`,
+                      style: { left: `${ee}px` },
+                      className: `${e.triangle} ${b ? e.show : ""}`,
                       width: 16,
                       height: 12,
                       viewBox: "0 0 100 75",
@@ -252,42 +236,42 @@ function $e({
                       )
                     }
                   ),
-                  O === "default" && p && /* @__PURE__ */ i("div", { className: e.grid, children: [
-                    p && p.length > 0 && L(p),
-                    z && !w && /* @__PURE__ */ i(J, { children: [
+                  z === "default" && f && /* @__PURE__ */ l("div", { className: e.grid, children: [
+                    f && f.length > 0 && j(f),
+                    R && !$ && /* @__PURE__ */ l(A, { children: [
                       /* @__PURE__ */ n("span", { className: e.separator }),
-                      /* @__PURE__ */ n(D, {})
+                      /* @__PURE__ */ n(P, {})
                     ] }),
-                    B && /* @__PURE__ */ n(G, {})
+                    W && /* @__PURE__ */ n(T, {})
                   ] }),
-                  !w && O === "advanced" && h && /* @__PURE__ */ i("div", { className: e.grid, children: [
-                    h.length > 0 && ie(h),
-                    z && /* @__PURE__ */ i(J, { children: [
+                  !$ && z === "advanced" && u && /* @__PURE__ */ l("div", { className: e.grid, children: [
+                    u.length > 0 && ae(u),
+                    R && /* @__PURE__ */ l(A, { children: [
                       /* @__PURE__ */ n("span", { className: e.separator }),
-                      /* @__PURE__ */ n(D, {})
+                      /* @__PURE__ */ n(P, {})
                     ] }),
-                    B && /* @__PURE__ */ n(G, {})
+                    W && /* @__PURE__ */ n(T, {})
                   ] }),
                   /* @__PURE__ */ n("p", { children: "HELLO" }),
-                  /* @__PURE__ */ i("p", { children: [
+                  /* @__PURE__ */ l("p", { children: [
                     "vis: ",
-                    T
+                    O
                   ] }),
-                  /* @__PURE__ */ i("p", { children: [
+                  /* @__PURE__ */ l("p", { children: [
                     "open: ",
-                    v
+                    m
                   ] }),
-                  /* @__PURE__ */ i("p", { children: [
+                  /* @__PURE__ */ l("p", { children: [
                     "path: ",
-                    N
+                    b
                   ] }),
-                  /* @__PURE__ */ i("p", { children: [
+                  /* @__PURE__ */ l("p", { children: [
                     "nav: ",
-                    _
+                    B
                   ] }),
-                  /* @__PURE__ */ i("p", { children: [
+                  /* @__PURE__ */ l("p", { children: [
                     "mobile: ",
-                    w
+                    $
                   ] })
                 ] })
               }
@@ -299,5 +283,5 @@ function $e({
   );
 }
 export {
-  $e as Navbar
+  pe as Navbar
 };

package/package.json

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

package/dist/NavLink-RigeMjDg.cjs

@@ -1 +0,0 @@
-"use strict";require('./assets/NavLink.css');const e=require("react/jsx-runtime"),k=require("react"),m=require("./external-link-DDShu-48.cjs"),v=require("./chevron-down-DfK1XBl3.cjs"),g="_navbar_1bon6_5",f="_sticky_1bon6_19",w="_left_1bon6_34",I="_container_1bon6_35",C="_logo_1bon6_39",x="_nav_1bon6_5",N="_center_1bon6_54",j="_hidden_1bon6_60",$="_visible_1bon6_67",y="_right_1bon6_82",L="_title_1bon6_89",T="_linkWrapper_1bon6_99",S="_parent_1bon6_99",W="_linkItem_1bon6_107",E="_link_1bon6_99",q="_sublinkToggle_1bon6_111",D="_standard_1bon6_159",F="_triangle_1bon6_167",M="_transparent_1bon6_172",R="_twoColumn_1bon6_276",z="_navInner_1bon6_398",A="_grid_1bon6_409",B="_separator_1bon6_444",G="_newTabIcon_1bon6_474",H="_sublinksDescription_1bon6_486",J="_linkContent_1bon6_489",K="_open_1bon6_500",Q="_sublinks_1bon6_486",U="_show_1bon6_571",V="_primaryColumn_1bon6_612",X="_sublinksInner_1bon6_629",Y="_sublinksColumn_1bon6_647",Z="_chevron_1bon6_657",O="_advanced_1bon6_839",P="_subtitle_1bon6_848",nn="_withSpotlight_1bon6_890",on="_withoutSpotlight_1bon6_894",en="_searchWrapper_1bon6_940",sn="_fadeInFromLeft_1bon6_962",o={navbar:g,sticky:f,left:w,container:I,logo:C,nav:x,center:N,hidden:j,visible:$,right:y,title:L,linkWrapper:T,parent:S,linkItem:W,link:E,sublinkToggle:q,standard:D,triangle:F,transparent:M,twoColumn:R,navInner:z,grid:A,separator:B,newTabIcon:G,sublinksDescription:H,linkContent:J,open:K,sublinks:Q,show:U,primaryColumn:V,sublinksInner:X,sublinksColumn:Y,chevron:Z,default:"_default_1bon6_773",advanced:O,subtitle:P,withSpotlight:nn,withoutSpotlight:on,searchWrapper:en,fadeInFromLeft:sn};function tn({link:n,path:s,parentPath:i,openPath:u,togglePath:l,updateTriangleIndicator:d,setOpenPath:t,renderLinks:p,buttonRefs:h}){var c;const r=u===s,_=!!((c=n.sublinks)!=null&&c.length),a=k.useRef(null);return h.current.set(s,a.current),e.jsxs("div",{className:`${o.linkWrapper} ${i?"":o.parent}`,children:[e.jsx("div",{className:o.linkItem,children:n.href?e.jsxs("a",{href:n.href,className:o.link,target:n.isExternal?"_blank":"_self",rel:n.isExternal?"noopener noreferrer":void 0,onClick:()=>{var b;t(null),(b=n.onClick)==null||b.call(n)},onMouseEnter:()=>{i||t(null)},role:"menuitem",children:[n.label,n.isExternal&&e.jsx(m.ExternalLink,{className:o.newTabIcon,size:16})]}):e.jsxs("button",{ref:a,"aria-haspopup":_?"true":void 0,"aria-expanded":r,className:`${o.sublinkToggle} ${r?o.open:""}`,onClick:()=>l(s),onMouseEnter:()=>{d(s),t(s)},children:[n.label,_&&e.jsx(v.ChevronDown,{size:18,className:o.chevron})]})}),_&&e.jsx("div",{className:`${o.sublinks} ${r?o.show:""}`,onMouseLeave:()=>l(s),role:"menu","aria-label":`${n.label} submenu`,children:e.jsx("div",{children:e.jsx("div",{className:o.sublinksInner,children:e.jsx("div",{className:o.sublinksColumn,children:p(n.sublinks,s)})})})})]},s)}exports.NavLink=tn;exports.styles=o;