@tmagic/editor 1.3.0-alpha.7 → 1.3.0-alpha.8

package/dist/style.css

@@ -943,6 +943,20 @@
   justify-content: flex-end;
   margin-top: 15px;
 }
+.tmagic-data-source-input-text .el-input__wrapper.tmagic-data-source-input-text-wrapper {
+  overflow: hidden;
+  padding-right: 30px;
+}
+.tmagic-data-source-input-text .el-input__inner {
+  display: flex;
+  align-items: center;
+  overflow: hidden;
+  white-space: nowrap;
+}
+.tmagic-data-source-input-text .tmagic-data-source-input-icon {
+  position: absolute;
+  right: 7px;
+}
 .m-fields-key-value-item {
   display: flex;
   margin-bottom: 10px;

package/dist/tmagic-editor.js

@@ -563,7 +563,7 @@ const _sfc_main$y = /* @__PURE__ */ defineComponent({
     const dataSources = computed(() => dataSourceService?.get("dataSources") || []);
     const setDisplayState = () => {
       displayState.value = [];
-      const matches = state.value.matchAll(/\{\{([\s\S]+?)\}\}/g);
+      const matches = state.value.matchAll(/\$\{([\s\S]+?)\}/g);
       let index = 0;
       for (const match of matches) {
         if (typeof match.index === "undefined")
@@ -636,13 +636,13 @@ const _sfc_main$y = /* @__PURE__ */ defineComponent({
       }
       return selectionStart;
     };
-    const curCharIsLeftCurlyBracket = (leftCurlyBracketIndex) => leftCurlyBracketIndex > -1 && leftCurlyBracketIndex === getSelectionStart() - 1;
+    const curCharIsLeftCurlyBracket = (leftCurlyBracketIndex) => leftCurlyBracketIndex > 0 && leftCurlyBracketIndex === getSelectionStart() - 1;
     const curCharIsDot = (dotIndex) => dotIndex > -1 && dotIndex === getSelectionStart() - 1;
     const dsQuerySearch = (queryString, leftCurlyBracketIndex, cb) => {
       let result = [];
       if (curCharIsLeftCurlyBracket(leftCurlyBracketIndex)) {
         result = dataSources.value;
-      } else if (leftCurlyBracketIndex > -1) {
+      } else if (leftCurlyBracketIndex > 0) {
         const queryName = queryString.substring(leftCurlyBracketIndex + 1).toLowerCase();
         result = dataSources.value.filter((ds) => ds.title?.toLowerCase().includes(queryName) || ds.id.includes(queryName));
       }
@@ -694,7 +694,7 @@ const _sfc_main$y = /* @__PURE__ */ defineComponent({
       const selectionStart = getSelectionStart();
       const curQueryString = queryString.substring(0, selectionStart);
       const fieldKeyStringLastIndex = curQueryString.lastIndexOf(".");
-      const dsKeyStringLastIndex = curQueryString.lastIndexOf("{");
+      const dsKeyStringLastIndex = curQueryString.lastIndexOf("${") + 1;
       const isFieldTip = fieldKeyStringLastIndex > dsKeyStringLastIndex;
       if (isFieldTip) {
         fieldQuerySearch(curQueryString, dsKeyStringLastIndex, fieldKeyStringLastIndex, cb);
@@ -707,7 +707,7 @@ const _sfc_main$y = /* @__PURE__ */ defineComponent({
       const selectionStart = input.value?.selectionStart || 0;
       let startText = inputText.substring(0, selectionStart);
       const dotIndex = startText.lastIndexOf(".");
-      const leftCurlyBracketIndex = startText.lastIndexOf("{");
+      const leftCurlyBracketIndex = startText.lastIndexOf("${") + 1;
       const endText = inputText.substring(selectionStart);
       let suggestText = value;
       if (isDataSource) {
@@ -717,7 +717,6 @@ const _sfc_main$y = /* @__PURE__ */ defineComponent({
         if (!isRightCurlyBracket(selectionStart + 1)) {
           suggestText = `${suggestText}}`;
         }
-        suggestText = `{${suggestText}}`;
       } else if (!curCharIsDot(dotIndex)) {
         startText = startText.substring(0, dotIndex + 1);
       }
@@ -725,7 +724,7 @@ const _sfc_main$y = /* @__PURE__ */ defineComponent({
       await nextTick();
       let newSelectionStart = 0;
       if (isDataSource) {
-        newSelectionStart = leftCurlyBracketIndex + suggestText.length - 1;
+        newSelectionStart = leftCurlyBracketIndex + suggestText.length;
       } else {
         newSelectionStart = dotIndex + suggestText.length + 1;
       }
@@ -768,11 +767,11 @@ const _sfc_main$y = /* @__PURE__ */ defineComponent({
         _: 1
       }, 16, ["modelValue"])) : (openBlock(), createElementBlock("div", {
         key: 1,
-        class: normalizeClass(`el-input el-input--${_ctx.size}`),
+        class: normalizeClass(`tmagic-data-source-input-text el-input el-input--${_ctx.size}`),
         onMouseup: mouseupHandler
       }, [
         createElementVNode("div", {
-          class: normalizeClass(`el-input__wrapper ${isFocused.value ? " is-focus" : ""}`)
+          class: normalizeClass(`tmagic-data-source-input-text-wrapper el-input__wrapper ${isFocused.value ? " is-focus" : ""}`)
         }, [
           createElementVNode("div", _hoisted_3$5, [
             (openBlock(true), createElementBlock(Fragment, null, renderList(displayState.value, (item, index) => {
@@ -791,7 +790,11 @@ const _sfc_main$y = /* @__PURE__ */ defineComponent({
                   _: 2
                 }, 1032, ["size"])) : createCommentVNode("", true)
               ], 64);
-            }), 256))
+            }), 256)),
+            createVNode(_sfc_main$B, {
+              class: "tmagic-data-source-input-icon",
+              icon: unref(Coin)
+            }, null, 8, ["icon"])
           ])
         ], 2)
       ], 34));
@@ -1501,7 +1504,7 @@ const _sfc_main$s = /* @__PURE__ */ defineComponent({
         ref: el,
         class: "m-editor-layout"
       }, [
-        hasLeft.value ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
+        hasLeft.value && _ctx.$slots.left ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
           createElementVNode("div", {
             class: normalizeClass(["m-editor-layout-left", _ctx.leftClass]),
             style: normalizeStyle(`width: ${_ctx.left}px`)
@@ -1516,7 +1519,7 @@ const _sfc_main$s = /* @__PURE__ */ defineComponent({
         }, [
           renderSlot(_ctx.$slots, "center")
         ], 6),
-        hasRight.value ? (openBlock(), createElementBlock(Fragment, { key: 1 }, [
+        hasRight.value && _ctx.$slots.right ? (openBlock(), createElementBlock(Fragment, { key: 1 }, [
           createVNode(_sfc_main$t, { onChange: changeRight }),
           createElementVNode("div", {
             class: normalizeClass(["m-editor-layout-right", _ctx.rightClass]),
@@ -1610,6 +1613,40 @@ const fillConfig$1 = (config = []) => [
                   }
                 ]
               },
+              {
+                type: "fieldset",
+                legend: "边框",
+                items: [
+                  {
+                    name: "borderWidth",
+                    text: "宽度",
+                    defaultValue: "0"
+                  },
+                  {
+                    name: "borderColor",
+                    text: "颜色",
+                    type: "colorPicker"
+                  },
+                  {
+                    name: "borderStyle",
+                    text: "样式",
+                    type: "select",
+                    defaultValue: "none",
+                    options: [
+                      { text: "none", value: "none" },
+                      { text: "hidden", value: "hidden" },
+                      { text: "dotted", value: "dotted" },
+                      { text: "dashed", value: "dashed" },
+                      { text: "solid", value: "solid" },
+                      { text: "double", value: "double" },
+                      { text: "groove", value: "groove" },
+                      { text: "ridge", value: "ridge" },
+                      { text: "inset", value: "inset" },
+                      { text: "outset", value: "outset" }
+                    ]
+                  }
+                ]
+              },
               {
                 type: "fieldset",
                 legend: "背景",
@@ -3460,7 +3497,6 @@ const _sfc_main$q = /* @__PURE__ */ defineComponent({
     const codeOptions = inject("codeOptions", {});
     const { editorService, uiService } = inject("services") || {};
     const root = computed(() => editorService?.get("root"));
-    const nodes = computed(() => editorService?.get("nodes") || []);
     const pageLength = computed(() => editorService?.get("pageLength") || 0);
     const showSrc = computed(() => uiService?.get("showSrc"));
     const leftColumnWidthCacheData = Number(globalThis.localStorage.getItem(LEFT_COLUMN_WIDTH_STORAGE_KEY));
@@ -3553,7 +3589,7 @@ const _sfc_main$q = /* @__PURE__ */ defineComponent({
           ]),
           _: 2
         }, [
-          pageLength.value > 0 && nodes.value.length === 1 ? {
+          pageLength.value > 0 ? {
             name: "right",
             fn: withCtx(() => [
               createVNode(unref(TMagicScrollbar), null, {
@@ -3912,7 +3948,10 @@ const _sfc_main$o = /* @__PURE__ */ defineComponent({
   }
 });
 
-const _hoisted_1$e = { class: "m-editor-props-panel" };
+const _hoisted_1$e = {
+  key: 0,
+  class: "m-editor-props-panel"
+};
 const _sfc_main$n = /* @__PURE__ */ defineComponent({
   ...{
     name: "MEditorPropsPanel"
@@ -3926,6 +3965,7 @@ const _sfc_main$n = /* @__PURE__ */ defineComponent({
     const curFormConfig = ref([]);
     const services = inject("services");
     const node = computed(() => services?.editorService.get("node"));
+    const nodes = computed(() => services?.editorService.get("nodes") || []);
     const propsPanelSize = computed(() => services?.uiService.get("propsPanelSize") || "small");
     const stage = computed(() => services?.editorService.get("stage"));
     const init = async () => {
@@ -3962,7 +4002,7 @@ const _sfc_main$n = /* @__PURE__ */ defineComponent({
     };
     __expose({ submit });
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1$e, [
+      return nodes.value.length === 1 ? (openBlock(), createElementBlock("div", _hoisted_1$e, [
         renderSlot(_ctx.$slots, "props-panel-header"),
         createVNode(unref(MForm), {
           ref_key: "configForm",
@@ -3974,7 +4014,7 @@ const _sfc_main$n = /* @__PURE__ */ defineComponent({
           config: curFormConfig.value,
           onChange: submit
         }, null, 8, ["class", "popper-class", "size", "init-values", "config"])
-      ]);
+      ])) : createCommentVNode("", true);
     };
   }
 });
@@ -5219,6 +5259,7 @@ const _sfc_main$b = /* @__PURE__ */ defineComponent({
     const services = inject("services");
     const menu = ref();
     const node = computed(() => services?.editorService.get("node"));
+    const nodes = computed(() => services?.editorService.get("nodes"));
     const isRoot = computed(() => node.value?.type === NodeType.ROOT);
     const isPage = computed(() => node.value?.type === NodeType.PAGE);
     const componentList = computed(() => services?.componentListService.getList() || []);
@@ -5270,7 +5311,7 @@ const _sfc_main$b = /* @__PURE__ */ defineComponent({
         type: "button",
         text: "新增",
         icon: markRaw(Plus),
-        display: () => node.value?.items,
+        display: () => node.value?.items && nodes.value?.length === 1,
         items: getSubMenuData.value
       },
       {
@@ -5279,7 +5320,7 @@ const _sfc_main$b = /* @__PURE__ */ defineComponent({
         icon: markRaw(CopyDocument),
         display: () => !isRoot.value,
         handler: () => {
-          node.value && services?.editorService.copy(node.value);
+          node.value && services?.editorService.copy(nodes.value || []);
         }
       },
       {
@@ -5288,7 +5329,7 @@ const _sfc_main$b = /* @__PURE__ */ defineComponent({
         icon: markRaw(Delete),
         display: () => !isRoot.value && !isPage.value,
         handler: () => {
-          node.value && services?.editorService.remove(node.value);
+          node.value && services?.editorService.remove(nodes.value || []);
         }
       },
       ...props.layerContentMenu
@@ -5541,7 +5582,9 @@ const _sfc_main$a = /* @__PURE__ */ defineComponent({
     };
     const contextmenu = async (event, data) => {
       event.preventDefault();
-      await select(data);
+      if (nodes.value.length < 2) {
+        await select(data);
+      }
       menu.value?.show(event);
     };
     return (_ctx, _cache) => {
@@ -8277,5 +8320,5 @@ const index = {
   }
 };
 
-export { CODE_DRAFT_STORAGE_KEY, COPY_STORAGE_KEY, _sfc_main$g as CodeBlockList, CodeDeleteErrorType, _sfc_main$C as CodeSelect, _sfc_main$A as CodeSelectCol, ColumnLayout, _sfc_main$d as ComponentListPanel, _sfc_main$c as ContentMenu, _sfc_main$z as DataSourceFields, _sfc_main$y as DataSourceInput, _sfc_main$x as EventSelect, Fixed2Other, H_GUIDE_LINE_STORAGE_KEY, _sfc_main$B as Icon, KeyBindingCommand, _sfc_main$w as KeyValue, Keys, LayerOffset, _sfc_main$a as LayerPanel, Layout, _sfc_main$s as LayoutContainer, _sfc_main$n as PropsPanel, _sfc_main$s as SplitView, _sfc_main$u as TMagicCodeEditor, Editor as TMagicEditor, _sfc_main$p as ToolButton, V_GUIDE_LINE_STORAGE_KEY, beforePaste, change2Fixed, codeBlockService, dataSourceService, debug, index as default, depService, editorService, error, eventsService, fillConfig$1 as fillConfig, fixNodeLeft, fixNodePosition, generatePageName, generatePageNameByApp, getAddParent, getConfig, getDefaultConfig, getGuideLineFromCache, getInitPositionStyle, getNodeIndex, getPageList, getPageNameList, getPositionInContainer, getRelativeStyle, historyService, info, isFixed, log, propsService, serializeConfig, setConfig, setLayout, storageService, uiService, useStage, warn };
+export { CODE_DRAFT_STORAGE_KEY, COPY_STORAGE_KEY, _sfc_main$g as CodeBlockList, CodeDeleteErrorType, _sfc_main$C as CodeSelect, _sfc_main$A as CodeSelectCol, ColumnLayout, _sfc_main$d as ComponentListPanel, _sfc_main$c as ContentMenu, _sfc_main$z as DataSourceFields, _sfc_main$y as DataSourceInput, _sfc_main$x as EventSelect, Fixed2Other, H_GUIDE_LINE_STORAGE_KEY, _sfc_main$B as Icon, KeyBindingCommand, _sfc_main$w as KeyValue, Keys, LayerOffset, _sfc_main$a as LayerPanel, Layout, _sfc_main$s as LayoutContainer, _sfc_main$n as PropsPanel, _sfc_main$t as Resizer, _sfc_main$s as SplitView, _sfc_main$u as TMagicCodeEditor, Editor as TMagicEditor, _sfc_main$p as ToolButton, V_GUIDE_LINE_STORAGE_KEY, beforePaste, change2Fixed, codeBlockService, dataSourceService, debug, index as default, depService, editorService, error, eventsService, fillConfig$1 as fillConfig, fixNodeLeft, fixNodePosition, generatePageName, generatePageNameByApp, getAddParent, getConfig, getDefaultConfig, getGuideLineFromCache, getInitPositionStyle, getNodeIndex, getPageList, getPageNameList, getPositionInContainer, getRelativeStyle, historyService, info, isFixed, log, propsService, serializeConfig, setConfig, setLayout, storageService, uiService, useStage, warn };
 //# sourceMappingURL=tmagic-editor.js.map