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