quirk-ui 0.0.259 → 0.0.261

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/dist/components/Footer/index.js +7 -7
  2. package/dist/components/NavBar/index.js +69 -78
  3. package/package.json +1 -1
package/dist/components/Footer/index.js CHANGED
@@ -3,13 +3,13 @@ import { CallToAction as T } from "../CallToAction/index.js";
3
3
  import { ButtonGroup as C } from "../ButtonGroup/index.js";
4
4
  import p from "react";
5
5
  import { E } from "../../external-link-BOPobeQJ.js";
6
- import '../../assets/index45.css';var k = {
6
+ import '../../assets/index45.css';var x = {
7
7
  color: void 0,
8
8
  size: void 0,
9
9
  className: void 0,
10
10
  style: void 0,
11
11
  attr: void 0
12
- }, j = p.createContext && /* @__PURE__ */ p.createContext(k), V = ["attr", "size", "title"];
12
+ }, j = p.createContext && /* @__PURE__ */ p.createContext(x), V = ["attr", "size", "title"];
13
13
  function $(e, t) {
14
14
  if (e == null) return {};
15
15
  var r = F(e, t), a, l;
@@ -78,15 +78,15 @@ function B(e, t) {
78
78
  }
79
79
  return (t === "string" ? String : Number)(e);
80
80
  }
81
- function x(e) {
81
+ function k(e) {
82
82
  return e && e.map((t, r) => /* @__PURE__ */ p.createElement(t.tag, v({
83
83
  key: r
84
- }, t.attr), x(t.child)));
84
+ }, t.attr), k(t.child)));
85
85
  }
86
86
  function d(e) {
87
87
  return (t) => /* @__PURE__ */ p.createElement(D, h({
88
88
  attr: v({}, e.attr)
89
- }, t), x(e.child));
89
+ }, t), k(e.child));
90
90
  }
91
91
  function D(e) {
92
92
  var t = (r) => {
@@ -109,7 +109,7 @@ function D(e) {
109
109
  xmlns: "http://www.w3.org/2000/svg"
110
110
  }), u && /* @__PURE__ */ p.createElement("title", null, u), e.children);
111
111
  };
112
- return j !== void 0 ? /* @__PURE__ */ p.createElement(j.Consumer, null, (r) => t(r)) : t(k);
112
+ return j !== void 0 ? /* @__PURE__ */ p.createElement(j.Consumer, null, (r) => t(r)) : t(x);
113
113
  }
114
114
  function H(e) {
115
115
  return d({ attr: { viewBox: "0 0 512 512" }, child: [{ tag: "path", attr: { d: "M512 256C512 114.6 397.4 0 256 0S0 114.6 0 256C0 376 82.7 476.8 194.2 504.5V334.2H141.4V256h52.8V222.3c0-87.1 39.4-127.5 125-127.5c16.2 0 44.2 3.2 55.7 6.4V172c-6-.6-16.5-1-29.6-1c-42 0-58.2 15.9-58.2 57.2V256h83.6l-14.4 78.2H287V510.1C413.8 494.8 512 386.9 512 256h0z" }, child: [] }] })(e);
@@ -168,7 +168,7 @@ function fe({
168
168
  href: c.href,
169
169
  target: c.isExternal ? "_blank" : "_self",
170
170
  rel: c.isExternal ? "noopener noreferrer" : void 0,
171
- role: "link",
171
+ role: "menuitem",
172
172
  "aria-label": c.label
173
173
  } : {
174
174
  role: "menuitem",
package/dist/components/NavBar/index.js CHANGED
@@ -1,4 +1,4 @@
1
- import { jsx as a, jsxs as o, Fragment as Ne } from "react/jsx-runtime";
1
+ import { jsx as a, jsxs as t, Fragment as Ne } from "react/jsx-runtime";
2
2
  import { useState as h, useEffect as S, useRef as _, useCallback as T } from "react";
3
3
  import { s as e, N as $e } from "../../NavLink-D0Fy2_Mj.js";
4
4
  import { Modal as ge } from "../Modal/index.js";
@@ -48,19 +48,19 @@ function Xe({
48
48
  title: ee,
49
49
  logo: F,
50
50
  items: A,
51
- groups: m,
51
+ groups: b,
52
52
  utilityItems: s,
53
53
  isSticky: ne = !1,
54
54
  showSearch: W = !0,
55
55
  alignment: C = "right",
56
56
  variant: ae = "standard",
57
- navigationType: k = "default",
57
+ navigationType: v = "default",
58
58
  searchComponent: le,
59
59
  className: se
60
60
  }) {
61
- const [f, B] = h(!1), [D, b] = h(null), [ie, re] = h(0), [oe, te] = h(!1), [ce, de] = h(null), [t, N] = h([]), [$, x] = h(
61
+ const [f, B] = h(!1), [D, m] = h(null), [ie, re] = h(0), [te, oe] = h(!1), [ce, de] = h(null), [o, k] = h([]), [N, x] = h(
62
62
  0
63
- ), [he, O] = h(null), [g, fe] = h(!1), [w, L] = h("forward"), j = () => /* @__PURE__ */ a(
63
+ ), [he, O] = h(null), [$, fe] = h(!1), [g, L] = h("forward"), j = () => /* @__PURE__ */ a(
64
64
  "div",
65
65
  {
66
66
  className: `${e.linkWrapper} ${e.parent} ${e.searchWrapper}`,
@@ -92,10 +92,10 @@ function Xe({
92
92
  return n(), window.addEventListener("resize", n), () => window.removeEventListener("resize", n);
93
93
  }
94
94
  }, []);
95
- const be = () => {
96
- N([]);
97
- }, me = (n) => {
98
- L("forward"), N([
95
+ const me = () => {
96
+ k([]);
97
+ }, be = (n) => {
98
+ L("forward"), k([
99
99
  {
100
100
  title: n.title,
101
101
  primary: n.primaryItems ?? [],
@@ -104,7 +104,7 @@ function Xe({
104
104
  }
105
105
  ]);
106
106
  }, G = (n) => {
107
- L("forward"), N((l) => [
107
+ L("forward"), k((l) => [
108
108
  ...l,
109
109
  {
110
110
  title: n.label,
@@ -114,7 +114,7 @@ function Xe({
114
114
  }
115
115
  ]);
116
116
  }, ue = () => {
117
- L("backward"), N((n) => n.slice(0, -1));
117
+ L("backward"), k((n) => n.slice(0, -1));
118
118
  }, M = _(null), p = _(null), E = _(/* @__PURE__ */ new Map()), pe = () => {
119
119
  B((n) => !n);
120
120
  }, X = (n) => {
@@ -124,15 +124,15 @@ function Xe({
124
124
  de(i);
125
125
  }
126
126
  }, ve = (n) => {
127
- b((l) => l === n ? null : n);
127
+ m((l) => l === n ? null : n);
128
128
  }, q = T((n) => {
129
- M.current && !M.current.contains(n.target) && b(null);
129
+ M.current && !M.current.contains(n.target) && m(null);
130
130
  }, []), U = T(() => {
131
- V(), typeof window < "u" && window.innerWidth > 768 && (B(!1), b(null), typeof document < "u" && (document.body.style.overflow = ""));
131
+ V(), typeof window < "u" && window.innerWidth > 768 && (B(!1), m(null), typeof document < "u" && (document.body.style.overflow = ""));
132
132
  }, []), V = T(() => {
133
133
  if (p.current) {
134
134
  const n = p.current.getBoundingClientRect().width;
135
- re(n), te(!0);
135
+ re(n), oe(!0);
136
136
  }
137
137
  }, []);
138
138
  S(() => {
@@ -148,19 +148,19 @@ function Xe({
148
148
  }, [f]);
149
149
  const ke = (n) => n.map((l, c) => {
150
150
  var H, I, J, K, Q;
151
- const d = `group-${c}`, v = he === c, i = (H = l.primaryItems) == null ? void 0 : H[$ ?? 0];
152
- return /* @__PURE__ */ o(
151
+ const d = `group-${c}`, y = he === c, i = (H = l.primaryItems) == null ? void 0 : H[N ?? 0];
152
+ return /* @__PURE__ */ t(
153
153
  "div",
154
154
  {
155
155
  className: `${e.linkWrapper} ${e.parent}`,
156
156
  onMouseEnter: () => {
157
- O(c), b(d), X(d);
157
+ O(c), m(d), X(d);
158
158
  },
159
159
  onMouseLeave: () => {
160
- O(null), x(0), b(null);
160
+ O(null), x(0), m(null);
161
161
  },
162
162
  children: [
163
- /* @__PURE__ */ a("div", { className: e.linkItem, children: /* @__PURE__ */ o(
163
+ /* @__PURE__ */ a("div", { className: e.linkItem, children: /* @__PURE__ */ t(
164
164
  "button",
165
165
  {
166
166
  ref: (r) => {
@@ -168,21 +168,12 @@ function Xe({
168
168
  },
169
169
  role: "menuitem",
170
170
  "aria-haspopup": "true",
171
- "aria-expanded": v,
171
+ "aria-expanded": y,
172
172
  "aria-controls": `submenu-${c}`,
173
- className: `${e.sublinkToggle} ${v ? e.open : ""} `,
173
+ className: `${e.sublinkToggle} ${y ? e.open : ""} `,
174
174
  children: [
175
175
  l.title,
176
- /* @__PURE__ */ a(
177
- ye,
178
- {
179
- size: 18,
180
- className: e.chevron,
181
- "aria-haspopup": "true",
182
- "aria-expanded": v,
183
- "aria-controls": `submenu-${c}`
184
- }
185
- )
176
+ /* @__PURE__ */ a(ye, { size: 18, className: e.chevron })
186
177
  ]
187
178
  }
188
179
  ) }),
@@ -190,36 +181,36 @@ function Xe({
190
181
  "div",
191
182
  {
192
183
  id: `submenu-${c}`,
193
- className: `${e.sublinks} ${v ? e.show : ""}`,
184
+ className: `${e.sublinks} ${y ? e.show : ""}`,
194
185
  role: "menu",
195
186
  "aria-label": `${l.title} submenu`,
196
- children: /* @__PURE__ */ a("div", { children: /* @__PURE__ */ o(
187
+ children: /* @__PURE__ */ a("div", { children: /* @__PURE__ */ t(
197
188
  "div",
198
189
  {
199
190
  className: `${e.sublinksInner} ${l.spotlight ? e.withSpotlight : e.withoutSpotlight}`,
200
191
  children: [
201
- /* @__PURE__ */ o(
192
+ /* @__PURE__ */ t(
202
193
  "div",
203
194
  {
204
195
  className: `${e.sublinksColumn} ${e.primaryColumn}`,
205
196
  children: [
206
197
  /* @__PURE__ */ a("div", { className: e.linkItem }),
207
198
  (I = l.primaryItems) == null ? void 0 : I.map(
208
- (r, u) => r.href ? /* @__PURE__ */ o(
199
+ (r, u) => r.href ? /* @__PURE__ */ t(
209
200
  "a",
210
201
  {
211
202
  href: r.href,
212
- className: `${e.link} ${$ === u ? e.open : ""}`,
203
+ className: `${e.link} ${N === u ? e.open : ""}`,
213
204
  target: r.isExternal ? "_blank" : "_self",
214
205
  rel: r.isExternal ? "noopener noreferrer" : void 0,
215
206
  onClick: () => {
216
207
  var Y;
217
- b(null), (Y = r.onClick) == null || Y.call(r);
208
+ m(null), (Y = r.onClick) == null || Y.call(r);
218
209
  },
219
210
  onMouseEnter: () => r.sublinks ? x(u) : null,
220
- role: "link",
211
+ role: "menuitem",
221
212
  children: [
222
- /* @__PURE__ */ o("span", { className: e.linkContent, children: [
213
+ /* @__PURE__ */ t("span", { className: e.linkContent, children: [
223
214
  r.label,
224
215
  r.subtitle && /* @__PURE__ */ a("span", { className: e.subtitle, children: r.subtitle })
225
216
  ] }),
@@ -236,9 +227,9 @@ function Xe({
236
227
  ) : /* @__PURE__ */ a(
237
228
  "button",
238
229
  {
239
- className: `${e.sublinkToggle} ${$ === u ? e.open : ""}`,
230
+ className: `${e.sublinkToggle} ${N === u ? e.open : ""}`,
240
231
  onMouseEnter: () => x(u),
241
- children: /* @__PURE__ */ o("span", { className: e.linkContent, children: [
232
+ children: /* @__PURE__ */ t("span", { className: e.linkContent, children: [
242
233
  r.label,
243
234
  r.subtitle && /* @__PURE__ */ a("span", { className: e.subtitle, children: r.subtitle })
244
235
  ] })
@@ -249,15 +240,15 @@ function Xe({
249
240
  ]
250
241
  }
251
242
  ),
252
- (i == null ? void 0 : i.sublinks) && ((J = i == null ? void 0 : i.sublinks) == null ? void 0 : J.length) > 0 && /* @__PURE__ */ o(
243
+ (i == null ? void 0 : i.sublinks) && ((J = i == null ? void 0 : i.sublinks) == null ? void 0 : J.length) > 0 && /* @__PURE__ */ t(
253
244
  "div",
254
245
  {
255
246
  className: `${e.sublinksColumn} ${e.childrenColumn} ${e.fadeInFromLeft}`,
256
247
  children: [
257
248
  (i == null ? void 0 : i.description) && /* @__PURE__ */ a("div", { className: e.sublinksDescription, children: i == null ? void 0 : i.description }),
258
- (i == null ? void 0 : i.sublinks) && y(
249
+ (i == null ? void 0 : i.sublinks) && w(
259
250
  i.sublinks,
260
- `${d}-${$}`
251
+ `${d}-${N}`
261
252
  )
262
253
  ]
263
254
  },
@@ -267,7 +258,7 @@ function Xe({
267
258
  "div",
268
259
  {
269
260
  className: `${e.sublinksColumn} ${e.secondaryColumn}`,
270
- children: y(l.secondaryItems, `${d}-secondary`)
261
+ children: w(l.secondaryItems, `${d}-secondary`)
271
262
  }
272
263
  ),
273
264
  l.spotlight && /* @__PURE__ */ a(
@@ -286,7 +277,7 @@ function Xe({
286
277
  },
287
278
  c
288
279
  );
289
- }), y = (n, l = "") => n.map((c) => {
280
+ }), w = (n, l = "") => n.map((c) => {
290
281
  const d = `${l}/${c.label}`;
291
282
  return /* @__PURE__ */ a(
292
283
  $e,
@@ -297,8 +288,8 @@ function Xe({
297
288
  openPath: D,
298
289
  togglePath: ve,
299
290
  updateTriangleIndicator: X,
300
- setOpenPath: b,
301
- renderLinks: y,
291
+ setOpenPath: m,
292
+ renderLinks: w,
302
293
  buttonRefs: E
303
294
  },
304
295
  d
@@ -308,10 +299,10 @@ function Xe({
308
299
  "header",
309
300
  {
310
301
  ref: M,
311
- className: `${se ?? ""} ${Te[C]} ${_e[ae]} ${e.navbar} ${ne ? e.sticky : ""} ${m && m.length ? e.advanced : e.default}`,
302
+ className: `${se ?? ""} ${Te[C]} ${_e[ae]} ${e.navbar} ${ne ? e.sticky : ""} ${b && b.length ? e.advanced : e.default}`,
312
303
  role: "navigation",
313
304
  "aria-label": "Main navigation",
314
- children: /* @__PURE__ */ o(
305
+ children: /* @__PURE__ */ t(
315
306
  "div",
316
307
  {
317
308
  className: `${e.container} ${(!s || s.length === 0) && C !== "center" ? e.twoColumn : ""}`,
@@ -324,11 +315,11 @@ function Xe({
324
315
  style: {
325
316
  left: C === "center" ? `calc(50% - ${ie / 2}px)` : "0"
326
317
  },
327
- className: `${e.nav} ${f ? e.open : ""} ${oe ? e.visible : e.hidden}`,
318
+ className: `${e.nav} ${f ? e.open : ""} ${te ? e.visible : e.hidden}`,
328
319
  id: "main-menu",
329
320
  role: "menubar",
330
321
  "aria-label": "Main navigation",
331
- children: /* @__PURE__ */ o("div", { className: e.navInner, children: [
322
+ children: /* @__PURE__ */ t("div", { className: e.navInner, children: [
332
323
  /* @__PURE__ */ a(
333
324
  "svg",
334
325
  {
@@ -349,30 +340,30 @@ function Xe({
349
340
  )
350
341
  }
351
342
  ),
352
- k === "default" && A && /* @__PURE__ */ a("div", { className: e.grid, children: y(A) }),
353
- !g && k === "advanced" && m && /* @__PURE__ */ o("div", { className: e.grid, children: [
354
- ke(m),
355
- W && /* @__PURE__ */ o(Ne, { children: [
343
+ v === "default" && A && /* @__PURE__ */ a("div", { className: e.grid, children: w(A) }),
344
+ !$ && v === "advanced" && b && /* @__PURE__ */ t("div", { className: e.grid, children: [
345
+ ke(b),
346
+ W && /* @__PURE__ */ t(Ne, { children: [
356
347
  /* @__PURE__ */ a("span", { className: e.separator }),
357
348
  /* @__PURE__ */ a(j, {})
358
349
  ] })
359
350
  ] }),
360
- g && k === "advanced" && f && t.length === 0 && m && /* @__PURE__ */ a("div", { className: `${e.mobileMenu}`, children: m.map((n, l) => /* @__PURE__ */ a(
351
+ $ && v === "advanced" && f && o.length === 0 && b && /* @__PURE__ */ a("div", { className: `${e.mobileMenu}`, children: b.map((n, l) => /* @__PURE__ */ a(
361
352
  "div",
362
353
  {
363
- className: `${e.mobileMenuItem} ${w === "forward" ? e.fadeInFromLeft : e.fadeInFromRight}`,
354
+ className: `${e.mobileMenuItem} ${g === "forward" ? e.fadeInFromLeft : e.fadeInFromRight}`,
364
355
  children: /* @__PURE__ */ a(
365
356
  "button",
366
357
  {
367
358
  className: e.sublinkToggle,
368
- onClick: () => me(n),
359
+ onClick: () => be(n),
369
360
  children: n.title
370
361
  }
371
362
  )
372
363
  },
373
364
  n._key ?? l
374
365
  )) }),
375
- g && k === "advanced" && f && t.length > 0 && /* @__PURE__ */ o(
366
+ $ && v === "advanced" && f && o.length > 0 && /* @__PURE__ */ t(
376
367
  "div",
377
368
  {
378
369
  className: `${e.mobileMenuSlide} `,
@@ -381,7 +372,7 @@ function Xe({
381
372
  "button",
382
373
  {
383
374
  className: e.back,
384
- onClick: t.length === 1 ? be : ue,
375
+ onClick: o.length === 1 ? me : ue,
385
376
  children: /* @__PURE__ */ a(
386
377
  xe,
387
378
  {
@@ -392,37 +383,37 @@ function Xe({
392
383
  )
393
384
  }
394
385
  ),
395
- t[t.length - 1].description && /* @__PURE__ */ a(
386
+ o[o.length - 1].description && /* @__PURE__ */ a(
396
387
  "div",
397
388
  {
398
- className: `${e.sublinksDescription} ${w === "forward" ? e.fadeInFromLeft : e.fadeInFromRight}`,
399
- children: t[t.length - 1].description
389
+ className: `${e.sublinksDescription} ${g === "forward" ? e.fadeInFromLeft : e.fadeInFromRight}`,
390
+ children: o[o.length - 1].description
400
391
  }
401
392
  ),
402
- t[t.length - 1].primary.map((n, l) => /* @__PURE__ */ a(
393
+ o[o.length - 1].primary.map((n, l) => /* @__PURE__ */ a(
403
394
  "div",
404
395
  {
405
- className: `${e.mobileMenuItem} ${w === "forward" ? e.fadeInFromLeft : e.fadeInFromRight}`,
396
+ className: `${e.mobileMenuItem} ${g === "forward" ? e.fadeInFromLeft : e.fadeInFromRight}`,
406
397
  children: n.sublinks ? /* @__PURE__ */ a(
407
398
  "button",
408
399
  {
409
400
  className: e.sublinkToggle,
410
401
  onClick: () => G(n),
411
- children: /* @__PURE__ */ o("span", { className: e.linkContent, children: [
402
+ children: /* @__PURE__ */ t("span", { className: e.linkContent, children: [
412
403
  n.label,
413
404
  n.subtitle && /* @__PURE__ */ a("span", { className: e.subtitle, children: n.subtitle })
414
405
  ] })
415
406
  }
416
- ) : /* @__PURE__ */ o(
407
+ ) : /* @__PURE__ */ t(
417
408
  "a",
418
409
  {
419
410
  href: n.href,
420
411
  className: e.link,
421
412
  target: n.isExternal ? "_blank" : "_self",
422
413
  rel: n.isExternal ? "noopener noreferrer" : void 0,
423
- role: "link",
414
+ role: "menuitem",
424
415
  children: [
425
- /* @__PURE__ */ o("span", { className: e.linkContent, children: [
416
+ /* @__PURE__ */ t("span", { className: e.linkContent, children: [
426
417
  n.label,
427
418
  n.subtitle && /* @__PURE__ */ a("span", { className: e.subtitle, children: n.subtitle })
428
419
  ] }),
@@ -439,12 +430,12 @@ function Xe({
439
430
  },
440
431
  n._key ?? `primary-${l}`
441
432
  )),
442
- t[t.length - 1].secondary.length > 0 && /* @__PURE__ */ a("hr", { className: e.groupDivider }),
443
- t[t.length - 1].secondary.map(
433
+ o[o.length - 1].secondary.length > 0 && /* @__PURE__ */ a("hr", { className: e.groupDivider }),
434
+ o[o.length - 1].secondary.map(
444
435
  (n, l) => /* @__PURE__ */ a(
445
436
  "div",
446
437
  {
447
- className: `${e.mobileMenuItem} ${w === "forward" ? e.fadeInFromLeft : e.fadeInFromRight}`,
438
+ className: `${e.mobileMenuItem} ${g === "forward" ? e.fadeInFromLeft : e.fadeInFromRight}`,
448
439
  children: n.sublinks ? /* @__PURE__ */ a(
449
440
  "button",
450
441
  {
@@ -452,14 +443,14 @@ function Xe({
452
443
  onClick: () => G(n),
453
444
  children: n.label
454
445
  }
455
- ) : /* @__PURE__ */ o(
446
+ ) : /* @__PURE__ */ t(
456
447
  "a",
457
448
  {
458
449
  href: n.href,
459
450
  className: e.link,
460
451
  target: n.isExternal ? "_blank" : "_self",
461
452
  rel: n.isExternal ? "noopener noreferrer" : void 0,
462
- role: "link",
453
+ role: "menuitem",
463
454
  children: [
464
455
  n.label,
465
456
  n.isExternal && /* @__PURE__ */ a(
@@ -478,7 +469,7 @@ function Xe({
478
469
  )
479
470
  ]
480
471
  },
481
- `stack-${t.length}`
472
+ `stack-${o.length}`
482
473
  )
483
474
  ] })
484
475
  }
@@ -531,7 +522,7 @@ function Xe({
531
522
  ) })
532
523
  }
533
524
  ),
534
- g && W && /* @__PURE__ */ a(j, {}),
525
+ $ && W && /* @__PURE__ */ a(j, {}),
535
526
  /* @__PURE__ */ a(
536
527
  "button",
537
528
  {
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "quirk-ui",
3
3
  "private": false,
4
- "version": "0.0.259",
4
+ "version": "0.0.261",
5
5
  "type": "module",
6
6
  "exports": {
7
7
  ".": {