index.esm.js 6.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213
  1. var __defProp = Object.defineProperty;
  2. var __defProps = Object.defineProperties;
  3. var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
  4. var __getOwnPropSymbols = Object.getOwnPropertySymbols;
  5. var __hasOwnProp = Object.prototype.hasOwnProperty;
  6. var __propIsEnum = Object.prototype.propertyIsEnumerable;
  7. var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
  8. var __spreadValues = (a, b) => {
  9. for (var prop in b || (b = {}))
  10. if (__hasOwnProp.call(b, prop))
  11. __defNormalProp(a, prop, b[prop]);
  12. if (__getOwnPropSymbols)
  13. for (var prop of __getOwnPropSymbols(b)) {
  14. if (__propIsEnum.call(b, prop))
  15. __defNormalProp(a, prop, b[prop]);
  16. }
  17. return a;
  18. };
  19. var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
  20. import { defineComponent, ref, shallowRef, onMounted, watch, toRaw, openBlock, createElementBlock, watchEffect } from "vue";
  21. import { createEditor, DomEditor, createToolbar } from "@wangeditor/editor";
  22. function genErrorInfo(fnName) {
  23. let info = `\u8BF7\u4F7F\u7528 '@${fnName}' \u4E8B\u4EF6\uFF0C\u4E0D\u8981\u653E\u5728 props \u4E2D`;
  24. info += `
  25. Please use '@${fnName}' event instead of props`;
  26. return info;
  27. }
  28. var _export_sfc = (sfc, props) => {
  29. for (const [key, val] of props) {
  30. sfc[key] = val;
  31. }
  32. return sfc;
  33. };
  34. const _sfc_main$1 = defineComponent({
  35. props: {
  36. mode: {
  37. type: String,
  38. default: "default"
  39. },
  40. defaultContent: {
  41. type: Array,
  42. default: []
  43. },
  44. defaultHtml: {
  45. type: String,
  46. default: ""
  47. },
  48. defaultConfig: {
  49. type: Object,
  50. default: {}
  51. },
  52. modelValue: {
  53. type: String,
  54. default: ""
  55. }
  56. },
  57. setup(props, context) {
  58. const box = ref(null);
  59. const editorRef = shallowRef(null);
  60. const curValue = ref("");
  61. const initEditor = () => {
  62. if (!box.value)
  63. return;
  64. const defaultContent = toRaw(props.defaultContent);
  65. createEditor({
  66. selector: box.value,
  67. mode: props.mode,
  68. content: defaultContent || [],
  69. html: props.defaultHtml || props.modelValue || "",
  70. config: __spreadProps(__spreadValues({}, props.defaultConfig), {
  71. onCreated(editor) {
  72. editorRef.value = editor;
  73. context.emit("onCreated", editor);
  74. if (props.defaultConfig.onCreated) {
  75. const info = genErrorInfo("onCreated");
  76. throw new Error(info);
  77. }
  78. },
  79. onChange(editor) {
  80. const editorHtml = editor.getHtml();
  81. curValue.value = editorHtml;
  82. context.emit("update:modelValue", editorHtml);
  83. context.emit("onChange", editor);
  84. if (props.defaultConfig.onChange) {
  85. const info = genErrorInfo("onChange");
  86. throw new Error(info);
  87. }
  88. },
  89. onDestroyed(editor) {
  90. context.emit("onDestroyed", editor);
  91. if (props.defaultConfig.onDestroyed) {
  92. const info = genErrorInfo("onDestroyed");
  93. throw new Error(info);
  94. }
  95. },
  96. onMaxLength(editor) {
  97. context.emit("onMaxLength", editor);
  98. if (props.defaultConfig.onMaxLength) {
  99. const info = genErrorInfo("onMaxLength");
  100. throw new Error(info);
  101. }
  102. },
  103. onFocus(editor) {
  104. context.emit("onFocus", editor);
  105. if (props.defaultConfig.onFocus) {
  106. const info = genErrorInfo("onFocus");
  107. throw new Error(info);
  108. }
  109. },
  110. onBlur(editor) {
  111. context.emit("onBlur", editor);
  112. if (props.defaultConfig.onBlur) {
  113. const info = genErrorInfo("onBlur");
  114. throw new Error(info);
  115. }
  116. },
  117. customAlert(info, type) {
  118. context.emit("customAlert", info, type);
  119. if (props.defaultConfig.customAlert) {
  120. const info2 = genErrorInfo("customAlert");
  121. throw new Error(info2);
  122. }
  123. },
  124. customPaste: (editor, event) => {
  125. if (props.defaultConfig.customPaste) {
  126. const info = genErrorInfo("customPaste");
  127. throw new Error(info);
  128. }
  129. let res;
  130. context.emit("customPaste", editor, event, (val) => {
  131. res = val;
  132. });
  133. return res;
  134. }
  135. })
  136. });
  137. };
  138. function setHtml(newHtml) {
  139. const editor = editorRef.value;
  140. if (editor == null)
  141. return;
  142. editor.setHtml(newHtml);
  143. }
  144. onMounted(() => {
  145. initEditor();
  146. });
  147. watch(() => props.modelValue, (newVal) => {
  148. if (newVal === curValue.value)
  149. return;
  150. setHtml(newVal);
  151. });
  152. return {
  153. box
  154. };
  155. }
  156. });
  157. const _hoisted_1$1 = {
  158. ref: "box",
  159. style: { "height": "100%" }
  160. };
  161. function _sfc_render$1(_ctx, _cache, $props, $setup, $data, $options) {
  162. return openBlock(), createElementBlock("div", _hoisted_1$1, null, 512);
  163. }
  164. var Editor = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["render", _sfc_render$1]]);
  165. const _sfc_main = defineComponent({
  166. props: {
  167. editor: {
  168. type: Object
  169. },
  170. mode: {
  171. type: String,
  172. default: "default"
  173. },
  174. defaultConfig: {
  175. type: Object,
  176. default: {}
  177. }
  178. },
  179. setup(props) {
  180. const selector = ref(null);
  181. const create = (editor) => {
  182. if (!selector.value)
  183. return;
  184. if (editor == null) {
  185. throw new Error("Not found instance of Editor when create <Toolbar/> component");
  186. }
  187. if (DomEditor.getToolbar(editor))
  188. return;
  189. createToolbar({
  190. editor,
  191. selector: selector.value || "<div></div>",
  192. mode: props.mode,
  193. config: props.defaultConfig
  194. });
  195. };
  196. watchEffect(() => {
  197. const { editor } = props;
  198. if (editor == null)
  199. return;
  200. create(editor);
  201. });
  202. return {
  203. selector
  204. };
  205. }
  206. });
  207. const _hoisted_1 = { ref: "selector" };
  208. function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
  209. return openBlock(), createElementBlock("div", _hoisted_1, null, 512);
  210. }
  211. var Toolbar = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
  212. export { Editor, Toolbar };
  213. //# sourceMappingURL=index.esm.js.map