@wfrog/vc/dist/es/components/tinymce/tinymce.mjs

vue3 组件库 vc

import './index.css'
import '../../chunk/E_WRn0OP.mjs';
import { v as vLoading } from '../../chunk/BeMzzYc5.mjs';
import { defineComponent, useCssVars, shallowRef, ref, computed, watch, onMounted, onBeforeUnmount, withDirectives, createElementBlock, openBlock, normalizeClass, createElementVNode, unref } from 'vue';
import { d as defaultWindow, i as index } from '../../chunk/BdDihk0t.mjs';
import { _ as _export_sfc } from '../../chunk/pcqpp-6-.mjs';

const mini = {
  toolbar: "bold | alignleft aligncenter alignright alignjustify | bullist numlist | forecolor | fullscreen",
  menubar: false,
  plugins: "lists fullscreen"
};
const simple = {
  toolbar: "undo redo | formatselect | bold | alignleft aligncenter alignright alignjustify | bullist numlist | outdent indent | forecolor backcolor | removeformat | link image table | uploadImage | preview | fullscreen",
  menubar: false,
  plugins: "lists fullscreen link image preview table imagetools"
};
const standard = {
  toolbar: "formatselect | bold | alignleft aligncenter alignright alignjustify | bullist numlist | outdent indent | forecolor backcolor | removeformat | link image | preview",
  menubar: true,
  plugins: "lists link image preview table imagetools fullscreen"
};
const full = {
  toolbar: "formatselect | code | bold italic strikethrough forecolor backcolor permanentpen formatpainter | link image media pageembed | alignleft aligncenter alignright alignjustify  | numlist bullist outdent indent | removeformat | addcomment",
  menubar: true,
  plugins: "code print preview fullpage searchreplace autolink directionality visualblocks visualchars fullscreen image link media template codesample table charmap hr pagebreak nonbreaking anchor toc insertdatetime advlist lists wordcount imagetools textpattern help",
  // plugins: 'code print preview fullpage powerpaste searchreplace autolink directionality advcode visualblocks visualchars fullscreen image link media mediaembed template codesample table charmap hr pagebreak nonbreaking anchor toc insertdatetime advlist lists wordcount tinymcespellchecker a11ychecker imagetools textpattern help formatpainter permanentpen pageembed tinycomments mentions linkchecker',
  image_advtab: true,
  image_caption: true
};
const config = {
  mini,
  simple,
  standard,
  full
};

const _hoisted_1 = ["id"];
const _sfc_main = /* @__PURE__ */ defineComponent({
  __name: "tinymce",
  props: {
    id: { default: () => `h-tinymce-${+/* @__PURE__ */ new Date()}${(Math.random() * 1e3).toFixed(0)}` },
    config: { default: "mini" },
    width: { default: "100%" },
    height: { default: "360px" },
    modelValue: { default: "" },
    httpRequest: { default: void 0 }
  },
  emits: ["update:modelValue"],
  setup(__props, { expose: __expose, emit: __emit }) {
    useCssVars((_ctx) => ({
      "v0c248212": _ctx.height
    }));
    const props = __props;
    const emits = __emit;
    const Tinymce = shallowRef();
    const loading = ref(false);
    async function tinymceInit() {
      if (!defaultWindow) {
        return;
      }
      if (!Tinymce.value) {
        loading.value = true;
        Tinymce.value = await index.loadCdnSingle("tinymce");
      }
      const cdnName = defaultWindow.h_utils?.cdn.name || "jsdelivr";
      const cdnUrl = index.baseCdnUrl[cdnName];
      const version = "5.8.1";
      let base_url = "";
      let language_url = "";
      switch (cdnName) {
        case "defaultBase":
          base_url = `${cdnUrl}/tinymce/${version}`;
          language_url = `${cdnUrl}/tinymce-langs/1.0.0/langs/zh_CN.js`;
          break;
        case "jsdelivr":
          base_url = `${cdnUrl}/tinymce@${version}`;
          language_url = `${cdnUrl}/tinymce-langs@1.0.0/langs/zh_CN.js`;
          break;
        case "localCDN":
          base_url = `${cdnUrl}/tinymce/${version}`;
          language_url = `${cdnUrl}/tinymce-langs/1.0.0/langs/zh_CN.js`;
          break;
      }
      Tinymce.value.init({
        ...config[props.config],
        // 插件、菜单等配置信息
        selector: `#${props.id}`,
        // 容器
        language: "zh_CN",
        language_url,
        height: props.height,
        width: props.width,
        base_url,
        // js和css资源路径
        content_css: false,
        // 不加载body的样式
        image_uploadtab: true,
        images_upload_handler: props.httpRequest,
        init_instance_callback: (editor) => {
          if (props.modelValue) {
            editor.setContent(props.modelValue);
          }
          editor.on("NodeChange Change KeyUp SetContent", () => {
            emits("update:modelValue", editor.getContent());
          });
          loading.value = false;
        }
      });
    }
    function tinymceDestory() {
      if (!Tinymce.value) {
        return;
      }
      const tinymce = Tinymce.value.get(props.id);
      tinymce.execCommand("mceFullScreen");
      tinymce && tinymce.destroy();
    }
    const tinymceConfig = computed(() => props.config);
    watch(tinymceConfig, () => {
      tinymceDestory();
      tinymceInit();
    });
    onMounted(async () => {
      tinymceInit();
    });
    onBeforeUnmount(() => tinymceDestory());
    function setContent(val) {
      if (!Tinymce.value) {
        return;
      }
      const tinymce = Tinymce.value.get(props.id);
      tinymce.setContent(val);
    }
    function getContent() {
      if (!Tinymce.value) {
        return;
      }
      const tinymce = Tinymce.value.get(props.id);
      tinymce.getContent();
    }
    __expose({ setContent, getContent });
    return (_ctx, _cache) => {
      const _directive_loading = vLoading;
      return withDirectives((openBlock(), createElementBlock("div", {
        class: normalizeClass(_ctx.$style.tinymce)
      }, [
        createElementVNode("textarea", {
          id: __props.id,
          class: normalizeClass(_ctx.$style.textarea)
        }, null, 10, _hoisted_1)
      ], 2)), [
        [_directive_loading, unref(loading)]
      ]);
    };
  }
});

/* unplugin-vue-components disabled */const tinymce = "_tinymce_aa7a3_1";
const textarea = "_textarea_aa7a3_6";
const style0 = {
	tinymce: tinymce,
	textarea: textarea
};

const cssModules = {
  "$style": style0
};
const Component = /* @__PURE__ */ _export_sfc(_sfc_main, [["__cssModules", cssModules]]);

const __vite_glob_0_33 = /*#__PURE__*/Object.freeze(/*#__PURE__*/Object.defineProperty({
    __proto__: null,
    default: Component
}, Symbol.toStringTag, { value: 'Module' }));

export { Component as C, __vite_glob_0_33 as _ };