@vunk/form 1.2.2 → 1.3.0

package/components/vditor/index.cjs

@@ -2,438 +2,73 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var Vditor = require('vditor');
 var vue = require('vue');
+var vditor = require('@vunk/plus/components/vditor');
+var formItem = require('@vunk/form/components/form-item');
+var composables = require('@vunk/form/composables');
 var _pluginVue_exportHelper = require('../_plugin-vue_export-helper.cjs');
-var core = require('@vunk/core');
 
 const props = {
-  modelValue: {
-    type: String,
-    default: ""
-  },
-  defaultOptions: {
-    type: Object,
-    default: () => ({})
-  },
-  placeholder: {
-    type: String,
-    default: "\u95EE\u6211\u4EFB\u4F55\u95EE\u9898...(Crtl + Enter \u53D1\u9001)"
-  },
-  toolbar: {
-    type: Array,
-    default: () => [
-      "headings",
-      "bold",
-      "italic",
-      "strike",
-      "link",
-      "|",
-      "list",
-      "ordered-list",
-      "outdent",
-      "indent",
-      "|",
-      "line",
-      "code",
-      "inline-code",
-      "insert-before",
-      "insert-after",
-      "|",
-      "table",
-      "|",
-      "undo",
-      "redo",
-      "|",
-      "fullscreen",
-      "outline",
-      "export",
-      "|"
-    ]
-  },
-  fullscreen: {
+  ...formItem._VkfFormItemCtx.props,
+  ...vditor._VkVditorCtx.props,
+  readonly: {
     type: Boolean,
-    default: false
+    default: void 0
   }
 };
 const emits = {
-  load: (e) => e,
-  "update:modelValue": (e) => e,
-  ctrlEnter: (e) => e,
-  "update:fullscreen": (e) => e
+  ...vditor._VkVditorCtx.emits
 };
 
-function mitt(n){return {all:n=n||new Map,on:function(t,e){var i=n.get(t);i?i.push(e):n.set(t,[e]);},off:function(t,e){var i=n.get(t);i&&(e?i.splice(i.indexOf(e)>>>0,1):n.set(t,[]));},emit:function(t,e){var i=n.get(t);i&&i.slice().map(function(n){n(e);}),(i=n.get("*"))&&i.slice().map(function(n){n(t,e);});}}}
-
-const useVditor = () => {
-  const core = vue.inject("vkfVditorRef", null);
-  if (!core) {
-    throw new Error("useVditor must be used after VditorProvider");
-  }
-  return vue.unref(core);
-};
-const useVditorMitter = () => {
-  const core = vue.inject("vkfVditorMitter", null);
-  if (!core) {
-    throw new Error("useVditorMitter must be used after VditorProvider");
-  }
-  return core;
-};
-
-var _a;
-const isClient = typeof window !== "undefined";
-isClient && ((_a = window == null ? void 0 : window.navigator) == null ? void 0 : _a.userAgent) && /iP(ad|hone|od)/.test(window.navigator.userAgent);
-
-function createFilterWrapper(filter, fn) {
-  function wrapper(...args) {
-    filter(() => fn.apply(this, args), { fn, thisArg: this, args });
-  }
-  return wrapper;
-}
-const bypassFilter = (invoke) => {
-  return invoke();
-};
-function pausableFilter(extendFilter = bypassFilter) {
-  const isActive = vue.ref(true);
-  function pause() {
-    isActive.value = false;
-  }
-  function resume() {
-    isActive.value = true;
-  }
-  const eventFilter = (...args) => {
-    if (isActive.value)
-      extendFilter(...args);
-  };
-  return { isActive, pause, resume, eventFilter };
-}
-
-function tryOnScopeDispose(fn) {
-  if (vue.getCurrentScope()) {
-    vue.onScopeDispose(fn);
-    return true;
-  }
-  return false;
-}
-
-var __getOwnPropSymbols$6$1 = Object.getOwnPropertySymbols;
-var __hasOwnProp$6$1 = Object.prototype.hasOwnProperty;
-var __propIsEnum$6$1 = Object.prototype.propertyIsEnumerable;
-var __objRest$5 = (source, exclude) => {
-  var target = {};
-  for (var prop in source)
-    if (__hasOwnProp$6$1.call(source, prop) && exclude.indexOf(prop) < 0)
-      target[prop] = source[prop];
-  if (source != null && __getOwnPropSymbols$6$1)
-    for (var prop of __getOwnPropSymbols$6$1(source)) {
-      if (exclude.indexOf(prop) < 0 && __propIsEnum$6$1.call(source, prop))
-        target[prop] = source[prop];
-    }
-  return target;
-};
-function watchWithFilter(source, cb, options = {}) {
-  const _a = options, {
-    eventFilter = bypassFilter
-  } = _a, watchOptions = __objRest$5(_a, [
-    "eventFilter"
-  ]);
-  return vue.watch(source, createFilterWrapper(eventFilter, cb), watchOptions);
-}
-
-var __defProp$2 = Object.defineProperty;
-var __defProps$2 = Object.defineProperties;
-var __getOwnPropDescs$2 = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$2 = Object.getOwnPropertySymbols;
-var __hasOwnProp$2 = Object.prototype.hasOwnProperty;
-var __propIsEnum$2 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$2 = (obj, key, value) => key in obj ? __defProp$2(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$2 = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp$2.call(b, prop))
-      __defNormalProp$2(a, prop, b[prop]);
-  if (__getOwnPropSymbols$2)
-    for (var prop of __getOwnPropSymbols$2(b)) {
-      if (__propIsEnum$2.call(b, prop))
-        __defNormalProp$2(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps$2 = (a, b) => __defProps$2(a, __getOwnPropDescs$2(b));
-var __objRest$1$1 = (source, exclude) => {
-  var target = {};
-  for (var prop in source)
-    if (__hasOwnProp$2.call(source, prop) && exclude.indexOf(prop) < 0)
-      target[prop] = source[prop];
-  if (source != null && __getOwnPropSymbols$2)
-    for (var prop of __getOwnPropSymbols$2(source)) {
-      if (exclude.indexOf(prop) < 0 && __propIsEnum$2.call(source, prop))
-        target[prop] = source[prop];
-    }
-  return target;
-};
-function watchPausable(source, cb, options = {}) {
-  const _a = options, {
-    eventFilter: filter
-  } = _a, watchOptions = __objRest$1$1(_a, [
-    "eventFilter"
-  ]);
-  const { eventFilter, pause, resume, isActive } = pausableFilter(filter);
-  const stop = watchWithFilter(source, cb, __spreadProps$2(__spreadValues$2({}, watchOptions), {
-    eventFilter
-  }));
-  return { stop, pause, resume, isActive };
-}
-
-function unrefElement(elRef) {
-  var _a;
-  const plain = vue.unref(elRef);
-  return (_a = plain == null ? void 0 : plain.$el) != null ? _a : plain;
-}
-
-const defaultWindow = isClient ? window : void 0;
-
-const _global = typeof globalThis !== "undefined" ? globalThis : typeof window !== "undefined" ? window : typeof global !== "undefined" ? global : typeof self !== "undefined" ? self : {};
-const globalKey = "__vueuse_ssr_handlers__";
-_global[globalKey] = _global[globalKey] || {};
-
-var __getOwnPropSymbols$6 = Object.getOwnPropertySymbols;
-var __hasOwnProp$6 = Object.prototype.hasOwnProperty;
-var __propIsEnum$6 = Object.prototype.propertyIsEnumerable;
-var __objRest$1 = (source, exclude) => {
-  var target = {};
-  for (var prop in source)
-    if (__hasOwnProp$6.call(source, prop) && exclude.indexOf(prop) < 0)
-      target[prop] = source[prop];
-  if (source != null && __getOwnPropSymbols$6)
-    for (var prop of __getOwnPropSymbols$6(source)) {
-      if (exclude.indexOf(prop) < 0 && __propIsEnum$6.call(source, prop))
-        target[prop] = source[prop];
-    }
-  return target;
-};
-function useMutationObserver(target, callback, options = {}) {
-  const _a = options, { window = defaultWindow } = _a, mutationOptions = __objRest$1(_a, ["window"]);
-  let observer;
-  const isSupported = window && "MutationObserver" in window;
-  const cleanup = () => {
-    if (observer) {
-      observer.disconnect();
-      observer = void 0;
-    }
-  };
-  const stopWatch = vue.watch(() => unrefElement(target), (el) => {
-    cleanup();
-    if (isSupported && window && el) {
-      observer = new MutationObserver(callback);
-      observer.observe(el, mutationOptions);
-    }
-  }, { immediate: true });
-  const stop = () => {
-    cleanup();
-    stopWatch();
-  };
-  tryOnScopeDispose(stop);
-  return {
-    isSupported,
-    stop
-  };
-}
-
-var SwipeDirection;
-(function(SwipeDirection2) {
-  SwipeDirection2["UP"] = "UP";
-  SwipeDirection2["RIGHT"] = "RIGHT";
-  SwipeDirection2["DOWN"] = "DOWN";
-  SwipeDirection2["LEFT"] = "LEFT";
-  SwipeDirection2["NONE"] = "NONE";
-})(SwipeDirection || (SwipeDirection = {}));
-
-var _sfc_main$2 = vue.defineComponent({
-  props: {
-    modelValue: {
-      type: String,
-      default: ""
-    }
-  },
-  emits: {
-    "update:modelValue": null
-  },
-  setup(props, { emit }) {
-    const vditor = useVditor();
-    const mitter = useVditorMitter();
-    if (props.modelValue) {
-      vditor.setValue(props.modelValue, true);
-    }
-    const { pause, resume } = watchPausable(() => props.modelValue, (value) => {
-      vditor.setValue(value, true);
-    });
-    mitter.on("input", (value) => {
-      pause();
-      emit("update:modelValue", value);
-      vue.nextTick(resume);
-    });
-    return () => null;
-  }
-});
-
-var HandleValue = /* @__PURE__ */ _pluginVue_exportHelper._export_sfc(_sfc_main$2, [["__file", "/home/runner/work/private-vunk-form/private-vunk-form/packages/components/vditor/src/handle-value.vue"]]);
-
-var _sfc_main$1 = vue.defineComponent({
-  props: {
-    fullscreen: {
-      type: Boolean,
-      default: false
-    }
-  },
-  emits: {
-    "update:fullscreen": null
-  },
-  setup(props, { emit }) {
-    const vditor = useVditor();
-    const el = vditor.vditor.element;
-    const domFullscreen = vue.ref(false);
-    useMutationObserver(el, () => {
-      if (el.classList.contains("vditor--fullscreen")) {
-        domFullscreen.value = true;
-      } else {
-        domFullscreen.value = false;
-      }
-    }, {
-      attributes: true
-    });
-    vue.watch(() => props.fullscreen, (value) => {
-      if (value !== domFullscreen.value) {
-        const ir = vditor.vditor.ir?.element;
-        if (!ir) return;
-        ir.dispatchEvent(new KeyboardEvent("keydown", {
-          key: "'",
-          ctrlKey: true
-        }));
-      }
-    }, { immediate: true });
-    vue.watch(() => domFullscreen.value, (value) => {
-      emit("update:fullscreen", value);
-    });
-    return () => null;
-  }
-});
-
-var HandleFullscreen = /* @__PURE__ */ _pluginVue_exportHelper._export_sfc(_sfc_main$1, [["__file", "/home/runner/work/private-vunk-form/private-vunk-form/packages/components/vditor/src/handle-fullscreen.vue"]]);
-
 var _sfc_main = vue.defineComponent({
   name: "VkfVditor",
   components: {
-    HandleValue,
-    HandleFullscreen,
-    VkAsyncTeleport: core.VkAsyncTeleport
+    VkfFormItem: formItem.VkfFormItem,
+    VkVditor: vditor.VkVditor
   },
   props,
   emits,
   setup(props2, { emit }) {
-    const vditorNode = vue.ref();
-    const ready = vue.ref(false);
-    const mitter = mitt();
-    const vditorRef = vue.shallowRef();
-    const isTextareaFocus = vue.ref(false);
-    vue.provide("vkfVditorMitter", mitter);
-    vue.provide("vkfVditorRef", vditorRef);
-    vue.onMounted(() => {
-      const vditor = new Vditor(vditorNode.value, {
-        ...props2.defaultOptions,
-        placeholder: props2.placeholder,
-        cache: {
-          enable: true,
-          id: "VkfVditorCache",
-          ...props2.defaultOptions.cache || {}
-        },
-        after() {
-          vditorRef.value = vditor;
-          ready.value = true;
-          emit("load", vditor);
-          props2.defaultOptions.after?.();
-        },
-        input(value) {
-          mitter.emit("input", value);
-          props2.defaultOptions.input?.(value);
-        },
-        ctrlEnter(value) {
-          emit("update:modelValue", value);
-          emit("ctrlEnter", value);
-        },
-        focus(v) {
-          isTextareaFocus.value = true;
-          props2.defaultOptions.focus?.(v);
-        },
-        blur(v) {
-          isTextareaFocus.value = false;
-          props2.defaultOptions.blur?.(v);
-        },
-        toolbar: props2.toolbar
-      });
-    });
+    const coreProps = vditor._VkVditorCtx.createBindProps(props2);
+    const coreEmits = vditor._VkVditorCtx.createOnEmits(emit);
+    const formItemBindProps = formItem._VkfFormItemCtx.createBindProps(props2);
+    const readonly = composables.useComputedReadonly(props2);
     return {
-      vditorNode,
-      isTextareaFocus,
-      ready
+      formItemBindProps,
+      coreProps,
+      coreEmits,
+      readonly
     };
   }
 });
 
-const _hoisted_1 = {
-  ref: "vditorNode",
-  class: "vkf-vditor"
-};
 function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
-  const _component_VkAsyncTeleport = vue.resolveComponent("VkAsyncTeleport");
-  const _component_HandleValue = vue.resolveComponent("HandleValue");
-  const _component_HandleFullscreen = vue.resolveComponent("HandleFullscreen");
-  return vue.openBlock(), vue.createElementBlock(
-    vue.Fragment,
-    null,
-    [
-      vue.createElementVNode(
-        "div",
-        _hoisted_1,
-        null,
-        512
-        /* NEED_PATCH */
-      ),
-      _ctx.ready ? (vue.openBlock(), vue.createBlock(_component_VkAsyncTeleport, {
-        key: 0,
-        to: _ctx.vditorNode
-      }, {
-        default: vue.withCtx(() => [
-          vue.createElementVNode(
-            "div",
-            {
-              class: vue.normalizeClass(["vkf-vditor-footer", {
-                "is-textarea-focus": _ctx.isTextareaFocus
-              }])
-            },
-            [
+  const _component_VkVditor = vue.resolveComponent("VkVditor");
+  const _component_VkfFormItem = vue.resolveComponent("VkfFormItem");
+  return vue.openBlock(), vue.createBlock(
+    _component_VkfFormItem,
+    vue.normalizeProps(vue.guardReactiveProps(_ctx.formItemBindProps)),
+    {
+      default: vue.withCtx(() => [
+        vue.createVNode(
+          _component_VkVditor,
+          vue.mergeProps(_ctx.coreProps, vue.toHandlers(_ctx.coreEmits)),
+          {
+            footer: vue.withCtx(() => [
               vue.renderSlot(_ctx.$slots, "footer")
-            ],
-            2
-            /* CLASS */
-          )
-        ]),
-        _: 3
-        /* FORWARDED */
-      }, 8, ["to"])) : vue.createCommentVNode("v-if", true),
-      _ctx.ready ? (vue.openBlock(), vue.createBlock(_component_HandleValue, {
-        key: 1,
-        "model-value": _ctx.modelValue,
-        "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => _ctx.$emit("update:modelValue", $event))
-      }, null, 8, ["model-value"])) : vue.createCommentVNode("v-if", true),
-      _ctx.ready ? (vue.openBlock(), vue.createBlock(_component_HandleFullscreen, {
-        key: 2,
-        fullscreen: _ctx.fullscreen,
-        "onUpdate:fullscreen": _cache[1] || (_cache[1] = ($event) => _ctx.$emit("update:fullscreen", $event))
-      }, null, 8, ["fullscreen"])) : vue.createCommentVNode("v-if", true),
-      _ctx.ready ? vue.renderSlot(_ctx.$slots, "default", { key: 3 }) : vue.createCommentVNode("v-if", true)
-    ],
-    64
-    /* STABLE_FRAGMENT */
+            ]),
+            _: 3
+            /* FORWARDED */
+          },
+          16
+          /* FULL_PROPS */
+        )
+      ]),
+      _: 3
+      /* FORWARDED */
+    },
+    16
+    /* FULL_PROPS */
   );
 }
 var VkfVditor = /* @__PURE__ */ _pluginVue_exportHelper._export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "/home/runner/work/private-vunk-form/private-vunk-form/packages/components/vditor/src/index.vue"]]);