highsoft-ui 1.0.32 → 1.0.34

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

@@ -21,11 +21,12 @@ export interface Notification {
     closable?: boolean;
 }
 export declare function Header({ subItems, children, notifications: initialNotifications, // TODO: Fetch these from the internets
-link: Link, host, pathname }: {
+link: Link, host, pathname, themeProvider }: {
     subItems?: Array<SubHeaderItem>;
     children?: ReactNode;
     notifications?: Array<Notification>;
     link?: ElementType;
     host?: string;
     pathname?: string;
+    themeProvider?: boolean;
 }): import("react/jsx-runtime").JSX.Element;

package/dist/components/Header/index.js

@@ -1,15 +1,15 @@
-import { jsx as e, jsxs as o, Fragment as V } from "react/jsx-runtime";
-import { useState as N, useEffect as z } from "react";
-import { J } from "../../index-CMegByeX.js";
+import { jsx as e, jsxs as o, Fragment as z } from "react/jsx-runtime";
+import { useState as q, useEffect as F, Fragment as J } from "react";
+import { J as A } from "../../index-CMegByeX.js";
 import { _ as d } from "../../extends-hS2Bh-Yp.js";
-import { N as A, X as G } from "../../index-ChurKizy.js";
+import { N as G, X as Q } from "../../index-ChurKizy.js";
 import { c as g } from "../../clsx-OuTLNxxd.js";
 import { Button as h } from "../Button/index.js";
-import { Container as y } from "../Container/index.js";
-import { ThemedLogo as q } from "../Logo/index.js";
-import { PrefPanel as S } from "../PrefPanel/index.js";
-import { useMediaQuery as j } from "../../utils.js";
-var F = function(t) {
+import { Container as O } from "../Container/index.js";
+import { ThemedLogo as S } from "../Logo/index.js";
+import { PrefPanel as L } from "../PrefPanel/index.js";
+import { useMediaQuery as M } from "../../utils.js";
+var $ = function(t) {
   return /* @__PURE__ */ e("svg", d({
     xmlns: "http://www.w3.org/2000/svg",
     width: 24,
@@ -25,7 +25,7 @@ var F = function(t) {
       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"
     })
   }));
-}, Q = function(t) {
+}, R = function(t) {
   return /* @__PURE__ */ e("svg", d({
     xmlns: "http://www.w3.org/2000/svg",
     width: 24,
@@ -41,7 +41,7 @@ var F = function(t) {
       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"
     })
   }));
-}, R = function(t) {
+}, X = function(t) {
   return /* @__PURE__ */ e("svg", d({
     xmlns: "http://www.w3.org/2000/svg",
     width: 24,
@@ -57,7 +57,7 @@ var F = function(t) {
       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"
     })
   }));
-}, X = function(t) {
+}, D = function(t) {
   return /* @__PURE__ */ e("svg", d({
     xmlns: "http://www.w3.org/2000/svg",
     width: 24,
@@ -73,7 +73,7 @@ var F = function(t) {
       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"
     })
   }));
-}, $ = function(t) {
+}, E = function(t) {
   return /* @__PURE__ */ e("svg", d({
     xmlns: "http://www.w3.org/2000/svg",
     width: 24,
@@ -89,7 +89,7 @@ var F = function(t) {
       d: "M3 12h12M3 6h18M3 18h18"
     })
   }));
-}, D = function(t) {
+}, I = function(t) {
   return /* @__PURE__ */ e("svg", d({
     xmlns: "http://www.w3.org/2000/svg",
     width: 24,
@@ -105,7 +105,7 @@ var F = function(t) {
       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"
     })
   }));
-}, E = function(t) {
+}, K = function(t) {
   return /* @__PURE__ */ e("svg", d({
     xmlns: "http://www.w3.org/2000/svg",
     width: 24,
@@ -121,7 +121,7 @@ var F = function(t) {
       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"
     })
   }));
-}, L = function(t) {
+}, T = function(t) {
   return /* @__PURE__ */ e("svg", d({
     xmlns: "http://www.w3.org/2000/svg",
     width: 24,
@@ -137,7 +137,7 @@ var F = function(t) {
       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"
     })
   }));
-}, T = function(t) {
+}, B = function(t) {
   return /* @__PURE__ */ e("svg", d({
     xmlns: "http://www.w3.org/2000/svg",
     width: 24,
@@ -153,7 +153,7 @@ var F = function(t) {
       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"
     })
   }));
-}, B = function(t) {
+}, W = function(t) {
   return /* @__PURE__ */ e("svg", d({
     xmlns: "http://www.w3.org/2000/svg",
     width: 24,
@@ -186,129 +186,130 @@ var F = function(t) {
     })
   }));
 };
-const I = "_header_1jacq_270", K = "_outer_1jacq_281", Y = "_main_1jacq_290", Z = "_container_1jacq_294", e1 = "_links_1jacq_300", t1 = "_buttons_1jacq_301", n1 = "_menu_1jacq_309", r1 = "_logo_1jacq_314", o1 = "_subContainer_1jacq_326", s1 = "_selected_1jacq_354", a1 = "_subTag_1jacq_366", i1 = "_mobileOverlay_1jacq_384", c1 = "_show_1jacq_1", h1 = "_open_1jacq_396", l1 = "_mobile_1jacq_384", d1 = "_slideUp_1jacq_1", u1 = "_sub_1jacq_326", m1 = "_gpt_1jacq_460", n = {
-  header: I,
-  outer: K,
-  main: Y,
-  container: Z,
-  links: e1,
-  buttons: t1,
-  menu: n1,
-  logo: r1,
-  subContainer: o1,
-  selected: s1,
-  subTag: a1,
+const Y = "_header_1jacq_270", Z = "_outer_1jacq_281", e1 = "_main_1jacq_290", t1 = "_container_1jacq_294", n1 = "_links_1jacq_300", r1 = "_buttons_1jacq_301", o1 = "_menu_1jacq_309", a1 = "_logo_1jacq_314", s1 = "_subContainer_1jacq_326", i1 = "_selected_1jacq_354", c1 = "_subTag_1jacq_366", h1 = "_mobileOverlay_1jacq_384", l1 = "_show_1jacq_1", d1 = "_open_1jacq_396", u1 = "_mobile_1jacq_384", m1 = "_slideUp_1jacq_1", w1 = "_sub_1jacq_326", p1 = "_gpt_1jacq_460", n = {
+  header: Y,
+  outer: Z,
+  main: e1,
+  container: t1,
+  links: n1,
+  buttons: r1,
+  menu: o1,
+  logo: a1,
+  subContainer: s1,
+  selected: i1,
+  subTag: c1,
   "subTag-success": "_subTag-success_1jacq_371",
   "subTag-brand": "_subTag-brand_1jacq_375",
-  mobileOverlay: i1,
-  show: c1,
-  open: h1,
-  mobile: l1,
-  slideUp: d1,
-  sub: u1,
-  gpt: m1
-}, W = [
+  mobileOverlay: h1,
+  show: l1,
+  open: d1,
+  mobile: u1,
+  slideUp: m1,
+  sub: w1,
+  gpt: p1
+}, y = [
   {
     title: "Products",
     url: "https://highcharts.com/products/",
-    icon: /* @__PURE__ */ e(R, {})
+    icon: /* @__PURE__ */ e(X, {})
   },
   {
     title: "Demos",
     url: "https://www.highcharts.com/demo",
-    icon: /* @__PURE__ */ e(E, {})
+    icon: /* @__PURE__ */ e(K, {})
   },
   {
     title: "Support",
     url: "https://www.highcharts.com/support/",
-    icon: /* @__PURE__ */ e(D, {})
+    icon: /* @__PURE__ */ e(I, {})
   },
   {
     title: "Resources",
     url: "https://www.highcharts.com/",
-    icon: /* @__PURE__ */ e(X, {})
+    icon: /* @__PURE__ */ e(D, {})
   },
   {
     title: "Pricing",
     url: "https://shop.highcharts.com/",
-    icon: /* @__PURE__ */ e(Q, {})
+    icon: /* @__PURE__ */ e(R, {})
   },
   {
     title: "Blog",
     url: "https://www.highcharts.com/blog/",
-    icon: /* @__PURE__ */ e(F, {})
+    icon: /* @__PURE__ */ e($, {})
   }
 ];
 function l(r, t) {
   return t ? r.replace(t, "") : r;
 }
-function w1({
+function g1({
   items: r,
   link: t = "a",
-  host: p = "https://www.highcharts.com",
-  pathname: a = typeof window < "u" ? window.location.pathname : ""
+  host: w = "https://www.highcharts.com",
+  pathname: s = typeof window < "u" ? window.location.pathname : ""
 }) {
-  return /* @__PURE__ */ e("div", { className: g(n.sub, n.outer), children: /* @__PURE__ */ e(y, { className: n.subContainer, as: "ul", children: r.map(({ title: i, url: f, icon: _, tag: k, tagVariant: b = "success" }, m) => {
-    const C = typeof window < "u" && window.location.origin || "http://example.com", w = new URL(f, C), v = w.origin === C && w.pathname === a;
+  return /* @__PURE__ */ e("div", { className: g(n.sub, n.outer), children: /* @__PURE__ */ e(O, { className: n.subContainer, as: "ul", children: r.map(({ title: i, url: f, icon: k, tag: v, tagVariant: C = "success" }, b) => {
+    const m = typeof window < "u" && window.location.origin || "http://example.com", _ = new URL(f, m), p = _.origin === m && _.pathname === s;
     return /* @__PURE__ */ e("li", { children: /* @__PURE__ */ o(
       t,
       {
-        href: l(f, p),
+        href: l(f, w),
         className: g({
-          [n.selected]: v
+          [n.selected]: p
         }),
         children: [
-          _,
+          k,
           /* @__PURE__ */ o("span", { children: [
             i,
-            k && /* @__PURE__ */ e(
+            v && /* @__PURE__ */ e(
               "span",
               {
                 className: g(
                   n.subTag,
-                  n[`subTag-${b}`]
+                  n[`subTag-${C}`]
                 ),
-                children: k
+                children: v
               }
             )
           ] })
         ]
       }
-    ) }, m);
+    ) }, b);
   }) }) });
 }
-function N1({
+function L1({
   subItems: r,
   children: t,
-  notifications: p = [],
+  notifications: w = [],
   // TODO: Fetch these from the internets
-  link: a = "a",
+  link: s = "a",
   host: i = "https://www.highcharts.com",
-  pathname: f = typeof window < "u" ? window.location.pathname : ""
+  pathname: f = typeof window < "u" ? window.location.pathname : "",
+  themeProvider: k = !0
 }) {
-  const _ = j("(max-width: 374px)"), k = j("(max-width: 849px)"), b = j("(min-width: 850px) and (max-width: 999px)"), [m, C] = N(!1), [w, v] = N([]);
-  z(() => {
-    if (p.length) {
+  const v = M("(max-width: 374px)"), C = M("(max-width: 849px)"), b = M("(min-width: 850px) and (max-width: 999px)"), [m, _] = q(!1), [p, x] = q([]);
+  F(() => {
+    if (w.length) {
       const c = localStorage.getItem("notifications");
       if (c) {
         const u = JSON.parse(c);
-        v(
-          p.filter(
-            (s) => !s.id || !u.closed.includes(s.id)
+        x(
+          w.filter(
+            (a) => !a.id || !u.closed.includes(a.id)
           )
         );
       } else
-        v(p);
+        x(w);
     }
-  }, [p]);
-  const M = () => {
-    C(!m);
-  }, O = (c) => {
-    v(w.filter((s) => !s.id || s.id !== c));
+  }, [w]);
+  const N = () => {
+    _(!m);
+  }, P = (c) => {
+    x(p.filter((a) => !a.id || a.id !== c));
     const u = localStorage.getItem("notifications");
     if (u) {
-      const s = JSON.parse(u);
-      s.closed.includes(c) || (s.closed.push(c), localStorage.setItem("notifications", JSON.stringify(s)));
+      const a = JSON.parse(u);
+      a.closed.includes(c) || (a.closed.push(c), localStorage.setItem("notifications", JSON.stringify(a)));
     } else
       localStorage.setItem(
         "notifications",
@@ -317,62 +318,62 @@ function N1({
         })
       );
   };
-  return /* @__PURE__ */ e(J, { children: /* @__PURE__ */ o("header", { className: n.header, children: [
-    w == null ? void 0 : w.map(
-      ({ id: c, title: u, description: s, variant: x, closable: P }, U) => /* @__PURE__ */ e(
-        A,
+  return /* @__PURE__ */ e(k ? A : J, { children: /* @__PURE__ */ o("header", { className: n.header, children: [
+    p == null ? void 0 : p.map(
+      ({ id: c, title: u, description: a, variant: j, closable: U }, V) => /* @__PURE__ */ e(
+        G,
         {
-          description: s,
-          variant: x,
-          closable: P,
-          onClose: () => O(c),
+          description: a,
+          variant: j,
+          closable: U,
+          onClose: () => P(c),
           children: u
         },
-        U
+        V
       )
     ),
-    /* @__PURE__ */ e("div", { className: g(n.main, n.outer), children: /* @__PURE__ */ o(y, { as: "nav", className: n.container, children: [
+    /* @__PURE__ */ e("div", { className: g(n.main, n.outer), children: /* @__PURE__ */ o(O, { as: "nav", className: n.container, children: [
       /* @__PURE__ */ e(
-        a,
+        s,
         {
           className: n.logo,
           href: l("https://www.highcharts.com/", i),
-          children: /* @__PURE__ */ e(q, { showText: !b && !_ })
+          children: /* @__PURE__ */ e(S, { showText: !b && !v })
         }
       ),
-      /* @__PURE__ */ e("ul", { className: n.links, children: W.map(({ title: c, url: u }, s) => /* @__PURE__ */ e("li", { children: /* @__PURE__ */ e(
+      /* @__PURE__ */ e("ul", { className: n.links, children: y.map(({ title: c, url: u }, a) => /* @__PURE__ */ e("li", { children: /* @__PURE__ */ e(
         h,
         {
           variant: "plain",
           size: 300,
-          as: a,
+          as: s,
           href: l(u, i),
           children: c
         }
-      ) }, s)) }),
+      ) }, a)) }),
       /* @__PURE__ */ o("div", { className: n.buttons, children: [
         /* @__PURE__ */ o(
           h,
           {
             variant: "transparent",
-            as: a,
+            as: s,
             href: l(
               "https://www.highcharts.com/chat/gpt/",
               i
             ),
             children: [
               /* @__PURE__ */ e("span", { className: n.gpt, children: "Highcharts GPT" }),
-              /* @__PURE__ */ e(T, {})
+              /* @__PURE__ */ e(B, {})
             ]
           }
         ),
-        /* @__PURE__ */ e(h, { variant: "transparent", "aria-label": "Search", children: /* @__PURE__ */ e(L, {}) }),
-        /* @__PURE__ */ e(S, {}),
+        /* @__PURE__ */ e(h, { variant: "transparent", "aria-label": "Search", children: /* @__PURE__ */ e(T, {}) }),
+        /* @__PURE__ */ e(L, {}),
         /* @__PURE__ */ e(
           h,
           {
             variant: "brand",
-            as: a,
+            as: s,
             href: l("https://shop.highcharts.com/account", i),
             "aria-label": "Login",
             children: /* @__PURE__ */ e(H, {})
@@ -382,13 +383,13 @@ function N1({
           h,
           {
             variant: "success",
-            as: a,
+            as: s,
             href: l(
               "https://www.highcharts.com/download/",
               i
             ),
             children: [
-              /* @__PURE__ */ e(B, {}),
+              /* @__PURE__ */ e(W, {}),
               "Get started"
             ]
           }
@@ -398,31 +399,31 @@ function N1({
           {
             variant: m ? "white" : "transparent",
             className: n.menu,
-            onClick: M,
+            onClick: N,
             children: [
               m ? "Close" : "Menu",
-              m ? /* @__PURE__ */ e(G, {}) : /* @__PURE__ */ e($, {})
+              m ? /* @__PURE__ */ e(Q, {}) : /* @__PURE__ */ e(E, {})
             ]
           }
         )
       ] })
     ] }) }),
     !!(r != null && r.length) && /* @__PURE__ */ e(
-      w1,
+      g1,
       {
         items: r,
-        link: a,
+        link: s,
         host: i,
         pathname: f
       }
     ),
     t,
-    k && /* @__PURE__ */ o(V, { children: [
+    C && /* @__PURE__ */ o(z, { children: [
       /* @__PURE__ */ e(
         "div",
         {
           className: g(n.mobileOverlay, { [n.open]: m }),
-          onClick: M
+          onClick: N
         }
       ),
       /* @__PURE__ */ o(
@@ -434,11 +435,11 @@ function N1({
           children: [
             /* @__PURE__ */ o("div", { className: n.container, children: [
               /* @__PURE__ */ e(
-                a,
+                s,
                 {
                   className: n.logo,
                   href: l("https://www.highcharts.com/", i),
-                  children: /* @__PURE__ */ e(q, { showText: !_ })
+                  children: /* @__PURE__ */ e(S, { showText: !v })
                 }
               ),
               /* @__PURE__ */ o("div", { className: n.buttons, children: [
@@ -446,19 +447,19 @@ function N1({
                   h,
                   {
                     variant: "transparent",
-                    as: a,
+                    as: s,
                     href: l(
                       "https://www.highcharts.com/chat/gpt/",
                       i
                     ),
                     children: [
                       /* @__PURE__ */ e("span", { className: n.gpt, children: "Highcharts GPT" }),
-                      /* @__PURE__ */ e(T, {})
+                      /* @__PURE__ */ e(B, {})
                     ]
                   }
                 ),
-                /* @__PURE__ */ e(h, { variant: "transparent", "aria-label": "Search", children: /* @__PURE__ */ e(L, {}) }),
-                /* @__PURE__ */ e(S, {})
+                /* @__PURE__ */ e(h, { variant: "transparent", "aria-label": "Search", children: /* @__PURE__ */ e(T, {}) }),
+                /* @__PURE__ */ e(L, {})
               ] })
             ] }),
             /* @__PURE__ */ o("div", { className: n.buttons, children: [
@@ -467,7 +468,7 @@ function N1({
                 {
                   variant: "brand",
                   fullWidth: !0,
-                  as: a,
+                  as: s,
                   href: l(
                     "https://shop.highcharts.com/account",
                     i
@@ -483,32 +484,32 @@ function N1({
                 {
                   variant: "success",
                   fullWidth: !0,
-                  as: a,
+                  as: s,
                   href: l(
                     "https://www.highcharts.com/download/",
                     i
                   ),
                   children: [
-                    /* @__PURE__ */ e(B, {}),
+                    /* @__PURE__ */ e(W, {}),
                     "Get started"
                   ]
                 }
               )
             ] }),
-            /* @__PURE__ */ e("ul", { className: n.links, children: W.map(({ title: c, url: u, icon: s }, x) => /* @__PURE__ */ e("li", { children: /* @__PURE__ */ o(
+            /* @__PURE__ */ e("ul", { className: n.links, children: y.map(({ title: c, url: u, icon: a }, j) => /* @__PURE__ */ e("li", { children: /* @__PURE__ */ o(
               h,
               {
                 variant: "plain",
                 size: 500,
                 fullWidth: !0,
-                as: a,
+                as: s,
                 href: l(u, i),
                 children: [
-                  s,
+                  a,
                   c
                 ]
               }
-            ) }, x)) })
+            ) }, j)) })
           ]
         }
       )
@@ -516,6 +517,6 @@ function N1({
   ] }) });
 }
 export {
-  N1 as Header,
-  w1 as SubHeader
+  L1 as Header,
+  g1 as SubHeader
 };

package/dist/scss/variables.scss

@@ -8,11 +8,13 @@ $neutral-400: var(--primitives-neutral-400);
 $neutral-500: var(--primitives-neutral-500);
 $neutral-600: var(--primitives-neutral-600);
 $neutral-700: var(--primitives-neutral-700);
+$neutral-750: var(--primitives-neutral-750);
 $neutral-800: var(--primitives-neutral-800);
 $neutral-900: var(--primitives-neutral-900);
 $neutral-1000: var(--primitives-neutral-1000);
 
 $brand-0: var(--primitives-brand-0);
+$brand-50: var(--primitives-brand-50);
 $brand-100: var(--primitives-brand-100);
 $brand-200: var(--primitives-brand-200);
 $brand-300: var(--primitives-brand-300);
@@ -25,6 +27,7 @@ $brand-900: var(--primitives-brand-900);
 $brand-1000: var(--primitives-brand-1000);
 
 $success-0: var(--primitives-success-0);
+$success-50: var(--primitives-success-50);
 $success-100: var(--primitives-success-100);
 $success-200: var(--primitives-success-200);
 $success-300: var(--primitives-success-300);
@@ -37,6 +40,7 @@ $success-900: var(--primitives-success-900);
 $success-1000: var(--primitives-success-1000);
 
 $attention-0: var(--primitives-attention-0);
+$attention-50: var(--primitives-attention-50);
 $attention-100: var(--primitives-attention-100);
 $attention-200: var(--primitives-attention-200);
 $attention-300: var(--primitives-attention-300);
@@ -49,6 +53,7 @@ $attention-900: var(--primitives-attention-900);
 $attention-1000: var(--primitives-attention-1000);
 
 $danger-0: var(--primitives-danger-0);
+$danger-50: var(--primitives-danger-50);
 $danger-100: var(--primitives-danger-100);
 $danger-200: var(--primitives-danger-200);
 $danger-300: var(--primitives-danger-300);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "highsoft-ui",
-  "version": "1.0.32",
+  "version": "1.0.34",
   "description": "Highsoft UI",
   "type": "module",
   "main": "dist/main.js",