@tmagic/editor 1.5.9 → 1.5.11

package/dist/tmagic-editor.js

@@ -13,7 +13,7 @@ import { throttle, isEmpty, isObject, cloneDeep, mergeWith, uniq, get, map, has,
 import serialize from 'serialize-javascript';
 import { emmetHTML, emmetCSS } from 'emmet-monaco-es';
 import * as monaco from 'monaco-editor';
-import { HookCodeType, HookType, NODE_CONDS_KEY, Target, Watcher, NodeType, ActionType, DepTargetType, DEFAULT_EVENTS, DEFAULT_METHODS, createCodeBlockTarget, createDataSourceTarget, createDataSourceMethodTarget, createDataSourceCondTarget } from '@tmagic/core';
+import { HookCodeType, HookType, NODE_CONDS_KEY, Target, Watcher, NodeType, ActionType, DepTargetType, createCodeBlockTarget, createDataSourceTarget, createDataSourceMethodTarget, createDataSourceCondTarget } from '@tmagic/core';
 export { DepTargetType } from '@tmagic/core';
 import { isPage, isPageFragment, isPop, getNodePath, isNumber, getElById, calcValueByFontsize, isValueIncludeDataSource, toLine, guid, getValueByKeyPath, setValueByKeyPath, getNodeInfo, dataSourceTemplateRegExp, getKeysArray, DATA_SOURCE_FIELDS_SELECT_VALUE_PREFIX, getKeys, convertToNumber, getIdFromEl, traverseNode, getDefaultValueFromFields, DATA_SOURCE_FIELDS_CHANGE_EVENT_PREFIX, removeClassName, addClassName, removeClassNameByClassName, getNodes } from '@tmagic/utils';
 export * from '@tmagic/utils';
@@ -9651,6 +9651,14 @@ const useStylePanel = ({ uiService, storageService }, propsPanelWidth) => {
   }
   const showStylePanel = computed(() => showStylePanelToggleButton.value && (uiService.get("showStylePanel") ?? true));
   const showStylePanelToggleButton = computed(() => uiService.get("frameworkRect").width >= 1280);
+  watch(
+    () => uiService.get("frameworkRect").width,
+    () => {
+      if (uiService.get("columnWidth").right < propsPanelWidth.value) {
+        toggleStylePanel(false);
+      }
+    }
+  );
   const toggleStylePanel = (showStylePanel2) => {
     uiService.set("showStylePanel", showStylePanel2);
     storageService.setItem(showStylePanelStorageKey, showStylePanel2, { protocol: Protocol.BOOLEAN });
@@ -9760,7 +9768,7 @@ const _sfc_main$p = /* @__PURE__ */ defineComponent({
       storageService.getItem(PROPS_PANEL_WIDTH_STORAGE_KEY, { protocol: Protocol.NUMBER }) || 300
     );
     onMounted(() => {
-      propsPanelEl.value?.style.setProperty("--props-style-panel-width", `${propsPanelWidth.value}px`);
+      propsPanelEl.value?.style.setProperty("--props-style-panel-width", `${Math.max(propsPanelWidth.value, 0)}px`);
     });
     const widthChange = ({ deltaX }) => {
       if (!propsPanelEl.value) {
@@ -9773,7 +9781,7 @@ const _sfc_main$p = /* @__PURE__ */ defineComponent({
       if (value > uiService.get("columnWidth").right) {
         value = uiService.get("columnWidth").right - 40;
       }
-      propsPanelWidth.value = value;
+      propsPanelWidth.value = Math.max(value, 0);
     };
     watch(propsPanelWidth, (value) => {
       propsPanelEl.value?.style.setProperty("--props-style-panel-width", `${value}px`);
@@ -14052,29 +14060,16 @@ class Events extends BaseService {
   constructor() {
     super([]);
   }
-  init(componentGroupList) {
-    componentGroupList.forEach((group) => {
-      group.items.forEach((element) => {
-        const type = toLine(element.type);
-        if (!this.getEvent(type)) {
-          this.setEvent(type, DEFAULT_EVENTS);
-        }
-        if (!this.getMethod(type)) {
-          this.setMethod(type, DEFAULT_METHODS);
-        }
-      });
-    });
-  }
   setEvents(events) {
     Object.keys(events).forEach((type) => {
       this.setEvent(toLine(type), events[type] || []);
     });
   }
   setEvent(type, events) {
-    eventMap[toLine(type)] = [...DEFAULT_EVENTS, ...events];
+    eventMap[toLine(type)] = [...events];
   }
   getEvent(type) {
-    return cloneDeep(eventMap[toLine(type)] || DEFAULT_EVENTS);
+    return cloneDeep(eventMap[toLine(type)]) || [];
   }
   setMethods(methods) {
     Object.keys(methods).forEach((type) => {
@@ -14082,10 +14077,10 @@ class Events extends BaseService {
     });
   }
   setMethod(type, method) {
-    methodMap[toLine(type)] = [...DEFAULT_METHODS, ...method];
+    methodMap[toLine(type)] = [...method];
   }
   getMethod(type) {
-    return cloneDeep(methodMap[toLine(type)] || DEFAULT_METHODS);
+    return cloneDeep(methodMap[toLine(type)]);
   }
   resetState() {
     eventMap = reactive({});

package/dist/tmagic-editor.umd.cjs

@@ -14538,6 +14538,14 @@
     }
     const showStylePanel = vue.computed(() => showStylePanelToggleButton.value && (uiService.get("showStylePanel") ?? true));
     const showStylePanelToggleButton = vue.computed(() => uiService.get("frameworkRect").width >= 1280);
+    vue.watch(
+      () => uiService.get("frameworkRect").width,
+      () => {
+        if (uiService.get("columnWidth").right < propsPanelWidth.value) {
+          toggleStylePanel(false);
+        }
+      }
+    );
     const toggleStylePanel = (showStylePanel2) => {
       uiService.set("showStylePanel", showStylePanel2);
       storageService.setItem(showStylePanelStorageKey, showStylePanel2, { protocol: Protocol.BOOLEAN });
@@ -14647,7 +14655,7 @@
         storageService.getItem(PROPS_PANEL_WIDTH_STORAGE_KEY, { protocol: Protocol.NUMBER }) || 300
       );
       vue.onMounted(() => {
-        propsPanelEl.value?.style.setProperty("--props-style-panel-width", `${propsPanelWidth.value}px`);
+        propsPanelEl.value?.style.setProperty("--props-style-panel-width", `${Math.max(propsPanelWidth.value, 0)}px`);
       });
       const widthChange = ({ deltaX }) => {
         if (!propsPanelEl.value) {
@@ -14660,7 +14668,7 @@
         if (value > uiService.get("columnWidth").right) {
           value = uiService.get("columnWidth").right - 40;
         }
-        propsPanelWidth.value = value;
+        propsPanelWidth.value = Math.max(value, 0);
       };
       vue.watch(propsPanelWidth, (value) => {
         propsPanelEl.value?.style.setProperty("--props-style-panel-width", `${value}px`);
@@ -18939,29 +18947,16 @@
     constructor() {
       super([]);
     }
-    init(componentGroupList) {
-      componentGroupList.forEach((group) => {
-        group.items.forEach((element) => {
-          const type = utils.toLine(element.type);
-          if (!this.getEvent(type)) {
-            this.setEvent(type, core.DEFAULT_EVENTS);
-          }
-          if (!this.getMethod(type)) {
-            this.setMethod(type, core.DEFAULT_METHODS);
-          }
-        });
-      });
-    }
     setEvents(events) {
       Object.keys(events).forEach((type) => {
         this.setEvent(utils.toLine(type), events[type] || []);
       });
     }
     setEvent(type, events) {
-      eventMap[utils.toLine(type)] = [...core.DEFAULT_EVENTS, ...events];
+      eventMap[utils.toLine(type)] = [...events];
     }
     getEvent(type) {
-      return cloneDeep(eventMap[utils.toLine(type)] || core.DEFAULT_EVENTS);
+      return cloneDeep(eventMap[utils.toLine(type)]) || [];
     }
     setMethods(methods) {
       Object.keys(methods).forEach((type) => {
@@ -18969,10 +18964,10 @@
       });
     }
     setMethod(type, method) {
-      methodMap[utils.toLine(type)] = [...core.DEFAULT_METHODS, ...method];
+      methodMap[utils.toLine(type)] = [...method];
     }
     getMethod(type) {
-      return cloneDeep(methodMap[utils.toLine(type)] || core.DEFAULT_METHODS);
+      return cloneDeep(methodMap[utils.toLine(type)]);
     }
     resetState() {
       eventMap = vue.reactive({});

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "1.5.9",
+  "version": "1.5.11",
   "name": "@tmagic/editor",
   "type": "module",
   "sideEffects": [
@@ -58,11 +58,11 @@
     "moveable": "^0.53.0",
     "serialize-javascript": "^6.0.0",
     "sortablejs": "^1.15.2",
-    "@tmagic/design": "1.5.9",
-    "@tmagic/form": "1.5.9",
-    "@tmagic/stage": "1.5.9",
-    "@tmagic/utils": "1.5.9",
-    "@tmagic/table": "1.5.9"
+    "@tmagic/form": "1.5.11",
+    "@tmagic/design": "1.5.11",
+    "@tmagic/utils": "1.5.11",
+    "@tmagic/stage": "1.5.11",
+    "@tmagic/table": "1.5.11"
   },
   "devDependencies": {
     "@types/events": "^3.0.0",
@@ -76,7 +76,7 @@
     "monaco-editor": "^0.48.0",
     "typescript": "*",
     "vue": ">=3.5.0",
-    "@tmagic/core": "1.5.9"
+    "@tmagic/core": "1.5.11"
   },
   "peerDependenciesMeta": {
     "typescript": {

package/src/layouts/props-panel/PropsPanel.vue

@@ -171,7 +171,7 @@ const propsPanelWidth = ref(
 );
 
 onMounted(() => {
-  propsPanelEl.value?.style.setProperty('--props-style-panel-width', `${propsPanelWidth.value}px`);
+  propsPanelEl.value?.style.setProperty('--props-style-panel-width', `${Math.max(propsPanelWidth.value, 0)}px`);
 });
 
 const widthChange = ({ deltaX }: OnDrag) => {
@@ -187,7 +187,7 @@ const widthChange = ({ deltaX }: OnDrag) => {
   if (value > uiService.get('columnWidth').right) {
     value = uiService.get('columnWidth').right - 40;
   }
-  propsPanelWidth.value = value;
+  propsPanelWidth.value = Math.max(value, 0);
 };
 
 watch(propsPanelWidth, (value) => {

package/src/layouts/props-panel/use-style-panel.ts

@@ -1,4 +1,4 @@
-import { computed, type Ref } from 'vue';
+import { computed, type Ref, watch } from 'vue';
 
 import { Protocol } from '@editor/services/storage';
 import { Services } from '@editor/type';
@@ -21,6 +21,15 @@ export const useStylePanel = (
 
   const showStylePanelToggleButton = computed(() => uiService.get('frameworkRect').width >= 1280);
 
+  watch(
+    () => uiService.get('frameworkRect').width,
+    () => {
+      if (uiService.get('columnWidth').right < propsPanelWidth.value) {
+        toggleStylePanel(false);
+      }
+    },
+  );
+
   const toggleStylePanel = (showStylePanel: boolean) => {
     uiService.set('showStylePanel', showStylePanel);
     storageService.setItem(showStylePanelStorageKey, showStylePanel, { protocol: Protocol.BOOLEAN });

package/src/services/events.ts

@@ -19,11 +19,9 @@
 import { reactive } from 'vue';
 import { cloneDeep } from 'lodash-es';
 
-import { DEFAULT_EVENTS, DEFAULT_METHODS, EventOption } from '@tmagic/core';
+import { type EventOption } from '@tmagic/core';
 import { toLine } from '@tmagic/utils';
 
-import type { ComponentGroup } from '@editor/type';
-
 import BaseService from './BaseService';
 
 let eventMap: Record<string, EventOption[]> = reactive({});
@@ -34,20 +32,6 @@ class Events extends BaseService {
     super([]);
   }
 
-  public init(componentGroupList: ComponentGroup[]) {
-    componentGroupList.forEach((group) => {
-      group.items.forEach((element) => {
-        const type = toLine(element.type);
-        if (!this.getEvent(type)) {
-          this.setEvent(type, DEFAULT_EVENTS);
-        }
-        if (!this.getMethod(type)) {
-          this.setMethod(type, DEFAULT_METHODS);
-        }
-      });
-    });
-  }
-
   public setEvents(events: Record<string, EventOption[]>) {
     Object.keys(events).forEach((type: string) => {
       this.setEvent(toLine(type), events[type] || []);
@@ -55,11 +39,11 @@ class Events extends BaseService {
   }
 
   public setEvent(type: string, events: EventOption[]) {
-    eventMap[toLine(type)] = [...DEFAULT_EVENTS, ...events];
+    eventMap[toLine(type)] = [...events];
   }
 
   public getEvent(type: string): EventOption[] {
-    return cloneDeep(eventMap[toLine(type)] || DEFAULT_EVENTS);
+    return cloneDeep(eventMap[toLine(type)]) || [];
   }
 
   public setMethods(methods: Record<string, EventOption[]>) {
@@ -69,11 +53,11 @@ class Events extends BaseService {
   }
 
   public setMethod(type: string, method: EventOption[]) {
-    methodMap[toLine(type)] = [...DEFAULT_METHODS, ...method];
+    methodMap[toLine(type)] = [...method];
   }
 
   public getMethod(type: string) {
-    return cloneDeep(methodMap[toLine(type)] || DEFAULT_METHODS);
+    return cloneDeep(methodMap[toLine(type)]);
   }
 
   public resetState() {

package/types/index.d.ts

@@ -526,7 +526,6 @@ declare const _default$E: Editor;
 
 declare class Events extends export_default {
     constructor();
-    init(componentGroupList: ComponentGroup[]): void;
     setEvents(events: Record<string, EventOption[]>): void;
     setEvent(type: string, events: EventOption[]): void;
     getEvent(type: string): EventOption[];