highsoft-ui 1.0.13 → 1.0.14

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/Header/index.d.ts +4 -2
  2. package/dist/components/Header/index.js +214 -176
  3. package/package.json +1 -1
package/dist/components/Header/index.d.ts CHANGED
@@ -8,8 +8,9 @@ export interface SubHeaderItem {
8
8
  tagVariant?: 'success' | 'brand';
9
9
  link?: ElementType;
10
10
  }
11
- export declare function SubHeader({ items }: {
11
+ export declare function SubHeader({ items, host }: {
12
12
  items: Array<SubHeaderItem>;
13
+ host?: string;
13
14
  }): import("react/jsx-runtime").JSX.Element;
14
15
  export interface Notification {
15
16
  id?: string;
@@ -19,9 +20,10 @@ export interface Notification {
19
20
  closable?: boolean;
20
21
  }
21
22
  export declare function Header({ subItems, children, notifications: initialNotifications, // TODO: Fetch these from the internets
22
- link: Link }: {
23
+ link: Link, host }: {
23
24
  subItems?: Array<SubHeaderItem>;
24
25
  children?: ReactNode;
25
26
  notifications?: Array<Notification>;
26
27
  link?: ElementType;
28
+ host?: string;
27
29
  }): import("react/jsx-runtime").JSX.Element;
package/dist/components/Header/index.js CHANGED
@@ -1,22 +1,22 @@
1
- import { jsx as e, jsxs as o, Fragment as P } from "react/jsx-runtime";
2
- import { useState as b, useEffect as V } from "react";
3
- import { J as q } from "../../index-CMegByeX.js";
4
- import { _ as h } from "../../extends-hS2Bh-Yp.js";
5
- import { N as z, X as J } from "../../index-CcO3hfIY.js";
6
- import { c as m } from "../../clsx-OuTLNxxd.js";
7
- import { Button as c } from "../Button/index.js";
8
- import { Container as H } from "../Container/index.js";
9
- import { ThemedLogo as x } from "../Logo/index.js";
10
- import { PrefPanel as M } from "../PrefPanel/index.js";
11
- import { useMediaQuery as k } from "../../utils.js";
12
- var U = function(t) {
13
- return /* @__PURE__ */ e("svg", h({
1
+ import { jsx as e, jsxs as o, Fragment as q } from "react/jsx-runtime";
2
+ import { useState as M, useEffect as U } from "react";
3
+ import { J as z } from "../../index-CMegByeX.js";
4
+ import { _ as d } from "../../extends-hS2Bh-Yp.js";
5
+ import { N as J, X as A } from "../../index-CcO3hfIY.js";
6
+ import { c as w } from "../../clsx-OuTLNxxd.js";
7
+ import { Button as h } from "../Button/index.js";
8
+ import { Container as j } from "../Container/index.js";
9
+ import { ThemedLogo as N } from "../Logo/index.js";
10
+ import { PrefPanel as S } from "../PrefPanel/index.js";
11
+ import { useMediaQuery as b } from "../../utils.js";
12
+ var G = function(r) {
13
+ return /* @__PURE__ */ e("svg", d({
14
14
  xmlns: "http://www.w3.org/2000/svg",
15
15
  width: 24,
16
16
  height: 24,
17
17
  fill: "none",
18
18
  viewBox: "0 0 24 24"
19
- }, t, {
19
+ }, r, {
20
20
  children: /* @__PURE__ */ e("path", {
21
21
  stroke: "currentColor",
22
22
  strokeLinecap: "round",
@@ -25,14 +25,14 @@ var U = function(t) {
25
25
  d: "M18.5 16c1.933 0 3.5-2.9101 3.5-6.5C22 5.9102 20.433 3 18.5 3m0 13c-1.933 0-3.5-2.9101-3.5-6.5C15 5.9102 16.567 3 18.5 3m0 13L5.4435 13.6261c-.9275-.1686-1.3912-.253-1.7662-.4371a3 3 0 0 1-1.5632-1.8731C2 10.914 2 10.4427 2 9.5s0-1.414.1141-1.816a3 3 0 0 1 1.5632-1.873c.375-.1841.8388-.2685 1.7662-.4371L18.5 3M5 14l.3939 5.514c.0374.5236.056.7855.17.9839a1 1 0 0 0 .4324.4026c.206.0995.4685.0995.9935.0995h1.7824c.6001 0 .9002 0 1.1223-.1197a1 1 0 0 0 .4397-.4748c.1023-.2306.0793-.5298.0333-1.1282L10 14.5"
26
26
  })
27
27
  }));
28
- }, A = function(t) {
29
- return /* @__PURE__ */ e("svg", h({
28
+ }, F = function(r) {
29
+ return /* @__PURE__ */ e("svg", d({
30
30
  xmlns: "http://www.w3.org/2000/svg",
31
31
  width: 24,
32
32
  height: 24,
33
33
  fill: "none",
34
34
  viewBox: "0 0 24 24"
35
- }, t, {
35
+ }, r, {
36
36
  children: /* @__PURE__ */ e("path", {
37
37
  stroke: "currentColor",
38
38
  strokeLinecap: "round",
@@ -41,14 +41,14 @@ var U = function(t) {
41
41
  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"
42
42
  })
43
43
  }));
44
- }, G = function(t) {
45
- return /* @__PURE__ */ e("svg", h({
44
+ }, Q = function(r) {
45
+ return /* @__PURE__ */ e("svg", d({
46
46
  xmlns: "http://www.w3.org/2000/svg",
47
47
  width: 24,
48
48
  height: 24,
49
49
  fill: "none",
50
50
  viewBox: "0 0 24 24"
51
- }, t, {
51
+ }, r, {
52
52
  children: /* @__PURE__ */ e("path", {
53
53
  stroke: "currentColor",
54
54
  strokeLinecap: "round",
@@ -57,14 +57,14 @@ var U = function(t) {
57
57
  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"
58
58
  })
59
59
  }));
60
- }, F = function(t) {
61
- return /* @__PURE__ */ e("svg", h({
60
+ }, X = function(r) {
61
+ return /* @__PURE__ */ e("svg", d({
62
62
  xmlns: "http://www.w3.org/2000/svg",
63
63
  width: 24,
64
64
  height: 24,
65
65
  fill: "none",
66
66
  viewBox: "0 0 24 24"
67
- }, t, {
67
+ }, r, {
68
68
  children: /* @__PURE__ */ e("path", {
69
69
  stroke: "currentColor",
70
70
  strokeLinecap: "round",
@@ -73,14 +73,14 @@ var U = function(t) {
73
73
  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"
74
74
  })
75
75
  }));
76
- }, Q = function(t) {
77
- return /* @__PURE__ */ e("svg", h({
76
+ }, $ = function(r) {
77
+ return /* @__PURE__ */ e("svg", d({
78
78
  xmlns: "http://www.w3.org/2000/svg",
79
79
  width: 24,
80
80
  height: 24,
81
81
  fill: "none",
82
82
  viewBox: "0 0 24 24"
83
- }, t, {
83
+ }, r, {
84
84
  children: /* @__PURE__ */ e("path", {
85
85
  stroke: "currentColor",
86
86
  strokeLinecap: "round",
@@ -89,14 +89,14 @@ var U = function(t) {
89
89
  d: "M3 12h12M3 6h18M3 18h18"
90
90
  })
91
91
  }));
92
- }, X = function(t) {
93
- return /* @__PURE__ */ e("svg", h({
92
+ }, D = function(r) {
93
+ return /* @__PURE__ */ e("svg", d({
94
94
  xmlns: "http://www.w3.org/2000/svg",
95
95
  width: 24,
96
96
  height: 24,
97
97
  fill: "none",
98
98
  viewBox: "0 0 24 24"
99
- }, t, {
99
+ }, r, {
100
100
  children: /* @__PURE__ */ e("path", {
101
101
  stroke: "currentColor",
102
102
  strokeLinecap: "round",
@@ -105,14 +105,14 @@ var U = function(t) {
105
105
  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"
106
106
  })
107
107
  }));
108
- }, $ = function(t) {
109
- return /* @__PURE__ */ e("svg", h({
108
+ }, E = function(r) {
109
+ return /* @__PURE__ */ e("svg", d({
110
110
  xmlns: "http://www.w3.org/2000/svg",
111
111
  width: 24,
112
112
  height: 24,
113
113
  fill: "none",
114
114
  viewBox: "0 0 24 24"
115
- }, t, {
115
+ }, r, {
116
116
  children: /* @__PURE__ */ e("path", {
117
117
  stroke: "currentColor",
118
118
  strokeLinecap: "round",
@@ -121,14 +121,14 @@ var U = function(t) {
121
121
  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"
122
122
  })
123
123
  }));
124
- }, N = function(t) {
125
- return /* @__PURE__ */ e("svg", h({
124
+ }, L = function(r) {
125
+ return /* @__PURE__ */ e("svg", d({
126
126
  xmlns: "http://www.w3.org/2000/svg",
127
127
  width: 24,
128
128
  height: 24,
129
129
  fill: "none",
130
130
  viewBox: "0 0 24 24"
131
- }, t, {
131
+ }, r, {
132
132
  children: /* @__PURE__ */ e("path", {
133
133
  stroke: "currentColor",
134
134
  strokeLinecap: "round",
@@ -137,14 +137,14 @@ var U = function(t) {
137
137
  d: "m21 21-4.35-4.35M19 11c0 4.4183-3.5817 8-8 8s-8-3.5817-8-8 3.5817-8 8-8 8 3.5817 8 8"
138
138
  })
139
139
  }));
140
- }, S = function(t) {
141
- return /* @__PURE__ */ e("svg", h({
140
+ }, T = function(r) {
141
+ return /* @__PURE__ */ e("svg", d({
142
142
  xmlns: "http://www.w3.org/2000/svg",
143
143
  width: 24,
144
144
  height: 24,
145
145
  fill: "none",
146
146
  viewBox: "0 0 24 24"
147
- }, t, {
147
+ }, r, {
148
148
  children: /* @__PURE__ */ e("path", {
149
149
  stroke: "currentColor",
150
150
  strokeLinecap: "round",
@@ -153,14 +153,14 @@ var U = function(t) {
153
153
  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"
154
154
  })
155
155
  }));
156
- }, L = function(t) {
157
- return /* @__PURE__ */ e("svg", h({
156
+ }, B = function(r) {
157
+ return /* @__PURE__ */ e("svg", d({
158
158
  xmlns: "http://www.w3.org/2000/svg",
159
159
  width: 24,
160
160
  height: 24,
161
161
  fill: "none",
162
162
  viewBox: "0 0 24 24"
163
- }, t, {
163
+ }, r, {
164
164
  children: /* @__PURE__ */ e("path", {
165
165
  stroke: "currentColor",
166
166
  strokeLinecap: "round",
@@ -169,14 +169,14 @@ var U = function(t) {
169
169
  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"
170
170
  })
171
171
  }));
172
- }, T = function(t) {
173
- return /* @__PURE__ */ e("svg", h({
172
+ }, H = function(r) {
173
+ return /* @__PURE__ */ e("svg", d({
174
174
  xmlns: "http://www.w3.org/2000/svg",
175
175
  width: 24,
176
176
  height: 24,
177
177
  fill: "none",
178
178
  viewBox: "0 0 24 24"
179
- }, t, {
179
+ }, r, {
180
180
  children: /* @__PURE__ */ e("path", {
181
181
  stroke: "currentColor",
182
182
  strokeLinecap: "round",
@@ -186,270 +186,308 @@ var U = function(t) {
186
186
  })
187
187
  }));
188
188
  };
189
- const D = "_header_ap7gr_285", E = "_outer_ap7gr_296", R = "_main_ap7gr_305", I = "_container_ap7gr_309", K = "_links_ap7gr_315", Y = "_buttons_ap7gr_316", Z = "_menu_ap7gr_324", e1 = "_logo_ap7gr_329", t1 = "_subContainer_ap7gr_341", r1 = "_selected_ap7gr_369", n1 = "_subTag_ap7gr_381", o1 = "_mobileOverlay_ap7gr_399", s1 = "_show_ap7gr_1", a1 = "_open_ap7gr_411", i1 = "_mobile_ap7gr_399", c1 = "_slideUp_ap7gr_1", h1 = "_sub_ap7gr_341", l1 = "_gpt_ap7gr_477", r = {
190
- header: D,
191
- outer: E,
192
- main: R,
193
- container: I,
194
- links: K,
195
- buttons: Y,
196
- menu: Z,
197
- logo: e1,
198
- subContainer: t1,
199
- selected: r1,
200
- subTag: n1,
189
+ const R = "_header_ap7gr_285", I = "_outer_ap7gr_296", K = "_main_ap7gr_305", Y = "_container_ap7gr_309", Z = "_links_ap7gr_315", e1 = "_buttons_ap7gr_316", r1 = "_menu_ap7gr_324", t1 = "_logo_ap7gr_329", n1 = "_subContainer_ap7gr_341", o1 = "_selected_ap7gr_369", s1 = "_subTag_ap7gr_381", a1 = "_mobileOverlay_ap7gr_399", i1 = "_show_ap7gr_1", c1 = "_open_ap7gr_411", h1 = "_mobile_ap7gr_399", l1 = "_slideUp_ap7gr_1", d1 = "_sub_ap7gr_341", u1 = "_gpt_ap7gr_477", t = {
190
+ header: R,
191
+ outer: I,
192
+ main: K,
193
+ container: Y,
194
+ links: Z,
195
+ buttons: e1,
196
+ menu: r1,
197
+ logo: t1,
198
+ subContainer: n1,
199
+ selected: o1,
200
+ subTag: s1,
201
201
  "subTag-success": "_subTag-success_ap7gr_386",
202
202
  "subTag-brand": "_subTag-brand_ap7gr_390",
203
- mobileOverlay: o1,
204
- show: s1,
205
- open: a1,
206
- mobile: i1,
207
- slideUp: c1,
208
- sub: h1,
209
- gpt: l1
210
- }, B = [
203
+ mobileOverlay: a1,
204
+ show: i1,
205
+ open: c1,
206
+ mobile: h1,
207
+ slideUp: l1,
208
+ sub: d1,
209
+ gpt: u1
210
+ }, W = [
211
211
  {
212
212
  title: "Products",
213
213
  url: "https://highcharts.com/products/",
214
- icon: /* @__PURE__ */ e(G, {})
214
+ icon: /* @__PURE__ */ e(Q, {})
215
215
  },
216
216
  {
217
217
  title: "Demos",
218
218
  url: "https://www.highcharts.com/demo",
219
- icon: /* @__PURE__ */ e($, {})
219
+ icon: /* @__PURE__ */ e(E, {})
220
220
  },
221
221
  {
222
222
  title: "Support",
223
223
  url: "https://www.highcharts.com/support/",
224
- icon: /* @__PURE__ */ e(X, {})
224
+ icon: /* @__PURE__ */ e(D, {})
225
225
  },
226
226
  {
227
227
  title: "Resources",
228
228
  url: "https://www.highcharts.com/",
229
- icon: /* @__PURE__ */ e(F, {})
229
+ icon: /* @__PURE__ */ e(X, {})
230
230
  },
231
231
  {
232
232
  title: "Pricing",
233
233
  url: "https://shop.highcharts.com/",
234
- icon: /* @__PURE__ */ e(A, {})
234
+ icon: /* @__PURE__ */ e(F, {})
235
235
  },
236
236
  {
237
237
  title: "Blog",
238
238
  url: "https://www.highcharts.com/blog/",
239
- icon: /* @__PURE__ */ e(U, {})
239
+ icon: /* @__PURE__ */ e(G, {})
240
240
  }
241
241
  ];
242
- function d1({ items: n }) {
243
- return /* @__PURE__ */ e("div", { className: m(r.sub, r.outer), children: /* @__PURE__ */ e(H, { className: r.subContainer, as: "ul", children: n.map(
244
- ({ title: t, url: u, icon: i, tag: p, tagVariant: w = "success", link: v = "a" }, d) => /* @__PURE__ */ e("li", { children: /* @__PURE__ */ o(v, { href: u, children: [
245
- i,
242
+ function l(n, r) {
243
+ return r ? n.replace(r, "") : n;
244
+ }
245
+ function p1({
246
+ items: n,
247
+ host: r
248
+ }) {
249
+ return /* @__PURE__ */ e("div", { className: w(t.sub, t.outer), children: /* @__PURE__ */ e(j, { className: t.subContainer, as: "ul", children: n.map(
250
+ ({ title: m, url: c, icon: a, tag: g, tagVariant: f = "success", link: _ = "a" }, p) => /* @__PURE__ */ e("li", { children: /* @__PURE__ */ o(_, { href: l(c, r), children: [
251
+ a,
246
252
  /* @__PURE__ */ o("span", { children: [
247
- t,
248
- p && /* @__PURE__ */ e(
253
+ m,
254
+ g && /* @__PURE__ */ e(
249
255
  "span",
250
256
  {
251
- className: m(
252
- r.subTag,
253
- r[`subTag-${w}`]
257
+ className: w(
258
+ t.subTag,
259
+ t[`subTag-${f}`]
254
260
  ),
255
- children: p
261
+ children: g
256
262
  }
257
263
  )
258
264
  ] })
259
- ] }) }, d)
265
+ ] }) }, p)
260
266
  ) }) });
261
267
  }
262
- function x1({
268
+ function N1({
263
269
  subItems: n,
264
- children: t,
265
- notifications: u = [],
270
+ children: r,
271
+ notifications: m = [],
266
272
  // TODO: Fetch these from the internets
267
- link: i = "a"
273
+ link: c = "a",
274
+ host: a = "https://www.highcharts.com"
268
275
  }) {
269
- const p = k("(max-width: 374px)"), w = k("(max-width: 849px)"), v = k("(min-width: 850px) and (max-width: 999px)"), [d, W] = b(!1), [g, f] = b([]);
270
- V(() => {
271
- if (u.length) {
272
- const a = localStorage.getItem("notifications");
273
- if (a) {
274
- const l = JSON.parse(a);
275
- f(
276
- u.filter(
277
- (s) => !s.id || !l.closed.includes(s.id)
276
+ const g = b("(max-width: 374px)"), f = b("(max-width: 849px)"), _ = b("(min-width: 850px) and (max-width: 999px)"), [p, O] = M(!1), [v, k] = M([]);
277
+ U(() => {
278
+ if (m.length) {
279
+ const i = localStorage.getItem("notifications");
280
+ if (i) {
281
+ const u = JSON.parse(i);
282
+ k(
283
+ m.filter(
284
+ (s) => !s.id || !u.closed.includes(s.id)
278
285
  )
279
286
  );
280
287
  } else
281
- f(u);
288
+ k(m);
282
289
  }
283
- }, [u]);
284
- const C = () => {
285
- W(!d);
286
- }, j = (a) => {
287
- f(g.filter((s) => !s.id || s.id !== a));
288
- const l = localStorage.getItem("notifications");
289
- if (l) {
290
- const s = JSON.parse(l);
291
- s.closed.includes(a) || (s.closed.push(a), localStorage.setItem("notifications", JSON.stringify(s)));
290
+ }, [m]);
291
+ const x = () => {
292
+ O(!p);
293
+ }, y = (i) => {
294
+ k(v.filter((s) => !s.id || s.id !== i));
295
+ const u = localStorage.getItem("notifications");
296
+ if (u) {
297
+ const s = JSON.parse(u);
298
+ s.closed.includes(i) || (s.closed.push(i), localStorage.setItem("notifications", JSON.stringify(s)));
292
299
  } else
293
300
  localStorage.setItem(
294
301
  "notifications",
295
302
  JSON.stringify({
296
- closed: [a]
303
+ closed: [i]
297
304
  })
298
305
  );
299
306
  };
300
- return /* @__PURE__ */ e(q, { children: /* @__PURE__ */ o("header", { className: r.header, children: [
301
- g == null ? void 0 : g.map(
302
- ({ id: a, title: l, description: s, variant: _, closable: O }, y) => /* @__PURE__ */ e(
303
- z,
307
+ return /* @__PURE__ */ e(z, { children: /* @__PURE__ */ o("header", { className: t.header, children: [
308
+ v == null ? void 0 : v.map(
309
+ ({ id: i, title: u, description: s, variant: C, closable: P }, V) => /* @__PURE__ */ e(
310
+ J,
304
311
  {
305
312
  description: s,
306
- variant: _,
307
- closable: O,
308
- onClose: () => j(a),
309
- children: l
313
+ variant: C,
314
+ closable: P,
315
+ onClose: () => y(i),
316
+ children: u
310
317
  },
311
- y
318
+ V
312
319
  )
313
320
  ),
314
- /* @__PURE__ */ e("div", { className: m(r.main, r.outer), children: /* @__PURE__ */ o(H, { as: "nav", className: r.container, children: [
315
- /* @__PURE__ */ e(i, { className: r.logo, href: "https://www.highcharts.com/", children: /* @__PURE__ */ e(x, { showText: !v && !p }) }),
316
- /* @__PURE__ */ e("ul", { className: r.links, children: B.map(({ title: a, url: l }, s) => /* @__PURE__ */ e("li", { children: /* @__PURE__ */ e(c, { variant: "plain", size: 300, as: i, href: l, children: a }) }, s)) }),
317
- /* @__PURE__ */ o("div", { className: r.buttons, children: [
321
+ /* @__PURE__ */ e("div", { className: w(t.main, t.outer), children: /* @__PURE__ */ o(j, { as: "nav", className: t.container, children: [
322
+ /* @__PURE__ */ e(
323
+ c,
324
+ {
325
+ className: t.logo,
326
+ href: l("https://www.highcharts.com/", a),
327
+ children: /* @__PURE__ */ e(N, { showText: !_ && !g })
328
+ }
329
+ ),
330
+ /* @__PURE__ */ e("ul", { className: t.links, children: W.map(({ title: i, url: u }, s) => /* @__PURE__ */ e("li", { children: /* @__PURE__ */ e(
331
+ h,
332
+ {
333
+ variant: "plain",
334
+ size: 300,
335
+ as: c,
336
+ href: l(u, a),
337
+ children: i
338
+ }
339
+ ) }, s)) }),
340
+ /* @__PURE__ */ o("div", { className: t.buttons, children: [
318
341
  /* @__PURE__ */ o(
319
- c,
342
+ h,
320
343
  {
321
344
  variant: "transparent",
322
- as: i,
323
- href: "https://www.highcharts.com/chat/gpt/",
345
+ as: c,
346
+ href: l(
347
+ "https://www.highcharts.com/chat/gpt/",
348
+ a
349
+ ),
324
350
  children: [
325
- /* @__PURE__ */ e("span", { className: r.gpt, children: "Highcharts GPT" }),
326
- /* @__PURE__ */ e(S, {})
351
+ /* @__PURE__ */ e("span", { className: t.gpt, children: "Highcharts GPT" }),
352
+ /* @__PURE__ */ e(T, {})
327
353
  ]
328
354
  }
329
355
  ),
330
- /* @__PURE__ */ e(c, { variant: "transparent", "aria-label": "Search", children: /* @__PURE__ */ e(N, {}) }),
331
- /* @__PURE__ */ e(M, {}),
356
+ /* @__PURE__ */ e(h, { variant: "transparent", "aria-label": "Search", children: /* @__PURE__ */ e(L, {}) }),
357
+ /* @__PURE__ */ e(S, {}),
332
358
  /* @__PURE__ */ e(
333
- c,
359
+ h,
334
360
  {
335
361
  variant: "brand",
336
- as: i,
337
- href: "https://shop.highcharts.com/account",
362
+ as: c,
363
+ href: l("https://shop.highcharts.com/account", a),
338
364
  "aria-label": "Login",
339
- children: /* @__PURE__ */ e(T, {})
365
+ children: /* @__PURE__ */ e(H, {})
340
366
  }
341
367
  ),
342
368
  /* @__PURE__ */ o(
343
- c,
369
+ h,
344
370
  {
345
371
  variant: "success",
346
- as: i,
347
- href: "https://www.highcharts.com/download/",
372
+ as: c,
373
+ href: l(
374
+ "https://www.highcharts.com/download/",
375
+ a
376
+ ),
348
377
  children: [
349
- /* @__PURE__ */ e(L, {}),
378
+ /* @__PURE__ */ e(B, {}),
350
379
  "Get started"
351
380
  ]
352
381
  }
353
382
  ),
354
383
  /* @__PURE__ */ o(
355
- c,
384
+ h,
356
385
  {
357
- variant: d ? "white" : "transparent",
358
- className: r.menu,
359
- onClick: C,
386
+ variant: p ? "white" : "transparent",
387
+ className: t.menu,
388
+ onClick: x,
360
389
  children: [
361
- d ? "Close" : "Menu",
362
- d ? /* @__PURE__ */ e(J, {}) : /* @__PURE__ */ e(Q, {})
390
+ p ? "Close" : "Menu",
391
+ p ? /* @__PURE__ */ e(A, {}) : /* @__PURE__ */ e($, {})
363
392
  ]
364
393
  }
365
394
  )
366
395
  ] })
367
396
  ] }) }),
368
- !!(n != null && n.length) && /* @__PURE__ */ e(d1, { items: n }),
369
- t,
370
- w && /* @__PURE__ */ o(P, { children: [
397
+ !!(n != null && n.length) && /* @__PURE__ */ e(p1, { items: n, host: a }),
398
+ r,
399
+ f && /* @__PURE__ */ o(q, { children: [
371
400
  /* @__PURE__ */ e(
372
401
  "div",
373
402
  {
374
- className: m(r.mobileOverlay, { [r.open]: d }),
375
- onClick: C
403
+ className: w(t.mobileOverlay, { [t.open]: p }),
404
+ onClick: x
376
405
  }
377
406
  ),
378
407
  /* @__PURE__ */ o(
379
408
  "nav",
380
409
  {
381
- className: m(r.mobile, {
382
- [r.open]: d
410
+ className: w(t.mobile, {
411
+ [t.open]: p
383
412
  }),
384
413
  children: [
385
- /* @__PURE__ */ o("div", { className: r.container, children: [
414
+ /* @__PURE__ */ o("div", { className: t.container, children: [
386
415
  /* @__PURE__ */ e(
387
- i,
416
+ c,
388
417
  {
389
- className: r.logo,
390
- href: "https://www.highcharts.com/",
391
- children: /* @__PURE__ */ e(x, { showText: !p })
418
+ className: t.logo,
419
+ href: l("https://www.highcharts.com/", a),
420
+ children: /* @__PURE__ */ e(N, { showText: !g })
392
421
  }
393
422
  ),
394
- /* @__PURE__ */ o("div", { className: r.buttons, children: [
423
+ /* @__PURE__ */ o("div", { className: t.buttons, children: [
395
424
  /* @__PURE__ */ o(
396
- c,
425
+ h,
397
426
  {
398
427
  variant: "transparent",
399
- as: i,
400
- href: "https://www.highcharts.com/chat/gpt/",
428
+ as: c,
429
+ href: l(
430
+ "https://www.highcharts.com/chat/gpt/",
431
+ a
432
+ ),
401
433
  children: [
402
- /* @__PURE__ */ e("span", { className: r.gpt, children: "Highcharts GPT" }),
403
- /* @__PURE__ */ e(S, {})
434
+ /* @__PURE__ */ e("span", { className: t.gpt, children: "Highcharts GPT" }),
435
+ /* @__PURE__ */ e(T, {})
404
436
  ]
405
437
  }
406
438
  ),
407
- /* @__PURE__ */ e(c, { variant: "transparent", "aria-label": "Search", children: /* @__PURE__ */ e(N, {}) }),
408
- /* @__PURE__ */ e(M, {})
439
+ /* @__PURE__ */ e(h, { variant: "transparent", "aria-label": "Search", children: /* @__PURE__ */ e(L, {}) }),
440
+ /* @__PURE__ */ e(S, {})
409
441
  ] })
410
442
  ] }),
411
- /* @__PURE__ */ o("div", { className: r.buttons, children: [
443
+ /* @__PURE__ */ o("div", { className: t.buttons, children: [
412
444
  /* @__PURE__ */ o(
413
- c,
445
+ h,
414
446
  {
415
447
  variant: "brand",
416
448
  fullWidth: !0,
417
- as: i,
418
- href: "https://shop.highcharts.com/account",
449
+ as: c,
450
+ href: l(
451
+ "https://shop.highcharts.com/account",
452
+ a
453
+ ),
419
454
  children: [
420
- /* @__PURE__ */ e(T, {}),
455
+ /* @__PURE__ */ e(H, {}),
421
456
  "Login"
422
457
  ]
423
458
  }
424
459
  ),
425
460
  /* @__PURE__ */ o(
426
- c,
461
+ h,
427
462
  {
428
463
  variant: "success",
429
464
  fullWidth: !0,
430
- as: i,
431
- href: "https://www.highcharts.com/download/",
465
+ as: c,
466
+ href: l(
467
+ "https://www.highcharts.com/download/",
468
+ a
469
+ ),
432
470
  children: [
433
- /* @__PURE__ */ e(L, {}),
471
+ /* @__PURE__ */ e(B, {}),
434
472
  "Get started"
435
473
  ]
436
474
  }
437
475
  )
438
476
  ] }),
439
- /* @__PURE__ */ e("ul", { className: r.links, children: B.map(({ title: a, url: l, icon: s }, _) => /* @__PURE__ */ e("li", { children: /* @__PURE__ */ o(
440
- c,
477
+ /* @__PURE__ */ e("ul", { className: t.links, children: W.map(({ title: i, url: u, icon: s }, C) => /* @__PURE__ */ e("li", { children: /* @__PURE__ */ o(
478
+ h,
441
479
  {
442
480
  variant: "plain",
443
481
  size: 500,
444
482
  fullWidth: !0,
445
- as: i,
446
- href: l,
483
+ as: c,
484
+ href: l(u, a),
447
485
  children: [
448
486
  s,
449
- a
487
+ i
450
488
  ]
451
489
  }
452
- ) }, _)) })
490
+ ) }, C)) })
453
491
  ]
454
492
  }
455
493
  )
@@ -457,6 +495,6 @@ function x1({
457
495
  ] }) });
458
496
  }
459
497
  export {
460
- x1 as Header,
461
- d1 as SubHeader
498
+ N1 as Header,
499
+ p1 as SubHeader
462
500
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "highsoft-ui",
3
- "version": "1.0.13",
3
+ "version": "1.0.14",
4
4
  "description": "Highsoft UI",
5
5
  "type": "module",
6
6
  "main": "dist/main.js",