js.foresight-devtools 1.1.2-beta.1 → 1.1.2-beta.2

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.d.ts CHANGED
@@ -177,6 +177,7 @@ declare class SingleElement extends LitElement {
177
177
  onToggle: ((elementId: string) => void) | undefined;
178
178
  private getBorderColor;
179
179
  private getStatusIndicatorClass;
180
+ private getStatusText;
180
181
  private formatElementDetails;
181
182
  render(): lit.TemplateResult<1>;
182
183
  }
@@ -190,12 +191,13 @@ declare class ElementTab extends LitElement {
190
191
  static styles: lit.CSSResult;
191
192
  private hitCount;
192
193
  private visibleElementsCount;
194
+ private activeElementCallbacksCount;
193
195
  private totalElementsCount;
194
196
  private sortDropdown;
195
197
  private sortOrder;
196
198
  private elementListItems;
197
199
  private noContentMessage;
198
- private activeCallbacks;
200
+ private runningCallbacks;
199
201
  private expandedElementIds;
200
202
  private elementIdCounter;
201
203
  private _abortController;
@@ -203,6 +205,7 @@ declare class ElementTab extends LitElement {
203
205
  private handleSortChange;
204
206
  private generateElementId;
205
207
  private handleElementToggle;
208
+ private updateActiveCallbackCount;
206
209
  private updateVisibilityCounts;
207
210
  private _generateHitsChipTitle;
208
211
  connectedCallback(): void;
package/dist/index.js CHANGED
@@ -1,4 +1,4 @@
1
- var Ue=Object.defineProperty;var Ne=Object.getOwnPropertyDescriptor;var n=(o,s,e,t)=>{for(var i=t>1?void 0:t?Ne(s,e):s,a=o.length-1,r;a>=0;a--)(r=o[a])&&(i=(t?r(s,e,i):r(i))||i);return t&&i&&Ue(s,e,i),i};import{LitElement as Dn,css as Ln,html as Pe}from"lit";import{customElement as _n,state as $n}from"lit/decorators.js";import{LitElement as an,css as sn,html as rn}from"lit";import{customElement as ln,state as q}from"lit/decorators.js";import{classMap as ee}from"lit/directives/class-map.js";import{css as gt,html as xe,LitElement as ht}from"lit";import{customElement as mt,state as y}from"lit/decorators.js";import{map as ut}from"lit/directives/map.js";import{ForesightManager as P}from"js.foresight";import{html as p}from"lit";var ne=p`
1
+ var Ue=Object.defineProperty;var Ne=Object.getOwnPropertyDescriptor;var n=(o,s,e,t)=>{for(var i=t>1?void 0:t?Ne(s,e):s,a=o.length-1,r;a>=0;a--)(r=o[a])&&(i=(t?r(s,e,i):r(i))||i);return t&&i&&Ue(s,e,i),i};import{LitElement as Mn,css as Ln,html as Pe}from"lit";import{customElement as _n,state as In}from"lit/decorators.js";import{LitElement as an,css as sn,html as rn}from"lit";import{customElement as ln,state as q}from"lit/decorators.js";import{classMap as ee}from"lit/directives/class-map.js";import{css as gt,html as xe,LitElement as mt}from"lit";import{customElement as ht,state as b}from"lit/decorators.js";import{map as ut}from"lit/directives/map.js";import{ForesightManager as L}from"js.foresight";import{html as p}from"lit";var ne=p`
2
2
  <svg
3
3
  xmlns="http://www.w3.org/2000/svg"
4
4
  width="16"
@@ -111,7 +111,7 @@ var Ue=Object.defineProperty;var Ne=Object.getOwnPropertyDescriptor;var n=(o,s,e
111
111
  >
112
112
  <path d="M8 6h13M8 12h13M8 18h13M3 6h.01M3 12h.01M3 18h.01" />
113
113
  </svg>
114
- `,m=p`
114
+ `,h=p`
115
115
  <svg
116
116
  xmlns="http://www.w3.org/2000/svg"
117
117
  width="16"
@@ -125,7 +125,7 @@ var Ue=Object.defineProperty;var Ne=Object.getOwnPropertyDescriptor;var n=(o,s,e
125
125
  >
126
126
  <polygon points="22,3 2,3 10,12.46 10,19 14,21 14,12.46" />
127
127
  </svg>
128
- `,de=p`
128
+ `,ce=p`
129
129
  <svg
130
130
  xmlns="http://www.w3.org/2000/svg"
131
131
  width="16"
@@ -140,7 +140,7 @@ var Ue=Object.defineProperty;var Ne=Object.getOwnPropertyDescriptor;var n=(o,s,e
140
140
  <circle cx="12" cy="12" r="10" />
141
141
  <line x1="4.93" y1="4.93" x2="19.07" y2="19.07" />
142
142
  </svg>
143
- `,ce=p`
143
+ `,de=p`
144
144
  <svg
145
145
  xmlns="http://www.w3.org/2000/svg"
146
146
  width="24"
@@ -187,7 +187,7 @@ var Ue=Object.defineProperty;var Ne=Object.getOwnPropertyDescriptor;var n=(o,s,e
187
187
  <line x1="12" y1="9" x2="12" y2="13"></line>
188
188
  <line x1="12" y1="17" x2="12.01" y2="17"></line>
189
189
  </svg>
190
- `,he=p`
190
+ `,me=p`
191
191
  <svg
192
192
  xmlns="http://www.w3.org/2000/svg"
193
193
  width="16"
@@ -208,7 +208,7 @@ var Ue=Object.defineProperty;var Ne=Object.getOwnPropertyDescriptor;var n=(o,s,e
208
208
  <path d="M10 8l2-2 2 2"></path>
209
209
  <path d="M14 16l-2 2-2-2"></path>
210
210
  </svg>
211
- `;import{LitElement as Ve,html as Fe,css as je}from"lit";import{customElement as ze,property as Re}from"lit/decorators.js";var O=class extends Ve{constructor(){super(...arguments);this.title=""}render(){return Fe`
211
+ `;import{LitElement as Ve,html as Fe,css as je}from"lit";import{customElement as Re,property as ze}from"lit/decorators.js";var O=class extends Ve{constructor(){super(...arguments);this.title=""}render(){return Fe`
212
212
  <span class="chip" title="${this.title}">
213
213
  <slot></slot>
214
214
  </span>
@@ -232,11 +232,11 @@ var Ue=Object.defineProperty;var Ne=Object.getOwnPropertyDescriptor;var n=(o,s,e
232
232
  line-height: 1.2;
233
233
  transition: all 0.2s ease;
234
234
  }
235
- `],n([Re({type:String})],O.prototype,"title",2),O=n([ze("chip-element")],O);import{LitElement as Ae,html as X,css as He}from"lit";import{customElement as Be,property as me}from"lit/decorators.js";var M=class extends Ae{constructor(){super(...arguments);this.noContentMessage="No content available.";this.hasContent=!0}render(){return X`
235
+ `],n([ze({type:String})],O.prototype,"title",2),O=n([Re("chip-element")],O);import{LitElement as Ae,html as X,css as He}from"lit";import{customElement as Be,property as he}from"lit/decorators.js";var D=class extends Ae{constructor(){super(...arguments);this.noContentMessage="No content available.";this.hasContent=!0}render(){return X`
236
236
  <div class="content-container">
237
237
  ${this.hasContent?X`<slot></slot>`:X`<div class="no-content-message">${this.noContentMessage}</div>`}
238
238
  </div>
239
- `}};M.styles=[He`
239
+ `}};D.styles=[He`
240
240
  :host {
241
241
  overflow: hidden;
242
242
  }
@@ -275,7 +275,7 @@ var Ue=Object.defineProperty;var Ne=Object.getOwnPropertyDescriptor;var n=(o,s,e
275
275
  font-style: italic;
276
276
  font-family: "Courier New", monospace;
277
277
  }
278
- `],n([me({type:String,attribute:"no-content-message"})],M.prototype,"noContentMessage",2),n([me({type:Boolean})],M.prototype,"hasContent",2),M=n([Be("tab-content")],M);import{LitElement as Ge,html as We,css as Ke}from"lit";import{customElement as Ye}from"lit/decorators.js";var j=class extends Ge{render(){return We`
278
+ `],n([he({type:String,attribute:"no-content-message"})],D.prototype,"noContentMessage",2),n([he({type:Boolean})],D.prototype,"hasContent",2),D=n([Be("tab-content")],D);import{LitElement as Ge,html as We,css as Ke}from"lit";import{customElement as Ye}from"lit/decorators.js";var j=class extends Ge{render(){return We`
279
279
  <div class="tab-bar-elements">
280
280
  <div class="tab-bar-info">
281
281
  <div class="stats-chips">
@@ -484,15 +484,15 @@ var Ue=Object.defineProperty;var Ne=Object.getOwnPropertyDescriptor;var n=(o,s,e
484
484
  color: #b0c4de;
485
485
  font-weight: bold;
486
486
  }
487
- `],n([Ze()],d.prototype,"isDropdownOpen",2),n([Xe({type:Array})],d.prototype,"dropdownOptions",2);var D=d;var I=class extends D{constructor(){super(...arguments);this.selectedOptionValue=""}connectedCallback(){super.connectedCallback(),this.dropdownOptions.length>0&&!this.selectedOptionValue&&(this.selectedOptionValue=this.dropdownOptions[0].value)}willUpdate(e){e.has("dropdownOptions")&&this.dropdownOptions.length>0&&!this.selectedOptionValue&&(this.selectedOptionValue=this.dropdownOptions[0].value)}_handleOptionClick(e){e.value!==this.selectedOptionValue&&(this.selectedOptionValue=e.value,this.onSelectionChange?.(e.value)),this._closeDropdown()}_getTriggerIcon(){let e=this._getSelectedOption();return e?e.icon:Qe``}_isOptionSelected(e){return e.value===this.selectedOptionValue}_getTriggerTitle(){let e=this._getSelectedOption();return e?e.title:"Change selection"}_getTriggerLabel(){let e=this._getSelectedOption();return e?`Current selection: ${e.label}`:"No selection"}_getSelectedOption(){return this.dropdownOptions.find(e=>e.value===this.selectedOptionValue)}};n([be({type:String})],I.prototype,"selectedOptionValue",2),n([be({type:Function})],I.prototype,"onSelectionChange",2),I=n([et("single-select-dropdown")],I);import{LitElement as lt,html as dt,css as ct}from"lit";import{customElement as pt,property as G}from"lit/decorators.js";import{LitElement as at,html as ye,css as st}from"lit";import{customElement as rt,property as z}from"lit/decorators.js";import{LitElement as tt,html as nt,css as it}from"lit";import{customElement as ot,property as ve,state as fe}from"lit/decorators.js";var v=class extends tt{constructor(){super(...arguments);this.title="Copy to clipboard";this.isCopied=!1;this.copyTimeout=null}async handleClick(e){if(!this.isCopied){if(this.onCopy)try{await this.onCopy(e)}catch(t){console.error("Error in onCopy function:",t)}this.isCopied=!0,this.copyTimeout&&clearTimeout(this.copyTimeout),this.copyTimeout=setTimeout(()=>{this.isCopied=!1,this.copyTimeout=null},2e3)}}disconnectedCallback(){super.disconnectedCallback(),this.copyTimeout&&(clearTimeout(this.copyTimeout),this.copyTimeout=null)}render(){return nt`
487
+ `],n([Ze()],d.prototype,"isDropdownOpen",2),n([Xe({type:Array})],d.prototype,"dropdownOptions",2);var M=d;var P=class extends M{constructor(){super(...arguments);this.selectedOptionValue=""}connectedCallback(){super.connectedCallback(),this.dropdownOptions.length>0&&!this.selectedOptionValue&&(this.selectedOptionValue=this.dropdownOptions[0].value)}willUpdate(e){e.has("dropdownOptions")&&this.dropdownOptions.length>0&&!this.selectedOptionValue&&(this.selectedOptionValue=this.dropdownOptions[0].value)}_handleOptionClick(e){e.value!==this.selectedOptionValue&&(this.selectedOptionValue=e.value,this.onSelectionChange?.(e.value)),this._closeDropdown()}_getTriggerIcon(){let e=this._getSelectedOption();return e?e.icon:Qe``}_isOptionSelected(e){return e.value===this.selectedOptionValue}_getTriggerTitle(){let e=this._getSelectedOption();return e?e.title:"Change selection"}_getTriggerLabel(){let e=this._getSelectedOption();return e?`Current selection: ${e.label}`:"No selection"}_getSelectedOption(){return this.dropdownOptions.find(e=>e.value===this.selectedOptionValue)}};n([be({type:String})],P.prototype,"selectedOptionValue",2),n([be({type:Function})],P.prototype,"onSelectionChange",2),P=n([et("single-select-dropdown")],P);import{LitElement as lt,html as ct,css as dt}from"lit";import{customElement as pt,property as G}from"lit/decorators.js";import{LitElement as at,html as ye,css as st}from"lit";import{customElement as rt,property as R}from"lit/decorators.js";import{LitElement as tt,html as nt,css as it}from"lit";import{customElement as ot,property as ve,state as fe}from"lit/decorators.js";var f=class extends tt{constructor(){super(...arguments);this.title="Copy to clipboard";this.isCopied=!1;this.copyTimeout=null}async handleClick(e){if(!this.isCopied){if(this.onCopy)try{await this.onCopy(e)}catch(t){console.error("Error in onCopy function:",t)}this.isCopied=!0,this.copyTimeout&&clearTimeout(this.copyTimeout),this.copyTimeout=setTimeout(()=>{this.isCopied=!1,this.copyTimeout=null},2e3)}}disconnectedCallback(){super.disconnectedCallback(),this.copyTimeout&&(clearTimeout(this.copyTimeout),this.copyTimeout=null)}render(){return nt`
488
488
  <button
489
489
  class="copy-button ${this.isCopied?"copied":""}"
490
490
  title="${this.title}"
491
491
  @click=${this.handleClick}
492
492
  >
493
- ${this.isCopied?pe:ce}
493
+ ${this.isCopied?pe:de}
494
494
  </button>
495
- `}};v.styles=it`
495
+ `}};f.styles=it`
496
496
  .copy-button {
497
497
  background: transparent;
498
498
  border: 0px;
@@ -531,7 +531,7 @@ var Ue=Object.defineProperty;var Ne=Object.getOwnPropertyDescriptor;var n=(o,s,e
531
531
  .copy-button.copied svg {
532
532
  stroke: #4caf50;
533
533
  }
534
- `,n([ve({type:String})],v.prototype,"title",2),n([ve({type:Function})],v.prototype,"onCopy",2),n([fe()],v.prototype,"isCopied",2),n([fe()],v.prototype,"copyTimeout",2),v=n([ot("copy-icon")],v);var u=class extends at{constructor(){super(...arguments);this.borderColor="#555";this.showCopyButton=!1;this.itemId="";this.isExpanded=!1}toggleExpand(){this.onToggle&&this.onToggle(this.itemId)}async handleCopy(e){e.stopPropagation();let t=this.shadowRoot?.querySelector('slot[name="details"]');if(t){let a=t.assignedNodes().map(r=>r.textContent).join("");try{await navigator.clipboard.writeText(a)}catch(r){console.error("Failed to copy text: ",r)}}}render(){return this.style.setProperty("--border-color",this.borderColor),ye`
534
+ `,n([ve({type:String})],f.prototype,"title",2),n([ve({type:Function})],f.prototype,"onCopy",2),n([fe()],f.prototype,"isCopied",2),n([fe()],f.prototype,"copyTimeout",2),f=n([ot("copy-icon")],f);var u=class extends at{constructor(){super(...arguments);this.borderColor="#555";this.showCopyButton=!1;this.itemId="";this.isExpanded=!1}toggleExpand(){this.onToggle&&this.onToggle(this.itemId)}async handleCopy(e){e.stopPropagation();let t=this.shadowRoot?.querySelector('slot[name="details"]');if(t){let a=t.assignedNodes().map(r=>r.textContent).join("");try{await navigator.clipboard.writeText(a)}catch(r){console.error("Failed to copy text: ",r)}}}render(){return this.style.setProperty("--border-color",this.borderColor),ye`
535
535
  <div class="item-entry ${this.isExpanded?"expanded":""}">
536
536
  <div class="item-header ${this.isExpanded?"expanded":""}" @click="${this.toggleExpand}">
537
537
  <div class="item-content">
@@ -654,27 +654,35 @@ var Ue=Object.defineProperty;var Ne=Object.getOwnPropertyDescriptor;var n=(o,s,e
654
654
  display: block;
655
655
  overflow-x: auto;
656
656
  }
657
- `],n([z()],u.prototype,"borderColor",2),n([z()],u.prototype,"showCopyButton",2),n([z()],u.prototype,"itemId",2),n([z()],u.prototype,"isExpanded",2),n([z()],u.prototype,"onToggle",2),u=n([rt("expandable-item")],u);var f=class extends lt{constructor(){super(...arguments);this.isActive=!1;this.isExpanded=!1}getBorderColor(){return this.isActive?"#ffeb3b":this.elementData.isIntersectingWithViewport?"#4caf50":"#666"}getStatusIndicatorClass(){return this.isActive?"prefetching":this.elementData.isIntersectingWithViewport?"visible":"hidden"}formatElementDetails(){let e=this.elementData,t={tagName:e.element.tagName.toLowerCase(),isIntersecting:e.isIntersectingWithViewport,registerCount:e.registerCount,hitSlop:{top:e.elementBounds.hitSlop.top,right:e.elementBounds.hitSlop.right,bottom:e.elementBounds.hitSlop.bottom,left:e.elementBounds.hitSlop.left},meta:this.elementData.meta};return JSON.stringify(t,null,2)}render(){return dt`
658
- <expandable-item
659
- .borderColor=${this.getBorderColor()}
660
- .showCopyButton=${!0}
661
- .itemId=${this.elementData.elementId}
662
- .isExpanded=${this.isExpanded}
663
- .onToggle=${this.onToggle}
664
- >
665
- <div slot="content" class="element-content">
666
- <div class="status-indicator ${this.getStatusIndicatorClass()}"></div>
667
- <span class="element-name ${this.isActive?"callback-active":""}">
668
- ${this.elementData.name||"unnamed"}
669
- </span>
670
- </div>
671
- <div slot="details">${this.formatElementDetails()}</div>
672
- </expandable-item>
673
- `}};f.styles=[ct`
657
+ `],n([R()],u.prototype,"borderColor",2),n([R()],u.prototype,"showCopyButton",2),n([R()],u.prototype,"itemId",2),n([R()],u.prototype,"isExpanded",2),n([R()],u.prototype,"onToggle",2),u=n([rt("expandable-item")],u);var y=class extends lt{constructor(){super(...arguments);this.isActive=!1;this.isExpanded=!1}getBorderColor(){return this.isActive?"#ffeb3b":this.elementData.callbackInfo.isCallbackActive?this.elementData.isIntersectingWithViewport?"#4caf50":"#666":"#999"}getStatusIndicatorClass(){return this.isActive?"prefetching":this.elementData.callbackInfo.isCallbackActive?this.elementData.isIntersectingWithViewport?"visible":"hidden":"inactive"}getStatusText(){return this.isActive?"callback active":this.elementData.callbackInfo.isCallbackActive?this.elementData.isIntersectingWithViewport?"in viewport":"not in viewport":"callback inactive"}formatElementDetails(){let e=this.elementData,t={status:this.getStatusText(),tagName:e.element.tagName.toLowerCase(),isIntersecting:e.isIntersectingWithViewport,registerCount:e.registerCount,hitSlop:{top:e.elementBounds.hitSlop.top,right:e.elementBounds.hitSlop.right,bottom:e.elementBounds.hitSlop.bottom,left:e.elementBounds.hitSlop.left},callbackInfo:e.callbackInfo,meta:this.elementData.meta};return JSON.stringify(t,null,2)}render(){let e=!this.elementData.isIntersectingWithViewport;return ct`
658
+ <div class="element-wrapper ${e?"not-visible":""}">
659
+ <expandable-item
660
+ .borderColor=${this.getBorderColor()}
661
+ .showCopyButton=${!0}
662
+ .itemId=${this.elementData.elementId}
663
+ .isExpanded=${this.isExpanded}
664
+ .onToggle=${this.onToggle}
665
+ >
666
+ <div slot="content" class="element-content" title="Status: ${this.getStatusText()}">
667
+ <div class="status-indicator ${this.getStatusIndicatorClass()}"></div>
668
+ <span
669
+ class="element-name ${this.isActive?"callback-active":this.elementData.callbackInfo.isCallbackActive?"":"callback-inactive"}"
670
+ >
671
+ ${this.elementData.name||"unnamed"}
672
+ </span>
673
+ </div>
674
+ <div slot="details">${this.formatElementDetails()}</div>
675
+ </expandable-item>
676
+ </div>
677
+ `}};y.styles=[dt`
674
678
  :host {
675
679
  display: block;
676
680
  }
677
681
 
682
+ .element-wrapper {
683
+ display: block;
684
+ }
685
+
678
686
  .element-content {
679
687
  display: flex;
680
688
  align-items: center;
@@ -683,6 +691,7 @@ var Ue=Object.defineProperty;var Ne=Object.getOwnPropertyDescriptor;var n=(o,s,e
683
691
  }
684
692
 
685
693
  .status-indicator {
694
+ margin-left: 2px;
686
695
  width: 8px;
687
696
  height: 8px;
688
697
  flex-shrink: 0;
@@ -704,6 +713,11 @@ var Ue=Object.defineProperty;var Ne=Object.getOwnPropertyDescriptor;var n=(o,s,e
704
713
  box-shadow: 0 0 0 2px rgba(255, 235, 59, 0.4);
705
714
  }
706
715
 
716
+ .status-indicator.inactive {
717
+ background-color: #999;
718
+ box-shadow: 0 0 0 2px rgba(153, 153, 153, 0.3);
719
+ }
720
+
707
721
  .element-name {
708
722
  flex-grow: 1;
709
723
  white-space: nowrap;
@@ -718,13 +732,32 @@ var Ue=Object.defineProperty;var Ne=Object.getOwnPropertyDescriptor;var n=(o,s,e
718
732
  color: #fff;
719
733
  font-weight: 600;
720
734
  }
721
- `],n([G()],f.prototype,"elementData",2),n([G()],f.prototype,"isActive",2),n([G()],f.prototype,"isExpanded",2),n([G()],f.prototype,"onToggle",2),f=n([pt("single-element")],f);var c=class extends ht{constructor(){super();this.hitCount={mouse:{hover:0,trajectory:0},scroll:{down:0,left:0,right:0,up:0},tab:{forwards:0,reverse:0},total:0};this.visibleElementsCount=0;this.totalElementsCount=0;this.elementListItems=new Map;this.noContentMessage="No Elements Registered To The Foresight Manager";this.activeCallbacks=new Set;this.expandedElementIds=new Set;this.elementIdCounter=0;this._abortController=null;this.handleSortChange=e=>{this.sortOrder=e};this.handleElementToggle=e=>{let t=new Set(this.expandedElementIds);t.has(e)?t.delete(e):t.add(e),this.expandedElementIds=t};this.sortByDocumentPosition=(e,t)=>{let i=e.element.compareDocumentPosition(t.element);return i&Node.DOCUMENT_POSITION_FOLLOWING?-1:i&Node.DOCUMENT_POSITION_PRECEDING?1:0};this.sortOrder=l.instance.devtoolsSettings.sortElementList,this.sortDropdown=[{value:"visibility",label:"Visibility",title:"Sort by Visibility",icon:se},{value:"documentOrder",label:"Document Order",title:"Sort by Document Order",icon:re},{value:"insertionOrder",label:"Insertion Order",title:"Sort by Insertion Order",icon:le}]}generateElementId(){return(++this.elementIdCounter).toString()}updateVisibilityCounts(){let e=0,t=0;this.elementListItems.forEach(i=>{t++,i.isIntersectingWithViewport&&e++}),this.visibleElementsCount=e,this.totalElementsCount=t,this.dispatchEvent(new CustomEvent("visibility-count-updated",{detail:{visibleCount:e,totalCount:t},bubbles:!0,composed:!0}))}_generateHitsChipTitle(e){let t=[];return t.push(`Total Hits: ${e.total}`),t.push(""),t.push(`Mouse: Trajectory: ${e.mouse.trajectory}, Hover: ${e.mouse.hover}`),t.push(`Scroll: Up: ${e.scroll.up}, Down: ${e.scroll.down}, Left: ${e.scroll.left}, Right: ${e.scroll.right}`),t.push(`Tab: Forwards: ${e.tab.forwards}, Reverse: ${e.tab.reverse}`),t.join(`
722
- `)}connectedCallback(){super.connectedCallback(),this._abortController=new AbortController;let{signal:e}=this._abortController;this.updateElementListFromManager(),this.updateVisibilityCounts(),P.instance.addEventListener("elementRegistered",t=>{let i={...t.elementData,elementId:this.generateElementId()};this.elementListItems.set(t.elementData.element,i),this.updateVisibilityCounts()},{signal:e}),P.instance.addEventListener("elementDataUpdated",t=>{let i=this.elementListItems.get(t.elementData.element);if(i){let a={...t.elementData,elementId:i.elementId};this.elementListItems.set(t.elementData.element,a),this.updateVisibilityCounts(),this.requestUpdate()}},{signal:e}),P.instance.addEventListener("elementUnregistered",t=>{this.elementListItems.delete(t.elementData.element),this.updateVisibilityCounts(),this.elementListItems.size||(this.noContentMessage="No Elements Registered To The Foresight Manager"),this.requestUpdate(),this.activeCallbacks.delete(t.elementData.element)},{signal:e}),P.instance.addEventListener("callbackInvoked",t=>{this.activeCallbacks.add(t.elementData.element),this.requestUpdate()},{signal:e}),P.instance.addEventListener("callbackCompleted",t=>{this.handleCallbackCompleted(t.hitType),this.activeCallbacks.delete(t.elementData.element)},{signal:e})}disconnectedCallback(){super.disconnectedCallback(),this._abortController?.abort(),this._abortController=null}updateElementListFromManager(){let e=new Map;P.instance.registeredElements.forEach((t,i)=>{e.set(i,{...t,elementId:this.generateElementId()})}),this.elementListItems=e}handleCallbackCompleted(e){switch(e.kind){case"mouse":this.hitCount.mouse[e.subType]++;break;case"tab":this.hitCount.tab[e.subType]++;break;case"scroll":this.hitCount.scroll[e.subType]++;break;default:}this.hitCount.total++,this.requestUpdate()}getSortedElements(){let e=Array.from(this.elementListItems.values());switch(this.sortOrder){case"insertionOrder":return e;case"documentOrder":return e.sort(this.sortByDocumentPosition);case"visibility":return e.sort((t,i)=>t.isIntersectingWithViewport!==i.isIntersectingWithViewport?t.isIntersectingWithViewport?-1:1:this.sortByDocumentPosition(t,i));default:return this.sortOrder,e}}render(){return xe`
735
+
736
+ .element-name.callback-inactive {
737
+ color: #999;
738
+ font-weight: 500;
739
+ }
740
+
741
+ :host(.not-visible) {
742
+ opacity: 0.5;
743
+ }
744
+
745
+ .element-wrapper.not-visible {
746
+ opacity: 0.5;
747
+ }
748
+ `],n([G()],y.prototype,"elementData",2),n([G()],y.prototype,"isActive",2),n([G()],y.prototype,"isExpanded",2),n([G()],y.prototype,"onToggle",2),y=n([pt("single-element")],y);var c=class extends mt{constructor(){super();this.hitCount={mouse:{hover:0,trajectory:0},scroll:{down:0,left:0,right:0,up:0},tab:{forwards:0,reverse:0},total:0};this.visibleElementsCount=0;this.activeElementCallbacksCount=0;this.totalElementsCount=0;this.elementListItems=new Map;this.noContentMessage="No Elements Registered To The Foresight Manager";this.runningCallbacks=new Set;this.expandedElementIds=new Set;this.elementIdCounter=0;this._abortController=null;this.handleSortChange=e=>{this.sortOrder=e};this.handleElementToggle=e=>{let t=new Set(this.expandedElementIds);t.has(e)?t.delete(e):t.add(e),this.expandedElementIds=t};this.sortByDocumentPosition=(e,t)=>{let i=e.element.compareDocumentPosition(t.element);return i&Node.DOCUMENT_POSITION_FOLLOWING?-1:i&Node.DOCUMENT_POSITION_PRECEDING?1:0};this.sortOrder=l.instance.devtoolsSettings.sortElementList,this.sortDropdown=[{value:"visibility",label:"Visibility",title:"Sort by Visibility",icon:se},{value:"documentOrder",label:"Document Order",title:"Sort by Document Order",icon:re},{value:"insertionOrder",label:"Insertion Order",title:"Sort by Insertion Order",icon:le}]}generateElementId(){return(++this.elementIdCounter).toString()}updateActiveCallbackCount(){let e=0;this.elementListItems.forEach(t=>{t.callbackInfo.isCallbackActive&&e++}),this.activeElementCallbacksCount=e}updateVisibilityCounts(){let e=0;this.elementListItems.forEach(i=>{i.isIntersectingWithViewport&&e++});let t=this.elementListItems.size;this.visibleElementsCount=e,this.totalElementsCount=t,this.dispatchEvent(new CustomEvent("visibility-count-updated",{detail:{visibleCount:e,totalCount:t},bubbles:!0,composed:!0}))}_generateHitsChipTitle(e){let t=[];return t.push(`Total Hits: ${e.total}`),t.push(""),t.push(`Mouse: Trajectory: ${e.mouse.trajectory}, Hover: ${e.mouse.hover}`),t.push(`Scroll: Up: ${e.scroll.up}, Down: ${e.scroll.down}, Left: ${e.scroll.left}, Right: ${e.scroll.right}`),t.push(`Tab: Forwards: ${e.tab.forwards}, Reverse: ${e.tab.reverse}`),t.join(`
749
+ `)}connectedCallback(){super.connectedCallback(),this._abortController=new AbortController;let{signal:e}=this._abortController;this.updateElementListFromManager(),this.updateVisibilityCounts(),L.instance.addEventListener("elementRegistered",t=>{let i={...t.elementData,elementId:this.generateElementId()};this.elementListItems.set(t.elementData.element,i),this.updateVisibilityCounts(),this.updateActiveCallbackCount()},{signal:e}),L.instance.addEventListener("elementDataUpdated",t=>{let i=this.elementListItems.get(t.elementData.element);if(i){let a={...t.elementData,elementId:i.elementId};this.elementListItems.set(t.elementData.element,a),this.updateVisibilityCounts(),this.requestUpdate()}},{signal:e}),L.instance.addEventListener("elementReactivated",t=>{let i=this.elementListItems.get(t.elementData.element);if(i){let a={...t.elementData,elementId:i.elementId};this.elementListItems.set(t.elementData.element,a),this.requestUpdate(),this.updateActiveCallbackCount()}},{signal:e}),L.instance.addEventListener("elementUnregistered",t=>{this.elementListItems.delete(t.elementData.element),this.updateVisibilityCounts(),this.updateActiveCallbackCount(),this.elementListItems.size||(this.noContentMessage="No Elements Registered To The Foresight Manager"),this.requestUpdate(),this.runningCallbacks.delete(t.elementData.element)},{signal:e}),L.instance.addEventListener("callbackInvoked",t=>{this.runningCallbacks.add(t.elementData.element),this.requestUpdate()},{signal:e}),L.instance.addEventListener("callbackCompleted",t=>{this.updateActiveCallbackCount(),this.handleCallbackCompleted(t.hitType),this.runningCallbacks.delete(t.elementData.element)},{signal:e})}disconnectedCallback(){super.disconnectedCallback(),this._abortController?.abort(),this._abortController=null}updateElementListFromManager(){let e=new Map;L.instance.registeredElements.forEach((t,i)=>{e.set(i,{...t,elementId:this.generateElementId()})}),this.elementListItems=e}handleCallbackCompleted(e){switch(e.kind){case"mouse":this.hitCount.mouse[e.subType]++;break;case"tab":this.hitCount.tab[e.subType]++;break;case"scroll":this.hitCount.scroll[e.subType]++;break;default:}this.hitCount.total++,this.requestUpdate()}getSortedElements(){let e=Array.from(this.elementListItems.values());switch(this.sortOrder){case"insertionOrder":return e;case"documentOrder":return e.sort(this.sortByDocumentPosition);case"visibility":return e.sort((t,i)=>t.isIntersectingWithViewport!==i.isIntersectingWithViewport?t.isIntersectingWithViewport?-1:1:this.sortByDocumentPosition(t,i));default:return this.sortOrder,e}}render(){return xe`
723
750
  <tab-header>
724
751
  <div slot="chips" class="chips-container">
725
752
  <chip-element title="Number of visible registered elements / total registered elements">
726
753
  ${this.visibleElementsCount}/${this.totalElementsCount} visible
727
754
  </chip-element>
755
+ <chip-element title="Number of elements with running callbacks / total elements">
756
+ ${this.runningCallbacks.size}/${this.totalElementsCount} running
757
+ </chip-element>
758
+ <chip-element title="Number of elements with active callbacks / total elements">
759
+ ${this.activeElementCallbacksCount}/${this.totalElementsCount} active
760
+ </chip-element>
728
761
  <chip-element title="${this._generateHitsChipTitle(this.hitCount)}">
729
762
  ${this.hitCount.total} hits
730
763
  </chip-element>
@@ -744,7 +777,7 @@ var Ue=Object.defineProperty;var Ne=Object.getOwnPropertyDescriptor;var n=(o,s,e
744
777
  ${ut(this.getSortedElements(),e=>xe`
745
778
  <single-element
746
779
  .elementData=${e}
747
- .isActive=${this.activeCallbacks.has(e.element)}
780
+ .isActive=${this.runningCallbacks.has(e.element)}
748
781
  .isExpanded=${this.expandedElementIds.has(e.elementId)}
749
782
  .onToggle=${this.handleElementToggle}
750
783
  ></single-element>
@@ -805,7 +838,7 @@ var Ue=Object.defineProperty;var Ne=Object.getOwnPropertyDescriptor;var n=(o,s,e
805
838
  color: #fff;
806
839
  font-weight: 600;
807
840
  }
808
- `,n([y()],c.prototype,"hitCount",2),n([y()],c.prototype,"visibleElementsCount",2),n([y()],c.prototype,"totalElementsCount",2),n([y()],c.prototype,"sortDropdown",2),n([y()],c.prototype,"sortOrder",2),n([y()],c.prototype,"elementListItems",2),n([y()],c.prototype,"noContentMessage",2),n([y()],c.prototype,"activeCallbacks",2),n([y()],c.prototype,"expandedElementIds",2),c=n([mt("element-tab")],c);import{css as bt,html as we,LitElement as vt}from"lit";import{customElement as ft,property as yt}from"lit/decorators.js";var U=class extends vt{constructor(){super(...arguments);this.activeTab="settings";this.tabs=["settings","elements","logs"]}_handleTabClick(e){this.dispatchEvent(new CustomEvent("tab-change",{detail:{tab:e},bubbles:!0,composed:!0}))}render(){return we`
841
+ `,n([b()],c.prototype,"hitCount",2),n([b()],c.prototype,"visibleElementsCount",2),n([b()],c.prototype,"activeElementCallbacksCount",2),n([b()],c.prototype,"totalElementsCount",2),n([b()],c.prototype,"sortDropdown",2),n([b()],c.prototype,"sortOrder",2),n([b()],c.prototype,"elementListItems",2),n([b()],c.prototype,"noContentMessage",2),n([b()],c.prototype,"runningCallbacks",2),n([b()],c.prototype,"expandedElementIds",2),c=n([ht("element-tab")],c);import{css as bt,html as we,LitElement as vt}from"lit";import{customElement as ft,property as yt}from"lit/decorators.js";var U=class extends vt{constructor(){super(...arguments);this.activeTab="settings";this.tabs=["settings","elements","logs"]}_handleTabClick(e){this.dispatchEvent(new CustomEvent("tab-change",{detail:{tab:e},bubbles:!0,composed:!0}))}render(){return we`
809
842
  <div class="tab-selector-wrapper">
810
843
  ${this.tabs.map(e=>we`
811
844
  <button
@@ -848,8 +881,8 @@ var Ue=Object.defineProperty;var Ne=Object.getOwnPropertyDescriptor;var n=(o,s,e
848
881
  color: #b0c4de;
849
882
  border-bottom-color: #b0c4de;
850
883
  }
851
- `,n([yt({type:String})],U.prototype,"activeTab",2),U=n([ft("tab-selector")],U);import{ForesightManager as R}from"js.foresight";import{LitElement as Mt,css as Dt,html as W}from"lit";import{customElement as Lt,property as _t,state as N}from"lit/decorators.js";import{map as $t}from"lit/directives/map.js";function Ee(o,s){let e={};o.eventListeners.forEach((i,a)=>{e[a]=i.length});let t=[];return o.registeredElements.forEach((i,a)=>{let{element:r,...T}=i;t.push({...T,elementInfo:`${a.tagName.toLowerCase()}${a.id?`#${a.id}`:""}${a.className?`.${a.className.replace(/\s+/g,".")}`:""}`})}),{type:"managerDataPayload",warning:"this is a lot easier to view in the console",logId:s,globalCallbackHits:o.globalCallbackHits,localizedTimestamp:new Date().toLocaleTimeString(),eventListenerCount:e,managerSettings:o.globalSettings,registeredElements:t,summary:`${t.length} elements, ${Object.values(e).flat().length} listeners,
852
- ${o.globalCallbackHits.total} hits`}}function Ce(o,s){try{switch(o.type){case"elementRegistered":return{type:"elementRegistered",name:o.elementData.name,id:o.elementData.element.id||"",callbackInfo:o.elementData.callbackInfo,hitslop:o.elementData.elementBounds.hitSlop,localizedTimestamp:new Date(o.timestamp).toLocaleTimeString(),meta:o.elementData.meta,logId:s,summary:o.elementData.registerCount===1?o.elementData.name:`${o.elementData.name} - ${ke(o.elementData.registerCount)} time`};case"elementReactivated":return{type:"elementReactivated",name:o.elementData.name,id:o.elementData.element.id||"",callbackInfo:o.elementData.callbackInfo,localizedTimestamp:new Date(o.timestamp).toLocaleTimeString(),meta:o.elementData.meta,logId:s,summary:o.elementData.registerCount===1?o.elementData.name:`${o.elementData.name} - ${ke(o.elementData.registerCount)} time`};case"elementUnregistered":return{type:"elementUnregistered",localizedTimestamp:new Date(o.timestamp).toLocaleTimeString(),logId:s,summary:`${o.elementData.name} - ${o.unregisterReason}`};case"elementDataUpdated":return{type:"elementDataUpdated",name:o.elementData.name,updatedProps:o.updatedProps||[],callbackInfo:o.elementData.callbackInfo,isIntersecting:o.elementData.isIntersectingWithViewport,meta:o.elementData.meta,localizedTimestamp:new Date().toLocaleTimeString(),logId:s,summary:`${o.elementData.name} - ${o.updatedProps.toString()}`};case"callbackInvoked":return{type:"callbackInvoked",name:o.elementData.name,hitType:o.hitType,callbackInfo:o.elementData.callbackInfo,meta:o.elementData.meta,localizedTimestamp:new Date(o.timestamp).toLocaleTimeString(),logId:s,summary:`${o.elementData.name} - ${o.hitType.kind}`};case"callbackCompleted":{let e=xt(o.elapsed);return{type:"callbackCompleted",...o.status==="error"?{status:"error",errorMessage:o.errorMessage}:{status:"success"},name:o.elementData.name,hitType:o.hitType,callbackInfo:o.elementData.callbackInfo,meta:o.elementData.meta,localizedTimestamp:new Date(o.timestamp).toLocaleTimeString(),logId:s,summary:`${o.elementData.name} - ${e}`}}case"mouseTrajectoryUpdate":return{type:"mouseTrajectoryUpdate",currentPoint:o.trajectoryPositions?.currentPoint,predictedPoint:o.trajectoryPositions?.predictedPoint,positionCount:o.trajectoryPositions?.positions?.length||0,mousePredictionEnabled:o.predictionEnabled,localizedTimestamp:new Date().toLocaleTimeString(),logId:s,summary:""};case"scrollTrajectoryUpdate":return{type:"scrollTrajectoryUpdate",currentPoint:o.currentPoint,predictedPoint:o.predictedPoint,scrollDirection:o.scrollDirection,localizedTimestamp:new Date().toLocaleTimeString(),logId:s,summary:o.scrollDirection};case"managerSettingsChanged":return{type:"managerSettingsChanged",globalSettings:o.managerData?.globalSettings||{},settingsChanged:o.updatedSettings,localizedTimestamp:new Date(o.timestamp).toLocaleTimeString(),logId:s,summary:o.updatedSettings.map(e=>e.setting).join(", ")};default:return{type:"serializationError",error:"Failed to serialize event data",errorMessage:JSON.stringify(o),localizedTimestamp:new Date().toLocaleTimeString(),logId:s,summary:""}}}catch(e){return{type:"serializationError",error:"Failed to serialize event data",localizedTimestamp:new Date().toLocaleTimeString(),errorMessage:e instanceof Error?e.message:String(e),logId:s,summary:""}}}function xt(o){return`${(o/1e3).toFixed(4)} s`}function ke(o){let s=["th","st","nd","rd"],e=o%100;return o+(s[(e-20)%10]||s[e]||s[0])}import{html as Se,css as wt}from"lit";import{customElement as kt,property as Te}from"lit/decorators.js";var L=class extends D{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 i=!t;this.onSelectionChange?.(e.value,i)}_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 Se`
884
+ `,n([yt({type:String})],U.prototype,"activeTab",2),U=n([ft("tab-selector")],U);import{ForesightManager as z}from"js.foresight";import{LitElement as Dt,css as Mt,html as W}from"lit";import{customElement as Lt,property as _t,state as N}from"lit/decorators.js";import{map as It}from"lit/directives/map.js";function Ee(o,s){let e={};o.eventListeners.forEach((i,a)=>{e[a]=i.length});let t=[];return o.registeredElements.forEach((i,a)=>{let{element:r,...T}=i;t.push({...T,elementInfo:`${a.tagName.toLowerCase()}${a.id?`#${a.id}`:""}${a.className?`.${a.className.replace(/\s+/g,".")}`:""}`})}),{type:"managerDataPayload",warning:"this is a lot easier to view in the console",logId:s,globalCallbackHits:o.globalCallbackHits,localizedTimestamp:new Date().toLocaleTimeString(),eventListenerCount:e,managerSettings:o.globalSettings,registeredElements:t,summary:`${t.length} elements, ${Object.values(e).flat().length} listeners,
885
+ ${o.globalCallbackHits.total} hits`}}function Ce(o,s){try{switch(o.type){case"elementRegistered":return{type:"elementRegistered",name:o.elementData.name,id:o.elementData.element.id||"",callbackInfo:o.elementData.callbackInfo,hitslop:o.elementData.elementBounds.hitSlop,localizedTimestamp:new Date(o.timestamp).toLocaleTimeString(),meta:o.elementData.meta,logId:s,summary:o.elementData.registerCount===1?o.elementData.name:`${o.elementData.name} - ${ke(o.elementData.registerCount)} time`};case"elementReactivated":return{type:"elementReactivated",name:o.elementData.name,id:o.elementData.element.id||"",callbackInfo:o.elementData.callbackInfo,localizedTimestamp:new Date(o.timestamp).toLocaleTimeString(),meta:o.elementData.meta,logId:s,summary:o.elementData.registerCount===1?o.elementData.name:`${o.elementData.name} - ${ke(o.elementData.registerCount)} time`};case"elementUnregistered":return{type:"elementUnregistered",localizedTimestamp:new Date(o.timestamp).toLocaleTimeString(),logId:s,summary:`${o.elementData.name} - ${o.unregisterReason}`};case"elementDataUpdated":return{type:"elementDataUpdated",name:o.elementData.name,updatedProps:o.updatedProps||[],callbackInfo:o.elementData.callbackInfo,isIntersecting:o.elementData.isIntersectingWithViewport,meta:o.elementData.meta,localizedTimestamp:new Date().toLocaleTimeString(),logId:s,summary:`${o.elementData.name} - ${o.updatedProps.toString()}`};case"callbackInvoked":return{type:"callbackInvoked",name:o.elementData.name,hitType:o.hitType,callbackInfo:o.elementData.callbackInfo,meta:o.elementData.meta,localizedTimestamp:new Date(o.timestamp).toLocaleTimeString(),logId:s,summary:`${o.elementData.name} - ${o.hitType.kind}`};case"callbackCompleted":{let e=xt(o.elapsed);return{type:"callbackCompleted",...o.status==="error"?{status:"error",errorMessage:o.errorMessage}:{status:"success"},name:o.elementData.name,hitType:o.hitType,callbackInfo:o.elementData.callbackInfo,meta:o.elementData.meta,localizedTimestamp:new Date(o.timestamp).toLocaleTimeString(),logId:s,summary:`${o.elementData.name} - ${e}`}}case"mouseTrajectoryUpdate":return{type:"mouseTrajectoryUpdate",currentPoint:o.trajectoryPositions?.currentPoint,predictedPoint:o.trajectoryPositions?.predictedPoint,positionCount:o.trajectoryPositions?.positions?.length||0,mousePredictionEnabled:o.predictionEnabled,localizedTimestamp:new Date().toLocaleTimeString(),logId:s,summary:""};case"scrollTrajectoryUpdate":return{type:"scrollTrajectoryUpdate",currentPoint:o.currentPoint,predictedPoint:o.predictedPoint,scrollDirection:o.scrollDirection,localizedTimestamp:new Date().toLocaleTimeString(),logId:s,summary:o.scrollDirection};case"managerSettingsChanged":return{type:"managerSettingsChanged",globalSettings:o.managerData?.globalSettings||{},settingsChanged:o.updatedSettings,localizedTimestamp:new Date(o.timestamp).toLocaleTimeString(),logId:s,summary:o.updatedSettings.map(e=>e.setting).join(", ")};default:return{type:"serializationError",error:"Failed to serialize event data",errorMessage:JSON.stringify(o),localizedTimestamp:new Date().toLocaleTimeString(),logId:s,summary:""}}}catch(e){return{type:"serializationError",error:"Failed to serialize event data",localizedTimestamp:new Date().toLocaleTimeString(),errorMessage:e instanceof Error?e.message:String(e),logId:s,summary:""}}}function xt(o){return`${(o/1e3).toFixed(4)} s`}function ke(o){let s=["th","st","nd","rd"],e=o%100;return o+(s[(e-20)%10]||s[e]||s[0])}import{html as Se,css as wt}from"lit";import{customElement as kt,property as Te}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 i=!t;this.onSelectionChange?.(e.value,i)}_getTriggerIcon(){return h}_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 Se`
853
886
  <div class="dropdown-container">
854
887
  <button
855
888
  class="${e}"
@@ -889,7 +922,7 @@ var Ue=Object.defineProperty;var Ne=Object.getOwnPropertyDescriptor;var n=(o,s,e
889
922
  `)}
890
923
  </div>
891
924
  </div>
892
- `}};L.styles=[...D.styles,wt`
925
+ `}};_.styles=[...M.styles,wt`
893
926
  .dropdown-menu button.active::after {
894
927
  content: "✓";
895
928
  position: absolute;
@@ -905,7 +938,7 @@ var Ue=Object.defineProperty;var Ne=Object.getOwnPropertyDescriptor;var n=(o,s,e
905
938
  color: #b0c4de;
906
939
  margin-left: 2px;
907
940
  }
908
- `],n([Te({type:Array})],L.prototype,"selectedValues",2),n([Te()],L.prototype,"onSelectionChange",2),L=n([kt("multi-select-dropdown")],L);import{LitElement as Et,html as Ct,css as St}from"lit";import{customElement as Tt,property as Z}from"lit/decorators.js";var E=class extends Et{constructor(e){super();this.isExpanded=!1;this.log=e}updated(e){if(e.has("log")&&this.log){let t=this.log,i=t.type==="callbackCompleted"&&"status"in t&&t.status==="error",a=i?"#f44336":this.getLogTypeColor(t.type),r=i?"rgba(244, 67, 54, 0.1)":"transparent";this.style.setProperty("--log-color",a),this.style.setProperty("--log-background-color",r)}}serializeLogDataWithoutSummary(e){let{summary:t,...i}=e;return JSON.stringify(i,null,2)}getLogTypeColor(e){return{elementRegistered:"#2196f3",elementReactivated:"#ff9800",callbackInvoked:"#00bcd4",callbackCompleted:"#4caf50",elementDataUpdated:"#ffc107",elementUnregistered:"#ff9800",managerSettingsChanged:"#f44336",mouseTrajectoryUpdate:"#78909c",scrollTrajectoryUpdate:"#607d8b"}[e]||"#555"}getEventDisplayName(e){return{elementRegistered:"Registered",elementReactivated:"Reactivated",elementUnregistered:"Unregistered",elementDataUpdated:"Data Updated",callbackInvoked:"Invoked",callbackCompleted:"Completed",mouseTrajectoryUpdate:"Mouse",scrollTrajectoryUpdate:"Scroll",managerSettingsChanged:"Settings",managerDataPayload:"ManagerData"}[e]||e}truncateLogSummary(e,t=50){return e.length<=t?e:e.substring(0,t)+"..."}render(){let e=this.log,i=e.type==="callbackCompleted"&&"status"in e&&e.status==="error"?"#f44336":this.getLogTypeColor(e.type);return Ct`
941
+ `],n([Te({type:Array})],_.prototype,"selectedValues",2),n([Te()],_.prototype,"onSelectionChange",2),_=n([kt("multi-select-dropdown")],_);import{LitElement as Et,html as Ct,css as St}from"lit";import{customElement as Tt,property as Z}from"lit/decorators.js";var E=class extends Et{constructor(e){super();this.isExpanded=!1;this.log=e}updated(e){if(e.has("log")&&this.log){let t=this.log,i=t.type==="callbackCompleted"&&"status"in t&&t.status==="error",a=i?"#f44336":this.getLogTypeColor(t.type),r=i?"rgba(244, 67, 54, 0.1)":"transparent";this.style.setProperty("--log-color",a),this.style.setProperty("--log-background-color",r)}}serializeLogDataWithoutSummary(e){let{summary:t,...i}=e;return JSON.stringify(i,null,2)}getLogTypeColor(e){return{elementRegistered:"#2196f3",elementReactivated:"#ff9800",callbackInvoked:"#00bcd4",callbackCompleted:"#4caf50",elementDataUpdated:"#ffc107",elementUnregistered:"#ff9800",managerSettingsChanged:"#f44336",mouseTrajectoryUpdate:"#78909c",scrollTrajectoryUpdate:"#607d8b"}[e]||"#555"}getEventDisplayName(e){return{elementRegistered:"Registered",elementReactivated:"Reactivated",elementUnregistered:"Unregistered",elementDataUpdated:"Data Updated",callbackInvoked:"Invoked",callbackCompleted:"Completed",mouseTrajectoryUpdate:"Mouse",scrollTrajectoryUpdate:"Scroll",managerSettingsChanged:"Settings",managerDataPayload:"ManagerData"}[e]||e}truncateLogSummary(e,t=50){return e.length<=t?e:e.substring(0,t)+"..."}render(){let e=this.log,i=e.type==="callbackCompleted"&&"status"in e&&e.status==="error"?"#f44336":this.getLogTypeColor(e.type);return Ct`
909
942
  <expandable-item
910
943
  .borderColor=${i}
911
944
  .itemId=${e.logId}
@@ -985,7 +1018,7 @@ var Ue=Object.defineProperty;var Ne=Object.getOwnPropertyDescriptor;var n=(o,s,e
985
1018
  * as all styling is now handled by setting CSS variables below.
986
1019
  * This makes the component's styling more self-contained.
987
1020
  */
988
- `],n([Z({attribute:!1})],E.prototype,"log",2),n([Z({type:Boolean})],E.prototype,"isExpanded",2),n([Z()],E.prototype,"onToggle",2),E=n([Tt("single-log")],E);var h=class extends Mt{constructor(){super();this.logs=[];this.expandedLogIds=new Set;this.MAX_LOGS=100;this.logIdCounter=0;this.noContentMessage="No logs available";this._abortController=null;this._eventListeners=new Map;this.handleLogLocationChange=e=>{this.logLocation=e};this.handleFilterChange=(e,t)=>{this.eventsEnabled={...this.eventsEnabled,[e]:t},t?this.addForesightEventListener(e):this.removeForesightEventListener(e)};this.handleLogToggle=e=>{let t=new Set(this.expandedLogIds);t.has(e)?t.delete(e):t.add(e),this.expandedLogIds=t};let{logging:{logLocation:e,...t}}=l.instance.devtoolsSettings;this.eventsEnabled=t,this.logLocation=e,this.logDropdown=[{value:"controlPanel",label:"Control Panel",title:"Log only to the control panel",icon:ne},{value:"console",label:"Console",title:"Log only to the console",icon:ie},{value:"both",label:"Both",title:"Log to both the control panel and the console",icon:ae},{value:"none",label:"None",title:"Dont log anywhere",icon:oe}],this.filterDropdown=[{value:"elementRegistered",label:"Element Registered",title:"Show element registration events",icon:m},{value:"elementUnregistered",label:"Element Unregistered",title:"Show element unregistration events",icon:m},{value:"elementReactivated",label:"Element Reactivated",title:"Show when element gets reactivated after stale time has passed",icon:m},{value:"callbackInvoked",label:"Callback Invoked",title:"Show callback invoked events",icon:m},{value:"callbackCompleted",label:"Callback Completed",title:"Show callback completed events",icon:m},{value:"mouseTrajectoryUpdate",label:"Mouse Trajectory Update",title:"Show mouse trajectory update events",icon:m},{value:"scrollTrajectoryUpdate",label:"Scroll Trajectory Update",title:"Show scroll trajectory update events",icon:m},{value:"managerSettingsChanged",label:"Manager Settings Changed",title:"Show manager settings change events",icon:m}]}getSelectedEventFilters(){return Object.entries(this.eventsEnabled).filter(([,e])=>e).map(([e])=>e)}shouldShowPerformanceWarning(){let e=this.logLocation==="console"||this.logLocation==="both",t=this.eventsEnabled.mouseTrajectoryUpdate||this.eventsEnabled.scrollTrajectoryUpdate||this.eventsEnabled.elementDataUpdated;return e&&t}getNoLogsMessage(){return Object.values(this.eventsEnabled).filter(Boolean).length===0?"Logging for all events is turned off":this.logLocation==="console"?"No logs to display. Logging location is set to console - check browser console for events.":this.logLocation==="none"?"No logs to display. Logging location is set to none":"Interact with Foresight to generate events."}clearLogs(){this.logs=[],this.expandedLogIds.clear(),this.noContentMessage="Logs cleared"}connectedCallback(){super.connectedCallback(),this._abortController=new AbortController,this.setupDynamicEventListeners()}disconnectedCallback(){super.disconnectedCallback(),this._abortController?.abort(),this.removeAllEventListeners()}setupDynamicEventListeners(){Object.entries(this.eventsEnabled).forEach(([e,t])=>{t&&this.addForesightEventListener(e)})}addForesightEventListener(e){if(this._eventListeners.has(e))return;let t=i=>{this.handleEvent(e,i)};this._eventListeners.set(e,t),R.instance.addEventListener(e,t,{signal:this._abortController?.signal})}removeForesightEventListener(e){let t=this._eventListeners.get(e);t&&(R.instance.removeEventListener(e,t),this._eventListeners.delete(e))}removeAllEventListeners(){this._eventListeners.forEach((e,t)=>{R.instance.removeEventListener(t,e)}),this._eventListeners.clear()}getEventColor(e){return{elementRegistered:"#2196f3",elementReactivated:"#ff9800",callbackInvoked:"#00bcd4",callbackCompleted:"#4caf50",elementDataUpdated:"#ffc107",elementUnregistered:"#ff9800",managerSettingsChanged:"#f44336",mouseTrajectoryUpdate:"#78909c",scrollTrajectoryUpdate:"#607d8b"}[e]||"#ffffff"}handleEvent(e,t){if(this.logLocation!=="none"){if(this.logLocation==="console"||this.logLocation==="both"){let i=this.getEventColor(e);console.log(`%c[ForesightJS] ${e}`,`color: ${i}; font-weight: bold;`,t)}(this.logLocation==="controlPanel"||this.logLocation==="both")&&this.addEventLog(t)}}addLog(e){this.logs.unshift(e),this.logs.length>this.MAX_LOGS&&this.logs.pop(),this.requestUpdate()}logManagerData(){this.logLocation!=="none"&&((this.logLocation==="console"||this.logLocation==="both")&&console.log(R.instance.getManagerData),(this.logLocation==="controlPanel"||this.logLocation==="both")&&this.addManagerLog())}addManagerLog(){let e=Ee(R.instance.getManagerData,(++this.logIdCounter).toString());this.addLog(e)}addEventLog(e){let t=Ce(e,(++this.logIdCounter).toString());if(t.type==="serializationError"){console.error(t.error,t.errorMessage);return}this.addLog(t)}render(){return W`
1021
+ `],n([Z({attribute:!1})],E.prototype,"log",2),n([Z({type:Boolean})],E.prototype,"isExpanded",2),n([Z()],E.prototype,"onToggle",2),E=n([Tt("single-log")],E);var m=class extends Dt{constructor(){super();this.logs=[];this.expandedLogIds=new Set;this.MAX_LOGS=100;this.logIdCounter=0;this.noContentMessage="No logs available";this._abortController=null;this._eventListeners=new Map;this.handleLogLocationChange=e=>{this.logLocation=e};this.handleFilterChange=(e,t)=>{this.eventsEnabled={...this.eventsEnabled,[e]:t},t?this.addForesightEventListener(e):this.removeForesightEventListener(e)};this.handleLogToggle=e=>{let t=new Set(this.expandedLogIds);t.has(e)?t.delete(e):t.add(e),this.expandedLogIds=t};let{logging:{logLocation:e,...t}}=l.instance.devtoolsSettings;this.eventsEnabled=t,this.logLocation=e,this.logDropdown=[{value:"controlPanel",label:"Control Panel",title:"Log only to the control panel",icon:ne},{value:"console",label:"Console",title:"Log only to the console",icon:ie},{value:"both",label:"Both",title:"Log to both the control panel and the console",icon:ae},{value:"none",label:"None",title:"Dont log anywhere",icon:oe}],this.filterDropdown=[{value:"elementRegistered",label:"Element Registered",title:"Show element registration events",icon:h},{value:"elementUnregistered",label:"Element Unregistered",title:"Show element unregistration events",icon:h},{value:"elementReactivated",label:"Element Reactivated",title:"Show when element gets reactivated after stale time has passed",icon:h},{value:"callbackInvoked",label:"Callback Invoked",title:"Show callback invoked events",icon:h},{value:"callbackCompleted",label:"Callback Completed",title:"Show callback completed events",icon:h},{value:"mouseTrajectoryUpdate",label:"Mouse Trajectory Update",title:"Show mouse trajectory update events",icon:h},{value:"scrollTrajectoryUpdate",label:"Scroll Trajectory Update",title:"Show scroll trajectory update events",icon:h},{value:"managerSettingsChanged",label:"Manager Settings Changed",title:"Show manager settings change events",icon:h}]}getSelectedEventFilters(){return Object.entries(this.eventsEnabled).filter(([,e])=>e).map(([e])=>e)}shouldShowPerformanceWarning(){let e=this.logLocation==="console"||this.logLocation==="both",t=this.eventsEnabled.mouseTrajectoryUpdate||this.eventsEnabled.scrollTrajectoryUpdate||this.eventsEnabled.elementDataUpdated;return e&&t}getNoLogsMessage(){return Object.values(this.eventsEnabled).filter(Boolean).length===0?"Logging for all events is turned off":this.logLocation==="console"?"No logs to display. Logging location is set to console - check browser console for events.":this.logLocation==="none"?"No logs to display. Logging location is set to none":"Interact with Foresight to generate events."}clearLogs(){this.logs=[],this.expandedLogIds.clear(),this.noContentMessage="Logs cleared"}connectedCallback(){super.connectedCallback(),this._abortController=new AbortController,this.setupDynamicEventListeners()}disconnectedCallback(){super.disconnectedCallback(),this._abortController?.abort(),this.removeAllEventListeners()}setupDynamicEventListeners(){Object.entries(this.eventsEnabled).forEach(([e,t])=>{t&&this.addForesightEventListener(e)})}addForesightEventListener(e){if(this._eventListeners.has(e))return;let t=i=>{this.handleEvent(e,i)};this._eventListeners.set(e,t),z.instance.addEventListener(e,t,{signal:this._abortController?.signal})}removeForesightEventListener(e){let t=this._eventListeners.get(e);t&&(z.instance.removeEventListener(e,t),this._eventListeners.delete(e))}removeAllEventListeners(){this._eventListeners.forEach((e,t)=>{z.instance.removeEventListener(t,e)}),this._eventListeners.clear()}getEventColor(e){return{elementRegistered:"#2196f3",elementReactivated:"#ff9800",callbackInvoked:"#00bcd4",callbackCompleted:"#4caf50",elementDataUpdated:"#ffc107",elementUnregistered:"#ff9800",managerSettingsChanged:"#f44336",mouseTrajectoryUpdate:"#78909c",scrollTrajectoryUpdate:"#607d8b"}[e]||"#ffffff"}handleEvent(e,t){if(this.logLocation!=="none"){if(this.logLocation==="console"||this.logLocation==="both"){let i=this.getEventColor(e);console.log(`%c[ForesightJS] ${e}`,`color: ${i}; font-weight: bold;`,t)}(this.logLocation==="controlPanel"||this.logLocation==="both")&&this.addEventLog(t)}}addLog(e){this.logs.unshift(e),this.logs.length>this.MAX_LOGS&&this.logs.pop(),this.requestUpdate()}logManagerData(){this.logLocation!=="none"&&((this.logLocation==="console"||this.logLocation==="both")&&console.log(z.instance.getManagerData),(this.logLocation==="controlPanel"||this.logLocation==="both")&&this.addManagerLog())}addManagerLog(){let e=Ee(z.instance.getManagerData,(++this.logIdCounter).toString());this.addLog(e)}addEventLog(e){let t=Ce(e,(++this.logIdCounter).toString());if(t.type==="serializationError"){console.error(t.error,t.errorMessage);return}this.addLog(t)}render(){return W`
989
1022
  <tab-header>
990
1023
  <div slot="chips" class="chips-container">
991
1024
  <chip-element title="Number of logged events (Max ${this.MAX_LOGS})">
@@ -1018,7 +1051,7 @@ Consider using 'Control Panel' only for better performance."
1018
1051
  title="Log the state from the manager"
1019
1052
  @click="${this.logManagerData}"
1020
1053
  >
1021
- ${he}
1054
+ ${me}
1022
1055
  </button>
1023
1056
  <button
1024
1057
  class="single-button"
@@ -1026,12 +1059,12 @@ Consider using 'Control Panel' only for better performance."
1026
1059
  ?disabled="${this.logs.length===0}"
1027
1060
  @click="${this.clearLogs}"
1028
1061
  >
1029
- ${de}
1062
+ ${ce}
1030
1063
  </button>
1031
1064
  </div>
1032
1065
  </tab-header>
1033
1066
  <tab-content .noContentMessage=${this.noContentMessage} .hasContent=${!!this.logs.length}>
1034
- ${this.logs.length===0?W`<div class="no-items">${this.getNoLogsMessage()}</div>`:$t(this.logs,e=>W`
1067
+ ${this.logs.length===0?W`<div class="no-items">${this.getNoLogsMessage()}</div>`:It(this.logs,e=>W`
1035
1068
  <single-log
1036
1069
  .log=${e}
1037
1070
  .isExpanded=${this.expandedLogIds.has(e.logId)}
@@ -1039,7 +1072,7 @@ Consider using 'Control Panel' only for better performance."
1039
1072
  ></single-log>
1040
1073
  `)}
1041
1074
  </tab-content>
1042
- `}};h.styles=[Dt`
1075
+ `}};m.styles=[Mt`
1043
1076
  :host {
1044
1077
  display: flex;
1045
1078
  flex-direction: column;
@@ -1132,7 +1165,7 @@ Consider using 'Control Panel' only for better performance."
1132
1165
  .warning-container:hover svg {
1133
1166
  stroke: #ffdc3e;
1134
1167
  }
1135
- `],n([N()],h.prototype,"logDropdown",2),n([N()],h.prototype,"filterDropdown",2),n([N()],h.prototype,"logLocation",2),n([N()],h.prototype,"eventsEnabled",2),n([N()],h.prototype,"logs",2),n([N()],h.prototype,"expandedLogIds",2),n([_t()],h.prototype,"noContentMessage",2),h=n([Lt("log-tab")],h);import{ForesightManager as $e}from"js.foresight";import{css as tn,html as Oe,LitElement as nn}from"lit";import{customElement as on,state as Y}from"lit/decorators.js";var Q="points",Me="px",De="tabs",Le="ms";import{LitElement as Nt,html as Vt,css as Ft}from"lit";import{customElement as jt,property as K}from"lit/decorators.js";import{LitElement as Ot,html as It,css as Pt}from"lit";import{customElement as Ut,property as _e}from"lit/decorators.js";var _=class extends Ot{constructor(){super(...arguments);this.header="";this.description=""}render(){return It`<div class="setting-item">
1168
+ `],n([N()],m.prototype,"logDropdown",2),n([N()],m.prototype,"filterDropdown",2),n([N()],m.prototype,"logLocation",2),n([N()],m.prototype,"eventsEnabled",2),n([N()],m.prototype,"logs",2),n([N()],m.prototype,"expandedLogIds",2),n([_t()],m.prototype,"noContentMessage",2),m=n([Lt("log-tab")],m);import{ForesightManager as Ie}from"js.foresight";import{css as tn,html as $e,LitElement as nn}from"lit";import{customElement as on,state as Y}from"lit/decorators.js";var Q="points",De="px",Me="tabs",Le="ms";import{LitElement as Nt,html as Vt,css as Ft}from"lit";import{customElement as jt,property as K}from"lit/decorators.js";import{LitElement as $t,html as Ot,css as Pt}from"lit";import{customElement as Ut,property as _e}from"lit/decorators.js";var I=class extends $t{constructor(){super(...arguments);this.header="";this.description=""}render(){return Ot`<div class="setting-item">
1136
1169
  <label>
1137
1170
  <span class="setting-header">${this.header}</span>
1138
1171
  <span class="setting-description"> ${this.description} </span>
@@ -1140,7 +1173,7 @@ Consider using 'Control Panel' only for better performance."
1140
1173
  <div class="setting-controls">
1141
1174
  <slot name="controls"></slot>
1142
1175
  </div>
1143
- </div>`}};_.styles=[Pt`
1176
+ </div>`}};I.styles=[Pt`
1144
1177
  .setting-item {
1145
1178
  display: flex;
1146
1179
  align-items: center;
@@ -1180,7 +1213,7 @@ Consider using 'Control Panel' only for better performance."
1180
1213
  color: #fff;
1181
1214
  font-size: 13px;
1182
1215
  }
1183
- `],n([_e({type:String})],_.prototype,"header",2),n([_e({type:String})],_.prototype,"description",2),_=n([Ut("setting-item")],_);import{ForesightManager as zt}from"js.foresight";var x=class extends Nt{constructor(){super(...arguments);this.isChecked=!1;this.header="";this.description="";this.setting="enableMousePrediction"}handleCheckboxChange(e){let t=e.target;if(t instanceof HTMLInputElement){let i=t.checked;this.setting==="showNameTags"?this.dispatchEvent(new CustomEvent("setting-changed",{detail:{setting:this.setting,value:i},bubbles:!0})):zt.instance.alterGlobalSettings({[this.setting]:i})}}render(){return Vt`<setting-item header=${this.header} description=${this.description}>
1216
+ `],n([_e({type:String})],I.prototype,"header",2),n([_e({type:String})],I.prototype,"description",2),I=n([Ut("setting-item")],I);import{ForesightManager as Rt}from"js.foresight";var x=class extends Nt{constructor(){super(...arguments);this.isChecked=!1;this.header="";this.description="";this.setting="enableMousePrediction"}handleCheckboxChange(e){let t=e.target;if(t instanceof HTMLInputElement){let i=t.checked;this.setting==="showNameTags"?this.dispatchEvent(new CustomEvent("setting-changed",{detail:{setting:this.setting,value:i},bubbles:!0})):Rt.instance.alterGlobalSettings({[this.setting]:i})}}render(){return Vt`<setting-item header=${this.header} description=${this.description}>
1184
1217
  <input
1185
1218
  slot="controls"
1186
1219
  type="checkbox"
@@ -1230,7 +1263,7 @@ Consider using 'Control Panel' only for better performance."
1230
1263
  input[type="checkbox"]:hover {
1231
1264
  box-shadow: 0 0 0 3px rgba(176, 196, 222, 0.1);
1232
1265
  }
1233
- `],n([K({type:Boolean})],x.prototype,"isChecked",2),n([K({type:String})],x.prototype,"header",2),n([K({type:String})],x.prototype,"description",2),n([K({type:String})],x.prototype,"setting",2),x=n([jt("setting-item-checkbox")],x);import{LitElement as Rt,html as At,css as Ht}from"lit";import{customElement as Bt,property as $,state as Gt}from"lit/decorators.js";import{ForesightManager as Wt}from"js.foresight";var g=class extends Rt{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 i=parseInt(t.value,10);this.displayValue=i,Wt.instance.alterGlobalSettings({[this.setting]:i})}}willUpdate(e){super.willUpdate(e),e.has("currentValue")&&(this.displayValue=this.currentValue)}render(){return At`<setting-item header=${this.header} description=${this.description}>
1266
+ `],n([K({type:Boolean})],x.prototype,"isChecked",2),n([K({type:String})],x.prototype,"header",2),n([K({type:String})],x.prototype,"description",2),n([K({type:String})],x.prototype,"setting",2),x=n([jt("setting-item-checkbox")],x);import{LitElement as zt,html as At,css as Ht}from"lit";import{customElement as Bt,property as $,state as Gt}from"lit/decorators.js";import{ForesightManager as Wt}from"js.foresight";var g=class extends zt{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 i=parseInt(t.value,10);this.displayValue=i,Wt.instance.alterGlobalSettings({[this.setting]:i})}}willUpdate(e){super.willUpdate(e),e.has("currentValue")&&(this.displayValue=this.currentValue)}render(){return At`<setting-item header=${this.header} description=${this.description}>
1234
1267
  <div slot="controls" class="range-wrapper">
1235
1268
  <input
1236
1269
  slot="controls"
@@ -1313,14 +1346,14 @@ Consider using 'Control Panel' only for better performance."
1313
1346
  transform: scale(1.1);
1314
1347
  box-shadow: 0 0 0 4px rgba(176, 196, 222, 0.2);
1315
1348
  }
1316
- `],n([$({type:Number})],g.prototype,"minValue",2),n([$({type:Number})],g.prototype,"maxValue",2),n([$({type:Number})],g.prototype,"currentValue",2),n([$({type:String})],g.prototype,"unit",2),n([$({type:String})],g.prototype,"header",2),n([$({type:String})],g.prototype,"description",2),n([$({type:String})],g.prototype,"setting",2),n([Gt()],g.prototype,"displayValue",2),g=n([Bt("setting-item-range")],g);var w=class extends nn{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 i of t){let a=this.initialSettings.manager[i],r=this.managerSettings[i];a!==r&&e.push({setting:i,oldValue:a,newValue:r})}}_checkDevtoolsSettingsChanges(e){let t=["showNameTags"];for(let i of t){let a=this.initialSettings.devtools[i],r=this.devtoolsSettings[i];a!==r&&e.push({setting:i,oldValue:a,newValue:r})}}_handleDevtoolsSettingChange(e){let{setting:t,value:i}=e.detail;t==="showNameTags"&&(this.devtoolsSettings={...this.devtoolsSettings,showNameTags:i},l.instance.alterDevtoolsSettings({showNameTags:i}),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 Oe`<tab-content
1349
+ `],n([$({type:Number})],g.prototype,"minValue",2),n([$({type:Number})],g.prototype,"maxValue",2),n([$({type:Number})],g.prototype,"currentValue",2),n([$({type:String})],g.prototype,"unit",2),n([$({type:String})],g.prototype,"header",2),n([$({type:String})],g.prototype,"description",2),n([$({type:String})],g.prototype,"setting",2),n([Gt()],g.prototype,"displayValue",2),g=n([Bt("setting-item-range")],g);var w=class extends nn{constructor(){super();this.changedSettings=[];this._abortController=null;let e=l.instance.devtoolsSettings,t=Ie.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;Ie.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 i of t){let a=this.initialSettings.manager[i],r=this.managerSettings[i];a!==r&&e.push({setting:i,oldValue:a,newValue:r})}}_checkDevtoolsSettingsChanges(e){let t=["showNameTags"];for(let i of t){let a=this.initialSettings.devtools[i],r=this.devtoolsSettings[i];a!==r&&e.push({setting:i,oldValue:a,newValue:r})}}_handleDevtoolsSettingChange(e){let{setting:t,value:i}=e.detail;t==="showNameTags"&&(this.devtoolsSettings={...this.devtoolsSettings,showNameTags:i},l.instance.alterDevtoolsSettings({showNameTags:i}),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 $e`<tab-content
1317
1350
  .noContentMessage=${"Loading settings..."}
1318
1351
  .hasContent=${!1}
1319
1352
  ></tab-content>`;let e=this.managerSettings,t=this.changedSettings.length>0?`Settings that have been changed this session compared to your initialized settings.
1320
1353
  Click on the copy icon to easely copy the new setting into your project
1321
1354
 
1322
1355
  `+this.changedSettings.map(i=>`${i.setting}: ${JSON.stringify(i.oldValue)} -> ${JSON.stringify(i.newValue)}`).join(`
1323
- `):"No settings changed from initial values";return Oe`
1356
+ `):"No settings changed from initial values";return $e`
1324
1357
  <tab-header>
1325
1358
  <div slot="chips" class="chips-container">
1326
1359
  <chip-element .title=${t}> ${this.changedSettings.length} changed </chip-element>
@@ -1377,7 +1410,7 @@ Click on the copy icon to easely copy the new setting into your project
1377
1410
  .currentValue=${e.tabOffset}
1378
1411
  .maxValue=${20}
1379
1412
  .minValue=${0}
1380
- .unit=${De}
1413
+ .unit=${Me}
1381
1414
  header="Tab Offset"
1382
1415
  description="Number of tabbable elements to look ahead when predicting navigation"
1383
1416
  setting="tabOffset"
@@ -1397,7 +1430,7 @@ Click on the copy icon to easely copy the new setting into your project
1397
1430
  .currentValue=${e.scrollMargin}
1398
1431
  .maxValue=${300}
1399
1432
  .minValue=${30}
1400
- .unit=${Me}
1433
+ .unit=${De}
1401
1434
  header="Scroll Margin"
1402
1435
  description="Pixel distance to check from mouse position in scroll direction"
1403
1436
  setting="scrollMargin"
@@ -1449,7 +1482,7 @@ Click on the copy icon to easely copy the new setting into your project
1449
1482
  border-bottom: 1px solid rgba(176, 196, 222, 0.2);
1450
1483
  padding-bottom: 8px;
1451
1484
  }
1452
- `,n([Y()],w.prototype,"managerSettings",2),n([Y()],w.prototype,"initialSettings",2),n([Y()],w.prototype,"devtoolsSettings",2),n([Y()],w.prototype,"changedSettings",2),w=n([on("settings-tab")],w);var b=class extends an{constructor(){super();this.isMinimized=l.instance.devtoolsSettings.isControlPanelDefaultMinimized;this.visibleCount=0;this.totalCount=0;this.localStorageSelectedTabKey="foresight-devtools-control-panel-tab";this._handleVisibilityCountChange=e=>{let t=e;this.visibleCount=t.detail.visibleCount,this.totalCount=t.detail.totalCount};let e=localStorage.getItem(this.localStorageSelectedTabKey);this.activeTab=e||"logs"}_handleTabChange(e){this.activeTab=e.detail.tab,localStorage.setItem(this.localStorageSelectedTabKey,this.activeTab)}connectedCallback(){super.connectedCallback(),this.addEventListener("visibility-count-updated",this._handleVisibilityCountChange)}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("visibility-count-updated",this._handleVisibilityCountChange)}render(){return rn`
1485
+ `,n([Y()],w.prototype,"managerSettings",2),n([Y()],w.prototype,"initialSettings",2),n([Y()],w.prototype,"devtoolsSettings",2),n([Y()],w.prototype,"changedSettings",2),w=n([on("settings-tab")],w);var v=class extends an{constructor(){super();this.isMinimized=l.instance.devtoolsSettings.isControlPanelDefaultMinimized;this.visibleCount=0;this.totalCount=0;this.localStorageSelectedTabKey="foresight-devtools-control-panel-tab";this._handleVisibilityCountChange=e=>{let t=e;this.visibleCount=t.detail.visibleCount,this.totalCount=t.detail.totalCount};let e=localStorage.getItem(this.localStorageSelectedTabKey);this.activeTab=e||"logs"}_handleTabChange(e){this.activeTab=e.detail.tab,localStorage.setItem(this.localStorageSelectedTabKey,this.activeTab)}connectedCallback(){super.connectedCallback(),this.addEventListener("visibility-count-updated",this._handleVisibilityCountChange)}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("visibility-count-updated",this._handleVisibilityCountChange)}render(){return rn`
1453
1486
  <div class="control-wrapper ${this.isMinimized?"minimized":""}">
1454
1487
  <div class="title-wrapper">
1455
1488
  <button @click="${()=>this.isMinimized=!this.isMinimized}" class="minimize-button">
@@ -1478,7 +1511,7 @@ Click on the copy icon to easely copy the new setting into your project
1478
1511
  </div>
1479
1512
  </div>
1480
1513
  </div>
1481
- `}};b.styles=sn`
1514
+ `}};v.styles=sn`
1482
1515
  .control-wrapper {
1483
1516
  padding: 12px;
1484
1517
  position: fixed;
@@ -1558,7 +1591,7 @@ Click on the copy icon to easely copy the new setting into your project
1558
1591
  width: 100%;
1559
1592
  height: 100%;
1560
1593
  }
1561
- `,n([q()],b.prototype,"activeTab",2),n([q()],b.prototype,"isMinimized",2),n([q()],b.prototype,"visibleCount",2),n([q()],b.prototype,"totalCount",2),b=n([ln("control-panel")],b);customElements.get("control-panel")||customElements.define("control-panel",b);import{LitElement as Cn,css as Sn,html as Tn}from"lit";import{customElement as Mn}from"lit/decorators.js";import{LitElement as dn,html as cn,css as pn}from"lit";import{customElement as gn,state as Ie,query as hn}from"lit/decorators.js";import{ForesightManager as V}from"js.foresight";var C=class extends dn{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("elementReactivated",t=>{t.elementData.isIntersectingWithViewport&&this.createOrUpdateElementOverlay(t.elementData)},{signal:e}),V.instance.addEventListener("elementDataUpdated",t=>{t.updatedProps.includes("bounds")&&t.elementData.callbackInfo.isCallbackActive&&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),this.removeElementOverlay(t.elementData)},{signal:e}),document.addEventListener("showNameTagsChanged",t=>{let i=t;this.updateNameTagVisibility(i.detail.showNameTags)},{signal:e})}createElementOverlays(e){let t=document.createElement("div");t.className="expanded-overlay";let i=document.createElement("div");i.className="name-label",this.containerElement.appendChild(t),this.containerElement.appendChild(i);let a={expandedOverlay:t,nameLabel:i};return this.overlayMap.set(e.element,a),a}updateElementOverlays(e,t){let{expandedOverlay:i,nameLabel:a}=e,{expandedRect:r}=t.elementBounds,T=r.right-r.left,B=r.bottom-r.top;i.style.width=`${T}px`,i.style.height=`${B}px`,i.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 i=this.overlayMap.get(e.element);if(i)switch(this.clearCallbackAnimationTimeout(e.element),t.kind){case"mouse":i.expandedOverlay.classList.add("invoked-by-mouse");break;case"scroll":i.expandedOverlay.classList.add("invoked-by-scroll");break;case"tab":i.expandedOverlay.classList.add("invoked-by-tab");break;default:}}unhighlightElementCallback(e){let t=this.overlayMap.get(e.element);if(!t)return;let i=setTimeout(()=>{t.expandedOverlay.classList.remove("callback-invoked"),this.callbackAnimations.delete(e.element)},400);this.callbackAnimations.set(e.element,{element:e.element,timeoutId:i})}updateNameTagVisibility(e){this.overlayMap.forEach(t=>{let i=t.nameLabel;e?i.style.display="block":i.style.display="none"})}disconnectedCallback(){super.disconnectedCallback(),this.callbackAnimations.forEach(e=>{clearTimeout(e.timeoutId)}),this.callbackAnimations.clear(),this.overlayMap.clear(),this._abortController?.abort(),this._abortController=null}render(){return cn` <div id="overlays-container"></div> `}};C.styles=[pn`
1594
+ `,n([q()],v.prototype,"activeTab",2),n([q()],v.prototype,"isMinimized",2),n([q()],v.prototype,"visibleCount",2),n([q()],v.prototype,"totalCount",2),v=n([ln("control-panel")],v);customElements.get("control-panel")||customElements.define("control-panel",v);import{LitElement as Cn,css as Sn,html as Tn}from"lit";import{customElement as Dn}from"lit/decorators.js";import{LitElement as cn,html as dn,css as pn}from"lit";import{customElement as gn,state as Oe,query as mn}from"lit/decorators.js";import{ForesightManager as V}from"js.foresight";var C=class extends cn{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("elementReactivated",t=>{t.elementData.isIntersectingWithViewport&&this.createOrUpdateElementOverlay(t.elementData)},{signal:e}),V.instance.addEventListener("elementDataUpdated",t=>{t.updatedProps.includes("bounds")&&t.elementData.callbackInfo.isCallbackActive&&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),this.removeElementOverlay(t.elementData)},{signal:e}),document.addEventListener("showNameTagsChanged",t=>{let i=t;this.updateNameTagVisibility(i.detail.showNameTags)},{signal:e})}createElementOverlays(e){let t=document.createElement("div");t.className="expanded-overlay";let i=document.createElement("div");i.className="name-label",this.containerElement.appendChild(t),this.containerElement.appendChild(i);let a={expandedOverlay:t,nameLabel:i};return this.overlayMap.set(e.element,a),a}updateElementOverlays(e,t){let{expandedOverlay:i,nameLabel:a}=e,{expandedRect:r}=t.elementBounds,T=r.right-r.left,B=r.bottom-r.top;i.style.width=`${T}px`,i.style.height=`${B}px`,i.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 i=this.overlayMap.get(e.element);if(i)switch(this.clearCallbackAnimationTimeout(e.element),t.kind){case"mouse":i.expandedOverlay.classList.add("invoked-by-mouse");break;case"scroll":i.expandedOverlay.classList.add("invoked-by-scroll");break;case"tab":i.expandedOverlay.classList.add("invoked-by-tab");break;default:}}unhighlightElementCallback(e){let t=this.overlayMap.get(e.element);if(!t)return;let i=setTimeout(()=>{t.expandedOverlay.classList.remove("callback-invoked"),this.callbackAnimations.delete(e.element)},400);this.callbackAnimations.set(e.element,{element:e.element,timeoutId:i})}updateNameTagVisibility(e){this.overlayMap.forEach(t=>{let i=t.nameLabel;e?i.style.display="block":i.style.display="none"})}disconnectedCallback(){super.disconnectedCallback(),this.callbackAnimations.forEach(e=>{clearTimeout(e.timeoutId)}),this.callbackAnimations.clear(),this.overlayMap.clear(),this._abortController?.abort(),this._abortController=null}render(){return dn` <div id="overlays-container"></div> `}};C.styles=[pn`
1562
1595
  :host {
1563
1596
  position: fixed;
1564
1597
  top: 0;
@@ -1625,7 +1658,7 @@ Click on the copy icon to easely copy the new setting into your project
1625
1658
  white-space: nowrap;
1626
1659
  pointer-events: none;
1627
1660
  }
1628
- `],n([Ie()],C.prototype,"overlayMap",2),n([Ie()],C.prototype,"callbackAnimations",2),n([hn("#overlays-container")],C.prototype,"containerElement",2),C=n([gn("element-overlays")],C);import{LitElement as mn,html as un,css as bn}from"lit";import{customElement as vn,state as te}from"lit/decorators.js";import{styleMap as fn}from"lit/directives/style-map.js";import{ForesightManager as A}from"js.foresight";var S=class extends mn{constructor(){super(...arguments);this._abortController=new AbortController;this._mousePredictionIsEnabled=A.instance.getManagerData.globalSettings.enableMousePrediction;this._isVisible=!1;this._trajectoryStyles={};this.handleElementUnregistered=e=>{e.wasLastElement&&(this._isVisible=!1)};this.handleSettingsChange=e=>{let t=e.managerData.globalSettings.enableMousePrediction;this._mousePredictionIsEnabled=t,t||(this._isVisible=!1),this.requestUpdate()};this.handleTrajectoryUpdate=e=>{if(!this._mousePredictionIsEnabled)return;this._isVisible=!0;let{currentPoint:t,predictedPoint:i}=e.trajectoryPositions,a=i.x-t.x,r=i.y-t.y,T=Math.sqrt(a*a+r*r),B=Math.atan2(r,a)*57.29577951308232;this._trajectoryStyles={transform:`translate3d(${t.x}px, ${t.y}px, 0) rotate(${B}deg)`,width:`${T}px`}}}connectedCallback(){super.connectedCallback();let{signal:e}=this._abortController;A.instance.addEventListener("mouseTrajectoryUpdate",this.handleTrajectoryUpdate,{signal:e}),A.instance.addEventListener("elementUnregistered",this.handleElementUnregistered,{signal:e}),A.instance.addEventListener("scrollTrajectoryUpdate",()=>{this._isVisible=!1},{signal:e}),A.instance.addEventListener("managerSettingsChanged",this.handleSettingsChange,{signal:e})}disconnectedCallback(){super.disconnectedCallback(),this._abortController.abort()}render(){let e={display:this._isVisible?"block":"none",...this._trajectoryStyles};return un` <div class="trajectory-line" style=${fn(e)}></div> `}};S.styles=[bn`
1661
+ `],n([Oe()],C.prototype,"overlayMap",2),n([Oe()],C.prototype,"callbackAnimations",2),n([mn("#overlays-container")],C.prototype,"containerElement",2),C=n([gn("element-overlays")],C);import{LitElement as hn,html as un,css as bn}from"lit";import{customElement as vn,state as te}from"lit/decorators.js";import{styleMap as fn}from"lit/directives/style-map.js";import{ForesightManager as A}from"js.foresight";var S=class extends hn{constructor(){super(...arguments);this._abortController=new AbortController;this._mousePredictionIsEnabled=A.instance.getManagerData.globalSettings.enableMousePrediction;this._isVisible=!1;this._trajectoryStyles={};this.handleElementUnregistered=e=>{e.wasLastElement&&(this._isVisible=!1)};this.handleSettingsChange=e=>{let t=e.managerData.globalSettings.enableMousePrediction;this._mousePredictionIsEnabled=t,t||(this._isVisible=!1),this.requestUpdate()};this.handleTrajectoryUpdate=e=>{if(!this._mousePredictionIsEnabled)return;this._isVisible=!0;let{currentPoint:t,predictedPoint:i}=e.trajectoryPositions,a=i.x-t.x,r=i.y-t.y,T=Math.sqrt(a*a+r*r),B=Math.atan2(r,a)*57.29577951308232;this._trajectoryStyles={transform:`translate3d(${t.x}px, ${t.y}px, 0) rotate(${B}deg)`,width:`${T}px`}}}connectedCallback(){super.connectedCallback();let{signal:e}=this._abortController;A.instance.addEventListener("mouseTrajectoryUpdate",this.handleTrajectoryUpdate,{signal:e}),A.instance.addEventListener("elementUnregistered",this.handleElementUnregistered,{signal:e}),A.instance.addEventListener("scrollTrajectoryUpdate",()=>{this._isVisible=!1},{signal:e}),A.instance.addEventListener("managerSettingsChanged",this.handleSettingsChange,{signal:e})}disconnectedCallback(){super.disconnectedCallback(),this._abortController.abort()}render(){let e={display:this._isVisible?"block":"none",...this._trajectoryStyles};return un` <div class="trajectory-line" style=${fn(e)}></div> `}};S.styles=[bn`
1629
1662
  :host {
1630
1663
  display: block;
1631
1664
  }
@@ -1733,9 +1766,9 @@ Click on the copy icon to easely copy the new setting into your project
1733
1766
  pointer-events: none;
1734
1767
  z-index: 9999;
1735
1768
  }
1736
- `],H=n([Mn("debug-overlay")],H);var l=class extends Dn{constructor(){super();this.isInitialized=!1;this.devtoolsSettings={showDebugger:!0,isControlPanelDefaultMinimized:!1,showNameTags:!0,sortElementList:"visibility",logging:{logLocation:"controlPanel",callbackCompleted:!0,elementReactivated:!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,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}updateLoggingSetting(e,t){this.shouldUpdateSetting(t,this.devtoolsSettings.logging[e])&&(this.devtoolsSettings.logging[e]=t)}alterDevtoolsSettings(e){e!==void 0&&(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.updateLoggingSetting("callbackCompleted",e.logging.callbackCompleted),this.updateLoggingSetting("callbackInvoked",e.logging.callbackInvoked),this.updateLoggingSetting("elementDataUpdated",e.logging.elementDataUpdated),this.updateLoggingSetting("elementRegistered",e.logging.elementRegistered),this.updateLoggingSetting("elementUnregistered",e.logging.elementUnregistered),this.updateLoggingSetting("managerSettingsChanged",e.logging.managerSettingsChanged),this.updateLoggingSetting("mouseTrajectoryUpdate",e.logging.mouseTrajectoryUpdate),this.updateLoggingSetting("scrollTrajectoryUpdate",e.logging.scrollTrajectoryUpdate)))}cleanup(){this.requestUpdate()}render(){return!this.isInitialized||!this.devtoolsSettings.showDebugger?Pe``:Pe`<control-panel></control-panel> <debug-overlay></debug-overlay>`}};l.styles=[Ln`
1769
+ `],H=n([Dn("debug-overlay")],H);var l=class extends Mn{constructor(){super();this.isInitialized=!1;this.devtoolsSettings={showDebugger:!0,isControlPanelDefaultMinimized:!1,showNameTags:!0,sortElementList:"visibility",logging:{logLocation:"controlPanel",callbackCompleted:!0,elementReactivated:!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,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}updateLoggingSetting(e,t){this.shouldUpdateSetting(t,this.devtoolsSettings.logging[e])&&(this.devtoolsSettings.logging[e]=t)}alterDevtoolsSettings(e){e!==void 0&&(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.updateLoggingSetting("callbackCompleted",e.logging.callbackCompleted),this.updateLoggingSetting("callbackInvoked",e.logging.callbackInvoked),this.updateLoggingSetting("elementDataUpdated",e.logging.elementDataUpdated),this.updateLoggingSetting("elementRegistered",e.logging.elementRegistered),this.updateLoggingSetting("elementUnregistered",e.logging.elementUnregistered),this.updateLoggingSetting("managerSettingsChanged",e.logging.managerSettingsChanged),this.updateLoggingSetting("mouseTrajectoryUpdate",e.logging.mouseTrajectoryUpdate),this.updateLoggingSetting("scrollTrajectoryUpdate",e.logging.scrollTrajectoryUpdate)))}cleanup(){this.requestUpdate()}render(){return!this.isInitialized||!this.devtoolsSettings.showDebugger?Pe``:Pe`<control-panel></control-panel> <debug-overlay></debug-overlay>`}};l.styles=[Ln`
1737
1770
  :host {
1738
1771
  display: block;
1739
1772
  }
1740
- `],l._instance=null,n([$n()],l.prototype,"isInitialized",2),l=n([_n("foresight-devtools")],l);export{l as ForesightDevtools};
1773
+ `],l._instance=null,n([In()],l.prototype,"isInitialized",2),l=n([_n("foresight-devtools")],l);export{l as ForesightDevtools};
1741
1774
  //# sourceMappingURL=index.js.map