@ibiz-template/vue3-components 0.7.41-alpha.39 → 0.7.41-alpha.40

package/es/editor/html/wang-editor/wang-editor.mjs

@@ -18,7 +18,8 @@ const IBizHtml = /* @__PURE__ */ defineComponent({
   props: getHtmlProps(),
   emits: getEditorEmits(),
   setup(props, {
-    emit
+    emit,
+    slots
   }) {
     const ns = useNamespace("html");
     const c = props.controller;
@@ -651,11 +652,12 @@ const IBizHtml = /* @__PURE__ */ defineComponent({
       return null;
     };
     const renderEditorContent = () => {
+      var _a;
       return createVNode("div", {
         "class": [ns.b("content"), ns.is("editing", !readonlyState.value)],
         "ref": "htmlContent",
         "style": cssVars.value
-      }, [createVNode(Toolbar, {
+      }, [(_a = slots.editorSwitchMenu) == null ? void 0 : _a.call(slots), createVNode(Toolbar, {
         "ref": "toolbarRef",
         "editor": editorRef.value,
         "default-config": toolbarConfig,
@@ -719,10 +721,11 @@ const IBizHtml = /* @__PURE__ */ defineComponent({
     };
   },
   render() {
+    const isShowEditorSwitchMenu = !!this.$slots.editorSwitchMenu;
     return !this.isFullScreen ? createVNode("div", {
       "class": [this.ns.b(), {
         [this.ns.b("editor-readonly")]: this.readonlyState
-      }, this.ns.is("show-ai", true), this.ns.is("enable-edit", !this.readonly && !this.disabled)]
+      }, this.ns.is("show-ai", true), this.ns.is("enable-edit", !this.readonly && !this.disabled), this.ns.is("show-editor-switch-menu", isShowEditorSwitchMenu)]
     }, [this.renderHeaserToolbar(), this.renderEditorContent(), this.hasEnableEdit && !this.readonlyState ? this.renderFooter() : null]) : createVNode(resolveComponent("el-dialog"), {
       "modelValue": this.isFullScreen,
       "onUpdate:modelValue": ($event) => this.isFullScreen = $event,
@@ -734,7 +737,7 @@ const IBizHtml = /* @__PURE__ */ defineComponent({
       default: () => [createVNode("div", {
         "class": [this.ns.b(), {
           [this.ns.b("editor-readonly")]: this.readonlyState
-        }]
+        }, this.ns.is("show-editor-switch-menu", isShowEditorSwitchMenu)]
       }, [this.renderHeaserToolbar(), this.renderEditorContent(), this.hasEnableEdit && !this.readonlyState ? this.renderFooter() : null])]
     });
   }

package/es/editor/markdown/ibiz-markdown-editor/custom-menu.mjs

@@ -14,7 +14,7 @@ function initCustomMenu(c) {
       nextTick(() => {
         var _a;
         if ((_a = c.mdeditor) == null ? void 0 : _a.bubble) {
-          c.mdeditor.bubble.visible = true;
+          c.mdeditor.bubble.showBubble();
           const selectionPosition = c.mdeditor.bubble.bubbleDom.getBoundingClientRect();
           if (!selectionPosition || !selectionPosition.left || !selectionPosition.top)
             return;

package/es/editor/markdown/ibiz-markdown-editor/ibiz-markdown-editor.css

@@ -1 +1 @@
-.ibiz-markdown{--ibiz-markdown-width:100%;--ibiz-markdown-color-manual-toolbar-bg-save:var(--ibiz-color-primary);--ibiz-markdown-color-manual-toolbar-text-save:var(--ibiz-color-primary-active-text);--ibiz-markdown-color-manual-toolbar-text-cancel:var(--ibiz-color-text-1);--ibiz-markdown-color-manual-toolbar-text-cancel-hover:var(--ibiz-color-primary);--ibiz-markdown-spacing-manual-toolbar-height:32px;--ibiz-markdown-spacing-manual-toolbar-gap:var(--ibiz-spacing-base);--ibiz-markdown-spacing-manual-toolbar-item-padding:0 var(--ibiz-spacing-base);--ibiz-markdown-spacing-manual-toolbar-margin:var(--ibiz-spacing-base-tight) var(--ibiz-spacing-tight) 0 0;--ibiz-markdown-spacing-manual-toolbar-fullscreen-height:var(--ibiz-height-control-default);--ibiz-markdown-spacing-manual-toolbar-fullscreen-padding:0 var(--ibiz-spacing-extra-loose);--ibiz-markdown-spacing-manual-toolbar-fullscreen-height-header:var(--ibiz-spacing-super-loose);--ibiz-markdown-height-manual-toolbar-height:var(--ibiz-height-control-default);--ibiz-markdown-border-radius-manual-toolbar-item:var(--ibiz-border-radius-small);--ibiz-markdown-border-manual-toolbar-fullscreen-footer:1px solid var(--ibiz-color-border)}.ibiz-markdown__header{display:flex;flex-shrink:0;gap:var(--ibiz-markdown-spacing-manual-toolbar-gap);align-items:center;justify-content:end;height:var(--ibiz-markdown-spacing-manual-toolbar-height)}.ibiz-markdown__header--edit{cursor:pointer}.ibiz-markdown__header--full{cursor:pointer}.ibiz-markdown__header.is-fullscreen{position:fixed;top:0;right:0;left:0;z-index:999;width:100%;height:calc(var(--ibiz-markdown-spacing-manual-toolbar-fullscreen-height-header));padding:var(--ibiz-markdown-spacing-manual-toolbar-fullscreen-padding);margin-top:0;background-color:var(--ibiz-view-bg-color)}.ibiz-markdown__header.is-fullscreen+.ibiz-markdown-cherry .cherry.fullscreen{top:calc(var(--ibiz-markdown-spacing-manual-toolbar-fullscreen-height-header));height:calc(100% - var(--ibiz-markdown-spacing-manual-toolbar-fullscreen-height-header))}.ibiz-markdown__footer{display:flex;gap:var(--ibiz-markdown-spacing-manual-toolbar-gap);align-items:center;justify-content:end;height:var(--ibiz-markdown-spacing-manual-toolbar-height);margin:var(--ibiz-markdown-spacing-manual-toolbar-margin)}.ibiz-markdown__footer--save{height:var(--ibiz-markdown-height-manual-toolbar-height);padding:var(--ibiz-markdown-spacing-manual-toolbar-item-padding);line-height:var(--ibiz-markdown-height-manual-toolbar-height);color:var(--ibiz-markdown-color-manual-toolbar-text-save);text-align:center;cursor:pointer;background-color:var(--ibiz-markdown-color-manual-toolbar-bg-save);border-radius:var(--ibiz-markdown-border-radius-manual-toolbar-item)}.ibiz-markdown__footer--cancel{color:var(--ibiz-markdown-color-manual-toolbar-text-cancel);cursor:pointer}.ibiz-markdown__footer--cancel:hover{color:var(--ibiz-markdown-color-manual-toolbar-text-cancel-hover)}.ibiz-markdown__footer.is-fullscreen{position:fixed;right:0;bottom:0;left:0;z-index:999;width:100%;height:calc(var(--ibiz-markdown-spacing-manual-toolbar-fullscreen-height) * 2);padding:var(--ibiz-markdown-spacing-manual-toolbar-fullscreen-padding);margin-top:0;background-color:var(--ibiz-view-bg-color);border-top:var(--ibiz-markdown-border-manual-toolbar-fullscreen-footer)}.ibiz-markdown__footer.is-fullscreen+.ibiz-markdown-cherry .cherry.fullscreen{height:calc(100% - var(--ibiz-markdown-spacing-manual-toolbar-fullscreen-height) * 2)}.ibiz-markdown .ibiz-markdown-cherry{width:var(--ibiz-markdown-width);outline:0}.ibiz-markdown .ibiz-markdown-cherry .cherry{width:100%;border:1px solid var(--ibiz-color-border);box-shadow:none}.ibiz-markdown .ibiz-markdown-cherry .cherry .cherry-toolbar{background-color:var(--ibiz-color-bg-0);box-shadow:none}.ibiz-markdown .ibiz-markdown-cherry .cherry .cherry-editor{border-top:1px solid var(--ibiz-color-border)}.ibiz-markdown .ibiz-markdown-cherry .cherry .cherry-previewer{border-top:1px solid var(--ibiz-color-border)}.ibiz-markdown .ibiz-markdown-cherry .cherry .cherry-sidebar{border-left:1px solid var(--ibiz-color-border);box-shadow:none}.ibiz-markdown.is-disabled .cherry{min-height:auto}.ibiz-markdown.is-disabled .ibiz-markdown__fullscreen{position:absolute;top:8px;right:12px;z-index:98;font-size:var(--ibiz-font-size-regular);line-height:2.8}.ibiz-markdown.is-disabled .theme__dark .ibiz-markdown__fullscreen{color:var(--ibiz-color-text-0)}.ibiz-markdown.is-disabled .theme__dark .ibiz-markdown__fullscreen:hover{background-color:var(--ibiz-color-bg-3)}.ibiz-markdown.is-manual{display:flex;flex-direction:column}.ibiz-markdown.is-manual .ibiz-markdown-cherry{flex-grow:1;height:calc(100% - var(--ibiz-markdown-spacing-manual-toolbar-height))!important}.ibiz-markdown.is-manual.is-editing{flex-direction:column-reverse}.ibiz-markdown .cherry-preview--full{border-left:none}.ibiz-markdown .theme__dark,.ibiz-markdown .theme__light{color:var(--ibiz-form-item-text-color)}.ibiz-markdown .cherry-markdown h1 a::before,.ibiz-markdown .cherry-markdown h2 a::before,.ibiz-markdown .cherry-markdown h3 a::before,.ibiz-markdown .cherry-markdown h4 a::before,.ibiz-markdown .cherry-markdown h5 a::before,.ibiz-markdown .cherry-markdown h6 a::before{display:none}.ibiz-markdown .cherry.fullscreen{z-index:999}
+.ibiz-markdown{--ibiz-markdown-width:100%;--ibiz-markdown-color-manual-toolbar-bg-save:var(--ibiz-color-primary);--ibiz-markdown-color-manual-toolbar-text-save:var(--ibiz-color-primary-active-text);--ibiz-markdown-color-manual-toolbar-text-cancel:var(--ibiz-color-text-1);--ibiz-markdown-color-manual-toolbar-text-cancel-hover:var(--ibiz-color-primary);--ibiz-markdown-color-dark-scrollbar-thumb-dark:rgb(var(--ibiz-grey-4));--ibiz-markdown-color-light-scrollbar-thumb-dark:rgb(var(--ibiz-grey-4));--ibiz-markdown-color-scrollbar-thumb-dark-hover:rgba(var(--ibiz-grey-4), 0.5);--ibiz-markdown-color-dark-toc-text:var(--ibiz-color-fill-0);--ibiz-markdown-color-toc-header-text:var(--ibiz-color-text-0);--ibiz-markdown-color-dark-mardown-border:rgb(var(--ibiz-grey-2));--ibiz-markdown-spacing-manual-toolbar-height:32px;--ibiz-markdown-spacing-manual-toolbar-gap:var(--ibiz-spacing-base);--ibiz-markdown-spacing-manual-toolbar-item-padding:0 var(--ibiz-spacing-base);--ibiz-markdown-spacing-manual-toolbar-margin:var(--ibiz-spacing-base-tight) var(--ibiz-spacing-tight) 0 0;--ibiz-markdown-spacing-manual-toolbar-fullscreen-height:var(--ibiz-height-control-default);--ibiz-markdown-spacing-manual-toolbar-fullscreen-padding:0 var(--ibiz-spacing-extra-loose);--ibiz-markdown-spacing-manual-toolbar-fullscreen-height-header:var(--ibiz-spacing-super-loose);--ibiz-markdown-height-manual-toolbar-height:var(--ibiz-height-control-default);--ibiz-markdown-border-radius-manual-toolbar-item:var(--ibiz-border-radius-small);--ibiz-markdown-border-manual-toolbar-fullscreen-footer:1px solid var(--ibiz-color-border);--ibiz-markdown-img-preview-top:-32px;--ibiz-markdown-img-preview-right:-36px;--ibiz-markdown-img-preview-width:32px;--ibiz-markdown-img-preview-height:32px}.ibiz-markdown__header{display:flex;flex-shrink:0;gap:var(--ibiz-markdown-spacing-manual-toolbar-gap);align-items:center;justify-content:end;height:var(--ibiz-markdown-spacing-manual-toolbar-height)}.ibiz-markdown__header--edit{cursor:pointer}.ibiz-markdown__header--full{cursor:pointer}.ibiz-markdown__header.is-fullscreen{position:fixed;top:0;right:0;left:0;z-index:999;width:100%;height:calc(var(--ibiz-markdown-spacing-manual-toolbar-fullscreen-height-header));padding:var(--ibiz-markdown-spacing-manual-toolbar-fullscreen-padding);margin-top:0;background-color:var(--ibiz-view-bg-color)}.ibiz-markdown__header.is-fullscreen+.ibiz-markdown-cherry .cherry.fullscreen{top:calc(var(--ibiz-markdown-spacing-manual-toolbar-fullscreen-height-header));height:calc(100% - var(--ibiz-markdown-spacing-manual-toolbar-fullscreen-height-header))}.ibiz-markdown__footer{display:flex;gap:var(--ibiz-markdown-spacing-manual-toolbar-gap);align-items:center;justify-content:end;height:var(--ibiz-markdown-spacing-manual-toolbar-height);margin:var(--ibiz-markdown-spacing-manual-toolbar-margin)}.ibiz-markdown__footer--save{height:var(--ibiz-markdown-height-manual-toolbar-height);padding:var(--ibiz-markdown-spacing-manual-toolbar-item-padding);line-height:var(--ibiz-markdown-height-manual-toolbar-height);color:var(--ibiz-markdown-color-manual-toolbar-text-save);text-align:center;cursor:pointer;background-color:var(--ibiz-markdown-color-manual-toolbar-bg-save);border-radius:var(--ibiz-markdown-border-radius-manual-toolbar-item)}.ibiz-markdown__footer--cancel{color:var(--ibiz-markdown-color-manual-toolbar-text-cancel);cursor:pointer}.ibiz-markdown__footer--cancel:hover{color:var(--ibiz-markdown-color-manual-toolbar-text-cancel-hover)}.ibiz-markdown__footer.is-fullscreen{position:fixed;right:0;bottom:0;left:0;z-index:999;width:100%;height:calc(var(--ibiz-markdown-spacing-manual-toolbar-fullscreen-height) * 2);padding:var(--ibiz-markdown-spacing-manual-toolbar-fullscreen-padding);margin-top:0;background-color:var(--ibiz-view-bg-color);border-top:var(--ibiz-markdown-border-manual-toolbar-fullscreen-footer)}.ibiz-markdown__footer.is-fullscreen+.ibiz-markdown-cherry .cherry.fullscreen{height:calc(100% - var(--ibiz-markdown-spacing-manual-toolbar-fullscreen-height) * 2)}.ibiz-markdown__img-preview.el-image{position:absolute;height:0}.ibiz-markdown__img-preview .el-image-viewer__wrapper{width:90%;height:90%;margin:auto}.ibiz-markdown__img-preview .el-image-viewer__mask{position:fixed;width:100vw;height:100vh;cursor:zoom-out;opacity:.7}.ibiz-markdown__img-preview .el-image-viewer__close{top:var(--ibiz-markdown-img-preview-top);right:var(--ibiz-markdown-img-preview-right);width:var(--ibiz-markdown-img-preview-width);height:var(--ibiz-markdown-img-preview-height)}.ibiz-markdown .ibiz-markdown-cherry{width:var(--ibiz-markdown-width);outline:0}.ibiz-markdown .ibiz-markdown-cherry .cherry{width:100%;border:1px solid var(--ibiz-color-border);box-shadow:none}.ibiz-markdown .ibiz-markdown-cherry .cherry .cherry-toolbar{box-shadow:none}.ibiz-markdown .ibiz-markdown-cherry .cherry .cherry-editor{border-top:1px solid var(--ibiz-color-border)}.ibiz-markdown .ibiz-markdown-cherry .cherry .cherry-previewer{border-top:1px solid var(--ibiz-color-border)}.ibiz-markdown .ibiz-markdown-cherry .cherry .cherry-previewer img{cursor:zoom-in}.ibiz-markdown .ibiz-markdown-cherry .cherry .cherry-sidebar{border-left:1px solid var(--ibiz-color-border);box-shadow:none}.ibiz-markdown.is-disabled .cherry{min-height:auto}.ibiz-markdown.is-disabled .ibiz-markdown__fullscreen{position:absolute;top:8px;right:12px;z-index:98;font-size:var(--ibiz-font-size-regular);line-height:2.8}.ibiz-markdown.is-disabled .theme__dark .ibiz-markdown__fullscreen{color:var(--ibiz-color-text-0)}.ibiz-markdown.is-disabled .theme__dark .ibiz-markdown__fullscreen:hover{background-color:var(--ibiz-color-bg-3)}.ibiz-markdown.is-manual{display:flex;flex-direction:column}.ibiz-markdown.is-manual .ibiz-markdown-cherry{flex-grow:1;height:calc(100% - var(--ibiz-markdown-spacing-manual-toolbar-height))!important}.ibiz-markdown.is-manual.is-editing{flex-direction:column-reverse}.ibiz-markdown.is-manual .ibiz-markdown-menu{display:none}.ibiz-markdown.is-manual.is-editing .ibiz-markdown-menu{display:block}.ibiz-markdown.is-show-editor-switch-menu .ibiz-composite-form-item-ex-menu{--ibiz-composite-form-item-ex-menu-height:48px;--ibiz-composite-form-item-ex-menu-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-tight) 0}.ibiz-markdown.is-show-editor-switch-menu .cherry-toolbar{padding-right:var(--ibiz-composite-form-item-ex-menu-width)}.ibiz-markdown.is-show-editor-switch-menu .ibiz-markdown-menu{position:absolute;top:0;right:0}.ibiz-markdown.is-show-editor-switch-menu .ibiz-markdown-menu.is-fullscreen{position:fixed;z-index:1000}.ibiz-markdown.is-show-editor-switch-menu .ibiz-markdown-menu .ibiz-composite-form-item-ex-menu{position:relative}.ibiz-markdown .cherry-preview--full{border-left:none}.ibiz-markdown .theme__dark,.ibiz-markdown .theme__light{color:var(--ibiz-form-item-text-color)}.ibiz-markdown .cherry-markdown h1 a::before,.ibiz-markdown .cherry-markdown h2 a::before,.ibiz-markdown .cherry-markdown h3 a::before,.ibiz-markdown .cherry-markdown h4 a::before,.ibiz-markdown .cherry-markdown h5 a::before,.ibiz-markdown .cherry-markdown h6 a::before{display:none}.ibiz-markdown .cherry.fullscreen{z-index:999}.ibiz-markdown--light .theme__green .cherry-toolbar,.ibiz-markdown--light .theme__light .cherry-toolbar,.ibiz-markdown--light .theme__violet .cherry-toolbar{background-color:var(--ibiz-color-bg-0)}.ibiz-markdown--light .theme__dark.cherry .cherry-flex-toc{color:var(--ibiz-markdown-color-toc-header-text)}.ibiz-markdown--light .theme__dark.cherry ::-webkit-scrollbar-thumb{background:var(--ibiz-markdown-color-light-scrollbar-thumb-dark)}.ibiz-markdown--light .theme__dark.cherry ::-webkit-scrollbar-thumb:hover{background:var(--ibiz-markdown-color-scrollbar-thumb-dark-hover)}.ibiz-markdown--dark.ibiz-markdown-cherry .cherry{border:1px solid var(--ibiz-markdown-color-dark-mardown-border)}.ibiz-markdown--dark .theme__green .cherry-toolbar,.ibiz-markdown--dark .theme__light .cherry-toolbar,.ibiz-markdown--dark .theme__violet .cherry-toolbar{background-color:var(--ibiz-color-shadow)}.ibiz-markdown--dark .theme__dark.cherry .cherry-toc-head{color:var(--ibiz-markdown-color-dark-toc-text)}.ibiz-markdown--dark .theme__dark.cherry ::-webkit-scrollbar-thumb{background:var(--ibiz-markdown-color-dark-scrollbar-thumb-dark)}.ibiz-markdown--dark .theme__dark.cherry ::-webkit-scrollbar-thumb:hover{background:var(--ibiz-markdown-color-scrollbar-thumb-dark-hover)}

package/es/editor/markdown/ibiz-markdown-editor/ibiz-markdown-editor.mjs

@@ -2,8 +2,9 @@ import { defineComponent, createVNode, ref, watch, nextTick, onMounted, onBefore
 import { useNamespace, useUIStore, getEditorEmits, getMarkDownProps } from '@ibiz-template/vue3-util';
 import { createUUID } from 'qx-util';
 import Cherry from 'cherry-markdown';
-import './ibiz-markdown-editor.css';
 import { initCustomMenu } from './custom-menu.mjs';
+import { useImgPreviewRender } from './render-util.mjs';
+import './ibiz-markdown-editor.css';
 
 "use strict";
 const IBizMarkDown = /* @__PURE__ */ defineComponent({
@@ -11,7 +12,8 @@ const IBizMarkDown = /* @__PURE__ */ defineComponent({
   props: getMarkDownProps(),
   emits: getEditorEmits(),
   setup(props, {
-    emit
+    emit,
+    slots
   }) {
     var _a, _b, _c;
     const ns = useNamespace("markdown");
@@ -20,6 +22,10 @@ const IBizMarkDown = /* @__PURE__ */ defineComponent({
     let editor = null;
     const id = createUUID();
     const [AIMenu] = initCustomMenu(c);
+    const {
+      onMDEditorCreated,
+      renderImgPreview
+    } = useImgPreviewRender(ns);
     const uploadHeaders = ibiz.util.file.getUploadHeaders();
     const headers = ref({
       ...uploadHeaders
@@ -40,6 +46,7 @@ const IBizMarkDown = /* @__PURE__ */ defineComponent({
     let resizeObserver = null;
     let lastMarkDownWidth = 0;
     const cssVars = ref({});
+    const lastDirectoryState = ref("full");
     let isIgnoreChange = false;
     watch(() => props.data, (newVal) => {
       if (newVal && c) {
@@ -201,9 +208,12 @@ const IBizMarkDown = /* @__PURE__ */ defineComponent({
       if (editor && markDownBox.value) {
         if (isFullscreen()) {
           closeFullscreen();
+          editor.toggleToc(lastDirectoryState.value);
           isFullScreen.value = false;
         } else {
           openFullscreen();
+          lastDirectoryState.value = editor.toc.model;
+          editor.toggleToc("full");
           isFullScreen.value = true;
         }
       }
@@ -214,6 +224,7 @@ const IBizMarkDown = /* @__PURE__ */ defineComponent({
         _e.preventDefault();
         if (isFullscreen()) {
           closeFullscreen();
+          editor.toggleToc(lastDirectoryState.value);
           isFullScreen.value = false;
         }
       }
@@ -340,6 +351,7 @@ const IBizMarkDown = /* @__PURE__ */ defineComponent({
         const parentElement = props.disabled ? editor.editor.options.editorDom.parentElement : (_a2 = editor.editor.options.editorDom.parentElement) == null ? void 0 : _a2.querySelector(".cherry-toolbar>.toolbar-right");
         parentElement == null ? void 0 : parentElement.appendChild(span);
         c == null ? void 0 : c.setMDEditor(editor);
+        onMDEditorCreated(editor);
       });
     };
     watch(() => UIStore.theme, (newVal) => {
@@ -439,6 +451,12 @@ const IBizMarkDown = /* @__PURE__ */ defineComponent({
         }, [ibiz.i18n.t("editor.common.confirm")])]);
       }
     };
+    const renderEditorSwitchMenu = () => {
+      var _a2;
+      return createVNode("div", {
+        "class": [ns.b("menu"), ns.is("fullscreen", isFullScreen.value)]
+      }, [(_a2 = slots.editorSwitchMenu) == null ? void 0 : _a2.call(slots)]);
+    };
     onMounted(() => {
       var _a2;
       editorInit();
@@ -471,18 +489,21 @@ const IBizMarkDown = /* @__PURE__ */ defineComponent({
       getCherryContent,
       setCherryContent,
       renderHeader,
-      renderFooter
+      renderFooter,
+      renderImgPreview,
+      renderEditorSwitchMenu
     };
   },
   render() {
+    const isShowEditorSwitchMenu = !!this.$slots.editorSwitchMenu;
     return createVNode("div", {
       "ref": "markDownBox",
-      "class": [this.ns.b(), this.ns.is("disabled", this.disabled), this.ns.is("manual", this.showmode === "manual"), this.ns.is("editing", this.isEditing)]
-    }, [this.renderHeader(), this.renderFooter(), createVNode("div", {
+      "class": [this.ns.b(), this.ns.is("disabled", this.disabled), this.ns.is("manual", this.showmode === "manual"), this.ns.is("editing", this.isEditing), this.ns.is("show-editor-switch-menu", isShowEditorSwitchMenu)]
+    }, [isShowEditorSwitchMenu ? this.renderEditorSwitchMenu() : null, this.renderHeader(), this.renderFooter(), this.renderImgPreview(), createVNode("div", {
       "tabindex": "-1",
       "id": this.id,
       "style": this.cssVars,
-      "class": this.ns.b("cherry")
+      "class": [this.ns.b("cherry"), this.ns.m(this.theme === "dark" ? "dark" : "light")]
     }, null)]);
   }
 });

package/es/editor/markdown/ibiz-markdown-editor/render-util.mjs

@@ -0,0 +1,88 @@
+import { ref, nextTick, createVNode, resolveComponent, onBeforeUnmount } from 'vue';
+
+"use strict";
+function isElement(element, nodeName) {
+  return !!(element && element.nodeType === 1 && element.nodeName === nodeName);
+}
+function useImgPreviewRender(ns) {
+  const imgPreviewUrl = ref("");
+  const imgPreviewUrlList = ref([]);
+  const imgPreviewRef = ref();
+  let mdPreviewerDom = null;
+  const openImgPreview = async (url) => {
+    var _a;
+    imgPreviewUrl.value = url;
+    imgPreviewUrlList.value = [url];
+    await nextTick();
+    if (imgPreviewRef.value) {
+      const {
+        container
+      } = imgPreviewRef.value.$refs;
+      if (container) {
+        (_a = container.children[0]) == null ? void 0 : _a.click();
+      }
+    }
+  };
+  const handleKeyPress = (event) => {
+    if (event.key === "Escape" || event.keyCode === 27) {
+      event.stopPropagation();
+      event.preventDefault();
+      imgPreviewUrlList.value = [];
+      removeKeydownListener();
+    }
+  };
+  const addKeydownListener = async () => {
+    var _a;
+    await nextTick();
+    const container = (_a = imgPreviewRef.value) == null ? void 0 : _a.$refs.container;
+    if (!container)
+      return;
+    const imgViewerWrapper = container.querySelector(".el-image-viewer__wrapper");
+    imgViewerWrapper == null ? void 0 : imgViewerWrapper.addEventListener("keydown", handleKeyPress);
+  };
+  const removeKeydownListener = () => {
+    var _a;
+    const container = (_a = imgPreviewRef.value) == null ? void 0 : _a.$refs.container;
+    if (!container)
+      return;
+    const imgViewerWrapper = container.querySelector(".el-image-viewer__wrapper");
+    imgViewerWrapper == null ? void 0 : imgViewerWrapper.removeEventListener("keydown", handleKeyPress);
+  };
+  const handlePreviewerImgClick = (event) => {
+    var _a;
+    const imgUrl = (_a = event == null ? void 0 : event.target) == null ? void 0 : _a.src;
+    if (isElement(event == null ? void 0 : event.target, "IMG") && imgUrl) {
+      openImgPreview(imgUrl);
+    }
+  };
+  const renderImgPreview = () => {
+    return createVNode(resolveComponent("el-image"), {
+      "class": ns.e("img-preview"),
+      "ref": imgPreviewRef,
+      "zoom-rate": 1.1,
+      "src": imgPreviewUrl.value,
+      "preview-src-list": imgPreviewUrlList.value,
+      "hide-on-click-modal": true,
+      "onShow": addKeydownListener,
+      "fit": "cover"
+    }, null);
+  };
+  const onMDEditorCreated = (mdeditor) => {
+    var _a, _b;
+    mdPreviewerDom = ((_b = (_a = mdeditor == null ? void 0 : mdeditor.previewer) == null ? void 0 : _a.previewerBubble) == null ? void 0 : _b.previewerDom) || null;
+    mdPreviewerDom == null ? void 0 : mdPreviewerDom.addEventListener("click", handlePreviewerImgClick);
+  };
+  onBeforeUnmount(() => {
+    if (mdPreviewerDom) {
+      mdPreviewerDom.removeEventListener("click", handlePreviewerImgClick);
+      mdPreviewerDom = null;
+    }
+    removeKeydownListener();
+  });
+  return {
+    renderImgPreview,
+    onMDEditorCreated
+  };
+}
+
+export { useImgPreviewRender };

package/es/editor/markdown/markdown-editor.controller.mjs

@@ -1,5 +1,6 @@
 import { RuntimeModelError } from '@ibiz-template/core';
 import { EditorController, getDeACMode, UIActionUtil } from '@ibiz-template/runtime';
+import { clone } from 'ramda';
 
 "use strict";
 var __defProp = Object.defineProperty;
@@ -103,6 +104,13 @@ class MarkDownEditorController extends EditorController {
      * @memberof MarkDownEditorController
      */
     __publicField(this, "currentEditorTheme", "light");
+    /**
+     * AI行内聊天框高度
+     *
+     * @type {number}
+     * @memberof MarkDownEditorController
+     */
+    __publicField(this, "inlineAiChatHeight");
   }
   async onInit() {
     await super.onInit();
@@ -110,7 +118,7 @@ class MarkDownEditorController extends EditorController {
       this.style.height = "600px";
     }
     if (this.editorParams) {
-      const { uploadparams, exportparams } = this.editorParams;
+      const { uploadparams, exportparams, inlineaichatheight } = this.editorParams;
       if (uploadparams) {
         try {
           this.uploadParams = JSON.parse(uploadparams);
@@ -131,6 +139,9 @@ class MarkDownEditorController extends EditorController {
           );
         }
       }
+      if (inlineaichatheight) {
+        this.inlineAiChatHeight = Number(inlineaichatheight);
+      }
     }
     const model = this.model;
     if (model.appDEACModeId) {
@@ -312,9 +323,12 @@ class MarkDownEditorController extends EditorController {
    * @memberof MarkDownEditorController
    */
   getInLineAiChatOptions() {
-    var _a, _b, _c;
+    var _a, _b, _c, _d, _e;
     const editorRect = (_a = this.mdeditor) == null ? void 0 : _a.wrapperDom.getBoundingClientRect();
-    const bubbleRect = (_b = this.mdeditor) == null ? void 0 : _b.bubble.bubbleDom.getBoundingClientRect();
+    if (!((_b = this.mdeditor) == null ? void 0 : _b.bubble.visible)) {
+      (_c = this.mdeditor) == null ? void 0 : _c.bubble.showBubble();
+    }
+    const bubbleRect = (_d = this.mdeditor) == null ? void 0 : _d.bubble.bubbleDom.getBoundingClientRect();
     return {
       // 编辑器的左侧距离 + 10px
       left: editorRect.left + 10,
@@ -322,8 +336,9 @@ class MarkDownEditorController extends EditorController {
       top: bubbleRect.top,
       // 编辑器的宽度 - 右侧工具栏的宽度(38px) - 左侧边距（10px）- 右侧边距（10px）
       width: editorRect.width - 58,
-      editorElement: (_c = this.mdeditor) == null ? void 0 : _c.wrapperDom,
-      editorTheme: this.getCurrentTheme()
+      editorElement: (_e = this.mdeditor) == null ? void 0 : _e.wrapperDom,
+      editorTheme: this.getCurrentTheme(),
+      height: this.inlineAiChatHeight
     };
   }
   /**
@@ -346,6 +361,7 @@ class MarkDownEditorController extends EditorController {
    */
   async doInLineAIUIAction(uiActionId, appId) {
     const eventArgs = this.ctrl.getEventArgs();
+    eventArgs.params = clone(eventArgs.params);
     eventArgs.params.editor = this;
     if (this.editorParams.srfaiappendcurdata && this.editorParams.srfaiappendcurdata === "true") {
       eventArgs.context.srfaiappendcurdata = true;

package/es/util/ai-util/ai-util.mjs

@@ -1,3 +1,5 @@
+import { UtilService } from '@ibiz-template/runtime';
+
 "use strict";
 function calcAiToolbarItemsByAc(deACMode) {
   var _a, _b;
@@ -48,5 +50,19 @@ function calcAiToolbarItemsByAc(deACMode) {
     inlineToolbarItems
   };
 }
+const getAIAgentList = async (context, params) => {
+  const emptyList = [];
+  const app = ibiz.hub.getApp(ibiz.env.appId);
+  const aiAgentUtil = app.getAppUtil("DYNAMICAIGENT", "CUSTOM");
+  if (!aiAgentUtil) {
+    return emptyList;
+  }
+  const utilService = new UtilService(aiAgentUtil);
+  const data = await utilService.load("", context, params);
+  if (!data || data.length === 0) {
+    return emptyList;
+  }
+  return data;
+};
 
-export { calcAiToolbarItemsByAc };
+export { calcAiToolbarItemsByAc, getAIAgentList };

package/es/util/app-util/app-util.mjs

@@ -2,7 +2,7 @@ import { getDeACMode, calcDeCodeNameById, UIActionUtil, SysUIActionTag, ConfigSe
 import { createUUID } from 'qx-util';
 import { StringUtil, IBizContext } from '@ibiz-template/core';
 import { route2routePath, useUIStore, routePath2string } from '@ibiz-template/vue3-util';
-import { calcAiToolbarItemsByAc } from '../ai-util/ai-util.mjs';
+import { getAIAgentList, calcAiToolbarItemsByAc } from '../ai-util/ai-util.mjs';
 
 "use strict";
 var __defProp = Object.defineProperty;
@@ -237,6 +237,7 @@ class AppUtil {
       appDEACModeId,
       appDataEntityId
     } = chartParams;
+    const aiAgentlist = await getAIAgentList(context, params);
     const exParams = this.computeAiExParams(context, params, data);
     const deACMode = await getDeACMode(
       appDEACModeId,
@@ -309,11 +310,19 @@ class AppUtil {
           footerToolbarItems,
           questionToolbarItems,
           otherToolbarItems,
-          question: async (aiChat, ctx, param, other, arr, sessionid) => {
+          aiAgentlist,
+          question: async (aiChat, ctx, param, other, arr, sessionid, srfaiagent) => {
             id = createUUID();
             abortController = new AbortController();
             const deService = await ibiz.hub.getApp(ctx.srfappid).deService.getService(ctx, other.appDataEntityId);
             try {
+              const questionRequestData = {
+                messages: arr,
+                sessionid
+              };
+              if (srfaiagent) {
+                questionRequestData.srfaiagent = srfaiagent;
+              }
               await deService.aiChatSse(
                 (msg) => {
                   if (msg.actionstate === 20 && msg.actionresult) {
@@ -349,10 +358,7 @@ class AppUtil {
                 abortController,
                 ctx,
                 param,
-                {
-                  messages: arr,
-                  sessionid
-                }
+                { ...questionRequestData }
               );
             } catch (error) {
               aiChat.replaceMessage({
@@ -384,11 +390,21 @@ class AppUtil {
           },
           history: async (ctx, param, other) => {
             const deService = await ibiz.hub.getApp(ctx.srfappid).deService.getService(ctx, other.appDataEntityId);
-            const historyData = other.appendCurData ? other.appendCurData : {};
+            const historyRequestData = {};
+            if (other.appendCurData) {
+              Object.assign(historyRequestData, {
+                ...other.appendCurData
+              });
+            }
+            if (other.srfaiagent) {
+              Object.assign(historyRequestData, {
+                srfaiagent: other.srfaiagent
+              });
+            }
             const result = await deService.aiChatHistory(
               ctx,
               param,
-              historyData
+              historyRequestData
             );
             if (result.data && Array.isArray(result.data)) {
               let preMsg;

package/es/util/inline-ai-util/inline-ai-textarea/inline-ai-textarea.hook.mjs

@@ -1,3 +1,5 @@
+import qs from 'qs';
+import { notNilEmpty } from 'qx-util';
 import { onMounted, onUnmounted, ref } from 'vue';
 import { calcResPath } from '@ibiz-template/runtime';
 import { RegenerateIcon, insertTextIcon, ReplaceTextIcon, CopyTextIcon, CancelIcon } from './icon.mjs';
@@ -15,7 +17,11 @@ const computedInLineAIParams = (props) => {
 const useInLineAIContainerClick = (props, content, isLoading) => {
   const handclick = async (evt) => {
     const target = evt.target;
-    if (!target.closest(".ibiz-inline-ai-textarea-container") && !target.closest(".ibiz-inline-ai-alert") && !isLoading.value) {
+    if (!target.closest(".ibiz-inline-ai-textarea-container") && !target.closest(".ibiz-inline-ai-alert")) {
+      if (isLoading.value) {
+        evt.stopPropagation();
+        return;
+      }
       const isChange = props.content !== content.value;
       let isClose = true;
       if (isChange) {
@@ -70,6 +76,27 @@ const useAI = (props, opts) => {
       );
     }
   };
+  const abortController = ref();
+  const attachUrlParam = (url) => {
+    {
+      const urlSplit = url.split("?");
+      urlSplit[0] = urlSplit[0].split("/").map((item) => encodeURIComponent(item)).join("/");
+      url = urlSplit.length > 1 ? urlSplit.join("?") : urlSplit[0];
+    }
+    const strParams = qs.stringify(params);
+    if (notNilEmpty(strParams)) {
+      if (url.endsWith("?")) {
+        url = "".concat(url).concat(strParams);
+      } else if (url.indexOf("?") !== -1 && url.endsWith("&")) {
+        url = "".concat(url).concat(strParams);
+      } else if (url.indexOf("?") !== -1 && !url.endsWith("&")) {
+        url = "".concat(url, "&").concat(strParams);
+      } else {
+        url = "".concat(url, "?").concat(strParams);
+      }
+    }
+    return url;
+  };
   const askAI = async (content) => {
     var _a, _b;
     const body = {
@@ -85,12 +112,17 @@ const useAI = (props, opts) => {
       Object.assign(body, { mode: srfmode });
     if (srfaiagent)
       Object.assign(body, { srfaiagent });
+    abortController.value = new AbortController();
     const appDataEntity = await ibiz.hub.getAppDataEntity(
       deACMode.appDataEntityId,
       deACMode.appId
     );
-    const path = calcAIPath(appDataEntity);
-    const response = await app.net.post(path, body, params);
+    const path = attachUrlParam(calcAIPath(appDataEntity));
+    const response = await app.net.request(path, {
+      method: "post",
+      data: body,
+      signal: abortController.value.signal
+    });
     if (response.ok) {
       const result = (_b = (_a = response.data.choices) == null ? void 0 : _a[0]) == null ? void 0 : _b.content;
       return result;
@@ -101,7 +133,8 @@ const useAI = (props, opts) => {
     loadAiHistory();
   });
   return {
-    askAI
+    askAI,
+    abortController
   };
 };
 const useBase = (props, container, target) => {
@@ -152,7 +185,7 @@ const useBase = (props, container, target) => {
     top: "".concat(options.top, "px")
   });
   const contentStyle = ref({
-    height: "".concat(options.height || 80, "px"),
+    height: "".concat(options.height || 300, "px"),
     "max-height": "".concat(options.maxHeight, "px")
   });
   const updatePosition = () => {

package/es/util/inline-ai-util/inline-ai-textarea/inline-ai-textarea.mjs

@@ -1,6 +1,6 @@
 import { defineComponent, createVNode, withDirectives, vModelText, ref, computed, onMounted } from 'vue';
 import { useNamespace } from '@ibiz-template/vue3-util';
-import { computedInLineAIParams, useBase, useInLineAIContainerClick, useAI } from './inline-ai-textarea.hook.mjs';
+import { computedInLineAIParams, useBase, useAI, useInLineAIContainerClick } from './inline-ai-textarea.hook.mjs';
 import { AIIcon, StopIcon, SendIcon } from './icon.mjs';
 import './inline-ai-textarea.css';
 
@@ -76,30 +76,38 @@ const InlineAITextArea = /* @__PURE__ */ defineComponent({
       containerStyle,
       contentStyle
     } = useBase(props, containerRef, actionsRef);
-    useInLineAIContainerClick(props, textareaContent, isLoading);
     const {
-      askAI
+      askAI,
+      abortController
     } = useAI(props, {
       srfaiappendcurdata,
       srfmode,
       srfaiagent
     });
+    const stopQuestionAndClose = () => {
+      var _a;
+      (_a = abortController.value) == null ? void 0 : _a.abort();
+      props.unMountAIChat();
+    };
+    useInLineAIContainerClick(props, textareaContent, isLoading);
     const restoreFocus = () => {
       var _a;
       (_a = textareaRef.value) == null ? void 0 : _a.blur();
       props.restoreSelection();
     };
     const sendQuestion = async (content) => {
-      restoreFocus();
-      question = content;
-      textareaContent.value = "";
-      isLoading.value = true;
-      textareaContent.value = await askAI(question);
-      isLoading.value = false;
-      contentType.value = "ASSISTANT";
-    };
-    const stopQuestion = () => {
-      props.unMountAIChat();
+      try {
+        isLoading.value = true;
+        restoreFocus();
+        question = content;
+        textareaContent.value = "";
+        textareaContent.value = await askAI(question);
+        contentType.value = "ASSISTANT";
+      } catch (error) {
+        ibiz.log.error(error);
+      } finally {
+        isLoading.value = false;
+      }
     };
     const onKeydown = (e) => {
       if (e.code === "Enter" && !e.isComposing) {
@@ -159,8 +167,8 @@ const InlineAITextArea = /* @__PURE__ */ defineComponent({
       textareaContent,
       onKeydown,
       sendQuestion,
-      stopQuestion,
-      handleAction
+      handleAction,
+      stopQuestionAndClose
     };
   },
   render() {
@@ -194,7 +202,7 @@ const InlineAITextArea = /* @__PURE__ */ defineComponent({
       "class": this.ns.em("content", "suffix")
     }, [this.isLoading && createVNode("div", {
       "class": this.ns.em("content", "stop-icon"),
-      "onClick": () => this.stopQuestion()
+      "onClick": () => this.stopQuestionAndClose()
     }, [StopIcon, createVNode("span", null, [ibiz.i18n.t("util.inlineAiUtil.stopEdit")])]), !this.disabled && createVNode("div", {
       "class": this.ns.em("content", "sand-icon"),
       "onClick": () => this.sendQuestion(this.textareaContent)

package/es/util/inline-ai-util/inline-ai-util.mjs

@@ -81,12 +81,13 @@ class InLineAIUtil {
    * @param y 距离上方距离
    * @param menus 菜单集合
    */
-  showContextMenus(x, y, menus) {
+  showContextMenus(x, y, menus, options = {}) {
     ContextMenu.showContextMenu({
       x,
       y,
       customClass: this.ns.b("context-menu"),
-      items: menus
+      items: menus,
+      ...options
     });
   }
   /**