highsoft-ui 1.0.155 → 1.0.156
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.
- package/CLAUDE.md +35 -0
- package/dist/BrowserFrame-z7X66igu.js +133 -0
- package/dist/{Button-DSGsV45k.js → Button-CSYKfiMM.js} +1 -1
- package/dist/{ButtonGroup-DNTpDU-E.js → ButtonGroup-CRCpF1mq.js} +1 -1
- package/dist/{Checkbox-imALf2_N.js → Checkbox-Ve_qaCW-.js} +1 -1
- package/dist/{CodeBlock-7BTXXf30.js → CodeBlock-D5HGMQXp.js} +4 -4
- package/dist/{CookiePolicyModal-DulwuSp4.js → CookiePolicyModal-Jajmg0gS.js} +2 -2
- package/dist/{CopyCode-PbZbRLn-.js → CopyCode-B5XYKD2s.js} +2 -2
- package/dist/{Dropdown-c_EhnzqC.js → Dropdown-C7cw9SiY.js} +1 -1
- package/dist/{Footer-C6a3PeJq.js → Footer-Bjccchkp.js} +7 -7
- package/dist/{FooterBottom-DADUJdzz.js → FooterBottom-B4_6jDJ2.js} +1 -1
- package/dist/{FooterHelp-DN7Mdy40.js → FooterHelp-BODC1jYl.js} +1 -1
- package/dist/{FooterLinks-rrtsCIdv.js → FooterLinks-0FQT6GGH.js} +2 -2
- package/dist/{Header-BokKjfF7.js → Header-BIEG3fWi.js} +24 -24
- package/dist/{InputGrouped-BJEodhml.js → InputGrouped-Iz23ILtZ.js} +3 -3
- package/dist/{Label-BhFeSC8Z.js → Label-arNNMKJi.js} +1 -1
- package/dist/{NewsletterSignup-mPKBEpYq.js → NewsletterSignup-BwSHFFxv.js} +4 -4
- package/dist/{Notification-JovL5anc.js → Notification-Coii3TQE.js} +3 -3
- package/dist/{PrefPanel-DxSIkYDF.js → PrefPanel-DHotymro.js} +2 -2
- package/dist/{RoadmapDetails-ZnyXG2j7.js → RoadmapDetails-CtyefwR6.js} +5 -5
- package/dist/{Search-Cc9ZJgGx.js → Search-Dd2PjPua.js} +9 -9
- package/dist/{SearchDropdown-B5CFwNib.js → SearchDropdown-FVBycbSo.js} +1 -1
- package/dist/{VideoCover-BkbLsmQ_.js → VideoCover-bWmOXfeg.js} +1 -1
- package/dist/{VideoPlayer-CY63501h.js → VideoPlayer-cCv7zyDb.js} +3 -3
- package/dist/{VideoPlayerModal-DIHMoFgS.js → VideoPlayerModal-DXKK98WG.js} +2 -2
- package/dist/{YoutubeModal-DqBis8Cm.js → YoutubeModal-B-D2bQLx.js} +2 -2
- package/dist/components/BrowserFrame/index.js +2 -0
- package/dist/components/Button/index.js +1 -1
- package/dist/components/ButtonGroup/index.js +1 -1
- package/dist/components/Checkbox/index.js +1 -1
- package/dist/components/CodeBlock/index.js +1 -1
- package/dist/components/CopyCode/index.js +1 -1
- package/dist/components/Dropdown/index.js +1 -1
- package/dist/components/Footer/CookiePolicyModal.js +1 -1
- package/dist/components/Footer/FooterBottom.js +1 -1
- package/dist/components/Footer/FooterHelp.js +1 -1
- package/dist/components/Footer/FooterLinks.js +1 -1
- package/dist/components/Footer/YoutubeModal.js +1 -1
- package/dist/components/Footer/index.js +1 -1
- package/dist/components/Header/index.js +1 -1
- package/dist/components/InputGrouped/index.js +1 -1
- package/dist/components/Label/index.js +1 -1
- package/dist/components/Modal/ModalContactFooter.js +2 -2
- package/dist/components/Modal/index.js +2 -2
- package/dist/components/NewsletterSignup/index.js +1 -1
- package/dist/components/Notification/index.js +1 -1
- package/dist/components/PrefPanel/index.js +1 -1
- package/dist/components/RoadmapDetails/index.js +1 -1
- package/dist/components/Search/index.js +1 -1
- package/dist/components/SearchDropdown/index.js +1 -1
- package/dist/components/Sidebar/NavDisclosure.js +1 -1
- package/dist/components/Sidebar/NavGroup.js +1 -1
- package/dist/components/Sidebar/Sidebar.js +2 -2
- package/dist/components/Sidebar/SidebarLayout.js +1 -1
- package/dist/components/VideoCover/index.js +1 -1
- package/dist/components/VideoPlayer/VideoPlayerModal.js +1 -1
- package/dist/components/VideoPlayer/index.js +1 -1
- package/dist/{create-element-C3ORyDVw.js → create-element-E8WYUYfK.js} +1 -1
- package/dist/{esm-C4Ybr9s4.js → esm-bFdwg2E8.js} +70 -42
- package/dist/highsoft-ui.css +1 -1
- package/dist/lib/components/BrowserFrame/index.d.ts +83 -0
- package/dist/lib/main.d.ts +2 -0
- package/dist/main.js +43 -42
- package/dist/{prism-light-BLaY8zo6.js → prism-light-BTlrcsMq.js} +1 -1
- package/package.json +1 -1
package/CLAUDE.md
CHANGED
|
@@ -358,6 +358,41 @@ const a = 2 // [!code ++]`} />
|
|
|
358
358
|
- **`copyLabel`:** copy button label (default `'Copy code'`).
|
|
359
359
|
- Colors come from `--code-block-*` design tokens (light/dark automatic). Code renders in IBM Plex Mono — load `@fontsource/ibm-plex-mono` (or it falls back to the system monospace).
|
|
360
360
|
|
|
361
|
+
### BrowserFrame
|
|
362
|
+
Browser-window chrome around embedded content — a real `<iframe>` via `src`, or any children (a live demo, plain markup). Three bar variants share one shell.
|
|
363
|
+
```tsx
|
|
364
|
+
// Full: traffic lights, URL pill, View button opening href in a new tab
|
|
365
|
+
<BrowserFrame src="https://www.highcharts.com/samples/nonav/highcharts/website/homepage-defaults-demo"
|
|
366
|
+
displayUrl="https://www.highcharts.com/demo" title="Smart defaults demo" />
|
|
367
|
+
|
|
368
|
+
// Fullscreen action instead of View
|
|
369
|
+
<BrowserFrame src={url} action="fullscreen" title="…" />
|
|
370
|
+
|
|
371
|
+
// Mini: muted dots, centered explainer, external-link buttons
|
|
372
|
+
<BrowserFrame variant="mini" src={url} title="…"
|
|
373
|
+
explainer="World map with drilldown" explainerHref={demoUrl}
|
|
374
|
+
actions={[{ label: 'JSFiddle', href: fiddleUrl }, { label: 'CodePen', href: penUrl }]} />
|
|
375
|
+
|
|
376
|
+
// Plain chrome around children at their natural height
|
|
377
|
+
<BrowserFrame variant="plain" aspectRatio="auto">
|
|
378
|
+
<LiveChartDemo />
|
|
379
|
+
</BrowserFrame>
|
|
380
|
+
```
|
|
381
|
+
- **`variant`:** `full` (URL pill + action button, default) | `mini` (explainer line) | `plain` (dots only)
|
|
382
|
+
- **`src`:** embeds a real `<iframe>` (lazy-loaded; `sandbox`, `allow`, `allowFullScreen`, `referrerPolicy`, `loading` forwarded). **`children`** renders instead of an iframe. **`title`** is required with `src` — it names the iframe for AT.
|
|
383
|
+
- **`displayUrl`** — address shown in the pill (defaults to `src`); **`href`** — link target for the URL text and View button (defaults to `displayUrl`/`src`)
|
|
384
|
+
- **`action`:** `view` (default) | `fullscreen` | `none`. Fullscreen uses the Fullscreen API on the frame and falls back to opening `href` in a new tab when the API is missing (iOS Safari) or rejects (embedding page without `allowfullscreen`).
|
|
385
|
+
- **`explainer`** / **`explainerHref`** (mini), **`actions`** — external-link soft buttons
|
|
386
|
+
- **`dots`:** `color` | `muted` — defaults per variant (colored traffic lights on `full`, muted on `mini`/`plain`); override to force either
|
|
387
|
+
- **`aspectRatio`** (default `'3 / 2'`, `'auto'` = children flow naturally), **`width`**, **`height`** (fixed height overrides `aspectRatio`), **`radius`** (default `8`)
|
|
388
|
+
- **Bar geometry:** the bar is 40px (`plain` 34px) — 8px padding around 24px controls (size-100 `Button`s and the URL pill). Dots are 11px (`plain` 10px).
|
|
389
|
+
- **Theming:** the shell uses `--HS-*` tokens, so dark mode is automatic. The colored dots are the one sanctioned primitive use (`--primitives-danger/attention/success-400`) — decorative window realism with no semantic token, identical in both modes like macOS's own. **The site theme propagates into cross-origin embeds:** `[data-theme]` on the root maps to `color-scheme` on the iframe element, which is what `prefers-color-scheme` resolves from inside a frame — an embed that supports dark mode flips with the site, no JS involved. The default (no `data-theme`) is `light`, matching the tokens' own light-by-default behavior — the embed follows the chrome around it, never the OS directly. `ThemeLoader` resolves even the "system" preference to a concrete `data-theme`, so themed pages always drive it explicitly; nested `[data-theme='light']` sections inside a dark page are honored like the tokens honor them.
|
|
390
|
+
|
|
391
|
+
**Accessibility:**
|
|
392
|
+
- The window dots are decorative (`aria-hidden`); the embedded `<iframe>` carries `title` as its accessible name — describe what it shows.
|
|
393
|
+
- The URL text, explainer, and action buttons are real links/`Button`s: keyboard reachable, brand `:focus-visible` ring, `target="_blank"` with `rel="noreferrer"`. The Fullscreen button's label switches to "Exit fullscreen" while active.
|
|
394
|
+
- The frame itself is a non-interactive `<div>` — nothing in the tab order beyond its controls; no authored motion, so there's nothing to gate on `prefers-reduced-motion` beyond the shared Button tokens.
|
|
395
|
+
|
|
361
396
|
### Layout
|
|
362
397
|
```tsx
|
|
363
398
|
<Header />
|
|
@@ -0,0 +1,133 @@
|
|
|
1
|
+
import { t as e } from "./clsx-BWCAbrjV.js";
|
|
2
|
+
import { D as t, F as n, I as r, U as i } from "./esm-bFdwg2E8.js";
|
|
3
|
+
import { t as a } from "./Button-CSYKfiMM.js";
|
|
4
|
+
import { forwardRef as o, useCallback as s, useEffect as c, useRef as l, useState as u } from "react";
|
|
5
|
+
import { jsx as d, jsxs as f } from "react/jsx-runtime";
|
|
6
|
+
var p = {
|
|
7
|
+
actions: "VfGqmW_actions",
|
|
8
|
+
body: "VfGqmW_body",
|
|
9
|
+
bodyAspect: "VfGqmW_bodyAspect",
|
|
10
|
+
bodyFill: "VfGqmW_bodyFill",
|
|
11
|
+
content: "VfGqmW_content",
|
|
12
|
+
dot: "VfGqmW_dot",
|
|
13
|
+
dots: "VfGqmW_dots",
|
|
14
|
+
dotsColor: "VfGqmW_dotsColor",
|
|
15
|
+
explainer: "VfGqmW_explainer",
|
|
16
|
+
frame: "VfGqmW_frame",
|
|
17
|
+
iframe: "VfGqmW_iframe",
|
|
18
|
+
mini: "VfGqmW_mini",
|
|
19
|
+
plain: "VfGqmW_plain",
|
|
20
|
+
topBar: "VfGqmW_topBar",
|
|
21
|
+
url: "VfGqmW_url",
|
|
22
|
+
urlBar: "VfGqmW_urlBar"
|
|
23
|
+
}, m = o(({ variant: o = "full", src: m, displayUrl: h, href: g, action: _ = "view", actionLabel: v, explainer: y, explainerHref: b, actions: x, dots: S, aspectRatio: C = "3 / 2", width: w, height: T, radius: E = 8, title: D, loading: O = "lazy", sandbox: k, allow: A, allowFullScreen: j = !0, referrerPolicy: M, children: N, className: P, style: F, ...I }, L) => {
|
|
24
|
+
let R = l(null), [z, B] = u(!1), V = s((e) => {
|
|
25
|
+
R.current = e, typeof L == "function" ? L(e) : L && (L.current = e);
|
|
26
|
+
}, [L]);
|
|
27
|
+
c(() => {
|
|
28
|
+
let e = () => B(document.fullscreenElement === R.current);
|
|
29
|
+
return document.addEventListener("fullscreenchange", e), () => document.removeEventListener("fullscreenchange", e);
|
|
30
|
+
}, []), m && !D && console.warn("BrowserFrame: `title` is required with `src` — it names the iframe for assistive tech. Falling back to \"Embedded content\".");
|
|
31
|
+
let H = h ?? m, U = g ?? H, W = S ?? (o === "full" ? "color" : "muted"), G = T === void 0 && C !== "auto", K = s(() => {
|
|
32
|
+
let e = R.current;
|
|
33
|
+
if (!e) return;
|
|
34
|
+
let t = () => {
|
|
35
|
+
U && window.open(U, "_blank", "noopener,noreferrer");
|
|
36
|
+
};
|
|
37
|
+
document.fullscreenElement === e ? document.exitFullscreen().catch(() => {}) : e.requestFullscreen ? e.requestFullscreen().catch(t) : t();
|
|
38
|
+
}, [U]), q = o === "full" && _ !== "none" ? _ === "fullscreen" ? /* @__PURE__ */ d(a, {
|
|
39
|
+
variant: "soft",
|
|
40
|
+
size: 100,
|
|
41
|
+
iconRight: d(z ? t : i, {}),
|
|
42
|
+
onClick: K,
|
|
43
|
+
children: v ?? (z ? "Exit fullscreen" : "Fullscreen")
|
|
44
|
+
}) : U ? /* @__PURE__ */ d(a, {
|
|
45
|
+
variant: "soft",
|
|
46
|
+
size: 100,
|
|
47
|
+
iconRight: /* @__PURE__ */ d(r, {}),
|
|
48
|
+
href: U,
|
|
49
|
+
target: "_blank",
|
|
50
|
+
rel: "noreferrer",
|
|
51
|
+
children: v ?? "View"
|
|
52
|
+
}) : null : null, J = o === "mini" && y ? b ? /* @__PURE__ */ d("a", {
|
|
53
|
+
className: p.explainer,
|
|
54
|
+
href: b,
|
|
55
|
+
target: "_blank",
|
|
56
|
+
rel: "noreferrer",
|
|
57
|
+
children: y
|
|
58
|
+
}) : /* @__PURE__ */ d("span", {
|
|
59
|
+
className: p.explainer,
|
|
60
|
+
children: y
|
|
61
|
+
}) : null;
|
|
62
|
+
return /* @__PURE__ */ f("div", {
|
|
63
|
+
ref: V,
|
|
64
|
+
className: e(p.frame, o === "plain" && p.plain, o === "mini" && p.mini, P),
|
|
65
|
+
style: {
|
|
66
|
+
"--hsbf-radius": `${E}px`,
|
|
67
|
+
"--hsbf-aspect": G ? C : void 0,
|
|
68
|
+
width: w,
|
|
69
|
+
height: T,
|
|
70
|
+
...F
|
|
71
|
+
},
|
|
72
|
+
...I,
|
|
73
|
+
children: [/* @__PURE__ */ f("div", {
|
|
74
|
+
className: p.topBar,
|
|
75
|
+
children: [
|
|
76
|
+
/* @__PURE__ */ f("span", {
|
|
77
|
+
className: e(p.dots, W === "color" && p.dotsColor),
|
|
78
|
+
"aria-hidden": "true",
|
|
79
|
+
children: [
|
|
80
|
+
/* @__PURE__ */ d("span", { className: p.dot }),
|
|
81
|
+
/* @__PURE__ */ d("span", { className: p.dot }),
|
|
82
|
+
/* @__PURE__ */ d("span", { className: p.dot })
|
|
83
|
+
]
|
|
84
|
+
}),
|
|
85
|
+
o === "full" && H && /* @__PURE__ */ d("span", {
|
|
86
|
+
className: p.urlBar,
|
|
87
|
+
children: U ? /* @__PURE__ */ d("a", {
|
|
88
|
+
className: p.url,
|
|
89
|
+
href: U,
|
|
90
|
+
target: "_blank",
|
|
91
|
+
rel: "noreferrer",
|
|
92
|
+
children: H
|
|
93
|
+
}) : /* @__PURE__ */ d("span", {
|
|
94
|
+
className: p.url,
|
|
95
|
+
children: H
|
|
96
|
+
})
|
|
97
|
+
}),
|
|
98
|
+
q,
|
|
99
|
+
J,
|
|
100
|
+
x && x.length > 0 && /* @__PURE__ */ d("span", {
|
|
101
|
+
className: p.actions,
|
|
102
|
+
children: x.map((e) => /* @__PURE__ */ d(a, {
|
|
103
|
+
variant: "soft",
|
|
104
|
+
size: 100,
|
|
105
|
+
iconRight: /* @__PURE__ */ d(n, {}),
|
|
106
|
+
href: e.href,
|
|
107
|
+
target: "_blank",
|
|
108
|
+
rel: "noreferrer",
|
|
109
|
+
children: e.label
|
|
110
|
+
}, `${e.label}-${e.href}`))
|
|
111
|
+
})
|
|
112
|
+
]
|
|
113
|
+
}), /* @__PURE__ */ f("div", {
|
|
114
|
+
className: e(p.body, G && p.bodyAspect, (G || T !== void 0) && p.bodyFill),
|
|
115
|
+
children: [m && !N && /* @__PURE__ */ d("iframe", {
|
|
116
|
+
className: p.iframe,
|
|
117
|
+
src: m,
|
|
118
|
+
title: D ?? "Embedded content",
|
|
119
|
+
loading: O,
|
|
120
|
+
sandbox: k,
|
|
121
|
+
allow: A,
|
|
122
|
+
allowFullScreen: j,
|
|
123
|
+
referrerPolicy: M
|
|
124
|
+
}), N && /* @__PURE__ */ d("div", {
|
|
125
|
+
className: p.content,
|
|
126
|
+
children: N
|
|
127
|
+
})]
|
|
128
|
+
})]
|
|
129
|
+
});
|
|
130
|
+
});
|
|
131
|
+
m.displayName = "BrowserFrame";
|
|
132
|
+
//#endregion
|
|
133
|
+
export { m as t };
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { t as e } from "./clsx-BWCAbrjV.js";
|
|
2
|
-
import { M as t } from "./esm-
|
|
2
|
+
import { M as t } from "./esm-bFdwg2E8.js";
|
|
3
3
|
import { createContext as n, useCallback as r, useContext as i, useEffect as a, useId as o, useRef as s, useState as c } from "react";
|
|
4
4
|
import { jsx as l, jsxs as u } from "react/jsx-runtime";
|
|
5
5
|
var d = {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { r as e, s as t } from "./utils-K9S_6_Eq.js";
|
|
2
2
|
import { t as n } from "./clsx-BWCAbrjV.js";
|
|
3
|
-
import {
|
|
4
|
-
import { t as a } from "./Button-
|
|
3
|
+
import { G as r, Z as i } from "./esm-bFdwg2E8.js";
|
|
4
|
+
import { t as a } from "./Button-CSYKfiMM.js";
|
|
5
5
|
import { t as o } from "./FrameworkIcon-D7N3PjYr.js";
|
|
6
6
|
import { Fragment as s, forwardRef as c, useCallback as l, useEffect as u, useMemo as d, useState as f } from "react";
|
|
7
7
|
import { jsx as p, jsxs as m } from "react/jsx-runtime";
|
|
@@ -22,8 +22,8 @@ var h = {
|
|
|
22
22
|
}, g = null;
|
|
23
23
|
function _() {
|
|
24
24
|
return g ||= Promise.all([
|
|
25
|
-
import("./prism-light-
|
|
26
|
-
import("./create-element-
|
|
25
|
+
import("./prism-light-BTlrcsMq.js"),
|
|
26
|
+
import("./create-element-E8WYUYfK.js").then((e) => e.n),
|
|
27
27
|
import("./jsx-B57trbk8.js"),
|
|
28
28
|
import("./tsx-CJFgwLf7.js"),
|
|
29
29
|
import("./json-Bfzk2Msc.js"),
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { t as e } from "./esm-
|
|
2
|
-
import { t } from "./Button-
|
|
1
|
+
import { t as e } from "./esm-bFdwg2E8.js";
|
|
2
|
+
import { t } from "./Button-CSYKfiMM.js";
|
|
3
3
|
import { a as n, i as r, n as i, o as a, r as o, s, t as c } from "./dist-f0z6DapB.js";
|
|
4
4
|
import { useEffect as l, useRef as u, useState as d } from "react";
|
|
5
5
|
import { jsx as f, jsxs as p } from "react/jsx-runtime";
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { r as e, s as t } from "./utils-K9S_6_Eq.js";
|
|
2
2
|
import { t as n } from "./clsx-BWCAbrjV.js";
|
|
3
|
-
import {
|
|
4
|
-
import { t as a } from "./Button-
|
|
3
|
+
import { G as r, Z as i } from "./esm-bFdwg2E8.js";
|
|
4
|
+
import { t as a } from "./Button-CSYKfiMM.js";
|
|
5
5
|
import { forwardRef as o, useCallback as s } from "react";
|
|
6
6
|
import { jsx as c, jsxs as l } from "react/jsx-runtime";
|
|
7
7
|
var u = {
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { t as e } from "./clsx-BWCAbrjV.js";
|
|
2
|
-
import {
|
|
2
|
+
import { Z as t } from "./esm-bFdwg2E8.js";
|
|
3
3
|
import { t as n } from "./Icon-VeXJMj8Q.js";
|
|
4
4
|
import { _ as r, a as i, c as a, d as o, g as s, h as c, i as l, l as u, m as d, n as f, o as p, p as m, r as h, t as g, u as _, v, y } from "./es2015-DWa0ZZ7A.js";
|
|
5
5
|
import { a as ee, i as b, n as te, r as x, t as S } from "./dist-CE9LFbij.js";
|
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
import { r as e } from "./utils-K9S_6_Eq.js";
|
|
2
|
-
import {
|
|
3
|
-
import { t as r } from "./Button-
|
|
2
|
+
import { K as t, Z as n } from "./esm-bFdwg2E8.js";
|
|
3
|
+
import { t as r } from "./Button-CSYKfiMM.js";
|
|
4
4
|
import { t as i } from "./Container-BDssaLig.js";
|
|
5
5
|
import { t as a } from "./DiscordInvite-CLYxexdH.js";
|
|
6
6
|
import { t as o } from "./Logo-Bz0G2G-k.js";
|
|
7
|
-
import { t as s } from "./NewsletterSignup-
|
|
8
|
-
import { t as c } from "./FooterBottom-
|
|
9
|
-
import { t as l } from "./FooterHelp-
|
|
10
|
-
import { t as u } from "./FooterLinks-
|
|
11
|
-
import { t as d } from "./YoutubeModal-
|
|
7
|
+
import { t as s } from "./NewsletterSignup-BwSHFFxv.js";
|
|
8
|
+
import { t as c } from "./FooterBottom-B4_6jDJ2.js";
|
|
9
|
+
import { t as l } from "./FooterHelp-BODC1jYl.js";
|
|
10
|
+
import { t as u } from "./FooterLinks-0FQT6GGH.js";
|
|
11
|
+
import { t as d } from "./YoutubeModal-B-D2bQLx.js";
|
|
12
12
|
import { jsx as f, jsxs as p } from "react/jsx-runtime";
|
|
13
13
|
var m = {
|
|
14
14
|
discordCard: "_4W4F3q_discordCard",
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { a as e, t } from "./utils-K9S_6_Eq.js";
|
|
2
2
|
import { a as n, c as r, i, n as a, o, r as s, s as c, t as l } from "./fa-B95RwBpz.js";
|
|
3
3
|
import { t as u } from "./Typography-AvvBRu-u.js";
|
|
4
|
-
import { t as d } from "./CookiePolicyModal-
|
|
4
|
+
import { t as d } from "./CookiePolicyModal-Jajmg0gS.js";
|
|
5
5
|
import { Fragment as f, jsx as p, jsxs as m } from "react/jsx-runtime";
|
|
6
6
|
//#region node_modules/react-icons/fa6/index.mjs
|
|
7
7
|
function h(e) {
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { a as e, t } from "./utils-K9S_6_Eq.js";
|
|
2
|
-
import { d as n, g as r } from "./esm-
|
|
2
|
+
import { d as n, g as r } from "./esm-bFdwg2E8.js";
|
|
3
3
|
import { t as i } from "./Icon-VeXJMj8Q.js";
|
|
4
4
|
import { o as a, r as o } from "./fa-B95RwBpz.js";
|
|
5
5
|
import { t as s } from "./Typography-AvvBRu-u.js";
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { t as e } from "./clsx-BWCAbrjV.js";
|
|
2
|
-
import { P as t } from "./esm-
|
|
2
|
+
import { P as t } from "./esm-bFdwg2E8.js";
|
|
3
3
|
import { t as n } from "./Icon-VeXJMj8Q.js";
|
|
4
4
|
import { t as r } from "./Typography-AvvBRu-u.js";
|
|
5
|
-
import { t as i } from "./Label-
|
|
5
|
+
import { t as i } from "./Label-arNNMKJi.js";
|
|
6
6
|
import a from "./components/icons/MadeInNorway.js";
|
|
7
7
|
import { jsx as o, jsxs as s } from "react/jsx-runtime";
|
|
8
8
|
var c = {
|
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
import { a as e, d as t, i as n, o as r, u as i } from "./utils-K9S_6_Eq.js";
|
|
2
2
|
import { t as a } from "./clsx-BWCAbrjV.js";
|
|
3
|
-
import { O as o, Q as s,
|
|
4
|
-
import { t as _ } from "./Button-
|
|
3
|
+
import { O as o, Q as s, b as c, et as l, f as u, k as d, p as f, rt as p, s as m, t as h, z as g } from "./esm-bFdwg2E8.js";
|
|
4
|
+
import { t as _ } from "./Button-CSYKfiMM.js";
|
|
5
5
|
import { t as v } from "./Container-BDssaLig.js";
|
|
6
6
|
import { t as y } from "./Logo-Bz0G2G-k.js";
|
|
7
|
-
import { t as b } from "./PrefPanel-
|
|
8
|
-
import { t as x } from "./Search-
|
|
9
|
-
import { t as S } from "./Label-
|
|
10
|
-
import { t as C } from "./Notification-
|
|
7
|
+
import { t as b } from "./PrefPanel-DHotymro.js";
|
|
8
|
+
import { t as x } from "./Search-Dd2PjPua.js";
|
|
9
|
+
import { t as S } from "./Label-arNNMKJi.js";
|
|
10
|
+
import { t as C } from "./Notification-Coii3TQE.js";
|
|
11
11
|
import { useEffect as w, useRef as T, useState as E } from "react";
|
|
12
12
|
import { Fragment as D, jsx as O, jsxs as k } from "react/jsx-runtime";
|
|
13
13
|
var A = {
|
|
@@ -75,12 +75,12 @@ var A = {
|
|
|
75
75
|
{
|
|
76
76
|
title: "Products",
|
|
77
77
|
url: "https://www.highcharts.com/products/",
|
|
78
|
-
icon: /* @__PURE__ */ O(
|
|
78
|
+
icon: /* @__PURE__ */ O(s, {})
|
|
79
79
|
},
|
|
80
80
|
{
|
|
81
81
|
title: "Demos",
|
|
82
82
|
url: "https://www.highcharts.com/demo",
|
|
83
|
-
icon: /* @__PURE__ */ O(
|
|
83
|
+
icon: /* @__PURE__ */ O(c, {})
|
|
84
84
|
},
|
|
85
85
|
{
|
|
86
86
|
title: "Support",
|
|
@@ -90,17 +90,17 @@ var A = {
|
|
|
90
90
|
{
|
|
91
91
|
title: "Resources",
|
|
92
92
|
url: "https://www.highcharts.com/resources/",
|
|
93
|
-
icon: /* @__PURE__ */ O(
|
|
93
|
+
icon: /* @__PURE__ */ O(g, {})
|
|
94
94
|
},
|
|
95
95
|
{
|
|
96
96
|
title: "Pricing",
|
|
97
97
|
url: "https://shop.highcharts.com/",
|
|
98
|
-
icon: /* @__PURE__ */ O(
|
|
98
|
+
icon: /* @__PURE__ */ O(l, {})
|
|
99
99
|
},
|
|
100
100
|
{
|
|
101
101
|
title: "Blog",
|
|
102
102
|
url: "https://www.highcharts.com/blog/home/",
|
|
103
|
-
icon: /* @__PURE__ */ O(
|
|
103
|
+
icon: /* @__PURE__ */ O(p, {})
|
|
104
104
|
}
|
|
105
105
|
];
|
|
106
106
|
function B(e, t) {
|
|
@@ -193,28 +193,28 @@ function Y() {
|
|
|
193
193
|
e && R(M, e);
|
|
194
194
|
}, [e]), null;
|
|
195
195
|
}
|
|
196
|
-
function X({ subItems: t, children: r, notifications: o = J, link: s = "a", host: c = "https://www.highcharts.com", pathname: l, cssVariable:
|
|
196
|
+
function X({ subItems: t, children: r, notifications: o = J, link: s = "a", host: c = "https://www.highcharts.com", pathname: l, cssVariable: p, position: g = "sticky" }) {
|
|
197
197
|
let S = e("(max-width: 374px)"), w = e("(max-width: 849px)"), M = e("(max-width: 1300px)"), N = G(t), P = T(null), [F, L] = E(!1), [V, H] = E([]);
|
|
198
198
|
n(() => {
|
|
199
199
|
let e = P.current;
|
|
200
200
|
if (!e) return;
|
|
201
201
|
let n = t?.length ? N ? U : W : 0, r = 82 + V.length * 48 + n, i = -(82 + V.length * 48);
|
|
202
|
-
if (g === "static") return e.style.transform = "",
|
|
203
|
-
e.style.transform = "",
|
|
202
|
+
if (g === "static") return e.style.transform = "", p && document.documentElement.style.setProperty("--header-bottom", `${r}px`), () => {
|
|
203
|
+
e.style.transform = "", p && document.documentElement.style.removeProperty("--header-bottom");
|
|
204
204
|
};
|
|
205
205
|
let a = window.scrollY, o = 0, s = null, c = null, l = () => {
|
|
206
|
-
c = null, !(!e || s === o) && (e.style.transform = `translate3d(0, ${o}px, 0)`,
|
|
206
|
+
c = null, !(!e || s === o) && (e.style.transform = `translate3d(0, ${o}px, 0)`, p && document.documentElement.style.setProperty("--header-bottom", `${r + o}px`), s = o);
|
|
207
207
|
};
|
|
208
208
|
l();
|
|
209
|
-
let
|
|
209
|
+
let u = () => {
|
|
210
210
|
let e = window.scrollY, t = e - a;
|
|
211
211
|
a = e, o = Math.min(0, Math.max(i, o - t)), c === null && (c = window.requestAnimationFrame(l));
|
|
212
212
|
};
|
|
213
|
-
return window.addEventListener("scroll",
|
|
214
|
-
window.removeEventListener("scroll",
|
|
213
|
+
return window.addEventListener("scroll", u, { passive: !0 }), () => {
|
|
214
|
+
window.removeEventListener("scroll", u), c !== null && cancelAnimationFrame(c), e.style.transform = "", p && document.documentElement.style.removeProperty("--header-bottom");
|
|
215
215
|
};
|
|
216
216
|
}, [
|
|
217
|
-
|
|
217
|
+
p,
|
|
218
218
|
N,
|
|
219
219
|
V.length,
|
|
220
220
|
g,
|
|
@@ -289,7 +289,7 @@ function X({ subItems: t, children: r, notifications: o = J, link: s = "a", host
|
|
|
289
289
|
children: [/* @__PURE__ */ O("span", {
|
|
290
290
|
className: A.gpt,
|
|
291
291
|
children: "Highcharts Assist"
|
|
292
|
-
}), /* @__PURE__ */ O(
|
|
292
|
+
}), /* @__PURE__ */ O(u, {})]
|
|
293
293
|
}) }),
|
|
294
294
|
/* @__PURE__ */ O("li", { children: /* @__PURE__ */ O(x, {}) }),
|
|
295
295
|
/* @__PURE__ */ O("li", { children: /* @__PURE__ */ O(b, {}) }),
|
|
@@ -299,7 +299,7 @@ function X({ subItems: t, children: r, notifications: o = J, link: s = "a", host
|
|
|
299
299
|
as: s,
|
|
300
300
|
href: B("https://shop.highcharts.com/", c),
|
|
301
301
|
"aria-label": "Buy Now",
|
|
302
|
-
children: [/* @__PURE__ */ O(
|
|
302
|
+
children: [/* @__PURE__ */ O(f, {}), "Buy Now"]
|
|
303
303
|
}) }),
|
|
304
304
|
/* @__PURE__ */ O("li", { children: /* @__PURE__ */ k(_, {
|
|
305
305
|
className: A.cta,
|
|
@@ -312,7 +312,7 @@ function X({ subItems: t, children: r, notifications: o = J, link: s = "a", host
|
|
|
312
312
|
variant: F ? "soft" : "transparent",
|
|
313
313
|
className: A.menu,
|
|
314
314
|
onClick: X,
|
|
315
|
-
children: [F ? "Close" : "Menu", O(F ? h :
|
|
315
|
+
children: [F ? "Close" : "Menu", O(F ? h : d, {})]
|
|
316
316
|
}) })
|
|
317
317
|
]
|
|
318
318
|
})
|
|
@@ -349,7 +349,7 @@ function X({ subItems: t, children: r, notifications: o = J, link: s = "a", host
|
|
|
349
349
|
children: [/* @__PURE__ */ O("span", {
|
|
350
350
|
className: A.gpt,
|
|
351
351
|
children: "Highcharts Assist"
|
|
352
|
-
}), /* @__PURE__ */ O(
|
|
352
|
+
}), /* @__PURE__ */ O(u, {})]
|
|
353
353
|
}) }),
|
|
354
354
|
/* @__PURE__ */ O("li", { children: /* @__PURE__ */ O(x, {}) }),
|
|
355
355
|
/* @__PURE__ */ O("li", { children: /* @__PURE__ */ O(b, {}) })
|
|
@@ -363,7 +363,7 @@ function X({ subItems: t, children: r, notifications: o = J, link: s = "a", host
|
|
|
363
363
|
fullWidth: !0,
|
|
364
364
|
as: s,
|
|
365
365
|
href: B("https://shop.highcharts.com/", c),
|
|
366
|
-
children: [/* @__PURE__ */ O(
|
|
366
|
+
children: [/* @__PURE__ */ O(f, {}), "Buy Now"]
|
|
367
367
|
}) }), /* @__PURE__ */ O("li", { children: /* @__PURE__ */ k(_, {
|
|
368
368
|
variant: "success",
|
|
369
369
|
fullWidth: !0,
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { t as e } from "./clsx-BWCAbrjV.js";
|
|
2
|
-
import {
|
|
3
|
-
import { t as i } from "./Button-
|
|
2
|
+
import { H as t, V as n, Y as r } from "./esm-bFdwg2E8.js";
|
|
3
|
+
import { t as i } from "./Button-CSYKfiMM.js";
|
|
4
4
|
import { forwardRef as a, useCallback as o, useEffect as s, useRef as c, useState as l } from "react";
|
|
5
5
|
import { jsx as u, jsxs as d } from "react/jsx-runtime";
|
|
6
6
|
var f = {
|
|
@@ -130,7 +130,7 @@ var h = a(({ label: r, required: a = !1, helpText: p, showHelpText: m = !1, labe
|
|
|
130
130
|
e.stopPropagation(), R((e) => !e);
|
|
131
131
|
},
|
|
132
132
|
"aria-label": L ? "Hide password" : "Show password",
|
|
133
|
-
children: u(L ?
|
|
133
|
+
children: u(L ? n : t, {})
|
|
134
134
|
}),
|
|
135
135
|
_
|
|
136
136
|
]
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { l as e } from "./utils-K9S_6_Eq.js";
|
|
2
2
|
import { t } from "./clsx-BWCAbrjV.js";
|
|
3
|
-
import {
|
|
4
|
-
import { t as a } from "./Button-
|
|
3
|
+
import { R as n, X as r, rt as i } from "./esm-bFdwg2E8.js";
|
|
4
|
+
import { t as a } from "./Button-CSYKfiMM.js";
|
|
5
5
|
import { t as o } from "./Icon-VeXJMj8Q.js";
|
|
6
6
|
import { t as s } from "./Link-CYR92_U0.js";
|
|
7
7
|
import { t as c } from "./InputSolo-DUdKtZjX.js";
|
|
@@ -78,7 +78,7 @@ function g({ link: g = "a", privacyUrl: _ = "https://www.highcharts.com/privacy/
|
|
|
78
78
|
L ? /* @__PURE__ */ m("div", {
|
|
79
79
|
className: h.content,
|
|
80
80
|
children: [/* @__PURE__ */ p(o, {
|
|
81
|
-
name:
|
|
81
|
+
name: n,
|
|
82
82
|
size: 16
|
|
83
83
|
}), E ? "Check your inbox and confirm your email to finish signing up." : "You’re already subscribed to our newsletter."]
|
|
84
84
|
}) : /* @__PURE__ */ m("form", {
|
|
@@ -104,7 +104,7 @@ function g({ link: g = "a", privacyUrl: _ = "https://www.highcharts.com/privacy/
|
|
|
104
104
|
variant: "success",
|
|
105
105
|
disabled: !0,
|
|
106
106
|
children: [/* @__PURE__ */ p(o, {
|
|
107
|
-
name:
|
|
107
|
+
name: r,
|
|
108
108
|
size: 16
|
|
109
109
|
}), "You’re in"]
|
|
110
110
|
}) : /* @__PURE__ */ p(a, {
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { t as e } from "./clsx-BWCAbrjV.js";
|
|
2
|
-
import { t } from "./esm-
|
|
3
|
-
import { t as n } from "./Button-
|
|
2
|
+
import { t } from "./esm-bFdwg2E8.js";
|
|
3
|
+
import { t as n } from "./Button-CSYKfiMM.js";
|
|
4
4
|
import { t as r } from "./Container-BDssaLig.js";
|
|
5
|
-
import { t as i } from "./Label-
|
|
5
|
+
import { t as i } from "./Label-arNNMKJi.js";
|
|
6
6
|
import { useEffect as a, useState as o } from "react";
|
|
7
7
|
import { Fragment as s, jsx as c, jsxs as l } from "react/jsx-runtime";
|
|
8
8
|
var u = {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { d as e, o as t } from "./utils-K9S_6_Eq.js";
|
|
2
2
|
import { t as n } from "./clsx-BWCAbrjV.js";
|
|
3
|
-
import { T as r,
|
|
4
|
-
import { t as c } from "./Button-
|
|
3
|
+
import { T as r, Z as i, h as a, l as o, w as s } from "./esm-bFdwg2E8.js";
|
|
4
|
+
import { t as c } from "./Button-CSYKfiMM.js";
|
|
5
5
|
import { _ as l, a as u, d, h as f, i as p, l as m, m as h, n as ee, o as g, p as _, r as v, t as y, u as b, y as x } from "./es2015-DWa0ZZ7A.js";
|
|
6
6
|
import { a as S, i as te, n as C, r as w, t as T } from "./dist-B04QoImH.js";
|
|
7
7
|
import * as E from "react";
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { t as e } from "./clsx-BWCAbrjV.js";
|
|
2
|
-
import { F as t,
|
|
3
|
-
import { t as a } from "./Button-
|
|
2
|
+
import { F as t, Y as n, c as r, j as i } from "./esm-bFdwg2E8.js";
|
|
3
|
+
import { t as a } from "./Button-CSYKfiMM.js";
|
|
4
4
|
import { t as o } from "./Typography-AvvBRu-u.js";
|
|
5
5
|
import { useEffect as s, useRef as c } from "react";
|
|
6
6
|
import { jsx as l, jsxs as u } from "react/jsx-runtime";
|
|
@@ -46,7 +46,7 @@ function f({ title: f, items: p, primaryAction: m, meta: h, open: g, defaultOpen
|
|
|
46
46
|
}), /* @__PURE__ */ l("span", {
|
|
47
47
|
className: d.chevron,
|
|
48
48
|
"aria-hidden": "true",
|
|
49
|
-
children: /* @__PURE__ */ l(
|
|
49
|
+
children: /* @__PURE__ */ l(n, {})
|
|
50
50
|
})]
|
|
51
51
|
}),
|
|
52
52
|
p && p.length > 0 && /* @__PURE__ */ l("ul", {
|
|
@@ -56,7 +56,7 @@ function f({ title: f, items: p, primaryAction: m, meta: h, open: g, defaultOpen
|
|
|
56
56
|
children: [/* @__PURE__ */ l("span", {
|
|
57
57
|
className: d.itemIcon,
|
|
58
58
|
"aria-hidden": "true",
|
|
59
|
-
children: e.icon ?? /* @__PURE__ */ l(
|
|
59
|
+
children: e.icon ?? /* @__PURE__ */ l(r, {})
|
|
60
60
|
}), /* @__PURE__ */ l(o, {
|
|
61
61
|
as: "span",
|
|
62
62
|
size: 200,
|
|
@@ -68,7 +68,7 @@ function f({ title: f, items: p, primaryAction: m, meta: h, open: g, defaultOpen
|
|
|
68
68
|
(m || h) && /* @__PURE__ */ u("div", {
|
|
69
69
|
className: d.actions,
|
|
70
70
|
children: [m && ((e) => {
|
|
71
|
-
let n = e.variant ?? "neutral",
|
|
71
|
+
let n = e.variant ?? "neutral", r = l(n === "soft" ? t : i, {}), o = e.icon === null ? void 0 : e.icon === void 0 ? r : e.icon;
|
|
72
72
|
return /* @__PURE__ */ l(a, {
|
|
73
73
|
variant: n,
|
|
74
74
|
size: 200,
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { a as e, i as t, n, o as r, r as i, t as a } from "./chunk-jwUa06l-.js";
|
|
2
|
-
import { $ as o,
|
|
3
|
-
import { t as v } from "./Button-
|
|
2
|
+
import { $ as o, B as s, L as c, S as l, W as u, it as d, m as f, nt as p, p as m, tt as h, v as g, y as _ } from "./esm-bFdwg2E8.js";
|
|
3
|
+
import { t as v } from "./Button-CSYKfiMM.js";
|
|
4
4
|
import { d as y, h as b, l as x, m as S, p as C, u as w } from "./es2015-DWa0ZZ7A.js";
|
|
5
5
|
import { t as ee } from "./dist-J9cXmrDi.js";
|
|
6
6
|
import { i as T, n as E, r as D, t as O } from "./dist-CE9LFbij.js";
|
|
@@ -4503,11 +4503,11 @@ function Wt() {
|
|
|
4503
4503
|
}, ue = {
|
|
4504
4504
|
products: /* @__PURE__ */ F(f, {}),
|
|
4505
4505
|
demo: /* @__PURE__ */ F(l, {}),
|
|
4506
|
-
docs: /* @__PURE__ */ F(
|
|
4507
|
-
blog: /* @__PURE__ */ F(
|
|
4506
|
+
docs: /* @__PURE__ */ F(o, {}),
|
|
4507
|
+
blog: /* @__PURE__ */ F(d, {}),
|
|
4508
4508
|
misc: /* @__PURE__ */ F(c, {}),
|
|
4509
4509
|
shop: /* @__PURE__ */ F(m, {}),
|
|
4510
|
-
file: /* @__PURE__ */ F(
|
|
4510
|
+
file: /* @__PURE__ */ F(s, {})
|
|
4511
4511
|
};
|
|
4512
4512
|
return /* @__PURE__ */ I(ie, {
|
|
4513
4513
|
open: a,
|
|
@@ -4517,7 +4517,7 @@ function Wt() {
|
|
|
4517
4517
|
children: /* @__PURE__ */ F(v, {
|
|
4518
4518
|
variant: "transparent",
|
|
4519
4519
|
"aria-label": "Search",
|
|
4520
|
-
children: /* @__PURE__ */ F(
|
|
4520
|
+
children: /* @__PURE__ */ F(g, {})
|
|
4521
4521
|
})
|
|
4522
4522
|
}), /* @__PURE__ */ I(k, { children: [/* @__PURE__ */ F(A, { className: Z.overlay }), /* @__PURE__ */ I(ne, {
|
|
4523
4523
|
className: Z.search,
|
|
@@ -4526,7 +4526,7 @@ function Wt() {
|
|
|
4526
4526
|
/* @__PURE__ */ F(ee, { children: /* @__PURE__ */ F(te, { children: "Search" }) }),
|
|
4527
4527
|
/* @__PURE__ */ I("label", {
|
|
4528
4528
|
className: Z.label,
|
|
4529
|
-
children: [/* @__PURE__ */ F(
|
|
4529
|
+
children: [/* @__PURE__ */ F(_, {}), /* @__PURE__ */ F("input", {
|
|
4530
4530
|
className: Z.input,
|
|
4531
4531
|
placeholder: "Search charts, tutorials, blog posts, or keywords...",
|
|
4532
4532
|
ref: S,
|
|
@@ -4601,14 +4601,14 @@ function Wt() {
|
|
|
4601
4601
|
className: Z.bottomGroup,
|
|
4602
4602
|
children: [/* @__PURE__ */ I("div", {
|
|
4603
4603
|
className: Z.bottomIcons,
|
|
4604
|
-
children: [/* @__PURE__ */ F("span", { children: /* @__PURE__ */ F(
|
|
4604
|
+
children: [/* @__PURE__ */ F("span", { children: /* @__PURE__ */ F(p, {}) }), /* @__PURE__ */ F("span", { children: /* @__PURE__ */ F(h, {}) })]
|
|
4605
4605
|
}), "Navigate"]
|
|
4606
4606
|
}),
|
|
4607
4607
|
/* @__PURE__ */ I("div", {
|
|
4608
4608
|
className: Z.bottomGroup,
|
|
4609
4609
|
children: [/* @__PURE__ */ F("div", {
|
|
4610
4610
|
className: Z.bottomIcons,
|
|
4611
|
-
children: /* @__PURE__ */ F("span", { children: /* @__PURE__ */ F(
|
|
4611
|
+
children: /* @__PURE__ */ F("span", { children: /* @__PURE__ */ F(u, {}) })
|
|
4612
4612
|
}), "Select"]
|
|
4613
4613
|
}),
|
|
4614
4614
|
/* @__PURE__ */ I("div", {
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { t as e } from "./clsx-BWCAbrjV.js";
|
|
2
|
-
import { _ as t } from "./esm-
|
|
2
|
+
import { _ as t } from "./esm-bFdwg2E8.js";
|
|
3
3
|
import { t as n } from "./Icon-VeXJMj8Q.js";
|
|
4
4
|
import { t as r } from "./InputSolo-DUdKtZjX.js";
|
|
5
5
|
import { useCallback as i, useEffect as a, useId as o, useMemo as s, useRef as c, useState as l } from "react";
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { t as e } from "./clsx-BWCAbrjV.js";
|
|
2
|
-
import {
|
|
2
|
+
import { at as t } from "./esm-bFdwg2E8.js";
|
|
3
3
|
import { t as n } from "./Icon-VeXJMj8Q.js";
|
|
4
4
|
import { t as r } from "./Typography-AvvBRu-u.js";
|
|
5
5
|
import { forwardRef as i, useCallback as a, useEffect as o, useRef as s, useState as c } from "react";
|