@memobit/libs 3.4.3 → 3.6.0

package/dist/components/Slider/Slider2.js

@@ -1,39 +1,39 @@
 import './Slider.css';
 /* empty css       */
-import { jsx as n, jsxs as v } from "react/jsx-runtime";
-var x = (e) => !Number.isFinite(e) || e >= 1 ? 0 : String(e).split(".")[1]?.length ?? 0, F = ({ disabled: e = !1, largeValueState: s = "info", min: c = 0, max: m = 100, step: l = 1, value: i, onChange: p, showValues: h = !0, showValueAtTheRight: f = !1, valueSize: r, thin: u = !1, vertical: a = !1 }) => {
-  const g = (N) => {
-    p(parseFloat(N.target.value));
-  }, t = x(l), o = t > 0 ? i.toFixed(t) : String(i), d = f && !a;
-  return /* @__PURE__ */ v("div", {
-    className: [
-      "slider-component",
-      d ? "slider-component--inline" : "",
-      u ? "slider-component--thin" : "",
-      a ? "slider-component--vertical" : "",
-      r ? `slider-component--value-${r}` : ""
-    ].filter(Boolean).join(" "),
-    children: [/* @__PURE__ */ n("input", {
-      type: "range",
-      min: c,
-      max: m,
-      value: i,
-      step: l,
-      onChange: g,
-      className: "slider-input",
-      disabled: e
-    }), h && (d ? /* @__PURE__ */ n("span", {
-      className: `slider-value-inline slider-state-${s}`,
+import { jsx as n, jsxs as j } from "react/jsx-runtime";
+var F = (e) => !Number.isFinite(e) || e >= 1 ? 0 : String(e).split(".")[1]?.length ?? 0, D = ({ disabled: e = !1, largeValueState: i = "info", min: d = 0, max: m = 100, step: l = 1, value: s, onChange: p, showValues: u = !0, showValueAtTheRight: h = !1, valueSize: r, thin: f = !1, vertical: a = !1 }) => {
+  const g = (y) => {
+    p(parseFloat(y.target.value));
+  }, t = F(l), o = t > 0 ? s.toFixed(t) : String(s), c = h && !a, v = [
+    "slider-component",
+    c ? "slider-component--inline" : "",
+    f ? "slider-component--thin" : "",
+    a ? "slider-component--vertical" : "",
+    r ? `slider-component--value-${r}` : ""
+  ].filter(Boolean).join(" "), N = /* @__PURE__ */ n("input", {
+    type: "range",
+    min: d,
+    max: m,
+    value: s,
+    step: l,
+    onChange: g,
+    className: "slider-input",
+    disabled: e
+  }), x = u && (c ? /* @__PURE__ */ n("span", {
+    className: `slider-value-inline slider-state-${i}`,
+    children: o
+  }) : /* @__PURE__ */ n("div", {
+    className: "slider-display",
+    children: /* @__PURE__ */ n("span", {
+      className: `slider-value slider-state-${i}`,
       children: o
-    }) : /* @__PURE__ */ n("div", {
-      className: "slider-display",
-      children: /* @__PURE__ */ n("span", {
-        className: `slider-value slider-state-${s}`,
-        children: o
-      })
-    }))]
+    })
+  }));
+  return /* @__PURE__ */ j("div", {
+    className: v,
+    children: [N, x]
   });
 };
 export {
-  F as Slider
+  D as Slider
 };

package/dist/components/Splitter/Splitter2.js

@@ -1,55 +1,55 @@
 import './Splitter.css';
 /* empty css         */
-import { Fragment as K, useCallback as h, useEffect as U, useMemo as $, useRef as I, useState as j } from "react";
-import { jsx as D, jsxs as E } from "react/jsx-runtime";
-var L = 10, F = (c) => {
-  const m = c.reduce((e, i) => e + (i.size ?? 0), 0), d = c.filter((e) => e.size === void 0).length;
-  if (d === 0) return m === 0 ? c.map(() => 100 / c.length) : c.map((e) => (e.size ?? 0) / m * 100);
+import { Fragment as U, useCallback as h, useEffect as $, useMemo as j, useRef as I, useState as E } from "react";
+import { jsx as D, jsxs as L } from "react/jsx-runtime";
+var F = 10, X = (l) => {
+  const m = l.reduce((e, s) => e + (s.size ?? 0), 0), d = l.filter((e) => e.size === void 0).length;
+  if (d === 0) return m === 0 ? l.map(() => 100 / l.length) : l.map((e) => (e.size ?? 0) / m * 100);
   const z = Math.max(0, 100 - m) / d;
-  return c.map((e) => e.size ?? z);
-}, Z = ({ className: c = "", collapsible: m = !1, gutterSize: d = 6, keyboardStep: z = 2, onResize: e, orientation: i = "horizontal", panes: g, resetOnDoubleClick: y = !0 }) => {
-  const f = $(() => F(g), [g]), [o, S] = j(f), B = I(null), P = I(null);
-  U(() => {
+  return l.map((e) => e.size ?? z);
+}, b = ({ className: l = "", collapsible: m = !1, gutterSize: d = 6, keyboardStep: z = 2, onResize: e, orientation: s = "horizontal", panes: g, resetOnDoubleClick: y = !0 }) => {
+  const f = j(() => X(g), [g]), [o, S] = E(f), B = I(null), P = I(null);
+  $(() => {
     S((t) => t.length === f.length ? t : f);
   }, [f]);
-  const A = h((t) => g[t]?.minSize ?? L, [g]), _ = h((t, r, n, s) => {
-    const l = A(t), a = A(t + 1), p = r + n;
-    let u = r + s;
-    return u < l && (u = m && u < l / 2 ? 0 : l), p - u < a && (u = m && p - u < a / 2 ? p : p - a), [u, p - u];
+  const A = h((t) => g[t]?.minSize ?? F, [g]), _ = h((t, r, n, i) => {
+    const c = A(t), a = A(t + 1), p = r + n;
+    let u = r + i;
+    return u < c && (u = m && u < c / 2 ? 0 : c), p - u < a && (u = m && p - u < a / 2 ? p : p - a), [u, p - u];
   }, [m, A]), w = h((t, [r, n]) => {
-    const s = o.map((l, a) => a === t ? r : a === t + 1 ? n : l);
-    return S(s), s;
+    const i = o.map((c, a) => a === t ? r : a === t + 1 ? n : c);
+    return S(i), i;
   }, [o]), M = h((t, r) => {
     t.preventDefault(), t.currentTarget.setPointerCapture(t.pointerId), P.current = {
       index: r,
       startA: o[r],
       startB: o[r + 1],
-      startPosition: i === "horizontal" ? t.clientX : t.clientY
+      startPosition: s === "horizontal" ? t.clientX : t.clientY
     };
-  }, [i, o]), C = h((t) => {
+  }, [s, o]), C = h((t) => {
     const r = P.current, n = B.current;
     if (!r || !n) return;
-    const s = n.getBoundingClientRect(), l = i === "horizontal" ? s.width : s.height;
-    if (l === 0) return;
-    const a = ((i === "horizontal" ? t.clientX : t.clientY) - r.startPosition) / l * 100;
+    const i = n.getBoundingClientRect(), c = s === "horizontal" ? i.width : i.height;
+    if (c === 0) return;
+    const a = ((s === "horizontal" ? t.clientX : t.clientY) - r.startPosition) / c * 100;
     w(r.index, _(r.index, r.startA, r.startB, a));
   }, [
     w,
-    i,
+    s,
     _
   ]), N = h((t) => {
     P.current && (t.currentTarget.releasePointerCapture(t.pointerId), P.current = null, e?.(o));
   }, [e, o]), T = h((t, r) => {
-    const n = i === "horizontal" ? "ArrowLeft" : "ArrowUp", s = i === "horizontal" ? "ArrowRight" : "ArrowDown";
-    if (t.key !== n && t.key !== s) return;
+    const n = s === "horizontal" ? "ArrowLeft" : "ArrowUp", i = s === "horizontal" ? "ArrowRight" : "ArrowDown";
+    if (t.key !== n && t.key !== i) return;
     t.preventDefault();
-    const l = t.key === s ? 1 : -1;
-    e?.(w(r, _(r, o[r], o[r + 1], l * z)));
+    const c = t.key === i ? 1 : -1;
+    e?.(w(r, _(r, o[r], o[r + 1], c * z)));
   }, [
     w,
     z,
     e,
-    i,
+    s,
     _,
     o
   ]), k = h(() => {
@@ -58,16 +58,16 @@ var L = 10, F = (c) => {
     f,
     e,
     y
-  ]), v = { "--_splitter-gutter": `${d}px` };
+  ]), v = { "--_splitter-gutter": `${d}px` }, K = [
+    "splitter",
+    `splitter--${s}`,
+    l
+  ].filter(Boolean).join(" ");
   return /* @__PURE__ */ D("div", {
-    className: [
-      "splitter",
-      `splitter--${i}`,
-      c
-    ].filter(Boolean).join(" "),
+    className: K,
     ref: B,
     style: v,
-    children: g.map((t, r) => /* @__PURE__ */ E(K, { children: [/* @__PURE__ */ D("div", {
+    children: g.map((t, r) => /* @__PURE__ */ L(U, { children: [/* @__PURE__ */ D("div", {
       className: `splitter__pane${o[r] === 0 ? " splitter__pane--collapsed" : ""}`,
       style: { flexBasis: `${o[r]}%` },
       children: t.content
@@ -85,5 +85,5 @@ var L = 10, F = (c) => {
   });
 };
 export {
-  Z as Splitter
+  b as Splitter
 };

package/dist/components/StackedBar/StackedBar2.js

@@ -1,44 +1,46 @@
 import './StackedBar.css';
-import { Tooltip as $ } from "../Tooltip/Tooltip2.js";
-import { format2Digits as x } from "../../helpers/Numbers.js";
+import { Tooltip as y } from "../Tooltip/Tooltip2.js";
+import { format2Digits as M } from "../../helpers/Numbers.js";
 /* empty css           */
-import { useMemo as M } from "react";
-import { jsx as s } from "react/jsx-runtime";
-var j = (r, o, c) => {
-  const i = `${x(o)}%`;
-  return r.label && c ? `${r.label} - ${i}` : r.label ? r.label : i;
-}, w = ({ animated: r = !1, height: o, normalize: c = !0, orientation: i = "horizontal", segments: a, separators: m = !1, showLabels: p = !0, showPercentage: b = !0, thin: h = !1, width: d }) => {
-  const k = M(() => {
+import { useMemo as S } from "react";
+import { jsx as i } from "react/jsx-runtime";
+var j = (e, o, c) => {
+  const s = `${M(o)}%`;
+  return e.label && c ? `${e.label} - ${s}` : e.label ? e.label : s;
+}, D = ({ animated: e = !1, height: o, normalize: c = !0, orientation: s = "horizontal", segments: a, separators: f = !1, showLabels: p = !0, showPercentage: b = !0, thin: h = !1, width: d }) => {
+  const k = S(() => {
     if (a.length === 0) return [];
     if (!c) return a.map((t) => Math.max(0, t.value));
-    const e = a.reduce((t, l) => t + Math.max(0, l.value), 0);
-    return e === 0 ? a.map(() => 0) : a.map((t) => Math.max(0, t.value) / e * 100);
-  }, [a, c]), v = i === "vertical", n = {};
-  return o !== void 0 && (n.height = o), d !== void 0 && (n.width = d), /* @__PURE__ */ s("div", {
-    className: [
-      "stacked-bar",
-      `stacked-bar--${i}`,
-      h ? "stacked-bar--thin" : "",
-      m ? "stacked-bar--separators" : ""
-    ].filter(Boolean).join(" "),
+    const r = a.reduce((t, l) => t + Math.max(0, l.value), 0);
+    return r === 0 ? a.map(() => 0) : a.map((t) => Math.max(0, t.value) / r * 100);
+  }, [a, c]), v = s === "vertical", n = {};
+  o !== void 0 && (n.height = o), d !== void 0 && (n.width = d);
+  const _ = [
+    "stacked-bar",
+    `stacked-bar--${s}`,
+    h ? "stacked-bar--thin" : "",
+    f ? "stacked-bar--separators" : ""
+  ].filter(Boolean).join(" ");
+  return /* @__PURE__ */ i("div", {
+    className: _,
     style: n,
-    children: a.map((e, t) => {
+    children: a.map((r, t) => {
       const l = k[t];
       if (l <= 0) return null;
-      const _ = e.state || "default", u = e.pattern || "solid", f = j(e, l, b);
-      return /* @__PURE__ */ s($, {
-        title: f,
-        children: /* @__PURE__ */ s("div", {
-          className: [
-            "stacked-bar__segment",
-            `stacked-bar__segment--${_}`,
-            `stacked-bar__segment--${u}`,
-            r && u !== "solid" ? "stacked-bar__segment--animated" : ""
-          ].filter(Boolean).join(" "),
-          style: v ? { height: `${l}%` } : { width: `${l}%` },
-          children: p && /* @__PURE__ */ s("span", {
+      const $ = r.state || "default", m = r.pattern || "solid", u = j(r, l, b), x = [
+        "stacked-bar__segment",
+        `stacked-bar__segment--${$}`,
+        `stacked-bar__segment--${m}`,
+        e && m !== "solid" ? "stacked-bar__segment--animated" : ""
+      ].filter(Boolean).join(" "), N = v ? { height: `${l}%` } : { width: `${l}%` };
+      return /* @__PURE__ */ i(y, {
+        title: u,
+        children: /* @__PURE__ */ i("div", {
+          className: x,
+          style: N,
+          children: p && /* @__PURE__ */ i("span", {
             className: "stacked-bar__segment-label",
-            children: f
+            children: u
           })
         })
       }, `stacked-bar-segment-${t}`);
@@ -46,5 +48,5 @@ var j = (r, o, c) => {
   });
 };
 export {
-  w as StackedBar
+  D as StackedBar
 };

package/dist/components/Stats/Stats2.js

@@ -1,26 +1,30 @@
 import './Stats.css';
 /* empty css      */
 import "react";
-import { jsx as s, jsxs as d } from "react/jsx-runtime";
-var v = ({ items: t, dividers: l = !0, align: e = "left", size: r = "medium", className: i = "" }) => t.length === 0 ? null : /* @__PURE__ */ s("div", {
-  className: [
+import { jsx as a, jsxs as d } from "react/jsx-runtime";
+var _ = ({ items: t, dividers: l = !0, align: e = "left", size: r = "medium", className: i = "" }) => {
+  if (t.length === 0) return null;
+  const n = [
     "stats",
     `stats--align-${e}`,
     `stats--size-${r}`,
     l ? "stats--dividers" : "",
     i
-  ].filter(Boolean).join(" "),
-  children: t.map((a, n) => /* @__PURE__ */ d("div", {
-    className: "stats__item",
-    children: [/* @__PURE__ */ s("span", {
-      className: "stats__label",
-      children: a.label
-    }), /* @__PURE__ */ s("span", {
-      className: `stats__value stats__value--${a.variant ?? "default"}`,
-      children: a.value
-    })]
-  }, `${a.label}-${n}`))
-});
+  ].filter(Boolean).join(" ");
+  return /* @__PURE__ */ a("div", {
+    className: n,
+    children: t.map((s, c) => /* @__PURE__ */ d("div", {
+      className: "stats__item",
+      children: [/* @__PURE__ */ a("span", {
+        className: "stats__label",
+        children: s.label
+      }), /* @__PURE__ */ a("span", {
+        className: `stats__value stats__value--${s.variant ?? "default"}`,
+        children: s.value
+      })]
+    }, `${s.label}-${c}`))
+  });
+};
 export {
-  v as Stats
+  _ as Stats
 };

package/dist/components/StickyBar/StickyBar2.js

@@ -1,29 +1,33 @@
 import './StickyBar.css';
-import { Button as n } from "../Button/Button2.js";
+import { Button as k } from "../Button/Button2.js";
 /* empty css          */
 import "react";
-import { jsx as e, jsxs as m } from "react/jsx-runtime";
-var u = ({ children: c, position: t = "bottom", align: s = "between", visible: l = !0, onClose: r, closeLabel: i = "Close", offset: a = 0, className: o }) => l ? /* @__PURE__ */ m("div", {
-  className: [
+import { jsx as s, jsxs as y } from "react/jsx-runtime";
+var x = ({ children: e, position: t = "bottom", align: o = "between", visible: c = !0, onClose: r, closeLabel: i = "Close", offset: a = 0, className: l }) => {
+  if (!c) return null;
+  const n = [
     "sticky-bar",
     `sticky-bar--${t}`,
-    `sticky-bar--align-${s}`,
-    o
-  ].filter(Boolean).join(" "),
-  style: a ? { [t]: `${a}px` } : void 0,
-  children: [/* @__PURE__ */ e("div", {
-    className: "sticky-bar__content",
-    children: c
-  }), r && /* @__PURE__ */ e(n, {
-    className: "sticky-bar__close",
-    icon: "clear",
-    onClick: r,
-    size: "small",
-    variant: "ghost",
-    title: i,
-    children: i
-  })]
-}) : null;
+    `sticky-bar--align-${o}`,
+    l
+  ].filter(Boolean).join(" "), m = a ? { [t]: `${a}px` } : void 0;
+  return /* @__PURE__ */ y("div", {
+    className: n,
+    style: m,
+    children: [/* @__PURE__ */ s("div", {
+      className: "sticky-bar__content",
+      children: e
+    }), r && /* @__PURE__ */ s(k, {
+      className: "sticky-bar__close",
+      icon: "clear",
+      onClick: r,
+      size: "small",
+      variant: "ghost",
+      title: i,
+      children: i
+    })]
+  });
+};
 export {
-  u as StickyBar
+  x as StickyBar
 };

package/dist/components/Timeline/Timeline2.js

@@ -2,56 +2,62 @@ import './Timeline.css';
 /* empty css         */
 import "react";
 import { jsx as i, jsxs as n } from "react/jsx-runtime";
-var d = (l = "default") => `timeline__dot timeline__dot--${l}`, v = ({ items: l, orientation: m = "vertical", size: s = "md", connected: a = !0, animated: c = !0, className: r = "" }) => /* @__PURE__ */ i("ol", {
-  className: [
+var _ = (l = "default") => `timeline__dot timeline__dot--${l}`, u = ({ items: l, orientation: s = "vertical", size: m = "md", connected: t = !0, animated: c = !0, className: r = "" }) => {
+  const d = [
     "timeline",
-    `timeline--${m}`,
     `timeline--${s}`,
-    a ? "timeline--connected" : "",
+    `timeline--${m}`,
+    t ? "timeline--connected" : "",
     c ? "timeline--animated" : "",
     r
-  ].filter(Boolean).join(" "),
-  children: l.map((e, t) => /* @__PURE__ */ n("li", {
-    className: [
-      "timeline__item",
-      e.active ? "timeline__item--active" : "",
-      e.muted ? "timeline__item--muted" : ""
-    ].filter(Boolean).join(" "),
-    style: { "--item-index": t },
-    children: [/* @__PURE__ */ n("div", {
-      className: "timeline__node",
-      children: [/* @__PURE__ */ i("div", {
-        className: d(e.variant),
-        children: e.icon ? /* @__PURE__ */ i("span", {
-          className: "timeline__dot-icon",
-          children: e.icon
-        }) : null
-      }), a && t < l.length - 1 && /* @__PURE__ */ i("div", { className: "timeline__connector" })]
-    }), /* @__PURE__ */ n("div", {
-      className: "timeline__content",
-      children: [
-        /* @__PURE__ */ n("div", {
-          className: "timeline__header",
-          children: [/* @__PURE__ */ i("span", {
-            className: "timeline__title",
-            children: e.title
-          }), e.badge && /* @__PURE__ */ i("span", {
-            className: `timeline__badge timeline__badge--${e.variant ?? "default"}`,
-            children: e.badge
-          })]
-        }),
-        e.description && /* @__PURE__ */ i("p", {
-          className: "timeline__description",
-          children: e.description
-        }),
-        e.timestamp && /* @__PURE__ */ i("time", {
-          className: "timeline__timestamp",
-          children: e.timestamp
-        })
-      ]
-    })]
-  }, e.id))
-});
+  ].filter(Boolean).join(" ");
+  return /* @__PURE__ */ i("ol", {
+    className: d,
+    children: l.map((e, a) => {
+      const o = [
+        "timeline__item",
+        e.active ? "timeline__item--active" : "",
+        e.muted ? "timeline__item--muted" : ""
+      ].filter(Boolean).join(" ");
+      return /* @__PURE__ */ n("li", {
+        className: o,
+        style: { "--item-index": a },
+        children: [/* @__PURE__ */ n("div", {
+          className: "timeline__node",
+          children: [/* @__PURE__ */ i("div", {
+            className: _(e.variant),
+            children: e.icon ? /* @__PURE__ */ i("span", {
+              className: "timeline__dot-icon",
+              children: e.icon
+            }) : null
+          }), t && a < l.length - 1 && /* @__PURE__ */ i("div", { className: "timeline__connector" })]
+        }), /* @__PURE__ */ n("div", {
+          className: "timeline__content",
+          children: [
+            /* @__PURE__ */ n("div", {
+              className: "timeline__header",
+              children: [/* @__PURE__ */ i("span", {
+                className: "timeline__title",
+                children: e.title
+              }), e.badge && /* @__PURE__ */ i("span", {
+                className: `timeline__badge timeline__badge--${e.variant ?? "default"}`,
+                children: e.badge
+              })]
+            }),
+            e.description && /* @__PURE__ */ i("p", {
+              className: "timeline__description",
+              children: e.description
+            }),
+            e.timestamp && /* @__PURE__ */ i("time", {
+              className: "timeline__timestamp",
+              children: e.timestamp
+            })
+          ]
+        })]
+      }, e.id);
+    })
+  });
+};
 export {
-  v as Timeline
+  u as Timeline
 };

package/dist/components/Tooltip/Tooltip2.js

@@ -1,9 +1,9 @@
 import './Tooltip.css';
 /* empty css        */
 import { useEffect as b, useRef as h, useState as B } from "react";
-import { Fragment as V, jsx as k, jsxs as D } from "react/jsx-runtime";
+import { Fragment as V, jsx as D, jsxs as N } from "react/jsx-runtime";
 import { createPortal as O } from "react-dom";
-var K = ({ title: L, position: T = "top", delay: N = 200, children: _, disabled: $ = !1, className: F = "", maxWidth: p, maxHeight: a }) => {
+var K = ({ title: L, position: T = "top", delay: _ = 200, children: k, disabled: $ = !1, className: F = "", maxWidth: p, maxHeight: a }) => {
   const [f, s] = B(!1), [M, I] = B({
     top: 0,
     left: 0
@@ -31,7 +31,6 @@ var K = ({ title: L, position: T = "top", delay: N = 200, children: _, disabled:
         break;
       case "right":
         o = e.top + e.height / 2 - n.height / 2, i = e.right + v;
-        break;
     }
     const u = 8;
     i < u && (i = u), i + n.width > window.innerWidth - u && (i = window.innerWidth - n.width - u), o < u && (o = u), o + n.height > window.innerHeight - u && (o = window.innerHeight - n.height - u), I({
@@ -41,7 +40,7 @@ var K = ({ title: L, position: T = "top", delay: N = 200, children: _, disabled:
   }, P = () => {
     $ || w.current || (t.current && (clearTimeout(t.current), t.current = null), c.current = setTimeout(() => {
       s(!0);
-    }, N));
+    }, _));
   }, y = () => {
     w.current || (c.current && clearTimeout(c.current), R > 0 ? t.current = setTimeout(() => s(!1), R) : s(!1));
   }, j = (r) => {
@@ -65,7 +64,7 @@ var K = ({ title: L, position: T = "top", delay: N = 200, children: _, disabled:
   }, z = () => {
     m && (t.current = setTimeout(() => s(!1), R));
   };
-  return /* @__PURE__ */ D(V, { children: [/* @__PURE__ */ k("span", {
+  return /* @__PURE__ */ N(V, { children: [/* @__PURE__ */ D("span", {
     ref: l,
     className: "tooltip-trigger",
     onMouseEnter: P,
@@ -73,8 +72,8 @@ var K = ({ title: L, position: T = "top", delay: N = 200, children: _, disabled:
     onFocus: P,
     onBlur: y,
     onPointerDown: j,
-    children: _
-  }), f && L && O(/* @__PURE__ */ D("div", {
+    children: k
+  }), f && L && O(/* @__PURE__ */ N("div", {
     ref: g,
     className: `tooltip tooltip--${T} ${m ? "tooltip--scrollable" : ""} ${F}`,
     style: {
@@ -85,7 +84,7 @@ var K = ({ title: L, position: T = "top", delay: N = 200, children: _, disabled:
     },
     onMouseEnter: x,
     onMouseLeave: z,
-    children: [L, /* @__PURE__ */ k("div", { className: `tooltip__arrow tooltip__arrow--${T}` })]
+    children: [L, /* @__PURE__ */ D("div", { className: `tooltip__arrow tooltip__arrow--${T}` })]
   }), document.body)] });
 };
 export {

package/dist/components/TourHud/TourHud2.js

@@ -1,35 +1,35 @@
 import './TourHud.css';
-import { Icon as u } from "../Icon/Icon2.js";
+import { Icon as n } from "../Icon/Icon2.js";
 /* empty css        */
 import "react";
 import { jsx as t, jsxs as e } from "react/jsx-runtime";
-var y = ({ label: l, stepLabel: n, index: r, total: i, title: s, note: d, onPrev: a, onNext: c, onExit: m, width: o, className: h = "" }) => {
-  const _ = o === void 0 ? void 0 : { "--tour-hud-width": typeof o == "number" ? `${o}px` : o };
+var j = ({ label: d, stepLabel: l, index: r, total: s, title: u, note: i, onPrev: a, onNext: c, onExit: m, width: o, className: h = "" }) => {
+  const _ = o === void 0 ? void 0 : { "--tour-hud-width": typeof o == "number" ? `${o}px` : o }, b = [
+    "tour-hud",
+    o !== void 0 && "tour-hud--fixed-width",
+    h
+  ].filter(Boolean).join(" "), p = [
+    d,
+    `Stop ${r + 1} / ${s}`,
+    l
+  ].filter(Boolean);
   return /* @__PURE__ */ e("div", {
-    className: [
-      "tour-hud",
-      o !== void 0 && "tour-hud--fixed-width",
-      h
-    ].filter(Boolean).join(" "),
+    className: b,
     style: _,
     children: [/* @__PURE__ */ e("div", {
       className: "tour-hud__body",
       children: [
         /* @__PURE__ */ t("div", {
           className: "tour-hud__context",
-          children: [
-            l,
-            `Stop ${r + 1} / ${i}`,
-            n
-          ].filter(Boolean).join(" · ")
+          children: p.join(" · ")
         }),
         /* @__PURE__ */ t("div", {
           className: "tour-hud__title",
-          children: s
+          children: u
         }),
-        d && /* @__PURE__ */ t("div", {
+        i && /* @__PURE__ */ t("div", {
           className: "tour-hud__note",
-          children: d
+          children: i
         })
       ]
     }), /* @__PURE__ */ e("div", {
@@ -40,7 +40,7 @@ var y = ({ label: l, stepLabel: n, index: r, total: i, title: s, note: d, onPrev
           className: "tour-hud__btn",
           disabled: r === 0,
           onClick: a,
-          children: [/* @__PURE__ */ t(u, {
+          children: [/* @__PURE__ */ t(n, {
             name: "arrow-left",
             size: "sm"
           }), "Prev"]
@@ -48,9 +48,9 @@ var y = ({ label: l, stepLabel: n, index: r, total: i, title: s, note: d, onPrev
         /* @__PURE__ */ e("button", {
           type: "button",
           className: "tour-hud__btn",
-          disabled: r >= i - 1,
+          disabled: r >= s - 1,
           onClick: c,
-          children: ["Next", /* @__PURE__ */ t(u, {
+          children: ["Next", /* @__PURE__ */ t(n, {
             name: "arrow-right",
             size: "sm"
           })]
@@ -66,5 +66,5 @@ var y = ({ label: l, stepLabel: n, index: r, total: i, title: s, note: d, onPrev
   });
 };
 export {
-  y as TourHud
+  j as TourHud
 };