hys-ui 0.3.0 → 0.5.0

package/dist/components/HysAnimatedNumber/NumberDigits/NumberDigits2.vue.js

@@ -0,0 +1,105 @@
+import { defineComponent as z, useSlots as A, computed as l, openBlock as r, createElementBlock as c, Fragment as b, renderList as I, normalizeStyle as L, renderSlot as j, mergeProps as w, createElementVNode as P, toDisplayString as g, normalizeClass as G } from "vue";
+import { digitCount as v, numberTokens as R, createDigitTracks as V, digitMotion as X } from "../../../composables/animatedNumberDigits.js";
+import { bounded as u } from "../../../composables/animatedNumberFormat.js";
+const $ = ["role", "aria-label", "data-effect", "data-axis", "data-timer-motion"], q = { class: "hys-number-face hys-number-face-first" }, H = { class: "hys-number-face hys-number-face-second" }, Q = /* @__PURE__ */ z({
+  __name: "NumberDigits",
+  props: {
+    current: {},
+    start: {},
+    end: {},
+    glyphs: {},
+    context: {},
+    effect: {},
+    axis: {},
+    order: {},
+    stagger: {},
+    duration: {},
+    digitDuration: {},
+    motion: { type: Boolean },
+    timer: { type: Boolean },
+    accessible: { type: Boolean },
+    split: { type: Boolean }
+  },
+  setup(s) {
+    const e = s, p = A(), x = l(
+      () => e.motion && !e.timer && e.context.progress < 1 && ["delayed", "playing", "paused"].includes(e.context.status)
+    ), S = l(
+      () => e.effect === "appear" || e.effect === "disappear"
+    ), C = l(
+      () => v(e.start.parts) > v(e.end.parts) ? e.start : e.end
+    ), B = l(() => {
+      const n = x.value && S.value && !p.digit ? C.value : e.current;
+      return R(
+        n.parts,
+        v(n.parts) <= 48 && (!!e.effect || !!p.digit || e.split)
+      );
+    }), D = l(
+      () => e.effect && !e.timer && V(e.start, e.end, e.glyphs)
+    ), F = l(() => {
+      const n = B.value.filter((t) => t.section).length;
+      let E = 0;
+      return B.value.map((t) => {
+        if (!t.section) return { token: t };
+        const o = E++, y = e.order === "low-to-high" ? n - 1 - o : o, i = u(e.duration, 650, 1, Number.MAX_SAFE_INTEGER), m = u(e.stagger, 0, 0, i / Math.max(1, n)), h = y * m, M = u(
+          e.digitDuration,
+          i - h,
+          1,
+          i - h
+        ), N = e.context.progress, f = m || e.digitDuration !== void 0 ? u((N * i - h) / M, 0, 0, 1) : u(e.context.easedProgress, N, 0, 1), d = x.value && D.value ? D.value(t) : void 0, a = d && (f < 1 || S.value) && e.effect ? X(e.effect, d, f, o, e.glyphs) : void 0, T = {
+          ...e.context,
+          digit: t.text,
+          index: o,
+          position: t.position,
+          section: t.section,
+          digitProgress: f
+        };
+        return {
+          token: t,
+          context: T,
+          face: d && f === 1 && d.toPresent ? e.glyphs[d.destination] : t.text,
+          track: a != null && a.changed ? a : void 0,
+          style: a ? {
+            "--number-phase": a.phase,
+            "--number-direction": a.direction
+          } : void 0
+        };
+      });
+    });
+    return (n, E) => (r(), c("span", {
+      class: "hys-number-digits",
+      role: s.accessible ? "img" : void 0,
+      "aria-label": s.accessible ? s.current.parts.map(({ value: t }) => t).join("") : void 0,
+      "data-effect": s.effect,
+      "data-axis": s.axis,
+      "data-timer-motion": s.timer && s.motion && s.effect ? "" : void 0
+    }, [
+      (r(!0), c(b, null, I(F.value, ({ token: t, context: o, face: y, track: i, style: m }) => (r(), c(b, {
+        key: t.key
+      }, [
+        o ? (r(), c("span", {
+          key: 0,
+          class: "hys-ui-motion-number-digit",
+          style: L(m)
+        }, [
+          p.digit ? j(n.$slots, "digit", w({ ref_for: !0 }, o), void 0, !0, 0) : i ? (r(), c(b, { key: 1 }, [
+            P("span", q, g(i.first), 1),
+            P("span", H, g(i.second), 1)
+          ], 64)) : (r(), c("span", {
+            key: s.timer ? t.text : void 0,
+            class: "hys-number-face hys-number-timer-face"
+          }, g(y), 1))
+        ], 4)) : (r(), c("span", {
+          key: 1,
+          class: G({
+            "hys-ui-motion-number-separator": t.type === "group" || t.type === "decimal",
+            "hys-ui-motion-number-currency": t.type === "currency",
+            "hys-ui-motion-number-sign": t.type === "plusSign" || t.type === "minusSign"
+          })
+        }, g(t.text), 3))
+      ], 64))), 128))
+    ], 8, $));
+  }
+});
+export {
+  Q as default
+};

package/dist/components/HysAnimatedNumber/animation/digital.js

@@ -0,0 +1,186 @@
+import { rollingGlyph as I, noise as k, glyph as d, rectangle as S, wave as W, smooth as _ } from "./paint.js";
+import { glyphMask as C } from "./particles.js";
+import { tracePath as E, digitPath as R } from "./paths.js";
+const Z = [
+  "abcdef",
+  "bc",
+  "abged",
+  "abgcd",
+  "fgbc",
+  "afgcd",
+  "afgecd",
+  "abc",
+  "abcdefg",
+  "abfgcd"
+], j = {
+  a: [-0.2, -0.41, 0.2, -0.41],
+  b: [0.22, -0.37, 0.22, -0.04],
+  c: [0.22, 0.04, 0.22, 0.37],
+  d: [-0.2, 0.41, 0.2, 0.41],
+  e: [-0.22, 0.04, -0.22, 0.37],
+  f: [-0.22, -0.37, -0.22, -0.04],
+  g: [-0.2, 0, 0.2, 0]
+};
+function q(s, l, e) {
+  const { ctx: o, size: h, color: p, accent: f } = s;
+  o.save(), o.lineWidth = (e === 3 ? 0.045 : 0.075) * h, o.lineCap = e === 3 ? "butt" : "round";
+  const c = Z[l] ?? "";
+  for (const [b, [t, y, r, u]] of Object.entries(j))
+    o.globalAlpha = c.includes(b) ? 1 : 0.14, o.strokeStyle = e === 3 ? p : f, o.beginPath(), o.moveTo(t * h, y * h), e === 1 && y === u && (o.lineTo(-0.022 * h, u * h), o.moveTo(0.022 * h, u * h)), o.lineTo(r * h, u * h), o.stroke();
+  e === 1 && (o.lineWidth = 0.035 * h, [
+    [-0.18, -0.35, -0.025, -0.05],
+    [0.18, -0.35, 0.025, -0.05],
+    [-0.18, 0.35, -0.025, 0.05],
+    [0.18, 0.35, 0.025, 0.05],
+    [0, -0.37, 0, -0.05],
+    [0, 0.05, 0, 0.37]
+  ].forEach(([t, y, r, u], n) => {
+    o.globalAlpha = (l + n) % 4 === 0 ? 0.65 : 0.12, o.beginPath(), o.moveTo(t * h, y * h), o.lineTo(r * h, u * h), o.stroke();
+  })), o.restore();
+}
+function B(s, l, e) {
+  const { p: o, width: h, size: p, ctx: f, accent: c } = s, b = h / p / 2;
+  d(s, e, {
+    alpha: l === 14 ? 0.78 : 0.9,
+    color: l === 14 ? c : void 0
+  });
+  for (let t = 0; t < (l === 20 ? 12 : 8); t++) {
+    const y = -0.54 + t * (l === 20 ? 0.09 : 0.135);
+    (l !== 20 || Math.floor(o * 12) > t) && S(
+      s,
+      -b,
+      y,
+      b * 2,
+      0.035,
+      () => d(s, e, { color: c, alpha: 0.55, glow: 0.09 })
+    );
+  }
+  S(
+    s,
+    -b,
+    -0.58 + o * 1.16,
+    b * 2,
+    0.05,
+    () => d(s, e, { color: c, glow: 0.2 })
+  ), l === 19 && (f.save(), f.strokeStyle = c, f.globalAlpha *= 0.7 * W(o), f.lineWidth = 0.025 * p, f.beginPath(), f.arc(0, 0, 0.43 * p, 0, o * Math.PI * 2), f.stroke(), f.restore());
+}
+function X(s, l) {
+  const {
+    ctx: e,
+    p: o,
+    from: h,
+    to: p,
+    toIndex: f,
+    size: c,
+    width: b,
+    accent: t,
+    color: y,
+    seed: r,
+    strength: u
+  } = s, n = W(o) * u, w = o > 0.85 ? 1 : Math.floor(o * 28), T = Math.floor(k(r, w) * 10), P = o >= 0.84 ? p : I(s, T);
+  if (l <= 3) {
+    const x = o === 1 ? f : o < 0.24 ? s.fromIndex : o < 0.68 ? T : f;
+    if (l !== 2) q(s, x, l);
+    else {
+      e.save(), e.fillStyle = t;
+      for (const [g, i] of C(
+        I(s, x),
+        e.font,
+        c,
+        5
+      ))
+        e.beginPath(), e.arc(g * c, i * c, c * 0.038, 0, Math.PI * 2), e.fill();
+      e.restore();
+    }
+    return;
+  }
+  if ([6, 7, 8, 9, 22, 23, 24, 25].includes(l)) {
+    const g = {
+      6: "0101ヲヌ",
+      7: "01",
+      8: "ABCDEF0123456789",
+      9: "#@?&XYZ",
+      22: "9876543210",
+      23: "01Zフォ",
+      24: ">_0123456789",
+      25: "_"
+    }[l], i = g[Math.floor(k(r + 6, w) * g.length)], M = o < (l === 24 ? 0.58 : 0.84) ? i : p;
+    (l === 23 || l === 22 || l === 6) && d(s, i, {
+      y: -0.5 + o * 0.55,
+      alpha: 0.35 * n,
+      color: t
+    }), d(s, M, {
+      color: t,
+      glow: 0.08 * n,
+      x: l === 22 ? -0.35 * (1 - o) : 0
+    }), l === 25 && w % 2 === 0 && d(s, "_", { x: 0.32, y: 0.04, alpha: n, color: t });
+    return;
+  }
+  if ([5, 13, 14, 19, 20, 21, 26, 29].includes(l)) {
+    if (B(s, l, o < 0.28 ? h : p), l === 5 && d(s, p, {
+      y: -0.08 * n,
+      sx: 0.92,
+      alpha: 0.45 * n,
+      color: t,
+      glow: 0.13
+    }), l === 21 || l === 29) {
+      e.save(), e.fillStyle = t, e.globalAlpha *= 0.24 * n;
+      const x = b / c / 5;
+      for (let g = 0; g < 8; g++)
+        for (let i = 0; i < 5; i++) {
+          const M = l === 21 ? g / 8 + i * 0.025 < o : k(r + i, g) < o, z = l === 29 ? (k(r + g, i) - 0.5) * 0.7 * (1 - o) : 0, D = l === 29 ? (k(r + i + 9, g) - 0.5) * 0.8 * (1 - o) : 0;
+          M && e.fillRect(
+            ((i - 2.5) * x + z) * c,
+            ((g - 4) * 0.13 + D) * c,
+            x * c - 1,
+            0.13 * c - 1
+          );
+        }
+      e.restore();
+    }
+    l === 26 && (e.save(), e.strokeStyle = t, e.lineWidth = 0.018 * c, e.globalAlpha *= 0.6, e.strokeRect(-b * 0.5, -0.54 * c, b, 1.08 * c), e.restore());
+    return;
+  }
+  if ([10, 11, 12].includes(l)) {
+    d(s, P);
+    const x = (k(r, w) - 0.5) * n * 0.35;
+    if (l === 12)
+      d(s, P, { color: "#ff416b", x: -n * 0.09, alpha: 0.66 * n }), d(s, P, { color: "#04b7ff", x: n * 0.09, alpha: 0.7 * n });
+    else {
+      const g = b / c;
+      for (let i = 0; i < 4; i++)
+        S(s, -g, -0.46 + i * 0.24, g * 2, 0.1, () => {
+          d(s, l === 10 ? P : p, {
+            color: t,
+            alpha: 0.75 * n,
+            x: x * (i % 2 ? 1 : -1)
+          });
+        });
+    }
+    return;
+  }
+  (l === 28 || l === 16) && E(s, R(f), _(o), {
+    color: t,
+    alpha: 0.8 * n,
+    width: l === 28 ? 0.023 : 0.036
+  });
+  const A = l === 17 ? o : l === 18 ? 1 - o : n;
+  d(s, h, { alpha: (1 - o) ** 3 }), d(s, p, {
+    alpha: 0.4 + 0.6 * o,
+    color: l === 4 ? t : y,
+    glow: (l === 4 ? 0.18 : 0.28 * A) * u
+  }), [15, 17, 18, 27].includes(l) && (e.save(), e.strokeStyle = t, e.globalAlpha *= 0.65 * n, e.lineWidth = 0.021 * c, e.beginPath(), e.ellipse(
+    0,
+    0,
+    (0.25 + 0.23 * A) * c,
+    (0.37 + 0.25 * A) * c,
+    0,
+    0,
+    Math.PI * 2 * (l === 27 ? 1 : A)
+  ), e.stroke(), e.restore());
+}
+const Y = (s) => [0, 1, 2, 3, 4, 14, 26].includes(s);
+export {
+  X as paintDigital,
+  Y as persistentDisplay
+};

package/dist/components/HysAnimatedNumber/animation/morph.js

@@ -0,0 +1,110 @@
+import { mix as d, noise as I, glyph as i, clamp as P, smooth as B, wave as z } from "./paint.js";
+import { digitPath as _, tracePath as x } from "./paths.js";
+function E(c, n) {
+  const { fromIndex: j, toIndex: k, from: g, to: w, p: o, strength: q, ctx: p, size: m, seed: y } = c, h = [8, 9, 16].includes(n) ? B(o) : o, t = z(h) * q, A = _(j), b = _(k), a = A.map(([u, M], r) => {
+    const s = d(u, b[r][0], h), e = d(M, b[r][1], h), f = I(y, r) - 0.5;
+    switch (n) {
+      case 3:
+        return [s + f * t * 0.25, e + (r % 3 - 1) * t * 0.1];
+      case 4:
+        return [s * (1 - t * 0.75), e];
+      case 5:
+        return [
+          s + Math.sin(e * 10 - h * 8) * 0.17 * t,
+          e + Math.cos(s * 8 + h * 6) * 0.12 * t
+        ];
+      case 6:
+        return [
+          s * (1 + t * 0.45),
+          e * (1 - t * 0.3) + Math.sin(r * 0.5) * 0.055 * t
+        ];
+      case 7:
+        return [s * (1 + t * 0.25), e + (e + 0.4) ** 2 * t * 0.52];
+      case 8:
+        return [s * (1 - t * 0.22), e * (1 + t * 0.55)];
+      case 9:
+        return [s * (1 + t * 0.43), e * (1 - t * 0.52)];
+      case 10:
+        return [s + Math.sin(e * 6) * 0.36 * t, e - s * 0.2 * t];
+      case 11:
+        return [
+          s * Math.cos(t) - e * Math.sin(t),
+          s * Math.sin(t) + e * Math.cos(t)
+        ];
+      case 12:
+        return [
+          s + 0.8 * f * t,
+          e + 0.5 * (I(y + 1, r) - 0.5) * t
+        ];
+      case 13:
+        return [
+          d(s, Math.round(s * 4) / 4, t),
+          d(e, Math.round(e * 4) / 4, t)
+        ];
+      case 14:
+        return [s + 0.06 * (r % 2 ? -1 : 1) * t, e];
+      case 15:
+        return [
+          s + e ** 2 * t * 0.85,
+          e + Math.sin(s * 10) * 0.1 * t
+        ];
+      case 16:
+        return [
+          s + Math.sin(r * 0.24) * t * 0.035,
+          e + Math.cos(r * 0.24) * t * 0.035
+        ];
+      case 17:
+        return [s + Math.sign(s) * t * 0.26, e];
+      case 19:
+        return [
+          s + Math.sin(r / 3 - h * 15) * 0.08 * t,
+          e + Math.cos(r / 3 - h * 15) * 0.08 * t
+        ];
+      default:
+        return [s, e];
+    }
+  }), l = Math.min(1, z(o) * 4);
+  if (i(c, g, { alpha: P(1 - o * 5) }), i(c, w, { alpha: P((o - 0.8) * 5) }), n === 12 || n === 3) {
+    for (let u = 0; u < a.length - 2; u += 3)
+      x(c, a.slice(u, u + 3), 1, {
+        alpha: l,
+        width: 0.065
+      });
+    return;
+  }
+  if (n === 18) {
+    i(c, g, {
+      alpha: (1 - o) * l,
+      sx: 1 + t * 0.15,
+      color: c.accent,
+      blur: 0.035 * t
+    }), i(c, w, {
+      alpha: o * l,
+      sy: 1 - t * 0.25,
+      blur: 0.025 * t
+    });
+    return;
+  }
+  if (n === 2 || n === 19) {
+    p.save(), p.translate(0.035 * m, 0), x(c, a, 1, {
+      alpha: l,
+      width: 0.035,
+      color: c.accent,
+      smooth: !0
+    }), p.translate(-0.07 * m, 0), x(c, a, 1, { alpha: l, width: 0.035, smooth: !0 }), p.restore();
+    return;
+  }
+  x(
+    c,
+    n === 14 ? a.filter((u, M) => M % 4 === 0 || M === a.length - 1) : a,
+    1,
+    {
+      alpha: l,
+      width: n === 4 ? 0.035 : n === 6 ? 0.18 : n === 1 ? 0.075 : 0.11,
+      smooth: ![1, 13, 14].includes(n)
+    }
+  );
+}
+export {
+  E as paintMorph
+};

package/dist/components/HysAnimatedNumber/animation/paint.js

@@ -0,0 +1,34 @@
+const s = (t) => Math.min(1, Math.max(0, t)), M = (t, l, n) => t + (l - t) * n, p = (t) => Math.sin(Math.PI * s(t)), y = (t) => s(t) ** 2 * (3 - 2 * s(t)), b = (t, l) => ((Math.imul(l + 13, 2246822507) ^ Math.imul(t + 37, 3266489909)) >>> 0) / 4294967296;
+function d(t, l, n = {}) {
+  const { ctx: o, color: r, size: a } = t, {
+    x: e = 0,
+    y: i = 0,
+    sx: c = 1,
+    sy: h = 1,
+    angle: u = 0,
+    alpha: x = 1,
+    blur: f = 0,
+    stroke: g = 0,
+    glow: m = 0
+  } = n;
+  !l || x <= 0 || c <= 0 || h <= 0 || (o.save(), o.globalAlpha *= s(x), o.translate(e * a, i * a), u && o.rotate(u), o.scale(c, h), o.fillStyle = o.strokeStyle = n.color ?? r, f && (o.filter = `blur(${a * f}px)`), m && (o.shadowBlur = a * m, o.shadowColor = n.color ?? r), g ? (o.lineJoin = "round", o.lineWidth = a * g, o.strokeText(l, 0, 0)) : o.fillText(l, 0, 0), o.restore());
+}
+function w(t, l, n, o, r, a) {
+  const { ctx: e, size: i } = t;
+  e.save(), e.beginPath(), e.rect(l * i, n * i, Math.max(0, o) * i, Math.max(0, r) * i), e.clip(), a(), e.restore();
+}
+function k(t, l, n, o) {
+  return s((t - l / Math.max(1, n - 1) * o) / (1 - o));
+}
+const v = (t, l) => t.glyphs[(l % 10 + 10) % 10] ?? t.digit;
+export {
+  s as clamp,
+  d as glyph,
+  k as localProgress,
+  M as mix,
+  b as noise,
+  w as rectangle,
+  v as rollingGlyph,
+  y as smooth,
+  p as wave
+};

package/dist/components/HysAnimatedNumber/animation/particles.js

@@ -0,0 +1,51 @@
+import { glyph as S, clamp as P, mix as q, wave as D, noise as I, smooth as H } from "./paint.js";
+const u = /* @__PURE__ */ new Map();
+function E(i, t, d, p = 3) {
+  const o = t.replace(/\d+(?:\.\d+)?px/, "40px"), s = `${i}/${o}/${p}`, x = u.get(s);
+  if (x) return x;
+  const c = document.createElement("canvas");
+  c.width = c.height = 60;
+  const e = c.getContext("2d", { willReadFrequently: !0 });
+  if (!e || !d) return [];
+  e.font = o, e.textAlign = "center", e.textBaseline = "middle", e.fillText(i, 30, 30);
+  const f = e.getImageData(0, 0, 60, 60).data, a = [];
+  for (let g = 2; g < 59; g += p)
+    for (let n = 2; n < 59; n += p)
+      f[(g * 60 + n) * 4 + 3] > 110 && a.push([(n - 30) / 40, (g - 30) / 40]);
+  return u.size >= 128 && u.delete(u.keys().next().value), u.set(s, a), a;
+}
+function K(i, t) {
+  const { from: d, to: p, p: o, size: s, strength: x, seed: c, ctx: e, accent: f, color: a } = i, n = ![1, 4, 6, 9, 14, 18, 19].includes(t), T = n ? o : 1 - o, h = (1 - H(T)) * x, W = n ? p : d, m = [3, 4, 5, 6, 7].includes(t), z = [10, 11, 12, 13, 14, 15].includes(t), A = [16, 17, 18, 19].includes(t);
+  S(i, d, {
+    alpha: n ? (1 - o) ** 4 : P(1 - o * 5),
+    blur: t === 10 ? 0.07 : 0
+  }), S(i, p, { alpha: n ? P((o - 0.63) / 0.37) : o ** 3 });
+  const $ = E(
+    W,
+    e.font,
+    s,
+    t === 5 ? 7 : m ? 5 : 3
+  ), j = P(D(o) * 2.5), B = [2, 5, 15].includes(t) ? E(d, e.font, s, m ? 5 : 3) : [];
+  for (let l = 0; l < $.length; l++) {
+    const [w, k] = $[l], b = I(c + t * 31, l) * 2 * Math.PI, C = 0.28 + I(c + 79, l) * 0.73, G = t === 9 ? 0.94 * o ** 2 : t === 8 ? -0.62 * h : 0, y = z ? Math.sin(w * 11 + k * 4 + o * 8) * h * 0.28 : 0, M = B[l % B.length], F = M ? q(M[0], w, o) + y : w + Math.cos(b) * C * h * (t === 19 ? 1.8 : 1) + y, R = M ? q(M[1], k, o) - y : k + Math.sin(b) * C * h + G - y, r = m ? t === 5 ? 0.09 : 0.057 : z ? 0.034 + 0.025 * h : 0.02 + I(c + 11, l) * 0.024;
+    e.save(), e.globalAlpha *= j * (t === 17 ? 0.55 + 0.45 * Math.sin(o * 16 + l) ** 2 : 1), e.fillStyle = A || l % 6 === 0 ? f : a, A && (e.shadowColor = f, e.shadowBlur = s * 0.11), m ? (e.translate(F * s, R * s), (t === 6 || t === 7) && e.rotate(b * h), e.fillRect(-r * s / 2, -r * s / 2, r * s, r * s)) : (e.beginPath(), e.ellipse(
+      F * s,
+      R * s,
+      r * s,
+      r * s * (t === 13 ? 2 : 1),
+      0,
+      0,
+      Math.PI * 2
+    ), e.fill()), e.restore();
+  }
+  if (t === 11 || t === 19) {
+    e.save(), e.strokeStyle = f, e.globalAlpha *= 0.5 * D(o), e.lineWidth = 0.018 * s;
+    for (let l = 0; l < (t === 11 ? 3 : 1); l++)
+      e.beginPath(), e.arc(0, 0, (0.1 + o * (0.63 + l * 0.21)) * s, 0, Math.PI * 2), e.stroke();
+    e.restore();
+  }
+}
+export {
+  E as glyphMask,
+  K as paintParticles
+};

package/dist/components/HysAnimatedNumber/animation/paths.js

@@ -0,0 +1,165 @@
+import { clamp as g, mix as u } from "./paint.js";
+const d = [
+  [
+    [0, -0.39],
+    [0.18, -0.35],
+    [0.25, -0.18],
+    [0.25, 0.2],
+    [0.16, 0.38],
+    [0, 0.42],
+    [-0.18, 0.36],
+    [-0.25, 0.17],
+    [-0.25, -0.19],
+    [-0.16, -0.35],
+    [0, -0.39]
+  ],
+  [
+    [-0.17, -0.25],
+    [0.04, -0.39],
+    [0.04, 0.39],
+    [-0.19, 0.39],
+    [0.23, 0.39]
+  ],
+  [
+    [-0.22, -0.24],
+    [-0.14, -0.36],
+    [0.04, -0.39],
+    [0.22, -0.3],
+    [0.23, -0.16],
+    [0.12, -0.01],
+    [-0.22, 0.33],
+    [-0.23, 0.39],
+    [0.24, 0.39]
+  ],
+  [
+    [-0.22, -0.33],
+    [0.06, -0.39],
+    [0.23, -0.29],
+    [0.22, -0.15],
+    [0.05, -0.02],
+    [-0.05, 0],
+    [0.17, 0.03],
+    [0.25, 0.16],
+    [0.22, 0.32],
+    [0.05, 0.41],
+    [-0.18, 0.36],
+    [-0.25, 0.27]
+  ],
+  [
+    [0.16, 0.41],
+    [0.16, -0.39],
+    [-0.26, 0.15],
+    [0.27, 0.15]
+  ],
+  [
+    [0.23, -0.39],
+    [-0.2, -0.39],
+    [-0.22, -0.02],
+    [0.04, -0.06],
+    [0.21, 0.03],
+    [0.25, 0.2],
+    [0.19, 0.36],
+    [0, 0.42],
+    [-0.2, 0.34],
+    [-0.24, 0.23]
+  ],
+  [
+    [0.21, -0.37],
+    [0.01, -0.4],
+    [-0.17, -0.25],
+    [-0.24, -0.02],
+    [-0.24, 0.24],
+    [-0.13, 0.38],
+    [0.04, 0.42],
+    [0.21, 0.32],
+    [0.24, 0.16],
+    [0.16, 0.01],
+    [-0.02, -0.05],
+    [-0.23, 0.05]
+  ],
+  [
+    [-0.25, -0.39],
+    [0.25, -0.39],
+    [0.09, -0.14],
+    [-0.03, 0.12],
+    [-0.11, 0.41]
+  ],
+  [
+    [0, -0.02],
+    [-0.21, -0.16],
+    [-0.21, -0.29],
+    [-0.06, -0.39],
+    [0.12, -0.37],
+    [0.23, -0.24],
+    [0.16, -0.1],
+    [0, -0.02],
+    [-0.2, 0.09],
+    [-0.25, 0.26],
+    [-0.12, 0.39],
+    [0.1, 0.4],
+    [0.24, 0.29],
+    [0.24, 0.13],
+    [0, -0.02]
+  ],
+  [
+    [0.24, -0.06],
+    [0.13, 0.05],
+    [-0.06, 0.05],
+    [-0.22, -0.04],
+    [-0.24, -0.22],
+    [-0.15, -0.36],
+    [0.04, -0.4],
+    [0.2, -0.31],
+    [0.24, -0.13],
+    [0.22, 0.15],
+    [0.11, 0.35],
+    [-0.08, 0.42],
+    [-0.2, 0.34]
+  ]
+];
+function x(n) {
+  const l = [0];
+  for (let t = 1; t < n.length; t++)
+    l.push(
+      l[t - 1] + Math.hypot(n[t][0] - n[t - 1][0], n[t][1] - n[t - 1][1])
+    );
+  let r = 1;
+  return Array.from({ length: 35 }, (t, e) => {
+    const c = l[l.length - 1] * e / 34;
+    for (; c > l[r] && r < n.length - 1; ) r++;
+    const i = (c - l[r - 1]) / (l[r] - l[r - 1]);
+    return [
+      u(n[r - 1][0], n[r][0], i),
+      u(n[r - 1][1], n[r][1], i)
+    ];
+  });
+}
+const m = d.map(x);
+function P(n) {
+  return m[n] ?? m[0];
+}
+function v(n, l, r = 1, t = {}) {
+  if (r <= 0) return;
+  const { ctx: e, size: c, color: i } = n, h = Math.min(
+    l.length,
+    Math.ceil(g(r) * (l.length - 1)) + 1
+  );
+  e.save(), e.strokeStyle = e.fillStyle = t.color ?? i, e.lineWidth = (t.width ?? 0.11) * c, e.lineCap = e.lineJoin = "round", e.globalAlpha *= t.alpha ?? 1, e.beginPath(), e.moveTo(l[0][0] * c, l[0][1] * c);
+  for (let o = 1; o < h; o++) {
+    const [a, f] = l[o];
+    if (t.smooth && o + 1 < h) {
+      const s = l[o + 1];
+      e.quadraticCurveTo(
+        a * c,
+        f * c,
+        (a + s[0]) * c / 2,
+        (f + s[1]) * c / 2
+      );
+    } else e.lineTo(a * c, f * c);
+  }
+  t.close && e.closePath(), t.fill ? e.fill() : e.stroke(), e.restore();
+}
+export {
+  P as digitPath,
+  v as tracePath
+};