@tmagic/stage 1.0.0-rc.12 → 1.0.0-rc.13

package/dist/tmagic-stage.umd.js

@@ -40,8 +40,6 @@
     return Mode2;
   })(Mode || {});
   const SELECTED_CLASS = "tmagic-stage-selected-area";
-  const H_GUIDE_LINE_STORAGE_KEY = "$MagicStageHorizontalGuidelinesData";
-  const V_GUIDE_LINE_STORAGE_KEY = "$MagicStageVerticalGuidelinesData";
 
   const getParents = (el, relative) => {
     let cur = el.parentElement;
@@ -86,26 +84,15 @@
       return true;
     return getHost(targetUrl) === source;
   };
-  const isRelative = (el) => {
-    if (!el)
-      return false;
-    return getComputedStyle(el).position === "relative";
-  };
-  const isStatic = (el) => {
-    if (!el)
-      return false;
-    return getComputedStyle(el).position === "static";
-  };
-  const isFixed = (el) => {
-    if (!el)
-      return false;
-    return getComputedStyle(el).position === "fixed";
-  };
+  const isAbsolute = (style) => style.position === "absolute";
+  const isRelative = (style) => style.position === "relative";
+  const isStatic = (style) => style.position === "static";
+  const isFixed = (style) => style.position === "fixed";
   const isFixedParent = (el) => {
     let fixed = false;
     let dom = el;
     while (dom) {
-      fixed = isFixed(dom);
+      fixed = isFixed(getComputedStyle(dom));
       if (fixed) {
         break;
       }
@@ -120,20 +107,20 @@
   const getMode = (el) => {
     if (isFixedParent(el))
       return Mode.FIXED;
-    if (isStatic(el) || isRelative(el))
+    const style = getComputedStyle(el);
+    if (isStatic(style) || isRelative(style))
       return Mode.SORTABLE;
     return Mode.ABSOLUTE;
   };
   const getScrollParent = (element, includeHidden = false) => {
     let style = getComputedStyle(element);
-    const excludeStaticParent = style.position === "absolute";
     const overflowRegex = includeHidden ? /(auto|scroll|hidden)/ : /(auto|scroll)/;
-    if (style.position === "fixed")
+    if (isFixed(style))
       return null;
     for (let parent = element; parent.parentElement; ) {
       parent = parent.parentElement;
       style = getComputedStyle(parent);
-      if (excludeStaticParent && style.position === "static")
+      if (isAbsolute(style) && isStatic(style))
         continue;
       if (overflowRegex.test(style.overflow + style.overflowY + style.overflowX))
         return parent;
@@ -163,29 +150,12 @@
       item.classList.add(`${SELECTED_CLASS}-parents`);
     });
   };
-  const getGuideLineFromCache = (type) => {
-    const key = {
-      [GuidesType.HORIZONTAL]: H_GUIDE_LINE_STORAGE_KEY,
-      [GuidesType.VERTICAL]: V_GUIDE_LINE_STORAGE_KEY
-    }[type];
-    if (!key)
-      return [];
-    const guideLineCacheData = globalThis.localStorage.getItem(key);
-    if (guideLineCacheData) {
-      try {
-        return JSON.parse(guideLineCacheData) || [];
-      } catch (e) {
-        console.error(e);
-      }
-    }
-    return [];
-  };
 
   class StageDragResize extends EventEmitter.EventEmitter {
     constructor(config) {
       super();
-      this.horizontalGuidelines = getGuideLineFromCache(GuidesType.HORIZONTAL);
-      this.verticalGuidelines = getGuideLineFromCache(GuidesType.VERTICAL);
+      this.horizontalGuidelines = [];
+      this.verticalGuidelines = [];
       this.elementGuidelines = [];
       this.mode = Mode.ABSOLUTE;
       this.moveableOptions = {};
@@ -233,7 +203,9 @@
         this.verticalGuidelines = guidelines;
         this.moveableOptions.verticalGuidelines = guidelines;
       }
-      this.updateMoveable();
+      if (this.moveable) {
+        this.updateMoveable();
+      }
     }
     clearGuides() {
       this.horizontalGuidelines = [];
@@ -534,7 +506,7 @@
         elementGuidelines: this.elementGuidelines,
         bounds: {
           top: 0,
-          left: 0,
+          left: -1,
           right: this.container.clientWidth,
           bottom: this.container.clientHeight,
           ...moveableOptions.bounds || {}
@@ -706,8 +678,8 @@
   class Rule extends EventEmitter__default["default"] {
     constructor(container) {
       super();
-      this.horizontalGuidelines = getGuideLineFromCache(GuidesType.HORIZONTAL);
-      this.verticalGuidelines = getGuideLineFromCache(GuidesType.VERTICAL);
+      this.horizontalGuidelines = [];
+      this.verticalGuidelines = [];
       this.getGuidesStyle = (type) => ({
         position: "fixed",
         zIndex: 1,
@@ -731,7 +703,6 @@
           type: GuidesType.HORIZONTAL,
           guides: this.horizontalGuidelines
         });
-        globalThis.localStorage.setItem(H_GUIDE_LINE_STORAGE_KEY, JSON.stringify(e.guides));
       };
       this.vGuidesChangeGuidesHandler = (e) => {
         this.verticalGuidelines = e.guides;
@@ -739,7 +710,6 @@
           type: GuidesType.VERTICAL,
           guides: this.verticalGuidelines
         });
-        globalThis.localStorage.setItem(V_GUIDE_LINE_STORAGE_KEY, JSON.stringify(e.guides));
       };
       this.container = container;
       this.hGuides = this.createGuides(GuidesType.HORIZONTAL, this.horizontalGuidelines);
@@ -760,25 +730,26 @@
         showGuides: show
       });
     }
-    clearGuides() {
-      this.horizontalGuidelines = [];
-      this.verticalGuidelines = [];
-      this.vGuides.setState({
-        defaultGuides: []
-      });
+    setGuides([hLines, vLines]) {
+      this.horizontalGuidelines = hLines;
+      this.verticalGuidelines = vLines;
       this.hGuides.setState({
-        defaultGuides: []
+        defaultGuides: hLines
       });
-      this.emit("changeGuides", {
-        type: GuidesType.VERTICAL,
-        guides: []
+      this.vGuides.setState({
+        defaultGuides: vLines
       });
       this.emit("changeGuides", {
         type: GuidesType.HORIZONTAL,
-        guides: []
+        guides: hLines
+      });
+      this.emit("changeGuides", {
+        type: GuidesType.VERTICAL,
+        guides: vLines
       });
-      globalThis.localStorage.setItem(V_GUIDE_LINE_STORAGE_KEY, "[]");
-      globalThis.localStorage.setItem(H_GUIDE_LINE_STORAGE_KEY, "[]");
+    }
+    clearGuides() {
+      this.setGuides([[], []]);
     }
     showRule(show = true) {
       if (show) {
@@ -1279,9 +1250,18 @@
     }
   }
 
+  exports.DEFAULT_ZOOM = DEFAULT_ZOOM;
+  exports.DRAG_EL_ID_PREFIX = DRAG_EL_ID_PREFIX;
+  exports.GHOST_EL_ID_PREFIX = GHOST_EL_ID_PREFIX;
+  exports.GuidesType = GuidesType;
+  exports.HIGHLIGHT_EL_ID_PREFIX = HIGHLIGHT_EL_ID_PREFIX;
+  exports.Mode = Mode;
+  exports.MouseButton = MouseButton;
+  exports.SELECTED_CLASS = SELECTED_CLASS;
   exports.StageDragResize = StageDragResize;
   exports.StageMask = StageMask;
   exports.StageRender = StageRender;
+  exports.ZIndex = ZIndex;
   exports["default"] = StageCore;
 
   Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: 'Module' } });