leafer-ui 2.2.5 → 2.2.7

package/README.md

@@ -167,7 +167,10 @@ LeaferJS 是一个持续打磨了五年的原创开源引擎。我们致力于
 
 <p><h3 align="center">金牌赞助商</h3></p>
 <p style="display: flex;flex-wrap: wrap;justify-content: center;gap: 15px;">
-  <a target="_blank" href="https://easysearch.cn">
+  <a target="_blank" href="https://yzllq.com/">
+        <img width="180" title="一个浏览器打开多组账户 - 电商、自媒体、矩阵营销的便捷账户管理方式" src="https://www.leaferjs.com/image/sponsor/gold/yzllq.png" loading="lazy" />
+    </a>
+    <a target="_blank" href="https://easysearch.cn">
         <img width="180" title="Easysearch - 企业级的分布式搜索型数据库" src="https://www.leaferjs.com/image/sponsor/gold/easysearch.png" loading="lazy" />
     </a>
     <a target="_blank" href="https://boardos.online">
@@ -210,11 +213,11 @@ LeaferJS 是一个持续打磨了五年的原创开源引擎。我们致力于
 
 <p><h3 align="center">银牌赞助</h3></p>
 <p style="display: flex;flex-wrap: wrap;justify-content: center;gap: 5px;">
-    <a target="_blank" href="">
+<a target="_blank" href="">
         <img width="40" title="怜生" src="https://www.pxgrow.com/image/user/default/3.jpg" loading="lazy" />
     </a>
-    <a target="_blank" href="https://pro.kuaitu.cc/">
-        <img width="40" title="快图设计" src="https://www.pxgrow.com/image/sponsor/user/72.jpg" loading="lazy" />
+    <a target="_blank" href="https://pro.kuaitu.cc">
+        <img width="40" title="快图设计" src="https://www.pxgrow.com/image/user/default/7.jpg" loading="lazy" />
     </a>
     <a target="_blank" href="">
         <img width="40" title="black" src="https://api.pxgrow.com/uploads/avatar/249/AzA/4v/u.jpg" loading="lazy" />
@@ -264,6 +267,9 @@ LeaferJS 是一个持续打磨了五年的原创开源引擎。我们致力于
     <a target="_blank" href="">
         <img width="40" title="😊" src="https://www.pxgrow.com/image/sponsor/user/79.jpg" loading="lazy" />
     </a>
+    <a target="_blank" href="https://pro.kuaitu.cc/">
+        <img width="40" title="快图设计" src="https://www.pxgrow.com/image/sponsor/user/72.jpg" loading="lazy" />
+    </a>
     <a target="_blank" href="">
         <img width="40" title="ycteng" src="https://www.pxgrow.com/image/sponsor/user/purple.png" loading="lazy" />
     </a>
@@ -388,7 +394,7 @@ LeaferJS 是一个持续打磨了五年的原创开源引擎。我们致力于
 
 <p><h3 align="center">铜牌赞助</h3></p>
 <p style="display: flex;flex-wrap: wrap;justify-content: center;gap: 15px;">
-用户zw8T394C &nbsp;&nbsp;用户zw8T398C &nbsp;&nbsp;龙眼吃多了上火 &nbsp;&nbsp;用户zw8T392T &nbsp;&nbsp;用户z89CSw69 &nbsp;&nbsp;用户CzP9SCAz &nbsp;&nbsp;Kim &nbsp;&nbsp;用户249AzA8v &nbsp;&nbsp;l0f5c7bf &nbsp;&nbsp;夏先生 &nbsp;&nbsp;yinuo &nbsp;&nbsp;用户3wTwAz78 &nbsp;&nbsp;用户zw8T39zT &nbsp;&nbsp;用户249AzA82 &nbsp;&nbsp;用户CzP9SCvz &nbsp;&nbsp;用户39A334xT &nbsp;&nbsp;用户3wTwAz3x &nbsp;&nbsp;用户zw8T39zC &nbsp;&nbsp;稀饭、微凉 &nbsp;&nbsp;用户CzP9SCT4 &nbsp;&nbsp;便宜VPS服务器 &nbsp;&nbsp;菲鸽 &nbsp;&nbsp;szhua &nbsp;&nbsp;Cheng &nbsp;&nbsp;Suezp &nbsp;&nbsp;beyond &nbsp;&nbsp;用户3PvP2S63 &nbsp;&nbsp;o &nbsp;&nbsp;Arvin &nbsp;&nbsp;finallycc &nbsp;&nbsp;用户39A3346C &nbsp;&nbsp;大雷 &nbsp;&nbsp;用户CzP9SC4z &nbsp;&nbsp;随风 &nbsp;&nbsp;用户z89CSwT9 &nbsp;&nbsp;用户3wTwAzCx &nbsp;&nbsp;UPMuling &nbsp;&nbsp;军杨 &nbsp;&nbsp;桔子雨工作室 &nbsp;&nbsp;用户zw8T37xC &nbsp;&nbsp;前端炒饭仔 &nbsp;&nbsp;用户z89CSw46 &nbsp;&nbsp;崮生 &nbsp;&nbsp;互动矩阵 &nbsp;&nbsp;ZhanYoHo &nbsp;&nbsp;何佳Q &nbsp;&nbsp;coderhyh &nbsp;&nbsp;早上好啊 &nbsp;&nbsp;快图设计 &nbsp;&nbsp;do &nbsp;&nbsp;毛哥哥 &nbsp;&nbsp;迅排设计 &nbsp;&nbsp;用���z89CSw86 &nbsp;&nbsp;糖果 &nbsp;&nbsp;南城以北 &nbsp;&nbsp;黑色摩天仑 &nbsp;&nbsp;Charm &nbsp;&nbsp;Lauginwing &nbsp;&nbsp;在路上 &nbsp;&nbsp;Jerry &nbsp;&nbsp;张余🌈 &nbsp;&nbsp;李狗嗨。💢 &nbsp;&nbsp;用户zw8T376T &nbsp;&nbsp;用户249AzA2v &nbsp;&nbsp;ʚ LMT ɞ &nbsp;&nbsp;格子 &nbsp;&nbsp;等等 &nbsp;&nbsp;goosen &nbsp;&nbsp;F4nniu &nbsp;&nbsp;梁福斌 &nbsp;&nbsp;江万江 &nbsp;&nbsp;杨超 &nbsp;&nbsp;ToB Dev &nbsp;&nbsp;前端之虎陈随易 &nbsp;&nbsp;A☀️云☀️A &nbsp;&nbsp;zhk &nbsp;&nbsp;爱发电用户_c9c82 &nbsp;&nbsp;轻简历 &nbsp;&nbsp;爱发电用户_0fac0 &nbsp;&nbsp;wangyesheji.cn &nbsp;&nbsp;风间 &nbsp;&nbsp;爱发电用户_Tqsm &nbsp;&nbsp;爱发电用户_6KpE &nbsp;&nbsp;星小志 &nbsp;&nbsp;zwm &nbsp;&nbsp;爱发电用户_3725c &nbsp;&nbsp;Noth1ng &nbsp;&nbsp;纳西妲の√ &nbsp;&nbsp;爱发电用户_Ahb9 &nbsp;&nbsp;爱发电用户_7617d &nbsp;&nbsp;冷漠 &nbsp;&nbsp;爱发电用户_9RXB &nbsp;&nbsp;今日值得读 &nbsp;&nbsp;爱发电用户_49sT &nbsp;&nbsp;爱发电用户_NFCS &nbsp;&nbsp;爱发电用户_43ad8 &nbsp;&nbsp;爱发电用户_30455 &nbsp;&nbsp;砖吐筷筷 &nbsp;&nbsp;xiaozhang &nbsp;&nbsp;爱发电用户_b47b3 &nbsp;&nbsp;longbow1998 &nbsp;&nbsp;爱发电用户_5d755 &nbsp;&nbsp;爱发电用户_b76b8 &nbsp;&nbsp;爱发电用户_e70c2 &nbsp;&nbsp;xiaou@截图工具 &nbsp;&nbsp;ousiri &nbsp;&nbsp;爱发电用户_039dc &nbsp;&nbsp;花祁 &nbsp;&nbsp;爱发电用户_99f39 &nbsp;&nbsp;坤坤 &nbsp;&nbsp;爱发电用户_X6hp &nbsp;&nbsp;ycteng &nbsp;&nbsp;曹吉美爸爸 &nbsp;&nbsp;啸沧海 &nbsp;&nbsp;Ronny &nbsp;&nbsp;爱发电用户_UXEV &nbsp;&nbsp;Biu &nbsp;&nbsp;王志强 &nbsp;&nbsp;SaltedFish &nbsp;&nbsp;爱发电用户_76f9d &nbsp;&nbsp;PD.新城คิดถึง &nbsp;&nbsp;糖颂缘冥倾 &nbsp;&nbsp;ALBERT. &nbsp;&nbsp;爱发电用户_Pbm7 &nbsp;&nbsp;Leafer &nbsp;&nbsp;赞助我们 &nbsp;&nbsp;</p>
+parox2014 &nbsp;&nbsp;QGG &nbsp;&nbsp;小白不白 &nbsp;&nbsp;用户zw8T394C &nbsp;&nbsp;用户zw8T398C &nbsp;&nbsp;龙眼吃多了上火 &nbsp;&nbsp;用户zw8T392T &nbsp;&nbsp;用户z89CSw69 &nbsp;&nbsp;用户CzP9SCAz &nbsp;&nbsp;Kim &nbsp;&nbsp;用户249AzA8v &nbsp;&nbsp;l0f5c7bf &nbsp;&nbsp;夏先生 &nbsp;&nbsp;yinuo &nbsp;&nbsp;用户3wTwAz78 &nbsp;&nbsp;用户zw8T39zT &nbsp;&nbsp;用户249AzA82 &nbsp;&nbsp;用户CzP9SCvz &nbsp;&nbsp;用户39A334xT &nbsp;&nbsp;用户3wTwAz3x &nbsp;&nbsp;用户zw8T39zC &nbsp;&nbsp;稀饭、微凉 &nbsp;&nbsp;用户CzP9SCT4 &nbsp;&nbsp;便宜VPS服务器 &nbsp;&nbsp;菲鸽 &nbsp;&nbsp;szhua &nbsp;&nbsp;Cheng &nbsp;&nbsp;Suezp &nbsp;&nbsp;beyond &nbsp;&nbsp;用户3PvP2S63 &nbsp;&nbsp;o &nbsp;&nbsp;Arvin &nbsp;&nbsp;finallycc &nbsp;&nbsp;用户39A3346C &nbsp;&nbsp;大雷 &nbsp;&nbsp;用户CzP9SC4z &nbsp;&nbsp;随风 &nbsp;&nbsp;用户z89CSwT9 &nbsp;&nbsp;用户3wTwAzCx &nbsp;&nbsp;UPMuling &nbsp;&nbsp;军杨 &nbsp;&nbsp;桔子雨工作室 &nbsp;&nbsp;用户zw8T37xC &nbsp;&nbsp;前端炒饭仔 &nbsp;&nbsp;用户z89CSw46 &nbsp;&nbsp;崮生 &nbsp;&nbsp;互动矩阵 &nbsp;&nbsp;ZhanYoHo &nbsp;&nbsp;何佳Q &nbsp;&nbsp;coderhyh &nbsp;&nbsp;早上好啊 &nbsp;&nbsp;快图设计 &nbsp;&nbsp;do &nbsp;&nbsp;毛哥哥 &nbsp;&nbsp;迅排设计 &nbsp;&nbsp;用户z89CSw86 &nbsp;&nbsp;糖果 &nbsp;&nbsp;南城以北 &nbsp;&nbsp;黑色摩天仑 &nbsp;&nbsp;Charm &nbsp;&nbsp;Lauginwing &nbsp;&nbsp;在路上 &nbsp;&nbsp;Jerry &nbsp;&nbsp;张余🌈 &nbsp;&nbsp;李狗嗨。💢 &nbsp;&nbsp;用户zw8T376T &nbsp;&nbsp;用户249AzA2v &nbsp;&nbsp;ʚ LMT ɞ &nbsp;&nbsp;格子 &nbsp;&nbsp;等等 &nbsp;&nbsp;goosen &nbsp;&nbsp;F4nniu &nbsp;&nbsp;梁福斌 &nbsp;&nbsp;江万江 &nbsp;&nbsp;杨超 &nbsp;&nbsp;ToB Dev &nbsp;&nbsp;前端之虎陈随易 &nbsp;&nbsp;A☀️云☀️A &nbsp;&nbsp;zhk &nbsp;&nbsp;爱发电用户_c9c82 &nbsp;&nbsp;轻简历 &nbsp;&nbsp;爱发电用户_0fac0 &nbsp;&nbsp;wangyesheji.cn &nbsp;&nbsp;风间 &nbsp;&nbsp;爱发电用户_Tqsm &nbsp;&nbsp;爱发电用户_6KpE &nbsp;&nbsp;星小志 &nbsp;&nbsp;zwm &nbsp;&nbsp;爱发电用户_3725c &nbsp;&nbsp;Noth1ng &nbsp;&nbsp;纳西妲の√ &nbsp;&nbsp;爱发电用户_Ahb9 &nbsp;&nbsp;爱发电用户_7617d &nbsp;&nbsp;冷漠 &nbsp;&nbsp;爱发电用户_9RXB &nbsp;&nbsp;今日值得读 &nbsp;&nbsp;爱发电用户_49sT &nbsp;&nbsp;爱发电用户_NFCS &nbsp;&nbsp;爱发电用户_43ad8 &nbsp;&nbsp;爱发电用户_30455 &nbsp;&nbsp;砖吐筷筷 &nbsp;&nbsp;xiaozhang &nbsp;&nbsp;爱发电用户_b47b3 &nbsp;&nbsp;longbow1998 &nbsp;&nbsp;爱发电用户_5d755 &nbsp;&nbsp;爱发电用户_b76b8 &nbsp;&nbsp;爱发电用户_e70c2 &nbsp;&nbsp;xiaou@截图工具 &nbsp;&nbsp;ousiri &nbsp;&nbsp;爱发电用户_039dc &nbsp;&nbsp;花祁 &nbsp;&nbsp;爱发电用户_99f39 &nbsp;&nbsp;坤坤 &nbsp;&nbsp;爱发电用户_X6hp &nbsp;&nbsp;ycteng &nbsp;&nbsp;曹吉美爸爸 &nbsp;&nbsp;啸沧海 &nbsp;&nbsp;Ronny &nbsp;&nbsp;爱发电用户_UXEV &nbsp;&nbsp;Biu &nbsp;&nbsp;王志强 &nbsp;&nbsp;SaltedFish &nbsp;&nbsp;爱发电用户_76f9d &nbsp;&nbsp;PD.新城คิดถึง &nbsp;&nbsp;糖颂缘冥倾 &nbsp;&nbsp;ALBERT. &nbsp;&nbsp;爱发电用户_Pbm7 &nbsp;&nbsp;Leafer &nbsp;&nbsp;赞助我们 &nbsp;&nbsp;</p>
 
 ## License
 

package/dist/web.cjs

@@ -374,6 +374,7 @@ class Watcher {
     }
     constructor(target, userConfig) {
         this.totalTimes = 0;
+        this.changed = 0;
         this.config = {};
         this.__updatedList = new core.LeafList;
         this.target = target;
@@ -393,8 +394,10 @@ class Watcher {
         this.disabled = true;
     }
     update() {
-        this.changed = true;
-        if (this.running) this.target.emit(core.RenderEvent.REQUEST);
+        if (this.changed < 100) {
+            this.changed++;
+            if (this.running) this.target.emit(core.RenderEvent.REQUEST);
+        }
     }
     __onAttrChange(event) {
         this.add(event.target);
@@ -403,18 +406,21 @@ class Watcher {
         if (this.config.usePartLayout) this.__updatedList.add(leaf);
         this.update();
     }
-    __onChildEvent(event) {
+    addChild(child, parent, eventType) {
         if (this.config.usePartLayout) {
-            if (event.type === core.ChildEvent.ADD) {
+            if (eventType === core.ChildEvent.ADD) {
                 this.hasAdd = true;
-                this.__pushChild(event.child);
+                this.__pushChild(child);
             } else {
                 this.hasRemove = true;
-                this.__updatedList.add(event.parent);
+                this.__updatedList.add(parent);
             }
         }
         this.update();
     }
+    __onChildEvent(event) {
+        this.addChild(event.child, event.parent, event.type);
+    }
     __pushChild(child) {
         this.__updatedList.add(child);
         if (child.isBranch) this.__loopChildren(child);
@@ -429,7 +435,8 @@ class Watcher {
         }));
         this.__updatedList = new core.LeafList;
         this.totalTimes++;
-        this.changed = this.hasVisible = this.hasRemove = this.hasAdd = false;
+        this.hasVisible = this.hasRemove = this.hasAdd = false;
+        this.changed = 0;
     }
     __listenEvents() {
         this.__eventIds = [ this.target.on_([ [ core.PropertyEvent.CHANGE, this.__onAttrChange, this ], [ [ core.ChildEvent.ADD, core.ChildEvent.REMOVE ], this.__onChildEvent, this ], [ core.WatchEvent.REQUEST, this.__onRquestData, this ] ]) ];
@@ -450,47 +457,57 @@ const {updateAllMatrix: updateAllMatrix$1, updateBounds: updateOneBounds, update
 
 const {pushAllChildBranch: pushAllChildBranch, pushAllParent: pushAllParent} = core.BranchHelper;
 
-function updateMatrix(updateList, levelList) {
-    let layout;
-    updateList.list.forEach(leaf => {
-        layout = leaf.__layout;
-        if (levelList.without(leaf) && !layout.proxyZoom) {
-            if (layout.matrixChanged) {
-                updateAllMatrix$1(leaf, true);
-                levelList.add(leaf);
-                if (leaf.isBranch) pushAllChildBranch(leaf, levelList);
-                pushAllParent(leaf, levelList);
-            } else if (layout.boundsChanged) {
-                levelList.add(leaf);
-                if (leaf.isBranch) leaf.__tempNumber = 0;
-                pushAllParent(leaf, levelList);
+const LayouterHelper = {
+    updateMatrix(updateList, levelList) {
+        let index = 0, leaf, layout;
+        const {list: list} = updateList;
+        while (index < list.length) {
+            leaf = list[index];
+            layout = leaf.__layout;
+            if (levelList.without(leaf) && !layout.proxyZoom) {
+                if (layout.matrixChanged) {
+                    updateAllMatrix$1(leaf, true);
+                    if (leaf.isBranch) pushAllChildBranch(leaf, levelList);
+                    push(leaf, levelList);
+                } else if (layout.boundsChanged) {
+                    if (leaf.isBranch) leaf.__tempNumber = 0;
+                    push(leaf, levelList);
+                }
             }
+            index++;
         }
-    });
-}
-
-function updateBounds(boundsList) {
-    let list, branch, children;
-    boundsList.sort(true);
-    boundsList.levels.forEach(level => {
-        list = boundsList.levelMap[level];
-        for (let i = 0, len = list.length; i < len; i++) {
-            branch = list[i];
-            if (branch.isBranch && branch.__tempNumber) {
-                children = branch.children;
-                for (let j = 0, jLen = children.length; j < jLen; j++) {
-                    if (!children[j].isBranch) {
-                        updateOneBounds(children[j]);
+    },
+    updateBounds(boundsList) {
+        let index = 0, level, list, branch, children;
+        const {levels: levels, levelMap: levelMap} = boundsList;
+        boundsList.sort(true);
+        while (index < levels.length) {
+            level = levels[index];
+            list = levelMap[level];
+            for (let i = 0, len = list.length; i < len; i++) {
+                branch = list[i];
+                if (branch.isBranch && branch.__tempNumber) {
+                    children = branch.children;
+                    for (let j = 0, jLen = children.length; j < jLen; j++) {
+                        if (!children[j].isBranch) {
+                            updateOneBounds(children[j]);
+                        }
                     }
                 }
+                updateOneBounds(branch);
             }
-            updateOneBounds(branch);
+            index++;
         }
-    });
-}
+    },
+    updateChange(updateList) {
+        updateList.list.forEach(updateOneChange);
+    },
+    push: push
+};
 
-function updateChange(updateList) {
-    updateList.list.forEach(updateOneChange);
+function push(leaf, levelList) {
+    levelList.add(leaf);
+    pushAllParent(leaf, levelList);
 }
 
 const {worldBounds: worldBounds} = core.LeafBoundsHelper;
@@ -597,9 +614,9 @@ class Layouter {
         target.emitEvent(new core.LayoutEvent(BEFORE, blocks, this.times));
         this.extraBlock = null;
         updateList.sort();
-        updateMatrix(updateList, this.__levelList);
-        updateBounds(this.__levelList);
-        updateChange(updateList);
+        LayouterHelper.updateMatrix(updateList, this.__levelList);
+        LayouterHelper.updateBounds(this.__levelList);
+        LayouterHelper.updateChange(updateList);
         if (this.extraBlock) blocks.push(this.extraBlock);
         blocks.forEach(item => item.setAfter());
         target.emitEvent(new core.LayoutEvent(LAYOUT, blocks, this.times));
@@ -629,11 +646,16 @@ class Layouter {
         if (target.isBranch) core.BranchHelper.updateBounds(target); else core.LeafHelper.updateBounds(target);
         updateAllChange(target);
     }
-    addExtra(leaf) {
+    addExtra(leaf, updateBounds) {
         if (!this.__updatedList.has(leaf)) {
             const {updatedList: updatedList, beforeBounds: beforeBounds} = this.extraBlock || (this.extraBlock = new LayoutBlockData([]));
             updatedList.length ? beforeBounds.add(leaf.__world) : beforeBounds.set(leaf.__world);
             updatedList.add(leaf);
+            if (updateBounds) {
+                const list = this.__levelList;
+                LayouterHelper.push(leaf, list);
+                list.sort(true);
+            }
         }
     }
     createBlock(data) {
@@ -958,7 +980,7 @@ class Picker {
             for (let i = 0, len = list.length; i < len; i++) {
                 find = list[i];
                 if (ignoreHittable || core.LeafHelper.worldHittable(find)) {
-                    this.hitChild(find, find.hitThrough ? this.point : point);
+                    this.hitChild(find, find.hitThrough ? this.point : point, find.mask && find.parent && find.parent.__onlyHitMask);
                     if (findList.length) {
                         if (find.isBranchLeaf && list.some(item => item !== find && core.LeafHelper.hasParent(item, find))) {
                             findList.reset();
@@ -1057,7 +1079,7 @@ class Picker {
             }
             const leaf = proxy || child, {hitThrough: hitThrough} = child, {findList: findList} = this;
             if (hitThrough) {
-                const index = findList.list.findIndex(item => item[hitThrough] === child[hitThrough]);
+                const index = findList.list.findIndex(item => hitThrough === "parent" ? core.LeafHelper.hasParent(item.parent, child.parent) : item[hitThrough] === child[hitThrough]);
                 if (index > 0) return findList.addAt(leaf, index);
             }
             findList.add(leaf);
@@ -1892,7 +1914,7 @@ function checkSizeAndCreateData(ui, attrName, paint, image, leafPaint, boxBounds
         data.__naturalHeight = image.height / data.pixelRatio;
         if (data.__autoSide) {
             ui.forceUpdate();
-            core.LeafHelper.updateBounds(ui);
+            core.LeafHelper.updateBounds(ui, true);
             ui.__layout.boundsChanged = true;
             if (ui.__proxyData) {
                 ui.setProxyAttr("width", data.width);
@@ -3196,6 +3218,8 @@ exports.Interaction = Interaction;
 
 exports.Layouter = Layouter;
 
+exports.LayouterHelper = LayouterHelper;
+
 exports.LeaferCanvas = LeaferCanvas;
 
 exports.Picker = Picker;

package/dist/web.esm.js

@@ -378,6 +378,7 @@ class Watcher {
     }
     constructor(target, userConfig) {
         this.totalTimes = 0;
+        this.changed = 0;
         this.config = {};
         this.__updatedList = new LeafList;
         this.target = target;
@@ -397,8 +398,10 @@ class Watcher {
         this.disabled = true;
     }
     update() {
-        this.changed = true;
-        if (this.running) this.target.emit(RenderEvent.REQUEST);
+        if (this.changed < 100) {
+            this.changed++;
+            if (this.running) this.target.emit(RenderEvent.REQUEST);
+        }
     }
     __onAttrChange(event) {
         this.add(event.target);
@@ -407,18 +410,21 @@ class Watcher {
         if (this.config.usePartLayout) this.__updatedList.add(leaf);
         this.update();
     }
-    __onChildEvent(event) {
+    addChild(child, parent, eventType) {
         if (this.config.usePartLayout) {
-            if (event.type === ChildEvent.ADD) {
+            if (eventType === ChildEvent.ADD) {
                 this.hasAdd = true;
-                this.__pushChild(event.child);
+                this.__pushChild(child);
             } else {
                 this.hasRemove = true;
-                this.__updatedList.add(event.parent);
+                this.__updatedList.add(parent);
             }
         }
         this.update();
     }
+    __onChildEvent(event) {
+        this.addChild(event.child, event.parent, event.type);
+    }
     __pushChild(child) {
         this.__updatedList.add(child);
         if (child.isBranch) this.__loopChildren(child);
@@ -433,7 +439,8 @@ class Watcher {
         }));
         this.__updatedList = new LeafList;
         this.totalTimes++;
-        this.changed = this.hasVisible = this.hasRemove = this.hasAdd = false;
+        this.hasVisible = this.hasRemove = this.hasAdd = false;
+        this.changed = 0;
     }
     __listenEvents() {
         this.__eventIds = [ this.target.on_([ [ PropertyEvent.CHANGE, this.__onAttrChange, this ], [ [ ChildEvent.ADD, ChildEvent.REMOVE ], this.__onChildEvent, this ], [ WatchEvent.REQUEST, this.__onRquestData, this ] ]) ];
@@ -454,47 +461,57 @@ const {updateAllMatrix: updateAllMatrix$1, updateBounds: updateOneBounds, update
 
 const {pushAllChildBranch: pushAllChildBranch, pushAllParent: pushAllParent} = BranchHelper;
 
-function updateMatrix(updateList, levelList) {
-    let layout;
-    updateList.list.forEach(leaf => {
-        layout = leaf.__layout;
-        if (levelList.without(leaf) && !layout.proxyZoom) {
-            if (layout.matrixChanged) {
-                updateAllMatrix$1(leaf, true);
-                levelList.add(leaf);
-                if (leaf.isBranch) pushAllChildBranch(leaf, levelList);
-                pushAllParent(leaf, levelList);
-            } else if (layout.boundsChanged) {
-                levelList.add(leaf);
-                if (leaf.isBranch) leaf.__tempNumber = 0;
-                pushAllParent(leaf, levelList);
+const LayouterHelper = {
+    updateMatrix(updateList, levelList) {
+        let index = 0, leaf, layout;
+        const {list: list} = updateList;
+        while (index < list.length) {
+            leaf = list[index];
+            layout = leaf.__layout;
+            if (levelList.without(leaf) && !layout.proxyZoom) {
+                if (layout.matrixChanged) {
+                    updateAllMatrix$1(leaf, true);
+                    if (leaf.isBranch) pushAllChildBranch(leaf, levelList);
+                    push(leaf, levelList);
+                } else if (layout.boundsChanged) {
+                    if (leaf.isBranch) leaf.__tempNumber = 0;
+                    push(leaf, levelList);
+                }
             }
+            index++;
         }
-    });
-}
-
-function updateBounds(boundsList) {
-    let list, branch, children;
-    boundsList.sort(true);
-    boundsList.levels.forEach(level => {
-        list = boundsList.levelMap[level];
-        for (let i = 0, len = list.length; i < len; i++) {
-            branch = list[i];
-            if (branch.isBranch && branch.__tempNumber) {
-                children = branch.children;
-                for (let j = 0, jLen = children.length; j < jLen; j++) {
-                    if (!children[j].isBranch) {
-                        updateOneBounds(children[j]);
+    },
+    updateBounds(boundsList) {
+        let index = 0, level, list, branch, children;
+        const {levels: levels, levelMap: levelMap} = boundsList;
+        boundsList.sort(true);
+        while (index < levels.length) {
+            level = levels[index];
+            list = levelMap[level];
+            for (let i = 0, len = list.length; i < len; i++) {
+                branch = list[i];
+                if (branch.isBranch && branch.__tempNumber) {
+                    children = branch.children;
+                    for (let j = 0, jLen = children.length; j < jLen; j++) {
+                        if (!children[j].isBranch) {
+                            updateOneBounds(children[j]);
+                        }
                     }
                 }
+                updateOneBounds(branch);
             }
-            updateOneBounds(branch);
+            index++;
         }
-    });
-}
+    },
+    updateChange(updateList) {
+        updateList.list.forEach(updateOneChange);
+    },
+    push: push
+};
 
-function updateChange(updateList) {
-    updateList.list.forEach(updateOneChange);
+function push(leaf, levelList) {
+    levelList.add(leaf);
+    pushAllParent(leaf, levelList);
 }
 
 const {worldBounds: worldBounds} = LeafBoundsHelper;
@@ -601,9 +618,9 @@ class Layouter {
         target.emitEvent(new LayoutEvent(BEFORE, blocks, this.times));
         this.extraBlock = null;
         updateList.sort();
-        updateMatrix(updateList, this.__levelList);
-        updateBounds(this.__levelList);
-        updateChange(updateList);
+        LayouterHelper.updateMatrix(updateList, this.__levelList);
+        LayouterHelper.updateBounds(this.__levelList);
+        LayouterHelper.updateChange(updateList);
         if (this.extraBlock) blocks.push(this.extraBlock);
         blocks.forEach(item => item.setAfter());
         target.emitEvent(new LayoutEvent(LAYOUT, blocks, this.times));
@@ -633,11 +650,16 @@ class Layouter {
         if (target.isBranch) BranchHelper.updateBounds(target); else LeafHelper.updateBounds(target);
         updateAllChange(target);
     }
-    addExtra(leaf) {
+    addExtra(leaf, updateBounds) {
         if (!this.__updatedList.has(leaf)) {
             const {updatedList: updatedList, beforeBounds: beforeBounds} = this.extraBlock || (this.extraBlock = new LayoutBlockData([]));
             updatedList.length ? beforeBounds.add(leaf.__world) : beforeBounds.set(leaf.__world);
             updatedList.add(leaf);
+            if (updateBounds) {
+                const list = this.__levelList;
+                LayouterHelper.push(leaf, list);
+                list.sort(true);
+            }
         }
     }
     createBlock(data) {
@@ -962,7 +984,7 @@ class Picker {
             for (let i = 0, len = list.length; i < len; i++) {
                 find = list[i];
                 if (ignoreHittable || LeafHelper.worldHittable(find)) {
-                    this.hitChild(find, find.hitThrough ? this.point : point);
+                    this.hitChild(find, find.hitThrough ? this.point : point, find.mask && find.parent && find.parent.__onlyHitMask);
                     if (findList.length) {
                         if (find.isBranchLeaf && list.some(item => item !== find && LeafHelper.hasParent(item, find))) {
                             findList.reset();
@@ -1061,7 +1083,7 @@ class Picker {
             }
             const leaf = proxy || child, {hitThrough: hitThrough} = child, {findList: findList} = this;
             if (hitThrough) {
-                const index = findList.list.findIndex(item => item[hitThrough] === child[hitThrough]);
+                const index = findList.list.findIndex(item => hitThrough === "parent" ? LeafHelper.hasParent(item.parent, child.parent) : item[hitThrough] === child[hitThrough]);
                 if (index > 0) return findList.addAt(leaf, index);
             }
             findList.add(leaf);
@@ -1896,7 +1918,7 @@ function checkSizeAndCreateData(ui, attrName, paint, image, leafPaint, boxBounds
         data.__naturalHeight = image.height / data.pixelRatio;
         if (data.__autoSide) {
             ui.forceUpdate();
-            LeafHelper.updateBounds(ui);
+            LeafHelper.updateBounds(ui, true);
             ui.__layout.boundsChanged = true;
             if (ui.__proxyData) {
                 ui.setProxyAttr("width", data.width);
@@ -3175,4 +3197,4 @@ Object.assign(Creator, {
 
 useCanvas();
 
-export { Interaction, Layouter, LeaferCanvas, PathNodeHandleType, Picker, Renderer, Selector, Watcher, useCanvas };
+export { Interaction, Layouter, LayouterHelper, LeaferCanvas, PathNodeHandleType, Picker, Renderer, Selector, Watcher, useCanvas };