vue-email-editor/dist/vue-email-editor.es.js

The excellent drag-n-drop email editor by [Unlayer](https://unlayer.com/embed) as a [Vue](https://vuejs.org/) _wrapper component_. This is the most powerful and developer friendly visual email builder for your app.

import { defineComponent as v, shallowRef as h, toRaw as o, openBlock as b, createElementBlock as f, normalizeStyle as y } from "vue";
const g = "vue-email-editor", j = "2.2.0", E = "dist/vue-email-editor.es.js", S = "dist/vue-email-editor.d.ts", _ = {
  ".": {
    import: "./dist/vue-email-editor.es.js",
    require: "./dist/vue-email-editor.umd.js",
    types: "./dist/vue-email-editor.d.ts"
  }
}, k = {
  serve: "vue-cli-service serve",
  build: "vue-cli-service build",
  lint: "vue-cli-service lint",
  "build-types": "vue-tsc --emitDeclarationOnly",
  "build-bundle": "vite build && cd ./src/components && npm run build-types",
  release: "npm run build-bundle && npm publish"
}, D = {
  "@unlayer/types": "^1.394.0"
}, I = {
  vue: "^3.2.13"
}, $ = {
  "@babel/types": "^7.24.7",
  "@vitejs/plugin-vue": "^5.0.5",
  "@vue/cli-plugin-typescript": "~5.0.0",
  "@vue/cli-service": "~5.0.0",
  typescript: "^5.2.2",
  vite: "^5.3.1",
  vue: "^3.2.13",
  "vue-dts-gen": "^0.3.0",
  "vue-loader": "^17.4.2",
  "vue-router": "^4.4.0",
  "vue-template-compiler": "^2.7.16",
  "vue-tsc": "^2.0.22"
}, x = [
  "dist"
], d = {
  name: g,
  version: j,
  main: E,
  types: S,
  exports: _,
  scripts: k,
  dependencies: D,
  peerDependencies: I,
  devDependencies: $,
  files: x
}, C = "https://editor.unlayer.com/embed.js?2", l = [];
let a = !1;
const w = (e) => {
  const t = document.querySelectorAll("script");
  let i = !1;
  return t.forEach((s) => {
    s.src.includes(e) && (i = !0);
  }), i;
}, H = (e) => {
  l.push(e);
}, c = () => {
  if (a) {
    let e;
    for (; e = l.shift(); )
      e();
  }
}, O = (e, t = C) => {
  if (H(e), w(t))
    c();
  else {
    const i = document.createElement("script");
    i.setAttribute("src", t), i.onload = () => {
      a = !0, c();
    }, document.head.appendChild(i);
  }
};
let z = 0;
const R = v({
  name: "EmailEditor",
  props: {
    editorId: String,
    minHeight: {
      type: String,
      default: "500px"
    },
    options: {
      type: Object,
      default: () => ({})
    },
    scriptUrl: String,
    /**
     * @Deprecated Props: Use `options.appearance` instead
     */
    appearance: Object,
    /**
    * @Deprecated Props: Use `options.locale` instead
    */
    locale: String,
    /**
    * @Deprecated Props: Use `options.projectId` instead
    */
    projectId: Number,
    /**
    * @Deprecated Props: Use `options.tools` instead
    */
    tools: Object
  },
  computed: {
    id() {
      return this.editorId || `editor-${++z}`;
    }
  },
  setup() {
    return {
      editor: h(null),
      createSerializedEditor: (i) => i ? {
        ...i,
        registerCallback: (s, r) => {
          i.registerCallback(s, (n, p) => {
            r(n, (u) => {
              const m = o(u);
              p(m);
            });
          });
        }
      } : null
    };
  },
  mounted() {
    O(this.loadEditor.bind(this), this.scriptUrl);
  },
  methods: {
    loadEditor() {
      var i;
      const e = o(this.options) || {};
      this.appearance && (e.appearance = o(this.appearance)), this.locale && (e.locale = this.locale), this.projectId && (e.projectId = this.projectId), this.tools && (e.tools = o(this.tools));
      const t = unlayer.createEditor({
        ...e,
        id: this.id,
        source: {
          name: d.name,
          version: d.version
        }
      });
      this.editor = this.createSerializedEditor(t), this.$emit("load"), (i = this.editor) == null || i.addEventListener("editor:ready", () => {
        this.$emit("ready");
      });
    },
    /**
     * @deprecated This method will be removed in the next major release. Use `editor.exportHtml` instead.
     */
    exportHtml(e) {
      var t;
      (t = this.editor) == null || t.exportHtml(e);
    },
    /**
     * @deprecated This method will be removed in the next major release. Use `editor.loadDesign` instead.
     */
    loadDesign(e) {
      var t;
      (t = this.editor) == null || t.loadDesign(e);
    },
    /**
    * @deprecated This method will be removed in the next major release. Use `editor.saveDesign` instead.
    */
    saveDesign(e) {
      var t;
      (t = this.editor) == null || t.saveDesign(e);
    }
  }
}), q = (e, t) => {
  const i = e.__vccOpts || e;
  for (const [s, r] of t)
    i[s] = r;
  return i;
}, A = ["id"];
function B(e, t, i, s, r, n) {
  return b(), f("div", {
    id: e.id,
    class: "unlayer-editor",
    style: y({ minHeight: e.minHeight })
  }, null, 12, A);
}
const L = /* @__PURE__ */ q(R, [["render", B], ["__scopeId", "data-v-95d7283d"]]);
export {
  L as EmailEditor
};