highsoft-ui 1.0.88 → 1.0.89

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 (9) hide show
  1. package/dist/components/Header/index.js +375 -325
  2. package/dist/components/Notification/index.d.ts +3 -1
  3. package/dist/components/Notification/index.js +71 -51
  4. package/dist/components/ThemeLoader/index.d.ts +2 -0
  5. package/dist/components/ThemeLoader/index.js +29 -0
  6. package/dist/highsoft-ui.css +1 -1
  7. package/dist/main.d.ts +1 -0
  8. package/dist/main.js +18 -15
  9. package/package.json +1 -1
package/dist/components/Header/index.js CHANGED
@@ -1,26 +1,26 @@
1
- import { jsx as t, jsxs as i, Fragment as J } from "react/jsx-runtime";
2
- import { useRef as R, useState as H, useEffect as G } from "react";
3
- import { a as S, b as U, J as $, c as D } from "../../utils-BKDJp1i0.js";
4
- import { A as F } from "../../Announcement03-obPaH4LK.js";
5
- import { _ as u } from "../../extends-hS2Bh-Yp.js";
6
- import { X as K } from "../../XClose-CCu1vrNS.js";
1
+ import { jsx as e, jsxs as c, Fragment as F } from "react/jsx-runtime";
2
+ import { useRef as R, useState as E, useEffect as S } from "react";
3
+ import { a as q, b as Y, J, c as X, z as Z } from "../../utils-BKDJp1i0.js";
4
+ import { A as ee } from "../../Announcement03-obPaH4LK.js";
5
+ import { _ as p } from "../../extends-hS2Bh-Yp.js";
6
+ import { X as te } from "../../XClose-CCu1vrNS.js";
7
7
  import { c as C } from "../../clsx-OuTLNxxd.js";
8
- import { Button as m } from "../Button/index.js";
9
- import { Container as V } from "../Container/index.js";
10
- import { Logo as T } from "../Logo/index.js";
11
- import { NewTag as Y } from "../NewTag/index.js";
12
- import { Notification as X } from "../Notification/index.js";
13
- import { Search as I } from "../Search/index.js";
14
- import { PrefPanel as P } from "../PrefPanel/index.js";
15
- var Z = function(n) {
16
- return /* @__PURE__ */ t("svg", u({
8
+ import { Button as u } from "../Button/index.js";
9
+ import { Container as U } from "../Container/index.js";
10
+ import { Logo as I } from "../Logo/index.js";
11
+ import { NewTag as ne } from "../NewTag/index.js";
12
+ import { Notification as oe } from "../Notification/index.js";
13
+ import { Search as H } from "../Search/index.js";
14
+ import { PrefPanel as O } from "../PrefPanel/index.js";
15
+ var re = function(n) {
16
+ return /* @__PURE__ */ e("svg", p({
17
17
  xmlns: "http://www.w3.org/2000/svg",
18
18
  width: 24,
19
19
  height: 24,
20
20
  fill: "none",
21
21
  viewBox: "0 0 24 24"
22
22
  }, n, {
23
- children: /* @__PURE__ */ t("path", {
23
+ children: /* @__PURE__ */ e("path", {
24
24
  stroke: "currentColor",
25
25
  strokeLinecap: "round",
26
26
  strokeLinejoin: "round",
@@ -28,15 +28,15 @@ var Z = function(n) {
28
28
  d: "M6 11v4m12-6v4m-1-9c2.4487 0 3.7731.3748 4.4321.6654.0878.0388.1317.0581.2583.179.0759.0724.2145.285.2501.3837.0595.1646.0595.2546.0595.4346v10.7484c0 .9088 0 1.3632-.1363 1.5968-.1386.2375-.2723.348-.5318.4393-.255.0897-.7699-.0092-1.7997-.2071A13.45 13.45 0 0 0 17 18c-3 0-6 2-10 2-2.4487 0-3.7731-.3748-4.4321-.6654-.0878-.0388-.1317-.0581-.2583-.179-.076-.0724-.2145-.285-.2501-.3837C2 18.6073 2 18.5173 2 18.3373V7.5889c0-.9088 0-1.3632.1363-1.5968.1386-.2375.2723-.348.5318-.4393.255-.0898.77.0092 1.7997.207A13.44 13.44 0 0 0 7 6c3 0 6-2 10-2m-2.5 8c0 1.3807-1.1193 2.5-2.5 2.5S9.5 13.3807 9.5 12s1.1193-2.5 2.5-2.5 2.5 1.1193 2.5 2.5"
29
29
  })
30
30
  }));
31
- }, tt = function(n) {
32
- return /* @__PURE__ */ t("svg", u({
31
+ }, se = function(n) {
32
+ return /* @__PURE__ */ e("svg", p({
33
33
  xmlns: "http://www.w3.org/2000/svg",
34
34
  width: 24,
35
35
  height: 24,
36
36
  fill: "none",
37
37
  viewBox: "0 0 24 24"
38
38
  }, n, {
39
- children: /* @__PURE__ */ t("path", {
39
+ children: /* @__PURE__ */ e("path", {
40
40
  stroke: "currentColor",
41
41
  strokeLinecap: "round",
42
42
  strokeLinejoin: "round",
@@ -44,15 +44,15 @@ var Z = function(n) {
44
44
  d: "M11 3H7.8c-1.6802 0-2.5202 0-3.162.327a3 3 0 0 0-1.311 1.311C3 5.2798 3 6.1198 3 7.8v8.4c0 1.6802 0 2.5202.327 3.162a3 3 0 0 0 1.311 1.311C5.2798 21 6.1198 21 7.8 21h8.4c1.6802 0 2.5202 0 3.162-.327a3 3 0 0 0 1.311-1.311C21 18.7202 21 17.8802 21 16.2V13m-9-5h4v4m-.5-8.5V2m3.9393 2.5607L20.5 3.5m.0103 5h1.5M3 13.3471c.652.1007 1.3199.1529 2 .1529 4.3864 0 8.2653-2.1724 10.6197-5.5"
45
45
  })
46
46
  }));
47
- }, et = function(n) {
48
- return /* @__PURE__ */ t("svg", u({
47
+ }, ie = function(n) {
48
+ return /* @__PURE__ */ e("svg", p({
49
49
  xmlns: "http://www.w3.org/2000/svg",
50
50
  width: 24,
51
51
  height: 24,
52
52
  fill: "none",
53
53
  viewBox: "0 0 24 24"
54
54
  }, n, {
55
- children: /* @__PURE__ */ t("path", {
55
+ children: /* @__PURE__ */ e("path", {
56
56
  stroke: "currentColor",
57
57
  strokeLinecap: "round",
58
58
  strokeLinejoin: "round",
@@ -60,15 +60,15 @@ var Z = function(n) {
60
60
  d: "M14 2.2695v4.1306c0 .56 0 .84.109 1.054a1 1 0 0 0 .437.437C14.7599 8 15.0399 8 15.6 8h4.1305M16 13H8m8 4H8m2-8H8m6-7H8.8c-1.6802 0-2.5202 0-3.162.327a3 3 0 0 0-1.311 1.311C4 4.2798 4 5.1198 4 6.8v10.4c0 1.6802 0 2.5202.327 3.162a3 3 0 0 0 1.311 1.311C6.2798 22 7.1198 22 8.8 22h6.4c1.6802 0 2.5202 0 3.162-.327a3 3 0 0 0 1.311-1.311C20 19.7202 20 18.8802 20 17.2V8z"
61
61
  })
62
62
  }));
63
- }, nt = function(n) {
64
- return /* @__PURE__ */ t("svg", u({
63
+ }, ce = function(n) {
64
+ return /* @__PURE__ */ e("svg", p({
65
65
  xmlns: "http://www.w3.org/2000/svg",
66
66
  width: 24,
67
67
  height: 24,
68
68
  fill: "none",
69
69
  viewBox: "0 0 24 24"
70
70
  }, n, {
71
- children: /* @__PURE__ */ t("path", {
71
+ children: /* @__PURE__ */ e("path", {
72
72
  stroke: "currentColor",
73
73
  strokeLinecap: "round",
74
74
  strokeLinejoin: "round",
@@ -76,15 +76,15 @@ var Z = function(n) {
76
76
  d: "M3 12h12M3 6h18M3 18h18"
77
77
  })
78
78
  }));
79
- }, ot = function(n) {
80
- return /* @__PURE__ */ t("svg", u({
79
+ }, ae = function(n) {
80
+ return /* @__PURE__ */ e("svg", p({
81
81
  xmlns: "http://www.w3.org/2000/svg",
82
82
  width: 24,
83
83
  height: 24,
84
84
  fill: "none",
85
85
  viewBox: "0 0 24 24"
86
86
  }, n, {
87
- children: /* @__PURE__ */ t("path", {
87
+ children: /* @__PURE__ */ e("path", {
88
88
  stroke: "currentColor",
89
89
  strokeLinecap: "round",
90
90
  strokeLinejoin: "round",
@@ -92,15 +92,15 @@ var Z = function(n) {
92
92
  d: "M10 8.0022a2.2485 2.2485 0 0 1 2.501-1.4698 2.248 2.248 0 0 1 1.8682 2.2193c0 1.4989-2.2483 2.2483-2.2483 2.2483m.029 3h.01M7 18v2.3355c0 .5329 0 .7993.1092.9361a.5.5 0 0 0 .3913.1881c.1751-.0002.3832-.1666.7993-.4995l2.3854-1.9084c.4873-.3898.731-.5847 1.0023-.7233a3 3 0 0 1 .7617-.2672C12.7477 18 13.0597 18 13.6837 18H16.2c1.6802 0 2.5202 0 3.162-.327a3 3 0 0 0 1.311-1.311C21 15.7202 21 14.8802 21 13.2V7.8c0-1.6802 0-2.5202-.327-3.162a3 3 0 0 0-1.311-1.311C18.7202 3 17.8802 3 16.2 3H7.8c-1.6802 0-2.5202 0-3.162.327a3 3 0 0 0-1.311 1.311C3 5.2798 3 6.1198 3 7.8V14c0 .93 0 1.395.1022 1.7765a3 3 0 0 0 2.1213 2.1213C5.605 18 6.07 18 7 18"
93
93
  })
94
94
  }));
95
- }, rt = function(n) {
96
- return /* @__PURE__ */ t("svg", u({
95
+ }, le = function(n) {
96
+ return /* @__PURE__ */ e("svg", p({
97
97
  xmlns: "http://www.w3.org/2000/svg",
98
98
  width: 24,
99
99
  height: 24,
100
100
  fill: "none",
101
101
  viewBox: "0 0 24 24"
102
102
  }, n, {
103
- children: /* @__PURE__ */ t("path", {
103
+ children: /* @__PURE__ */ e("path", {
104
104
  stroke: "currentColor",
105
105
  strokeLinecap: "round",
106
106
  strokeLinejoin: "round",
@@ -109,14 +109,14 @@ var Z = function(n) {
109
109
  })
110
110
  }));
111
111
  }, W = function(n) {
112
- return /* @__PURE__ */ t("svg", u({
112
+ return /* @__PURE__ */ e("svg", p({
113
113
  xmlns: "http://www.w3.org/2000/svg",
114
114
  width: 24,
115
115
  height: 24,
116
116
  fill: "none",
117
117
  viewBox: "0 0 24 24"
118
118
  }, n, {
119
- children: /* @__PURE__ */ t("path", {
119
+ children: /* @__PURE__ */ e("path", {
120
120
  stroke: "currentColor",
121
121
  strokeLinecap: "round",
122
122
  strokeLinejoin: "round",
@@ -124,15 +124,15 @@ var Z = function(n) {
124
124
  d: "M4.5 22v-5m0-10V2M2 4.5h5m-5 15h5M13 3l-1.7342 4.5089c-.282.7332-.423 1.0998-.6423 1.4082a3 3 0 0 1-.7064.7064c-.3084.2193-.675.3603-1.4082.6423L4 12l4.5089 1.7342c.7332.282 1.0998.423 1.4082.6423.2733.1943.5121.4331.7064.7064.2193.3084.3603.675.6423 1.4082L13 21l1.7342-4.5089c.282-.7332.423-1.0998.6423-1.4082a3 3 0 0 1 .7064-.7064c.3084-.2193.675-.3603 1.4082-.6423L22 12l-4.5089-1.7342c-.7332-.282-1.0998-.423-1.4082-.6423a3 3 0 0 1-.7064-.7064c-.2193-.3084-.3603-.675-.6423-1.4082z"
125
125
  })
126
126
  }));
127
- }, j = function(n) {
128
- return /* @__PURE__ */ t("svg", u({
127
+ }, $ = function(n) {
128
+ return /* @__PURE__ */ e("svg", p({
129
129
  xmlns: "http://www.w3.org/2000/svg",
130
130
  width: 24,
131
131
  height: 24,
132
132
  fill: "none",
133
133
  viewBox: "0 0 24 24"
134
134
  }, n, {
135
- children: /* @__PURE__ */ t("path", {
135
+ children: /* @__PURE__ */ e("path", {
136
136
  stroke: "currentColor",
137
137
  strokeLinecap: "round",
138
138
  strokeLinejoin: "round",
@@ -140,15 +140,15 @@ var Z = function(n) {
140
140
  d: "m7 15 3-3-3-3m6 6h4m-9.2 6h8.4c1.6802 0 2.5202 0 3.162-.327a3 3 0 0 0 1.311-1.311C21 18.7202 21 17.8802 21 16.2V7.8c0-1.6802 0-2.5202-.327-3.162a3 3 0 0 0-1.311-1.311C18.7202 3 17.8802 3 16.2 3H7.8c-1.6802 0-2.5202 0-3.162.327a3 3 0 0 0-1.311 1.311C3 5.2798 3 6.1198 3 7.8v8.4c0 1.6802 0 2.5202.327 3.162a3 3 0 0 0 1.311 1.311C5.2798 21 6.1198 21 7.8 21"
141
141
  })
142
142
  }));
143
- }, E = function(n) {
144
- return /* @__PURE__ */ t("svg", u({
143
+ }, j = function(n) {
144
+ return /* @__PURE__ */ e("svg", p({
145
145
  xmlns: "http://www.w3.org/2000/svg",
146
146
  width: 24,
147
147
  height: 24,
148
148
  fill: "none",
149
149
  viewBox: "0 0 24 24"
150
150
  }, n, {
151
- children: /* @__PURE__ */ t("path", {
151
+ children: /* @__PURE__ */ e("path", {
152
152
  stroke: "currentColor",
153
153
  strokeLinecap: "round",
154
154
  strokeLinejoin: "round",
@@ -157,388 +157,438 @@ var Z = function(n) {
157
157
  })
158
158
  }));
159
159
  };
160
- const st = "m_QBtq_buttons", it = "m_QBtq_container", ct = "m_QBtq_gpt", at = "m_QBtq_header", lt = "m_QBtq_icon", ht = "m_QBtq_icons", dt = "m_QBtq_links", mt = "m_QBtq_logo", ut = "m_QBtq_main", pt = "m_QBtq_menu", wt = "m_QBtq_mobile", gt = "m_QBtq_mobileOverlay", ft = "m_QBtq_open", vt = "m_QBtq_outer", kt = "m_QBtq_selectableIcon", Ct = "m_QBtq_selected", _t = "m_QBtq_selectedIcon", bt = "m_QBtq_skip", xt = "m_QBtq_sub", Bt = "m_QBtq_subContainer", Nt = "m_QBtq_subTitle", e = {
161
- buttons: st,
162
- container: it,
163
- gpt: ct,
164
- header: at,
165
- icon: lt,
166
- icons: ht,
167
- links: dt,
168
- logo: mt,
169
- main: ut,
170
- menu: pt,
171
- mobile: wt,
172
- mobileOverlay: gt,
173
- open: ft,
174
- outer: vt,
175
- selectableIcon: kt,
176
- selected: Ct,
177
- selectedIcon: _t,
178
- skip: bt,
179
- sub: xt,
180
- subContainer: Bt,
181
- subTitle: Nt
182
- }, O = [
160
+ const he = "m_QBtq_buttons", de = "m_QBtq_container", me = "m_QBtq_gpt", ue = "m_QBtq_header", pe = "m_QBtq_icon", we = "m_QBtq_icons", fe = "m_QBtq_links", ge = "m_QBtq_logo", ve = "m_QBtq_main", ke = "m_QBtq_menu", Ce = "m_QBtq_mobile", _e = "m_QBtq_mobileOverlay", xe = "m_QBtq_open", be = "m_QBtq_outer", Be = "m_QBtq_selectableIcon", Ne = "m_QBtq_selected", ye = "m_QBtq_selectedIcon", qe = "m_QBtq_skip", Se = "m_QBtq_sub", Me = "m_QBtq_subContainer", Te = "m_QBtq_subTitle", o = {
161
+ buttons: he,
162
+ container: de,
163
+ gpt: me,
164
+ header: ue,
165
+ icon: pe,
166
+ icons: we,
167
+ links: fe,
168
+ logo: ge,
169
+ main: ve,
170
+ menu: ke,
171
+ mobile: Ce,
172
+ mobileOverlay: _e,
173
+ open: xe,
174
+ outer: be,
175
+ selectableIcon: Be,
176
+ selected: Ne,
177
+ selectedIcon: ye,
178
+ skip: qe,
179
+ sub: Se,
180
+ subContainer: Me,
181
+ subTitle: Te
182
+ }, D = "notifications", G = "theme", Qe = 365 * 20, Le = (t) => /^\d{1,3}(?:\.\d{1,3}){3}$/.test(t), Ee = () => {
183
+ if (typeof window > "u") return;
184
+ const t = window.location.hostname;
185
+ if (!t || t === "localhost" || Le(t))
186
+ return;
187
+ const n = t.replace(/^www\./, ""), h = n.split(".");
188
+ return h.length <= 2 ? `.${n}` : `.${h.slice(-2).join(".")}`;
189
+ }, P = () => {
190
+ if (typeof document > "u") return null;
191
+ const t = document.cookie.split("; ").find((n) => n.startsWith(`${D}=`));
192
+ if (!t) return null;
193
+ try {
194
+ return JSON.parse(decodeURIComponent(t.split("=")[1]));
195
+ } catch {
196
+ return null;
197
+ }
198
+ }, Ie = () => {
199
+ if (typeof document > "u") return null;
200
+ const t = document.cookie.split("; ").find((n) => n.startsWith(`${G}=`));
201
+ if (!t) return null;
202
+ try {
203
+ return decodeURIComponent(t.split("=")[1]);
204
+ } catch {
205
+ return null;
206
+ }
207
+ }, V = (t, n) => {
208
+ if (typeof document > "u") return;
209
+ const h = new Date(
210
+ Date.now() + Qe * 24 * 60 * 60 * 1e3
211
+ ).toUTCString(), s = Ee(), a = [
212
+ `${t}=${encodeURIComponent(n)}`,
213
+ "path=/",
214
+ "SameSite=Lax",
215
+ `expires=${h}`
216
+ ];
217
+ s && a.push(`domain=${s}`), document.cookie = a.join("; ");
218
+ }, A = [
183
219
  {
184
220
  title: "Products",
185
221
  url: "https://www.highcharts.com/products/",
186
- icon: /* @__PURE__ */ t(tt, {})
222
+ icon: /* @__PURE__ */ e(se, {})
187
223
  },
188
224
  {
189
225
  title: "Demos",
190
226
  url: "https://www.highcharts.com/demo",
191
- icon: /* @__PURE__ */ t(rt, {})
227
+ icon: /* @__PURE__ */ e(le, {})
192
228
  },
193
229
  {
194
230
  title: "Support",
195
231
  url: "https://www.highcharts.com/support/",
196
- icon: /* @__PURE__ */ t(ot, {})
232
+ icon: /* @__PURE__ */ e(ae, {})
197
233
  },
198
234
  {
199
235
  title: "Resources",
200
236
  url: "https://www.highcharts.com/resources/",
201
- icon: /* @__PURE__ */ t(et, {})
237
+ icon: /* @__PURE__ */ e(ie, {})
202
238
  },
203
239
  {
204
240
  title: "Pricing",
205
241
  url: "https://shop.highcharts.com/",
206
- icon: /* @__PURE__ */ t(Z, {})
242
+ icon: /* @__PURE__ */ e(re, {})
207
243
  },
208
244
  {
209
245
  title: "Blog",
210
246
  url: "https://www.highcharts.com/blog/home/",
211
- icon: /* @__PURE__ */ t(F, {})
247
+ icon: /* @__PURE__ */ e(ee, {})
212
248
  }
213
249
  ];
214
- function d(c, n) {
215
- return n ? c.replace(n, "") : c;
250
+ function m(t, n) {
251
+ return n ? t.replace(n, "") : t;
216
252
  }
217
- function qt({
218
- items: c,
253
+ function He({
254
+ items: t,
219
255
  link: n = "a",
220
- host: f = "https://www.highcharts.com",
221
- pathname: l
256
+ host: h = "https://www.highcharts.com",
257
+ pathname: s
222
258
  }) {
223
- const h = D();
224
- return /* @__PURE__ */ t("div", { className: C(e.sub, e.outer), children: /* @__PURE__ */ t(V, { className: e.subContainer, as: "ul", children: c.map(
225
- ({ title: N, url: v, icon: _, selectedIcon: b, tag: q, tagVariant: g = "success" }, p) => {
226
- const x = typeof window < "u" && window.location.origin || "http://example.com", w = new URL(v, x), k = (!!l || h) && w.origin === x && w.pathname === (l || typeof window < "u" && window.location.pathname);
227
- return /* @__PURE__ */ t("li", { children: /* @__PURE__ */ i(
259
+ const a = X();
260
+ return /* @__PURE__ */ e("div", { className: C(o.sub, o.outer), children: /* @__PURE__ */ e(U, { className: o.subContainer, as: "ul", children: t.map(
261
+ ({ title: N, url: v, icon: _, selectedIcon: x, tag: y, tagVariant: g = "success" }, w) => {
262
+ const b = typeof window < "u" && window.location.origin || "http://example.com", f = new URL(v, b), k = (!!s || a) && f.origin === b && f.pathname === (s || typeof window < "u" && window.location.pathname);
263
+ return /* @__PURE__ */ e("li", { children: /* @__PURE__ */ c(
228
264
  n,
229
265
  {
230
- href: d(v, f),
266
+ href: m(v, h),
231
267
  className: C({
232
- [e.selectableIcon]: b,
233
- [e.selected]: k
268
+ [o.selectableIcon]: x,
269
+ [o.selected]: k
234
270
  }),
235
271
  children: [
236
- /* @__PURE__ */ i("span", { className: e.icons, children: [
237
- /* @__PURE__ */ t("span", { className: e.selectedIcon, children: b }),
238
- /* @__PURE__ */ t("span", { className: e.icon, children: _ })
272
+ /* @__PURE__ */ c("span", { className: o.icons, children: [
273
+ /* @__PURE__ */ e("span", { className: o.selectedIcon, children: x }),
274
+ /* @__PURE__ */ e("span", { className: o.icon, children: _ })
239
275
  ] }),
240
- /* @__PURE__ */ i("span", { className: e.subTitle, children: [
276
+ /* @__PURE__ */ c("span", { className: o.subTitle, children: [
241
277
  N,
242
- q && /* @__PURE__ */ t(Y, { variant: g, icon: !1 })
278
+ y && /* @__PURE__ */ e(ne, { variant: g, icon: !1 })
243
279
  ] })
244
280
  ]
245
281
  }
246
- ) }, p);
282
+ ) }, w);
247
283
  }
248
284
  ) }) });
249
285
  }
250
- const St = [
286
+ const Oe = [
251
287
  {
252
288
  id: "whats-new",
253
289
  content: [
254
290
  {
255
291
  title: "Grid Pro",
256
292
  description: "50% off through 2025",
257
- url: "https://www.highcharts.com/products/grid/"
293
+ url: "https://www.highcharts.com/products/grid/",
294
+ tag: "new"
258
295
  },
259
296
  {
260
297
  title: "React",
261
298
  description: "Our improved React integration",
262
- url: "https://www.highcharts.com/blog/news/how-to-migrate-to-the-new-highcharts-for-react/"
299
+ url: "https://www.highcharts.com/blog/news/how-to-migrate-to-the-new-highcharts-for-react/",
300
+ tag: "new"
263
301
  },
264
302
  {
265
303
  title: "Highcharts on Discord",
266
304
  description: "Join our server",
267
- url: "https://discord.com/invite/xHxxcyyy6K"
305
+ url: "https://discord.com/invite/xHxxcyyy6K",
306
+ tag: "new"
268
307
  }
269
308
  ]
270
309
  }
271
310
  ];
272
- function At({
273
- subItems: c,
311
+ function We() {
312
+ const { theme: t, setTheme: n } = Z(), h = R(!1);
313
+ return S(() => {
314
+ if (h.current) return;
315
+ const s = Ie();
316
+ if (s && s !== t) {
317
+ n(s), h.current = !0;
318
+ return;
319
+ }
320
+ h.current = !0;
321
+ }, [n, t]), S(() => {
322
+ t && V(G, t);
323
+ }, [t]), null;
324
+ }
325
+ function Xe({
326
+ subItems: t,
274
327
  children: n,
275
- notifications: f = St,
328
+ notifications: h = Oe,
276
329
  // TODO: Fetch these from the internets
277
- link: l = "a",
278
- host: h = "https://www.highcharts.com",
330
+ link: s = "a",
331
+ host: a = "https://www.highcharts.com",
279
332
  pathname: N,
280
333
  cssVariable: v
281
334
  }) {
282
- const _ = S("(max-width: 374px)"), b = S("(max-width: 849px)"), q = S("(min-width: 850px) and (max-width: 999px)"), g = R(null), [p, x] = H(!1), [w, k] = H([]);
283
- G(() => {
284
- let o = window.scrollY;
285
- const r = 82 + w.length * 48 + (c?.length ? 72 : 0), s = -(82 + w.length * 48);
286
- let a = s, B = a;
287
- g.current && (g.current.style.top = `${a}px`), v && document.documentElement.style.setProperty(
335
+ const _ = q("(max-width: 374px)"), x = q("(max-width: 849px)"), y = q("(min-width: 850px) and (max-width: 999px)"), g = R(null), [w, b] = E(!1), [f, k] = E([]);
336
+ S(() => {
337
+ let r = window.scrollY;
338
+ const i = 82 + f.length * 48 + (t?.length ? 72 : 0), d = -(82 + f.length * 48);
339
+ let l = d, B = l;
340
+ g.current && (g.current.style.top = `${l}px`), v && document.documentElement.style.setProperty(
288
341
  "--header-bottom",
289
- `${r + a}px`
342
+ `${i + l}px`
290
343
  );
291
344
  const Q = () => {
292
- const L = window.scrollY, A = L - o;
293
- a -= A, a < s ? a = s : a > 0 && (a = 0), g.current && a !== B && (g.current.style.top = `${a}px`, v && document.documentElement.style.setProperty(
345
+ const L = window.scrollY, K = L - r;
346
+ l -= K, l < d ? l = d : l > 0 && (l = 0), g.current && l !== B && (g.current.style.top = `${l}px`, v && document.documentElement.style.setProperty(
294
347
  "--header-bottom",
295
- `${r + a}px`
296
- )), o = L, B = a;
348
+ `${i + l}px`
349
+ )), r = L, B = l;
297
350
  };
298
351
  return window.addEventListener("scroll", Q), () => window.removeEventListener("scroll", Q);
299
- }, [v, w.length]), U(() => {
300
- if (f.length) {
301
- const o = localStorage.getItem("notifications");
302
- if (o) {
303
- const r = JSON.parse(o);
304
- k(
305
- f.filter(
306
- (s) => !s.id || !r.closed.includes(s.id)
307
- )
308
- );
309
- } else
310
- k(f);
311
- }
312
- }, [f]);
313
- const y = (o) => {
314
- if (o.preventDefault(), !(o.nativeEvent instanceof KeyboardEvent) || o.nativeEvent.code === "Enter" || o.nativeEvent.code === "Space") {
315
- const r = document.querySelector("main");
316
- r && (r.scrollIntoView(), r.getAttribute("tabindex") !== "-1" && r.setAttribute("tabindex", "-1"), r.focus());
352
+ }, [v, f.length]), Y(() => {
353
+ if (!h.length) return;
354
+ const r = P();
355
+ k(
356
+ r ? h.filter(
357
+ (i) => !i.id || !r.closed.includes(i.id)
358
+ ) : h
359
+ );
360
+ }, [a, h]);
361
+ const M = (r) => {
362
+ if (r.preventDefault(), !(r.nativeEvent instanceof KeyboardEvent) || r.nativeEvent.code === "Enter" || r.nativeEvent.code === "Space") {
363
+ const i = document.querySelector("main");
364
+ i && (i.scrollIntoView(), i.getAttribute("tabindex") !== "-1" && i.setAttribute("tabindex", "-1"), i.focus());
317
365
  }
318
- }, M = () => {
319
- x(!p);
320
- }, z = (o) => {
321
- k(w.filter((s) => !s.id || s.id !== o));
322
- const r = localStorage.getItem("notifications");
323
- if (r) {
324
- const s = JSON.parse(r);
325
- s.closed.includes(o) || (s.closed.push(o), localStorage.setItem("notifications", JSON.stringify(s)));
326
- } else
327
- localStorage.setItem(
328
- "notifications",
329
- JSON.stringify({
330
- closed: [o]
331
- })
332
- );
366
+ }, T = () => {
367
+ b(!w);
368
+ }, z = (r) => {
369
+ if (k(f.filter((d) => !d.id || d.id !== r)), !r) return;
370
+ const i = P() ?? {
371
+ closed: []
372
+ };
373
+ i.closed.includes(r) || V(
374
+ D,
375
+ JSON.stringify({
376
+ closed: [...i.closed, r]
377
+ })
378
+ );
333
379
  };
334
- return /* @__PURE__ */ t($, { children: /* @__PURE__ */ i("header", { className: e.header, ref: g, children: [
335
- w?.map(({ id: o, content: r, variant: s, closable: a }, B) => /* @__PURE__ */ t(
336
- X,
337
- {
338
- content: r,
339
- variant: s,
340
- closable: a,
341
- onClose: () => z(o)
342
- },
343
- B
344
- )),
345
- /* @__PURE__ */ t("div", { className: C(e.main, e.outer), children: /* @__PURE__ */ i(V, { as: "nav", className: e.container, children: [
346
- /* @__PURE__ */ t(
347
- m,
380
+ return /* @__PURE__ */ c(J, { children: [
381
+ /* @__PURE__ */ e(We, {}),
382
+ /* @__PURE__ */ c("header", { className: o.header, ref: g, children: [
383
+ f?.map(({ id: r, content: i, variant: d, closable: l }, B) => /* @__PURE__ */ e(
384
+ oe,
348
385
  {
349
- as: "a",
350
- className: e.skip,
351
- size: 500,
352
- tabIndex: "0",
353
- onClick: y,
354
- onKeyPress: y,
355
- children: "Skip to content"
356
- }
357
- ),
358
- /* @__PURE__ */ t(
359
- l,
360
- {
361
- className: e.logo,
362
- href: d("https://www.highcharts.com/", h),
363
- children: /* @__PURE__ */ t(T, { showText: !q && !_ })
364
- }
365
- ),
366
- /* @__PURE__ */ t("ul", { className: e.links, children: O.map(({ title: o, url: r }, s) => /* @__PURE__ */ t("li", { children: /* @__PURE__ */ t(
367
- m,
368
- {
369
- variant: "plain",
370
- size: 300,
371
- as: l,
372
- href: d(r, h),
373
- children: o
374
- }
375
- ) }, s)) }),
376
- /* @__PURE__ */ i("div", { className: e.buttons, children: [
377
- /* @__PURE__ */ i(
378
- m,
386
+ id: r,
387
+ content: i,
388
+ variant: d,
389
+ closable: l,
390
+ onClose: () => z(r)
391
+ },
392
+ B
393
+ )),
394
+ /* @__PURE__ */ e("div", { className: C(o.main, o.outer), children: /* @__PURE__ */ c(U, { as: "nav", className: o.container, children: [
395
+ /* @__PURE__ */ e(
396
+ u,
379
397
  {
380
- variant: "transparent",
381
- as: l,
382
- href: d(
383
- "https://www.highcharts.com/chat/gpt/",
384
- h
385
- ),
386
- children: [
387
- /* @__PURE__ */ t("span", { className: e.gpt, children: "Highcharts GPT" }),
388
- /* @__PURE__ */ t(W, {})
389
- ]
398
+ as: "a",
399
+ className: o.skip,
400
+ size: 500,
401
+ tabIndex: "0",
402
+ onClick: M,
403
+ onKeyPress: M,
404
+ children: "Skip to content"
390
405
  }
391
406
  ),
392
- /* @__PURE__ */ t(I, {}),
393
- /* @__PURE__ */ t(P, {}),
394
- /* @__PURE__ */ t(
395
- m,
407
+ /* @__PURE__ */ e(
408
+ s,
396
409
  {
397
- variant: "brand",
398
- as: l,
399
- href: d("https://shop.highcharts.com/account", h),
400
- "aria-label": "Login",
401
- children: /* @__PURE__ */ t(E, {})
410
+ className: o.logo,
411
+ href: m("https://www.highcharts.com/", a),
412
+ children: /* @__PURE__ */ e(I, { showText: !y && !_ })
402
413
  }
403
414
  ),
404
- /* @__PURE__ */ i(
405
- m,
415
+ /* @__PURE__ */ e("ul", { className: o.links, children: A.map(({ title: r, url: i }, d) => /* @__PURE__ */ e("li", { children: /* @__PURE__ */ e(
416
+ u,
406
417
  {
407
- variant: "success",
408
- as: l,
409
- href: d(
410
- "https://www.highcharts.com/download/",
411
- h
412
- ),
413
- children: [
414
- /* @__PURE__ */ t(j, {}),
415
- "Get started"
416
- ]
418
+ variant: "plain",
419
+ size: 300,
420
+ as: s,
421
+ href: m(i, a),
422
+ children: r
417
423
  }
418
- ),
419
- /* @__PURE__ */ i(
420
- m,
421
- {
422
- variant: p ? "white" : "transparent",
423
- className: e.menu,
424
- onClick: M,
425
- children: [
426
- p ? "Close" : "Menu",
427
- p ? /* @__PURE__ */ t(K, {}) : /* @__PURE__ */ t(nt, {})
428
- ]
429
- }
430
- )
431
- ] })
432
- ] }) }),
433
- !!c?.length && /* @__PURE__ */ t(
434
- qt,
435
- {
436
- items: c,
437
- link: l,
438
- host: h,
439
- pathname: N
440
- }
441
- ),
442
- n,
443
- b && /* @__PURE__ */ i(J, { children: [
444
- /* @__PURE__ */ t(
445
- "div",
424
+ ) }, d)) }),
425
+ /* @__PURE__ */ c("div", { className: o.buttons, children: [
426
+ /* @__PURE__ */ c(
427
+ u,
428
+ {
429
+ variant: "transparent",
430
+ as: s,
431
+ href: m(
432
+ "https://www.highcharts.com/chat/gpt/",
433
+ a
434
+ ),
435
+ children: [
436
+ /* @__PURE__ */ e("span", { className: o.gpt, children: "Highcharts GPT" }),
437
+ /* @__PURE__ */ e(W, {})
438
+ ]
439
+ }
440
+ ),
441
+ /* @__PURE__ */ e(H, {}),
442
+ /* @__PURE__ */ e(O, {}),
443
+ /* @__PURE__ */ e(
444
+ u,
445
+ {
446
+ variant: "brand",
447
+ as: s,
448
+ href: m("https://shop.highcharts.com/account", a),
449
+ "aria-label": "Login",
450
+ children: /* @__PURE__ */ e(j, {})
451
+ }
452
+ ),
453
+ /* @__PURE__ */ c(
454
+ u,
455
+ {
456
+ variant: "success",
457
+ as: s,
458
+ href: m(
459
+ "https://www.highcharts.com/download/",
460
+ a
461
+ ),
462
+ children: [
463
+ /* @__PURE__ */ e($, {}),
464
+ "Get started"
465
+ ]
466
+ }
467
+ ),
468
+ /* @__PURE__ */ c(
469
+ u,
470
+ {
471
+ variant: w ? "white" : "transparent",
472
+ className: o.menu,
473
+ onClick: T,
474
+ children: [
475
+ w ? "Close" : "Menu",
476
+ w ? /* @__PURE__ */ e(te, {}) : /* @__PURE__ */ e(ce, {})
477
+ ]
478
+ }
479
+ )
480
+ ] })
481
+ ] }) }),
482
+ !!t?.length && /* @__PURE__ */ e(
483
+ He,
446
484
  {
447
- className: C(e.mobileOverlay, { [e.open]: p }),
448
- onClick: M
485
+ items: t,
486
+ link: s,
487
+ host: a,
488
+ pathname: N
449
489
  }
450
490
  ),
451
- /* @__PURE__ */ i(
452
- "nav",
453
- {
454
- className: C(e.mobile, {
455
- [e.open]: p
456
- }),
457
- children: [
458
- /* @__PURE__ */ i("div", { className: e.container, children: [
459
- /* @__PURE__ */ t(
460
- l,
461
- {
462
- className: e.logo,
463
- href: d("https://www.highcharts.com/", h),
464
- children: /* @__PURE__ */ t(T, { showText: !_ })
465
- }
466
- ),
467
- /* @__PURE__ */ i("div", { className: e.buttons, children: [
468
- /* @__PURE__ */ i(
469
- m,
491
+ n,
492
+ x && /* @__PURE__ */ c(F, { children: [
493
+ /* @__PURE__ */ e(
494
+ "div",
495
+ {
496
+ className: C(o.mobileOverlay, { [o.open]: w }),
497
+ onClick: T
498
+ }
499
+ ),
500
+ /* @__PURE__ */ c(
501
+ "nav",
502
+ {
503
+ className: C(o.mobile, {
504
+ [o.open]: w
505
+ }),
506
+ children: [
507
+ /* @__PURE__ */ c("div", { className: o.container, children: [
508
+ /* @__PURE__ */ e(
509
+ s,
510
+ {
511
+ className: o.logo,
512
+ href: m("https://www.highcharts.com/", a),
513
+ children: /* @__PURE__ */ e(I, { showText: !_ })
514
+ }
515
+ ),
516
+ /* @__PURE__ */ c("div", { className: o.buttons, children: [
517
+ /* @__PURE__ */ c(
518
+ u,
519
+ {
520
+ variant: "transparent",
521
+ as: s,
522
+ href: m(
523
+ "https://www.highcharts.com/chat/gpt/",
524
+ a
525
+ ),
526
+ children: [
527
+ /* @__PURE__ */ e("span", { className: o.gpt, children: "Highcharts GPT" }),
528
+ /* @__PURE__ */ e(W, {})
529
+ ]
530
+ }
531
+ ),
532
+ /* @__PURE__ */ e(H, {}),
533
+ /* @__PURE__ */ e(O, {})
534
+ ] })
535
+ ] }),
536
+ /* @__PURE__ */ c("div", { className: o.buttons, children: [
537
+ /* @__PURE__ */ c(
538
+ u,
470
539
  {
471
- variant: "transparent",
472
- as: l,
473
- href: d(
474
- "https://www.highcharts.com/chat/gpt/",
475
- h
540
+ variant: "brand",
541
+ fullWidth: !0,
542
+ as: s,
543
+ href: m(
544
+ "https://shop.highcharts.com/account",
545
+ a
476
546
  ),
477
547
  children: [
478
- /* @__PURE__ */ t("span", { className: e.gpt, children: "Highcharts GPT" }),
479
- /* @__PURE__ */ t(W, {})
548
+ /* @__PURE__ */ e(j, {}),
549
+ "Login"
480
550
  ]
481
551
  }
482
552
  ),
483
- /* @__PURE__ */ t(I, {}),
484
- /* @__PURE__ */ t(P, {})
485
- ] })
486
- ] }),
487
- /* @__PURE__ */ i("div", { className: e.buttons, children: [
488
- /* @__PURE__ */ i(
489
- m,
490
- {
491
- variant: "brand",
492
- fullWidth: !0,
493
- as: l,
494
- href: d(
495
- "https://shop.highcharts.com/account",
496
- h
497
- ),
498
- children: [
499
- /* @__PURE__ */ t(E, {}),
500
- "Login"
501
- ]
502
- }
503
- ),
504
- /* @__PURE__ */ i(
505
- m,
553
+ /* @__PURE__ */ c(
554
+ u,
555
+ {
556
+ variant: "success",
557
+ fullWidth: !0,
558
+ as: s,
559
+ href: m(
560
+ "https://www.highcharts.com/download/",
561
+ a
562
+ ),
563
+ children: [
564
+ /* @__PURE__ */ e($, {}),
565
+ "Get started"
566
+ ]
567
+ }
568
+ )
569
+ ] }),
570
+ /* @__PURE__ */ e("ul", { className: o.links, children: A.map(({ title: r, url: i, icon: d }, l) => /* @__PURE__ */ e("li", { children: /* @__PURE__ */ c(
571
+ u,
506
572
  {
507
- variant: "success",
573
+ variant: "plain",
574
+ size: 500,
508
575
  fullWidth: !0,
509
- as: l,
510
- href: d(
511
- "https://www.highcharts.com/download/",
512
- h
513
- ),
576
+ as: s,
577
+ href: m(i, a),
514
578
  children: [
515
- /* @__PURE__ */ t(j, {}),
516
- "Get started"
579
+ d,
580
+ r
517
581
  ]
518
582
  }
519
- )
520
- ] }),
521
- /* @__PURE__ */ t("ul", { className: e.links, children: O.map(({ title: o, url: r, icon: s }, a) => /* @__PURE__ */ t("li", { children: /* @__PURE__ */ i(
522
- m,
523
- {
524
- variant: "plain",
525
- size: 500,
526
- fullWidth: !0,
527
- as: l,
528
- href: d(r, h),
529
- children: [
530
- s,
531
- o
532
- ]
533
- }
534
- ) }, a)) })
535
- ]
536
- }
537
- )
583
+ ) }, l)) })
584
+ ]
585
+ }
586
+ )
587
+ ] })
538
588
  ] })
539
- ] }) });
589
+ ] });
540
590
  }
541
591
  export {
542
- At as Header,
543
- qt as SubHeader
592
+ Xe as Header,
593
+ He as SubHeader
544
594
  };