highsoft-ui 1.0.84 → 1.0.86

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.
@@ -1,5 +1,5 @@
1
1
  import { ElementType, ReactNode } from 'react';
2
- import { NotificationVariant } from '../Notification';
2
+ import { NotificationItem, NotificationVariant } from '../Notification';
3
3
  export interface SubHeaderItem {
4
4
  title: string;
5
5
  url: string;
@@ -16,8 +16,7 @@ export declare function SubHeader({ items, link: Link, host, pathname }: {
16
16
  }): import("react/jsx-runtime").JSX.Element;
17
17
  export interface Notification {
18
18
  id?: string;
19
- title?: string;
20
- description?: string;
19
+ content: NotificationItem | Array<NotificationItem>;
21
20
  variant?: NotificationVariant;
22
21
  closable?: boolean;
23
22
  }
@@ -1,26 +1,26 @@
1
- import { jsx as e, jsxs as i, Fragment as U } from "react/jsx-runtime";
2
- import { useRef as $, useState as T, useEffect as H } from "react";
3
- import { a as M, J as G, b as R } from "../../utils-CT0G9Gzw.js";
4
- import { A as F } from "../../Announcement03-obPaH4LK.js";
1
+ import { jsx as t, jsxs as i, Fragment as R } from "react/jsx-runtime";
2
+ import { useRef as G, useState as H, useEffect as T } from "react";
3
+ import { a as S, J as U, b as $ } from "../../utils-CT0G9Gzw.js";
4
+ import { A as D } from "../../Announcement03-obPaH4LK.js";
5
5
  import { _ as u } from "../../extends-hS2Bh-Yp.js";
6
- import { X as Y } from "../../XClose-CCu1vrNS.js";
6
+ import { X as F } from "../../XClose-CCu1vrNS.js";
7
7
  import { c as C } from "../../clsx-OuTLNxxd.js";
8
8
  import { Button as m } from "../Button/index.js";
9
9
  import { Container as z } from "../Container/index.js";
10
10
  import { Logo as I } from "../Logo/index.js";
11
- import { NewTag as D } from "../NewTag/index.js";
12
- import { Notification as K } from "../Notification/index.js";
13
- import { Search as W } from "../Search/index.js";
14
- import { PrefPanel as j } from "../PrefPanel/index.js";
11
+ import { NewTag as K } from "../NewTag/index.js";
12
+ import { Notification as Y } from "../Notification/index.js";
13
+ import { Search as P } from "../Search/index.js";
14
+ import { PrefPanel as W } from "../PrefPanel/index.js";
15
15
  var X = function(n) {
16
- return /* @__PURE__ */ e("svg", u({
16
+ return /* @__PURE__ */ t("svg", u({
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__ */ e("path", {
23
+ children: /* @__PURE__ */ t("path", {
24
24
  stroke: "currentColor",
25
25
  strokeLinecap: "round",
26
26
  strokeLinejoin: "round",
@@ -29,14 +29,14 @@ var X = function(n) {
29
29
  })
30
30
  }));
31
31
  }, Z = function(n) {
32
- return /* @__PURE__ */ e("svg", u({
32
+ return /* @__PURE__ */ t("svg", u({
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__ */ e("path", {
39
+ children: /* @__PURE__ */ t("path", {
40
40
  stroke: "currentColor",
41
41
  strokeLinecap: "round",
42
42
  strokeLinejoin: "round",
@@ -44,15 +44,15 @@ var X = 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
- }, ee = function(n) {
48
- return /* @__PURE__ */ e("svg", u({
47
+ }, tt = function(n) {
48
+ return /* @__PURE__ */ t("svg", u({
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__ */ e("path", {
55
+ children: /* @__PURE__ */ t("path", {
56
56
  stroke: "currentColor",
57
57
  strokeLinecap: "round",
58
58
  strokeLinejoin: "round",
@@ -60,15 +60,15 @@ var X = 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
- }, te = function(n) {
64
- return /* @__PURE__ */ e("svg", u({
63
+ }, et = function(n) {
64
+ return /* @__PURE__ */ t("svg", u({
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__ */ e("path", {
71
+ children: /* @__PURE__ */ t("path", {
72
72
  stroke: "currentColor",
73
73
  strokeLinecap: "round",
74
74
  strokeLinejoin: "round",
@@ -76,15 +76,15 @@ var X = function(n) {
76
76
  d: "M3 12h12M3 6h18M3 18h18"
77
77
  })
78
78
  }));
79
- }, ne = function(n) {
80
- return /* @__PURE__ */ e("svg", u({
79
+ }, nt = function(n) {
80
+ return /* @__PURE__ */ t("svg", u({
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__ */ e("path", {
87
+ children: /* @__PURE__ */ t("path", {
88
88
  stroke: "currentColor",
89
89
  strokeLinecap: "round",
90
90
  strokeLinejoin: "round",
@@ -92,15 +92,15 @@ var X = 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
- }, oe = function(n) {
96
- return /* @__PURE__ */ e("svg", u({
95
+ }, ot = function(n) {
96
+ return /* @__PURE__ */ t("svg", u({
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__ */ e("path", {
103
+ children: /* @__PURE__ */ t("path", {
104
104
  stroke: "currentColor",
105
105
  strokeLinecap: "round",
106
106
  strokeLinejoin: "round",
@@ -108,15 +108,15 @@ var X = function(n) {
108
108
  d: "M12 16v5m6 0-3.9514-3.2928c-.7288-.6074-1.0932-.911-1.4999-1.0271a2 2 0 0 0-1.0974 0c-.4067.1161-.7711.4197-1.4999 1.0271L6 21m2-10v1m4-3v3m4-5v5m6-9H2m1 0h18v8.2c0 1.6802 0 2.5202-.327 3.162a3 3 0 0 1-1.311 1.311C18.7202 16 17.8802 16 16.2 16H7.8c-1.6802 0-2.5202 0-3.162-.327a3 3 0 0 1-1.311-1.311C3 13.7202 3 12.8802 3 11.2z"
109
109
  })
110
110
  }));
111
- }, P = function(n) {
112
- return /* @__PURE__ */ e("svg", u({
111
+ }, j = function(n) {
112
+ return /* @__PURE__ */ t("svg", u({
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__ */ e("path", {
119
+ children: /* @__PURE__ */ t("path", {
120
120
  stroke: "currentColor",
121
121
  strokeLinecap: "round",
122
122
  strokeLinejoin: "round",
@@ -124,15 +124,15 @@ var X = 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
- }, E = function(n) {
128
- return /* @__PURE__ */ e("svg", u({
127
+ }, O = function(n) {
128
+ return /* @__PURE__ */ t("svg", u({
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__ */ e("path", {
135
+ children: /* @__PURE__ */ t("path", {
136
136
  stroke: "currentColor",
137
137
  strokeLinecap: "round",
138
138
  strokeLinejoin: "round",
@@ -140,15 +140,15 @@ var X = 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
- }, O = function(n) {
144
- return /* @__PURE__ */ e("svg", u({
143
+ }, E = function(n) {
144
+ return /* @__PURE__ */ t("svg", u({
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__ */ e("path", {
151
+ children: /* @__PURE__ */ t("path", {
152
152
  stroke: "currentColor",
153
153
  strokeLinecap: "round",
154
154
  strokeLinejoin: "round",
@@ -157,89 +157,89 @@ var X = function(n) {
157
157
  })
158
158
  }));
159
159
  };
160
- const re = "m_QBtq_buttons", se = "m_QBtq_container", ie = "m_QBtq_gpt", ce = "m_QBtq_header", ae = "m_QBtq_icon", le = "m_QBtq_icons", he = "m_QBtq_links", de = "m_QBtq_logo", me = "m_QBtq_main", ue = "m_QBtq_menu", pe = "m_QBtq_mobile", we = "m_QBtq_mobileOverlay", ge = "m_QBtq_open", fe = "m_QBtq_outer", ve = "m_QBtq_selectableIcon", ke = "m_QBtq_selected", Ce = "m_QBtq_selectedIcon", _e = "m_QBtq_skip", be = "m_QBtq_sub", xe = "m_QBtq_subContainer", Be = "m_QBtq_subTitle", t = {
161
- buttons: re,
162
- container: se,
163
- gpt: ie,
164
- header: ce,
165
- icon: ae,
166
- icons: le,
167
- links: he,
168
- logo: de,
169
- main: me,
170
- menu: ue,
171
- mobile: pe,
172
- mobileOverlay: we,
173
- open: ge,
174
- outer: fe,
175
- selectableIcon: ve,
176
- selected: ke,
177
- selectedIcon: Ce,
178
- skip: _e,
179
- sub: be,
180
- subContainer: xe,
181
- subTitle: Be
160
+ const rt = "m_QBtq_buttons", st = "m_QBtq_container", it = "m_QBtq_gpt", ct = "m_QBtq_header", at = "m_QBtq_icon", lt = "m_QBtq_icons", ht = "m_QBtq_links", dt = "m_QBtq_logo", mt = "m_QBtq_main", ut = "m_QBtq_menu", pt = "m_QBtq_mobile", wt = "m_QBtq_mobileOverlay", gt = "m_QBtq_open", ft = "m_QBtq_outer", vt = "m_QBtq_selectableIcon", kt = "m_QBtq_selected", Ct = "m_QBtq_selectedIcon", _t = "m_QBtq_skip", bt = "m_QBtq_sub", xt = "m_QBtq_subContainer", Bt = "m_QBtq_subTitle", e = {
161
+ buttons: rt,
162
+ container: st,
163
+ gpt: it,
164
+ header: ct,
165
+ icon: at,
166
+ icons: lt,
167
+ links: ht,
168
+ logo: dt,
169
+ main: mt,
170
+ menu: ut,
171
+ mobile: pt,
172
+ mobileOverlay: wt,
173
+ open: gt,
174
+ outer: ft,
175
+ selectableIcon: vt,
176
+ selected: kt,
177
+ selectedIcon: Ct,
178
+ skip: _t,
179
+ sub: bt,
180
+ subContainer: xt,
181
+ subTitle: Bt
182
182
  }, V = [
183
183
  {
184
184
  title: "Products",
185
185
  url: "https://www.highcharts.com/products/",
186
- icon: /* @__PURE__ */ e(Z, {})
186
+ icon: /* @__PURE__ */ t(Z, {})
187
187
  },
188
188
  {
189
189
  title: "Demos",
190
190
  url: "https://www.highcharts.com/demo",
191
- icon: /* @__PURE__ */ e(oe, {})
191
+ icon: /* @__PURE__ */ t(ot, {})
192
192
  },
193
193
  {
194
194
  title: "Support",
195
195
  url: "https://www.highcharts.com/support/",
196
- icon: /* @__PURE__ */ e(ne, {})
196
+ icon: /* @__PURE__ */ t(nt, {})
197
197
  },
198
198
  {
199
199
  title: "Resources",
200
200
  url: "https://www.highcharts.com/resources/",
201
- icon: /* @__PURE__ */ e(ee, {})
201
+ icon: /* @__PURE__ */ t(tt, {})
202
202
  },
203
203
  {
204
204
  title: "Pricing",
205
205
  url: "https://shop.highcharts.com/",
206
- icon: /* @__PURE__ */ e(X, {})
206
+ icon: /* @__PURE__ */ t(X, {})
207
207
  },
208
208
  {
209
209
  title: "Blog",
210
210
  url: "https://www.highcharts.com/blog/home/",
211
- icon: /* @__PURE__ */ e(F, {})
211
+ icon: /* @__PURE__ */ t(D, {})
212
212
  }
213
213
  ];
214
214
  function d(c, n) {
215
215
  return n ? c.replace(n, "") : c;
216
216
  }
217
- function Ne({
217
+ function Nt({
218
218
  items: c,
219
219
  link: n = "a",
220
220
  host: f = "https://www.highcharts.com",
221
221
  pathname: l
222
222
  }) {
223
- const h = R();
224
- return /* @__PURE__ */ e("div", { className: C(t.sub, t.outer), children: /* @__PURE__ */ e(z, { className: t.subContainer, as: "ul", children: c.map(
225
- ({ title: q, url: v, icon: _, selectedIcon: b, tag: S, tagVariant: g = "success" }, p) => {
223
+ const h = $();
224
+ return /* @__PURE__ */ t("div", { className: C(e.sub, e.outer), children: /* @__PURE__ */ t(z, { className: e.subContainer, as: "ul", children: c.map(
225
+ ({ title: N, url: v, icon: _, selectedIcon: b, tag: q, tagVariant: g = "success" }, p) => {
226
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__ */ e("li", { children: /* @__PURE__ */ i(
227
+ return /* @__PURE__ */ t("li", { children: /* @__PURE__ */ i(
228
228
  n,
229
229
  {
230
230
  href: d(v, f),
231
231
  className: C({
232
- [t.selectableIcon]: b,
233
- [t.selected]: k
232
+ [e.selectableIcon]: b,
233
+ [e.selected]: k
234
234
  }),
235
235
  children: [
236
- /* @__PURE__ */ i("span", { className: t.icons, children: [
237
- /* @__PURE__ */ e("span", { className: t.selectedIcon, children: b }),
238
- /* @__PURE__ */ e("span", { className: t.icon, 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: _ })
239
239
  ] }),
240
- /* @__PURE__ */ i("span", { className: t.subTitle, children: [
241
- q,
242
- S && /* @__PURE__ */ e(D, { variant: g, icon: !1 })
240
+ /* @__PURE__ */ i("span", { className: e.subTitle, children: [
241
+ N,
242
+ q && /* @__PURE__ */ t(K, { variant: g, icon: !1 })
243
243
  ] })
244
244
  ]
245
245
  }
@@ -247,18 +247,39 @@ function Ne({
247
247
  }
248
248
  ) }) });
249
249
  }
250
- function Ve({
250
+ const qt = [
251
+ {
252
+ content: [
253
+ {
254
+ title: "Grid Pro",
255
+ description: "50% off through 2025",
256
+ url: "https://www.highcharts.com/products/grid/"
257
+ },
258
+ {
259
+ title: "React",
260
+ description: "Our improved React integration",
261
+ url: "https://www.highcharts.com/blog/news/how-to-migrate-to-the-new-highcharts-for-react/"
262
+ },
263
+ {
264
+ title: "Highcharts on Discord",
265
+ description: "Join our server",
266
+ url: "https://discord.com/invite/xHxxcyyy6K"
267
+ }
268
+ ]
269
+ }
270
+ ];
271
+ function zt({
251
272
  subItems: c,
252
273
  children: n,
253
- notifications: f = [],
274
+ notifications: f = qt,
254
275
  // TODO: Fetch these from the internets
255
276
  link: l = "a",
256
277
  host: h = "https://www.highcharts.com",
257
- pathname: q,
278
+ pathname: N,
258
279
  cssVariable: v
259
280
  }) {
260
- const _ = M("(max-width: 374px)"), b = M("(max-width: 849px)"), S = M("(min-width: 850px) and (max-width: 999px)"), g = $(null), [p, x] = T(!1), [w, k] = T([]);
261
- H(() => {
281
+ const _ = S("(max-width: 374px)"), b = S("(max-width: 849px)"), q = S("(min-width: 850px) and (max-width: 999px)"), g = G(null), [p, x] = H(!1), [w, k] = H([]);
282
+ T(() => {
262
283
  let o = window.scrollY;
263
284
  const r = 82 + w.length * 48 + (c?.length ? 72 : 0), s = -(82 + w.length * 48);
264
285
  let a = s, B = a;
@@ -266,15 +287,15 @@ function Ve({
266
287
  "--header-bottom",
267
288
  `${r + a}px`
268
289
  );
269
- const N = () => {
290
+ const Q = () => {
270
291
  const L = window.scrollY, J = L - o;
271
292
  a -= J, a < s ? a = s : a > 0 && (a = 0), g.current && a !== B && (g.current.style.top = `${a}px`, v && document.documentElement.style.setProperty(
272
293
  "--header-bottom",
273
294
  `${r + a}px`
274
295
  )), o = L, B = a;
275
296
  };
276
- return window.addEventListener("scroll", N), () => window.removeEventListener("scroll", N);
277
- }, [v, w.length]), H(() => {
297
+ return window.addEventListener("scroll", Q), () => window.removeEventListener("scroll", Q);
298
+ }, [v, w.length]), T(() => {
278
299
  if (f.length) {
279
300
  const o = localStorage.getItem("notifications");
280
301
  if (o) {
@@ -288,7 +309,7 @@ function Ve({
288
309
  k(f);
289
310
  }
290
311
  }, [f]);
291
- const Q = (o) => {
312
+ const M = (o) => {
292
313
  if (o.preventDefault(), !(o.nativeEvent instanceof KeyboardEvent) || o.nativeEvent.code === "Enter" || o.nativeEvent.code === "Space") {
293
314
  const r = document.querySelector("main");
294
315
  r && (r.scrollIntoView(), r.getAttribute("tabindex") !== "-1" && r.setAttribute("tabindex", "-1"), r.focus());
@@ -309,42 +330,39 @@ function Ve({
309
330
  })
310
331
  );
311
332
  };
312
- return /* @__PURE__ */ e(G, { children: /* @__PURE__ */ i("header", { className: t.header, ref: g, children: [
313
- w?.map(
314
- ({ id: o, title: r, description: s, variant: a, closable: B }, N) => /* @__PURE__ */ e(
315
- K,
316
- {
317
- description: s,
318
- variant: a,
319
- closable: B,
320
- onClose: () => A(o),
321
- children: r
322
- },
323
- N
324
- )
325
- ),
326
- /* @__PURE__ */ e("div", { className: C(t.main, t.outer), children: /* @__PURE__ */ i(z, { as: "nav", className: t.container, children: [
327
- /* @__PURE__ */ e(
333
+ return /* @__PURE__ */ t(U, { children: /* @__PURE__ */ i("header", { className: e.header, ref: g, children: [
334
+ w?.map(({ id: o, content: r, variant: s, closable: a }, B) => /* @__PURE__ */ t(
335
+ Y,
336
+ {
337
+ content: r,
338
+ variant: s,
339
+ closable: a,
340
+ onClose: () => A(o)
341
+ },
342
+ B
343
+ )),
344
+ /* @__PURE__ */ t("div", { className: C(e.main, e.outer), children: /* @__PURE__ */ i(z, { as: "nav", className: e.container, children: [
345
+ /* @__PURE__ */ t(
328
346
  m,
329
347
  {
330
348
  as: "a",
331
- className: t.skip,
349
+ className: e.skip,
332
350
  size: 500,
333
351
  tabIndex: "0",
334
- onClick: Q,
335
- onKeyPress: Q,
352
+ onClick: M,
353
+ onKeyPress: M,
336
354
  children: "Skip to content"
337
355
  }
338
356
  ),
339
- /* @__PURE__ */ e(
357
+ /* @__PURE__ */ t(
340
358
  l,
341
359
  {
342
- className: t.logo,
360
+ className: e.logo,
343
361
  href: d("https://www.highcharts.com/", h),
344
- children: /* @__PURE__ */ e(I, { showText: !S && !_ })
362
+ children: /* @__PURE__ */ t(I, { showText: !q && !_ })
345
363
  }
346
364
  ),
347
- /* @__PURE__ */ e("ul", { className: t.links, children: V.map(({ title: o, url: r }, s) => /* @__PURE__ */ e("li", { children: /* @__PURE__ */ e(
365
+ /* @__PURE__ */ t("ul", { className: e.links, children: V.map(({ title: o, url: r }, s) => /* @__PURE__ */ t("li", { children: /* @__PURE__ */ t(
348
366
  m,
349
367
  {
350
368
  variant: "plain",
@@ -354,7 +372,7 @@ function Ve({
354
372
  children: o
355
373
  }
356
374
  ) }, s)) }),
357
- /* @__PURE__ */ i("div", { className: t.buttons, children: [
375
+ /* @__PURE__ */ i("div", { className: e.buttons, children: [
358
376
  /* @__PURE__ */ i(
359
377
  m,
360
378
  {
@@ -365,21 +383,21 @@ function Ve({
365
383
  h
366
384
  ),
367
385
  children: [
368
- /* @__PURE__ */ e("span", { className: t.gpt, children: "Highcharts GPT" }),
369
- /* @__PURE__ */ e(P, {})
386
+ /* @__PURE__ */ t("span", { className: e.gpt, children: "Highcharts GPT" }),
387
+ /* @__PURE__ */ t(j, {})
370
388
  ]
371
389
  }
372
390
  ),
373
- /* @__PURE__ */ e(W, {}),
374
- /* @__PURE__ */ e(j, {}),
375
- /* @__PURE__ */ e(
391
+ /* @__PURE__ */ t(P, {}),
392
+ /* @__PURE__ */ t(W, {}),
393
+ /* @__PURE__ */ t(
376
394
  m,
377
395
  {
378
396
  variant: "brand",
379
397
  as: l,
380
398
  href: d("https://shop.highcharts.com/account", h),
381
399
  "aria-label": "Login",
382
- children: /* @__PURE__ */ e(O, {})
400
+ children: /* @__PURE__ */ t(E, {})
383
401
  }
384
402
  ),
385
403
  /* @__PURE__ */ i(
@@ -392,7 +410,7 @@ function Ve({
392
410
  h
393
411
  ),
394
412
  children: [
395
- /* @__PURE__ */ e(E, {}),
413
+ /* @__PURE__ */ t(O, {}),
396
414
  "Get started"
397
415
  ]
398
416
  }
@@ -401,51 +419,51 @@ function Ve({
401
419
  m,
402
420
  {
403
421
  variant: p ? "white" : "transparent",
404
- className: t.menu,
422
+ className: e.menu,
405
423
  onClick: y,
406
424
  children: [
407
425
  p ? "Close" : "Menu",
408
- p ? /* @__PURE__ */ e(Y, {}) : /* @__PURE__ */ e(te, {})
426
+ p ? /* @__PURE__ */ t(F, {}) : /* @__PURE__ */ t(et, {})
409
427
  ]
410
428
  }
411
429
  )
412
430
  ] })
413
431
  ] }) }),
414
- !!c?.length && /* @__PURE__ */ e(
415
- Ne,
432
+ !!c?.length && /* @__PURE__ */ t(
433
+ Nt,
416
434
  {
417
435
  items: c,
418
436
  link: l,
419
437
  host: h,
420
- pathname: q
438
+ pathname: N
421
439
  }
422
440
  ),
423
441
  n,
424
- b && /* @__PURE__ */ i(U, { children: [
425
- /* @__PURE__ */ e(
442
+ b && /* @__PURE__ */ i(R, { children: [
443
+ /* @__PURE__ */ t(
426
444
  "div",
427
445
  {
428
- className: C(t.mobileOverlay, { [t.open]: p }),
446
+ className: C(e.mobileOverlay, { [e.open]: p }),
429
447
  onClick: y
430
448
  }
431
449
  ),
432
450
  /* @__PURE__ */ i(
433
451
  "nav",
434
452
  {
435
- className: C(t.mobile, {
436
- [t.open]: p
453
+ className: C(e.mobile, {
454
+ [e.open]: p
437
455
  }),
438
456
  children: [
439
- /* @__PURE__ */ i("div", { className: t.container, children: [
440
- /* @__PURE__ */ e(
457
+ /* @__PURE__ */ i("div", { className: e.container, children: [
458
+ /* @__PURE__ */ t(
441
459
  l,
442
460
  {
443
- className: t.logo,
461
+ className: e.logo,
444
462
  href: d("https://www.highcharts.com/", h),
445
- children: /* @__PURE__ */ e(I, { showText: !_ })
463
+ children: /* @__PURE__ */ t(I, { showText: !_ })
446
464
  }
447
465
  ),
448
- /* @__PURE__ */ i("div", { className: t.buttons, children: [
466
+ /* @__PURE__ */ i("div", { className: e.buttons, children: [
449
467
  /* @__PURE__ */ i(
450
468
  m,
451
469
  {
@@ -456,16 +474,16 @@ function Ve({
456
474
  h
457
475
  ),
458
476
  children: [
459
- /* @__PURE__ */ e("span", { className: t.gpt, children: "Highcharts GPT" }),
460
- /* @__PURE__ */ e(P, {})
477
+ /* @__PURE__ */ t("span", { className: e.gpt, children: "Highcharts GPT" }),
478
+ /* @__PURE__ */ t(j, {})
461
479
  ]
462
480
  }
463
481
  ),
464
- /* @__PURE__ */ e(W, {}),
465
- /* @__PURE__ */ e(j, {})
482
+ /* @__PURE__ */ t(P, {}),
483
+ /* @__PURE__ */ t(W, {})
466
484
  ] })
467
485
  ] }),
468
- /* @__PURE__ */ i("div", { className: t.buttons, children: [
486
+ /* @__PURE__ */ i("div", { className: e.buttons, children: [
469
487
  /* @__PURE__ */ i(
470
488
  m,
471
489
  {
@@ -477,7 +495,7 @@ function Ve({
477
495
  h
478
496
  ),
479
497
  children: [
480
- /* @__PURE__ */ e(O, {}),
498
+ /* @__PURE__ */ t(E, {}),
481
499
  "Login"
482
500
  ]
483
501
  }
@@ -493,13 +511,13 @@ function Ve({
493
511
  h
494
512
  ),
495
513
  children: [
496
- /* @__PURE__ */ e(E, {}),
514
+ /* @__PURE__ */ t(O, {}),
497
515
  "Get started"
498
516
  ]
499
517
  }
500
518
  )
501
519
  ] }),
502
- /* @__PURE__ */ e("ul", { className: t.links, children: V.map(({ title: o, url: r, icon: s }, a) => /* @__PURE__ */ e("li", { children: /* @__PURE__ */ i(
520
+ /* @__PURE__ */ t("ul", { className: e.links, children: V.map(({ title: o, url: r, icon: s }, a) => /* @__PURE__ */ t("li", { children: /* @__PURE__ */ i(
503
521
  m,
504
522
  {
505
523
  variant: "plain",
@@ -520,6 +538,6 @@ function Ve({
520
538
  ] }) });
521
539
  }
522
540
  export {
523
- Ve as Header,
524
- Ne as SubHeader
541
+ zt as Header,
542
+ Nt as SubHeader
525
543
  };
@@ -1,9 +1,12 @@
1
- import { ReactNode } from 'react';
2
1
  export type NotificationVariant = 'default' | 'success' | 'danger' | 'attention';
3
- export declare function Notification({ children, variant, description, closable, onClose }: {
4
- children?: ReactNode;
5
- variant?: NotificationVariant;
2
+ export interface NotificationItem {
3
+ title?: string;
6
4
  description?: string;
5
+ url?: string;
6
+ }
7
+ export declare function Notification({ content, variant, closable, onClose }: {
8
+ content: NotificationItem | Array<NotificationItem>;
9
+ variant?: NotificationVariant;
7
10
  closable?: boolean;
8
11
  onClose?: Function;
9
- }): import("react/jsx-runtime").JSX.Element;
12
+ }): import("react/jsx-runtime").JSX.Element | null;