highsoft-ui 1.0.91 → 1.0.92

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

@@ -3,6 +3,7 @@ import { NotificationItem, NotificationVariant } from '../Notification';
 export interface SubHeaderItem {
     title: string;
     url: string;
+    prefixMatch?: boolean;
     icon?: ReactNode;
     selectedIcon?: ReactNode;
     tag?: ReactNode;

package/dist/components/Header/index.js

@@ -1,19 +1,19 @@
 import { jsx as e, jsxs as c, Fragment as F } from "react/jsx-runtime";
-import { useRef as R, useState as E, useEffect as S } from "react";
-import { a as q, b as Y, J, c as X, z as Z } from "../../utils-BKDJp1i0.js";
+import { useRef as R, useState as E, useEffect as T } from "react";
+import { a as M, b as Y, J, c as X, z as Z } from "../../utils-BKDJp1i0.js";
 import { A as ee } from "../../Announcement03-obPaH4LK.js";
-import { _ as p } from "../../extends-hS2Bh-Yp.js";
+import { _ as f } from "../../extends-hS2Bh-Yp.js";
+import { S as I, a as H } from "../../index-Dkl2PwZH.js";
 import { X as te } from "../../XClose-CCu1vrNS.js";
-import { c as C } from "../../clsx-OuTLNxxd.js";
+import { c as _ } from "../../clsx-OuTLNxxd.js";
 import { Button as u } from "../Button/index.js";
-import { Container as U } from "../Container/index.js";
-import { Logo as I } from "../Logo/index.js";
+import { Container as D } from "../Container/index.js";
+import { Logo as O } from "../Logo/index.js";
 import { NewTag as ne } from "../NewTag/index.js";
 import { Notification as oe } from "../Notification/index.js";
-import { Search as H } from "../Search/index.js";
-import { PrefPanel as O } from "../PrefPanel/index.js";
+import { PrefPanel as P } from "../PrefPanel/index.js";
 var re = function(n) {
-  return /* @__PURE__ */ e("svg", p({
+  return /* @__PURE__ */ e("svg", f({
     xmlns: "http://www.w3.org/2000/svg",
     width: 24,
     height: 24,
@@ -29,7 +29,7 @@ var re = function(n) {
     })
   }));
 }, se = function(n) {
-  return /* @__PURE__ */ e("svg", p({
+  return /* @__PURE__ */ e("svg", f({
     xmlns: "http://www.w3.org/2000/svg",
     width: 24,
     height: 24,
@@ -45,7 +45,7 @@ var re = function(n) {
     })
   }));
 }, ie = function(n) {
-  return /* @__PURE__ */ e("svg", p({
+  return /* @__PURE__ */ e("svg", f({
     xmlns: "http://www.w3.org/2000/svg",
     width: 24,
     height: 24,
@@ -61,7 +61,7 @@ var re = function(n) {
     })
   }));
 }, ce = function(n) {
-  return /* @__PURE__ */ e("svg", p({
+  return /* @__PURE__ */ e("svg", f({
     xmlns: "http://www.w3.org/2000/svg",
     width: 24,
     height: 24,
@@ -77,7 +77,7 @@ var re = function(n) {
     })
   }));
 }, ae = function(n) {
-  return /* @__PURE__ */ e("svg", p({
+  return /* @__PURE__ */ e("svg", f({
     xmlns: "http://www.w3.org/2000/svg",
     width: 24,
     height: 24,
@@ -93,7 +93,7 @@ var re = function(n) {
     })
   }));
 }, le = function(n) {
-  return /* @__PURE__ */ e("svg", p({
+  return /* @__PURE__ */ e("svg", f({
     xmlns: "http://www.w3.org/2000/svg",
     width: 24,
     height: 24,
@@ -109,7 +109,7 @@ var re = function(n) {
     })
   }));
 }, W = function(n) {
-  return /* @__PURE__ */ e("svg", p({
+  return /* @__PURE__ */ e("svg", f({
     xmlns: "http://www.w3.org/2000/svg",
     width: 24,
     height: 24,
@@ -125,7 +125,7 @@ var re = function(n) {
     })
   }));
 }, $ = function(n) {
-  return /* @__PURE__ */ e("svg", p({
+  return /* @__PURE__ */ e("svg", f({
     xmlns: "http://www.w3.org/2000/svg",
     width: 24,
     height: 24,
@@ -140,24 +140,8 @@ var re = function(n) {
       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"
     })
   }));
-}, j = function(n) {
-  return /* @__PURE__ */ e("svg", p({
-    xmlns: "http://www.w3.org/2000/svg",
-    width: 24,
-    height: 24,
-    fill: "none",
-    viewBox: "0 0 24 24"
-  }, n, {
-    children: /* @__PURE__ */ e("path", {
-      stroke: "currentColor",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      strokeWidth: 2,
-      d: "M3 20c2.3358-2.4774 5.507-4 9-4s6.6642 1.5226 9 4M16.5 7.5c0 2.4853-2.0147 4.5-4.5 4.5S7.5 9.9853 7.5 7.5 9.5147 3 12 3s4.5 2.0147 4.5 4.5"
-    })
-  }));
 };
-const he = "m_QBtq_buttons", de = "m_QBtq_container", me = "m_QBtq_gpt", ue = "m_QBtq_header", pe = "m_QBtq_icon", we = "m_QBtq_icons", fe = "m_QBtq_links", ge = "m_QBtq_logo", ve = "m_QBtq_main", ke = "m_QBtq_menu", Ce = "m_QBtq_mobile", _e = "m_QBtq_mobileOverlay", xe = "m_QBtq_open", be = "m_QBtq_outer", Be = "m_QBtq_selectableIcon", Ne = "m_QBtq_selected", ye = "m_QBtq_selectedIcon", qe = "m_QBtq_skip", Se = "m_QBtq_sub", Me = "m_QBtq_subContainer", Te = "m_QBtq_subTitle", o = {
+const he = "m_QBtq_buttons", de = "m_QBtq_container", me = "m_QBtq_gpt", ue = "m_QBtq_header", pe = "m_QBtq_icon", we = "m_QBtq_icons", fe = "m_QBtq_links", ge = "m_QBtq_logo", ve = "m_QBtq_main", Ce = "m_QBtq_menu", ke = "m_QBtq_mobile", _e = "m_QBtq_mobileOverlay", xe = "m_QBtq_open", be = "m_QBtq_outer", Be = "m_QBtq_selectableIcon", Ne = "m_QBtq_selected", ye = "m_QBtq_selectedIcon", Se = "m_QBtq_skip", qe = "m_QBtq_sub", Me = "m_QBtq_subContainer", Te = "m_QBtq_subTitle", o = {
   buttons: he,
   container: de,
   gpt: me,
@@ -167,28 +151,28 @@ const he = "m_QBtq_buttons", de = "m_QBtq_container", me = "m_QBtq_gpt", ue = "m
   links: fe,
   logo: ge,
   main: ve,
-  menu: ke,
-  mobile: Ce,
+  menu: Ce,
+  mobile: ke,
   mobileOverlay: _e,
   open: xe,
   outer: be,
   selectableIcon: Be,
   selected: Ne,
   selectedIcon: ye,
-  skip: qe,
-  sub: Se,
+  skip: Se,
+  sub: qe,
   subContainer: Me,
   subTitle: Te
-}, D = "notifications", G = "theme", Qe = 365 * 20, Le = (t) => /^\d{1,3}(?:\.\d{1,3}){3}$/.test(t), Ee = () => {
+}, G = "notifications", V = "theme", Qe = 365 * 20, Le = (t) => /^\d{1,3}(?:\.\d{1,3}){3}$/.test(t), Ee = () => {
   if (typeof window > "u") return;
   const t = window.location.hostname;
   if (!t || t === "localhost" || Le(t))
     return;
   const n = t.replace(/^www\./, ""), h = n.split(".");
   return h.length <= 2 ? `.${n}` : `.${h.slice(-2).join(".")}`;
-}, P = () => {
+}, j = () => {
   if (typeof document > "u") return null;
-  const t = document.cookie.split("; ").find((n) => n.startsWith(`${D}=`));
+  const t = document.cookie.split("; ").find((n) => n.startsWith(`${G}=`));
   if (!t) return null;
   try {
     return JSON.parse(decodeURIComponent(t.split("=")[1]));
@@ -197,14 +181,14 @@ const he = "m_QBtq_buttons", de = "m_QBtq_container", me = "m_QBtq_gpt", ue = "m
   }
 }, Ie = () => {
   if (typeof document > "u") return null;
-  const t = document.cookie.split("; ").find((n) => n.startsWith(`${G}=`));
+  const t = document.cookie.split("; ").find((n) => n.startsWith(`${V}=`));
   if (!t) return null;
   try {
     return decodeURIComponent(t.split("=")[1]);
   } catch {
     return null;
   }
-}, V = (t, n) => {
+}, z = (t, n) => {
   if (typeof document > "u") return;
   const h = new Date(
     Date.now() + Qe * 24 * 60 * 60 * 1e3
@@ -257,29 +241,37 @@ function He({
   pathname: s
 }) {
   const a = X();
-  return /* @__PURE__ */ e("div", { className: C(o.sub, o.outer), children: /* @__PURE__ */ e(U, { className: o.subContainer, as: "ul", children: t.map(
-    ({ title: N, url: v, icon: _, selectedIcon: x, tag: y, tagVariant: g = "success" }, w) => {
-      const b = typeof window < "u" && window.location.origin || "http://example.com", f = new URL(v, b), k = (!!s || a) && f.origin === b && f.pathname === (s || typeof window < "u" && window.location.pathname);
+  return /* @__PURE__ */ e("div", { className: _(o.sub, o.outer), children: /* @__PURE__ */ e(D, { className: o.subContainer, as: "ul", children: t.map(
+    ({
+      title: y,
+      url: v,
+      prefixMatch: x,
+      icon: S,
+      selectedIcon: b,
+      tag: g,
+      tagVariant: w = "success"
+    }, q) => {
+      const p = s || typeof window < "u" && window.location.pathname, C = typeof window < "u" && window.location.origin || "http://example.com", k = new URL(v, C), B = p && (!!s || a) && k.origin === C && (x ? p.startsWith(k.pathname) : k.pathname === p);
       return /* @__PURE__ */ e("li", { children: /* @__PURE__ */ c(
         n,
         {
           href: m(v, h),
-          className: C({
-            [o.selectableIcon]: x,
-            [o.selected]: k
+          className: _({
+            [o.selectableIcon]: b,
+            [o.selected]: B
           }),
           children: [
             /* @__PURE__ */ c("span", { className: o.icons, children: [
-              /* @__PURE__ */ e("span", { className: o.selectedIcon, children: x }),
-              /* @__PURE__ */ e("span", { className: o.icon, children: _ })
+              /* @__PURE__ */ e("span", { className: o.selectedIcon, children: b }),
+              /* @__PURE__ */ e("span", { className: o.icon, children: S })
             ] }),
             /* @__PURE__ */ c("span", { className: o.subTitle, children: [
-              N,
-              y && /* @__PURE__ */ e(ne, { variant: g, icon: !1 })
+              y,
+              g && /* @__PURE__ */ e(ne, { variant: w, icon: !1 })
             ] })
           ]
         }
-      ) }, w);
+      ) }, q);
     }
   ) }) });
 }
@@ -308,9 +300,9 @@ const Oe = [
     ]
   }
 ];
-function We() {
+function Pe() {
   const { theme: t, setTheme: n } = Z(), h = R(!1);
-  return S(() => {
+  return T(() => {
     if (h.current) return;
     const s = Ie();
     if (s && s !== t) {
@@ -318,8 +310,8 @@ function We() {
       return;
     }
     h.current = !0;
-  }, [n, t]), S(() => {
-    t && V(G, t);
+  }, [n, t]), T(() => {
+    t && z(V, t);
   }, [t]), null;
 }
 function Xe({
@@ -329,69 +321,69 @@ function Xe({
   // TODO: Fetch these from the internets
   link: s = "a",
   host: a = "https://www.highcharts.com",
-  pathname: N,
+  pathname: y,
   cssVariable: v
 }) {
-  const _ = q("(max-width: 374px)"), x = q("(max-width: 849px)"), y = q("(min-width: 850px) and (max-width: 999px)"), g = R(null), [w, b] = E(!1), [f, k] = E([]);
-  S(() => {
+  const x = M("(max-width: 374px)"), S = M("(max-width: 849px)"), b = M("(min-width: 850px) and (max-width: 999px)"), g = R(null), [w, q] = E(!1), [p, C] = E([]);
+  T(() => {
     let r = window.scrollY;
-    const i = 82 + f.length * 48 + (t?.length ? 72 : 0), d = -(82 + f.length * 48);
-    let l = d, B = l;
+    const i = 82 + p.length * 48 + (t?.length ? 72 : 0), d = -(82 + p.length * 48);
+    let l = d, N = l;
     g.current && (g.current.style.top = `${l}px`), v && document.documentElement.style.setProperty(
       "--header-bottom",
       `${i + l}px`
     );
     const Q = () => {
-      const L = window.scrollY, K = L - r;
-      l -= K, l < d ? l = d : l > 0 && (l = 0), g.current && l !== B && (g.current.style.top = `${l}px`, v && document.documentElement.style.setProperty(
+      const L = window.scrollY, U = L - r;
+      l -= U, l < d ? l = d : l > 0 && (l = 0), g.current && l !== N && (g.current.style.top = `${l}px`, v && document.documentElement.style.setProperty(
         "--header-bottom",
         `${i + l}px`
-      )), r = L, B = l;
+      )), r = L, N = l;
     };
     return window.addEventListener("scroll", Q), () => window.removeEventListener("scroll", Q);
-  }, [v, f.length]), Y(() => {
+  }, [v, p.length]), Y(() => {
     if (!h.length) return;
-    const r = P();
-    k(
+    const r = j();
+    C(
       r ? h.filter(
         (i) => !i.id || !r.closed.includes(i.id)
       ) : h
     );
   }, [a, h]);
-  const M = (r) => {
+  const k = (r) => {
     if (r.preventDefault(), !(r.nativeEvent instanceof KeyboardEvent) || r.nativeEvent.code === "Enter" || r.nativeEvent.code === "Space") {
       const i = document.querySelector("main");
       i && (i.scrollIntoView(), i.getAttribute("tabindex") !== "-1" && i.setAttribute("tabindex", "-1"), i.focus());
     }
-  }, T = () => {
-    b(!w);
-  }, z = (r) => {
-    if (k(f.filter((d) => !d.id || d.id !== r)), !r) return;
-    const i = P() ?? {
+  }, B = () => {
+    q(!w);
+  }, K = (r) => {
+    if (C(p.filter((d) => !d.id || d.id !== r)), !r) return;
+    const i = j() ?? {
       closed: []
     };
-    i.closed.includes(r) || V(
-      D,
+    i.closed.includes(r) || z(
+      G,
       JSON.stringify({
         closed: [...i.closed, r]
       })
     );
   };
   return /* @__PURE__ */ c(J, { children: [
-    /* @__PURE__ */ e(We, {}),
+    /* @__PURE__ */ e(Pe, {}),
     /* @__PURE__ */ c("header", { className: o.header, ref: g, children: [
-      f?.map(({ id: r, content: i, variant: d, closable: l }, B) => /* @__PURE__ */ e(
+      p?.map(({ id: r, content: i, variant: d, closable: l }, N) => /* @__PURE__ */ e(
         oe,
         {
           id: r,
           content: i,
           variant: d,
           closable: l,
-          onClose: () => z(r)
+          onClose: () => K(r)
         },
-        B
+        N
       )),
-      /* @__PURE__ */ e("div", { className: C(o.main, o.outer), children: /* @__PURE__ */ c(U, { as: "nav", className: o.container, children: [
+      /* @__PURE__ */ e("div", { className: _(o.main, o.outer), children: /* @__PURE__ */ c(D, { as: "nav", className: o.container, children: [
         /* @__PURE__ */ e(
           u,
           {
@@ -399,8 +391,8 @@ function Xe({
             className: o.skip,
             size: 500,
             tabIndex: "0",
-            onClick: M,
-            onKeyPress: M,
+            onClick: k,
+            onKeyPress: k,
             children: "Skip to content"
           }
         ),
@@ -409,7 +401,7 @@ function Xe({
           {
             className: o.logo,
             href: m("https://www.highcharts.com/", a),
-            children: /* @__PURE__ */ e(I, { showText: !y && !_ })
+            children: /* @__PURE__ */ e(O, { showText: !b && !x })
           }
         ),
         /* @__PURE__ */ e("ul", { className: o.links, children: A.map(({ title: r, url: i }, d) => /* @__PURE__ */ e("li", { children: /* @__PURE__ */ e(
@@ -438,16 +430,16 @@ function Xe({
               ]
             }
           ),
-          /* @__PURE__ */ e(H, {}),
-          /* @__PURE__ */ e(O, {}),
+          /* @__PURE__ */ e(I, {}),
+          /* @__PURE__ */ e(P, {}),
           /* @__PURE__ */ e(
             u,
             {
               variant: "brand",
               as: s,
-              href: m("https://shop.highcharts.com/account", a),
+              href: m("https://shop.highcharts.com/", a),
               "aria-label": "Login",
-              children: /* @__PURE__ */ e(j, {})
+              children: /* @__PURE__ */ e(H, {})
             }
           ),
           /* @__PURE__ */ c(
@@ -470,7 +462,7 @@ function Xe({
             {
               variant: w ? "white" : "transparent",
               className: o.menu,
-              onClick: T,
+              onClick: B,
               children: [
                 w ? "Close" : "Menu",
                 w ? /* @__PURE__ */ e(te, {}) : /* @__PURE__ */ e(ce, {})
@@ -485,22 +477,22 @@ function Xe({
           items: t,
           link: s,
           host: a,
-          pathname: N
+          pathname: y
         }
       ),
       n,
-      x && /* @__PURE__ */ c(F, { children: [
+      S && /* @__PURE__ */ c(F, { children: [
         /* @__PURE__ */ e(
           "div",
           {
-            className: C(o.mobileOverlay, { [o.open]: w }),
-            onClick: T
+            className: _(o.mobileOverlay, { [o.open]: w }),
+            onClick: B
           }
         ),
         /* @__PURE__ */ c(
           "nav",
           {
-            className: C(o.mobile, {
+            className: _(o.mobile, {
               [o.open]: w
             }),
             children: [
@@ -510,7 +502,7 @@ function Xe({
                   {
                     className: o.logo,
                     href: m("https://www.highcharts.com/", a),
-                    children: /* @__PURE__ */ e(I, { showText: !_ })
+                    children: /* @__PURE__ */ e(O, { showText: !x })
                   }
                 ),
                 /* @__PURE__ */ c("div", { className: o.buttons, children: [
@@ -529,8 +521,8 @@ function Xe({
                       ]
                     }
                   ),
-                  /* @__PURE__ */ e(H, {}),
-                  /* @__PURE__ */ e(O, {})
+                  /* @__PURE__ */ e(I, {}),
+                  /* @__PURE__ */ e(P, {})
                 ] })
               ] }),
               /* @__PURE__ */ c("div", { className: o.buttons, children: [
@@ -540,12 +532,9 @@ function Xe({
                     variant: "brand",
                     fullWidth: !0,
                     as: s,
-                    href: m(
-                      "https://shop.highcharts.com/account",
-                      a
-                    ),
+                    href: m("https://shop.highcharts.com/", a),
                     children: [
-                      /* @__PURE__ */ e(j, {}),
+                      /* @__PURE__ */ e(H, {}),
                       "Login"
                     ]
                   }

package/dist/components/Notification/index.js

@@ -5,7 +5,7 @@ import { c as m } from "../../clsx-OuTLNxxd.js";
 import { Button as y } from "../Button/index.js";
 import { Container as A } from "../Container/index.js";
 import { NewTag as B } from "../NewTag/index.js";
-const E = "MhRkRW_active", j = "MhRkRW_attention", H = "MhRkRW_brand", L = "MhRkRW_carousel", P = "MhRkRW_close", X = "MhRkRW_container", $ = "MhRkRW_content", z = "MhRkRW_danger", D = "MhRkRW_description", S = "MhRkRW_notification", U = "MhRkRW_slide", q = "MhRkRW_success", G = "MhRkRW_title", J = "MhRkRW_titleText", e = {
+const E = "MhRkRW_active", j = "MhRkRW_attention", H = "MhRkRW_brand", L = "MhRkRW_carousel", P = "MhRkRW_close", X = "MhRkRW_container", $ = "MhRkRW_content", z = "MhRkRW_danger", D = "MhRkRW_description", S = "MhRkRW_notification", U = "MhRkRW_slide", q = "MhRkRW_success", G = "MhRkRW_title", J = "MhRkRW_titleText", n = {
   active: E,
   attention: j,
   brand: H,
@@ -22,71 +22,72 @@ const E = "MhRkRW_active", j = "MhRkRW_attention", H = "MhRkRW_brand", L = "MhRk
   titleText: J
 };
 function nt({
-  id: v,
+  id: g,
   content: c,
   variant: r = "brand",
-  closable: M = !0,
-  onClose: g
+  closable: v = !0,
+  onClose: M
 }) {
-  const n = Array.isArray(c) ? c : [c], [h, k] = d(
-    () => n.length > 1 ? Math.floor(Math.random() * n.length) : 0
-  ), [W, u] = d(!1), [_, R] = d(!1), f = W || _, i = n[h]?.url, N = i ? "a" : "div";
+  const e = Array.isArray(c) ? c : [c], [h, k] = d(
+    () => e.length > 1 ? Math.floor(Math.random() * e.length) : 0
+  ), [W, u] = d(!1), [_, R] = d(!1), f = W || _, i = e[h]?.url, N = i ? "a" : "div";
   C(() => {
-    if (n.length <= 1 || f) return;
+    if (e.length <= 1 || f) return;
     const t = window.setInterval(() => {
-      k((o) => (o + 1) % n.length);
+      k((o) => (o + 1) % e.length);
     }, 15e3);
     return () => window.clearInterval(t);
-  }, [n.length, f]);
+  }, [e.length, f]);
   const b = () => u(!0), x = (t) => {
     t.currentTarget.contains(t.relatedTarget) || u(!1);
   }, I = () => R(!0), T = () => R(!1), p = (t, o = !0) => {
     const a = /* @__PURE__ */ l(w, { children: [
-      t.title && /* @__PURE__ */ l("span", { className: e.title, children: [
+      t.title && /* @__PURE__ */ l("span", { className: n.title, children: [
         t.tag === "new" && /* @__PURE__ */ s(B, { variant: r, icon: !1 }),
-        /* @__PURE__ */ s("span", { className: e.titleText, children: t.title })
+        /* @__PURE__ */ s("span", { className: n.titleText, children: t.title })
       ] }),
-      t.description && /* @__PURE__ */ s("span", { className: e.description, children: t.description })
+      t.description && /* @__PURE__ */ s("span", { className: n.description, children: t.description })
     ] });
-    return /* @__PURE__ */ s("div", { className: e.content, "aria-hidden": !o, children: a });
+    return /* @__PURE__ */ s("div", { className: n.content, "aria-hidden": !o, children: a });
   };
-  return n.length ? /* @__PURE__ */ s(
+  return e.length ? /* @__PURE__ */ s(
     N,
     {
-      className: m(e.notification, e[r]),
+      className: m(n.notification, n[r]),
       "data-theme": "light",
       ...i ? {
         href: i,
         "data-track": "header-banner",
         "data-track-action": "click",
-        "data-track-label": v || i
+        "data-track-label": g || i
       } : {},
+      ...e.length > 1 ? { "aria-live": "polite" } : {},
       onFocus: b,
       onBlur: x,
       onMouseEnter: I,
       onMouseLeave: T,
-      children: /* @__PURE__ */ l(A, { className: e.container, children: [
-        n.length > 1 ? /* @__PURE__ */ s("div", { className: e.carousel, "aria-live": "polite", children: n.map((t, o) => {
+      children: /* @__PURE__ */ l(A, { className: n.container, children: [
+        e.length > 1 ? /* @__PURE__ */ s("div", { className: n.carousel, children: e.map((t, o) => {
           const a = o === h;
           return /* @__PURE__ */ s(
             "div",
             {
-              className: m(e.slide, { [e.active]: a }),
+              className: m(n.slide, { [n.active]: a }),
               "aria-hidden": !a,
               children: p(t, a)
             },
             `${t.title ?? t.description ?? "item"}-${o}`
           );
-        }) }) : p(n[0]),
-        M && /* @__PURE__ */ s(
+        }) }) : p(e[0]),
+        v && /* @__PURE__ */ s(
           y,
           {
             variant: r === "brand" ? "brand" : "transparent",
             size: 100,
-            className: e.close,
+            className: n.close,
             "aria-label": "Close notification",
             onClick: (t) => {
-              t.preventDefault(), t.stopPropagation(), g?.();
+              t.preventDefault(), t.stopPropagation(), M?.();
             },
             children: /* @__PURE__ */ s(F, {})
           }