@tmagic/editor 1.3.0-beta.6 → 1.3.0-beta.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (42) hide show
  1. package/dist/style.css +57 -56
  2. package/dist/tmagic-editor.js +549 -436
  3. package/dist/tmagic-editor.js.map +1 -1
  4. package/dist/tmagic-editor.umd.cjs +567 -454
  5. package/dist/tmagic-editor.umd.cjs.map +1 -1
  6. package/package.json +10 -10
  7. package/src/Editor.vue +8 -0
  8. package/src/components/ContentMenu.vue +2 -6
  9. package/src/components/SplitView.vue +22 -6
  10. package/src/components/Tree.vue +66 -0
  11. package/src/components/TreeNode.vue +142 -0
  12. package/src/layouts/Framework.vue +11 -21
  13. package/src/layouts/sidebar/Sidebar.vue +13 -0
  14. package/src/layouts/sidebar/data-source/DataSourceList.vue +28 -17
  15. package/src/layouts/sidebar/data-source/DataSourceListPanel.vue +8 -2
  16. package/src/layouts/sidebar/layer/LayerPanel.vue +40 -31
  17. package/src/layouts/sidebar/layer/use-click.ts +105 -0
  18. package/src/layouts/sidebar/layer/use-drag.ts +1 -1
  19. package/src/layouts/sidebar/layer/use-filter.ts +1 -12
  20. package/src/layouts/sidebar/layer/use-keybinding.ts +6 -2
  21. package/src/layouts/sidebar/layer/use-node-status.ts +4 -2
  22. package/src/layouts/workspace/viewer/NodeListMenu.vue +11 -2
  23. package/src/services/dep.ts +1 -1
  24. package/src/theme/layer-panel.scss +2 -74
  25. package/src/theme/theme.scss +1 -0
  26. package/src/theme/tree.scss +72 -0
  27. package/src/type.ts +16 -1
  28. package/src/utils/dep.ts +7 -2
  29. package/src/utils/tree.ts +15 -0
  30. package/types/components/ContentMenu.vue.d.ts +4 -1
  31. package/types/components/SplitView.vue.d.ts +3 -1
  32. package/types/{layouts/sidebar/layer/LayerNode.vue.d.ts → components/Tree.vue.d.ts} +19 -17
  33. package/types/components/TreeNode.vue.d.ts +47 -0
  34. package/types/layouts/sidebar/data-source/DataSourceList.vue.d.ts +2 -6
  35. package/types/layouts/sidebar/data-source/DataSourceListPanel.vue.d.ts +7 -1
  36. package/types/layouts/sidebar/layer/LayerPanel.vue.d.ts +1 -1
  37. package/types/layouts/sidebar/layer/use-click.d.ts +106 -0
  38. package/types/layouts/sidebar/layer/use-filter.d.ts +0 -1
  39. package/types/layouts/sidebar/layer/use-keybinding.d.ts +2 -1
  40. package/types/type.d.ts +20 -1
  41. package/types/utils/tree.d.ts +3 -0
  42. package/src/layouts/sidebar/layer/LayerNode.vue +0 -208
@@ -1,5 +1,5 @@
1
- import { defineComponent, ref, watch, onMounted, onUnmounted, openBlock, createElementBlock, createBlock, Teleport, createElementVNode, normalizeClass, normalizeStyle, createVNode, unref, computed, reactive, resolveComponent, inject, withCtx, Fragment, createTextVNode, createCommentVNode, toRaw, resolveDynamicComponent, nextTick, mergeProps, toDisplayString, renderList, watchEffect, withModifiers, renderSlot, createSlots, normalizeProps, markRaw, getCurrentInstance, withDirectives, vShow, createStaticVNode, Transition, provide, toHandlers, mergeDefaults } from 'vue';
2
- import { FullScreen, Edit, View, Coin, Delete, Plus, Close, ArrowDown, Grid, Memo, ScaleToOriginal, ZoomOut, ZoomIn, Right, Back, Search, Aim, CopyDocument, DocumentCopy, Files, Hide, ArrowRight, Goods, List, EditPen, Top, Bottom, ArrowLeftBold, ArrowRightBold, CaretBottom } from '@element-plus/icons-vue';
1
+ import { defineComponent, ref, watch, onMounted, onUnmounted, openBlock, createElementBlock, createBlock, Teleport, createElementVNode, normalizeClass, normalizeStyle, createVNode, unref, computed, reactive, resolveComponent, inject, withCtx, Fragment, createTextVNode, createCommentVNode, toRaw, resolveDynamicComponent, nextTick, mergeProps, toDisplayString, renderList, watchEffect, withModifiers, renderSlot, createSlots, normalizeProps, markRaw, getCurrentInstance, withDirectives, vShow, createStaticVNode, provide, Transition, toHandlers, mergeDefaults } from 'vue';
2
+ import { FullScreen, Edit, View, Coin, Delete, Plus, Close, ArrowDown, Grid, Memo, ScaleToOriginal, ZoomOut, ZoomIn, Right, Back, Search, Aim, ArrowRight, CopyDocument, DocumentCopy, Files, Hide, Goods, List, EditPen, Top, Bottom, ArrowLeftBold, ArrowRightBold, CaretBottom } from '@element-plus/icons-vue';
3
3
  import { throttle, isEmpty, cloneDeep, mergeWith, isObject, uniq, map, has, pick, keys } from 'lodash-es';
4
4
  import * as monaco from 'monaco-editor';
5
5
  import serialize from 'serialize-javascript';
@@ -7,7 +7,7 @@ import { TMagicButton, TMagicCard, tMagicMessage, TMagicDialog, TMagicTag, tMagi
7
7
  import { HookType, NodeType, ActionType } from '@tmagic/schema';
8
8
  import { MFormDrawer, MForm, createValues, MSelect } from '@tmagic/form';
9
9
  import { MagicTable } from '@tmagic/table';
10
- import { guid, isPop, getNodePath, isNumber, isPage, toLine, DATA_SOURCE_FIELDS_SELECT_VALUE_PREFIX, getDefaultValueFromFields, addClassName, removeClassName, getKeys, removeClassNameByClassName, getNodes, isObject as isObject$1 } from '@tmagic/utils';
10
+ import { guid, isPop, getNodePath, isNumber, isPage, toLine, DATA_SOURCE_FIELDS_SELECT_VALUE_PREFIX, getDefaultValueFromFields, getKeys, addClassName, removeClassName, removeClassNameByClassName, getNodes, isObject as isObject$1 } from '@tmagic/utils';
11
11
  import Gesto from 'gesto';
12
12
  import StageCore, { GuidesType, StageDragStatus, getOffset, calcValueByFontsize, CONTAINER_HIGHLIGHT_CLASS_NAME, ContainerHighlightType } from '@tmagic/stage';
13
13
  import { EventEmitter } from 'events';
@@ -20,10 +20,10 @@ const setConfig = (option) => {
20
20
  };
21
21
  const getConfig = (key) => $TMAGIC_EDITOR[key];
22
22
 
23
- const _hoisted_1$w = {
23
+ const _hoisted_1$x = {
24
24
  class: /* @__PURE__ */ normalizeClass(`magic-code-editor`)
25
25
  };
26
- const _sfc_main$S = /* @__PURE__ */ defineComponent({
26
+ const _sfc_main$T = /* @__PURE__ */ defineComponent({
27
27
  ...{
28
28
  name: "MEditorCodeEditor"
29
29
  },
@@ -180,7 +180,7 @@ const _sfc_main$S = /* @__PURE__ */ defineComponent({
180
180
  }
181
181
  });
182
182
  return (_ctx, _cache) => {
183
- return openBlock(), createElementBlock("div", _hoisted_1$w, [
183
+ return openBlock(), createElementBlock("div", _hoisted_1$x, [
184
184
  (openBlock(), createBlock(Teleport, {
185
185
  to: "body",
186
186
  disabled: !fullScreen.value
@@ -208,7 +208,7 @@ const _sfc_main$S = /* @__PURE__ */ defineComponent({
208
208
  }
209
209
  });
210
210
 
211
- const _sfc_main$R = /* @__PURE__ */ defineComponent({
211
+ const _sfc_main$S = /* @__PURE__ */ defineComponent({
212
212
  ...{
213
213
  name: "MEditorCode"
214
214
  },
@@ -232,7 +232,7 @@ const _sfc_main$R = /* @__PURE__ */ defineComponent({
232
232
  emit("change", v);
233
233
  };
234
234
  return (_ctx, _cache) => {
235
- return openBlock(), createBlock(_sfc_main$S, {
235
+ return openBlock(), createBlock(_sfc_main$T, {
236
236
  height: _ctx.config.height,
237
237
  "init-values": _ctx.model[_ctx.name],
238
238
  language: _ctx.config.language,
@@ -247,7 +247,7 @@ const _sfc_main$R = /* @__PURE__ */ defineComponent({
247
247
  }
248
248
  });
249
249
 
250
- const _sfc_main$Q = /* @__PURE__ */ defineComponent({
250
+ const _sfc_main$R = /* @__PURE__ */ defineComponent({
251
251
  ...{
252
252
  name: "MEditorCodeLink"
253
253
  },
@@ -326,7 +326,7 @@ const _sfc_main$Q = /* @__PURE__ */ defineComponent({
326
326
  }
327
327
  });
328
328
 
329
- const _sfc_main$P = /* @__PURE__ */ defineComponent({
329
+ const _sfc_main$Q = /* @__PURE__ */ defineComponent({
330
330
  ...{
331
331
  name: "MEditorCodeSelect"
332
332
  },
@@ -398,11 +398,11 @@ const _sfc_main$P = /* @__PURE__ */ defineComponent({
398
398
  }
399
399
  });
400
400
 
401
- const _hoisted_1$v = { style: { "display": "flex", "margin-bottom": "10px" } };
401
+ const _hoisted_1$w = { style: { "display": "flex", "margin-bottom": "10px" } };
402
402
  const _hoisted_2$p = { style: { "flex": "1" } };
403
403
  const _hoisted_3$b = { style: { "flex": "1" } };
404
404
  const _hoisted_4$7 = { class: "dialog-footer" };
405
- const _sfc_main$O = /* @__PURE__ */ defineComponent({
405
+ const _sfc_main$P = /* @__PURE__ */ defineComponent({
406
406
  ...{
407
407
  name: "MEditorCodeBlockEditor"
408
408
  },
@@ -644,7 +644,7 @@ const _sfc_main$O = /* @__PURE__ */ defineComponent({
644
644
  ])
645
645
  ]),
646
646
  default: withCtx(() => [
647
- createElementVNode("div", _hoisted_1$v, [
647
+ createElementVNode("div", _hoisted_1$w, [
648
648
  createElementVNode("div", _hoisted_2$p, [
649
649
  createVNode(unref(TMagicTag), {
650
650
  size: "small",
@@ -668,7 +668,7 @@ const _sfc_main$O = /* @__PURE__ */ defineComponent({
668
668
  })
669
669
  ])
670
670
  ]),
671
- difVisible.value ? (openBlock(), createBlock(_sfc_main$S, {
671
+ difVisible.value ? (openBlock(), createBlock(_sfc_main$T, {
672
672
  key: 0,
673
673
  ref_key: "magicVsEditor",
674
674
  ref: magicVsEditor,
@@ -2955,7 +2955,7 @@ const getDefaultConfig = async (addNode, parentNode) => {
2955
2955
  return newNode;
2956
2956
  };
2957
2957
 
2958
- const _sfc_main$N = /* @__PURE__ */ defineComponent({
2958
+ const _sfc_main$O = /* @__PURE__ */ defineComponent({
2959
2959
  ...{
2960
2960
  name: "MEditorCodeParams"
2961
2961
  },
@@ -3004,8 +3004,8 @@ const _sfc_main$N = /* @__PURE__ */ defineComponent({
3004
3004
  }
3005
3005
  });
3006
3006
 
3007
- const _hoisted_1$u = ["src"];
3008
- const _sfc_main$M = /* @__PURE__ */ defineComponent({
3007
+ const _hoisted_1$v = ["src"];
3008
+ const _sfc_main$N = /* @__PURE__ */ defineComponent({
3009
3009
  ...{
3010
3010
  name: "MEditorIcon"
3011
3011
  },
@@ -3029,7 +3029,7 @@ const _sfc_main$M = /* @__PURE__ */ defineComponent({
3029
3029
  class: "magic-editor-icon"
3030
3030
  }, {
3031
3031
  default: withCtx(() => [
3032
- createElementVNode("img", { src: _ctx.icon }, null, 8, _hoisted_1$u)
3032
+ createElementVNode("img", { src: _ctx.icon }, null, 8, _hoisted_1$v)
3033
3033
  ]),
3034
3034
  _: 1
3035
3035
  })) : typeof _ctx.icon === "string" ? (openBlock(), createElementBlock("i", {
@@ -3106,9 +3106,9 @@ const useCodeBlockEdit = (codeBlockService) => {
3106
3106
  };
3107
3107
  };
3108
3108
 
3109
- const _hoisted_1$t = { class: "m-fields-code-select-col" };
3109
+ const _hoisted_1$u = { class: "m-fields-code-select-col" };
3110
3110
  const _hoisted_2$o = { class: "code-select-container" };
3111
- const _sfc_main$L = /* @__PURE__ */ defineComponent({
3111
+ const _sfc_main$M = /* @__PURE__ */ defineComponent({
3112
3112
  ...{
3113
3113
  name: "MEditorCodeSelectCol"
3114
3114
  },
@@ -3180,7 +3180,7 @@ const _sfc_main$L = /* @__PURE__ */ defineComponent({
3180
3180
  const { codeBlockEditor, codeConfig, editCode, submitCodeBlockHandler } = useCodeBlockEdit(services?.codeBlockService);
3181
3181
  return (_ctx, _cache) => {
3182
3182
  const _component_m_form_container = resolveComponent("m-form-container");
3183
- return openBlock(), createElementBlock("div", _hoisted_1$t, [
3183
+ return openBlock(), createElementBlock("div", _hoisted_1$u, [
3184
3184
  createElementVNode("div", _hoisted_2$o, [
3185
3185
  createVNode(_component_m_form_container, {
3186
3186
  class: "select",
@@ -3189,14 +3189,14 @@ const _sfc_main$L = /* @__PURE__ */ defineComponent({
3189
3189
  size: _ctx.size,
3190
3190
  onChange: onParamsChangeHandler
3191
3191
  }, null, 8, ["model", "size"]),
3192
- _ctx.model[_ctx.name] ? (openBlock(), createBlock(_sfc_main$M, {
3192
+ _ctx.model[_ctx.name] ? (openBlock(), createBlock(_sfc_main$N, {
3193
3193
  key: 0,
3194
3194
  class: "icon",
3195
3195
  icon: !_ctx.disabled ? unref(Edit) : unref(View),
3196
3196
  onClick: _cache[0] || (_cache[0] = ($event) => unref(editCode)(_ctx.model[_ctx.name]))
3197
3197
  }, null, 8, ["icon"])) : createCommentVNode("", true)
3198
3198
  ]),
3199
- paramsConfig.value.length ? (openBlock(), createBlock(_sfc_main$N, {
3199
+ paramsConfig.value.length ? (openBlock(), createBlock(_sfc_main$O, {
3200
3200
  key: 0,
3201
3201
  name: "params",
3202
3202
  model: _ctx.model,
@@ -3204,7 +3204,7 @@ const _sfc_main$L = /* @__PURE__ */ defineComponent({
3204
3204
  "params-config": paramsConfig.value,
3205
3205
  onChange: onParamsChangeHandler
3206
3206
  }, null, 8, ["model", "size", "params-config"])) : createCommentVNode("", true),
3207
- unref(codeConfig) ? (openBlock(), createBlock(_sfc_main$O, {
3207
+ unref(codeConfig) ? (openBlock(), createBlock(_sfc_main$P, {
3208
3208
  key: 1,
3209
3209
  ref_key: "codeBlockEditor",
3210
3210
  ref: codeBlockEditor,
@@ -3217,9 +3217,9 @@ const _sfc_main$L = /* @__PURE__ */ defineComponent({
3217
3217
  }
3218
3218
  });
3219
3219
 
3220
- const _hoisted_1$s = { class: "m-editor-data-source-fields" };
3220
+ const _hoisted_1$t = { class: "m-editor-data-source-fields" };
3221
3221
  const _hoisted_2$n = { class: "m-editor-data-source-fields-footer" };
3222
- const _sfc_main$K = /* @__PURE__ */ defineComponent({
3222
+ const _sfc_main$L = /* @__PURE__ */ defineComponent({
3223
3223
  ...{
3224
3224
  name: "MEditorDataSourceFields"
3225
3225
  },
@@ -3450,7 +3450,7 @@ const _sfc_main$K = /* @__PURE__ */ defineComponent({
3450
3450
  }
3451
3451
  };
3452
3452
  return (_ctx, _cache) => {
3453
- return openBlock(), createElementBlock("div", _hoisted_1$s, [
3453
+ return openBlock(), createElementBlock("div", _hoisted_1$t, [
3454
3454
  createVNode(unref(MagicTable), {
3455
3455
  data: _ctx.model[_ctx.name],
3456
3456
  columns: fieldColumns
@@ -3507,7 +3507,7 @@ const _sfc_main$K = /* @__PURE__ */ defineComponent({
3507
3507
  }
3508
3508
  });
3509
3509
 
3510
- const _sfc_main$J = /* @__PURE__ */ defineComponent({
3510
+ const _sfc_main$K = /* @__PURE__ */ defineComponent({
3511
3511
  __name: "DataSourceFieldSelect",
3512
3512
  props: {
3513
3513
  config: {},
@@ -3561,10 +3561,10 @@ const _sfc_main$J = /* @__PURE__ */ defineComponent({
3561
3561
  }
3562
3562
  });
3563
3563
 
3564
- const _hoisted_1$r = { style: { "display": "flex", "flex-direction": "column", "line-height": "1.2em" } };
3564
+ const _hoisted_1$s = { style: { "display": "flex", "flex-direction": "column", "line-height": "1.2em" } };
3565
3565
  const _hoisted_2$m = { style: { "font-size": "10px", "color": "rgba(0, 0, 0, 0.6)" } };
3566
3566
  const _hoisted_3$a = { class: "el-input__inner" };
3567
- const _sfc_main$I = /* @__PURE__ */ defineComponent({
3567
+ const _sfc_main$J = /* @__PURE__ */ defineComponent({
3568
3568
  ...{
3569
3569
  name: "MEditorDataSourceInput"
3570
3570
  },
@@ -3753,10 +3753,10 @@ const _sfc_main$I = /* @__PURE__ */ defineComponent({
3753
3753
  }
3754
3754
  ), {
3755
3755
  suffix: withCtx(() => [
3756
- createVNode(_sfc_main$M, { icon: unref(Coin) }, null, 8, ["icon"])
3756
+ createVNode(_sfc_main$N, { icon: unref(Coin) }, null, 8, ["icon"])
3757
3757
  ]),
3758
3758
  default: withCtx(({ item }) => [
3759
- createElementVNode("div", _hoisted_1$r, [
3759
+ createElementVNode("div", _hoisted_1$s, [
3760
3760
  createElementVNode("div", null, toDisplayString(item.text), 1),
3761
3761
  createElementVNode("span", _hoisted_2$m, toDisplayString(item.value), 1)
3762
3762
  ])
@@ -3788,7 +3788,7 @@ const _sfc_main$I = /* @__PURE__ */ defineComponent({
3788
3788
  }, 1032, ["size"])) : createCommentVNode("", true)
3789
3789
  ], 64);
3790
3790
  }), 256)),
3791
- createVNode(_sfc_main$M, {
3791
+ createVNode(_sfc_main$N, {
3792
3792
  class: "tmagic-data-source-input-icon",
3793
3793
  icon: unref(Coin)
3794
3794
  }, null, 8, ["icon"])
@@ -3871,9 +3871,9 @@ const useDataSourceMethod = () => {
3871
3871
  };
3872
3872
  };
3873
3873
 
3874
- const _hoisted_1$q = { class: "m-editor-data-source-methods" };
3874
+ const _hoisted_1$r = { class: "m-editor-data-source-methods" };
3875
3875
  const _hoisted_2$l = { class: "m-editor-data-source-methods-footer" };
3876
- const _sfc_main$H = /* @__PURE__ */ defineComponent({
3876
+ const _sfc_main$I = /* @__PURE__ */ defineComponent({
3877
3877
  ...{
3878
3878
  name: "MEditorDataSourceMethods"
3879
3879
  },
@@ -3942,7 +3942,7 @@ const _sfc_main$H = /* @__PURE__ */ defineComponent({
3942
3942
  emit("change", props.model[props.name]);
3943
3943
  };
3944
3944
  return (_ctx, _cache) => {
3945
- return openBlock(), createElementBlock("div", _hoisted_1$q, [
3945
+ return openBlock(), createElementBlock("div", _hoisted_1$r, [
3946
3946
  createVNode(unref(MagicTable), {
3947
3947
  data: _ctx.model[_ctx.name],
3948
3948
  columns: methodColumns
@@ -3961,7 +3961,7 @@ const _sfc_main$H = /* @__PURE__ */ defineComponent({
3961
3961
  _: 1
3962
3962
  }, 8, ["disabled"])
3963
3963
  ]),
3964
- unref(codeConfig) ? (openBlock(), createBlock(_sfc_main$O, {
3964
+ unref(codeConfig) ? (openBlock(), createBlock(_sfc_main$P, {
3965
3965
  key: 0,
3966
3966
  ref_key: "codeBlockEditor",
3967
3967
  ref: codeBlockEditor,
@@ -3976,9 +3976,9 @@ const _sfc_main$H = /* @__PURE__ */ defineComponent({
3976
3976
  }
3977
3977
  });
3978
3978
 
3979
- const _hoisted_1$p = { class: "m-fields-data-source-method-select" };
3979
+ const _hoisted_1$q = { class: "m-fields-data-source-method-select" };
3980
3980
  const _hoisted_2$k = { class: "data-source-method-select-container" };
3981
- const _sfc_main$G = /* @__PURE__ */ defineComponent({
3981
+ const _sfc_main$H = /* @__PURE__ */ defineComponent({
3982
3982
  ...{
3983
3983
  name: "MEditorDataSourceMethodSelect"
3984
3984
  },
@@ -4060,7 +4060,7 @@ const _sfc_main$G = /* @__PURE__ */ defineComponent({
4060
4060
  };
4061
4061
  return (_ctx, _cache) => {
4062
4062
  const _component_m_form_container = resolveComponent("m-form-container");
4063
- return openBlock(), createElementBlock("div", _hoisted_1$p, [
4063
+ return openBlock(), createElementBlock("div", _hoisted_1$q, [
4064
4064
  createElementVNode("div", _hoisted_2$k, [
4065
4065
  createVNode(_component_m_form_container, {
4066
4066
  class: "select",
@@ -4068,14 +4068,14 @@ const _sfc_main$G = /* @__PURE__ */ defineComponent({
4068
4068
  model: _ctx.model,
4069
4069
  onChange: onChangeHandler
4070
4070
  }, null, 8, ["config", "model"]),
4071
- _ctx.model[_ctx.name] ? (openBlock(), createBlock(_sfc_main$M, {
4071
+ _ctx.model[_ctx.name] ? (openBlock(), createBlock(_sfc_main$N, {
4072
4072
  key: 0,
4073
4073
  class: "icon",
4074
4074
  icon: !_ctx.disabled ? unref(Edit) : unref(View),
4075
4075
  onClick: editCodeHandler
4076
4076
  }, null, 8, ["icon"])) : createCommentVNode("", true)
4077
4077
  ]),
4078
- paramsConfig.value.length ? (openBlock(), createBlock(_sfc_main$N, {
4078
+ paramsConfig.value.length ? (openBlock(), createBlock(_sfc_main$O, {
4079
4079
  key: 0,
4080
4080
  name: "params",
4081
4081
  model: _ctx.model,
@@ -4084,7 +4084,7 @@ const _sfc_main$G = /* @__PURE__ */ defineComponent({
4084
4084
  "params-config": paramsConfig.value,
4085
4085
  onChange: onChangeHandler
4086
4086
  }, null, 8, ["model", "size", "disabled", "params-config"])) : createCommentVNode("", true),
4087
- unref(codeConfig) ? (openBlock(), createBlock(_sfc_main$O, {
4087
+ unref(codeConfig) ? (openBlock(), createBlock(_sfc_main$P, {
4088
4088
  key: 1,
4089
4089
  ref_key: "codeBlockEditor",
4090
4090
  ref: codeBlockEditor,
@@ -4097,9 +4097,9 @@ const _sfc_main$G = /* @__PURE__ */ defineComponent({
4097
4097
  }
4098
4098
  });
4099
4099
 
4100
- const _hoisted_1$o = { class: "m-editor-data-source-fields" };
4100
+ const _hoisted_1$p = { class: "m-editor-data-source-fields" };
4101
4101
  const _hoisted_2$j = { class: "m-editor-data-source-fields-footer" };
4102
- const _sfc_main$F = /* @__PURE__ */ defineComponent({
4102
+ const _sfc_main$G = /* @__PURE__ */ defineComponent({
4103
4103
  ...{
4104
4104
  name: "MEditorDataSourceMocks"
4105
4105
  },
@@ -4185,7 +4185,7 @@ const _sfc_main$F = /* @__PURE__ */ defineComponent({
4185
4185
  const columns = [
4186
4186
  {
4187
4187
  type: "expand",
4188
- component: _sfc_main$S,
4188
+ component: _sfc_main$T,
4189
4189
  props: (row) => ({
4190
4190
  initValues: row.data,
4191
4191
  language: "json",
@@ -4294,7 +4294,7 @@ const _sfc_main$F = /* @__PURE__ */ defineComponent({
4294
4294
  });
4295
4295
  };
4296
4296
  return (_ctx, _cache) => {
4297
- return openBlock(), createElementBlock("div", _hoisted_1$o, [
4297
+ return openBlock(), createElementBlock("div", _hoisted_1$p, [
4298
4298
  createVNode(unref(MagicTable), {
4299
4299
  data: _ctx.model[_ctx.name],
4300
4300
  columns
@@ -4330,7 +4330,7 @@ const _sfc_main$F = /* @__PURE__ */ defineComponent({
4330
4330
  }
4331
4331
  });
4332
4332
 
4333
- const _sfc_main$E = /* @__PURE__ */ defineComponent({
4333
+ const _sfc_main$F = /* @__PURE__ */ defineComponent({
4334
4334
  ...{
4335
4335
  name: "MEditorDataSourceSelect"
4336
4336
  },
@@ -4385,12 +4385,12 @@ const _sfc_main$E = /* @__PURE__ */ defineComponent({
4385
4385
  }
4386
4386
  });
4387
4387
 
4388
- const _hoisted_1$n = { class: "m-fields-event-select" };
4388
+ const _hoisted_1$o = { class: "m-fields-event-select" };
4389
4389
  const _hoisted_2$i = {
4390
4390
  key: 1,
4391
4391
  class: "fullWidth"
4392
4392
  };
4393
- const _sfc_main$D = /* @__PURE__ */ defineComponent({
4393
+ const _sfc_main$E = /* @__PURE__ */ defineComponent({
4394
4394
  ...{
4395
4395
  name: "MEditorEventSelect"
4396
4396
  },
@@ -4592,7 +4592,7 @@ const _sfc_main$D = /* @__PURE__ */ defineComponent({
4592
4592
  const _component_m_form_table = resolveComponent("m-form-table");
4593
4593
  const _component_m_form_container = resolveComponent("m-form-container");
4594
4594
  const _component_m_form_panel = resolveComponent("m-form-panel");
4595
- return openBlock(), createElementBlock("div", _hoisted_1$n, [
4595
+ return openBlock(), createElementBlock("div", _hoisted_1$o, [
4596
4596
  isOldVersion.value ? (openBlock(), createBlock(_component_m_form_table, {
4597
4597
  key: 0,
4598
4598
  ref: "eventForm",
@@ -4652,9 +4652,9 @@ const _sfc_main$D = /* @__PURE__ */ defineComponent({
4652
4652
  }
4653
4653
  });
4654
4654
 
4655
- const _hoisted_1$m = { class: "m-fields-key-value" };
4655
+ const _hoisted_1$n = { class: "m-fields-key-value" };
4656
4656
  const _hoisted_2$h = /* @__PURE__ */ createElementVNode("span", { class: "m-fileds-key-value-delimiter" }, ":", -1);
4657
- const _sfc_main$C = /* @__PURE__ */ defineComponent({
4657
+ const _sfc_main$D = /* @__PURE__ */ defineComponent({
4658
4658
  ...{
4659
4659
  name: "MEditorKeyValue"
4660
4660
  },
@@ -4700,7 +4700,7 @@ const _sfc_main$C = /* @__PURE__ */ defineComponent({
4700
4700
  emit("change", getValue());
4701
4701
  };
4702
4702
  return (_ctx, _cache) => {
4703
- return openBlock(), createElementBlock("div", _hoisted_1$m, [
4703
+ return openBlock(), createElementBlock("div", _hoisted_1$n, [
4704
4704
  (openBlock(true), createElementBlock(Fragment, null, renderList(records.value, (item, index) => {
4705
4705
  return openBlock(), createElementBlock("div", {
4706
4706
  class: "m-fields-key-value-item",
@@ -4753,12 +4753,12 @@ const _sfc_main$C = /* @__PURE__ */ defineComponent({
4753
4753
  }
4754
4754
  });
4755
4755
 
4756
- const _hoisted_1$l = {
4756
+ const _hoisted_1$m = {
4757
4757
  key: 1,
4758
4758
  class: "m-fields-ui-select",
4759
4759
  style: { "display": "flex" }
4760
4760
  };
4761
- const _sfc_main$B = /* @__PURE__ */ defineComponent({
4761
+ const _sfc_main$C = /* @__PURE__ */ defineComponent({
4762
4762
  ...{
4763
4763
  name: "MEditorUISelect"
4764
4764
  },
@@ -4847,7 +4847,7 @@ const _sfc_main$B = /* @__PURE__ */ defineComponent({
4847
4847
  ]),
4848
4848
  _: 1
4849
4849
  }, 8, ["icon", "disabled", "size"])
4850
- ])) : (openBlock(), createElementBlock("div", _hoisted_1$l, [
4850
+ ])) : (openBlock(), createElementBlock("div", _hoisted_1$m, [
4851
4851
  val.value ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
4852
4852
  createVNode(unref(TMagicTooltip), {
4853
4853
  content: "清除",
@@ -4944,7 +4944,7 @@ const useGetSo = (target, emit) => {
4944
4944
  };
4945
4945
  };
4946
4946
 
4947
- const _sfc_main$A = /* @__PURE__ */ defineComponent({
4947
+ const _sfc_main$B = /* @__PURE__ */ defineComponent({
4948
4948
  ...{
4949
4949
  name: "MEditorResizer"
4950
4950
  },
@@ -4965,7 +4965,7 @@ const _sfc_main$A = /* @__PURE__ */ defineComponent({
4965
4965
  }
4966
4966
  });
4967
4967
 
4968
- const _sfc_main$z = /* @__PURE__ */ defineComponent({
4968
+ const _sfc_main$A = /* @__PURE__ */ defineComponent({
4969
4969
  ...{
4970
4970
  name: "MEditorLayout"
4971
4971
  },
@@ -4981,19 +4981,22 @@ const _sfc_main$z = /* @__PURE__ */ defineComponent({
4981
4981
  centerClass: {}
4982
4982
  },
4983
4983
  emits: ["update:left", "change", "update:right"],
4984
- setup(__props, { emit }) {
4984
+ setup(__props, { expose: __expose, emit }) {
4985
4985
  const props = __props;
4986
4986
  const el = ref();
4987
4987
  const hasLeft = computed(() => typeof props.left !== "undefined");
4988
4988
  const hasRight = computed(() => typeof props.right !== "undefined");
4989
- const getCenterWidth = (clientWidth2, left, right) => {
4989
+ const getCenterWidth = (clientWidth2, l = 0, r = 0) => {
4990
+ let right = r > 0 ? r : 0;
4991
+ let left = l > 0 ? l : 0;
4990
4992
  let center2 = clientWidth2 - left - right;
4991
4993
  if (center2 < props.minCenter) {
4992
4994
  center2 = props.minCenter;
4993
- if (left < right) {
4994
- right = clientWidth2 - left - props.minCenter;
4995
+ if (right > center2 + props.minRight) {
4996
+ right = clientWidth2 - left - center2;
4995
4997
  } else {
4996
- left = clientWidth2 - right - props.minCenter;
4998
+ right = props.minRight;
4999
+ left = clientWidth2 - right - center2;
4997
5000
  }
4998
5001
  }
4999
5002
  return {
@@ -5056,7 +5059,7 @@ const _sfc_main$z = /* @__PURE__ */ defineComponent({
5056
5059
  if (clientWidth - (props.left || 0) - right <= 0) {
5057
5060
  right = props.right;
5058
5061
  }
5059
- const columnWidth = getCenterWidth(clientWidth, props.left || 0, right);
5062
+ const columnWidth = getCenterWidth(clientWidth, props.left, right);
5060
5063
  center.value = columnWidth.center;
5061
5064
  emit("change", {
5062
5065
  left: columnWidth.left,
@@ -5064,11 +5067,22 @@ const _sfc_main$z = /* @__PURE__ */ defineComponent({
5064
5067
  right: columnWidth.right
5065
5068
  });
5066
5069
  };
5070
+ __expose({
5071
+ updateWidth() {
5072
+ const columnWidth = getCenterWidth(el.value?.clientWidth || clientWidth, props.left, props.right);
5073
+ emit("change", {
5074
+ left: columnWidth.left,
5075
+ center: center.value,
5076
+ right: columnWidth.right
5077
+ });
5078
+ }
5079
+ });
5067
5080
  return (_ctx, _cache) => {
5068
5081
  return openBlock(), createElementBlock("div", {
5069
5082
  ref_key: "el",
5070
5083
  ref: el,
5071
- class: "m-editor-layout"
5084
+ class: "m-editor-layout",
5085
+ style: normalizeStyle(`min-width: ${props.minCenter + props.minLeft + props.minRight}px`)
5072
5086
  }, [
5073
5087
  hasLeft.value && _ctx.$slots.left ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
5074
5088
  createElementVNode("div", {
@@ -5077,7 +5091,7 @@ const _sfc_main$z = /* @__PURE__ */ defineComponent({
5077
5091
  }, [
5078
5092
  renderSlot(_ctx.$slots, "left")
5079
5093
  ], 6),
5080
- createVNode(_sfc_main$A, { onChange: changeLeft })
5094
+ createVNode(_sfc_main$B, { onChange: changeLeft })
5081
5095
  ], 64)) : createCommentVNode("", true),
5082
5096
  createElementVNode("div", {
5083
5097
  class: normalizeClass(["m-editor-layout-center", _ctx.centerClass]),
@@ -5086,7 +5100,7 @@ const _sfc_main$z = /* @__PURE__ */ defineComponent({
5086
5100
  renderSlot(_ctx.$slots, "center")
5087
5101
  ], 6),
5088
5102
  hasRight.value && _ctx.$slots.right ? (openBlock(), createElementBlock(Fragment, { key: 1 }, [
5089
- createVNode(_sfc_main$A, { onChange: changeRight }),
5103
+ createVNode(_sfc_main$B, { onChange: changeRight }),
5090
5104
  createElementVNode("div", {
5091
5105
  class: normalizeClass(["m-editor-layout-right", _ctx.rightClass]),
5092
5106
  style: normalizeStyle(`width: ${_ctx.right}px`)
@@ -5094,15 +5108,15 @@ const _sfc_main$z = /* @__PURE__ */ defineComponent({
5094
5108
  renderSlot(_ctx.$slots, "right")
5095
5109
  ], 6)
5096
5110
  ], 64)) : createCommentVNode("", true)
5097
- ], 512);
5111
+ ], 4);
5098
5112
  };
5099
5113
  }
5100
5114
  });
5101
5115
 
5102
- const _hoisted_1$k = { class: "m-editor-empty-panel" };
5116
+ const _hoisted_1$l = { class: "m-editor-empty-panel" };
5103
5117
  const _hoisted_2$g = { class: "m-editor-empty-content" };
5104
5118
  const _hoisted_3$9 = /* @__PURE__ */ createElementVNode("p", null, "新增页面", -1);
5105
- const _sfc_main$y = /* @__PURE__ */ defineComponent({
5119
+ const _sfc_main$z = /* @__PURE__ */ defineComponent({
5106
5120
  ...{
5107
5121
  name: "MEditorAddPageBox"
5108
5122
  },
@@ -5122,14 +5136,14 @@ const _sfc_main$y = /* @__PURE__ */ defineComponent({
5122
5136
  });
5123
5137
  };
5124
5138
  return (_ctx, _cache) => {
5125
- return openBlock(), createElementBlock("div", _hoisted_1$k, [
5139
+ return openBlock(), createElementBlock("div", _hoisted_1$l, [
5126
5140
  createElementVNode("div", _hoisted_2$g, [
5127
5141
  createElementVNode("div", {
5128
5142
  class: "m-editor-empty-button",
5129
5143
  onClick: clickHandler
5130
5144
  }, [
5131
5145
  createElementVNode("div", null, [
5132
- createVNode(_sfc_main$M, { icon: unref(Plus) }, null, 8, ["icon"])
5146
+ createVNode(_sfc_main$N, { icon: unref(Plus) }, null, 8, ["icon"])
5133
5147
  ]),
5134
5148
  _hoisted_3$9
5135
5149
  ])
@@ -5143,7 +5157,7 @@ const DEFAULT_LEFT_COLUMN_WIDTH = 310;
5143
5157
  const DEFAULT_RIGHT_COLUMN_WIDTH = 480;
5144
5158
  const LEFT_COLUMN_WIDTH_STORAGE_KEY = "$MagicEditorLeftColumnWidthData";
5145
5159
  const RIGHT_COLUMN_WIDTH_STORAGE_KEY = "$MagicEditorRightColumnWidthData";
5146
- const _sfc_main$x = /* @__PURE__ */ defineComponent({
5160
+ const _sfc_main$y = /* @__PURE__ */ defineComponent({
5147
5161
  ...{
5148
5162
  name: "MEditorFramework"
5149
5163
  },
@@ -5152,31 +5166,21 @@ const _sfc_main$x = /* @__PURE__ */ defineComponent({
5152
5166
  const codeOptions = inject("codeOptions", {});
5153
5167
  const { editorService, uiService } = inject("services") || {};
5154
5168
  const content = ref();
5169
+ const splitView = ref();
5155
5170
  const root = computed(() => editorService?.get("root"));
5156
5171
  const pageLength = computed(() => editorService?.get("pageLength") || 0);
5157
5172
  const showSrc = computed(() => uiService?.get("showSrc"));
5158
- const leftColumnWidthCacheData = Number(globalThis.localStorage.getItem(LEFT_COLUMN_WIDTH_STORAGE_KEY));
5159
- const RightColumnWidthCacheData = Number(globalThis.localStorage.getItem(RIGHT_COLUMN_WIDTH_STORAGE_KEY));
5173
+ const leftColumnWidthCacheData = Number(globalThis.localStorage.getItem(LEFT_COLUMN_WIDTH_STORAGE_KEY)) || DEFAULT_LEFT_COLUMN_WIDTH;
5174
+ const RightColumnWidthCacheData = Number(globalThis.localStorage.getItem(RIGHT_COLUMN_WIDTH_STORAGE_KEY)) || DEFAULT_RIGHT_COLUMN_WIDTH;
5160
5175
  const columnWidth = ref({
5161
5176
  left: leftColumnWidthCacheData,
5162
5177
  center: 0,
5163
5178
  right: RightColumnWidthCacheData
5164
5179
  });
5165
5180
  watch(
5166
- pageLength,
5167
- (length) => {
5168
- const left = columnWidth.value.left || DEFAULT_LEFT_COLUMN_WIDTH;
5169
- columnWidth.value.left = left;
5170
- const container = content.value || document.body;
5171
- if (length <= 0) {
5172
- columnWidth.value.right = void 0;
5173
- columnWidth.value.center = container.clientWidth - left;
5174
- } else {
5175
- const right = columnWidth.value.right || RightColumnWidthCacheData || DEFAULT_RIGHT_COLUMN_WIDTH;
5176
- columnWidth.value.right = right;
5177
- columnWidth.value.center = container.clientWidth - left - right;
5178
- }
5179
- uiService?.set("columnWidth", columnWidth.value);
5181
+ [pageLength, splitView],
5182
+ () => {
5183
+ splitView.value?.updateWidth();
5180
5184
  },
5181
5185
  {
5182
5186
  immediate: true
@@ -5214,20 +5218,23 @@ const _sfc_main$x = /* @__PURE__ */ defineComponent({
5214
5218
  return openBlock(), createElementBlock("div", {
5215
5219
  class: "m-editor",
5216
5220
  ref_key: "content",
5217
- ref: content
5221
+ ref: content,
5222
+ style: { "min-width": "180px" }
5218
5223
  }, [
5219
5224
  renderSlot(_ctx.$slots, "header"),
5220
5225
  renderSlot(_ctx.$slots, "nav"),
5221
5226
  renderSlot(_ctx.$slots, "content-before"),
5222
5227
  showSrc.value ? renderSlot(_ctx.$slots, "src-code", { key: 0 }, () => [
5223
- createVNode(_sfc_main$S, {
5228
+ createVNode(_sfc_main$T, {
5224
5229
  class: "m-editor-content",
5225
5230
  "init-values": root.value,
5226
5231
  options: unref(codeOptions),
5227
5232
  onSave: saveCode
5228
5233
  }, null, 8, ["init-values", "options"])
5229
- ]) : (openBlock(), createBlock(_sfc_main$z, {
5234
+ ]) : (openBlock(), createBlock(_sfc_main$A, {
5230
5235
  key: 1,
5236
+ ref_key: "splitView",
5237
+ ref: splitView,
5231
5238
  class: "m-editor-content",
5232
5239
  "left-class": "m-editor-framework-left",
5233
5240
  "center-class": "m-editor-framework-center",
@@ -5238,6 +5245,7 @@ const _sfc_main$x = /* @__PURE__ */ defineComponent({
5238
5245
  "onUpdate:right": _cache[1] || (_cache[1] = ($event) => columnWidth.value.right = $event),
5239
5246
  "min-left": 65,
5240
5247
  "min-right": 20,
5248
+ "min-center": 100,
5241
5249
  onChange: columnWidthChange
5242
5250
  }, createSlots({
5243
5251
  left: withCtx(() => [
@@ -5245,7 +5253,7 @@ const _sfc_main$x = /* @__PURE__ */ defineComponent({
5245
5253
  ]),
5246
5254
  center: withCtx(() => [
5247
5255
  pageLength.value > 0 ? renderSlot(_ctx.$slots, "workspace", { key: 0 }) : renderSlot(_ctx.$slots, "empty", { key: 1 }, () => [
5248
- createVNode(_sfc_main$y)
5256
+ createVNode(_sfc_main$z)
5249
5257
  ])
5250
5258
  ]),
5251
5259
  _: 2
@@ -5270,12 +5278,12 @@ const _sfc_main$x = /* @__PURE__ */ defineComponent({
5270
5278
  }
5271
5279
  });
5272
5280
 
5273
- const _hoisted_1$j = {
5281
+ const _hoisted_1$k = {
5274
5282
  key: 1,
5275
5283
  class: "menu-item-text"
5276
5284
  };
5277
5285
  const _hoisted_2$f = { class: "el-dropdown-link menubar-menu-button" };
5278
- const _sfc_main$w = /* @__PURE__ */ defineComponent({
5286
+ const _sfc_main$x = /* @__PURE__ */ defineComponent({
5279
5287
  ...{
5280
5288
  name: "MEditorToolButton"
5281
5289
  },
@@ -5354,7 +5362,7 @@ const _sfc_main$w = /* @__PURE__ */ defineComponent({
5354
5362
  _ctx.data.type === "divider" ? (openBlock(), createBlock(unref(TMagicDivider), {
5355
5363
  key: 0,
5356
5364
  direction: _ctx.data.direction || "vertical"
5357
- }, null, 8, ["direction"])) : _ctx.data.type === "text" ? (openBlock(), createElementBlock("div", _hoisted_1$j, toDisplayString(_ctx.data.text), 1)) : _ctx.data.type === "button" ? (openBlock(), createElementBlock(Fragment, { key: 2 }, [
5365
+ }, null, 8, ["direction"])) : _ctx.data.type === "text" ? (openBlock(), createElementBlock("div", _hoisted_1$k, toDisplayString(_ctx.data.text), 1)) : _ctx.data.type === "button" ? (openBlock(), createElementBlock(Fragment, { key: 2 }, [
5358
5366
  _ctx.data.tooltip ? (openBlock(), createBlock(unref(TMagicTooltip), {
5359
5367
  key: 0,
5360
5368
  effect: "dark",
@@ -5368,7 +5376,7 @@ const _sfc_main$w = /* @__PURE__ */ defineComponent({
5368
5376
  disabled: disabled.value
5369
5377
  }, {
5370
5378
  default: withCtx(() => [
5371
- _ctx.data.icon ? (openBlock(), createBlock(_sfc_main$M, {
5379
+ _ctx.data.icon ? (openBlock(), createBlock(_sfc_main$N, {
5372
5380
  key: 0,
5373
5381
  icon: _ctx.data.icon
5374
5382
  }, null, 8, ["icon"])) : createCommentVNode("", true),
@@ -5386,7 +5394,7 @@ const _sfc_main$w = /* @__PURE__ */ defineComponent({
5386
5394
  title: _ctx.data.text
5387
5395
  }, {
5388
5396
  default: withCtx(() => [
5389
- _ctx.data.icon ? (openBlock(), createBlock(_sfc_main$M, {
5397
+ _ctx.data.icon ? (openBlock(), createBlock(_sfc_main$N, {
5390
5398
  key: 0,
5391
5399
  icon: _ctx.data.icon
5392
5400
  }, null, 8, ["icon"])) : createCommentVNode("", true),
@@ -5436,7 +5444,7 @@ const _sfc_main$w = /* @__PURE__ */ defineComponent({
5436
5444
  }
5437
5445
  });
5438
5446
 
5439
- const _sfc_main$v = /* @__PURE__ */ defineComponent({
5447
+ const _sfc_main$w = /* @__PURE__ */ defineComponent({
5440
5448
  ...{
5441
5449
  name: "MEditorNavMenu"
5442
5450
  },
@@ -5598,7 +5606,7 @@ const _sfc_main$v = /* @__PURE__ */ defineComponent({
5598
5606
  style: normalizeStyle(`width: ${columnWidth.value?.[key]}px`)
5599
5607
  }, [
5600
5608
  (openBlock(true), createElementBlock(Fragment, null, renderList(buttons.value[key], (item, index) => {
5601
- return openBlock(), createBlock(_sfc_main$w, {
5609
+ return openBlock(), createBlock(_sfc_main$x, {
5602
5610
  data: item,
5603
5611
  key: index
5604
5612
  }, null, 8, ["data"]);
@@ -5610,8 +5618,8 @@ const _sfc_main$v = /* @__PURE__ */ defineComponent({
5610
5618
  }
5611
5619
  });
5612
5620
 
5613
- const _hoisted_1$i = { class: "m-editor-props-panel" };
5614
- const _sfc_main$u = /* @__PURE__ */ defineComponent({
5621
+ const _hoisted_1$j = { class: "m-editor-props-panel" };
5622
+ const _sfc_main$v = /* @__PURE__ */ defineComponent({
5615
5623
  ...{
5616
5624
  name: "MEditorPropsPanel"
5617
5625
  },
@@ -5664,7 +5672,7 @@ const _sfc_main$u = /* @__PURE__ */ defineComponent({
5664
5672
  };
5665
5673
  __expose({ configForm, submit });
5666
5674
  return (_ctx, _cache) => {
5667
- return withDirectives((openBlock(), createElementBlock("div", _hoisted_1$i, [
5675
+ return withDirectives((openBlock(), createElementBlock("div", _hoisted_1$j, [
5668
5676
  renderSlot(_ctx.$slots, "props-panel-header"),
5669
5677
  createVNode(unref(MForm), {
5670
5678
  ref_key: "configForm",
@@ -5684,7 +5692,7 @@ const _sfc_main$u = /* @__PURE__ */ defineComponent({
5684
5692
  }
5685
5693
  });
5686
5694
 
5687
- const _sfc_main$t = /* @__PURE__ */ defineComponent({
5695
+ const _sfc_main$u = /* @__PURE__ */ defineComponent({
5688
5696
  ...{
5689
5697
  name: "MEditorSearchInput"
5690
5698
  },
@@ -5723,7 +5731,7 @@ const _sfc_main$t = /* @__PURE__ */ defineComponent({
5723
5731
  }
5724
5732
  });
5725
5733
 
5726
- const _hoisted_1$h = { xmlns: "http://www.w3.org/2000/svg" };
5734
+ const _hoisted_1$i = { xmlns: "http://www.w3.org/2000/svg" };
5727
5735
  const _hoisted_2$e = /* @__PURE__ */ createElementVNode("g", {
5728
5736
  fill: "#7C878E",
5729
5737
  "fill-rule": "evenodd"
@@ -5737,19 +5745,19 @@ const _hoisted_2$e = /* @__PURE__ */ createElementVNode("g", {
5737
5745
  const _hoisted_3$8 = [
5738
5746
  _hoisted_2$e
5739
5747
  ];
5740
- const _sfc_main$s = /* @__PURE__ */ defineComponent({
5748
+ const _sfc_main$t = /* @__PURE__ */ defineComponent({
5741
5749
  ...{
5742
5750
  name: "MEditorAppManageIcon"
5743
5751
  },
5744
5752
  __name: "AppManageIcon",
5745
5753
  setup(__props) {
5746
5754
  return (_ctx, _cache) => {
5747
- return openBlock(), createElementBlock("svg", _hoisted_1$h, _hoisted_3$8);
5755
+ return openBlock(), createElementBlock("svg", _hoisted_1$i, _hoisted_3$8);
5748
5756
  };
5749
5757
  }
5750
5758
  });
5751
5759
 
5752
- const _hoisted_1$g = {
5760
+ const _hoisted_1$h = {
5753
5761
  viewBox: "0 0 32 32",
5754
5762
  version: "1.1",
5755
5763
  xmlns: "http://www.w3.org/2000/svg",
@@ -5759,25 +5767,25 @@ const _hoisted_2$d = /* @__PURE__ */ createStaticVNode('<defs><rect id="path-1"
5759
5767
  const _hoisted_4$6 = [
5760
5768
  _hoisted_2$d
5761
5769
  ];
5762
- const _sfc_main$r = /* @__PURE__ */ defineComponent({
5770
+ const _sfc_main$s = /* @__PURE__ */ defineComponent({
5763
5771
  ...{
5764
5772
  name: "MEditorCodeIcon"
5765
5773
  },
5766
5774
  __name: "CodeIcon",
5767
5775
  setup(__props) {
5768
5776
  return (_ctx, _cache) => {
5769
- return openBlock(), createElementBlock("svg", _hoisted_1$g, _hoisted_4$6);
5777
+ return openBlock(), createElementBlock("svg", _hoisted_1$h, _hoisted_4$6);
5770
5778
  };
5771
5779
  }
5772
5780
  });
5773
5781
 
5774
- const _hoisted_1$f = ["id"];
5782
+ const _hoisted_1$g = ["id"];
5775
5783
  const _hoisted_2$c = { class: "list-item" };
5776
5784
  const _hoisted_3$7 = {
5777
5785
  key: 2,
5778
5786
  class: "right-tool"
5779
5787
  };
5780
- const _sfc_main$q = /* @__PURE__ */ defineComponent({
5788
+ const _sfc_main$r = /* @__PURE__ */ defineComponent({
5781
5789
  ...{
5782
5790
  name: "MEditorCodeBlockList"
5783
5791
  },
@@ -5879,11 +5887,11 @@ const _sfc_main$q = /* @__PURE__ */ defineComponent({
5879
5887
  class: "list-container"
5880
5888
  }, [
5881
5889
  createElementVNode("div", _hoisted_2$c, [
5882
- data.type === "code" ? (openBlock(), createBlock(_sfc_main$r, {
5890
+ data.type === "code" ? (openBlock(), createBlock(_sfc_main$s, {
5883
5891
  key: 0,
5884
5892
  class: "codeIcon"
5885
5893
  })) : createCommentVNode("", true),
5886
- data.type === "node" ? (openBlock(), createBlock(_sfc_main$s, {
5894
+ data.type === "node" ? (openBlock(), createBlock(_sfc_main$t, {
5887
5895
  key: 1,
5888
5896
  class: "compIcon"
5889
5897
  })) : createCommentVNode("", true),
@@ -5897,7 +5905,7 @@ const _sfc_main$q = /* @__PURE__ */ defineComponent({
5897
5905
  placement: "bottom"
5898
5906
  }, {
5899
5907
  default: withCtx(() => [
5900
- createVNode(_sfc_main$M, {
5908
+ createVNode(_sfc_main$N, {
5901
5909
  icon: editable.value ? unref(Edit) : unref(View),
5902
5910
  class: "edit-icon",
5903
5911
  onClick: withModifiers(($event) => editCode(data.id), ["stop"])
@@ -5912,7 +5920,7 @@ const _sfc_main$q = /* @__PURE__ */ defineComponent({
5912
5920
  placement: "bottom"
5913
5921
  }, {
5914
5922
  default: withCtx(() => [
5915
- createVNode(_sfc_main$M, {
5923
+ createVNode(_sfc_main$N, {
5916
5924
  icon: unref(Close),
5917
5925
  class: "edit-icon",
5918
5926
  onClick: withModifiers(($event) => deleteCode(`${data.id}`), ["stop"])
@@ -5926,7 +5934,7 @@ const _sfc_main$q = /* @__PURE__ */ defineComponent({
5926
5934
  })
5927
5935
  ])) : createCommentVNode("", true)
5928
5936
  ])
5929
- ], 8, _hoisted_1$f)
5937
+ ], 8, _hoisted_1$g)
5930
5938
  ]),
5931
5939
  _: 3
5932
5940
  }, 8, ["default-expanded-keys", "data"]);
@@ -5934,8 +5942,8 @@ const _sfc_main$q = /* @__PURE__ */ defineComponent({
5934
5942
  }
5935
5943
  });
5936
5944
 
5937
- const _hoisted_1$e = { class: "search-wrapper" };
5938
- const _sfc_main$p = /* @__PURE__ */ defineComponent({
5945
+ const _hoisted_1$f = { class: "search-wrapper" };
5946
+ const _sfc_main$q = /* @__PURE__ */ defineComponent({
5939
5947
  ...{
5940
5948
  name: "MEditorCodeBlockListPanel"
5941
5949
  },
@@ -5955,8 +5963,8 @@ const _sfc_main$p = /* @__PURE__ */ defineComponent({
5955
5963
  return openBlock(), createBlock(unref(TMagicScrollbar), { class: "m-editor-code-block-list m-editor-dep-list-panel" }, {
5956
5964
  default: withCtx(() => [
5957
5965
  renderSlot(_ctx.$slots, "code-block-panel-header", {}, () => [
5958
- createElementVNode("div", _hoisted_1$e, [
5959
- createVNode(_sfc_main$t, { onSearch: filterTextChangeHandler }),
5966
+ createElementVNode("div", _hoisted_1$f, [
5967
+ createVNode(_sfc_main$u, { onSearch: filterTextChangeHandler }),
5960
5968
  editable.value ? (openBlock(), createBlock(unref(TMagicButton), {
5961
5969
  key: 0,
5962
5970
  class: "create-code-button",
@@ -5972,7 +5980,7 @@ const _sfc_main$p = /* @__PURE__ */ defineComponent({
5972
5980
  renderSlot(_ctx.$slots, "code-block-panel-search")
5973
5981
  ])
5974
5982
  ]),
5975
- createVNode(_sfc_main$q, {
5983
+ createVNode(_sfc_main$r, {
5976
5984
  ref_key: "codeBlockList",
5977
5985
  ref: codeBlockList,
5978
5986
  "custom-error": _ctx.customError,
@@ -5987,7 +5995,7 @@ const _sfc_main$p = /* @__PURE__ */ defineComponent({
5987
5995
  ]),
5988
5996
  _: 3
5989
5997
  }, 8, ["custom-error", "onEdit", "onRemove"]),
5990
- unref(codeConfig) ? (openBlock(), createBlock(_sfc_main$O, {
5998
+ unref(codeConfig) ? (openBlock(), createBlock(_sfc_main$P, {
5991
5999
  key: 0,
5992
6000
  ref_key: "codeBlockEditor",
5993
6001
  ref: codeBlockEditor,
@@ -6002,7 +6010,7 @@ const _sfc_main$p = /* @__PURE__ */ defineComponent({
6002
6010
  }
6003
6011
  });
6004
6012
 
6005
- const _sfc_main$o = /* @__PURE__ */ defineComponent({
6013
+ const _sfc_main$p = /* @__PURE__ */ defineComponent({
6006
6014
  ...{
6007
6015
  name: "MEditorDataSourceConfigPanel"
6008
6016
  },
@@ -6056,13 +6064,13 @@ const _sfc_main$o = /* @__PURE__ */ defineComponent({
6056
6064
  }
6057
6065
  });
6058
6066
 
6059
- const _hoisted_1$d = ["id"];
6067
+ const _hoisted_1$e = ["id"];
6060
6068
  const _hoisted_2$b = { class: "list-item" };
6061
6069
  const _hoisted_3$6 = {
6062
6070
  key: 2,
6063
6071
  class: "right-tool"
6064
6072
  };
6065
- const _sfc_main$n = /* @__PURE__ */ defineComponent({
6073
+ const _sfc_main$o = /* @__PURE__ */ defineComponent({
6066
6074
  ...{
6067
6075
  name: "MEditorDataSourceList"
6068
6076
  },
@@ -6082,25 +6090,25 @@ const _sfc_main$n = /* @__PURE__ */ defineComponent({
6082
6090
  id,
6083
6091
  children: getKeyTreeConfig(dep, type)
6084
6092
  });
6093
+ const mergeChildren = (children, deps, type) => {
6094
+ Object.entries(deps).forEach(([id, dep]) => {
6095
+ const nodeItem = children.find((item) => item.id === id);
6096
+ if (nodeItem) {
6097
+ nodeItem.children = nodeItem.children.concat(getKeyTreeConfig(dep, type));
6098
+ } else {
6099
+ children.push(getNodeTreeConfig(id, dep, type));
6100
+ }
6101
+ });
6102
+ };
6085
6103
  const list = computed(
6086
6104
  () => dataSources.value.map((ds) => {
6087
6105
  const dsDeps = dsDep.value[ds.id].deps;
6088
6106
  const dsMethodDeps = dsMethodDep.value[ds.id].deps;
6089
6107
  const dsCondDeps = dsCondDep.value[ds.id].deps;
6090
6108
  const children = [];
6091
- const mergeChildren = (deps, type) => {
6092
- Object.entries(deps).forEach(([id, dep]) => {
6093
- const nodeItem = children.find((item) => item.id === id);
6094
- if (nodeItem) {
6095
- nodeItem.children = nodeItem.children.concat(getKeyTreeConfig(dep, type));
6096
- } else {
6097
- children.push(getNodeTreeConfig(id, dep, type));
6098
- }
6099
- });
6100
- };
6101
- mergeChildren(dsDeps);
6102
- mergeChildren(dsMethodDeps, "method");
6103
- mergeChildren(dsCondDeps, "cond");
6109
+ mergeChildren(children, dsDeps);
6110
+ mergeChildren(children, dsMethodDeps, "method");
6111
+ mergeChildren(children, dsCondDeps, "cond");
6104
6112
  return {
6105
6113
  id: ds.id,
6106
6114
  name: ds.title,
@@ -6158,12 +6166,12 @@ const _sfc_main$n = /* @__PURE__ */ defineComponent({
6158
6166
  class: "list-container"
6159
6167
  }, [
6160
6168
  createElementVNode("div", _hoisted_2$b, [
6161
- data.type === "code" ? (openBlock(), createBlock(_sfc_main$M, {
6169
+ data.type === "code" ? (openBlock(), createBlock(_sfc_main$N, {
6162
6170
  key: 0,
6163
6171
  class: "codeIcon",
6164
6172
  icon: unref(Coin)
6165
6173
  }, null, 8, ["icon"])) : createCommentVNode("", true),
6166
- data.type === "node" ? (openBlock(), createBlock(_sfc_main$M, {
6174
+ data.type === "node" ? (openBlock(), createBlock(_sfc_main$N, {
6167
6175
  key: 1,
6168
6176
  class: "compIcon",
6169
6177
  icon: unref(Aim)
@@ -6178,7 +6186,7 @@ const _sfc_main$n = /* @__PURE__ */ defineComponent({
6178
6186
  placement: "bottom"
6179
6187
  }, {
6180
6188
  default: withCtx(() => [
6181
- createVNode(_sfc_main$M, {
6189
+ createVNode(_sfc_main$N, {
6182
6190
  icon: editable.value ? unref(Edit) : unref(View),
6183
6191
  class: "edit-icon",
6184
6192
  onClick: withModifiers(($event) => editHandler(`${data.id}`), ["stop"])
@@ -6193,7 +6201,7 @@ const _sfc_main$n = /* @__PURE__ */ defineComponent({
6193
6201
  placement: "bottom"
6194
6202
  }, {
6195
6203
  default: withCtx(() => [
6196
- createVNode(_sfc_main$M, {
6204
+ createVNode(_sfc_main$N, {
6197
6205
  icon: unref(Close),
6198
6206
  class: "edit-icon",
6199
6207
  onClick: withModifiers(($event) => removeHandler(`${data.id}`), ["stop"])
@@ -6201,13 +6209,10 @@ const _sfc_main$n = /* @__PURE__ */ defineComponent({
6201
6209
  ]),
6202
6210
  _: 2
6203
6211
  }, 1024)) : createCommentVNode("", true),
6204
- renderSlot(_ctx.$slots, "data-source-panel-tool", {
6205
- id: data.id,
6206
- data: data.codeBlockContent
6207
- })
6212
+ renderSlot(_ctx.$slots, "data-source-panel-tool", { data })
6208
6213
  ])) : createCommentVNode("", true)
6209
6214
  ])
6210
- ], 8, _hoisted_1$d)
6215
+ ], 8, _hoisted_1$e)
6211
6216
  ]),
6212
6217
  _: 3
6213
6218
  }, 8, ["data"]);
@@ -6215,9 +6220,9 @@ const _sfc_main$n = /* @__PURE__ */ defineComponent({
6215
6220
  }
6216
6221
  });
6217
6222
 
6218
- const _hoisted_1$c = { class: "search-wrapper" };
6223
+ const _hoisted_1$d = { class: "search-wrapper" };
6219
6224
  const _hoisted_2$a = { class: "data-source-list-panel-add-menu" };
6220
- const _sfc_main$m = /* @__PURE__ */ defineComponent({
6225
+ const _sfc_main$n = /* @__PURE__ */ defineComponent({
6221
6226
  ...{
6222
6227
  name: "MEditorDataSourceListPanel"
6223
6228
  },
@@ -6277,8 +6282,8 @@ const _sfc_main$m = /* @__PURE__ */ defineComponent({
6277
6282
  return (_ctx, _cache) => {
6278
6283
  return openBlock(), createBlock(unref(TMagicScrollbar), { class: "data-source-list-panel m-editor-dep-list-panel" }, {
6279
6284
  default: withCtx(() => [
6280
- createElementVNode("div", _hoisted_1$c, [
6281
- createVNode(_sfc_main$t, { onSearch: filterTextChangeHandler }),
6285
+ createElementVNode("div", _hoisted_1$d, [
6286
+ createVNode(_sfc_main$u, { onSearch: filterTextChangeHandler }),
6282
6287
  editable.value ? (openBlock(), createBlock(unref(TMagicPopover), {
6283
6288
  key: 0,
6284
6289
  placement: "right"
@@ -6297,7 +6302,7 @@ const _sfc_main$m = /* @__PURE__ */ defineComponent({
6297
6302
  default: withCtx(() => [
6298
6303
  createElementVNode("div", _hoisted_2$a, [
6299
6304
  (openBlock(true), createElementBlock(Fragment, null, renderList(datasourceTypeList.value, (item, index) => {
6300
- return openBlock(), createBlock(_sfc_main$w, {
6305
+ return openBlock(), createBlock(_sfc_main$x, {
6301
6306
  data: {
6302
6307
  type: "button",
6303
6308
  text: item.text,
@@ -6313,11 +6318,16 @@ const _sfc_main$m = /* @__PURE__ */ defineComponent({
6313
6318
  _: 1
6314
6319
  })) : createCommentVNode("", true)
6315
6320
  ]),
6316
- createVNode(_sfc_main$n, {
6321
+ createVNode(_sfc_main$o, {
6317
6322
  onEdit: editHandler,
6318
6323
  onRemove: removeHandler
6324
+ }, {
6325
+ "data-source-panel-tool": withCtx(({ data }) => [
6326
+ renderSlot(_ctx.$slots, "data-source-panel-tool", { data })
6327
+ ]),
6328
+ _: 3
6319
6329
  }),
6320
- createVNode(_sfc_main$o, {
6330
+ createVNode(_sfc_main$p, {
6321
6331
  ref_key: "editDialog",
6322
6332
  ref: editDialog,
6323
6333
  disabled: !editable.value,
@@ -6326,13 +6336,187 @@ const _sfc_main$m = /* @__PURE__ */ defineComponent({
6326
6336
  onSubmit: submitDataSourceHandler
6327
6337
  }, null, 8, ["disabled", "values", "title"])
6328
6338
  ]),
6329
- _: 1
6339
+ _: 3
6340
+ });
6341
+ };
6342
+ }
6343
+ });
6344
+
6345
+ const updateStatus = (nodeStatusMap, id, status) => {
6346
+ const nodeStatus = nodeStatusMap.get(id);
6347
+ if (!nodeStatus)
6348
+ return;
6349
+ getKeys(status).forEach((key) => {
6350
+ if (nodeStatus[key] !== void 0 && status[key] !== void 0) {
6351
+ nodeStatus[key] = Boolean(status[key]);
6352
+ }
6353
+ });
6354
+ };
6355
+
6356
+ const _hoisted_1$c = ["draggable", "data-node-id", "data-is-container"];
6357
+ const _hoisted_2$9 = { class: "tree-node-label" };
6358
+ const _hoisted_3$5 = { class: "tree-node-tool" };
6359
+ const _hoisted_4$5 = {
6360
+ key: 0,
6361
+ class: "m-editor-tree-node-children"
6362
+ };
6363
+ const _sfc_main$m = /* @__PURE__ */ defineComponent({
6364
+ ...{
6365
+ name: "MEditorTreeNode"
6366
+ },
6367
+ __name: "TreeNode",
6368
+ props: {
6369
+ data: {},
6370
+ nodeStatusMap: {},
6371
+ indent: { default: 0 }
6372
+ },
6373
+ emits: ["node-dragstart", "node-dragleave", "node-dragend", "node-contextmenu", "node-mouseenter", "node-click"],
6374
+ setup(__props, { emit }) {
6375
+ const props = __props;
6376
+ const treeEmit = inject("treeEmit");
6377
+ const nodeStatus = computed(
6378
+ () => props.nodeStatusMap?.get(props.data.id) || {
6379
+ selected: false,
6380
+ expand: false,
6381
+ visible: false,
6382
+ draggable: false
6383
+ }
6384
+ );
6385
+ const expanded = computed(() => nodeStatus.value.expand);
6386
+ const selected = computed(() => nodeStatus.value.selected);
6387
+ const visible = computed(() => nodeStatus.value.visible);
6388
+ const draggable = computed(() => nodeStatus.value.draggable);
6389
+ const hasChilren = computed(() => props.data.items && props.data.items.length > 0);
6390
+ const handleDragStart = (event) => {
6391
+ treeEmit?.("node-dragstart", event, props.data);
6392
+ };
6393
+ const handleDragLeave = (event) => {
6394
+ treeEmit?.("node-dragleave", event, props.data);
6395
+ };
6396
+ const handleDragEnd = (event) => {
6397
+ treeEmit?.("node-dragend", event, props.data);
6398
+ };
6399
+ const nodeContentmenuHandler = (event) => {
6400
+ treeEmit?.("node-contextmenu", event, props.data);
6401
+ };
6402
+ const mouseenterHandler = (event) => {
6403
+ treeEmit?.("node-mouseenter", event, props.data);
6404
+ };
6405
+ const expandHandler = () => {
6406
+ updateStatus(props.nodeStatusMap, props.data.id, {
6407
+ expand: !expanded.value
6330
6408
  });
6331
6409
  };
6410
+ const nodeClickHandler = (event) => {
6411
+ treeEmit?.("node-click", event, props.data);
6412
+ };
6413
+ return (_ctx, _cache) => {
6414
+ const _component_TreeNode = resolveComponent("TreeNode", true);
6415
+ return withDirectives((openBlock(), createElementBlock("div", {
6416
+ class: "m-editor-tree-node",
6417
+ draggable: draggable.value,
6418
+ "data-node-id": _ctx.data.id,
6419
+ "data-is-container": Array.isArray(_ctx.data.items),
6420
+ onDragstart: handleDragStart,
6421
+ onDragleave: handleDragLeave,
6422
+ onDragend: handleDragEnd
6423
+ }, [
6424
+ createElementVNode("div", {
6425
+ class: normalizeClass(["tree-node", { selected: selected.value, expanded: expanded.value }]),
6426
+ style: normalizeStyle(`padding-left: ${_ctx.indent}px`),
6427
+ onContextmenu: nodeContentmenuHandler,
6428
+ onMouseenter: mouseenterHandler
6429
+ }, [
6430
+ createVNode(_sfc_main$N, {
6431
+ class: "expand-icon",
6432
+ style: normalizeStyle(hasChilren.value ? "" : "color: transparent; cursor: default"),
6433
+ icon: expanded.value ? unref(ArrowDown) : unref(ArrowRight),
6434
+ onClick: expandHandler
6435
+ }, null, 8, ["style", "icon"]),
6436
+ createElementVNode("div", {
6437
+ class: "tree-node-content",
6438
+ onClick: nodeClickHandler
6439
+ }, [
6440
+ renderSlot(_ctx.$slots, "tree-node-content", { data: _ctx.data }, () => [
6441
+ createElementVNode("div", _hoisted_2$9, toDisplayString(`${_ctx.data.name} (${_ctx.data.id})`), 1),
6442
+ createElementVNode("div", _hoisted_3$5, [
6443
+ renderSlot(_ctx.$slots, "tree-node-tool", { data: _ctx.data })
6444
+ ])
6445
+ ])
6446
+ ])
6447
+ ], 38),
6448
+ hasChilren.value && expanded.value ? (openBlock(), createElementBlock("div", _hoisted_4$5, [
6449
+ (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.data.items, (item) => {
6450
+ return openBlock(), createBlock(_component_TreeNode, {
6451
+ key: item.id,
6452
+ data: item,
6453
+ "node-status-map": _ctx.nodeStatusMap,
6454
+ indent: _ctx.indent + 11
6455
+ }, {
6456
+ "tree-node-content": withCtx(({ data: nodeData }) => [
6457
+ renderSlot(_ctx.$slots, "tree-node-content", { data: nodeData })
6458
+ ]),
6459
+ "tree-node-tool": withCtx(({ data: nodeData }) => [
6460
+ renderSlot(_ctx.$slots, "tree-node-tool", { data: nodeData })
6461
+ ]),
6462
+ _: 2
6463
+ }, 1032, ["data", "node-status-map", "indent"]);
6464
+ }), 128))
6465
+ ])) : createCommentVNode("", true)
6466
+ ], 40, _hoisted_1$c)), [
6467
+ [vShow, visible.value]
6468
+ ]);
6469
+ };
6332
6470
  }
6333
6471
  });
6334
6472
 
6473
+ const _hoisted_1$b = { key: 1 };
6335
6474
  const _sfc_main$l = /* @__PURE__ */ defineComponent({
6475
+ ...{
6476
+ name: "MEditorTree"
6477
+ },
6478
+ __name: "Tree",
6479
+ props: {
6480
+ data: {},
6481
+ nodeStatusMap: {},
6482
+ indent: { default: 0 },
6483
+ emptyText: { default: "暂无数据" }
6484
+ },
6485
+ emits: ["node-dragover", "node-dragstart", "node-dragleave", "node-dragend", "node-contextmenu", "node-mouseenter", "node-click"],
6486
+ setup(__props, { emit }) {
6487
+ provide("treeEmit", emit);
6488
+ const handleDragOver = (event) => {
6489
+ emit("node-dragover", event);
6490
+ };
6491
+ return (_ctx, _cache) => {
6492
+ return openBlock(), createElementBlock("div", {
6493
+ class: "m-editor-tree",
6494
+ onDragover: handleDragOver
6495
+ }, [
6496
+ _ctx.data?.length ? (openBlock(true), createElementBlock(Fragment, { key: 0 }, renderList(_ctx.data, (item) => {
6497
+ return openBlock(), createBlock(_sfc_main$m, {
6498
+ key: item.id,
6499
+ data: item,
6500
+ indent: _ctx.indent,
6501
+ "node-status-map": _ctx.nodeStatusMap
6502
+ }, {
6503
+ "tree-node-content": withCtx(({ data: nodeData }) => [
6504
+ renderSlot(_ctx.$slots, "tree-node-content", { data: nodeData })
6505
+ ]),
6506
+ "tree-node-tool": withCtx(({ data: nodeData }) => [
6507
+ renderSlot(_ctx.$slots, "tree-node-tool", { data: nodeData })
6508
+ ]),
6509
+ _: 2
6510
+ }, 1032, ["data", "indent", "node-status-map"]);
6511
+ }), 128)) : (openBlock(), createElementBlock("div", _hoisted_1$b, [
6512
+ createElementVNode("p", null, toDisplayString(_ctx.emptyText), 1)
6513
+ ]))
6514
+ ], 32);
6515
+ };
6516
+ }
6517
+ });
6518
+
6519
+ const _sfc_main$k = /* @__PURE__ */ defineComponent({
6336
6520
  ...{
6337
6521
  name: "MEditorContentMenu"
6338
6522
  },
@@ -6398,11 +6582,8 @@ const _sfc_main$l = /* @__PURE__ */ defineComponent({
6398
6582
  const show = (e) => {
6399
6583
  setTimeout(() => {
6400
6584
  visible.value = true;
6401
- if (!e) {
6402
- return;
6403
- }
6404
6585
  nextTick(() => {
6405
- setPosition(e);
6586
+ e && setPosition(e);
6406
6587
  emit("show");
6407
6588
  });
6408
6589
  }, 300);
@@ -6465,7 +6646,7 @@ const _sfc_main$l = /* @__PURE__ */ defineComponent({
6465
6646
  renderSlot(_ctx.$slots, "title"),
6466
6647
  createElementVNode("div", null, [
6467
6648
  (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.menuData, (item, index) => {
6468
- return openBlock(), createBlock(_sfc_main$w, {
6649
+ return openBlock(), createBlock(_sfc_main$x, {
6469
6650
  "event-type": "mouseup",
6470
6651
  ref_for: true,
6471
6652
  ref_key: "buttons",
@@ -6500,7 +6681,7 @@ const _sfc_main$l = /* @__PURE__ */ defineComponent({
6500
6681
  }
6501
6682
  });
6502
6683
 
6503
- const _hoisted_1$b = {
6684
+ const _hoisted_1$a = {
6504
6685
  width: "1em",
6505
6686
  height: "1em",
6506
6687
  viewBox: "0 0 16 16",
@@ -6508,26 +6689,26 @@ const _hoisted_1$b = {
6508
6689
  fill: "currentColor",
6509
6690
  xmlns: "http://www.w3.org/2000/svg"
6510
6691
  };
6511
- const _hoisted_2$9 = /* @__PURE__ */ createElementVNode("path", {
6692
+ const _hoisted_2$8 = /* @__PURE__ */ createElementVNode("path", {
6512
6693
  "fill-rule": "evenodd",
6513
6694
  d: "M9.828 4H2.19a1 1 0 0 0-.996 1.09l.637 7a1 1 0 0 0 .995.91H9v1H2.826a2 2 0 0 1-1.991-1.819l-.637-7a1.99 1.99 0 0 1 .342-1.31L.5 3a2 2 0 0 1 2-2h3.672a2 2 0 0 1 1.414.586l.828.828A2 2 0 0 0 9.828 3h3.982a2 2 0 0 1 1.992 2.181L15.546 8H14.54l.265-2.91A1 1 0 0 0 13.81 4H9.828zm-2.95-1.707L7.587 3H2.19c-.24 0-.47.042-.684.12L1.5 2.98a1 1 0 0 1 1-.98h3.672a1 1 0 0 1 .707.293z"
6514
6695
  }, null, -1);
6515
- const _hoisted_3$5 = /* @__PURE__ */ createElementVNode("path", {
6696
+ const _hoisted_3$4 = /* @__PURE__ */ createElementVNode("path", {
6516
6697
  "fill-rule": "evenodd",
6517
6698
  d: "M11 11.5a.5.5 0 0 1 .5-.5h4a.5.5 0 0 1 0 1h-4a.5.5 0 0 1-.5-.5z"
6518
6699
  }, null, -1);
6519
- const _hoisted_4$5 = [
6520
- _hoisted_2$9,
6521
- _hoisted_3$5
6700
+ const _hoisted_4$4 = [
6701
+ _hoisted_2$8,
6702
+ _hoisted_3$4
6522
6703
  ];
6523
- const _sfc_main$k = /* @__PURE__ */ defineComponent({
6704
+ const _sfc_main$j = /* @__PURE__ */ defineComponent({
6524
6705
  ...{
6525
6706
  name: "MEditorFolderMinusIcon"
6526
6707
  },
6527
6708
  __name: "FolderMinusIcon",
6528
6709
  setup(__props) {
6529
6710
  return (_ctx, _cache) => {
6530
- return openBlock(), createElementBlock("svg", _hoisted_1$b, _hoisted_4$5);
6711
+ return openBlock(), createElementBlock("svg", _hoisted_1$a, _hoisted_4$4);
6531
6712
  };
6532
6713
  }
6533
6714
  });
@@ -6607,7 +6788,7 @@ const useMoveToMenu = (services) => {
6607
6788
  };
6608
6789
  };
6609
6790
 
6610
- const _sfc_main$j = /* @__PURE__ */ defineComponent({
6791
+ const _sfc_main$i = /* @__PURE__ */ defineComponent({
6611
6792
  ...{
6612
6793
  name: "MEditorLayerMenu"
6613
6794
  },
@@ -6670,7 +6851,7 @@ const _sfc_main$j = /* @__PURE__ */ defineComponent({
6670
6851
  {
6671
6852
  type: "button",
6672
6853
  text: "全部折叠",
6673
- icon: _sfc_main$k,
6854
+ icon: _sfc_main$j,
6674
6855
  display: () => isPage(node.value),
6675
6856
  handler: () => {
6676
6857
  emit("collapse-all");
@@ -6696,7 +6877,7 @@ const _sfc_main$j = /* @__PURE__ */ defineComponent({
6696
6877
  show
6697
6878
  });
6698
6879
  return (_ctx, _cache) => {
6699
- return openBlock(), createBlock(_sfc_main$l, {
6880
+ return openBlock(), createBlock(_sfc_main$k, {
6700
6881
  "menu-data": menuData.value,
6701
6882
  ref_key: "menu",
6702
6883
  ref: menu,
@@ -6706,7 +6887,7 @@ const _sfc_main$j = /* @__PURE__ */ defineComponent({
6706
6887
  }
6707
6888
  });
6708
6889
 
6709
- const _sfc_main$i = /* @__PURE__ */ defineComponent({
6890
+ const _sfc_main$h = /* @__PURE__ */ defineComponent({
6710
6891
  __name: "LayerNodeTool",
6711
6892
  props: {
6712
6893
  data: {}
@@ -6725,12 +6906,12 @@ const _sfc_main$i = /* @__PURE__ */ defineComponent({
6725
6906
  };
6726
6907
  return (_ctx, _cache) => {
6727
6908
  return _ctx.data.type !== "page" ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
6728
- _ctx.data.visible === false ? (openBlock(), createBlock(_sfc_main$M, {
6909
+ _ctx.data.visible === false ? (openBlock(), createBlock(_sfc_main$N, {
6729
6910
  key: 0,
6730
6911
  icon: unref(Hide),
6731
6912
  onClick: _cache[0] || (_cache[0] = withModifiers(($event) => setNodeVisible(true), ["stop"])),
6732
6913
  title: "点击显示"
6733
- }, null, 8, ["icon"])) : (openBlock(), createBlock(_sfc_main$M, {
6914
+ }, null, 8, ["icon"])) : (openBlock(), createBlock(_sfc_main$N, {
6734
6915
  key: 1,
6735
6916
  icon: unref(View),
6736
6917
  onClick: _cache[1] || (_cache[1] = withModifiers(($event) => setNodeVisible(false), ["stop"])),
@@ -6742,6 +6923,75 @@ const _sfc_main$i = /* @__PURE__ */ defineComponent({
6742
6923
  }
6743
6924
  });
6744
6925
 
6926
+ const useClick = (services, isCtrlKeyDown, nodeStatusMap) => {
6927
+ const select = async (data) => {
6928
+ if (!data.id) {
6929
+ throw new Error("没有id");
6930
+ }
6931
+ if (isCtrlKeyDown.value) {
6932
+ multiSelect(data);
6933
+ } else {
6934
+ await services?.editorService.select(data);
6935
+ services?.editorService.get("stage")?.select(data.id);
6936
+ }
6937
+ };
6938
+ const multiSelect = async (data) => {
6939
+ const nodes = services?.editorService.get("nodes") || [];
6940
+ const newNodes = [];
6941
+ let isCancel = false;
6942
+ nodes.forEach((node) => {
6943
+ if (node.id === data.id) {
6944
+ isCancel = true;
6945
+ return;
6946
+ }
6947
+ newNodes.push(node.id);
6948
+ });
6949
+ if (!isCancel || newNodes.length === 0) {
6950
+ newNodes.push(data.id);
6951
+ }
6952
+ await services?.editorService.multiSelect(newNodes);
6953
+ services?.editorService.get("stage")?.multiSelect(newNodes);
6954
+ };
6955
+ const throttleTime = 300;
6956
+ const highlightHandler = throttle((event, data) => {
6957
+ highlight(data);
6958
+ }, throttleTime);
6959
+ const highlight = (data) => {
6960
+ services?.editorService?.highlight(data);
6961
+ services?.editorService?.get("stage")?.highlight(data.id);
6962
+ };
6963
+ const nodeClickHandler = (event, data) => {
6964
+ if (!nodeStatusMap?.value)
6965
+ return;
6966
+ if (services?.uiService.get("uiSelectMode")) {
6967
+ document.dispatchEvent(new CustomEvent(UI_SELECT_MODE_EVENT_NAME, { detail: data }));
6968
+ return;
6969
+ }
6970
+ if (data.items && data.items.length > 0 && !isCtrlKeyDown.value) {
6971
+ updateStatus(nodeStatusMap.value, data.id, {
6972
+ expand: true
6973
+ });
6974
+ }
6975
+ nextTick(() => {
6976
+ select(data);
6977
+ });
6978
+ };
6979
+ const menu = ref();
6980
+ return {
6981
+ menu,
6982
+ nodeClickHandler,
6983
+ nodeContentmenuHandler(event, data) {
6984
+ event.preventDefault();
6985
+ const nodes = services?.editorService.get("nodes") || [];
6986
+ if (nodes.length < 2 || !nodes.includes(data)) {
6987
+ nodeClickHandler(event, data);
6988
+ }
6989
+ menu.value?.show(event);
6990
+ },
6991
+ highlightHandler
6992
+ };
6993
+ };
6994
+
6745
6995
  const dragState = {
6746
6996
  dragOverNodeId: "",
6747
6997
  dropType: "",
@@ -6786,7 +7036,7 @@ const useDrag = (services) => {
6786
7036
  if (!event.target)
6787
7037
  return;
6788
7038
  const targetEl = getNodeEl(event.target);
6789
- if (!targetEl)
7039
+ if (!targetEl?.draggable)
6790
7040
  return;
6791
7041
  const labelEl = targetEl.children[0];
6792
7042
  if (!labelEl)
@@ -6860,16 +7110,6 @@ const useDrag = (services) => {
6860
7110
  };
6861
7111
  };
6862
7112
 
6863
- const updateStatus = (nodeStatusMap, id, status) => {
6864
- const nodeStatus = nodeStatusMap.get(id);
6865
- if (!nodeStatus)
6866
- return;
6867
- getKeys(status).forEach((key) => {
6868
- if (nodeStatus[key] !== void 0 && status[key] !== void 0) {
6869
- nodeStatus[key] = Boolean(status[key]);
6870
- }
6871
- });
6872
- };
6873
7113
  const useFilter = (nodeStatusMap, page) => {
6874
7114
  const filterIsMatch = (value, data) => {
6875
7115
  if (!value) {
@@ -6914,179 +7154,6 @@ const useFilter = (nodeStatusMap, page) => {
6914
7154
  };
6915
7155
  };
6916
7156
 
6917
- const _hoisted_1$a = ["draggable", "data-node-id", "data-is-container"];
6918
- const _hoisted_2$8 = { class: "layer-node-label" };
6919
- const _hoisted_3$4 = { class: "layer-node-tool" };
6920
- const _hoisted_4$4 = {
6921
- key: 0,
6922
- class: "magic-editor-layer-node-children"
6923
- };
6924
- const throttleTime = 300;
6925
- const _sfc_main$h = /* @__PURE__ */ defineComponent({
6926
- ...{
6927
- name: "MEditorLayerNode"
6928
- },
6929
- __name: "LayerNode",
6930
- props: {
6931
- data: {},
6932
- parent: {},
6933
- indent: { default: 0 },
6934
- filterText: { default: "" },
6935
- isCtrlKeyDown: { type: Boolean, default: false }
6936
- },
6937
- emits: ["node-contextmenu"],
6938
- setup(__props, { emit }) {
6939
- const props = __props;
6940
- const services = inject("services");
6941
- const nodeStatusMap = inject("nodeStatusMap");
6942
- const editorService = services?.editorService;
6943
- const uiService = services?.uiService;
6944
- const nodeStatus = computed(
6945
- () => nodeStatusMap?.value?.get(props.data.id) || {
6946
- selected: false,
6947
- expand: false,
6948
- visible: false
6949
- }
6950
- );
6951
- const expanded = computed(() => nodeStatus.value.expand);
6952
- const selected = computed(() => nodeStatus.value.selected);
6953
- const visible = computed(() => nodeStatus.value.visible);
6954
- const hasChilren = computed(() => props.data.items?.length > 0);
6955
- const nodeEl = ref();
6956
- const { handleDragStart, handleDragEnd, handleDragLeave } = useDrag(services);
6957
- const expandHandler = () => {
6958
- if (!nodeStatusMap?.value)
6959
- return;
6960
- updateStatus(nodeStatusMap.value, props.data.id, {
6961
- expand: !expanded.value
6962
- });
6963
- };
6964
- const nodeClickHandler = () => {
6965
- if (!nodeStatusMap?.value)
6966
- return;
6967
- if (uiService?.get("uiSelectMode")) {
6968
- document.dispatchEvent(new CustomEvent(UI_SELECT_MODE_EVENT_NAME, { detail: props.data }));
6969
- return;
6970
- }
6971
- if (hasChilren.value && !props.isCtrlKeyDown) {
6972
- updateStatus(nodeStatusMap.value, props.data.id, {
6973
- expand: true
6974
- });
6975
- }
6976
- nextTick(() => {
6977
- select(props.data);
6978
- });
6979
- };
6980
- const contextmenuHandler = (event) => {
6981
- event.preventDefault();
6982
- const nodes = editorService?.get("nodes") || [];
6983
- if (nodes.length < 2 || !nodes.includes(props.data)) {
6984
- nodeClickHandler();
6985
- }
6986
- emit("node-contextmenu", event, props.data);
6987
- };
6988
- const nodeContentmenuHandler = (event, node) => {
6989
- emit("node-contextmenu", event, node);
6990
- };
6991
- const select = async (data) => {
6992
- if (!data.id) {
6993
- throw new Error("没有id");
6994
- }
6995
- if (props.isCtrlKeyDown) {
6996
- multiSelect(data);
6997
- } else {
6998
- await editorService?.select(data);
6999
- editorService?.get("stage")?.select(data.id);
7000
- }
7001
- };
7002
- const multiSelect = async (data) => {
7003
- const nodes = editorService?.get("nodes") || [];
7004
- const newNodes = [];
7005
- let isCancel = false;
7006
- nodes.forEach((node) => {
7007
- if (node.id === data.id) {
7008
- isCancel = true;
7009
- return;
7010
- }
7011
- newNodes.push(node.id);
7012
- });
7013
- if (!isCancel || newNodes.length === 0) {
7014
- newNodes.push(data.id);
7015
- }
7016
- await editorService?.multiSelect(newNodes);
7017
- editorService?.get("stage")?.multiSelect(newNodes);
7018
- };
7019
- const highlightHandler = throttle(() => {
7020
- highlight();
7021
- }, throttleTime);
7022
- const highlight = () => {
7023
- editorService?.highlight(props.data);
7024
- editorService?.get("stage")?.highlight(props.data.id);
7025
- };
7026
- return (_ctx, _cache) => {
7027
- const _component_LayerNode = resolveComponent("LayerNode", true);
7028
- return withDirectives((openBlock(), createElementBlock("div", {
7029
- class: "magic-editor-layer-node",
7030
- ref_key: "nodeEl",
7031
- ref: nodeEl,
7032
- draggable: !unref(isPage)(_ctx.data),
7033
- "data-node-id": _ctx.data.id,
7034
- "data-is-container": Array.isArray(_ctx.data.items),
7035
- onDragstart: _cache[1] || (_cache[1] = //@ts-ignore
7036
- (...args) => unref(handleDragStart) && unref(handleDragStart)(...args)),
7037
- onDragleave: _cache[2] || (_cache[2] = //@ts-ignore
7038
- (...args) => unref(handleDragLeave) && unref(handleDragLeave)(...args)),
7039
- onDragend: _cache[3] || (_cache[3] = ($event) => unref(handleDragEnd)($event, _ctx.data))
7040
- }, [
7041
- createElementVNode("div", {
7042
- class: normalizeClass(["layer-node", { selected: selected.value, expanded: expanded.value }]),
7043
- style: normalizeStyle(`padding-left: ${_ctx.indent}px`),
7044
- onContextmenu: contextmenuHandler,
7045
- onMouseenter: _cache[0] || (_cache[0] = ($event) => unref(highlightHandler)())
7046
- }, [
7047
- createVNode(_sfc_main$M, {
7048
- class: "expand-icon",
7049
- style: normalizeStyle(hasChilren.value ? "" : "color: transparent; cursor: default"),
7050
- icon: expanded.value ? unref(ArrowDown) : unref(ArrowRight),
7051
- onClick: expandHandler
7052
- }, null, 8, ["style", "icon"]),
7053
- createElementVNode("div", {
7054
- class: "layer-node-content",
7055
- onClick: nodeClickHandler
7056
- }, [
7057
- renderSlot(_ctx.$slots, "layer-node-content", { data: _ctx.data }, () => [
7058
- createElementVNode("div", _hoisted_2$8, toDisplayString(`${_ctx.data.name} (${_ctx.data.id})`), 1),
7059
- createElementVNode("div", _hoisted_3$4, [
7060
- createVNode(_sfc_main$i, { data: _ctx.data }, null, 8, ["data"])
7061
- ])
7062
- ])
7063
- ])
7064
- ], 38),
7065
- hasChilren.value && expanded.value ? (openBlock(), createElementBlock("div", _hoisted_4$4, [
7066
- (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.data.items, (item) => {
7067
- return openBlock(), createBlock(_component_LayerNode, {
7068
- data: item,
7069
- parent: _ctx.data,
7070
- key: item.id,
7071
- indent: _ctx.indent + 11,
7072
- "filter-text": _ctx.filterText,
7073
- "is-ctrl-key-down": _ctx.isCtrlKeyDown,
7074
- onNodeContextmenu: nodeContentmenuHandler
7075
- }, {
7076
- "layer-node-content": withCtx(({ data: nodeData }) => [
7077
- renderSlot(_ctx.$slots, "layer-node-content", { data: nodeData })
7078
- ]),
7079
- _: 2
7080
- }, 1032, ["data", "parent", "indent", "filter-text", "is-ctrl-key-down"]);
7081
- }), 128))
7082
- ])) : createCommentVNode("", true)
7083
- ], 40, _hoisted_1$a)), [
7084
- [vShow, visible.value]
7085
- ]);
7086
- };
7087
- }
7088
- });
7089
-
7090
7157
  var KeyBindingContainerKey = /* @__PURE__ */ ((KeyBindingContainerKey2) => {
7091
7158
  KeyBindingContainerKey2["STAGE"] = "stage";
7092
7159
  KeyBindingContainerKey2["LAYER_PANEL"] = "layer-panel";
@@ -7238,7 +7305,7 @@ const useKeybinding = (services, contianer) => {
7238
7305
  watchEffect(() => {
7239
7306
  if (contianer.value) {
7240
7307
  globalThis.addEventListener("blur", windowBlurHandler);
7241
- keybindingService?.registeEl(KeyBindingContainerKey.LAYER_PANEL, contianer.value);
7308
+ keybindingService?.registeEl(KeyBindingContainerKey.LAYER_PANEL, contianer.value.$el);
7242
7309
  } else {
7243
7310
  globalThis.removeEventListener("blur", windowBlurHandler);
7244
7311
  keybindingService?.unregisteEl(KeyBindingContainerKey.LAYER_PANEL);
@@ -7254,14 +7321,16 @@ const createPageNodeStatus = (services, pageId) => {
7254
7321
  map.set(pageId, {
7255
7322
  visible: true,
7256
7323
  expand: true,
7257
- selected: true
7324
+ selected: true,
7325
+ draggable: false
7258
7326
  });
7259
7327
  services?.editorService.getNodeById(pageId)?.items.forEach(
7260
7328
  (node) => traverseNode(node, (node2) => {
7261
7329
  map.set(node2.id, {
7262
7330
  visible: true,
7263
7331
  expand: false,
7264
- selected: false
7332
+ selected: false,
7333
+ draggable: true
7265
7334
  });
7266
7335
  })
7267
7336
  );
@@ -7311,7 +7380,8 @@ const useNodeStatus = (services, page) => {
7311
7380
  nodeStatusMap.value?.set(node2.id, {
7312
7381
  visible: true,
7313
7382
  expand: Array.isArray(node2.items),
7314
- selected: true
7383
+ selected: true,
7384
+ draggable: true
7315
7385
  });
7316
7386
  });
7317
7387
  });
@@ -7340,13 +7410,11 @@ const _sfc_main$g = /* @__PURE__ */ defineComponent({
7340
7410
  setup(__props) {
7341
7411
  const services = inject("services");
7342
7412
  const editorService = services?.editorService;
7343
- const layerTreeContainer = ref();
7413
+ const tree = ref();
7344
7414
  const page = computed(() => editorService?.get("page"));
7345
- const root = computed(() => editorService?.get("root"));
7346
7415
  const { nodeStatusMap } = useNodeStatus(services, page);
7347
- const { isCtrlKeyDown } = useKeybinding(services, layerTreeContainer);
7348
- provide("nodeStatusMap", nodeStatusMap);
7349
- const { filterText, filterTextChangeHandler } = useFilter(nodeStatusMap, page);
7416
+ const { isCtrlKeyDown } = useKeybinding(services, tree);
7417
+ const { filterTextChangeHandler } = useFilter(nodeStatusMap, page);
7350
7418
  const collapseAllHandler = () => {
7351
7419
  if (!page.value || !nodeStatusMap.value)
7352
7420
  return;
@@ -7358,40 +7426,45 @@ const _sfc_main$g = /* @__PURE__ */ defineComponent({
7358
7426
  status.expand = false;
7359
7427
  }
7360
7428
  };
7361
- const menu = ref();
7362
- const contextmenu = (event) => {
7363
- event.preventDefault();
7364
- menu.value?.show(event);
7365
- };
7366
- const { handleDragOver } = useDrag(services);
7429
+ const { handleDragStart, handleDragEnd, handleDragLeave, handleDragOver } = useDrag(services);
7430
+ const {
7431
+ menu,
7432
+ nodeClickHandler,
7433
+ nodeContentmenuHandler,
7434
+ highlightHandler: mouseenterHandler
7435
+ } = useClick(services, isCtrlKeyDown, nodeStatusMap);
7367
7436
  return (_ctx, _cache) => {
7368
- return openBlock(), createBlock(unref(TMagicScrollbar), { class: "magic-editor-layer-panel" }, {
7437
+ return openBlock(), createBlock(unref(TMagicScrollbar), { class: "m-editor-layer-panel" }, {
7369
7438
  default: withCtx(() => [
7370
7439
  renderSlot(_ctx.$slots, "layer-panel-header"),
7371
- createVNode(_sfc_main$t, { onSearch: unref(filterTextChangeHandler) }, null, 8, ["onSearch"]),
7372
- createElementVNode("div", {
7373
- class: "magic-editor-layer-tree",
7374
- ref_key: "layerTreeContainer",
7375
- ref: layerTreeContainer,
7440
+ createVNode(_sfc_main$u, { onSearch: unref(filterTextChangeHandler) }, null, 8, ["onSearch"]),
7441
+ page.value && unref(nodeStatusMap) ? (openBlock(), createBlock(_sfc_main$l, {
7442
+ key: 0,
7376
7443
  tabindex: "-1",
7377
- onDragover: _cache[0] || (_cache[0] = //@ts-ignore
7378
- (...args) => unref(handleDragOver) && unref(handleDragOver)(...args))
7379
- }, [
7380
- page.value && root.value ? (openBlock(), createBlock(_sfc_main$h, {
7381
- key: 0,
7382
- data: page.value,
7383
- "filter-text": unref(filterText),
7384
- "is-ctrl-key-down": unref(isCtrlKeyDown),
7385
- onNodeContextmenu: contextmenu
7386
- }, {
7387
- "layer-node-content": withCtx(({ data: nodeData }) => [
7388
- renderSlot(_ctx.$slots, "layer-node-content", { data: nodeData })
7389
- ]),
7390
- _: 3
7391
- }, 8, ["data", "filter-text", "is-ctrl-key-down"])) : createCommentVNode("", true)
7392
- ], 544),
7444
+ ref_key: "tree",
7445
+ ref: tree,
7446
+ data: [page.value],
7447
+ "node-status-map": unref(nodeStatusMap),
7448
+ onNodeDragover: unref(handleDragOver),
7449
+ onNodeDragstart: unref(handleDragStart),
7450
+ onNodeDragleave: unref(handleDragLeave),
7451
+ onNodeDragend: unref(handleDragEnd),
7452
+ onNodeContextmenu: unref(nodeContentmenuHandler),
7453
+ onNodeMouseenter: unref(mouseenterHandler),
7454
+ onNodeClick: unref(nodeClickHandler)
7455
+ }, {
7456
+ "tree-node-tool": withCtx(({ data: nodeData }) => [
7457
+ renderSlot(_ctx.$slots, "layer-node-tool", { data: nodeData }, () => [
7458
+ createVNode(_sfc_main$h, { data: nodeData }, null, 8, ["data"])
7459
+ ])
7460
+ ]),
7461
+ "tree-node-content": withCtx(({ data: nodeData }) => [
7462
+ renderSlot(_ctx.$slots, "layer-node-content", { data: nodeData })
7463
+ ]),
7464
+ _: 3
7465
+ }, 8, ["data", "node-status-map", "onNodeDragover", "onNodeDragstart", "onNodeDragleave", "onNodeDragend", "onNodeContextmenu", "onNodeMouseenter", "onNodeClick"])) : createCommentVNode("", true),
7393
7466
  (openBlock(), createBlock(Teleport, { to: "body" }, [
7394
- createVNode(_sfc_main$j, {
7467
+ createVNode(_sfc_main$i, {
7395
7468
  ref_key: "menu",
7396
7469
  ref: menu,
7397
7470
  "layer-content-menu": _ctx.layerContentMenu,
@@ -7487,7 +7560,7 @@ const _sfc_main$f = /* @__PURE__ */ defineComponent({
7487
7560
  "model-value": collapseValue.value
7488
7561
  }, {
7489
7562
  default: withCtx(() => [
7490
- createVNode(_sfc_main$t, { onSearch: filterTextChangeHandler }),
7563
+ createVNode(_sfc_main$u, { onSearch: filterTextChangeHandler }),
7491
7564
  (openBlock(true), createElementBlock(Fragment, null, renderList(list.value, (group, index) => {
7492
7565
  return openBlock(), createElementBlock(Fragment, null, [
7493
7566
  group.items && group.items.length ? (openBlock(), createBlock(unref(TMagicCollapseItem), {
@@ -7495,7 +7568,7 @@ const _sfc_main$f = /* @__PURE__ */ defineComponent({
7495
7568
  name: `${index}`
7496
7569
  }, {
7497
7570
  title: withCtx(() => [
7498
- createVNode(_sfc_main$M, { icon: unref(Grid) }, null, 8, ["icon"]),
7571
+ createVNode(_sfc_main$N, { icon: unref(Grid) }, null, 8, ["icon"]),
7499
7572
  createTextVNode(toDisplayString(group.title), 1)
7500
7573
  ]),
7501
7574
  default: withCtx(() => [
@@ -7516,7 +7589,7 @@ const _sfc_main$f = /* @__PURE__ */ defineComponent({
7516
7589
  content: item.desc
7517
7590
  }, {
7518
7591
  default: withCtx(() => [
7519
- createVNode(_sfc_main$M, {
7592
+ createVNode(_sfc_main$N, {
7520
7593
  icon: item.icon
7521
7594
  }, null, 8, ["icon"])
7522
7595
  ]),
@@ -7591,7 +7664,7 @@ const _sfc_main$e = /* @__PURE__ */ defineComponent({
7591
7664
  type: "component",
7592
7665
  icon: EditPen,
7593
7666
  text: "代码编辑",
7594
- component: _sfc_main$p,
7667
+ component: _sfc_main$q,
7595
7668
  slots: {}
7596
7669
  },
7597
7670
  "data-source": {
@@ -7599,7 +7672,7 @@ const _sfc_main$e = /* @__PURE__ */ defineComponent({
7599
7672
  type: "component",
7600
7673
  icon: Coin,
7601
7674
  text: "数据源",
7602
- component: _sfc_main$m,
7675
+ component: _sfc_main$n,
7603
7676
  slots: {}
7604
7677
  }
7605
7678
  };
@@ -7624,7 +7697,7 @@ const _sfc_main$e = /* @__PURE__ */ defineComponent({
7624
7697
  key: config.$key ?? index,
7625
7698
  onClick: ($event) => activeTabName.value = config.text || `${index}`
7626
7699
  }, [
7627
- config.icon ? (openBlock(), createBlock(_sfc_main$M, {
7700
+ config.icon ? (openBlock(), createBlock(_sfc_main$N, {
7628
7701
  key: 0,
7629
7702
  icon: config.icon
7630
7703
  }, null, 8, ["icon"])) : createCommentVNode("", true),
@@ -7695,6 +7768,29 @@ const _sfc_main$e = /* @__PURE__ */ defineComponent({
7695
7768
  }, null, 8, ["data"])) : createCommentVNode("", true)
7696
7769
  ]),
7697
7770
  key: "5"
7771
+ } : void 0,
7772
+ config.$key === "layer" || config.slots?.layerNodeTool ? {
7773
+ name: "layer-node-tool",
7774
+ fn: withCtx(({ data: nodeData }) => [
7775
+ config.$key === "layer" ? renderSlot(_ctx.$slots, "layer-node-tool", {
7776
+ key: 0,
7777
+ data: nodeData
7778
+ }) : config.slots?.layerNodeTool ? (openBlock(), createBlock(resolveDynamicComponent(config.slots.layerNodeTool), {
7779
+ key: 1,
7780
+ data: nodeData
7781
+ }, null, 8, ["data"])) : createCommentVNode("", true)
7782
+ ]),
7783
+ key: "6"
7784
+ } : void 0,
7785
+ config.$key === "data-source" || config.slots?.codeBlockPanelTool ? {
7786
+ name: "data-source-panel-tool",
7787
+ fn: withCtx(({ data }) => [
7788
+ config.$key === "data-source" ? renderSlot(_ctx.$slots, "data-source-panel-tool", {
7789
+ key: 0,
7790
+ data
7791
+ }) : config.slots?.DataSourcePanelTool ? (openBlock(), createBlock(resolveDynamicComponent(config.slots.DataSourcePanelTool), { key: 1 })) : createCommentVNode("", true)
7792
+ ]),
7793
+ key: "7"
7698
7794
  } : void 0
7699
7795
  ]), 1040)) : createCommentVNode("", true)
7700
7796
  ])), [
@@ -8322,7 +8418,7 @@ const _sfc_main$9 = /* @__PURE__ */ defineComponent({
8322
8418
  content: _ctx.pinned ? "取消置于顶层自动隐藏" : "置于顶层不消失"
8323
8419
  }, {
8324
8420
  default: withCtx(() => [
8325
- createVNode(_sfc_main$M, {
8421
+ createVNode(_sfc_main$N, {
8326
8422
  style: { "margin-left": "10px", "cursor": "pointer" },
8327
8423
  icon: _ctx.pinned ? _sfc_main$a : _sfc_main$b,
8328
8424
  onClick: pinHandler
@@ -8338,7 +8434,7 @@ const _sfc_main$9 = /* @__PURE__ */ defineComponent({
8338
8434
  onClick: closeHandler
8339
8435
  }, {
8340
8436
  default: withCtx(() => [
8341
- createVNode(_sfc_main$M, { icon: unref(Close) }, null, 8, ["icon"])
8437
+ createVNode(_sfc_main$N, { icon: unref(Close) }, null, 8, ["icon"])
8342
8438
  ]),
8343
8439
  _: 1
8344
8440
  })
@@ -8348,6 +8444,7 @@ const _sfc_main$9 = /* @__PURE__ */ defineComponent({
8348
8444
  }
8349
8445
  });
8350
8446
 
8447
+ const PINNED_STATUE_CACHE_KEY = "tmagic-pinned-node-list-pinned-status";
8351
8448
  const _sfc_main$8 = /* @__PURE__ */ defineComponent({
8352
8449
  __name: "NodeListMenu",
8353
8450
  props: {
@@ -8357,7 +8454,8 @@ const _sfc_main$8 = /* @__PURE__ */ defineComponent({
8357
8454
  const props = __props;
8358
8455
  const menu = ref();
8359
8456
  const nodeList = ref([]);
8360
- const pinned = ref(false);
8457
+ const pinned = ref(Boolean(globalThis.localStorage.getItem(PINNED_STATUE_CACHE_KEY)));
8458
+ const firstShow = ref(true);
8361
8459
  const services = inject("services");
8362
8460
  const editorService = services?.editorService;
8363
8461
  const componentListService = services?.componentListService;
@@ -8406,7 +8504,8 @@ const _sfc_main$8 = /* @__PURE__ */ defineComponent({
8406
8504
  }
8407
8505
  nodeList.value = nodes;
8408
8506
  if (nodeList.value.length > 1) {
8409
- menu.value?.show(pinned.value ? void 0 : event);
8507
+ menu.value?.show(pinned.value && !firstShow.value ? void 0 : event);
8508
+ firstShow.value = false;
8410
8509
  }
8411
8510
  }, 1500);
8412
8511
  });
@@ -8464,8 +8563,11 @@ const _sfc_main$8 = /* @__PURE__ */ defineComponent({
8464
8563
  const closeHandler = () => {
8465
8564
  menu.value?.hide();
8466
8565
  };
8566
+ watch(pinned, () => {
8567
+ globalThis.localStorage.setItem(PINNED_STATUE_CACHE_KEY, pinned.value.toString());
8568
+ });
8467
8569
  return (_ctx, _cache) => {
8468
- return openBlock(), createBlock(_sfc_main$l, {
8570
+ return openBlock(), createBlock(_sfc_main$k, {
8469
8571
  ref_key: "menu",
8470
8572
  ref: menu,
8471
8573
  class: "magic-editor-node-list-menu",
@@ -8651,7 +8753,7 @@ const _sfc_main$6 = /* @__PURE__ */ defineComponent({
8651
8753
  };
8652
8754
  __expose({ show });
8653
8755
  return (_ctx, _cache) => {
8654
- return openBlock(), createBlock(_sfc_main$l, {
8756
+ return openBlock(), createBlock(_sfc_main$k, {
8655
8757
  "menu-data": menuData.value,
8656
8758
  ref_key: "menu",
8657
8759
  ref: menu
@@ -8984,14 +9086,14 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
8984
9086
  class: "m-editor-page-bar-item m-editor-page-bar-item-icon",
8985
9087
  onClick: addPage
8986
9088
  }, [
8987
- createVNode(_sfc_main$M, { icon: unref(Plus) }, null, 8, ["icon"])
9089
+ createVNode(_sfc_main$N, { icon: unref(Plus) }, null, 8, ["icon"])
8988
9090
  ])) : (openBlock(), createElementBlock("div", _hoisted_1$2)),
8989
9091
  canScroll.value ? (openBlock(), createElementBlock("div", {
8990
9092
  key: 2,
8991
9093
  class: "m-editor-page-bar-item m-editor-page-bar-item-icon",
8992
9094
  onClick: _cache[0] || (_cache[0] = ($event) => scroll("left"))
8993
9095
  }, [
8994
- createVNode(_sfc_main$M, { icon: unref(ArrowLeftBold) }, null, 8, ["icon"])
9096
+ createVNode(_sfc_main$N, { icon: unref(ArrowLeftBold) }, null, 8, ["icon"])
8995
9097
  ])) : createCommentVNode("", true),
8996
9098
  pageLength.value ? (openBlock(), createElementBlock("div", {
8997
9099
  key: 3,
@@ -9007,7 +9109,7 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
9007
9109
  class: "m-editor-page-bar-item m-editor-page-bar-item-icon",
9008
9110
  onClick: _cache[1] || (_cache[1] = ($event) => scroll("right"))
9009
9111
  }, [
9010
- createVNode(_sfc_main$M, { icon: unref(ArrowRightBold) }, null, 8, ["icon"])
9112
+ createVNode(_sfc_main$N, { icon: unref(ArrowRightBold) }, null, 8, ["icon"])
9011
9113
  ])) : createCommentVNode("", true)
9012
9114
  ], 512);
9013
9115
  };
@@ -9079,7 +9181,7 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
9079
9181
  default: withCtx(() => [
9080
9182
  createElementVNode("div", null, [
9081
9183
  renderSlot(_ctx.$slots, "page-bar-popover", { page: item }, () => [
9082
- createVNode(_sfc_main$w, {
9184
+ createVNode(_sfc_main$x, {
9083
9185
  data: {
9084
9186
  type: "button",
9085
9187
  text: "复制",
@@ -9087,7 +9189,7 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
9087
9189
  handler: () => copy(item)
9088
9190
  }
9089
9191
  }, null, 8, ["data"]),
9090
- createVNode(_sfc_main$w, {
9192
+ createVNode(_sfc_main$x, {
9091
9193
  data: {
9092
9194
  type: "button",
9093
9195
  text: "删除",
@@ -9577,7 +9679,7 @@ class Watcher extends EventEmitter {
9577
9679
  const doCollect = (key, value) => {
9578
9680
  const keyIsItems = key === "items";
9579
9681
  const fullKey = prop ? `${prop}.${key}` : key;
9580
- if (target.isTarget(key, value)) {
9682
+ if (target.isTarget(fullKey, value)) {
9581
9683
  target.updateDep(node, fullKey);
9582
9684
  this.emit("update-dep", node, fullKey);
9583
9685
  } else if (!keyIsItems && Array.isArray(value)) {
@@ -9865,7 +9967,12 @@ const createDataSourceTarget = (id) => new Target({
9865
9967
  const createDataSourceCondTarget = (id) => new Target({
9866
9968
  type: DepTargetType.DATA_SOURCE_COND,
9867
9969
  id,
9868
- isTarget: (key, value) => Array.isArray(value) && value[0] === id && Boolean(dataSourceService.getDataSourceById(id))
9970
+ isTarget: (key, value) => {
9971
+ if (!Array.isArray(value) || value[0] !== id || !`${key}`.startsWith("displayConds"))
9972
+ return false;
9973
+ const ds = dataSourceService.getDataSourceById(id);
9974
+ return Boolean(ds?.fields?.find((field) => field.name === value[1]));
9975
+ }
9869
9976
  });
9870
9977
  const createDataSourceMethodTarget = (id) => new Target({
9871
9978
  type: DepTargetType.DATA_SOURCE_METHOD,
@@ -10264,13 +10371,13 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
10264
10371
  );
10265
10372
  __expose(services);
10266
10373
  return (_ctx, _cache) => {
10267
- return openBlock(), createBlock(_sfc_main$x, null, {
10374
+ return openBlock(), createBlock(_sfc_main$y, null, {
10268
10375
  header: withCtx(() => [
10269
10376
  renderSlot(_ctx.$slots, "header")
10270
10377
  ]),
10271
10378
  nav: withCtx(() => [
10272
10379
  renderSlot(_ctx.$slots, "nav", { editorService: unref(editorService) }, () => [
10273
- createVNode(_sfc_main$v, { data: _ctx.menu }, null, 8, ["data"])
10380
+ createVNode(_sfc_main$w, { data: _ctx.menu }, null, 8, ["data"])
10274
10381
  ])
10275
10382
  ]),
10276
10383
  "content-before": withCtx(() => [
@@ -10291,6 +10398,9 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
10291
10398
  "layer-node-content": withCtx(({ data }) => [
10292
10399
  renderSlot(_ctx.$slots, "layer-node-content", { data })
10293
10400
  ]),
10401
+ "layer-node-tool": withCtx(({ data }) => [
10402
+ renderSlot(_ctx.$slots, "layer-node-tool", { data })
10403
+ ]),
10294
10404
  "component-list-panel-header": withCtx(() => [
10295
10405
  renderSlot(_ctx.$slots, "component-list-panel-header")
10296
10406
  ]),
@@ -10306,6 +10416,9 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
10306
10416
  data
10307
10417
  })
10308
10418
  ]),
10419
+ "data-source-panel-tool": withCtx(({ data }) => [
10420
+ renderSlot(_ctx.$slots, "data-source-panel-tool", { data })
10421
+ ]),
10309
10422
  _: 3
10310
10423
  }, 8, ["data", "layer-content-menu"])
10311
10424
  ])
@@ -10331,7 +10444,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
10331
10444
  ]),
10332
10445
  "props-panel": withCtx(() => [
10333
10446
  renderSlot(_ctx.$slots, "props-panel", {}, () => [
10334
- createVNode(_sfc_main$u, {
10447
+ createVNode(_sfc_main$v, {
10335
10448
  "extend-state": _ctx.extendFormState,
10336
10449
  onMounted: _cache[0] || (_cache[0] = (instance) => _ctx.$emit("props-panel-mounted", instance))
10337
10450
  }, {
@@ -10369,23 +10482,23 @@ const index = {
10369
10482
  app.config.globalProperties.$TMAGIC_EDITOR = option;
10370
10483
  setConfig(option);
10371
10484
  app.component(_sfc_main.name, _sfc_main);
10372
- app.component("m-fields-ui-select", _sfc_main$B);
10373
- app.component("m-fields-code-link", _sfc_main$Q);
10374
- app.component("m-fields-vs-code", _sfc_main$R);
10375
- app.component("magic-code-editor", _sfc_main$S);
10376
- app.component("m-fields-code-select", _sfc_main$P);
10377
- app.component("m-fields-code-select-col", _sfc_main$L);
10378
- app.component("m-fields-event-select", _sfc_main$D);
10379
- app.component("m-fields-data-source-fields", _sfc_main$K);
10380
- app.component("m-fields-data-source-mocks", _sfc_main$F);
10381
- app.component("m-fields-key-value", _sfc_main$C);
10382
- app.component("m-fields-data-source-input", _sfc_main$I);
10383
- app.component("m-fields-data-source-select", _sfc_main$E);
10384
- app.component("m-fields-data-source-methods", _sfc_main$H);
10385
- app.component("m-fields-data-source-method-select", _sfc_main$G);
10386
- app.component("m-fields-data-source-field-select", _sfc_main$J);
10485
+ app.component("m-fields-ui-select", _sfc_main$C);
10486
+ app.component("m-fields-code-link", _sfc_main$R);
10487
+ app.component("m-fields-vs-code", _sfc_main$S);
10488
+ app.component("magic-code-editor", _sfc_main$T);
10489
+ app.component("m-fields-code-select", _sfc_main$Q);
10490
+ app.component("m-fields-code-select-col", _sfc_main$M);
10491
+ app.component("m-fields-event-select", _sfc_main$E);
10492
+ app.component("m-fields-data-source-fields", _sfc_main$L);
10493
+ app.component("m-fields-data-source-mocks", _sfc_main$G);
10494
+ app.component("m-fields-key-value", _sfc_main$D);
10495
+ app.component("m-fields-data-source-input", _sfc_main$J);
10496
+ app.component("m-fields-data-source-select", _sfc_main$F);
10497
+ app.component("m-fields-data-source-methods", _sfc_main$I);
10498
+ app.component("m-fields-data-source-method-select", _sfc_main$H);
10499
+ app.component("m-fields-data-source-field-select", _sfc_main$K);
10387
10500
  }
10388
10501
  };
10389
10502
 
10390
- export { CODE_DRAFT_STORAGE_KEY, COPY_STORAGE_KEY, _sfc_main$O as CodeBlockEditor, _sfc_main$q as CodeBlockList, _sfc_main$p as CodeBlockListPanel, CodeDeleteErrorType, _sfc_main$P as CodeSelect, _sfc_main$L as CodeSelectCol, ColumnLayout, _sfc_main$f as ComponentListPanel, _sfc_main$l as ContentMenu, _sfc_main$J as DataSourceFieldSelect, _sfc_main$K as DataSourceFields, _sfc_main$I as DataSourceInput, _sfc_main$G as DataSourceMethodSelect, _sfc_main$H as DataSourceMethods, _sfc_main$F as DataSourceMocks, _sfc_main$E as DataSourceSelect, DepTargetType, DragType, _sfc_main$D as EventSelect, Fixed2Other, H_GUIDE_LINE_STORAGE_KEY, _sfc_main$M as Icon, KeyBindingCommand, _sfc_main$C as KeyValue, Keys, LayerOffset, _sfc_main$g as LayerPanel, Layout, _sfc_main$z as LayoutContainer, _sfc_main$u as PropsPanel, _sfc_main$A as Resizer, _sfc_main$z as SplitView, _sfc_main$S as TMagicCodeEditor, _sfc_main as TMagicEditor, _sfc_main$w as ToolButton, UI_SELECT_MODE_EVENT_NAME, V_GUIDE_LINE_STORAGE_KEY, advancedTabConfig, beforePaste, change2Fixed, codeBlockService, dataSourceService, debug, index as default, depService, displayTabConfig, editorService, error, eventTabConfig, eventsService, fillConfig, fixNodeLeft, fixNodePosition, generatePageName, generatePageNameByApp, getAddParent, getConfig, getDefaultConfig, getDisplayField, getFormConfig, getFormValue, getGuideLineFromCache, getInitPositionStyle, getNodeIndex, getPageList, getPageNameList, getPositionInContainer, getRelativeStyle, historyService, info, isFixed, log, propsService, serializeConfig, setConfig, setLayout, storageService, styleTabConfig, traverseNode, uiService, useCodeBlockEdit, useDataSourceMethod, useStage, warn };
10503
+ export { CODE_DRAFT_STORAGE_KEY, COPY_STORAGE_KEY, _sfc_main$P as CodeBlockEditor, _sfc_main$r as CodeBlockList, _sfc_main$q as CodeBlockListPanel, CodeDeleteErrorType, _sfc_main$Q as CodeSelect, _sfc_main$M as CodeSelectCol, ColumnLayout, _sfc_main$f as ComponentListPanel, _sfc_main$k as ContentMenu, _sfc_main$K as DataSourceFieldSelect, _sfc_main$L as DataSourceFields, _sfc_main$J as DataSourceInput, _sfc_main$H as DataSourceMethodSelect, _sfc_main$I as DataSourceMethods, _sfc_main$G as DataSourceMocks, _sfc_main$F as DataSourceSelect, DepTargetType, DragType, _sfc_main$E as EventSelect, Fixed2Other, H_GUIDE_LINE_STORAGE_KEY, _sfc_main$N as Icon, KeyBindingCommand, _sfc_main$D as KeyValue, Keys, LayerOffset, _sfc_main$g as LayerPanel, Layout, _sfc_main$A as LayoutContainer, _sfc_main$v as PropsPanel, _sfc_main$B as Resizer, _sfc_main$A as SplitView, _sfc_main$T as TMagicCodeEditor, _sfc_main as TMagicEditor, _sfc_main$x as ToolButton, UI_SELECT_MODE_EVENT_NAME, V_GUIDE_LINE_STORAGE_KEY, advancedTabConfig, beforePaste, change2Fixed, codeBlockService, dataSourceService, debug, index as default, depService, displayTabConfig, editorService, error, eventTabConfig, eventsService, fillConfig, fixNodeLeft, fixNodePosition, generatePageName, generatePageNameByApp, getAddParent, getConfig, getDefaultConfig, getDisplayField, getFormConfig, getFormValue, getGuideLineFromCache, getInitPositionStyle, getNodeIndex, getPageList, getPageNameList, getPositionInContainer, getRelativeStyle, historyService, info, isFixed, log, propsService, serializeConfig, setConfig, setLayout, storageService, styleTabConfig, traverseNode, uiService, useCodeBlockEdit, useDataSourceMethod, useStage, warn };
10391
10504
  //# sourceMappingURL=tmagic-editor.js.map