@ifreeovo/highlight-dom/dist/es/highlight-dom.js

实现类似dom-inspector的高亮效果

import{isElementNode as e,isVisibleElementNode as t}from"./dom.js";import i from"./overlay.js";import{makeHash as r,schedule as s}from"./utils.js";import a from"./plugin.js";export{default as defineConfig}from"./define-config.js";import"radash";import"nanoid";import"requestidlecallback";import"tapable";var h;!function(e){e.Single="single",e.Siblings="siblings"}(h||(h={}));class n{constructor({mode:e=h.Single,maxZIndex:t,portal:i,hash:s=r(),batchMountNum:n=10,plugins:l=[],cache:o=!0}={}){this.taskQueue=[],this.pluginManager=new a,this.mode=e,this.maxZIndex=t,this.portal=i,this.hash=s,this.cache=o,this.batchMountNum=n,this.pluginManager.install(l)}registerPlugin(e){this.pluginManager.use(e)}getHash(){return this.hash}getZIndex(){var e;return(null===(e=this.overlay)||void 0===e?void 0:e.zIndex)||0}interruptTask(){this.taskQueue.forEach((e=>{e.interruptSchedule()})),this.taskQueue=[]}clearOverlay(){this.overlay&&(this.overlay.removeContainer(),this.overlay=void 0)}highlightNode(e){if(!this.overlay)return;const i=this.overlay;if(i.create(e),this.mode===h.Single)return i.mount(),void this.pluginManager.hooks.afterHighlight.call(this);let r=e.previousElementSibling,a=e.nextElementSibling,n="pre",l=!1,o=!1;const u=()=>{let e=0;const h=s((()=>{"pre"===n?(l=!!r&&t(r),l&&i.create(r),r=r&&r.previousElementSibling,n=a?"next":"pre"):"next"===n&&(o=!!a&&t(a),o&&i.create(a),a=a&&a.nextElementSibling,n=r?"pre":"next"),e++}),(()=>(null!=r||null!=a)&&e<this.batchMountNum),(()=>{requestAnimationFrame((()=>{if(!h.isInterrupt)return i.mount(),r||a?(this.taskQueue=[],void u()):void 0;this.pluginManager.hooks.afterHighlight.call(this)}))}));this.taskQueue.push(h)};u()}clearOverlayCache(){this.overlay&&this.overlay.clearCache()}reset(){this.interruptTask(),this.clearOverlay()}shouldHighlight(i){return e(i)?!!t(i)||(console.warn("element is not visible"),!1):(console.warn('the parameter "target" must be HTMLElement or SVGElement'),!1)}highlight(e,t={}){if(this.pluginManager.hooks.beforeHighlight.call(this,e),this.reset(),Object.keys(t).forEach((e=>{["mode","maxZIndex","hash"].includes(e)&&(this[e]=t[e])})),!e)throw new Error('the parameter "target" is required');this.shouldHighlight(e)&&(this.overlay||(this.overlay=i.getInstance({zIndex:this.maxZIndex,portal:this.portal,cache:this.cache,hash:this.hash,pluginManager:this.pluginManager})),this.highlightNode(e))}}export{h as ModeEnum,n as default};
//# sourceMappingURL=highlight-dom.js.map