js.foresight-devtools 1.0.0 → 1.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.mjs CHANGED
@@ -821,7 +821,7 @@ var $e=Object.defineProperty;var Ie=Object.getOwnPropertyDescriptor;var i=(n,s,e
821
821
  color: #b0c4de;
822
822
  border-bottom-color: #b0c4de;
823
823
  }
824
- `,i([bt({type:String})],P.prototype,"activeTab",2),P=i([ut("tab-selector")],P);import{ForesightManager as X}from"js.foresight";import{LitElement as St,css as Tt,html as H}from"lit";import{customElement as Mt,property as _t,state as U}from"lit/decorators.js";import{map as Dt}from"lit/directives/map.js";function we(n){try{switch(n.type){case"elementRegistered":return{type:"elementRegistered",name:n.elementData.name,id:n.elementData.element.id||"",registerCount:n.elementData.registerCount,hitslop:n.elementData.elementBounds.hitSlop,localizedTimestamp:new Date(n.timestamp).toLocaleTimeString(),summary:n.elementData.registerCount===1?n.elementData.name:`${n.elementData.name} - ${ft(n.elementData.registerCount)} time`};case"elementUnregistered":return{type:"elementUnregistered",name:n.elementData.name,id:n.elementData.element.id||"",registerCount:n.elementData.registerCount,unregisterReason:n.unregisterReason,localizedTimestamp:new Date(n.timestamp).toLocaleTimeString(),summary:`${n.elementData.name} - ${n.unregisterReason}`};case"elementDataUpdated":return{type:"elementDataUpdated",name:n.elementData.name,updatedProps:n.updatedProps||[],isIntersecting:n.elementData.isIntersectingWithViewport,localizedTimestamp:new Date().toLocaleTimeString(),summary:`${n.elementData.name} - ${n.updatedProps.toString()}`};case"callbackInvoked":return{type:"callbackInvoked",name:n.elementData.name,hitType:n.hitType,localizedTimestamp:new Date(n.timestamp).toLocaleTimeString(),summary:`${n.elementData.name} - ${n.hitType.kind}`};case"callbackCompleted":let s=vt(n.elapsed);return{type:"callbackCompleted",...n.status==="error"?{status:"error",errorMessage:n.errorMessage}:{status:"success"},name:n.elementData.name,hitType:n.hitType,callbackRunTimeFormatted:s,callbackRunTimeRaw:n.elapsed,localizedTimestamp:new Date(n.timestamp).toLocaleTimeString(),summary:`${n.elementData.name} - ${s}`};case"mouseTrajectoryUpdate":return{type:"mouseTrajectoryUpdate",currentPoint:n.trajectoryPositions?.currentPoint,predictedPoint:n.trajectoryPositions?.predictedPoint,positionCount:n.trajectoryPositions?.positions?.length||0,mousePredictionEnabled:n.predictionEnabled,localizedTimestamp:new Date().toLocaleTimeString(),summary:""};case"scrollTrajectoryUpdate":return{type:"scrollTrajectoryUpdate",currentPoint:n.currentPoint,predictedPoint:n.predictedPoint,scrollDirection:n.scrollDirection,localizedTimestamp:new Date().toLocaleTimeString(),summary:n.scrollDirection};case"managerSettingsChanged":return{type:"managerSettingsChanged",globalSettings:n.managerData?.globalSettings||{},settingsChanged:n.updatedSettings,localizedTimestamp:new Date(n.timestamp).toLocaleTimeString(),summary:n.updatedSettings.map(t=>t.setting).join(", ")};default:return{type:"serializationError",error:"Failed to serialize event data",errorMessage:JSON.stringify(n),localizedTimestamp:new Date().toLocaleTimeString(),summary:""}}}catch(s){return{type:"serializationError",error:"Failed to serialize event data",localizedTimestamp:new Date().toLocaleTimeString(),errorMessage:s instanceof Error?s.message:String(s),summary:""}}}function vt(n){return`${(n/1e3).toFixed(4)} s`}function ft(n){let s=["th","st","nd","rd"],e=n%100;return n+(s[(e-20)%10]||s[e]||s[0])}import{html as ke,css as yt}from"lit";import{customElement as xt,property as Ee}from"lit/decorators.js";var _=class extends M{constructor(){super(...arguments);this.selectedValues=[]}_handleOptionClick(e){let t=this.selectedValues.includes(e.value);t?this.selectedValues=this.selectedValues.filter(a=>a!==e.value):this.selectedValues=[...this.selectedValues,e.value];let o=!t;this.onSelectionChange?.(e.value,o)}_getTriggerIcon(){return m}_isOptionSelected(e){return this.selectedValues.includes(e.value)}_getTriggerTitle(){let e=this.selectedValues.length;return e===0?"No items selected":e===1?"1 item selected":`${e} items selected`}_getTriggerLabel(){return`Filter options: ${this.selectedValues.length} selected`}render(){let e=`trigger-button ${this.isDropdownOpen?"active":""}`,t=`dropdown-menu ${this.isDropdownOpen?"active":""}`;return ke`
824
+ `,i([bt({type:String})],P.prototype,"activeTab",2),P=i([ut("tab-selector")],P);import{ForesightManager as X}from"js.foresight";import{LitElement as St,css as Tt,html as H}from"lit";import{customElement as Mt,property as _t,state as U}from"lit/decorators.js";import{map as Lt}from"lit/directives/map.js";function we(n){try{switch(n.type){case"elementRegistered":return{type:"elementRegistered",name:n.elementData.name,id:n.elementData.element.id||"",registerCount:n.elementData.registerCount,hitslop:n.elementData.elementBounds.hitSlop,localizedTimestamp:new Date(n.timestamp).toLocaleTimeString(),summary:n.elementData.registerCount===1?n.elementData.name:`${n.elementData.name} - ${ft(n.elementData.registerCount)} time`};case"elementUnregistered":return{type:"elementUnregistered",name:n.elementData.name,id:n.elementData.element.id||"",registerCount:n.elementData.registerCount,unregisterReason:n.unregisterReason,localizedTimestamp:new Date(n.timestamp).toLocaleTimeString(),summary:`${n.elementData.name} - ${n.unregisterReason}`};case"elementDataUpdated":return{type:"elementDataUpdated",name:n.elementData.name,updatedProps:n.updatedProps||[],isIntersecting:n.elementData.isIntersectingWithViewport,localizedTimestamp:new Date().toLocaleTimeString(),summary:`${n.elementData.name} - ${n.updatedProps.toString()}`};case"callbackInvoked":return{type:"callbackInvoked",name:n.elementData.name,hitType:n.hitType,localizedTimestamp:new Date(n.timestamp).toLocaleTimeString(),summary:`${n.elementData.name} - ${n.hitType.kind}`};case"callbackCompleted":let s=vt(n.elapsed);return{type:"callbackCompleted",...n.status==="error"?{status:"error",errorMessage:n.errorMessage}:{status:"success"},name:n.elementData.name,hitType:n.hitType,callbackRunTimeFormatted:s,callbackRunTimeRaw:n.elapsed,localizedTimestamp:new Date(n.timestamp).toLocaleTimeString(),summary:`${n.elementData.name} - ${s}`};case"mouseTrajectoryUpdate":return{type:"mouseTrajectoryUpdate",currentPoint:n.trajectoryPositions?.currentPoint,predictedPoint:n.trajectoryPositions?.predictedPoint,positionCount:n.trajectoryPositions?.positions?.length||0,mousePredictionEnabled:n.predictionEnabled,localizedTimestamp:new Date().toLocaleTimeString(),summary:""};case"scrollTrajectoryUpdate":return{type:"scrollTrajectoryUpdate",currentPoint:n.currentPoint,predictedPoint:n.predictedPoint,scrollDirection:n.scrollDirection,localizedTimestamp:new Date().toLocaleTimeString(),summary:n.scrollDirection};case"managerSettingsChanged":return{type:"managerSettingsChanged",globalSettings:n.managerData?.globalSettings||{},settingsChanged:n.updatedSettings,localizedTimestamp:new Date(n.timestamp).toLocaleTimeString(),summary:n.updatedSettings.map(t=>t.setting).join(", ")};default:return{type:"serializationError",error:"Failed to serialize event data",errorMessage:JSON.stringify(n),localizedTimestamp:new Date().toLocaleTimeString(),summary:""}}}catch(s){return{type:"serializationError",error:"Failed to serialize event data",localizedTimestamp:new Date().toLocaleTimeString(),errorMessage:s instanceof Error?s.message:String(s),summary:""}}}function vt(n){return`${(n/1e3).toFixed(4)} s`}function ft(n){let s=["th","st","nd","rd"],e=n%100;return n+(s[(e-20)%10]||s[e]||s[0])}import{html as ke,css as yt}from"lit";import{customElement as xt,property as Ee}from"lit/decorators.js";var _=class extends M{constructor(){super(...arguments);this.selectedValues=[]}_handleOptionClick(e){let t=this.selectedValues.includes(e.value);t?this.selectedValues=this.selectedValues.filter(a=>a!==e.value):this.selectedValues=[...this.selectedValues,e.value];let o=!t;this.onSelectionChange?.(e.value,o)}_getTriggerIcon(){return m}_isOptionSelected(e){return this.selectedValues.includes(e.value)}_getTriggerTitle(){let e=this.selectedValues.length;return e===0?"No items selected":e===1?"1 item selected":`${e} items selected`}_getTriggerLabel(){return`Filter options: ${this.selectedValues.length} selected`}render(){let e=`trigger-button ${this.isDropdownOpen?"active":""}`,t=`dropdown-menu ${this.isDropdownOpen?"active":""}`;return ke`
825
825
  <div class="dropdown-container">
826
826
  <button
827
827
  class="${e}"
@@ -1014,7 +1014,7 @@ Consider using 'Control Panel' only for better performance."
1014
1014
  </div>
1015
1015
  </tab-header>
1016
1016
  <tab-content .noContentMessage=${this.noContentMessage} .hasContent=${!!this.logs.length}>
1017
- ${this.logs.length===0?H`<div class="no-items">${this.getNoLogsMessage()}</div>`:Dt(this.logs,e=>H`
1017
+ ${this.logs.length===0?H`<div class="no-items">${this.getNoLogsMessage()}</div>`:Lt(this.logs,e=>H`
1018
1018
  <single-log
1019
1019
  .log=${e}
1020
1020
  .isExpanded=${this.expandedLogIds.has(e.logId)}
@@ -1115,7 +1115,7 @@ Consider using 'Control Panel' only for better performance."
1115
1115
  .warning-container:hover svg {
1116
1116
  stroke: #ffdc3e;
1117
1117
  }
1118
- `],i([U()],h.prototype,"logDropdown",2),i([U()],h.prototype,"filterDropdown",2),i([U()],h.prototype,"logLocation",2),i([U()],h.prototype,"eventsEnabled",2),i([U()],h.prototype,"logs",2),i([U()],h.prototype,"expandedLogIds",2),i([_t()],h.prototype,"noContentMessage",2),h=i([Mt("log-tab")],h);import{ForesightManager as _e}from"js.foresight";import{css as Qt,html as De,LitElement as ei}from"lit";import{customElement as ti,state as G}from"lit/decorators.js";var Z="points",Ce="px",Se="tabs",Te="ms";import{LitElement as Pt,html as Ut,css as Nt}from"lit";import{customElement as jt,property as B}from"lit/decorators.js";import{LitElement as Lt,html as Ot,css as $t}from"lit";import{customElement as It,property as Me}from"lit/decorators.js";var D=class extends Lt{constructor(){super(...arguments);this.header="";this.description=""}render(){return Ot`<div class="setting-item">
1118
+ `],i([U()],h.prototype,"logDropdown",2),i([U()],h.prototype,"filterDropdown",2),i([U()],h.prototype,"logLocation",2),i([U()],h.prototype,"eventsEnabled",2),i([U()],h.prototype,"logs",2),i([U()],h.prototype,"expandedLogIds",2),i([_t()],h.prototype,"noContentMessage",2),h=i([Mt("log-tab")],h);import{ForesightManager as _e}from"js.foresight";import{css as Qt,html as Le,LitElement as ei}from"lit";import{customElement as ti,state as G}from"lit/decorators.js";var Z="points",Ce="px",Se="tabs",Te="ms";import{LitElement as Pt,html as Ut,css as Nt}from"lit";import{customElement as jt,property as B}from"lit/decorators.js";import{LitElement as Dt,html as Ot,css as $t}from"lit";import{customElement as It,property as Me}from"lit/decorators.js";var L=class extends Dt{constructor(){super(...arguments);this.header="";this.description=""}render(){return Ot`<div class="setting-item">
1119
1119
  <label>
1120
1120
  <span class="setting-header">${this.header}</span>
1121
1121
  <span class="setting-description"> ${this.description} </span>
@@ -1123,7 +1123,7 @@ Consider using 'Control Panel' only for better performance."
1123
1123
  <div class="setting-controls">
1124
1124
  <slot name="controls"></slot>
1125
1125
  </div>
1126
- </div>`}};D.styles=[$t`
1126
+ </div>`}};L.styles=[$t`
1127
1127
  .setting-item {
1128
1128
  display: flex;
1129
1129
  align-items: center;
@@ -1163,7 +1163,7 @@ Consider using 'Control Panel' only for better performance."
1163
1163
  color: #fff;
1164
1164
  font-size: 13px;
1165
1165
  }
1166
- `],i([Me({type:String})],D.prototype,"header",2),i([Me({type:String})],D.prototype,"description",2),D=i([It("setting-item")],D);import{ForesightManager as Ft}from"js.foresight";var x=class extends Pt{constructor(){super(...arguments);this.isChecked=!1;this.header="";this.description="";this.setting="enableMousePrediction"}handleCheckboxChange(e){let t=e.target;if(t instanceof HTMLInputElement){let o=t.checked;this.setting==="showNameTags"?this.dispatchEvent(new CustomEvent("setting-changed",{detail:{setting:this.setting,value:o},bubbles:!0})):Ft.instance.alterGlobalSettings({[this.setting]:o})}}render(){return Ut`<setting-item header=${this.header} description=${this.description}>
1166
+ `],i([Me({type:String})],L.prototype,"header",2),i([Me({type:String})],L.prototype,"description",2),L=i([It("setting-item")],L);import{ForesightManager as Ft}from"js.foresight";var x=class extends Pt{constructor(){super(...arguments);this.isChecked=!1;this.header="";this.description="";this.setting="enableMousePrediction"}handleCheckboxChange(e){let t=e.target;if(t instanceof HTMLInputElement){let o=t.checked;this.setting==="showNameTags"?this.dispatchEvent(new CustomEvent("setting-changed",{detail:{setting:this.setting,value:o},bubbles:!0})):Ft.instance.alterGlobalSettings({[this.setting]:o})}}render(){return Ut`<setting-item header=${this.header} description=${this.description}>
1167
1167
  <input
1168
1168
  slot="controls"
1169
1169
  type="checkbox"
@@ -1213,7 +1213,7 @@ Consider using 'Control Panel' only for better performance."
1213
1213
  input[type="checkbox"]:hover {
1214
1214
  box-shadow: 0 0 0 3px rgba(176, 196, 222, 0.1);
1215
1215
  }
1216
- `],i([B({type:Boolean})],x.prototype,"isChecked",2),i([B({type:String})],x.prototype,"header",2),i([B({type:String})],x.prototype,"description",2),i([B({type:String})],x.prototype,"setting",2),x=i([jt("setting-item-checkbox")],x);import{LitElement as Vt,html as zt,css as Rt}from"lit";import{customElement as At,property as L,state as Ht}from"lit/decorators.js";import{ForesightManager as Bt}from"js.foresight";var p=class extends Vt{constructor(){super(...arguments);this.minValue=0;this.maxValue=100;this.currentValue=50;this.unit="px";this.header="";this.description="";this.setting="tabOffset";this.displayValue=50}handleRangeInput(e){let t=e.target;t instanceof HTMLInputElement&&(this.displayValue=parseInt(t.value,10))}handleRangeChange(e){let t=e.target;if(t instanceof HTMLInputElement){let o=parseInt(t.value,10);this.displayValue=o,Bt.instance.alterGlobalSettings({[this.setting]:o})}}willUpdate(e){super.willUpdate(e),e.has("currentValue")&&(this.displayValue=this.currentValue)}render(){return zt`<setting-item header=${this.header} description=${this.description}>
1216
+ `],i([B({type:Boolean})],x.prototype,"isChecked",2),i([B({type:String})],x.prototype,"header",2),i([B({type:String})],x.prototype,"description",2),i([B({type:String})],x.prototype,"setting",2),x=i([jt("setting-item-checkbox")],x);import{LitElement as Vt,html as zt,css as Rt}from"lit";import{customElement as At,property as D,state as Ht}from"lit/decorators.js";import{ForesightManager as Bt}from"js.foresight";var p=class extends Vt{constructor(){super(...arguments);this.minValue=0;this.maxValue=100;this.currentValue=50;this.unit="px";this.header="";this.description="";this.setting="tabOffset";this.displayValue=50}handleRangeInput(e){let t=e.target;t instanceof HTMLInputElement&&(this.displayValue=parseInt(t.value,10))}handleRangeChange(e){let t=e.target;if(t instanceof HTMLInputElement){let o=parseInt(t.value,10);this.displayValue=o,Bt.instance.alterGlobalSettings({[this.setting]:o})}}willUpdate(e){super.willUpdate(e),e.has("currentValue")&&(this.displayValue=this.currentValue)}render(){return zt`<setting-item header=${this.header} description=${this.description}>
1217
1217
  <div slot="controls" class="range-wrapper">
1218
1218
  <input
1219
1219
  slot="controls"
@@ -1296,14 +1296,14 @@ Consider using 'Control Panel' only for better performance."
1296
1296
  transform: scale(1.1);
1297
1297
  box-shadow: 0 0 0 4px rgba(176, 196, 222, 0.2);
1298
1298
  }
1299
- `],i([L({type:Number})],p.prototype,"minValue",2),i([L({type:Number})],p.prototype,"maxValue",2),i([L({type:Number})],p.prototype,"currentValue",2),i([L({type:String})],p.prototype,"unit",2),i([L({type:String})],p.prototype,"header",2),i([L({type:String})],p.prototype,"description",2),i([L({type:String})],p.prototype,"setting",2),i([Ht()],p.prototype,"displayValue",2),p=i([At("setting-item-range")],p);var w=class extends ei{constructor(){super();this.changedSettings=[];this._abortController=null;let e=l.instance.devtoolsSettings,t=_e.instance.getManagerData.globalSettings;this.devtoolsSettings=Object.assign({},e),this.managerSettings=Object.assign({},t),this.initialSettings={devtools:Object.assign({},e),manager:Object.assign({},t)}}connectedCallback(){super.connectedCallback(),this._abortController=new AbortController;let{signal:e}=this._abortController;_e.instance.addEventListener("managerSettingsChanged",t=>{this.managerSettings=t.managerData.globalSettings,this._updateChangedSettings()},{signal:e}),this._updateChangedSettings()}disconnectedCallback(){super.disconnectedCallback(),this._abortController?.abort(),this._abortController=null}_updateChangedSettings(){let e=[];this._checkManagerSettingsChanges(e),this._checkDevtoolsSettingsChanges(e),this.changedSettings=e}_checkManagerSettingsChanges(e){let t=["enableMousePrediction","enableTabPrediction","enableScrollPrediction","trajectoryPredictionTime","positionHistorySize","tabOffset","scrollMargin"];for(let o of t){let a=this.initialSettings.manager[o],r=this.managerSettings[o];a!==r&&e.push({name:o,initial:a,current:r})}}_checkDevtoolsSettingsChanges(e){let t=["showNameTags"];for(let o of t){let a=this.initialSettings.devtools[o],r=this.devtoolsSettings[o];a!==r&&e.push({name:o,initial:a,current:r})}}_handleDevtoolsSettingChange(e){let{setting:t,value:o}=e.detail;t==="showNameTags"&&(this.devtoolsSettings={...this.devtoolsSettings,showNameTags:o},l.instance.alterDevtoolsSettings({showNameTags:o}),this._updateChangedSettings())}async handleCopySettings(){if(this.managerSettings)try{let e=this.generateSettingsCode(this.managerSettings);navigator.clipboard&&navigator.clipboard.writeText&&await navigator.clipboard.writeText(e)}catch(e){console.error("Failed to copy settings code:",e)}}generateSettingsCode(e){let t={enableMousePrediction:e.enableMousePrediction,enableTabPrediction:e.enableTabPrediction,enableScrollPrediction:e.enableScrollPrediction,positionHistorySize:e.positionHistorySize,trajectoryPredictionTime:e.trajectoryPredictionTime,tabOffset:e.tabOffset,scrollMargin:e.scrollMargin};return`ForesightManager.initialize(${JSON.stringify(t,null,2)})`}render(){if(!this.managerSettings||!this.devtoolsSettings)return De`<tab-content
1299
+ `],i([D({type:Number})],p.prototype,"minValue",2),i([D({type:Number})],p.prototype,"maxValue",2),i([D({type:Number})],p.prototype,"currentValue",2),i([D({type:String})],p.prototype,"unit",2),i([D({type:String})],p.prototype,"header",2),i([D({type:String})],p.prototype,"description",2),i([D({type:String})],p.prototype,"setting",2),i([Ht()],p.prototype,"displayValue",2),p=i([At("setting-item-range")],p);var w=class extends ei{constructor(){super();this.changedSettings=[];this._abortController=null;let e=l.instance.devtoolsSettings,t=_e.instance.getManagerData.globalSettings;this.devtoolsSettings=Object.assign({},e),this.managerSettings=Object.assign({},t),this.initialSettings={devtools:Object.assign({},e),manager:Object.assign({},t)}}connectedCallback(){super.connectedCallback(),this._abortController=new AbortController;let{signal:e}=this._abortController;_e.instance.addEventListener("managerSettingsChanged",t=>{this.managerSettings=t.managerData.globalSettings,this._updateChangedSettings()},{signal:e}),this._updateChangedSettings()}disconnectedCallback(){super.disconnectedCallback(),this._abortController?.abort(),this._abortController=null}_updateChangedSettings(){let e=[];this._checkManagerSettingsChanges(e),this._checkDevtoolsSettingsChanges(e),this.changedSettings=e}_checkManagerSettingsChanges(e){let t=["enableMousePrediction","enableTabPrediction","enableScrollPrediction","trajectoryPredictionTime","positionHistorySize","tabOffset","scrollMargin"];for(let o of t){let a=this.initialSettings.manager[o],r=this.managerSettings[o];a!==r&&e.push({name:o,initial:a,current:r})}}_checkDevtoolsSettingsChanges(e){let t=["showNameTags"];for(let o of t){let a=this.initialSettings.devtools[o],r=this.devtoolsSettings[o];a!==r&&e.push({name:o,initial:a,current:r})}}_handleDevtoolsSettingChange(e){let{setting:t,value:o}=e.detail;t==="showNameTags"&&(this.devtoolsSettings={...this.devtoolsSettings,showNameTags:o},l.instance.alterDevtoolsSettings({showNameTags:o}),this._updateChangedSettings())}async handleCopySettings(){if(this.managerSettings)try{let e=this.generateSettingsCode(this.managerSettings);navigator.clipboard&&navigator.clipboard.writeText&&await navigator.clipboard.writeText(e)}catch(e){console.error("Failed to copy settings code:",e)}}generateSettingsCode(e){let t={enableMousePrediction:e.enableMousePrediction,enableTabPrediction:e.enableTabPrediction,enableScrollPrediction:e.enableScrollPrediction,positionHistorySize:e.positionHistorySize,trajectoryPredictionTime:e.trajectoryPredictionTime,tabOffset:e.tabOffset,scrollMargin:e.scrollMargin};return`ForesightManager.initialize(${JSON.stringify(t,null,2)})`}render(){if(!this.managerSettings||!this.devtoolsSettings)return Le`<tab-content
1300
1300
  .noContentMessage=${"Loading settings..."}
1301
1301
  .hasContent=${!1}
1302
1302
  ></tab-content>`;let e=this.managerSettings,t=this.changedSettings.length>0?`Settings that have been changed this session compared to your initialized settings.
1303
1303
  Click on the copy icon to easely copy the new setting into your project
1304
1304
 
1305
1305
  `+this.changedSettings.map(o=>`${o.name}: ${JSON.stringify(o.initial)} -> ${JSON.stringify(o.current)}`).join(`
1306
- `):"No settings changed from initial values";return De`
1306
+ `):"No settings changed from initial values";return Le`
1307
1307
  <tab-header>
1308
1308
  <div slot="chips" class="chips-container">
1309
1309
  <chip-element .title=${t}> ${this.changedSettings.length} changed </chip-element>
@@ -1541,7 +1541,7 @@ Click on the copy icon to easely copy the new setting into your project
1541
1541
  width: 100%;
1542
1542
  height: 100%;
1543
1543
  }
1544
- `,i([W()],b.prototype,"activeTab",2),i([W()],b.prototype,"isMinimized",2),i([W()],b.prototype,"visibleCount",2),i([W()],b.prototype,"totalCount",2),b=i([si("control-panel")],b);customElements.get("control-panel")||customElements.define("control-panel",b);import{LitElement as wi,css as ki,html as Ei}from"lit";import{customElement as Ci}from"lit/decorators.js";import{LitElement as ai,html as ri,css as li}from"lit";import{customElement as di,state as Le,query as ci}from"lit/decorators.js";import{ForesightManager as V}from"js.foresight";var C=class extends ai{constructor(){super(...arguments);this.overlayMap=new Map;this.callbackAnimations=new Map;this._abortController=null}connectedCallback(){super.connectedCallback(),this._abortController=new AbortController;let{signal:e}=this._abortController;V.instance.addEventListener("elementRegistered",t=>{t.elementData.isIntersectingWithViewport&&this.createOrUpdateElementOverlay(t.elementData)},{signal:e}),V.instance.addEventListener("elementUnregistered",t=>{this.removeElementOverlay(t.elementData)},{signal:e}),V.instance.addEventListener("elementDataUpdated",t=>{t.updatedProps.includes("bounds")&&this.createOrUpdateElementOverlay(t.elementData),t.updatedProps.includes("visibility")&&(t.elementData.isIntersectingWithViewport||this.removeElementOverlay(t.elementData))},{signal:e}),V.instance.addEventListener("callbackInvoked",t=>{this.highlightElementCallback(t.elementData,t.hitType)},{signal:e}),V.instance.addEventListener("callbackCompleted",t=>{this.unhighlightElementCallback(t.elementData)},{signal:e}),document.addEventListener("showNameTagsChanged",t=>{let o=t;this.updateNameTagVisibility(o.detail.showNameTags)},{signal:e})}createElementOverlays(e){let t=document.createElement("div");t.className="expanded-overlay";let o=document.createElement("div");o.className="name-label",this.containerElement.appendChild(t),this.containerElement.appendChild(o);let a={expandedOverlay:t,nameLabel:o};return this.overlayMap.set(e.element,a),a}updateElementOverlays(e,t){let{expandedOverlay:o,nameLabel:a}=e,{expandedRect:r}=t.elementBounds,N=r.right-r.left,te=r.bottom-r.top;o.style.width=`${N}px`,o.style.height=`${te}px`,o.style.transform=`translate3d(${r.left}px, ${r.top}px, 0)`,l.instance.devtoolsSettings.showNameTags?(a.textContent=t.name,a.style.display="block",a.style.transform=`translate3d(${r.left}px, ${r.top-25}px, 0)`):a.style.display="none"}createOrUpdateElementOverlay(e){let t=this.overlayMap.get(e.element);t||(t=this.createElementOverlays(e)),this.updateElementOverlays(t,e)}removeElementOverlay(e){let t=this.overlayMap.get(e.element);t&&(t.expandedOverlay.remove(),t.nameLabel.remove(),this.overlayMap.delete(e.element)),this.clearCallbackAnimationTimeout(e.element)}clearCallbackAnimationTimeout(e){let t=this.callbackAnimations.get(e);t&&(clearTimeout(t.timeoutId),this.callbackAnimations.delete(e))}highlightElementCallback(e,t){let o=this.overlayMap.get(e.element);if(o)switch(this.clearCallbackAnimationTimeout(e.element),t.kind){case"mouse":o.expandedOverlay.classList.add("invoked-by-mouse");break;case"scroll":o.expandedOverlay.classList.add("invoked-by-scroll");break;case"tab":o.expandedOverlay.classList.add("invoked-by-tab");break;default:}}unhighlightElementCallback(e){let t=this.overlayMap.get(e.element);if(t){let o=setTimeout(()=>{t.expandedOverlay.classList.remove("callback-invoked"),this.callbackAnimations.delete(e.element)},400);this.callbackAnimations.set(e.element,{element:e.element,timeoutId:o})}}updateNameTagVisibility(e){this.overlayMap.forEach(t=>{let o=t.nameLabel;e?o.style.display="block":o.style.display="none"})}disconnectedCallback(){super.disconnectedCallback(),this._abortController?.abort(),this._abortController=null}render(){return ri` <div id="overlays-container"></div> `}};C.styles=[li`
1544
+ `,i([W()],b.prototype,"activeTab",2),i([W()],b.prototype,"isMinimized",2),i([W()],b.prototype,"visibleCount",2),i([W()],b.prototype,"totalCount",2),b=i([si("control-panel")],b);customElements.get("control-panel")||customElements.define("control-panel",b);import{LitElement as wi,css as ki,html as Ei}from"lit";import{customElement as Ci}from"lit/decorators.js";import{LitElement as ai,html as ri,css as li}from"lit";import{customElement as di,state as De,query as ci}from"lit/decorators.js";import{ForesightManager as V}from"js.foresight";var C=class extends ai{constructor(){super(...arguments);this.overlayMap=new Map;this.callbackAnimations=new Map;this._abortController=null}connectedCallback(){super.connectedCallback(),this._abortController=new AbortController;let{signal:e}=this._abortController;V.instance.addEventListener("elementRegistered",t=>{t.elementData.isIntersectingWithViewport&&this.createOrUpdateElementOverlay(t.elementData)},{signal:e}),V.instance.addEventListener("elementUnregistered",t=>{this.removeElementOverlay(t.elementData)},{signal:e}),V.instance.addEventListener("elementDataUpdated",t=>{t.updatedProps.includes("bounds")&&this.createOrUpdateElementOverlay(t.elementData),t.updatedProps.includes("visibility")&&(t.elementData.isIntersectingWithViewport||this.removeElementOverlay(t.elementData))},{signal:e}),V.instance.addEventListener("callbackInvoked",t=>{this.highlightElementCallback(t.elementData,t.hitType)},{signal:e}),V.instance.addEventListener("callbackCompleted",t=>{this.unhighlightElementCallback(t.elementData)},{signal:e}),document.addEventListener("showNameTagsChanged",t=>{let o=t;this.updateNameTagVisibility(o.detail.showNameTags)},{signal:e})}createElementOverlays(e){let t=document.createElement("div");t.className="expanded-overlay";let o=document.createElement("div");o.className="name-label",this.containerElement.appendChild(t),this.containerElement.appendChild(o);let a={expandedOverlay:t,nameLabel:o};return this.overlayMap.set(e.element,a),a}updateElementOverlays(e,t){let{expandedOverlay:o,nameLabel:a}=e,{expandedRect:r}=t.elementBounds,N=r.right-r.left,te=r.bottom-r.top;o.style.width=`${N}px`,o.style.height=`${te}px`,o.style.transform=`translate3d(${r.left}px, ${r.top}px, 0)`,l.instance.devtoolsSettings.showNameTags?(a.textContent=t.name,a.style.display="block",a.style.transform=`translate3d(${r.left}px, ${r.top-25}px, 0)`):a.style.display="none"}createOrUpdateElementOverlay(e){let t=this.overlayMap.get(e.element);t||(t=this.createElementOverlays(e)),this.updateElementOverlays(t,e)}removeElementOverlay(e){let t=this.overlayMap.get(e.element);t&&(t.expandedOverlay.remove(),t.nameLabel.remove(),this.overlayMap.delete(e.element)),this.clearCallbackAnimationTimeout(e.element)}clearCallbackAnimationTimeout(e){let t=this.callbackAnimations.get(e);t&&(clearTimeout(t.timeoutId),this.callbackAnimations.delete(e))}highlightElementCallback(e,t){let o=this.overlayMap.get(e.element);if(o)switch(this.clearCallbackAnimationTimeout(e.element),t.kind){case"mouse":o.expandedOverlay.classList.add("invoked-by-mouse");break;case"scroll":o.expandedOverlay.classList.add("invoked-by-scroll");break;case"tab":o.expandedOverlay.classList.add("invoked-by-tab");break;default:}}unhighlightElementCallback(e){let t=this.overlayMap.get(e.element);if(t){let o=setTimeout(()=>{t.expandedOverlay.classList.remove("callback-invoked"),this.callbackAnimations.delete(e.element)},400);this.callbackAnimations.set(e.element,{element:e.element,timeoutId:o})}}updateNameTagVisibility(e){this.overlayMap.forEach(t=>{let o=t.nameLabel;e?o.style.display="block":o.style.display="none"})}disconnectedCallback(){super.disconnectedCallback(),this._abortController?.abort(),this._abortController=null}render(){return ri` <div id="overlays-container"></div> `}};C.styles=[li`
1545
1545
  :host {
1546
1546
  position: fixed;
1547
1547
  top: 0;
@@ -1608,7 +1608,7 @@ Click on the copy icon to easely copy the new setting into your project
1608
1608
  white-space: nowrap;
1609
1609
  pointer-events: none;
1610
1610
  }
1611
- `],i([Le()],C.prototype,"overlayMap",2),i([Le()],C.prototype,"callbackAnimations",2),i([ci("#overlays-container")],C.prototype,"containerElement",2),C=i([di("element-overlays")],C);import{LitElement as pi,html as gi,css as hi}from"lit";import{customElement as mi,state as ee}from"lit/decorators.js";import{styleMap as ui}from"lit/directives/style-map.js";import{ForesightManager as Y}from"js.foresight";var S=class extends pi{constructor(){super(...arguments);this._abortController=new AbortController;this._mousePredictionIsEnabled=Y.instance.getManagerData.globalSettings.enableMousePrediction;this._isVisible=!1;this._trajectoryStyles={};this._isUpdateScheduled=!1;this._latestTrajectory=null;this.handleSettingsChange=e=>{let t=e.managerData.globalSettings.enableMousePrediction;this._mousePredictionIsEnabled=t,t||(this._isVisible=!1)};this.handleTrajectoryUpdate=e=>{this._mousePredictionIsEnabled&&(this._isVisible=!0,this._latestTrajectory=e.trajectoryPositions,this._isUpdateScheduled||(this._isUpdateScheduled=!0,requestAnimationFrame(this.renderTrajectory)))};this.renderTrajectory=()=>{if(!this._latestTrajectory){this._isUpdateScheduled=!1;return}let{currentPoint:e,predictedPoint:t}=this._latestTrajectory,o=t.x-e.x,a=t.y-e.y,r=Math.sqrt(o*o+a*a);if(r===0)this._trajectoryStyles={display:"none"};else{let N=Math.atan2(a,o)*180/Math.PI;this._trajectoryStyles={transform:`translate(${e.x}px, ${e.y}px) rotate(${N}deg)`,width:`${r}px`}}this._isUpdateScheduled=!1,this.requestUpdate()}}connectedCallback(){super.connectedCallback();let{signal:e}=this._abortController;Y.instance.addEventListener("mouseTrajectoryUpdate",this.handleTrajectoryUpdate,{signal:e}),Y.instance.addEventListener("scrollTrajectoryUpdate",()=>{this._isVisible=!1},{signal:e}),Y.instance.addEventListener("managerSettingsChanged",this.handleSettingsChange,{signal:e})}disconnectedCallback(){super.disconnectedCallback(),this._abortController.abort()}render(){let e={display:this._isVisible?"block":"none",...this._trajectoryStyles};return gi` <div class="trajectory-line" style=${ui(e)}></div> `}};S.styles=[hi`
1611
+ `],i([De()],C.prototype,"overlayMap",2),i([De()],C.prototype,"callbackAnimations",2),i([ci("#overlays-container")],C.prototype,"containerElement",2),C=i([di("element-overlays")],C);import{LitElement as pi,html as gi,css as hi}from"lit";import{customElement as mi,state as ee}from"lit/decorators.js";import{styleMap as ui}from"lit/directives/style-map.js";import{ForesightManager as Y}from"js.foresight";var S=class extends pi{constructor(){super(...arguments);this._abortController=new AbortController;this._mousePredictionIsEnabled=Y.instance.getManagerData.globalSettings.enableMousePrediction;this._isVisible=!1;this._trajectoryStyles={};this._isUpdateScheduled=!1;this._latestTrajectory=null;this.handleSettingsChange=e=>{let t=e.managerData.globalSettings.enableMousePrediction;this._mousePredictionIsEnabled=t,t||(this._isVisible=!1)};this.handleTrajectoryUpdate=e=>{this._mousePredictionIsEnabled&&(this._isVisible=!0,this._latestTrajectory=e.trajectoryPositions,this._isUpdateScheduled||(this._isUpdateScheduled=!0,requestAnimationFrame(this.renderTrajectory)))};this.renderTrajectory=()=>{if(!this._latestTrajectory){this._isUpdateScheduled=!1;return}let{currentPoint:e,predictedPoint:t}=this._latestTrajectory,o=t.x-e.x,a=t.y-e.y,r=Math.sqrt(o*o+a*a);if(r===0)this._trajectoryStyles={display:"none"};else{let N=Math.atan2(a,o)*180/Math.PI;this._trajectoryStyles={transform:`translate(${e.x}px, ${e.y}px) rotate(${N}deg)`,width:`${r}px`}}this._isUpdateScheduled=!1,this.requestUpdate()}}connectedCallback(){super.connectedCallback();let{signal:e}=this._abortController;Y.instance.addEventListener("mouseTrajectoryUpdate",this.handleTrajectoryUpdate,{signal:e}),Y.instance.addEventListener("scrollTrajectoryUpdate",()=>{this._isVisible=!1},{signal:e}),Y.instance.addEventListener("managerSettingsChanged",this.handleSettingsChange,{signal:e})}disconnectedCallback(){super.disconnectedCallback(),this._abortController.abort()}render(){let e={display:this._isVisible?"block":"none",...this._trajectoryStyles};return gi` <div class="trajectory-line" style=${ui(e)}></div> `}};S.styles=[hi`
1612
1612
  :host {
1613
1613
  display: block;
1614
1614
  }
@@ -1716,7 +1716,7 @@ Click on the copy icon to easely copy the new setting into your project
1716
1716
  pointer-events: none;
1717
1717
  z-index: 9999;
1718
1718
  }
1719
- `],R=i([Ci("debug-overlay")],R);var l=class extends Si{constructor(){super(...arguments);this.isInitialized=!1;this.devtoolsSettings={showDebugger:!0,isControlPanelDefaultMinimized:!1,showNameTags:!0,sortElementList:"visibility",logging:{logLocation:"controlPanel",callbackCompleted:!0,callbackInvoked:!0,elementDataUpdated:!1,elementRegistered:!1,elementUnregistered:!1,managerSettingsChanged:!0,mouseTrajectoryUpdate:!1,scrollTrajectoryUpdate:!1}}}static initialize(e){l._instance||(l._instance=document.createElement("foresight-devtools"),document.body.appendChild(l._instance));let t=l._instance;return t.isInitialized=!0,e!==void 0&&t.alterDevtoolsSettings(e),t}static get instance(){return l._instance?l._instance:l.initialize()}disconnectedCallback(){super.disconnectedCallback(),this.cleanup()}shouldUpdateSetting(e,t){return e!==void 0&&e!==t}alterDevtoolsSettings(e){e&&(this.shouldUpdateSetting(e.showNameTags,this.devtoolsSettings.showNameTags)&&(this.devtoolsSettings.showNameTags=e.showNameTags,this.dispatchEvent(new CustomEvent("showNameTagsChanged",{detail:{showNameTags:e.showNameTags},bubbles:!0}))),this.shouldUpdateSetting(e.showDebugger,this.devtoolsSettings.showDebugger)&&(this.devtoolsSettings.showDebugger=e.showDebugger,this.requestUpdate()),this.shouldUpdateSetting(e.isControlPanelDefaultMinimized,this.devtoolsSettings.isControlPanelDefaultMinimized)&&(this.devtoolsSettings.isControlPanelDefaultMinimized=e.isControlPanelDefaultMinimized),this.shouldUpdateSetting(e.sortElementList,this.devtoolsSettings.sortElementList)&&(this.devtoolsSettings.sortElementList=e.sortElementList),e.logging&&(this.shouldUpdateSetting(e.logging.logLocation,this.devtoolsSettings.logging.logLocation)&&(this.devtoolsSettings.logging.logLocation=e.logging.logLocation),this.shouldUpdateSetting(e.logging.callbackCompleted,this.devtoolsSettings.logging.callbackCompleted)&&(this.devtoolsSettings.logging.callbackCompleted=e.logging.callbackCompleted),this.shouldUpdateSetting(e.logging.callbackInvoked,this.devtoolsSettings.logging.callbackInvoked)&&(this.devtoolsSettings.logging.callbackInvoked=e.logging.callbackInvoked),this.shouldUpdateSetting(e.logging.elementDataUpdated,this.devtoolsSettings.logging.elementDataUpdated)&&(this.devtoolsSettings.logging.elementDataUpdated=e.logging.elementDataUpdated),this.shouldUpdateSetting(e.logging.elementRegistered,this.devtoolsSettings.logging.elementRegistered)&&(this.devtoolsSettings.logging.elementRegistered=e.logging.elementRegistered),this.shouldUpdateSetting(e.logging.elementUnregistered,this.devtoolsSettings.logging.elementUnregistered)&&(this.devtoolsSettings.logging.elementUnregistered=e.logging.elementUnregistered),this.shouldUpdateSetting(e.logging.managerSettingsChanged,this.devtoolsSettings.logging.managerSettingsChanged)&&(this.devtoolsSettings.logging.managerSettingsChanged=e.logging.managerSettingsChanged),this.shouldUpdateSetting(e.logging.mouseTrajectoryUpdate,this.devtoolsSettings.logging.mouseTrajectoryUpdate)&&(this.devtoolsSettings.logging.mouseTrajectoryUpdate=e.logging.mouseTrajectoryUpdate),this.shouldUpdateSetting(e.logging.scrollTrajectoryUpdate,this.devtoolsSettings.logging.scrollTrajectoryUpdate)&&(this.devtoolsSettings.logging.scrollTrajectoryUpdate=e.logging.scrollTrajectoryUpdate)))}cleanup(){this.requestUpdate()}render(){return!this.isInitialized||!this.devtoolsSettings.showDebugger?Oe``:Oe`<control-panel></control-panel> <debug-overlay></debug-overlay>`}};l.styles=[Ti`
1719
+ `],R=i([Ci("debug-overlay")],R);var l=class extends Si{constructor(){super();this.isInitialized=!1;this.devtoolsSettings={showDebugger:!0,isControlPanelDefaultMinimized:!1,showNameTags:!0,sortElementList:"visibility",logging:{logLocation:"controlPanel",callbackCompleted:!0,callbackInvoked:!0,elementDataUpdated:!1,elementRegistered:!1,elementUnregistered:!1,managerSettingsChanged:!0,mouseTrajectoryUpdate:!1,scrollTrajectoryUpdate:!1}}}static createAndAppendInstance(){typeof window>"u"||typeof document>"u"||(l._instance=document.createElement("foresight-devtools"),document.body.appendChild(l._instance))}static initialize(e){if(l._instance||l.createAndAppendInstance(),!l._instance)return l._instance;let t=l._instance;return t.isInitialized=!0,e!==void 0&&t.alterDevtoolsSettings(e),t}static get instance(){return l._instance?l._instance:l.initialize()}disconnectedCallback(){super.disconnectedCallback(),this.cleanup()}shouldUpdateSetting(e,t){return e!==void 0&&e!==t}alterDevtoolsSettings(e){e&&(this.shouldUpdateSetting(e.showNameTags,this.devtoolsSettings.showNameTags)&&(this.devtoolsSettings.showNameTags=e.showNameTags,this.dispatchEvent(new CustomEvent("showNameTagsChanged",{detail:{showNameTags:e.showNameTags},bubbles:!0}))),this.shouldUpdateSetting(e.showDebugger,this.devtoolsSettings.showDebugger)&&(this.devtoolsSettings.showDebugger=e.showDebugger,this.requestUpdate()),this.shouldUpdateSetting(e.isControlPanelDefaultMinimized,this.devtoolsSettings.isControlPanelDefaultMinimized)&&(this.devtoolsSettings.isControlPanelDefaultMinimized=e.isControlPanelDefaultMinimized),this.shouldUpdateSetting(e.sortElementList,this.devtoolsSettings.sortElementList)&&(this.devtoolsSettings.sortElementList=e.sortElementList),e.logging&&(this.shouldUpdateSetting(e.logging.logLocation,this.devtoolsSettings.logging.logLocation)&&(this.devtoolsSettings.logging.logLocation=e.logging.logLocation),this.shouldUpdateSetting(e.logging.callbackCompleted,this.devtoolsSettings.logging.callbackCompleted)&&(this.devtoolsSettings.logging.callbackCompleted=e.logging.callbackCompleted),this.shouldUpdateSetting(e.logging.callbackInvoked,this.devtoolsSettings.logging.callbackInvoked)&&(this.devtoolsSettings.logging.callbackInvoked=e.logging.callbackInvoked),this.shouldUpdateSetting(e.logging.elementDataUpdated,this.devtoolsSettings.logging.elementDataUpdated)&&(this.devtoolsSettings.logging.elementDataUpdated=e.logging.elementDataUpdated),this.shouldUpdateSetting(e.logging.elementRegistered,this.devtoolsSettings.logging.elementRegistered)&&(this.devtoolsSettings.logging.elementRegistered=e.logging.elementRegistered),this.shouldUpdateSetting(e.logging.elementUnregistered,this.devtoolsSettings.logging.elementUnregistered)&&(this.devtoolsSettings.logging.elementUnregistered=e.logging.elementUnregistered),this.shouldUpdateSetting(e.logging.managerSettingsChanged,this.devtoolsSettings.logging.managerSettingsChanged)&&(this.devtoolsSettings.logging.managerSettingsChanged=e.logging.managerSettingsChanged),this.shouldUpdateSetting(e.logging.mouseTrajectoryUpdate,this.devtoolsSettings.logging.mouseTrajectoryUpdate)&&(this.devtoolsSettings.logging.mouseTrajectoryUpdate=e.logging.mouseTrajectoryUpdate),this.shouldUpdateSetting(e.logging.scrollTrajectoryUpdate,this.devtoolsSettings.logging.scrollTrajectoryUpdate)&&(this.devtoolsSettings.logging.scrollTrajectoryUpdate=e.logging.scrollTrajectoryUpdate)))}cleanup(){this.requestUpdate()}render(){return!this.isInitialized||!this.devtoolsSettings.showDebugger?Oe``:Oe`<control-panel></control-panel> <debug-overlay></debug-overlay>`}};l.styles=[Ti`
1720
1720
  :host {
1721
1721
  display: block;
1722
1722
  }