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 a, ref as p, toRaw as n, openBlock as u, createElementBlock as m, normalizeStyle as v } from "vue";
const h = "vue-email-editor", y = "2.1.2", b = "dist/vue-email-editor.es", f = "dist/vue-email-editor.d.ts", g = {
  serve: "vue-cli-service serve",
  build: "vue-cli-service build",
  lint: "vue-cli-service lint",
  "adjust-types": `sed -i '' '1s/^/\\/\\/\\/ <reference types=\\"unlayer-types\\/embed.d.ts\\" \\/>\\n/' ./dist/components/types.d.ts`,
  "build-types": "vue-tsc --emitDeclarationOnly && npm run adjust-types",
  "build-bundle": "vite build && cd ./src/components && npm run build-types",
  release: "npm run build-bundle && npm publish"
}, j = {
  "unlayer-types": "latest",
  vue: "^3.2.13"
}, E = {
  "@babel/types": "^7.24.7",
  "@vitejs/plugin-vue": "^5.0.5",
  "@vue/cli-service": "~5.0.0",
  "@vue/cli-plugin-typescript": "~5.0.0",
  typescript: "^5.2.2",
  vite: "^5.3.1",
  "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"
}, _ = [
  "dist"
], r = {
  name: h,
  version: y,
  main: b,
  types: f,
  scripts: g,
  dependencies: j,
  devDependencies: E,
  files: _
}, S = "https://editor.unlayer.com/embed.js?2", d = [];
let l = !1;
const I = (e) => {
  const t = document.querySelectorAll("script");
  let i = !1;
  return t.forEach((s) => {
    s.src.includes(e) && (i = !0);
  }), i;
}, k = (e) => {
  d.push(e);
}, c = () => {
  if (l) {
    let e;
    for (; e = d.shift(); )
      e();
  }
}, D = (e, t = S) => {
  if (k(e), I(t))
    c();
  else {
    const i = document.createElement("script");
    i.setAttribute("src", t), i.onload = () => {
      l = !0, c();
    }, document.head.appendChild(i);
  }
};
let $ = 0;
const H = a({
  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-${++$}`;
    }
  },
  setup() {
    return {
      editor: p(null)
      // Makes editor available to the template
    };
  },
  mounted() {
    D(this.loadEditor.bind(this), this.scriptUrl);
  },
  methods: {
    loadEditor() {
      const e = n(this.options) || {}, t = n(this.appearance) || null, i = n(this.tools) || null;
      t && (e.appearance = t), this.locale && (e.locale = this.locale), this.projectId && (e.projectId = this.projectId), i && (e.tools = i), this.editor = unlayer.createEditor({
        ...e,
        id: this.id,
        source: {
          name: r.name,
          version: r.version
        }
      }), this.$emit("load"), this.editor.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);
    }
  }
}), O = (e, t) => {
  const i = e.__vccOpts || e;
  for (const [s, o] of t)
    i[s] = o;
  return i;
}, x = ["id"];
function C(e, t, i, s, o, w) {
  return u(), m("div", {
    id: e.id,
    class: "unlayer-editor",
    style: v({ minHeight: e.minHeight })
  }, null, 12, x);
}
const B = /* @__PURE__ */ O(H, [["render", C], ["__scopeId", "data-v-53c2c3eb"]]);
export {
  B as EmailEditor
};