quirk-ui 0.0.410 → 0.0.412

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.
@@ -0,0 +1,120 @@
1
+ import { jsxs as i, jsx as s } from "react/jsx-runtime";
2
+ import { useRef as k } from "react";
3
+ import { E as v } from "./external-link-BOPobeQJ.js";
4
+ import { C as g } from "./chevron-down-DSUzBz9F.js";
5
+ 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 = {
6
+ navbar: f,
7
+ sticky: w,
8
+ left: C,
9
+ container: I,
10
+ logo: N,
11
+ nav: x,
12
+ center: T,
13
+ hidden: y,
14
+ visible: E,
15
+ right: S,
16
+ title: W,
17
+ linkWrapper: $,
18
+ parent: L,
19
+ linkItem: D,
20
+ link: F,
21
+ sublinkToggle: M,
22
+ standard: j,
23
+ triangle: z,
24
+ transparent: R,
25
+ twoColumn: q,
26
+ navInner: A,
27
+ grid: B,
28
+ separator: G,
29
+ newTabIcon: H,
30
+ sublinksDescription: J,
31
+ linkContent: K,
32
+ open: Q,
33
+ sublinks: U,
34
+ show: V,
35
+ primaryColumn: X,
36
+ sublinksInner: Y,
37
+ sublinksColumn: Z,
38
+ chevron: O,
39
+ default: "_default_1bon6_773",
40
+ advanced: P,
41
+ subtitle: nn,
42
+ withSpotlight: on,
43
+ withoutSpotlight: en,
44
+ searchWrapper: sn,
45
+ fadeInFromLeft: tn
46
+ };
47
+ function cn({
48
+ link: n,
49
+ path: e,
50
+ parentPath: l,
51
+ openPath: d,
52
+ togglePath: a,
53
+ updateTriangleIndicator: m,
54
+ setOpenPath: t,
55
+ renderLinks: p,
56
+ buttonRefs: h
57
+ }) {
58
+ var b;
59
+ const r = d === e, _ = !!((b = n.sublinks) != null && b.length), c = k(null);
60
+ return h.current.set(e, c.current), /* @__PURE__ */ i(
61
+ "div",
62
+ {
63
+ className: `${o.linkWrapper} ${l ? "" : o.parent}`,
64
+ children: [
65
+ /* @__PURE__ */ s("div", { className: o.linkItem, children: n.href ? /* @__PURE__ */ i(
66
+ "a",
67
+ {
68
+ href: n.href,
69
+ className: o.link,
70
+ target: n.isExternal ? "_blank" : "_self",
71
+ rel: n.isExternal ? "noopener noreferrer" : void 0,
72
+ onClick: () => {
73
+ var u;
74
+ t(null), (u = n.onClick) == null || u.call(n);
75
+ },
76
+ onMouseEnter: () => {
77
+ l || t(null);
78
+ },
79
+ role: "menuitem",
80
+ children: [
81
+ n.label,
82
+ n.isExternal && /* @__PURE__ */ s(v, { className: o.newTabIcon, size: 16 })
83
+ ]
84
+ }
85
+ ) : /* @__PURE__ */ i(
86
+ "button",
87
+ {
88
+ ref: c,
89
+ "aria-haspopup": _ ? "true" : void 0,
90
+ "aria-expanded": r,
91
+ className: `${o.sublinkToggle} ${r ? o.open : ""}`,
92
+ onClick: () => a(e),
93
+ onMouseEnter: () => {
94
+ m(e), t(e);
95
+ },
96
+ children: [
97
+ n.label,
98
+ _ && /* @__PURE__ */ s(g, { size: 18, className: o.chevron })
99
+ ]
100
+ }
101
+ ) }),
102
+ _ && /* @__PURE__ */ s(
103
+ "div",
104
+ {
105
+ className: `${o.sublinks} ${r ? o.show : ""}`,
106
+ onMouseLeave: () => a(e),
107
+ role: "menu",
108
+ "aria-label": `${n.label} submenu`,
109
+ children: /* @__PURE__ */ s("div", { children: /* @__PURE__ */ s("div", { className: o.sublinksInner, children: /* @__PURE__ */ s("div", { className: o.sublinksColumn, children: p(n.sublinks, e) }) }) })
110
+ }
111
+ )
112
+ ]
113
+ },
114
+ e
115
+ );
116
+ }
117
+ export {
118
+ cn as N,
119
+ o as s
120
+ };
@@ -0,0 +1 @@
1
+ "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;
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require("react/jsx-runtime");require("react");const e=require("../../../NavLink-CE4AZJOV.cjs");require("../../../external-link-DDShu-48.cjs");require("../../../chevron-down-DfK1XBl3.cjs");exports.NavLink=e.NavLink;
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;
@@ -1,6 +1,6 @@
1
1
  import "react/jsx-runtime";
2
2
  import "react";
3
- import { N as a } from "../../../NavLink-BSHG9x5C.js";
3
+ import { N as a } from "../../../NavLink-BlhKWQ4q.js";
4
4
  import "../../../external-link-BOPobeQJ.js";
5
5
  import "../../../chevron-down-DSUzBz9F.js";
6
6
  export {
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),l=require("react"),e=require("../../../NavLink-CE4AZJOV.cjs"),K=require("../../../chevron-down-DfK1XBl3.cjs"),Q={standard:e.styles.standard,transparent:e.styles.transparent},U={left:e.styles.left,center:e.styles.center,right:e.styles.right};function Y({title:B,logo:j,items:d,groups:o,utilityItems:$,isSticky:I=!1,showSearch:b=!0,showLocaleSelect:N=!0,alignment:f="right",variant:O="standard",navigationType:g="default",className:q}){const[k,P]=l.useState(0),[v,r]=l.useState(null),[u,_]=l.useState(!1),[y,D]=l.useState(!1),[L,G]=l.useState(!1),[T,X]=l.useState(null),[F,H]=l.useState(0),[V,R]=l.useState(null),m=l.useRef(null),c=l.useRef(null),p=l.useRef(new Map);console.log(F);const C=()=>s.jsx("div",{className:`${e.styles.linkWrapper} ${e.styles.parent} ${e.styles.searchWrapper}`,children:s.jsx("div",{className:e.styles.linkItem})}),E=()=>s.jsx("div",{className:`${e.styles.linkWrapper} ${e.styles.parent} `,children:s.jsx("div",{className:e.styles.linkItem})}),w=t=>{const n=p.current.get(t);if(n&&c.current){const i=n.getBoundingClientRect(),a=c.current.getBoundingClientRect(),x=i.left-a.left+i.width/2;X(x)}};console.log(w);const A=t=>{r(n=>n===t?null:t)},J=t=>t.map((n,i)=>{const a=`group-${i}`,h=V===i;return s.jsxs("div",{className:`${e.styles.linkWrapper} ${e.styles.parent}`,onMouseEnter:()=>{R(i),r(a),w(a)},onMouseLeave:()=>{R(null),H(0),r(null)},children:[s.jsx("div",{className:e.styles.linkItem,children:s.jsxs("button",{ref:x=>{p.current.set(a,x)},role:"menuitem","aria-haspopup":"true","aria-expanded":h,"aria-controls":`submenu-${i}`,className:`${e.styles.sublinkToggle} ${h?e.styles.open:""} `,children:[n.title,s.jsx(K.ChevronDown,{size:18,className:e.styles.chevron})]})}),s.jsx("div",{id:`submenu-${i}`,className:`${e.styles.sublinks} ${h?e.styles.show:""}`,role:"menu","aria-label":`${n.title} submenu`,children:s.jsx("div",{children:s.jsx("div",{className:`${e.styles.sublinksInner} ${n.spotlight?e.styles.withSpotlight:e.styles.withoutSpotlight}`})})})]},n._key??`group-${i}`)}),M=(t,n="")=>t.map(i=>{const a=`${n}/${i.label}`;return s.jsx(e.NavLink,{link:i,path:a,parentPath:n,openPath:v,togglePath:A,updateTriangleIndicator:w,setOpenPath:r,renderLinks:M,buttonRefs:p},i._key??a)}),S=l.useCallback(t=>{m.current&&!m.current.contains(t.target)&&r(null)},[]),W=l.useCallback(()=>{z(),typeof window<"u"&&window.innerWidth>768&&(_(!1),r(null),typeof document<"u"&&(document.body.style.overflow=""))},[]),z=l.useCallback(()=>{if(c.current){const t=c.current.getBoundingClientRect().width;P(t),G(!0)}},[]);return l.useEffect(()=>{const t=typeof window<"u",n=typeof document<"u";return t&&window.addEventListener("resize",W),n&&document.addEventListener("click",S),z(),()=>{t&&window.removeEventListener("resize",W),n&&document.removeEventListener("click",S)}},[]),l.useEffect(()=>{if(typeof window<"u"){const t=()=>{const n=window.innerWidth<768;D(n)};return t(),window.addEventListener("resize",t),()=>window.removeEventListener("resize",t)}},[]),l.useEffect(()=>{if(typeof document<"u")return document.body.style.overflow=u?"hidden":"",()=>{document.body.style.overflow=""}},[u]),s.jsx("header",{ref:m,className:`${q??""} ${U[f]} ${Q[O]} ${e.styles.navbar} ${I?e.styles.sticky:""} ${o&&o.length?e.styles.advanced:e.styles.default}`,role:"navigation","aria-label":"Main navigation",children:s.jsxs("div",{className:`${e.styles.container} ${(!$||$.length===0)&&f!=="center"?e.styles.twoColumn:""}`,children:[j?s.jsx("div",{className:e.styles.logo,children:j}):s.jsx("div",{className:e.styles.title,children:B}),s.jsx("nav",{ref:c,style:{left:f==="center"?`calc(50% - ${k/2}px)`:"0"},className:`${e.styles.nav} ${u?e.styles.open:""} ${L?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:`${T}px`},className:`${e.styles.triangle} ${v?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"})}),g==="default"&&d&&s.jsxs("div",{className:e.styles.grid,children:[d&&d.length>0&&M(d),b&&!y&&s.jsxs(s.Fragment,{children:[s.jsx("span",{className:e.styles.separator}),s.jsx(C,{})]}),N&&s.jsx(E,{})]}),!y&&g==="advanced"&&o&&s.jsxs("div",{className:e.styles.grid,children:[o.length>0&&J(o),b&&s.jsxs(s.Fragment,{children:[s.jsx("span",{className:e.styles.separator}),s.jsx(C,{})]}),N&&s.jsx(E,{})]}),s.jsx("p",{children:"HELLO"}),s.jsxs("p",{children:["vis: ",L]}),s.jsxs("p",{children:["open: ",u]}),s.jsxs("p",{children:["path: ",v]}),s.jsxs("p",{children:["nav: ",k]}),s.jsxs("p",{children:["mobile: ",y]})]})})]})})}exports.Navbar=Y;
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;
@@ -1,175 +1,242 @@
1
- import { jsx as n, jsxs as a, Fragment as X } from "react/jsx-runtime";
2
- import { useState as l, useRef as g, useCallback as y, useEffect as k } from "react";
3
- import { s as e, N as ee } from "../../../NavLink-BSHG9x5C.js";
4
- import { C as ne } from "../../../chevron-down-DSUzBz9F.js";
5
- const te = {
1
+ import { jsx as n, jsxs as i, Fragment as J } from "react/jsx-runtime";
2
+ import { useState as c, useRef as y, useCallback as M, useEffect as x } from "react";
3
+ import { s as e, N as oe } from "../../../NavLink-BlhKWQ4q.js";
4
+ import { C as re } from "../../../chevron-down-DSUzBz9F.js";
5
+ import { E as ce } from "../../../external-link-BOPobeQJ.js";
6
+ const de = {
6
7
  standard: e.standard,
7
8
  transparent: e.transparent
8
- }, ie = {
9
+ }, ue = {
9
10
  left: e.left,
10
11
  center: e.center,
11
12
  right: e.right
12
13
  };
13
- function oe({
14
- title: D,
15
- logo: L,
16
- items: u,
17
- groups: c,
18
- utilityItems: R,
19
- isSticky: H = !1,
20
- showSearch: C = !0,
21
- showLocaleSelect: M = !0,
22
- alignment: v = "right",
23
- variant: S = "standard",
24
- navigationType: W = "default",
14
+ function $e({
15
+ title: K,
16
+ logo: R,
17
+ items: p,
18
+ groups: h,
19
+ utilityItems: W,
20
+ isSticky: Q = !1,
21
+ showSearch: z = !0,
22
+ showLocaleSelect: B = !0,
23
+ alignment: m = "right",
24
+ variant: U = "standard",
25
+ navigationType: O = "default",
25
26
  // searchComponent,
26
27
  // localeSelectComponent,
27
- className: T
28
+ className: Y
28
29
  }) {
29
- const [E, V] = l(0), [m, o] = l(null), [h, _] = l(!1), [p, A] = l(!1), [x, F] = l(!1), [q, J] = l(null), [K, Q] = l(
30
+ 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(
30
31
  0
31
- ), [U, z] = l(null), w = g(null), d = g(null), $ = g(/* @__PURE__ */ new Map());
32
- console.log(K);
33
- const I = () => /* @__PURE__ */ n(
32
+ ), [te, j] = c(null), g = y(null), f = y(null), C = y(/* @__PURE__ */ new Map()), D = () => /* @__PURE__ */ n(
34
33
  "div",
35
34
  {
36
35
  className: `${e.linkWrapper} ${e.parent} ${e.searchWrapper}`,
37
36
  children: /* @__PURE__ */ n("div", { className: e.linkItem })
38
37
  }
39
- ), B = () => /* @__PURE__ */ n("div", { className: `${e.linkWrapper} ${e.parent} `, children: /* @__PURE__ */ n("div", { className: e.linkItem }) }), N = (t) => {
40
- const i = $.current.get(t);
41
- if (i && d.current) {
42
- const s = i.getBoundingClientRect(), r = d.current.getBoundingClientRect(), b = s.left - r.left + s.width / 2;
43
- J(b);
38
+ ), G = () => /* @__PURE__ */ n("div", { className: `${e.linkWrapper} ${e.parent} `, children: /* @__PURE__ */ n("div", { className: e.linkItem }) }), E = (l) => {
39
+ const t = C.current.get(l);
40
+ if (t && f.current) {
41
+ const o = t.getBoundingClientRect(), r = f.current.getBoundingClientRect(), s = o.left - r.left + o.width / 2;
42
+ le(s);
44
43
  }
45
44
  };
46
- console.log(N);
47
- const Y = (t) => {
48
- o((i) => i === t ? null : t);
49
- }, Z = (t) => t.map((i, s) => {
50
- const r = `group-${s}`, f = U === s;
51
- return /* @__PURE__ */ a(
45
+ console.log(E);
46
+ const ae = (l) => {
47
+ d((t) => t === l ? null : l);
48
+ }, ie = (l) => l.map((t, o) => {
49
+ var S, V, A, I;
50
+ const r = `group-${o}`, $ = te === o, s = (S = t.primaryItems) == null ? void 0 : S[b ?? 0];
51
+ return /* @__PURE__ */ i(
52
52
  "div",
53
53
  {
54
54
  className: `${e.linkWrapper} ${e.parent}`,
55
55
  onMouseEnter: () => {
56
- z(s), o(r), N(r);
56
+ j(o), d(r), E(r);
57
57
  },
58
58
  onMouseLeave: () => {
59
- z(null), Q(0), o(null);
59
+ j(null), k(0), d(null);
60
60
  },
61
61
  children: [
62
- /* @__PURE__ */ n("div", { className: e.linkItem, children: /* @__PURE__ */ a(
62
+ /* @__PURE__ */ n("div", { className: e.linkItem, children: /* @__PURE__ */ i(
63
63
  "button",
64
64
  {
65
- ref: (b) => {
66
- $.current.set(r, b);
65
+ ref: (a) => {
66
+ C.current.set(r, a);
67
67
  },
68
68
  role: "menuitem",
69
69
  "aria-haspopup": "true",
70
- "aria-expanded": f,
71
- "aria-controls": `submenu-${s}`,
72
- className: `${e.sublinkToggle} ${f ? e.open : ""} `,
70
+ "aria-expanded": $,
71
+ "aria-controls": `submenu-${o}`,
72
+ className: `${e.sublinkToggle} ${$ ? e.open : ""} `,
73
73
  children: [
74
- i.title,
75
- /* @__PURE__ */ n(ne, { size: 18, className: e.chevron })
74
+ t.title,
75
+ /* @__PURE__ */ n(re, { size: 18, className: e.chevron })
76
76
  ]
77
77
  }
78
78
  ) }),
79
79
  /* @__PURE__ */ n(
80
80
  "div",
81
81
  {
82
- id: `submenu-${s}`,
83
- className: `${e.sublinks} ${f ? e.show : ""}`,
82
+ id: `submenu-${o}`,
83
+ className: `${e.sublinks} ${$ ? e.show : ""}`,
84
84
  role: "menu",
85
- "aria-label": `${i.title} submenu`,
86
- children: /* @__PURE__ */ n("div", { children: /* @__PURE__ */ n(
85
+ "aria-label": `${t.title} submenu`,
86
+ children: /* @__PURE__ */ n("div", { children: /* @__PURE__ */ i(
87
87
  "div",
88
88
  {
89
- className: `${e.sublinksInner} ${i.spotlight ? e.withSpotlight : e.withoutSpotlight}`
89
+ className: `${e.sublinksInner} ${t.spotlight ? e.withSpotlight : e.withoutSpotlight}`,
90
+ children: [
91
+ /* @__PURE__ */ i(
92
+ "div",
93
+ {
94
+ className: `${e.sublinksColumn} ${e.primaryColumn}`,
95
+ children: [
96
+ /* @__PURE__ */ n("div", { className: e.linkItem }),
97
+ (V = t.primaryItems) == null ? void 0 : V.map(
98
+ (a, u) => a.href ? /* @__PURE__ */ i(
99
+ "a",
100
+ {
101
+ href: a.href,
102
+ className: `${e.link} ${b === u ? e.open : ""}`,
103
+ target: a.isExternal ? "_blank" : "_self",
104
+ rel: a.isExternal ? "noopener noreferrer" : void 0,
105
+ onClick: () => {
106
+ var q;
107
+ d(null), (q = a.onClick) == null || q.call(a);
108
+ },
109
+ onMouseEnter: () => a.sublinks ? k(u) : null,
110
+ role: "menuitem",
111
+ children: [
112
+ /* @__PURE__ */ i("span", { className: e.linkContent, children: [
113
+ a.label,
114
+ a.subtitle && /* @__PURE__ */ n("span", { className: e.subtitle, children: a.subtitle })
115
+ ] }),
116
+ a.isExternal && /* @__PURE__ */ n(
117
+ ce,
118
+ {
119
+ className: e.newTabIcon,
120
+ size: 16
121
+ }
122
+ )
123
+ ]
124
+ },
125
+ a._key ?? u
126
+ ) : /* @__PURE__ */ n(
127
+ "button",
128
+ {
129
+ className: `${e.sublinkToggle} ${b === u ? e.open : ""}`,
130
+ onMouseEnter: () => k(u),
131
+ children: /* @__PURE__ */ i("span", { className: e.linkContent, children: [
132
+ a.label,
133
+ a.subtitle && /* @__PURE__ */ n("span", { className: e.subtitle, children: a.subtitle })
134
+ ] })
135
+ },
136
+ a._key ?? u
137
+ )
138
+ )
139
+ ]
140
+ }
141
+ ),
142
+ (s == null ? void 0 : s.sublinks) && ((A = s == null ? void 0 : s.sublinks) == null ? void 0 : A.length) > 0 && /* @__PURE__ */ i(
143
+ "div",
144
+ {
145
+ className: `${e.sublinksColumn} ${e.fadeInFromLeft}`,
146
+ children: [
147
+ (s == null ? void 0 : s.description) && /* @__PURE__ */ n("div", { className: e.sublinksDescription, children: s == null ? void 0 : s.description }),
148
+ (s == null ? void 0 : s.sublinks) && L(
149
+ s.sublinks,
150
+ `${r}-${b}`
151
+ )
152
+ ]
153
+ },
154
+ `${s.label}-${(I = s == null ? void 0 : s.sublinks) == null ? void 0 : I.length}`
155
+ )
156
+ ]
90
157
  }
91
158
  ) })
92
159
  }
93
160
  )
94
161
  ]
95
162
  },
96
- i._key ?? `group-${s}`
163
+ t._key ?? `group-${o}`
97
164
  );
98
- }), O = (t, i = "") => t.map((s) => {
99
- const r = `${i}/${s.label}`;
165
+ }), L = (l, t = "") => l.map((o) => {
166
+ const r = `${t}/${o.label}`;
100
167
  return /* @__PURE__ */ n(
101
- ee,
168
+ oe,
102
169
  {
103
- link: s,
170
+ link: o,
104
171
  path: r,
105
- parentPath: i,
106
- openPath: m,
107
- togglePath: Y,
108
- updateTriangleIndicator: N,
109
- setOpenPath: o,
110
- renderLinks: O,
111
- buttonRefs: $
172
+ parentPath: t,
173
+ openPath: N,
174
+ togglePath: ae,
175
+ updateTriangleIndicator: E,
176
+ setOpenPath: d,
177
+ renderLinks: L,
178
+ buttonRefs: C
112
179
  },
113
- s._key ?? r
180
+ o._key ?? r
114
181
  );
115
- }), P = y((t) => {
116
- w.current && !w.current.contains(t.target) && o(null);
117
- }, []), j = y(() => {
118
- G(), typeof window < "u" && window.innerWidth > 768 && (_(!1), o(null), typeof document < "u" && (document.body.style.overflow = ""));
119
- }, []), G = y(() => {
120
- if (d.current) {
121
- const t = d.current.getBoundingClientRect().width;
122
- V(t), F(!0);
182
+ }), X = M((l) => {
183
+ g.current && !g.current.contains(l.target) && d(null);
184
+ }, []), F = M(() => {
185
+ H(), typeof window < "u" && window.innerWidth > 768 && (P(!1), d(null), typeof document < "u" && (document.body.style.overflow = ""));
186
+ }, []), H = M(() => {
187
+ if (f.current) {
188
+ const l = f.current.getBoundingClientRect().width;
189
+ Z(l), ne(!0);
123
190
  }
124
191
  }, []);
125
- return k(() => {
126
- const t = typeof window < "u", i = typeof document < "u";
127
- return t && window.addEventListener("resize", j), i && document.addEventListener("click", P), G(), () => {
128
- t && window.removeEventListener("resize", j), i && document.removeEventListener("click", P);
192
+ return x(() => {
193
+ const l = typeof window < "u", t = typeof document < "u";
194
+ return l && window.addEventListener("resize", F), t && document.addEventListener("click", X), H(), () => {
195
+ l && window.removeEventListener("resize", F), t && document.removeEventListener("click", X);
129
196
  };
130
- }, []), k(() => {
197
+ }, []), x(() => {
131
198
  if (typeof window < "u") {
132
- const t = () => {
133
- const i = window.innerWidth < 768;
134
- A(i);
199
+ const l = () => {
200
+ const t = window.innerWidth < 768;
201
+ ee(t);
135
202
  };
136
- return t(), window.addEventListener("resize", t), () => window.removeEventListener("resize", t);
203
+ return l(), window.addEventListener("resize", l), () => window.removeEventListener("resize", l);
137
204
  }
138
- }, []), k(() => {
205
+ }, []), x(() => {
139
206
  if (typeof document < "u")
140
- return document.body.style.overflow = h ? "hidden" : "", () => {
207
+ return document.body.style.overflow = v ? "hidden" : "", () => {
141
208
  document.body.style.overflow = "";
142
209
  };
143
- }, [h]), /* @__PURE__ */ n(
210
+ }, [v]), /* @__PURE__ */ n(
144
211
  "header",
145
212
  {
146
- ref: w,
147
- className: `${T ?? ""} ${ie[v]} ${te[S]} ${e.navbar} ${H ? e.sticky : ""} ${c && c.length ? e.advanced : e.default}`,
213
+ ref: g,
214
+ className: `${Y ?? ""} ${ue[m]} ${de[U]} ${e.navbar} ${Q ? e.sticky : ""} ${h && h.length ? e.advanced : e.default}`,
148
215
  role: "navigation",
149
216
  "aria-label": "Main navigation",
150
- children: /* @__PURE__ */ a(
217
+ children: /* @__PURE__ */ i(
151
218
  "div",
152
219
  {
153
- className: `${e.container} ${(!R || R.length === 0) && v !== "center" ? e.twoColumn : ""}`,
220
+ className: `${e.container} ${(!W || W.length === 0) && m !== "center" ? e.twoColumn : ""}`,
154
221
  children: [
155
- L ? /* @__PURE__ */ n("div", { className: e.logo, children: L }) : /* @__PURE__ */ n("div", { className: e.title, children: D }),
222
+ R ? /* @__PURE__ */ n("div", { className: e.logo, children: R }) : /* @__PURE__ */ n("div", { className: e.title, children: K }),
156
223
  /* @__PURE__ */ n(
157
224
  "nav",
158
225
  {
159
- ref: d,
226
+ ref: f,
160
227
  style: {
161
- left: v === "center" ? `calc(50% - ${E / 2}px)` : "0"
228
+ left: m === "center" ? `calc(50% - ${_ / 2}px)` : "0"
162
229
  },
163
- className: `${e.nav} ${h ? e.open : ""} ${x ? e.visible : e.hidden}`,
230
+ className: `${e.nav} ${v ? e.open : ""} ${T ? e.visible : e.hidden}`,
164
231
  id: "main-menu",
165
232
  role: "menubar",
166
233
  "aria-label": "Main navigation",
167
- children: /* @__PURE__ */ a("div", { className: e.navInner, children: [
234
+ children: /* @__PURE__ */ i("div", { className: e.navInner, children: [
168
235
  /* @__PURE__ */ n(
169
236
  "svg",
170
237
  {
171
- style: { left: `${q}px` },
172
- className: `${e.triangle} ${m ? e.show : ""}`,
238
+ style: { left: `${se}px` },
239
+ className: `${e.triangle} ${N ? e.show : ""}`,
173
240
  width: 16,
174
241
  height: 12,
175
242
  viewBox: "0 0 100 75",
@@ -185,42 +252,42 @@ function oe({
185
252
  )
186
253
  }
187
254
  ),
188
- W === "default" && u && /* @__PURE__ */ a("div", { className: e.grid, children: [
189
- u && u.length > 0 && O(u),
190
- C && !p && /* @__PURE__ */ a(X, { children: [
255
+ O === "default" && p && /* @__PURE__ */ i("div", { className: e.grid, children: [
256
+ p && p.length > 0 && L(p),
257
+ z && !w && /* @__PURE__ */ i(J, { children: [
191
258
  /* @__PURE__ */ n("span", { className: e.separator }),
192
- /* @__PURE__ */ n(I, {})
259
+ /* @__PURE__ */ n(D, {})
193
260
  ] }),
194
- M && /* @__PURE__ */ n(B, {})
261
+ B && /* @__PURE__ */ n(G, {})
195
262
  ] }),
196
- !p && W === "advanced" && c && /* @__PURE__ */ a("div", { className: e.grid, children: [
197
- c.length > 0 && Z(c),
198
- C && /* @__PURE__ */ a(X, { children: [
263
+ !w && O === "advanced" && h && /* @__PURE__ */ i("div", { className: e.grid, children: [
264
+ h.length > 0 && ie(h),
265
+ z && /* @__PURE__ */ i(J, { children: [
199
266
  /* @__PURE__ */ n("span", { className: e.separator }),
200
- /* @__PURE__ */ n(I, {})
267
+ /* @__PURE__ */ n(D, {})
201
268
  ] }),
202
- M && /* @__PURE__ */ n(B, {})
269
+ B && /* @__PURE__ */ n(G, {})
203
270
  ] }),
204
271
  /* @__PURE__ */ n("p", { children: "HELLO" }),
205
- /* @__PURE__ */ a("p", { children: [
272
+ /* @__PURE__ */ i("p", { children: [
206
273
  "vis: ",
207
- x
274
+ T
208
275
  ] }),
209
- /* @__PURE__ */ a("p", { children: [
276
+ /* @__PURE__ */ i("p", { children: [
210
277
  "open: ",
211
- h
278
+ v
212
279
  ] }),
213
- /* @__PURE__ */ a("p", { children: [
280
+ /* @__PURE__ */ i("p", { children: [
214
281
  "path: ",
215
- m
282
+ N
216
283
  ] }),
217
- /* @__PURE__ */ a("p", { children: [
284
+ /* @__PURE__ */ i("p", { children: [
218
285
  "nav: ",
219
- E
286
+ _
220
287
  ] }),
221
- /* @__PURE__ */ a("p", { children: [
288
+ /* @__PURE__ */ i("p", { children: [
222
289
  "mobile: ",
223
- p
290
+ w
224
291
  ] })
225
292
  ] })
226
293
  }
@@ -232,5 +299,5 @@ function oe({
232
299
  );
233
300
  }
234
301
  export {
235
- oe as Navbar
302
+ $e as Navbar
236
303
  };
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "quirk-ui",
3
3
  "private": false,
4
- "version": "0.0.410",
4
+ "version": "0.0.412",
5
5
  "type": "module",
6
6
  "exports": {
7
7
  ".": {
@@ -1,115 +0,0 @@
1
- import { jsxs as l, jsx as s } from "react/jsx-runtime";
2
- import { useRef as v } from "react";
3
- import { E as g } from "./external-link-BOPobeQJ.js";
4
- import { C as k } from "./chevron-down-DSUzBz9F.js";
5
- import './assets/NavLink.css';const f = "_navbar_1bon6_5", w = "_sticky_1bon6_19", I = "_left_1bon6_34", C = "_container_1bon6_35", N = "_logo_1bon6_39", x = "_nav_1bon6_5", T = "_center_1bon6_54", E = "_hidden_1bon6_60", S = "_visible_1bon6_67", W = "_right_1bon6_82", $ = "_title_1bon6_89", y = "_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 = "_open_1bon6_500", K = "_sublinks_1bon6_486", Q = "_show_1bon6_571", U = "_sublinksInner_1bon6_629", V = "_sublinksColumn_1bon6_647", X = "_chevron_1bon6_657", Y = "_advanced_1bon6_839", Z = "_withSpotlight_1bon6_890", O = "_withoutSpotlight_1bon6_894", P = "_searchWrapper_1bon6_940", o = {
6
- navbar: f,
7
- sticky: w,
8
- left: I,
9
- container: C,
10
- logo: N,
11
- nav: x,
12
- center: T,
13
- hidden: E,
14
- visible: S,
15
- right: W,
16
- title: $,
17
- linkWrapper: y,
18
- parent: L,
19
- linkItem: M,
20
- link: j,
21
- sublinkToggle: z,
22
- standard: R,
23
- triangle: D,
24
- transparent: q,
25
- twoColumn: A,
26
- navInner: B,
27
- grid: F,
28
- separator: G,
29
- newTabIcon: H,
30
- open: J,
31
- sublinks: K,
32
- show: Q,
33
- sublinksInner: U,
34
- sublinksColumn: V,
35
- chevron: X,
36
- default: "_default_1bon6_773",
37
- advanced: Y,
38
- withSpotlight: Z,
39
- withoutSpotlight: O,
40
- searchWrapper: P
41
- };
42
- function tn({
43
- link: n,
44
- path: e,
45
- parentPath: a,
46
- openPath: d,
47
- togglePath: i,
48
- updateTriangleIndicator: p,
49
- setOpenPath: t,
50
- renderLinks: h,
51
- buttonRefs: m
52
- }) {
53
- var b;
54
- const r = d === e, _ = !!((b = n.sublinks) != null && b.length), c = v(null);
55
- return m.current.set(e, c.current), /* @__PURE__ */ l(
56
- "div",
57
- {
58
- className: `${o.linkWrapper} ${a ? "" : o.parent}`,
59
- children: [
60
- /* @__PURE__ */ s("div", { className: o.linkItem, children: n.href ? /* @__PURE__ */ l(
61
- "a",
62
- {
63
- href: n.href,
64
- className: o.link,
65
- target: n.isExternal ? "_blank" : "_self",
66
- rel: n.isExternal ? "noopener noreferrer" : void 0,
67
- onClick: () => {
68
- var u;
69
- t(null), (u = n.onClick) == null || u.call(n);
70
- },
71
- onMouseEnter: () => {
72
- a || t(null);
73
- },
74
- role: "menuitem",
75
- children: [
76
- n.label,
77
- n.isExternal && /* @__PURE__ */ s(g, { className: o.newTabIcon, size: 16 })
78
- ]
79
- }
80
- ) : /* @__PURE__ */ l(
81
- "button",
82
- {
83
- ref: c,
84
- "aria-haspopup": _ ? "true" : void 0,
85
- "aria-expanded": r,
86
- className: `${o.sublinkToggle} ${r ? o.open : ""}`,
87
- onClick: () => i(e),
88
- onMouseEnter: () => {
89
- p(e), t(e);
90
- },
91
- children: [
92
- n.label,
93
- _ && /* @__PURE__ */ s(k, { size: 18, className: o.chevron })
94
- ]
95
- }
96
- ) }),
97
- _ && /* @__PURE__ */ s(
98
- "div",
99
- {
100
- className: `${o.sublinks} ${r ? o.show : ""}`,
101
- onMouseLeave: () => i(e),
102
- role: "menu",
103
- "aria-label": `${n.label} submenu`,
104
- children: /* @__PURE__ */ s("div", { children: /* @__PURE__ */ s("div", { className: o.sublinksInner, children: /* @__PURE__ */ s("div", { className: o.sublinksColumn, children: h(n.sublinks, e) }) }) })
105
- }
106
- )
107
- ]
108
- },
109
- e
110
- );
111
- }
112
- export {
113
- tn as N,
114
- o as s
115
- };
@@ -1 +0,0 @@
1
- "use strict";require('./assets/NavLink.css');const o=require("react/jsx-runtime"),p=require("react"),k=require("./external-link-DDShu-48.cjs"),g=require("./chevron-down-DfK1XBl3.cjs"),m="_navbar_1bon6_5",w="_sticky_1bon6_19",x="_left_1bon6_34",f="_container_1bon6_35",I="_logo_1bon6_39",C="_nav_1bon6_5",N="_center_1bon6_54",j="_hidden_1bon6_60",$="_visible_1bon6_67",T="_right_1bon6_82",S="_title_1bon6_89",W="_linkWrapper_1bon6_99",E="_parent_1bon6_99",q="_linkItem_1bon6_107",y="_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="_open_1bon6_500",J="_sublinks_1bon6_486",K="_show_1bon6_571",Q="_sublinksInner_1bon6_629",U="_sublinksColumn_1bon6_647",V="_chevron_1bon6_657",X="_advanced_1bon6_839",Y="_withSpotlight_1bon6_890",Z="_withoutSpotlight_1bon6_894",O="_searchWrapper_1bon6_940",e={navbar:m,sticky:w,left:x,container:f,logo:I,nav:C,center:N,hidden:j,visible:$,right:T,title:S,linkWrapper:W,parent:E,linkItem:q,link:y,sublinkToggle:L,standard:M,triangle:R,transparent:z,twoColumn:D,navInner:A,grid:B,separator:F,newTabIcon:G,open:H,sublinks:J,show:K,sublinksInner:Q,sublinksColumn:U,chevron:V,default:"_default_1bon6_773",advanced:X,withSpotlight:Y,withoutSpotlight:Z,searchWrapper:O};function P({link:n,path:s,parentPath:i,openPath:u,togglePath:l,updateTriangleIndicator:d,setOpenPath:t,renderLinks:h,buttonRefs:v}){var c;const r=u===s,_=!!((c=n.sublinks)!=null&&c.length),a=p.useRef(null);return v.current.set(s,a.current),o.jsxs("div",{className:`${e.linkWrapper} ${i?"":e.parent}`,children:[o.jsx("div",{className:e.linkItem,children:n.href?o.jsxs("a",{href:n.href,className:e.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&&o.jsx(k.ExternalLink,{className:e.newTabIcon,size:16})]}):o.jsxs("button",{ref:a,"aria-haspopup":_?"true":void 0,"aria-expanded":r,className:`${e.sublinkToggle} ${r?e.open:""}`,onClick:()=>l(s),onMouseEnter:()=>{d(s),t(s)},children:[n.label,_&&o.jsx(g.ChevronDown,{size:18,className:e.chevron})]})}),_&&o.jsx("div",{className:`${e.sublinks} ${r?e.show:""}`,onMouseLeave:()=>l(s),role:"menu","aria-label":`${n.label} submenu`,children:o.jsx("div",{children:o.jsx("div",{className:e.sublinksInner,children:o.jsx("div",{className:e.sublinksColumn,children:h(n.sublinks,s)})})})})]},s)}exports.NavLink=P;exports.styles=e;