clickgo 3.1.5-dev14 → 3.1.6-dev15

package/dist/lib/dom.js

@@ -1,4 +1,27 @@
 "use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
 var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
@@ -9,12 +32,12 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
     });
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.fullscreen = exports.siblingsData = exports.siblings = exports.findParentByClass = exports.findParentByData = exports.bindResize = exports.bindMove = exports.is = exports.bindDrag = exports.bindLong = exports.allowEvent = exports.bindGesture = exports.bindDown = exports.bindClick = exports.clearWatchProperty = exports.isWatchProperty = exports.watchProperty = exports.clearWatchStyle = exports.isWatchStyle = exports.watchStyle = exports.clearWatch = exports.isWatch = exports.unwatch = exports.watch = exports.clearWatchSize = exports.isWatchSize = exports.unwatchSize = exports.watchSize = exports.getStyleCount = exports.removeStyle = exports.pushStyle = exports.removeFromStyleList = exports.createToStyleList = exports.hasTouchButMouse = exports.setGlobalCursor = void 0;
-const clickgo = require("../clickgo");
-const form = require("./form");
-const core = require("./core");
-const tool = require("./tool");
-const topClass = ['#cg-form-list', '#cg-pop-list', '#cg-notify', '#cg-simpletask', '#cg-launcher'];
+exports.fullscreen = exports.siblingsData = exports.siblings = exports.findParentByClass = exports.findParentByData = exports.bindResize = exports.bindMove = exports.is = exports.bindDrag = exports.bindLong = exports.allowEvent = exports.bindGesture = exports.bindDown = exports.bindClick = exports.getWatchInfo = exports.clearWatchProperty = exports.isWatchProperty = exports.watchProperty = exports.clearWatchStyle = exports.isWatchStyle = exports.watchStyle = exports.clearWatch = exports.isWatch = exports.unwatch = exports.watch = exports.getWatchCount = exports.clearWatchSize = exports.isWatchSize = exports.unwatchSize = exports.watchSize = exports.getWatchSizeCount = exports.getStyleCount = exports.removeStyle = exports.pushStyle = exports.removeFromStyleList = exports.createToStyleList = exports.hasTouchButMouse = exports.setGlobalCursor = exports.inPage = void 0;
+const clickgo = __importStar(require("../clickgo"));
+const form = __importStar(require("./form"));
+const core = __importStar(require("./core"));
+const tool = __importStar(require("./tool"));
+const topClass = ['#cg-form-list', '#cg-pop-list', '#cg-notify', '#cg-simpletask', '#cg-launcher', '#cg-confirm'];
 function classUnfold(after, out = []) {
     const arr = [];
     for (const name of topClass) {
@@ -37,6 +60,10 @@ ${classUnfold('::selection', ['#cg-launcher'])} {background-color: rgba(0, 0, 0,
 ${classUnfold('*')}, ${classUnfold('*::after')}, ${classUnfold('*::before')} {box-sizing: border-box; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); flex-shrink: 0;}
 ${classUnfold()}, ${classUnfold('input')}, ${classUnfold('textarea')} {font-family: "Lucida Sans Unicode", "Helvetica Neue","Helvetica","PingFang SC","Hiragino Sans GB","Noto Sans CJK SC","Noto Sans CJK","Source Han Sans","WenQuanYi Micro Hei","Microsoft YaHei",sans-serif; font-size: 12px; line-height: 1; -webkit-font-smoothing: antialiased;}
 </style>`);
+function inPage(el) {
+    return document.body.contains(el);
+}
+exports.inPage = inPage;
 let globalCursorStyle;
 function setGlobalCursor(type) {
     if (!globalCursorStyle) {
@@ -80,7 +107,7 @@ function removeFromStyleList(taskId) {
     (_a = document.getElementById('cg-style-task' + taskId.toString())) === null || _a === void 0 ? void 0 : _a.remove();
 }
 exports.removeFromStyleList = removeFromStyleList;
-function pushStyle(taskId, style, type = 'global', formId = 0) {
+function pushStyle(taskId, style, type = 'global', formId = 0, panelId) {
     const el = document.querySelector(`#cg-style-task${taskId} > .cg-style-${type}`);
     if (!el) {
         return;
@@ -92,11 +119,11 @@ function pushStyle(taskId, style, type = 'global', formId = 0) {
         el.insertAdjacentHTML('beforeend', `<style data-name="${formId}">${style}</style>`);
     }
     else {
-        el.insertAdjacentHTML('beforeend', `<style class="cg-style-form${formId}">${style}</style>`);
+        el.insertAdjacentHTML('beforeend', `<style class="cg-style-form${formId}" data-panel="${panelId ? panelId.toString() : ''}">${style}</style>`);
     }
 }
 exports.pushStyle = pushStyle;
-function removeStyle(taskId, type = 'global', formId = 0) {
+function removeStyle(taskId, type = 'global', formId = 0, panelId) {
     const styleTask = document.getElementById('cg-style-task' + taskId.toString());
     if (!styleTask) {
         return;
@@ -124,7 +151,7 @@ function removeStyle(taskId, type = 'global', formId = 0) {
         }
     }
     else {
-        const elist = styleTask.querySelectorAll('.cg-style-form' + formId.toString());
+        const elist = styleTask.querySelectorAll('.cg-style-form' + formId.toString() + (panelId ? '[data-panel="' + panelId.toString() + '"]' : ''));
         for (let i = 0; i < elist.length; ++i) {
             elist.item(i).remove();
         }
@@ -136,11 +163,25 @@ function getStyleCount(taskId, type) {
 }
 exports.getStyleCount = getStyleCount;
 const watchSizeList = {};
+function getWatchSizeCount(taskId) {
+    if (!taskId) {
+        return Object.keys(watchSizeList).length;
+    }
+    let count = 0;
+    for (const id in watchSizeList) {
+        if (watchSizeList[id].taskId !== taskId) {
+            continue;
+        }
+        ++count;
+    }
+    return count;
+}
+exports.getWatchSizeCount = getWatchSizeCount;
 let watchSizeIndex = 0;
 const resizeObserver = new ResizeObserver(function (entries) {
     for (const entrie of entries) {
         const el = entrie.target;
-        if (!el.offsetParent) {
+        if (!document.body.contains(el)) {
             resizeObserver.unobserve(el);
             if (watchSizeList[el.dataset.cgRoindex]) {
                 delete watchSizeList[el.dataset.cgRoindex];
@@ -220,6 +261,20 @@ function clearWatchSize(taskId) {
 }
 exports.clearWatchSize = clearWatchSize;
 const watchList = {};
+function getWatchCount(taskId) {
+    if (!taskId) {
+        return Object.keys(watchList).length;
+    }
+    let count = 0;
+    for (const id in watchList) {
+        if (watchList[id].taskId !== taskId) {
+            continue;
+        }
+        ++count;
+    }
+    return count;
+}
+exports.getWatchCount = getWatchCount;
 let watchIndex = 0;
 function watch(el, cb, mode = 'default', immediate = false, taskId) {
     if (isWatch(el)) {
@@ -262,11 +317,8 @@ function watch(el, cb, mode = 'default', immediate = false, taskId) {
             };
             break;
         }
-        case 'default': {
+        case 'text': {
             moi = {
-                'attributeFilter': ['style', 'class'],
-                'attributeOldValue': true,
-                'attributes': true,
                 'characterData': true,
                 'childList': true,
                 'subtree': true
@@ -274,11 +326,18 @@ function watch(el, cb, mode = 'default', immediate = false, taskId) {
             break;
         }
         default: {
-            moi = mode;
+            moi = {
+                'attributeFilter': ['style', 'class'],
+                'attributeOldValue': true,
+                'attributes': true,
+                'characterData': true,
+                'childList': true,
+                'subtree': true
+            };
         }
     }
     const mo = new MutationObserver((mutations) => {
-        if (!el.offsetParent) {
+        if (!document.body.contains(el)) {
             mo.disconnect();
             if (watchList[index]) {
                 delete watchList[index];
@@ -338,6 +397,24 @@ function clearWatch(taskId) {
     }
 }
 exports.clearWatch = clearWatch;
+const watchCgTimerHandler = function () {
+    for (const index in watchSizeList) {
+        const item = watchSizeList[index];
+        if (document.body.contains(item.el)) {
+            continue;
+        }
+        delete watchSizeList[index];
+    }
+    for (const index in watchList) {
+        const item = watchList[index];
+        if (document.body.contains(item.el)) {
+            continue;
+        }
+        delete watchList[index];
+    }
+    window.setTimeout(watchCgTimerHandler, 1000 * 60 * 7);
+};
+watchCgTimerHandler();
 const watchStyleList = {};
 let watchStyleIndex = 0;
 function watchStyle(el, name, cb, immediate = false) {
@@ -349,12 +426,11 @@ function watchStyle(el, name, cb, immediate = false) {
         return;
     }
     const formId = formWrap.dataset.formId;
-    if (!watchStyleList[formId]) {
-        watchStyleList[formId] = {};
-    }
+    const panelWrap = findParentByData(el, 'panel-id');
+    const panelId = panelWrap ? panelWrap.dataset.panelId : 'default';
     const index = el.dataset.cgStyleindex;
     if (index) {
-        const item = watchStyleList[formId][index];
+        const item = watchStyleList[formId][panelId][index];
         for (const n of name) {
             if (!item.names[n]) {
                 item.names[n] = {
@@ -371,13 +447,19 @@ function watchStyle(el, name, cb, immediate = false) {
         }
         return;
     }
+    if (!watchStyleList[formId]) {
+        watchStyleList[formId] = {};
+    }
+    if (!watchStyleList[formId][panelId]) {
+        watchStyleList[formId][panelId] = {};
+    }
     const sd = getComputedStyle(el);
-    watchStyleList[formId][watchStyleIndex] = {
+    watchStyleList[formId][panelId][watchStyleIndex] = {
         'el': el,
         'sd': sd,
         'names': {}
     };
-    const item = watchStyleList[formId][watchStyleIndex];
+    const item = watchStyleList[formId][panelId][watchStyleIndex];
     for (const n of name) {
         item.names[n] = {
             'val': item.sd[n],
@@ -391,47 +473,28 @@ function watchStyle(el, name, cb, immediate = false) {
     ++watchStyleIndex;
 }
 exports.watchStyle = watchStyle;
-let watchStyleTimer = 0;
-const watchStyleHandler = function () {
-    if (form.getFocus) {
-        const formId = form.getFocus();
-        if (formId && watchStyleList[formId]) {
-            for (const index in watchStyleList[formId]) {
-                const item = watchStyleList[formId][index];
-                if (!item.el.offsetParent) {
-                    delete watchStyleList[formId][index];
-                    if (!Object.keys(watchStyleList[formId]).length) {
-                        delete watchStyleList[formId];
-                    }
-                    continue;
-                }
-                for (const name in item.names) {
-                    if (item.sd[name] === item.names[name].val) {
-                        continue;
-                    }
-                    const old = item.names[name].val;
-                    item.names[name].val = item.sd[name];
-                    for (const cb of item.names[name].cb) {
-                        cb(name, item.sd[name], old);
-                    }
-                }
-            }
-        }
-    }
-    watchStyleTimer = requestAnimationFrame(watchStyleHandler);
-};
-watchStyleHandler();
 function isWatchStyle(el) {
     return el.dataset.cgStyleindex ? true : false;
 }
 exports.isWatchStyle = isWatchStyle;
-function clearWatchStyle(formId) {
+function clearWatchStyle(formId, panelId) {
     if (!watchStyleList[formId]) {
         return;
     }
-    for (const index in watchStyleList[formId]) {
-        const item = watchStyleList[formId][index];
-        item.el.removeAttribute('data-cg-styleindex');
+    for (const panel in watchStyleList[formId]) {
+        if (panelId) {
+            if (panel !== panelId.toString()) {
+                continue;
+            }
+        }
+        for (const index in watchStyleList[formId][panel]) {
+            const item = watchStyleList[formId][panel][index];
+            item.el.removeAttribute('data-cg-styleindex');
+        }
+        delete watchStyleList[formId][panel];
+    }
+    if (Object.keys(watchStyleList[formId]).length) {
+        return;
     }
     delete watchStyleList[formId];
 }
@@ -447,12 +510,11 @@ function watchProperty(el, name, cb, immediate = false) {
         return;
     }
     const formId = formWrap.dataset.formId;
-    if (!watchPropertyObjects[formId]) {
-        watchPropertyObjects[formId] = {};
-    }
+    const panelWrap = findParentByData(el, 'panel-id');
+    const panelId = panelWrap ? panelWrap.dataset.panelId : 'default';
     const index = el.dataset.cgPropertyindex;
     if (index) {
-        const item = watchPropertyObjects[formId][index];
+        const item = watchPropertyObjects[formId][panelId][index];
         for (const n of name) {
             if (!item.names[n]) {
                 item.names[n] = {
@@ -469,11 +531,17 @@ function watchProperty(el, name, cb, immediate = false) {
         }
         return;
     }
-    watchPropertyObjects[formId][watchPropertyIndex] = {
+    if (!watchPropertyObjects[formId]) {
+        watchPropertyObjects[formId] = {};
+    }
+    if (!watchPropertyObjects[formId][panelId]) {
+        watchPropertyObjects[formId][panelId] = {};
+    }
+    watchPropertyObjects[formId][panelId][watchPropertyIndex] = {
         'el': el,
         'names': {}
     };
-    const item = watchPropertyObjects[formId][watchPropertyIndex];
+    const item = watchPropertyObjects[formId][panelId][watchPropertyIndex];
     for (const n of name) {
         item.names[n] = {
             'val': item.el[n],
@@ -487,50 +555,182 @@ function watchProperty(el, name, cb, immediate = false) {
     ++watchPropertyIndex;
 }
 exports.watchProperty = watchProperty;
-let watchPropertyTimer = 0;
-const watchPropertyHandler = function () {
-    if (form.getFocus) {
-        const formId = form.getFocus();
-        if (formId && watchPropertyObjects[formId]) {
-            for (const index in watchPropertyObjects[formId]) {
-                const item = watchPropertyObjects[formId][index];
-                if (!item.el.offsetParent) {
-                    delete watchPropertyObjects[formId][index];
-                    if (!Object.keys(watchPropertyObjects[formId]).length) {
-                        delete watchPropertyObjects[formId];
-                    }
-                    continue;
-                }
-                for (const name in item.names) {
-                    if (item.el[name] === item.names[name].val) {
-                        continue;
-                    }
-                    item.names[name].val = item.el[name];
-                    for (const cb of item.names[name].cb) {
-                        cb(name, item.el[name]);
-                    }
-                }
-            }
-        }
-    }
-    watchPropertyTimer = requestAnimationFrame(watchPropertyHandler);
-};
-watchPropertyHandler();
 function isWatchProperty(el) {
     return el.dataset.cgPropertyindex ? true : false;
 }
 exports.isWatchProperty = isWatchProperty;
-function clearWatchProperty(formId) {
+function clearWatchProperty(formId, panelId) {
     if (!watchPropertyObjects[formId]) {
         return;
     }
-    for (const index in watchPropertyObjects[formId]) {
-        const item = watchPropertyObjects[formId][index];
-        item.el.removeAttribute('data-cg-propertyindex');
+    for (const panel in watchPropertyObjects[formId]) {
+        if (panelId) {
+            if (panel !== panelId.toString()) {
+                continue;
+            }
+        }
+        for (const index in watchPropertyObjects[formId][panel]) {
+            const item = watchPropertyObjects[formId][panel][index];
+            item.el.removeAttribute('data-cg-propertyindex');
+        }
+        delete watchPropertyObjects[formId][panel];
+    }
+    if (Object.keys(watchPropertyObjects[formId]).length) {
+        return;
     }
     delete watchPropertyObjects[formId];
 }
 exports.clearWatchProperty = clearWatchProperty;
+function getWatchInfo() {
+    const rtn = {
+        'formId': 0,
+        'default': {},
+        'panels': {}
+    };
+    const formId = form.getFocus();
+    if (!formId) {
+        return rtn;
+    }
+    rtn.formId = formId;
+    const panelIds = form.getActivePanel(formId);
+    const handler = (item, type, panelId) => {
+        var _a, _b, _c;
+        if (panelId) {
+            if (!rtn.panels[panelId]) {
+                rtn.panels[panelId] = {};
+            }
+        }
+        const ritem = panelId ? rtn.panels[panelId] : rtn.default;
+        const cname = (_c = (_a = item.el.dataset.cgControl) !== null && _a !== void 0 ? _a : (_b = findParentByData(item.el, 'cg-control')) === null || _b === void 0 ? void 0 : _b.dataset.cgControl) !== null && _c !== void 0 ? _c : 'unknown';
+        if (!ritem[cname]) {
+            ritem[cname] = {
+                'style': {
+                    'count': 0,
+                    'list': []
+                },
+                'property': {
+                    'count': 0,
+                    'list': []
+                }
+            };
+        }
+        ++ritem[cname][type].count;
+        for (const name in item.names) {
+            if (ritem[cname][type].list.includes(name)) {
+                continue;
+            }
+            ritem[cname][type].list.push(name);
+        }
+    };
+    if (watchStyleList[formId].default) {
+        for (const index in watchStyleList[formId].default) {
+            handler(watchStyleList[formId].default[index], 'style');
+        }
+    }
+    for (const id of panelIds) {
+        if (watchStyleList[formId][id]) {
+            for (const index in watchStyleList[formId][id]) {
+                handler(watchStyleList[formId][id][index], 'style', id.toString());
+            }
+        }
+    }
+    if (watchPropertyObjects[formId].default) {
+        for (const index in watchPropertyObjects[formId].default) {
+            handler(watchPropertyObjects[formId].default[index], 'property');
+        }
+    }
+    for (const id of panelIds) {
+        if (watchPropertyObjects[formId][id]) {
+            for (const index in watchPropertyObjects[formId][id]) {
+                handler(watchPropertyObjects[formId][id][index], 'property', id.toString());
+            }
+        }
+    }
+    return rtn;
+}
+exports.getWatchInfo = getWatchInfo;
+let watchTimer = 0;
+const watchTimerHandler = function () {
+    if (form.getFocus) {
+        const formId = form.getFocus();
+        if (formId) {
+            const panelIds = form.getActivePanel(formId);
+            if (watchStyleList[formId]) {
+                const handler = (item, panelId, index) => {
+                    if (!document.body.contains(item.el)) {
+                        delete watchStyleList[formId][panelId][index];
+                        if (!Object.keys(watchStyleList[formId][panelId]).length) {
+                            delete watchStyleList[formId][panelId];
+                        }
+                        if (!Object.keys(watchStyleList[formId]).length) {
+                            delete watchStyleList[formId];
+                        }
+                        return;
+                    }
+                    for (const name in item.names) {
+                        if (item.sd[name] === item.names[name].val) {
+                            continue;
+                        }
+                        const old = item.names[name].val;
+                        item.names[name].val = item.sd[name];
+                        for (const cb of item.names[name].cb) {
+                            cb(name, item.sd[name], old);
+                        }
+                    }
+                };
+                if (watchStyleList[formId].default) {
+                    for (const index in watchStyleList[formId].default) {
+                        handler(watchStyleList[formId].default[index], 'default', index);
+                    }
+                }
+                for (const id of panelIds) {
+                    if (watchStyleList[formId][id]) {
+                        for (const index in watchStyleList[formId][id]) {
+                            handler(watchStyleList[formId][id][index], id.toString(), index);
+                        }
+                    }
+                }
+            }
+            if (watchPropertyObjects[formId]) {
+                const handler = (item, panelId, index) => {
+                    if (!document.body.contains(item.el)) {
+                        delete watchPropertyObjects[formId][panelId][index];
+                        if (!Object.keys(watchPropertyObjects[formId][panelId]).length) {
+                            delete watchPropertyObjects[formId][panelId];
+                        }
+                        if (!Object.keys(watchPropertyObjects[formId]).length) {
+                            delete watchPropertyObjects[formId];
+                        }
+                        return;
+                    }
+                    for (const name in item.names) {
+                        if (item.el[name] === item.names[name].val) {
+                            continue;
+                        }
+                        item.names[name].val = item.el[name];
+                        for (const cb of item.names[name].cb) {
+                            cb(name, item.el[name]);
+                        }
+                    }
+                };
+                if (watchPropertyObjects[formId].default) {
+                    for (const index in watchPropertyObjects[formId].default) {
+                        handler(watchPropertyObjects[formId].default[index], 'default', index);
+                    }
+                }
+                for (const id of panelIds) {
+                    if (watchPropertyObjects[formId][id]) {
+                        for (const index in watchPropertyObjects[formId][id]) {
+                            handler(watchPropertyObjects[formId][id][index], id.toString(), index);
+                        }
+                    }
+                }
+            }
+        }
+    }
+    watchTimer = requestAnimationFrame(watchTimerHandler);
+};
+watchTimerHandler();
 function bindClick(e, handler) {
     const x = e instanceof MouseEvent ? e.clientX : e.touches[0].clientX;
     const y = e instanceof MouseEvent ? e.clientY : e.touches[0].clientY;
@@ -562,7 +762,7 @@ function bindDown(oe, opt) {
     let isStart = false;
     let end = undefined;
     const move = function (e) {
-        if ((!e.target || !e.target.offsetParent) && e.cancelable) {
+        if (!e.target || !document.body.contains(e.target) && e.cancelable) {
             e.preventDefault();
         }
         let dir = 'top';
@@ -1067,7 +1267,8 @@ exports.bindDrag = bindDrag;
 exports.is = clickgo.vue.reactive({
     'move': false,
     'shift': false,
-    'ctrl': false
+    'ctrl': false,
+    'meta': false
 });
 window.addEventListener('keydown', function (e) {
     switch (e.key) {
@@ -1079,6 +1280,10 @@ window.addEventListener('keydown', function (e) {
             exports.is.ctrl = true;
             break;
         }
+        case 'Meta': {
+            exports.is.meta = true;
+            break;
+        }
     }
 });
 window.addEventListener('keyup', function (e) {
@@ -1091,6 +1296,10 @@ window.addEventListener('keyup', function (e) {
             exports.is.ctrl = false;
             break;
         }
+        case 'Meta': {
+            exports.is.meta = false;
+            break;
+        }
     }
 });
 function bindMove(e, opt) {
@@ -1104,12 +1313,12 @@ function bindMove(e, opt) {
         };
     }
     exports.is.move = true;
-    setGlobalCursor(getComputedStyle(e.target).cursor);
+    setGlobalCursor(opt.cursor ? opt.cursor : getComputedStyle(e.target).cursor);
     let tx = e instanceof MouseEvent ? e.clientX : e.touches[0].clientX;
     let ty = e instanceof MouseEvent ? e.clientY : e.touches[0].clientY;
     let left, top, right, bottom;
     if (opt.areaObject) {
-        if (!(opt.areaObject instanceof HTMLElement)) {
+        if (!(opt.areaObject instanceof Element)) {
             opt.areaObject = opt.areaObject.$el;
         }
         const areaRect = opt.areaObject.getBoundingClientRect();
@@ -1154,7 +1363,7 @@ function bindMove(e, opt) {
                 }
             }
             if (opt.object) {
-                if (!(opt.object instanceof HTMLElement)) {
+                if (!(opt.object instanceof Element)) {
                     opt.object = opt.object.$el;
                 }
                 const rect = opt.object.getBoundingClientRect();
@@ -1396,7 +1605,7 @@ function bindResize(e, opt) {
         if (!opt.object) {
             return;
         }
-        if (!(opt.object instanceof HTMLElement)) {
+        if (!(opt.object instanceof Element)) {
             opt.object = opt.object.$el;
         }
         const objectRect = opt.object.getBoundingClientRect();
@@ -1469,7 +1678,7 @@ function bindResize(e, opt) {
     });
 }
 exports.bindResize = bindResize;
-function findParentByData(el, name) {
+function findParentByData(el, name, value) {
     let parent = el.parentNode;
     while (parent) {
         if (!parent.tagName) {
@@ -1478,7 +1687,14 @@ function findParentByData(el, name) {
         if (parent.tagName.toLowerCase() === 'body') {
             break;
         }
-        if (parent.getAttribute('data-' + name) !== null) {
+        const v = parent.getAttribute('data-' + name);
+        if (v !== null) {
+            if (value) {
+                if (value === v) {
+                    return parent;
+                }
+                continue;
+            }
             return parent;
         }
         parent = parent.parentNode;
@@ -1547,11 +1763,9 @@ function fullscreen() {
 exports.fullscreen = fullscreen;
 document.addEventListener('visibilitychange', function () {
     if (document.hidden) {
-        cancelAnimationFrame(watchStyleTimer);
-        cancelAnimationFrame(watchPropertyTimer);
+        cancelAnimationFrame(watchTimer);
     }
     else {
-        watchStyleTimer = requestAnimationFrame(watchStyleHandler);
-        watchPropertyTimer = requestAnimationFrame(watchPropertyHandler);
+        watchTimer = requestAnimationFrame(watchTimerHandler);
     }
 });