highsoft-ui 1.0.46 → 1.0.48

package/dist/components/Header/index.js

@@ -1,15 +1,15 @@
-import { jsx as e, jsxs as o, Fragment as I } from "react/jsx-runtime";
+import { jsx as e, jsxs as o, Fragment as V } from "react/jsx-runtime";
 import { useState as S, useEffect as q } from "react";
-import { J as z } from "../../index-CMegByeX.js";
-import { _ as d, B as l } from "../../index-DKE1ODpv.js";
-import { N as J, X as A } from "../../index-BFhQ-SSv.js";
-import { c as g } from "../../clsx-OuTLNxxd.js";
-import { Container as O } from "../Container/index.js";
+import { u as M, J as z } from "../../utils-xhWUdTOZ.js";
+import { _ as m } from "../../extends-hS2Bh-Yp.js";
+import { N as J, X as A } from "../../index-CUjEIxqY.js";
+import { c as v } from "../../clsx-OuTLNxxd.js";
+import { Button as l } from "../Button/index.js";
+import { Container as I } from "../Container/index.js";
 import { ThemedLogo as L } from "../Logo/index.js";
 import { PrefPanel as T } from "../PrefPanel/index.js";
-import { useMediaQuery as M } from "../../utils.js";
 var G = function(n) {
-  return /* @__PURE__ */ e("svg", d({
+  return /* @__PURE__ */ e("svg", m({
     xmlns: "http://www.w3.org/2000/svg",
     width: 24,
     height: 24,
@@ -25,7 +25,7 @@ var G = function(n) {
     })
   }));
 }, F = function(n) {
-  return /* @__PURE__ */ e("svg", d({
+  return /* @__PURE__ */ e("svg", m({
     xmlns: "http://www.w3.org/2000/svg",
     width: 24,
     height: 24,
@@ -41,7 +41,7 @@ var G = function(n) {
     })
   }));
 }, Q = function(n) {
-  return /* @__PURE__ */ e("svg", d({
+  return /* @__PURE__ */ e("svg", m({
     xmlns: "http://www.w3.org/2000/svg",
     width: 24,
     height: 24,
@@ -57,7 +57,7 @@ var G = function(n) {
     })
   }));
 }, R = function(n) {
-  return /* @__PURE__ */ e("svg", d({
+  return /* @__PURE__ */ e("svg", m({
     xmlns: "http://www.w3.org/2000/svg",
     width: 24,
     height: 24,
@@ -73,7 +73,7 @@ var G = function(n) {
     })
   }));
 }, X = function(n) {
-  return /* @__PURE__ */ e("svg", d({
+  return /* @__PURE__ */ e("svg", m({
     xmlns: "http://www.w3.org/2000/svg",
     width: 24,
     height: 24,
@@ -89,7 +89,7 @@ var G = function(n) {
     })
   }));
 }, $ = function(n) {
-  return /* @__PURE__ */ e("svg", d({
+  return /* @__PURE__ */ e("svg", m({
     xmlns: "http://www.w3.org/2000/svg",
     width: 24,
     height: 24,
@@ -105,7 +105,7 @@ var G = function(n) {
     })
   }));
 }, D = function(n) {
-  return /* @__PURE__ */ e("svg", d({
+  return /* @__PURE__ */ e("svg", m({
     xmlns: "http://www.w3.org/2000/svg",
     width: 24,
     height: 24,
@@ -121,7 +121,7 @@ var G = function(n) {
     })
   }));
 }, B = function(n) {
-  return /* @__PURE__ */ e("svg", d({
+  return /* @__PURE__ */ e("svg", m({
     xmlns: "http://www.w3.org/2000/svg",
     width: 24,
     height: 24,
@@ -137,7 +137,7 @@ var G = function(n) {
     })
   }));
 }, H = function(n) {
-  return /* @__PURE__ */ e("svg", d({
+  return /* @__PURE__ */ e("svg", m({
     xmlns: "http://www.w3.org/2000/svg",
     width: 24,
     height: 24,
@@ -153,7 +153,7 @@ var G = function(n) {
     })
   }));
 }, W = function(n) {
-  return /* @__PURE__ */ e("svg", d({
+  return /* @__PURE__ */ e("svg", m({
     xmlns: "http://www.w3.org/2000/svg",
     width: 24,
     height: 24,
@@ -169,7 +169,7 @@ var G = function(n) {
     })
   }));
 }, j = function(n) {
-  return /* @__PURE__ */ e("svg", d({
+  return /* @__PURE__ */ e("svg", m({
     xmlns: "http://www.w3.org/2000/svg",
     width: 24,
     height: 24,
@@ -185,7 +185,7 @@ var G = function(n) {
     })
   }));
 };
-const E = "_header_1mm0v_270", K = "_outer_1mm0v_281", Y = "_main_1mm0v_290", Z = "_container_1mm0v_294", e1 = "_links_1mm0v_300", t1 = "_buttons_1mm0v_301", n1 = "_menu_1mm0v_309", r1 = "_logo_1mm0v_314", o1 = "_subContainer_1mm0v_326", s1 = "_selected_1mm0v_354", i1 = "_icons_1mm0v_357", c1 = "_subTag_1mm0v_377", a1 = "_selectedIcon_1mm0v_390", l1 = "_selectableIcon_1mm0v_394", h1 = "_icon_1mm0v_357", d1 = "_mobileOverlay_1mm0v_408", m1 = "_show_1mm0v_1", u1 = "_open_1mm0v_420", w1 = "_mobile_1mm0v_408", p1 = "_slideUp_1mm0v_1", v1 = "_sub_1mm0v_326", g1 = "_gpt_1mm0v_484", t = {
+const E = "_header_1mm0v_270", K = "_outer_1mm0v_281", Y = "_main_1mm0v_290", Z = "_container_1mm0v_294", e1 = "_links_1mm0v_300", t1 = "_buttons_1mm0v_301", n1 = "_menu_1mm0v_309", r1 = "_logo_1mm0v_314", o1 = "_subContainer_1mm0v_326", s1 = "_selected_1mm0v_354", i1 = "_icons_1mm0v_357", c1 = "_subTag_1mm0v_377", a1 = "_selectedIcon_1mm0v_390", l1 = "_selectableIcon_1mm0v_394", h1 = "_icon_1mm0v_357", m1 = "_mobileOverlay_1mm0v_408", d1 = "_show_1mm0v_1", u1 = "_open_1mm0v_420", w1 = "_mobile_1mm0v_408", p1 = "_slideUp_1mm0v_1", v1 = "_sub_1mm0v_326", g1 = "_gpt_1mm0v_484", t = {
   header: E,
   outer: K,
   main: Y,
@@ -203,8 +203,8 @@ const E = "_header_1mm0v_270", K = "_outer_1mm0v_281", Y = "_main_1mm0v_290", Z
   selectedIcon: a1,
   selectableIcon: l1,
   icon: h1,
-  mobileOverlay: d1,
-  show: m1,
+  mobileOverlay: m1,
+  show: d1,
   open: u1,
   mobile: w1,
   slideUp: p1,
@@ -245,34 +245,34 @@ const E = "_header_1mm0v_270", K = "_outer_1mm0v_281", Y = "_main_1mm0v_290", Z
 function h(r, n) {
   return n ? r.replace(n, "") : r;
 }
-function _1({
+function f1({
   items: r,
   link: n = "a",
-  host: p = "https://www.highcharts.com",
+  host: w = "https://www.highcharts.com",
   pathname: i = typeof window < "u" ? window.location.pathname : ""
 }) {
-  return /* @__PURE__ */ e("div", { className: g(t.sub, t.outer), children: /* @__PURE__ */ e(O, { className: t.subContainer, as: "ul", children: r.map(
-    ({ title: c, url: _, icon: f, selectedIcon: k, tag: C, tagVariant: u = "success" }, x) => {
-      const w = typeof window < "u" && window.location.origin || "http://example.com", v = new URL(_, w), b = v.origin === w && v.pathname === i;
+  return /* @__PURE__ */ e("div", { className: v(t.sub, t.outer), children: /* @__PURE__ */ e(I, { className: t.subContainer, as: "ul", children: r.map(
+    ({ title: c, url: f, icon: _, selectedIcon: k, tag: C, tagVariant: u = "success" }, x) => {
+      const g = typeof window < "u" && window.location.origin || "http://example.com", p = new URL(f, g), b = p.origin === g && p.pathname === i;
       return /* @__PURE__ */ e("li", { children: /* @__PURE__ */ o(
         n,
         {
-          href: h(_, p),
-          className: g({
+          href: h(f, w),
+          className: v({
             [t.selectableIcon]: k,
             [t.selected]: b
           }),
           children: [
             /* @__PURE__ */ o("span", { className: t.icons, children: [
               /* @__PURE__ */ e("span", { className: t.selectedIcon, children: k }),
-              /* @__PURE__ */ e("span", { className: t.icon, children: f })
+              /* @__PURE__ */ e("span", { className: t.icon, children: _ })
             ] }),
             /* @__PURE__ */ o("span", { children: [
               c,
               C && /* @__PURE__ */ e(
                 "span",
                 {
-                  className: g(
+                  className: v(
                     t.subTag,
                     t[`subTag-${u}`]
                   ),
@@ -289,34 +289,34 @@ function _1({
 function B1({
   subItems: r,
   children: n,
-  notifications: p = [],
+  notifications: w = [],
   // TODO: Fetch these from the internets
   link: i = "a",
   host: c = "https://www.highcharts.com",
-  pathname: _ = typeof window < "u" ? window.location.pathname : ""
+  pathname: f = typeof window < "u" ? window.location.pathname : ""
 }) {
-  const f = M("(max-width: 374px)"), k = M("(max-width: 849px)"), C = M("(min-width: 850px) and (max-width: 999px)"), [u, x] = S(!1), [w, v] = S([]);
+  const _ = M("(max-width: 374px)"), k = M("(max-width: 849px)"), C = M("(min-width: 850px) and (max-width: 999px)"), [u, x] = S(!1), [g, p] = S([]);
   q(() => {
-    if (p.length) {
+    if (w.length) {
       const a = localStorage.getItem("notifications");
       if (a) {
-        const m = JSON.parse(a);
-        v(
-          p.filter(
-            (s) => !s.id || !m.closed.includes(s.id)
+        const d = JSON.parse(a);
+        p(
+          w.filter(
+            (s) => !s.id || !d.closed.includes(s.id)
           )
         );
       } else
-        v(p);
+        p(w);
     }
-  }, [p]);
+  }, [w]);
   const b = () => {
     x(!u);
-  }, P = (a) => {
-    v(w.filter((s) => !s.id || s.id !== a));
-    const m = localStorage.getItem("notifications");
-    if (m) {
-      const s = JSON.parse(m);
+  }, O = (a) => {
+    p(g.filter((s) => !s.id || s.id !== a));
+    const d = localStorage.getItem("notifications");
+    if (d) {
+      const s = JSON.parse(d);
       s.closed.includes(a) || (s.closed.push(a), localStorage.setItem("notifications", JSON.stringify(s)));
     } else
       localStorage.setItem(
@@ -327,35 +327,35 @@ function B1({
       );
   };
   return /* @__PURE__ */ e(z, { children: /* @__PURE__ */ o("header", { className: t.header, children: [
-    w == null ? void 0 : w.map(
-      ({ id: a, title: m, description: s, variant: N, closable: U }, V) => /* @__PURE__ */ e(
+    g?.map(
+      ({ id: a, title: d, description: s, variant: N, closable: P }, U) => /* @__PURE__ */ e(
         J,
         {
           description: s,
           variant: N,
-          closable: U,
-          onClose: () => P(a),
-          children: m
+          closable: P,
+          onClose: () => O(a),
+          children: d
         },
-        V
+        U
       )
     ),
-    /* @__PURE__ */ e("div", { className: g(t.main, t.outer), children: /* @__PURE__ */ o(O, { as: "nav", className: t.container, children: [
+    /* @__PURE__ */ e("div", { className: v(t.main, t.outer), children: /* @__PURE__ */ o(I, { as: "nav", className: t.container, children: [
       /* @__PURE__ */ e(
         i,
         {
           className: t.logo,
           href: h("https://www.highcharts.com/", c),
-          children: /* @__PURE__ */ e(L, { showText: !C && !f })
+          children: /* @__PURE__ */ e(L, { showText: !C && !_ })
         }
       ),
-      /* @__PURE__ */ e("ul", { className: t.links, children: y.map(({ title: a, url: m }, s) => /* @__PURE__ */ e("li", { children: /* @__PURE__ */ e(
+      /* @__PURE__ */ e("ul", { className: t.links, children: y.map(({ title: a, url: d }, s) => /* @__PURE__ */ e("li", { children: /* @__PURE__ */ e(
         l,
         {
           variant: "plain",
           size: 300,
           as: i,
-          href: h(m, c),
+          href: h(d, c),
           children: a
         }
       ) }, s)) }),
@@ -416,28 +416,28 @@ function B1({
         )
       ] })
     ] }) }),
-    !!(r != null && r.length) && /* @__PURE__ */ e(
-      _1,
+    !!r?.length && /* @__PURE__ */ e(
+      f1,
       {
         items: r,
         link: i,
         host: c,
-        pathname: _
+        pathname: f
       }
     ),
     n,
-    k && /* @__PURE__ */ o(I, { children: [
+    k && /* @__PURE__ */ o(V, { children: [
       /* @__PURE__ */ e(
         "div",
         {
-          className: g(t.mobileOverlay, { [t.open]: u }),
+          className: v(t.mobileOverlay, { [t.open]: u }),
           onClick: b
         }
       ),
       /* @__PURE__ */ o(
         "nav",
         {
-          className: g(t.mobile, {
+          className: v(t.mobile, {
             [t.open]: u
           }),
           children: [
@@ -447,7 +447,7 @@ function B1({
                 {
                   className: t.logo,
                   href: h("https://www.highcharts.com/", c),
-                  children: /* @__PURE__ */ e(L, { showText: !f })
+                  children: /* @__PURE__ */ e(L, { showText: !_ })
                 }
               ),
               /* @__PURE__ */ o("div", { className: t.buttons, children: [
@@ -504,14 +504,14 @@ function B1({
                 }
               )
             ] }),
-            /* @__PURE__ */ e("ul", { className: t.links, children: y.map(({ title: a, url: m, icon: s }, N) => /* @__PURE__ */ e("li", { children: /* @__PURE__ */ o(
+            /* @__PURE__ */ e("ul", { className: t.links, children: y.map(({ title: a, url: d, icon: s }, N) => /* @__PURE__ */ e("li", { children: /* @__PURE__ */ o(
               l,
               {
                 variant: "plain",
                 size: 500,
                 fullWidth: !0,
                 as: i,
-                href: h(m, c),
+                href: h(d, c),
                 children: [
                   s,
                   a
@@ -526,5 +526,5 @@ function B1({
 }
 export {
   B1 as Header,
-  _1 as SubHeader
+  f1 as SubHeader
 };

package/dist/components/Logo/index.d.ts

@@ -6,4 +6,4 @@ export interface LogoProps extends SVGProps<SVGSVGElement> {
     withLink?: boolean;
 }
 export declare function Logo({ title, light, showText, withLink, ...props }: LogoProps): import("react/jsx-runtime").JSX.Element;
-export declare function ThemedLogo(props: LogoProps): import("react/jsx-runtime").JSX.Element;
+export declare const ThemedLogo: (props: LogoProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/Logo/index.js

@@ -1,14 +1,13 @@
-import { jsxs as c, jsx as t } from "react/jsx-runtime";
-import { z as h } from "../../index-CMegByeX.js";
-import { useMounted as d } from "../../utils.js";
-function n({
-  title: s = "Highcharts",
-  light: l,
-  showText: o = !0,
-  withLink: e = !1,
-  ...f
+import { jsx as t, jsxs as c } from "react/jsx-runtime";
+import { b as h } from "../../utils-xhWUdTOZ.js";
+function d({
+  title: o = "Highcharts",
+  light: r,
+  showText: s = !0,
+  withLink: f = !1,
+  ...e
 }) {
-  const i = l ? "#18171c" : "#f7f7f8", r = /* @__PURE__ */ c(
+  const i = r ? "#18171c" : "#f7f7f8", l = /* @__PURE__ */ c(
     "svg",
     {
       version: "1.1",
@@ -19,11 +18,11 @@ function n({
       xmlnsXlink: "http://www.w3.org/1999/xlink",
       x: "0px",
       y: "0px",
-      viewBox: o ? "10 10 384 65" : "10 10 69 65",
+      viewBox: s ? "10 10 384 65" : "10 10 69 65",
       xmlSpace: "preserve",
-      ...f,
+      ...e,
       children: [
-        /* @__PURE__ */ t("title", { id: "logo-highcharts-title", children: s }),
+        /* @__PURE__ */ t("title", { id: "logo-highcharts-title", children: o }),
         /* @__PURE__ */ c("g", { id: "symbol", transform: "translate(10, 10) scale(1)", children: [
           /* @__PURE__ */ t(
             "polygon",
@@ -110,7 +109,7 @@ function n({
             }
           )
         ] }),
-        o && /* @__PURE__ */ c(
+        s && /* @__PURE__ */ c(
           "g",
           {
             id: "text-highcharts",
@@ -244,13 +243,10 @@ function n({
       ]
     }
   );
-  return e ? /* @__PURE__ */ t("a", { href: "https://www.highcharts.com", children: r }) : r;
-}
-function a(s) {
-  const { resolvedTheme: l } = h(), o = d();
-  return /* @__PURE__ */ t(n, { light: !o || l === "light", ...s });
+  return f ? /* @__PURE__ */ t("a", { href: "https://www.highcharts.com", children: l }) : l;
 }
+const k = (o) => /* @__PURE__ */ t(d, { light: h() === "light", ...o });
 export {
-  n as Logo,
-  a as ThemedLogo
+  d as Logo,
+  k as ThemedLogo
 };

package/dist/components/NewTag/index.d.ts

@@ -0,0 +1,8 @@
+import { HTMLAttributes } from 'react';
+export type NewTagVariant = 'neutral' | 'success' | 'attention' | 'brand' | 'danger';
+export interface NewTagProps extends HTMLAttributes<HTMLSpanElement> {
+    variant?: NewTagVariant;
+    icon?: boolean;
+    border?: boolean;
+}
+export declare function NewTag({ variant, icon, border, className }: NewTagProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/NewTag/index.js

@@ -0,0 +1,54 @@
+import { jsx as r, jsxs as c } from "react/jsx-runtime";
+import "react";
+import { _ as a } from "../../extends-hS2Bh-Yp.js";
+import { c as _ } from "../../clsx-OuTLNxxd.js";
+var i = function(n) {
+  return /* @__PURE__ */ r("svg", a({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 24,
+    height: 24,
+    fill: "none",
+    viewBox: "0 0 24 24"
+  }, n, {
+    children: /* @__PURE__ */ r("path", {
+      stroke: "currentColor",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      strokeWidth: 2,
+      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"
+    })
+  }));
+};
+const d = "_tag_pnk41_270", p = "_icon_pnk41_287", l = "_border_pnk41_293", u = "_neutral_pnk41_303", g = "_success_pnk41_309", k = "_attention_pnk41_315", m = "_brand_pnk41_321", h = "_danger_pnk41_327", t = {
+  tag: d,
+  icon: p,
+  border: l,
+  neutral: u,
+  success: g,
+  attention: k,
+  brand: m,
+  danger: h
+};
+function v({
+  variant: s = "success",
+  icon: n = !0,
+  border: o,
+  className: e
+}) {
+  return /* @__PURE__ */ c(
+    "span",
+    {
+      className: _(e, t.tag, t[s], {
+        [t.icon]: n,
+        [t.border]: o
+      }),
+      children: [
+        n && /* @__PURE__ */ r(i, {}),
+        "New"
+      ]
+    }
+  );
+}
+export {
+  v as NewTag
+};

package/dist/components/Notification/index.js

@@ -1,8 +1,8 @@
 import "react/jsx-runtime";
 import "react";
-import { N as f } from "../../index-BFhQ-SSv.js";
+import { N as f } from "../../index-CUjEIxqY.js";
 import "../../clsx-OuTLNxxd.js";
-import "../../index-DKE1ODpv.js";
+import "../Button/index.js";
 import "../Container/index.js";
 export {
   f as Notification