highsoft-ui 1.0.85 → 1.0.87

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,40 @@ function Ne({
247
247
  }
248
248
  ) }) });
249
249
  }
250
- function Ve({
250
+ const qt = [
251
+ {
252
+ id: "whats-new",
253
+ content: [
254
+ {
255
+ title: "Grid Pro",
256
+ description: "50% off through 2025",
257
+ url: "https://www.highcharts.com/products/grid/"
258
+ },
259
+ {
260
+ title: "React",
261
+ description: "Our improved React integration",
262
+ url: "https://www.highcharts.com/blog/news/how-to-migrate-to-the-new-highcharts-for-react/"
263
+ },
264
+ {
265
+ title: "Highcharts on Discord",
266
+ description: "Join our server",
267
+ url: "https://discord.com/invite/xHxxcyyy6K"
268
+ }
269
+ ]
270
+ }
271
+ ];
272
+ function zt({
251
273
  subItems: c,
252
274
  children: n,
253
- notifications: f = [],
275
+ notifications: f = qt,
254
276
  // TODO: Fetch these from the internets
255
277
  link: l = "a",
256
278
  host: h = "https://www.highcharts.com",
257
- pathname: q,
279
+ pathname: N,
258
280
  cssVariable: v
259
281
  }) {
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(() => {
282
+ 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([]);
283
+ T(() => {
262
284
  let o = window.scrollY;
263
285
  const r = 82 + w.length * 48 + (c?.length ? 72 : 0), s = -(82 + w.length * 48);
264
286
  let a = s, B = a;
@@ -266,15 +288,15 @@ function Ve({
266
288
  "--header-bottom",
267
289
  `${r + a}px`
268
290
  );
269
- const N = () => {
291
+ const Q = () => {
270
292
  const L = window.scrollY, J = L - o;
271
293
  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
294
  "--header-bottom",
273
295
  `${r + a}px`
274
296
  )), o = L, B = a;
275
297
  };
276
- return window.addEventListener("scroll", N), () => window.removeEventListener("scroll", N);
277
- }, [v, w.length]), H(() => {
298
+ return window.addEventListener("scroll", Q), () => window.removeEventListener("scroll", Q);
299
+ }, [v, w.length]), T(() => {
278
300
  if (f.length) {
279
301
  const o = localStorage.getItem("notifications");
280
302
  if (o) {
@@ -288,7 +310,7 @@ function Ve({
288
310
  k(f);
289
311
  }
290
312
  }, [f]);
291
- const Q = (o) => {
313
+ const M = (o) => {
292
314
  if (o.preventDefault(), !(o.nativeEvent instanceof KeyboardEvent) || o.nativeEvent.code === "Enter" || o.nativeEvent.code === "Space") {
293
315
  const r = document.querySelector("main");
294
316
  r && (r.scrollIntoView(), r.getAttribute("tabindex") !== "-1" && r.setAttribute("tabindex", "-1"), r.focus());
@@ -309,42 +331,39 @@ function Ve({
309
331
  })
310
332
  );
311
333
  };
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(
334
+ return /* @__PURE__ */ t(U, { 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
+ Y,
337
+ {
338
+ content: r,
339
+ variant: s,
340
+ closable: a,
341
+ onClose: () => A(o)
342
+ },
343
+ B
344
+ )),
345
+ /* @__PURE__ */ t("div", { className: C(e.main, e.outer), children: /* @__PURE__ */ i(z, { as: "nav", className: e.container, children: [
346
+ /* @__PURE__ */ t(
328
347
  m,
329
348
  {
330
349
  as: "a",
331
- className: t.skip,
350
+ className: e.skip,
332
351
  size: 500,
333
352
  tabIndex: "0",
334
- onClick: Q,
335
- onKeyPress: Q,
353
+ onClick: M,
354
+ onKeyPress: M,
336
355
  children: "Skip to content"
337
356
  }
338
357
  ),
339
- /* @__PURE__ */ e(
358
+ /* @__PURE__ */ t(
340
359
  l,
341
360
  {
342
- className: t.logo,
361
+ className: e.logo,
343
362
  href: d("https://www.highcharts.com/", h),
344
- children: /* @__PURE__ */ e(I, { showText: !S && !_ })
363
+ children: /* @__PURE__ */ t(I, { showText: !q && !_ })
345
364
  }
346
365
  ),
347
- /* @__PURE__ */ e("ul", { className: t.links, children: V.map(({ title: o, url: r }, s) => /* @__PURE__ */ e("li", { children: /* @__PURE__ */ e(
366
+ /* @__PURE__ */ t("ul", { className: e.links, children: V.map(({ title: o, url: r }, s) => /* @__PURE__ */ t("li", { children: /* @__PURE__ */ t(
348
367
  m,
349
368
  {
350
369
  variant: "plain",
@@ -354,7 +373,7 @@ function Ve({
354
373
  children: o
355
374
  }
356
375
  ) }, s)) }),
357
- /* @__PURE__ */ i("div", { className: t.buttons, children: [
376
+ /* @__PURE__ */ i("div", { className: e.buttons, children: [
358
377
  /* @__PURE__ */ i(
359
378
  m,
360
379
  {
@@ -365,21 +384,21 @@ function Ve({
365
384
  h
366
385
  ),
367
386
  children: [
368
- /* @__PURE__ */ e("span", { className: t.gpt, children: "Highcharts GPT" }),
369
- /* @__PURE__ */ e(P, {})
387
+ /* @__PURE__ */ t("span", { className: e.gpt, children: "Highcharts GPT" }),
388
+ /* @__PURE__ */ t(j, {})
370
389
  ]
371
390
  }
372
391
  ),
373
- /* @__PURE__ */ e(W, {}),
374
- /* @__PURE__ */ e(j, {}),
375
- /* @__PURE__ */ e(
392
+ /* @__PURE__ */ t(P, {}),
393
+ /* @__PURE__ */ t(W, {}),
394
+ /* @__PURE__ */ t(
376
395
  m,
377
396
  {
378
397
  variant: "brand",
379
398
  as: l,
380
399
  href: d("https://shop.highcharts.com/account", h),
381
400
  "aria-label": "Login",
382
- children: /* @__PURE__ */ e(O, {})
401
+ children: /* @__PURE__ */ t(E, {})
383
402
  }
384
403
  ),
385
404
  /* @__PURE__ */ i(
@@ -392,7 +411,7 @@ function Ve({
392
411
  h
393
412
  ),
394
413
  children: [
395
- /* @__PURE__ */ e(E, {}),
414
+ /* @__PURE__ */ t(O, {}),
396
415
  "Get started"
397
416
  ]
398
417
  }
@@ -401,51 +420,51 @@ function Ve({
401
420
  m,
402
421
  {
403
422
  variant: p ? "white" : "transparent",
404
- className: t.menu,
423
+ className: e.menu,
405
424
  onClick: y,
406
425
  children: [
407
426
  p ? "Close" : "Menu",
408
- p ? /* @__PURE__ */ e(Y, {}) : /* @__PURE__ */ e(te, {})
427
+ p ? /* @__PURE__ */ t(F, {}) : /* @__PURE__ */ t(et, {})
409
428
  ]
410
429
  }
411
430
  )
412
431
  ] })
413
432
  ] }) }),
414
- !!c?.length && /* @__PURE__ */ e(
415
- Ne,
433
+ !!c?.length && /* @__PURE__ */ t(
434
+ Nt,
416
435
  {
417
436
  items: c,
418
437
  link: l,
419
438
  host: h,
420
- pathname: q
439
+ pathname: N
421
440
  }
422
441
  ),
423
442
  n,
424
- b && /* @__PURE__ */ i(U, { children: [
425
- /* @__PURE__ */ e(
443
+ b && /* @__PURE__ */ i(R, { children: [
444
+ /* @__PURE__ */ t(
426
445
  "div",
427
446
  {
428
- className: C(t.mobileOverlay, { [t.open]: p }),
447
+ className: C(e.mobileOverlay, { [e.open]: p }),
429
448
  onClick: y
430
449
  }
431
450
  ),
432
451
  /* @__PURE__ */ i(
433
452
  "nav",
434
453
  {
435
- className: C(t.mobile, {
436
- [t.open]: p
454
+ className: C(e.mobile, {
455
+ [e.open]: p
437
456
  }),
438
457
  children: [
439
- /* @__PURE__ */ i("div", { className: t.container, children: [
440
- /* @__PURE__ */ e(
458
+ /* @__PURE__ */ i("div", { className: e.container, children: [
459
+ /* @__PURE__ */ t(
441
460
  l,
442
461
  {
443
- className: t.logo,
462
+ className: e.logo,
444
463
  href: d("https://www.highcharts.com/", h),
445
- children: /* @__PURE__ */ e(I, { showText: !_ })
464
+ children: /* @__PURE__ */ t(I, { showText: !_ })
446
465
  }
447
466
  ),
448
- /* @__PURE__ */ i("div", { className: t.buttons, children: [
467
+ /* @__PURE__ */ i("div", { className: e.buttons, children: [
449
468
  /* @__PURE__ */ i(
450
469
  m,
451
470
  {
@@ -456,16 +475,16 @@ function Ve({
456
475
  h
457
476
  ),
458
477
  children: [
459
- /* @__PURE__ */ e("span", { className: t.gpt, children: "Highcharts GPT" }),
460
- /* @__PURE__ */ e(P, {})
478
+ /* @__PURE__ */ t("span", { className: e.gpt, children: "Highcharts GPT" }),
479
+ /* @__PURE__ */ t(j, {})
461
480
  ]
462
481
  }
463
482
  ),
464
- /* @__PURE__ */ e(W, {}),
465
- /* @__PURE__ */ e(j, {})
483
+ /* @__PURE__ */ t(P, {}),
484
+ /* @__PURE__ */ t(W, {})
466
485
  ] })
467
486
  ] }),
468
- /* @__PURE__ */ i("div", { className: t.buttons, children: [
487
+ /* @__PURE__ */ i("div", { className: e.buttons, children: [
469
488
  /* @__PURE__ */ i(
470
489
  m,
471
490
  {
@@ -477,7 +496,7 @@ function Ve({
477
496
  h
478
497
  ),
479
498
  children: [
480
- /* @__PURE__ */ e(O, {}),
499
+ /* @__PURE__ */ t(E, {}),
481
500
  "Login"
482
501
  ]
483
502
  }
@@ -493,13 +512,13 @@ function Ve({
493
512
  h
494
513
  ),
495
514
  children: [
496
- /* @__PURE__ */ e(E, {}),
515
+ /* @__PURE__ */ t(O, {}),
497
516
  "Get started"
498
517
  ]
499
518
  }
500
519
  )
501
520
  ] }),
502
- /* @__PURE__ */ e("ul", { className: t.links, children: V.map(({ title: o, url: r, icon: s }, a) => /* @__PURE__ */ e("li", { children: /* @__PURE__ */ i(
521
+ /* @__PURE__ */ t("ul", { className: e.links, children: V.map(({ title: o, url: r, icon: s }, a) => /* @__PURE__ */ t("li", { children: /* @__PURE__ */ i(
503
522
  m,
504
523
  {
505
524
  variant: "plain",
@@ -520,6 +539,6 @@ function Ve({
520
539
  ] }) });
521
540
  }
522
541
  export {
523
- Ve as Header,
524
- Ne as SubHeader
542
+ zt as Header,
543
+ Nt as SubHeader
525
544
  };
@@ -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;