vue-data-ui/dist/useFitSvgText-2crs6Fv5.js

A user-empowering data visualization Vue 3 components library for eloquent data storytelling

import { nextTick as v } from "vue";
function k({
  svgRef: S,
  unitWidth: b,
  fontSize: m = 12,
  step: z = 0.5,
  maxIterations: w = 60,
  hideUnderMin: N = !0
}) {
  const u = /* @__PURE__ */ new WeakMap(), y = (t) => {
    if (typeof t == "number") return t;
    if (!t) return NaN;
    const s = parseFloat(String(t).replace("px", ""));
    return Number.isFinite(s) ? s : NaN;
  }, l = (t) => {
    const s = y(t.getAttribute("font-size"));
    if (Number.isFinite(s)) return s;
    const r = window.getComputedStyle(t);
    return y(r.fontSize) || m;
  }, n = (t, s) => {
    t.setAttribute("font-size", String(s));
  }, F = (t) => {
    if (u.has(t))
      n(t, u.get(t));
    else {
      const s = l(t);
      u.set(t, s), n(t, s);
    }
  }, h = (t) => {
    try {
      return t.getBBox().width || 0;
    } catch {
      return 0;
    }
  };
  return {
    fitText: async (t, s = 6) => {
      await v();
      const r = S?.value;
      if (!r) return;
      const d = r.querySelectorAll(t);
      if (!d.length) return;
      const o = Math.max(0, b.value);
      if (o <= 0) return;
      const a = [];
      d.forEach((e) => {
        const f = e.style.display, g = e.style.opacity;
        e.style.display = "", e.style.opacity = "0", F(e);
        let c = h(e), p = l(e), i = p, x = 0;
        if (c <= o)
          a.push({ el: e, finalSize: p, fits: !0 });
        else {
          for (; c > o && i > s && x < w; )
            i = Math.max(s, i - z), n(e, i), c = h(e), x += 1;
          const T = c <= o && i > s;
          a.push({ el: e, finalSize: i, fits: T }), n(e, p);
        }
        e.style.display = f, e.style.opacity = g;
      });
      const A = N && a.some((e) => !e.fits);
      a.forEach(({ el: e, finalSize: f, fits: g }) => {
        A ? e.style.display = "none" : (e.style.display = "", n(e, f));
      });
    }
  };
}
export {
  k as u
};