realmap-vue/dist/realmap-vue.mjs.js

Wooritech map chart component library

import { ref as m, onMounted as C, defineComponent as g, onUnmounted as L, createBlock as v, createCommentVNode as b, openBlock as i, Teleport as M, createElementBlock as p, Fragment as A, renderList as V, resolveDynamicComponent as x, useAttrs as B, computed as S, createElementVNode as E, createVNode as N, mergeProps as j, unref as _ } from "vue";
function R({
  license: r,
  realmapModule: n,
  elRef: e,
  config: s,
  animate: t,
  onChartLoaded: c
}) {
  const l = m(null), a = m(!1), h = (u) => {
    const { map: o, series: f } = u, k = Array.isArray(o) ? o.some((d) => d.url) : typeof o == "object" && !!o?.url, w = Array.isArray(f) && f.some((d) => d.dataUrl);
    return !(k || w);
  }, y = async (u) => {
    r && n.setLicenseKey(r);
    const o = h(u) ? n.createChart(
      document,
      e.value,
      u,
      t,
      c
    ) : await n.createChartAsync(
      document,
      e.value,
      u,
      t,
      c
    );
    return l.value = o, o;
  };
  return C(() => {
    a.value || !e.value || (a.value = !0, y(s));
  }), { mapChart: l };
}
const T = ["id"], U = /* @__PURE__ */ g({
  __name: "TemplateContainer",
  props: {
    templates: {}
  },
  setup(r) {
    const n = r, e = m(null), s = {
      position: "absolute",
      width: "0",
      height: "0",
      overflow: "hidden",
      opacity: "0"
    };
    return C(() => {
      const t = document.createElement("div");
      t.classList.add("rm-template-container"), Object.assign(t.style, s), document.body.appendChild(t), e.value = t;
    }), L(() => {
      e.value && (document.body.removeChild(e.value), e.value = null);
    }), (t, c) => e.value ? (i(), v(M, {
      key: 0,
      to: e.value
    }, [
      (i(!0), p(A, null, V(n.templates, (l, a) => (i(), p("div", {
        key: a,
        id: a
      }, [
        (i(), v(x(l)))
      ], 8, T))), 128))
    ], 8, ["to"])) : b("", !0);
  }
}), $ = ["id"], D = /* @__PURE__ */ g({
  __name: "RealMapVue",
  props: {
    license: {},
    realmap: {},
    id: { default: "realmap" },
    w: { default: "100%" },
    h: { default: "100%" },
    config: {},
    animate: { type: Boolean, default: !0 },
    onChartLoaded: {},
    templates: {}
  },
  setup(r, { expose: n }) {
    const e = r, s = B(), t = m(null), { mapChart: c } = R({
      elRef: t,
      license: e.license,
      realmapModule: e.realmap,
      config: e.config,
      animate: e.animate,
      onChartLoaded: e.onChartLoaded
    });
    n({
      realmap: c
    });
    const l = S(() => ({
      width: e.w,
      height: e.h,
      ...s.style
    })), a = e.id ?? "realmap";
    return (h, y) => (i(), p(A, null, [
      E("div", j({
        id: _(a),
        ref_key: "elRef",
        ref: t,
        style: l.value
      }, _(s)), null, 16, $),
      N(U, {
        templates: e.templates
      }, null, 8, ["templates"])
    ], 64));
  }
}), I = D;
export {
  I as RealMapVue
};