@opentiny/vue-renderless 3.28.2 → 3.30.0

package/alert/vue.js

@@ -9,6 +9,7 @@ import {
   watchAutoHide,
   handlerTargetNode
 } from "./index";
+import { nanoid } from "@opentiny/utils";
 const api = ["handleClose", "state", "handleHeaderClick"];
 const initState = ({ api: api2, computed, constants, reactive }) => {
   return reactive({
@@ -21,7 +22,9 @@ const initState = ({ api: api2, computed, constants, reactive }) => {
     getIcon: computed(() => api2.computedGetIcon()),
     getTitle: computed(() => api2.computedGetTitle()),
     alertClass: computed(() => api2.computedClass()),
-    alertStyle: computed(() => api2.computedStyle())
+    alertStyle: computed(() => api2.computedStyle()),
+    titleId: `tiny-alert-title-${nanoid.api.nanoid(8)}`,
+    contentId: `tiny-alert-description-${nanoid.api.nanoid(8)}`
   });
 };
 const initApi = ({ api: api2, state, constants, props, designConfig, t, emit, vm, parent, nextTick, mode }) => {

package/anchor/index.js

@@ -160,11 +160,21 @@ const onItersectionObserver = ({ state, props, api, vm, emit }) => () => {
   );
   addObserver({ props, state });
 };
-const linkClick = ({ state, vm, emit, props, api }) => (e, item) => {
+const linkClick = ({
+  state,
+  vm,
+  emit,
+  props,
+  api,
+  framework
+}) => (e, item) => {
   state.isScroll = true;
   const { link, title } = item;
   const emitLink = { link, title };
   emit("linkClick", e, emitLink);
+  if (framework === "vue2" || framework === "vue2.7") {
+    emit("link-click", e, emitLink);
+  }
   const isChangeHash = setCurrentHash({ state });
   const { scrollContainer } = state;
   state.currentLink = link;

package/anchor/vue.js

@@ -19,7 +19,7 @@ const api = [
   "setScrollContainer",
   "getCurrentAnchor"
 ];
-const renderless = (props, { onMounted, onUnmounted, onUpdated, reactive, watch }, { vm, emit, nextTick }) => {
+const renderless = (props, { onMounted, onUnmounted, onUpdated, reactive, watch }, { vm, emit, nextTick, framework }) => {
   const api2 = {};
   const state = reactive({
     currentLink: "",
@@ -38,7 +38,7 @@ const renderless = (props, { onMounted, onUnmounted, onUpdated, reactive, watch
     updated: updated({ api: api2 }),
     unmounted: unmounted({ state, api: api2 }),
     getContainer: getContainer({ props }),
-    linkClick: linkClick({ state, vm, emit, props, api: api2 }),
+    linkClick: linkClick({ state, vm, emit, props, api: api2, framework }),
     onItersectionObserver: onItersectionObserver({ state, props, api: api2, vm, emit }),
     setScrollContainer: setScrollContainer({ state, api: api2 }),
     getCurrentAnchor: getCurrentAnchor({ vm, state, emit }),

package/base-select/index.js

@@ -1214,10 +1214,9 @@ const computedCurrentSizeMap = ({ state, designConfig }) => () => {
   const sizeMap = ((_a = designConfig == null ? void 0 : designConfig.state) == null ? void 0 : _a.sizeMap) || defaultSizeMap;
   return sizeMap[state.selectSize || "default"];
 };
-const mounted = ({ api, parent, state, props, vm, designConfig }) => () => {
+const mounted = ({ api, parent, state, props, vm, designConfig, nextTick }) => () => {
   const parentEl = parent.$el;
   const inputEl = parentEl.querySelector('input[data-tag="tiny-input-inner"]');
-  const inputClientRect = inputEl && inputEl.getBoundingClientRect() || {};
   if (inputEl === document.activeElement) {
     document.activeElement.blur();
   }
@@ -1229,10 +1228,14 @@ const mounted = ({ api, parent, state, props, vm, designConfig }) => () => {
   if (vm.$refs.tags) {
     addResizeListener(vm.$refs.tags, api.resetInputHeight);
   }
+  nextTick(() => {
+    if (inputEl) {
+      state.inputWidth = inputEl.offsetWidth || 0;
+    }
+  });
   if (props.remote && props.multiple) {
     api.resetInputHeight();
   }
-  state.inputWidth = inputClientRect.width;
   api.initQuery({ init: true }).then(() => {
     api.setSelected(true);
     if (props.modelValue && props.initLabel) {

package/base-select/vue.js

@@ -472,7 +472,7 @@ const addApi = ({
     debouncRquest: debouncRquest({ api: api2, state, props }),
     defaultOnQueryChange: defaultOnQueryChange({ props, state, constants, api: api2, nextTick, vm }),
     queryChange: queryChange({ props, state, constants, api: api2, nextTick, vm }),
-    mounted: mounted({ api: api2, parent, state, props, vm, designConfig }),
+    mounted: mounted({ api: api2, parent, state, props, vm, designConfig, nextTick }),
     unMount: unMount({ api: api2, parent, vm, state }),
     watchOptimizeOpts: watchOptimizeOpts({ props, state }),
     handleDropdownClick: handleDropdownClick({ props, vm, state, emit }),

package/calendar-view/index.js

@@ -59,8 +59,48 @@ const isSelectedDate = ({ state }) => (day) => {
 const getDayBgColor = ({ props }) => (day) => {
   const date = day.year + "-" + day.month + "-" + day.value;
   const isFunction = props.setDayBgColor instanceof Function;
-  const bgColor = isFunction ? props.setDayBgColor(date) : "white";
-  return bgColor;
+  if (isFunction) {
+    const result = props.setDayBgColor(date);
+    if (typeof result === "object") {
+      return result;
+    }
+    if (typeof result === "string" && (result.startsWith("#") || result.startsWith("rgb"))) {
+      return { backgroundColor: result };
+    }
+    return result;
+  }
+  return "white";
+};
+const isColorValue = (value) => {
+  if (typeof value !== "string")
+    return false;
+  if (value.startsWith("#"))
+    return true;
+  if (value.startsWith("rgb"))
+    return true;
+  return false;
+};
+const getDayBgRawValue = ({ props, day }) => {
+  const date = day.year + "-" + day.month + "-" + day.value;
+  const isFunction = props.setDayBgColor instanceof Function;
+  if (isFunction) {
+    return props.setDayBgColor(date);
+  }
+  return "";
+};
+const getDayBgClass = ({ props }) => (day) => {
+  const result = getDayBgRawValue({ props, day });
+  if (typeof result === "string" && !isColorValue(result) && result) {
+    return "bg-" + result;
+  }
+  return "";
+};
+const getDayBgStyle = ({ props }) => (day) => {
+  const result = getDayBgRawValue({ props, day });
+  if (isColorValue(result)) {
+    return { backgroundColor: result };
+  }
+  return {};
 };
 const parseDate = (time) => {
   let date = {};
@@ -642,7 +682,9 @@ export {
   getCurWeekEvent,
   getDatesOfNextWeek,
   getDatesOfPreviousWeek,
+  getDayBgClass,
   getDayBgColor,
+  getDayBgStyle,
   getEventByDate,
   getEventByMonth,
   getEventByTime,

package/calendar-view/vue.js

@@ -25,6 +25,8 @@ import {
   isSelectedDate,
   isStartOrEndDay,
   getDayBgColor,
+  getDayBgStyle,
+  getDayBgClass,
   isShowNewSchedule,
   genDayTimes,
   isShowMark,
@@ -62,6 +64,8 @@ const api = [
   "isSelectedDate",
   "isStartOrEndDay",
   "getDayBgColor",
+  "getDayBgStyle",
+  "getDayBgClass",
   "isShowNewSchedule",
   "isShowMark",
   "handleCascaderChange",
@@ -281,6 +285,8 @@ const initApi = ({ vm, api: api2, state, t, props, emit, nextTick }) => {
     isSelectedDate: isSelectedDate({ state }),
     isStartOrEndDay: isStartOrEndDay({ state }),
     getDayBgColor: getDayBgColor({ props }),
+    getDayBgStyle: getDayBgStyle({ props }),
+    getDayBgClass: getDayBgClass({ props }),
     isShowNewSchedule: isShowNewSchedule({ props }),
     genDayTimes: genDayTimes({ props }),
     isShowMark: isShowMark({ props }),

package/date-range/index.js

@@ -139,7 +139,7 @@ const handleClear = ({ emit, state }) => () => {
   state.rightDate = nextMonth1(state.leftDate);
   state.rangeState.selecting = false;
   state.rangeState.endDate = null;
-  emit("pick", []);
+  emit("pick", null);
 };
 const handleChangeRange = (state, props) => (val) => {
   if (props.readonly) {

package/dialog-box/vue.js

@@ -22,6 +22,7 @@ import {
   hideScrollbar,
   toggleFullScreen
 } from "./index";
+import { nanoid } from "@opentiny/utils";
 import { usePopup } from "@opentiny/vue-hooks";
 const api = [
   "afterEnter",
@@ -61,7 +62,9 @@ const initState = ({
     style: computed(() => api2.computedStyle()),
     animationName: computed(() => api2.computedAnimationName()),
     current,
-    dragStyle: null
+    dragStyle: null,
+    titleId: `tiny-dialog-box-title-${nanoid.api.nanoid(8)}`,
+    contentId: `tiny-dialog-box-content-${nanoid.api.nanoid(8)}`
   });
   return state;
 };

package/dialog-select/index.js

@@ -439,7 +439,7 @@ const multiGridRadioChange = ({ props, state }) => ({ row, $table }, event) => {
   }
 };
 const watchMulti = ({ api, state, props }) => () => {
-  state.splitValue = props.multi ? 0.7 : 1;
+  state.splitValue = props.multi && props.showSelectedBox ? 0.7 : 1;
   state.selectedChanged = false;
   state.selectedDatas = [];
   state.selectedValues = [];

package/drawer/index.js

@@ -28,8 +28,19 @@ const computedHeight = ({
 const close = ({ api }) => (force = true) => {
   api.handleClose("close", typeof force === "boolean" ? force : false);
 };
-const watchVisible = ({ state, api }) => (value) => {
+const closed = ({ state, emit }) => () => {
+  if (!state.visible) {
+    emit("closed");
+  }
+};
+const watchVisible = ({ props, parent, api }) => (value) => {
   value ? api.open() : api.close();
+  if (value) {
+    const el = parent.$el;
+    if (props.appendToBody) {
+      document.body.appendChild(el);
+    }
+  }
 };
 const open = ({ state, emit, vm }) => () => {
   if (!state.visible) {
@@ -146,6 +157,7 @@ export {
   addDragEvent,
   addKeydownEvent,
   close,
+  closed,
   computedHeight,
   computedWidth,
   confirm,

package/drawer/vue.js

@@ -1,6 +1,7 @@
 import "../chunk-G2ADBYYC.js";
 import {
   close,
+  closed,
   watchVisible,
   confirm,
   mousedown,
@@ -18,8 +19,8 @@ import {
   addKeydownEvent,
   removeKeydownEvent
 } from "./index";
-const api = ["state", "close", "confirm", "handleClose", "open"];
-const renderless = (props, { reactive, watch, onMounted, onBeforeUnmount, computed }, { emit, vm, mode, constants, designConfig }) => {
+const api = ["state", "close", "closed", "confirm", "handleClose", "open"];
+const renderless = (props, { reactive, watch, onMounted, onBeforeUnmount, computed }, { emit, vm, mode, parent, constants, designConfig }) => {
   const lockScrollClass = constants.SCROLL_LOCK_CLASS(mode);
   const api2 = {};
   const state = reactive({
@@ -35,6 +36,7 @@ const renderless = (props, { reactive, watch, onMounted, onBeforeUnmount, comput
     open: open({ state, emit, vm }),
     confirm: confirm({ api: api2 }),
     close: close({ api: api2 }),
+    closed: closed({ state, emit }),
     handleClose: handleClose({ emit, props, state }),
     mousedown: mousedown({ state, vm }),
     mousemove: mousemove({ state, props, emit }),
@@ -44,13 +46,17 @@ const renderless = (props, { reactive, watch, onMounted, onBeforeUnmount, comput
     removeKeydownEvent: removeKeydownEvent({ api: api2 }),
     addDragEvent: addDragEvent({ api: api2, vm }),
     removeDragEvent: removeDragEvent({ api: api2, vm }),
-    watchVisible: watchVisible({ state, api: api2 }),
+    watchVisible: watchVisible({ props, parent, api: api2 }),
     showScrollbar: showScrollbar(lockScrollClass),
     hideScrollbar: hideScrollbar(lockScrollClass),
     computedWidth: computedWidth({ state, designConfig, props, constants }),
     computedHeight: computedHeight({ state, designConfig, props, constants })
   });
   onMounted(() => {
+    const el = parent.$el;
+    if (props.appendToBody && el && el.parentNode !== document.body) {
+      document.body.appendChild(el);
+    }
     props.dragable && api2.addDragEvent();
     api2.addKeydownEvent();
     if (props.lockScroll && props.visible) {
@@ -61,6 +67,10 @@ const renderless = (props, { reactive, watch, onMounted, onBeforeUnmount, comput
     props.dragable && api2.removeDragEvent();
     api2.removeKeydownEvent();
     props.lockScroll && api2.hideScrollbar();
+    const el = parent.$el;
+    if (props.appendToBody && el && el.parentNode) {
+      el.parentNode.removeChild(el);
+    }
   });
   watch(() => props.visible, api2.watchVisible, { immediate: true });
   watch(

package/fluent-editor/index.js

@@ -1,10 +1,21 @@
-import "../chunk-G2ADBYYC.js";
+import {
+  __spreadValues
+} from "../chunk-G2ADBYYC.js";
 import { extend } from "@opentiny/utils";
 import { isNull } from "@opentiny/utils";
 import { xss } from "@opentiny/utils";
 import { set } from "../chart-core/deps/utils";
 import { on, off } from "@opentiny/utils";
 import { PopupManager } from "@opentiny/utils";
+const isSafeLinkUrl = (url) => /^(https?:|mailto:|tel:|\/|#)/i.test((url || "").trim());
+const openLink = (url, target = "_blank") => {
+  if (target === "_blank") {
+    const popup = window.open(url, "_blank", "noopener,noreferrer");
+    popup && (popup.opener = null);
+    return;
+  }
+  window.location.assign(url);
+};
 const init = ({
   api,
   emit,
@@ -18,12 +29,23 @@ const init = ({
   useBreakpoint,
   simpleToolbar
 }) => () => {
-  var _a;
+  var _a, _b, _c;
   UploaderDfls.enableMultiUpload = { file: true, image: true };
   UploaderDfls.handler = api.uploaderDflsHandler;
   UploaderDfls.imagePasteFailCallback = props.imagePasteFailCallback;
   defaultOptions.modules.toolbar.handlers = api.handlers();
   state.innerOptions = extend(true, {}, defaultOptions, props.globalOptions, props.options);
+  const toolbarOpt = (_b = (_a = state.innerOptions) == null ? void 0 : _a.modules) == null ? void 0 : _b.toolbar;
+  const defaultHandlers = api.handlers();
+  if (Array.isArray(toolbarOpt)) {
+    state.innerOptions.modules.toolbar = {
+      container: toolbarOpt,
+      handlers: defaultHandlers
+    };
+  } else if (toolbarOpt && typeof toolbarOpt === "object") {
+    const userHandlers = toolbarOpt.handlers || {};
+    state.innerOptions.modules.toolbar.handlers = __spreadValues(__spreadValues({}, defaultHandlers), userHandlers);
+  }
   if (props.imageUpload) {
     state.innerOptions.imageUpload = props.imageUpload;
   } else {
@@ -43,10 +65,12 @@ const init = ({
   if (current.value === "default") {
     state.innerOptions.modules.toolbar = simpleToolbar;
   }
-  (_a = props.beforeEditorInit) == null ? void 0 : _a.call(props, FluentEditor);
+  (_c = props.beforeEditorInit) == null ? void 0 : _c.call(props, FluentEditor);
   const quill = new FluentEditor(vm.$refs.editor, state.innerOptions);
   quill.emitter.on("file-change", api.fileOperationToSev);
   state.quill = Object.freeze(quill);
+  state.linkClickHandler = api.handleLinkClick;
+  on(state.quill.root, "click", state.linkClickHandler);
   setTimeout(api.setToolbarTitle);
   let insertTableButton = vm.$el.querySelector(".ql-better-table");
   const tableModule = state.quill.getModule("better-table");
@@ -188,12 +212,18 @@ const redoHandler = ({ state }) => () => {
 const lineheightHandler = ({ state, FluentEditor }) => (value) => {
   state.quill.format("lineheight", value, FluentEditor.sources.USER);
 };
-const fileHandler = ({ api, state }) => () => {
+const fileHandler = ({ api, state, props }) => () => {
+  if (props.disabled) {
+    return;
+  }
   const option = state.quill.options.uploadOption;
   const accept = option && option.fileAccept;
   api.inputFileHandler("file", accept);
 };
-const imageHandler = ({ api, state }) => () => {
+const imageHandler = ({ api, state, props }) => () => {
+  if (props.disabled) {
+    return;
+  }
   const option = state.quill.options.uploadOption;
   const accept = option && option.imageAccept;
   api.inputFileHandler("image", accept);
@@ -220,7 +250,10 @@ const inputFileHandler = ({ state, UploaderDfls }) => (type, accept) => {
   }
   fileInput.click();
 };
-const uploaderDflsHandler = ({ api, modules }) => (range, files, fileFlags, rejectFlags) => {
+const uploaderDflsHandler = ({ api, modules, props }) => (range, files, fileFlags, rejectFlags) => {
+  if (props.disabled) {
+    return;
+  }
   const fileArr = [];
   const imgArr = [];
   files.forEach((file, index) => fileFlags[index] ? fileArr.push(file) : imgArr.push(file));
@@ -378,7 +411,15 @@ const handleUploadImage = ({ state, api, FluentEditor, Delta, UploaderDfls }) =>
     state.promisesData.push({
       imageEnableMultiUpload
     });
-    state.promises.push(api.uploadImageToSev(result));
+    const toRead = imageEnableMultiUpload ? files : [file];
+    const readFileToBlob = (f) => f.arrayBuffer().then((ab) => new Blob([ab], { type: f.type }));
+    const uploadPromise = Promise.all(toRead.map(readFileToBlob)).then((blobs) => {
+      result.file = blobs[0];
+      result.fileName = file.name;
+      result.data.files = blobs;
+      api.uploadImageToSev(result);
+    });
+    state.promises.push(uploadPromise);
   } else {
     const promises = files.map((fileItem) => {
       return new Promise((resolve) => {
@@ -419,7 +460,7 @@ const insertImageToEditor = ({ state, FluentEditor, Delta }) => (range, { data }
   state.quill.updateContents(newContent, FluentEditor.sources.USER);
 };
 const uploadImageToSev = ({ state }) => (event) => {
-  const { file, hasRejectedImage, callback } = event;
+  const { file, fileName, hasRejectedImage, callback } = event;
   const { files } = event.data;
   if (hasRejectedImage) {
     return;
@@ -435,7 +476,7 @@ const uploadImageToSev = ({ state }) => (event) => {
     return;
   }
   let { fd = new FormData(), xhr = new XMLHttpRequest() } = {};
-  fd.append(name, file, file.name);
+  fd.append(name, file, fileName || file.name || "file");
   options.csrf && fd.append(options.csrf.token, options.csrf.hash);
   xhr.withCredentials = options.withCredentials !== false;
   xhr.open(method, url, true);
@@ -458,6 +499,59 @@ const uploadImageToSev = ({ state }) => (event) => {
   };
   xhr.send(fd);
 };
+const alignHandler = ({ state, FluentEditor }) => (value) => {
+  var _a, _b, _c, _d;
+  const range = state.quill.getSelection(true);
+  if (!range) {
+    return;
+  }
+  const betterTableModule = state.quill.getModule("better-table");
+  const selectedTds = (_a = betterTableModule == null ? void 0 : betterTableModule.tableSelection) == null ? void 0 : _a.selectedTds;
+  if (Array.isArray(selectedTds) && selectedTds.length > 0) {
+    const selectedCells = selectedTds.map((tdBlot) => tdBlot == null ? void 0 : tdBlot.domNode).filter(Boolean);
+    selectedCells.forEach((cellElement) => {
+      const cellBlot = state.quill.scroll.find(cellElement);
+      if (!cellBlot)
+        return;
+      const lines = [];
+      const findLines = (blot) => {
+        var _a2, _b2;
+        if (((_a2 = blot == null ? void 0 : blot.statics) == null ? void 0 : _a2.blotName) === "table-cell-line") {
+          lines.push(blot);
+        }
+        if ((_b2 = blot == null ? void 0 : blot.children) == null ? void 0 : _b2.length) {
+          blot.children.forEach((child) => findLines(child));
+        }
+      };
+      findLines(cellBlot);
+      lines.forEach((line2) => {
+        var _a2;
+        try {
+          const lineIndex = state.quill.getIndex(line2);
+          if (lineIndex !== null && lineIndex >= 0) {
+            const lineLength = line2.length();
+            if (lineLength > 0) {
+              state.quill.formatLine(lineIndex, lineLength, "align", value, FluentEditor.sources.USER);
+            }
+          }
+        } catch (e) {
+          try {
+            (_a2 = line2 == null ? void 0 : line2.format) == null ? void 0 : _a2.call(line2, "align", value);
+          } catch (err) {
+          }
+        }
+      });
+    });
+    (_c = (_b = betterTableModule == null ? void 0 : betterTableModule.tableSelection) == null ? void 0 : _b.clearSelection) == null ? void 0 : _c.call(_b);
+    return;
+  }
+  const [line] = state.quill.getLine(range.index);
+  if (((_d = line == null ? void 0 : line.statics) == null ? void 0 : _d.blotName) === "table-cell-line") {
+    state.quill.formatLine(range.index, 1, "align", value, FluentEditor.sources.USER);
+    return;
+  }
+  state.quill.format("align", value, FluentEditor.sources.USER);
+};
 const handlers = ({ api }) => () => {
   return {
     undo: api.undoHandler,
@@ -465,7 +559,8 @@ const handlers = ({ api }) => () => {
     lineheight: api.lineheightHandler,
     file: api.fileHandler,
     image: api.imageHandler,
-    inputFile: api.inputFileHandler
+    inputFile: api.inputFileHandler,
+    align: api.alignHandler
   };
 };
 const getFileUploadUrl = ({ service }) => () => {
@@ -566,9 +661,44 @@ const beforeUnmount = ({ state, api, vm }) => () => {
   api.removeHandleComposition();
   state.quill.off("selection-change", api.selectionChange);
   state.quill.off("text-change", api.textChange);
+  off(state.quill.root, "click", state.linkClickHandler);
+  state.linkClickHandler = null;
   state.quill = null;
   delete state.quill;
 };
+const handleLinkClick = ({ props, state }) => (event) => {
+  var _a;
+  const anchor = ((_a = event == null ? void 0 : event.target) == null ? void 0 : _a.closest) && event.target.closest("a[href]");
+  if (!anchor) {
+    return;
+  }
+  const rawHref = anchor.getAttribute("href") || "";
+  const href = xss.filterUrl(rawHref);
+  event.preventDefault();
+  if (!href || !isSafeLinkUrl(href)) {
+    return;
+  }
+  const payload = {
+    url: href,
+    rawUrl: rawHref,
+    target: anchor.getAttribute("target") || "_blank",
+    rel: anchor.getAttribute("rel") || "",
+    event,
+    quill: state.quill
+  };
+  const beforeLinkOpen = props.beforeLinkOpen;
+  if (typeof beforeLinkOpen !== "function") {
+    openLink(payload.url, payload.target);
+    return;
+  }
+  const open = (allow) => allow !== false && openLink(payload.url, payload.target);
+  try {
+    const result = beforeLinkOpen(payload);
+    result && typeof result.then === "function" ? result.then(open).catch(() => {
+    }) : open(result);
+  } catch (_) {
+  }
+};
 const computePreviewOptions = ({ props, state, constants, api }) => () => {
   if (props.picPreview && state.previewImgUrl) {
     let previewOptions = typeof props.picPreview === "boolean" ? constants.PIC_PREVIEW_OPTIONS : props.picPreview;
@@ -661,6 +791,7 @@ const setToolbarTitle = ({ state, t }) => () => {
 const computeZIndex = ({ constants, props }) => () => props.zIndex === constants.EDITOR_FULLSCREEN_OPTIONS || props.zIndex < 1 ? PopupManager.nextZIndex() : props.zIndex;
 export {
   addFullscreenchange,
+  alignHandler,
   beforeUnmount,
   checkTableISEndElement,
   computePreviewOptions,
@@ -674,6 +805,7 @@ export {
   handleCompositionend,
   handleCompositionstart,
   handleDblclick,
+  handleLinkClick,
   handleUploadFile,
   handleUploadImage,
   handlers,

package/fluent-editor/vue.js

@@ -36,7 +36,9 @@ import {
   handleCompositionstart,
   handleCompositionend,
   removeHandleComposition,
-  checkTableISEndElement
+  checkTableISEndElement,
+  alignHandler,
+  handleLinkClick
 } from "./index";
 import { defaultOption, iconOption, iconOptionMobileFirst, simpleToolbar } from "./options";
 const api = ["state", "init", "initContent", "selectionChange", "textChange", "doPreview", "handleDblclick"];
@@ -49,6 +51,7 @@ const initState = ({ api: api2, reactive, computed, props }) => {
     innerContent: "",
     fileUploadUrl: props.fileUpload && props.fileUpload.url || "",
     quill: null,
+    linkClickHandler: null,
     fileInput: null,
     previewOptions: computed(() => api2.computePreviewOptions()),
     previewImgUrl: "",
@@ -101,13 +104,19 @@ const initApi = ({ api: api2, state, service, emit, props, nextTick, FluentEdito
     undoHandler: undoHandler({ state }),
     redoHandler: redoHandler({ state }),
     lineheightHandler: lineheightHandler({ state, FluentEditor }),
+    alignHandler: alignHandler({ state, FluentEditor }),
     inputFileHandler: inputFileHandler({ state, UploaderDfls }),
     insertFileToEditor: insertFileToEditor({ state, FluentEditor, Delta }),
     insertImageToEditor: insertImageToEditor({ state, FluentEditor, Delta }),
     uploadImageToSev: uploadImageToSev({ state }),
     doPreview: doPreview({ props, state, nextTick }),
     stringToJson: stringToJson({ props }),
-    setToolbarTips: setToolbarTips({ api: api2, vm, FluentEditor, iconOption: mode === "mobile-first" ? iconOptionMobileFirst : iconOption }),
+    setToolbarTips: setToolbarTips({
+      api: api2,
+      vm,
+      FluentEditor,
+      iconOption: mode === "mobile-first" ? iconOptionMobileFirst : iconOption
+    }),
     getOuterHTML: getOuterHTML(),
     setToolbarTitle: setToolbarTitle({ state, t })
   });
@@ -116,11 +125,23 @@ const mergeApi = (args) => {
   let { api: api2, state, service, emit, props, vm, i18n, watch, nextTick, useBreakpoint } = args;
   let { constants, FluentEditor, UploaderDfls, Delta, defaultOptions } = args;
   Object.assign(api2, {
-    init: init({ api: api2, emit, props, service, state, FluentEditor, UploaderDfls, defaultOptions, vm, useBreakpoint, simpleToolbar }),
+    init: init({
+      api: api2,
+      emit,
+      props,
+      service,
+      state,
+      FluentEditor,
+      UploaderDfls,
+      defaultOptions,
+      vm,
+      useBreakpoint,
+      simpleToolbar
+    }),
     initContent: initContent({ state, props, api: api2, nextTick }),
-    fileHandler: fileHandler({ api: api2, state }),
-    imageHandler: imageHandler({ api: api2, state }),
-    uploaderDflsHandler: uploaderDflsHandler({ api: api2, modules: defaultOptions.modules }),
+    fileHandler: fileHandler({ api: api2, state, props }),
+    imageHandler: imageHandler({ api: api2, state, props }),
+    uploaderDflsHandler: uploaderDflsHandler({ api: api2, modules: defaultOptions.modules, props }),
     handleUploadFile: handleUploadFile({ api: api2, UploaderDfls }),
     handleUploadImage: handleUploadImage({ state, api: api2, FluentEditor, Delta, UploaderDfls }),
     handlers: handlers({ api: api2 }),
@@ -136,7 +157,8 @@ const mergeApi = (args) => {
     handleComposition: handleComposition({ state, api: api2 }),
     handleCompositionstart: handleCompositionstart({ state }),
     handleCompositionend: handleCompositionend({ state }),
-    removeHandleComposition: removeHandleComposition({ state, api: api2 })
+    removeHandleComposition: removeHandleComposition({ state, api: api2 }),
+    handleLinkClick: handleLinkClick({ props, state })
   });
 };
 const initWatch = ({ watch, state, api: api2, props, vm }) => {
@@ -170,7 +192,7 @@ const initWatch = ({ watch, state, api: api2, props, vm }) => {
 const renderless = (props, { reactive, watch, onMounted, onBeforeUnmount, computed }, { service, emit, i18n, constants, nextTick, vm, t, useBreakpoint, mode }, { FluentEditor }) => {
   const api2 = {};
   const { DEFAULTS: UploaderDfls } = FluentEditor.imports["modules/uploader"];
-  const Delta = FluentEditor.imports["delta"];
+  const Delta = FluentEditor.imports.delta;
   const state = initState({ reactive, computed, api: api2, props });
   const defaultOptions = defaultOption({ FluentEditor, state, mentionObj: props.mentionObj });
   initApi({ api: api2, state, service, emit, props, nextTick, FluentEditor, UploaderDfls, Delta, vm, t, mode });

package/form-item/index.js

@@ -268,7 +268,7 @@ const getFilteredRule = (api) => (trigger) => {
   }).map((rule) => merge({}, rule));
 };
 const onFieldBlur = (api) => () => {
-  api.validate("blur");
+  api.validateOrigin("blur");
 };
 const onFieldChange = ({ api, state }) => () => {
   if (state.validateDisabled) {