js.foresight-devtools 1.3.1 → 1.3.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
@@ -470,7 +470,10 @@ declare class SettingsTab extends LitElement {
470
470
  private initialSettings;
471
471
  private devtoolsSettings;
472
472
  private changedSettings;
473
+ private currentCorner;
473
474
  private touchDeviceStrategyOptions;
475
+ private minimumConnectionTypeOptions;
476
+ private cornerOptions;
474
477
  private _abortController;
475
478
  constructor();
476
479
  connectedCallback(): void;
@@ -480,6 +483,9 @@ declare class SettingsTab extends LitElement {
480
483
  private _checkDevtoolsSettingsChanges;
481
484
  private _handleDevtoolsSettingChange;
482
485
  private _handleTouchDeviceStrategyChange;
486
+ private _handleMinimumConnectionTypeChange;
487
+ private _handleCornerChange;
488
+ private getCurrentCorner;
483
489
  private handleCopySettings;
484
490
  private generateSettingsCode;
485
491
  render(): lit.TemplateResult<1>;
package/dist/index.js CHANGED
@@ -1,4 +1,4 @@
1
- var ze=Object.defineProperty;var He=Object.getOwnPropertyDescriptor;var n=(o,r,e,t)=>{for(var i=t>1?void 0:t?He(r,e):r,a=o.length-1,s;a>=0;a--)(s=o[a])&&(i=(t?s(r,e,i):s(i))||i);return t&&i&&ze(r,e,i),i};import{LitElement as zn,css as Hn,html as Fe}from"lit";import{customElement as Bn,state as Gn}from"lit/decorators.js";import{LitElement as yn,css as wn,html as xn}from"lit";import{customElement as kn,state as Q}from"lit/decorators.js";import{classMap as re}from"lit/directives/class-map.js";import{ForesightManager as Ae}from"js.foresight";import{css as St,html as B,LitElement as Tt}from"lit";import{customElement as Dt,state as L}from"lit/decorators.js";import{map as Me}from"lit/directives/map.js";import{ForesightManager as $}from"js.foresight";import{html as c}from"lit";var le=c`
1
+ var ze=Object.defineProperty;var He=Object.getOwnPropertyDescriptor;var n=(o,r,e,t)=>{for(var i=t>1?void 0:t?He(r,e):r,a=o.length-1,s;a>=0;a--)(s=o[a])&&(i=(t?s(r,e,i):s(i))||i);return t&&i&&ze(r,e,i),i};import{LitElement as zn,css as Hn,html as Fe}from"lit";import{customElement as Bn,state as Gn}from"lit/decorators.js";import{LitElement as yn,css as wn,html as xn}from"lit";import{customElement as kn,state as q}from"lit/decorators.js";import{classMap as re}from"lit/directives/class-map.js";import{ForesightManager as Ae}from"js.foresight";import{css as St,html as W,LitElement as Tt}from"lit";import{customElement as Dt,state as _}from"lit/decorators.js";import{map as Me}from"lit/directives/map.js";import{ForesightManager as I}from"js.foresight";import{html as c}from"lit";var le=c`
2
2
  <svg
3
3
  xmlns="http://www.w3.org/2000/svg"
4
4
  width="16"
@@ -46,7 +46,7 @@ var ze=Object.defineProperty;var He=Object.getOwnPropertyDescriptor;var n=(o,r,e
46
46
  <path d="M13.73 21a2 2 0 0 1-3.46 0"></path>
47
47
  <line x1="1" y1="1" x2="23" y2="23"></line>
48
48
  </svg>
49
- `,ge=c`
49
+ `,pe=c`
50
50
  <svg
51
51
  xmlns="http://www.w3.org/2000/svg"
52
52
  width="16"
@@ -64,7 +64,7 @@ var ze=Object.defineProperty;var He=Object.getOwnPropertyDescriptor;var n=(o,r,e
64
64
  <circle cx="6" cy="18" r="2" />
65
65
  <circle cx="18" cy="18" r="2" />
66
66
  </svg>
67
- `,pe=c`
67
+ `,ge=c`
68
68
  <svg
69
69
  xmlns="http://www.w3.org/2000/svg"
70
70
  width="16"
@@ -111,7 +111,7 @@ var ze=Object.defineProperty;var He=Object.getOwnPropertyDescriptor;var n=(o,r,e
111
111
  >
112
112
  <path d="M8 6h13M8 12h13M8 18h13M3 6h.01M3 12h.01M3 18h.01" />
113
113
  </svg>
114
- `,h=c`
114
+ `,u=c`
115
115
  <svg
116
116
  xmlns="http://www.w3.org/2000/svg"
117
117
  width="16"
@@ -272,11 +272,11 @@ var ze=Object.defineProperty;var He=Object.getOwnPropertyDescriptor;var n=(o,r,e
272
272
  <circle cx="12" cy="12" r="10"/>
273
273
  <line x1="4.93" y1="4.93" x2="19.07" y2="19.07"/>
274
274
  </svg>
275
- `;import{LitElement as Be,html as Ge,css as We}from"lit";import{customElement as Ke,property as qe}from"lit/decorators.js";var U=class extends Be{constructor(){super(...arguments);this.title=""}render(){return Ge`
275
+ `;import{LitElement as Be,html as Ge,css as We}from"lit";import{customElement as Ke,property as qe}from"lit/decorators.js";var A=class extends Be{constructor(){super(...arguments);this.title=""}render(){return Ge`
276
276
  <span class="chip" title="${this.title}">
277
277
  <slot></slot>
278
278
  </span>
279
- `}};U.styles=[We`
279
+ `}};A.styles=[We`
280
280
  :host {
281
281
  display: inline-block;
282
282
  }
@@ -296,11 +296,11 @@ var ze=Object.defineProperty;var He=Object.getOwnPropertyDescriptor;var n=(o,r,e
296
296
  line-height: 1.2;
297
297
  transition: all 0.2s ease;
298
298
  }
299
- `],n([qe({type:String})],U.prototype,"title",2),U=n([Ke("chip-element")],U);import{LitElement as Ye,html as te,css as Je}from"lit";import{customElement as Xe,property as xe}from"lit/decorators.js";var D=class extends Ye{constructor(){super(...arguments);this.noContentMessage="No content available.";this.hasContent=!0}render(){return te`
299
+ `],n([qe({type:String})],A.prototype,"title",2),A=n([Ke("chip-element")],A);import{LitElement as Ye,html as ne,css as Je}from"lit";import{customElement as Xe,property as xe}from"lit/decorators.js";var L=class extends Ye{constructor(){super(...arguments);this.noContentMessage="No content available.";this.hasContent=!0}render(){return ne`
300
300
  <div class="content-container">
301
- ${this.hasContent?te`<slot></slot>`:te`<div class="no-content-message">${this.noContentMessage}</div>`}
301
+ ${this.hasContent?ne`<slot></slot>`:ne`<div class="no-content-message">${this.noContentMessage}</div>`}
302
302
  </div>
303
- `}};D.styles=[Je`
303
+ `}};L.styles=[Je`
304
304
  :host {
305
305
  overflow: hidden;
306
306
  }
@@ -340,7 +340,7 @@ var ze=Object.defineProperty;var He=Object.getOwnPropertyDescriptor;var n=(o,r,e
340
340
  font-style: italic;
341
341
  font-family: "Courier New", monospace;
342
342
  }
343
- `],n([xe({type:String,attribute:"no-content-message"})],D.prototype,"noContentMessage",2),n([xe({type:Boolean})],D.prototype,"hasContent",2),D=n([Xe("tab-content")],D);import{LitElement as Ze,html as Qe,css as et}from"lit";import{customElement as tt}from"lit/decorators.js";var z=class extends Ze{render(){return Qe`
343
+ `],n([xe({type:String,attribute:"no-content-message"})],L.prototype,"noContentMessage",2),n([xe({type:Boolean})],L.prototype,"hasContent",2),L=n([Xe("tab-content")],L);import{LitElement as Ze,html as Qe,css as et}from"lit";import{customElement as tt}from"lit/decorators.js";var B=class extends Ze{render(){return Qe`
344
344
  <div class="tab-bar-elements">
345
345
  <div class="tab-bar-info">
346
346
  <div class="stats-chips">
@@ -351,7 +351,7 @@ var ze=Object.defineProperty;var He=Object.getOwnPropertyDescriptor;var n=(o,r,e
351
351
  <slot name="actions"></slot>
352
352
  </div>
353
353
  </div>
354
- `}};z.styles=[et`
354
+ `}};B.styles=[et`
355
355
  :host {
356
356
  }
357
357
  .tab-bar-info {
@@ -395,7 +395,7 @@ var ze=Object.defineProperty;var He=Object.getOwnPropertyDescriptor;var n=(o,r,e
395
395
  z-index: 5;
396
396
  min-height: 36px;
397
397
  }
398
- `],z=n([tt("tab-header")],z);import{html as rt}from"lit";import{customElement as st,property as Ee}from"lit/decorators.js";import{LitElement as nt,html as ke,css as it}from"lit";import{property as ot,state as at}from"lit/decorators.js";var g=class g extends nt{constructor(){super(...arguments);this.isDropdownOpen=!1;this.dropdownOptions=[];this._toggleDropdown=e=>{e.stopPropagation(),this.isDropdownOpen?this._closeDropdown():(g.currentlyOpen&&g.currentlyOpen!==this&&g.currentlyOpen._closeDropdown(),this.isDropdownOpen=!0,g.currentlyOpen=this,requestAnimationFrame(()=>{this._positionDropdown()}))};this._handleOutsideClick=e=>{this.isDropdownOpen&&(e.composedPath().includes(this)||this._closeDropdown())}}connectedCallback(){super.connectedCallback(),document.addEventListener("click",this._handleOutsideClick)}disconnectedCallback(){super.disconnectedCallback(),document.removeEventListener("click",this._handleOutsideClick),g.currentlyOpen===this&&(g.currentlyOpen=null)}_closeDropdown(){this.isDropdownOpen=!1,g.currentlyOpen===this&&(g.currentlyOpen=null)}_positionDropdown(){if(typeof window>"u")return;let e=this.shadowRoot?.querySelector(".trigger-button"),t=this.shadowRoot?.querySelector(".dropdown-menu");if(e&&t){let i=e.getBoundingClientRect(),a=t.offsetHeight||200,s=i.bottom+5,d=window.innerWidth-i.right;window.innerHeight-i.bottom<a&&i.top>a?t.style.top=`${i.top-a-5}px`:t.style.top=`${s}px`,t.style.right=`${d}px`}}render(){let e=`trigger-button ${this.isDropdownOpen?"active":""}`,t=`dropdown-menu ${this.isDropdownOpen?"active":""}`;return ke`
398
+ `],B=n([tt("tab-header")],B);import{html as rt}from"lit";import{customElement as st,property as Ce}from"lit/decorators.js";import{LitElement as nt,html as ke,css as it}from"lit";import{property as ot,state as at}from"lit/decorators.js";var p=class p extends nt{constructor(){super(...arguments);this.isDropdownOpen=!1;this.dropdownOptions=[];this._toggleDropdown=e=>{e.stopPropagation(),this.isDropdownOpen?this._closeDropdown():(p.currentlyOpen&&p.currentlyOpen!==this&&p.currentlyOpen._closeDropdown(),this.isDropdownOpen=!0,p.currentlyOpen=this,requestAnimationFrame(()=>{this._positionDropdown()}))};this._handleOutsideClick=e=>{this.isDropdownOpen&&(e.composedPath().includes(this)||this._closeDropdown())}}connectedCallback(){super.connectedCallback(),document.addEventListener("click",this._handleOutsideClick)}disconnectedCallback(){super.disconnectedCallback(),document.removeEventListener("click",this._handleOutsideClick),p.currentlyOpen===this&&(p.currentlyOpen=null)}_closeDropdown(){this.isDropdownOpen=!1,p.currentlyOpen===this&&(p.currentlyOpen=null)}_positionDropdown(){if(typeof window>"u")return;let e=this.shadowRoot?.querySelector(".trigger-button"),t=this.shadowRoot?.querySelector(".dropdown-menu");if(e&&t){let i=e.getBoundingClientRect(),a=t.offsetHeight||200,s=i.bottom+5,d=window.innerWidth-i.right;window.innerHeight-i.bottom<a&&i.top>a?t.style.top=`${i.top-a-5}px`:t.style.top=`${s}px`,t.style.right=`${d}px`}}render(){let e=`trigger-button ${this.isDropdownOpen?"active":""}`,t=`dropdown-menu ${this.isDropdownOpen?"active":""}`;return ke`
399
399
  <div class="dropdown-container">
400
400
  <button
401
401
  class="${e}"
@@ -434,7 +434,7 @@ var ze=Object.defineProperty;var He=Object.getOwnPropertyDescriptor;var n=(o,r,e
434
434
  `)}
435
435
  </div>
436
436
  </div>
437
- `}};g.currentlyOpen=null,g.styles=[it`
437
+ `}};p.currentlyOpen=null,p.styles=[it`
438
438
  :host {
439
439
  display: inline-block;
440
440
  }
@@ -549,7 +549,7 @@ var ze=Object.defineProperty;var He=Object.getOwnPropertyDescriptor;var n=(o,r,e
549
549
  color: #b0c4de;
550
550
  font-weight: bold;
551
551
  }
552
- `],n([at()],g.prototype,"isDropdownOpen",2),n([ot({type:Array})],g.prototype,"dropdownOptions",2);var M=g;var N=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:rt``}_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([Ee({type:String})],N.prototype,"selectedOptionValue",2),n([Ee({type:Function})],N.prototype,"onSelectionChange",2),N=n([st("single-select-dropdown")],N);import{LitElement as wt,html as xt,css as kt}from"lit";import{customElement as Et,property as J,state as Ct}from"lit/decorators.js";import{LitElement as pt,html as Te,css as ht}from"lit";import{customElement as mt,property as H}from"lit/decorators.js";import{LitElement as lt,html as ct,css as dt}from"lit";import{customElement as gt,property as Ce,state as Se}from"lit/decorators.js";var y=class extends lt{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 ct`
552
+ `],n([at()],p.prototype,"isDropdownOpen",2),n([ot({type:Array})],p.prototype,"dropdownOptions",2);var $=p;var V=class extends ${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:rt``}_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([Ce({type:String})],V.prototype,"selectedOptionValue",2),n([Ce({type:Function})],V.prototype,"onSelectionChange",2),V=n([st("single-select-dropdown")],V);import{LitElement as wt,html as xt,css as kt}from"lit";import{customElement as Ct,property as X,state as Et}from"lit/decorators.js";import{LitElement as gt,html as Te,css as ht}from"lit";import{customElement as mt,property as G}from"lit/decorators.js";import{LitElement as lt,html as ct,css as dt}from"lit";import{customElement as pt,property as Ee,state as Se}from"lit/decorators.js";var x=class extends lt{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 ct`
553
553
  <button
554
554
  class="copy-button ${this.isCopied?"copied":""}"
555
555
  title="${this.title}"
@@ -557,7 +557,7 @@ var ze=Object.defineProperty;var He=Object.getOwnPropertyDescriptor;var n=(o,r,e
557
557
  >
558
558
  ${this.isCopied?ve:be}
559
559
  </button>
560
- `}};y.styles=dt`
560
+ `}};x.styles=dt`
561
561
  .copy-button {
562
562
  background: transparent;
563
563
  border: 0px;
@@ -596,7 +596,7 @@ var ze=Object.defineProperty;var He=Object.getOwnPropertyDescriptor;var n=(o,r,e
596
596
  .copy-button.copied svg {
597
597
  stroke: #4caf50;
598
598
  }
599
- `,n([Ce({type:String})],y.prototype,"title",2),n([Ce({type:Function})],y.prototype,"onCopy",2),n([Se()],y.prototype,"isCopied",2),n([Se()],y.prototype,"copyTimeout",2),y=n([gt("copy-icon")],y);var b=class extends pt{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(s=>s.textContent).join("");try{await navigator.clipboard.writeText(a)}catch(s){console.error("Failed to copy text: ",s)}}}render(){return this.style.setProperty("--border-color",this.borderColor),Te`
599
+ `,n([Ee({type:String})],x.prototype,"title",2),n([Ee({type:Function})],x.prototype,"onCopy",2),n([Se()],x.prototype,"isCopied",2),n([Se()],x.prototype,"copyTimeout",2),x=n([pt("copy-icon")],x);var f=class extends gt{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(s=>s.textContent).join("");try{await navigator.clipboard.writeText(a)}catch(s){console.error("Failed to copy text: ",s)}}}render(){return this.style.setProperty("--border-color",this.borderColor),Te`
600
600
  <div class="item-entry ${this.isExpanded?"expanded":""}">
601
601
  <div class="item-header ${this.isExpanded?"expanded":""}" @click="${this.toggleExpand}">
602
602
  <div class="item-content">
@@ -621,7 +621,7 @@ var ze=Object.defineProperty;var He=Object.getOwnPropertyDescriptor;var n=(o,r,e
621
621
  </div>
622
622
  `:""}
623
623
  </div>
624
- `}};b.styles=[ht`
624
+ `}};f.styles=[ht`
625
625
  :host {
626
626
  display: block;
627
627
  }
@@ -718,7 +718,7 @@ var ze=Object.defineProperty;var He=Object.getOwnPropertyDescriptor;var n=(o,r,e
718
718
  display: block;
719
719
  overflow-x: auto;
720
720
  }
721
- `],n([H()],b.prototype,"borderColor",2),n([H()],b.prototype,"showCopyButton",2),n([H()],b.prototype,"itemId",2),n([H()],b.prototype,"isExpanded",2),n([H()],b.prototype,"onToggle",2),b=n([mt("expandable-item")],b);import{ForesightManager as ut}from"js.foresight";import{LitElement as bt,css as vt,html as Y}from"lit";import{customElement as ft,property as yt,state as De}from"lit/decorators.js";var E=class extends bt{constructor(){super(...arguments);this.remainingTime=0;this.isCountdownActive=!1;this.intervalId=null;this.startTime=0;this.handleTimerClick=e=>{e.stopPropagation(),ut.instance.reactivate(this.elementData.element)}}connectedCallback(){super.connectedCallback(),this.checkAndStartCountdown()}disconnectedCallback(){super.disconnectedCallback(),this.clearCountdown()}updated(e){super.updated(e),e.has("elementData")&&this.checkAndStartCountdown()}checkAndStartCountdown(){let e=this.elementData?.callbackInfo;if(!e){this.clearCountdown();return}let t=e.lastCallbackCompletedAt||e.lastCallbackInvokedAt;!e.isCallbackActive&&t&&e.reactivateAfter>0?this.startCountdown():this.clearCountdown()}startCountdown(){this.clearCountdown();let e=this.elementData?.callbackInfo;if(!e)return;if(this.isCountdownActive=!0,e.reactivateAfter===1/0){this.remainingTime=1/0;return}let t=e.reactivateAfter,i=e.lastCallbackCompletedAt||e.lastCallbackInvokedAt;if(!i){this.clearCountdown();return}this.startTime=i;let a=()=>{let s=Date.now()-this.startTime,d=Math.max(0,t-s);this.remainingTime=d,this.requestUpdate(),(d<=0||this.elementData.callbackInfo.isCallbackActive)&&this.clearCountdown()};a(),this.remainingTime>0&&typeof window<"u"&&(this.intervalId=window.setInterval(a,100))}clearCountdown(){this.intervalId!==null&&(clearInterval(this.intervalId),this.intervalId=null),this.isCountdownActive=!1,this.remainingTime=0}formatTime(e){if(e===1/0)return"\u221E";let t=Math.ceil(e/1e3);if(t<60)return`${t}s`;let i=Math.floor(t/60),a=t%60;if(i<60)return a>0?`${i}m ${a}s`:`${i}m`;let s=Math.floor(i/60),d=i%60;return d>0?`${s}h ${d}m`:`${s}h`}render(){return this.isCountdownActive?this.remainingTime===1/0?Y`
721
+ `],n([G()],f.prototype,"borderColor",2),n([G()],f.prototype,"showCopyButton",2),n([G()],f.prototype,"itemId",2),n([G()],f.prototype,"isExpanded",2),n([G()],f.prototype,"onToggle",2),f=n([mt("expandable-item")],f);import{ForesightManager as ut}from"js.foresight";import{LitElement as bt,css as vt,html as J}from"lit";import{customElement as ft,property as yt,state as De}from"lit/decorators.js";var E=class extends bt{constructor(){super(...arguments);this.remainingTime=0;this.isCountdownActive=!1;this.intervalId=null;this.startTime=0;this.handleTimerClick=e=>{e.stopPropagation(),ut.instance.reactivate(this.elementData.element)}}connectedCallback(){super.connectedCallback(),this.checkAndStartCountdown()}disconnectedCallback(){super.disconnectedCallback(),this.clearCountdown()}updated(e){super.updated(e),e.has("elementData")&&this.checkAndStartCountdown()}checkAndStartCountdown(){let e=this.elementData?.callbackInfo;if(!e){this.clearCountdown();return}let t=e.lastCallbackCompletedAt||e.lastCallbackInvokedAt;!e.isCallbackActive&&t&&e.reactivateAfter>0?this.startCountdown():this.clearCountdown()}startCountdown(){this.clearCountdown();let e=this.elementData?.callbackInfo;if(!e)return;if(this.isCountdownActive=!0,e.reactivateAfter===1/0){this.remainingTime=1/0;return}let t=e.reactivateAfter,i=e.lastCallbackCompletedAt||e.lastCallbackInvokedAt;if(!i){this.clearCountdown();return}this.startTime=i;let a=()=>{let s=Date.now()-this.startTime,d=Math.max(0,t-s);this.remainingTime=d,this.requestUpdate(),(d<=0||this.elementData.callbackInfo.isCallbackActive)&&this.clearCountdown()};a(),this.remainingTime>0&&typeof window<"u"&&(this.intervalId=window.setInterval(a,100))}clearCountdown(){this.intervalId!==null&&(clearInterval(this.intervalId),this.intervalId=null),this.isCountdownActive=!1,this.remainingTime=0}formatTime(e){if(e===1/0)return"\u221E";let t=Math.ceil(e/1e3);if(t<60)return`${t}s`;let i=Math.floor(t/60),a=t%60;if(i<60)return a>0?`${i}m ${a}s`:`${i}m`;let s=Math.floor(i/60),d=i%60;return d>0?`${s}h ${d}m`:`${s}h`}render(){return this.isCountdownActive?this.remainingTime===1/0?J`
722
722
  <button
723
723
  class="reactivate-button"
724
724
  @click="${this.handleTimerClick}"
@@ -726,7 +726,7 @@ var ze=Object.defineProperty;var He=Object.getOwnPropertyDescriptor;var n=(o,r,e
726
726
  >
727
727
  <span class="countdown-time infinity">∞</span>
728
728
  </button>
729
- `:this.remainingTime<=0?Y``:Y`
729
+ `:this.remainingTime<=0?J``:J`
730
730
  <button
731
731
  class="reactivate-button"
732
732
  @click="${this.handleTimerClick}"
@@ -734,7 +734,7 @@ var ze=Object.defineProperty;var He=Object.getOwnPropertyDescriptor;var n=(o,r,e
734
734
  >
735
735
  <span class="countdown-time clickable">${this.formatTime(this.remainingTime)}</span>
736
736
  </button>
737
- `:Y``}};E.styles=[vt`
737
+ `:J``}};E.styles=[vt`
738
738
  :host {
739
739
  display: inline-block;
740
740
  }
@@ -764,7 +764,7 @@ var ze=Object.defineProperty;var He=Object.getOwnPropertyDescriptor;var n=(o,r,e
764
764
  .countdown-time.clickable {
765
765
  cursor: pointer;
766
766
  }
767
- `],n([yt({hasChanged:()=>!0})],E.prototype,"elementData",2),n([De()],E.prototype,"remainingTime",2),n([De()],E.prototype,"isCountdownActive",2),E=n([ft("reactivate-countdown")],E);import{ForesightManager as ne}from"js.foresight";var v=class extends wt{constructor(){super(...arguments);this.isActive=!1;this.isExpanded=!1;this.currentDeviceStrategy="mouse";this._abortController=null;this.handleUnregister=e=>{e.stopPropagation(),ne.instance.unregister(this.elementData.element,"devtools")}}connectedCallback(){super.connectedCallback(),this._abortController=new AbortController;let{signal:e}=this._abortController;this.currentDeviceStrategy=ne.instance.getManagerData.currentDeviceStrategy,ne.instance.addEventListener("deviceStrategyChanged",t=>{this.currentDeviceStrategy=t.newStrategy},{signal:e})}disconnectedCallback(){super.disconnectedCallback(),this._abortController?.abort(),this._abortController=null}getBorderColor(){return this.isActive?"#ffeb3b":this.elementData.callbackInfo.isCallbackActive?this.currentDeviceStrategy==="touch"?"#ba68c8":this.elementData.isIntersectingWithViewport?"#4caf50":"#666":"#999"}getStatusIndicatorClass(){return this.isActive?"prefetching":this.elementData.callbackInfo.isCallbackActive?this.currentDeviceStrategy==="touch"?"touch-device":this.elementData.isIntersectingWithViewport?"visible":"hidden":"inactive"}getStatusText(){if(this.isActive)return"callback active";if(!this.elementData.callbackInfo.isCallbackActive)return"callback inactive";let e=this.elementData.isIntersectingWithViewport?"in viewport":"not in viewport",t=this.currentDeviceStrategy==="touch"?" (touch device)":"";return e+t}formatElementDetails(){let e=this.elementData,t={status:this.getStatusText(),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&&this.currentDeviceStrategy!=="touch";return xt`
767
+ `],n([yt({hasChanged:()=>!0})],E.prototype,"elementData",2),n([De()],E.prototype,"remainingTime",2),n([De()],E.prototype,"isCountdownActive",2),E=n([ft("reactivate-countdown")],E);import{ForesightManager as ie}from"js.foresight";var y=class extends wt{constructor(){super(...arguments);this.isActive=!1;this.isExpanded=!1;this.currentDeviceStrategy="mouse";this._abortController=null;this.handleUnregister=e=>{e.stopPropagation(),ie.instance.unregister(this.elementData.element,"devtools")}}connectedCallback(){super.connectedCallback(),this._abortController=new AbortController;let{signal:e}=this._abortController;this.currentDeviceStrategy=ie.instance.getManagerData.currentDeviceStrategy,ie.instance.addEventListener("deviceStrategyChanged",t=>{this.currentDeviceStrategy=t.newStrategy},{signal:e})}disconnectedCallback(){super.disconnectedCallback(),this._abortController?.abort(),this._abortController=null}getBorderColor(){return this.isActive?"#ffeb3b":this.elementData.callbackInfo.isCallbackActive?this.currentDeviceStrategy==="touch"?"#ba68c8":this.elementData.isIntersectingWithViewport?"#4caf50":"#666":"#999"}getStatusIndicatorClass(){return this.isActive?"prefetching":this.elementData.callbackInfo.isCallbackActive?this.currentDeviceStrategy==="touch"?"touch-device":this.elementData.isIntersectingWithViewport?"visible":"hidden":"inactive"}getStatusText(){if(this.isActive)return"callback active";if(!this.elementData.callbackInfo.isCallbackActive)return"callback inactive";let e=this.elementData.isIntersectingWithViewport?"in viewport":"not in viewport",t=this.currentDeviceStrategy==="touch"?" (touch device)":"";return e+t}formatElementDetails(){let e=this.elementData,t={status:this.getStatusText(),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&&this.currentDeviceStrategy!=="touch";return xt`
768
768
  <div class="element-wrapper ${e?"not-visible":""}">
769
769
  <expandable-item
770
770
  .borderColor=${this.getBorderColor()}
@@ -792,7 +792,7 @@ var ze=Object.defineProperty;var He=Object.getOwnPropertyDescriptor;var n=(o,r,e
792
792
  <div slot="details">${this.formatElementDetails()}</div>
793
793
  </expandable-item>
794
794
  </div>
795
- `}};v.styles=[kt`
795
+ `}};y.styles=[kt`
796
796
  :host {
797
797
  display: block;
798
798
  }
@@ -897,8 +897,8 @@ var ze=Object.defineProperty;var He=Object.getOwnPropertyDescriptor;var n=(o,r,e
897
897
  .element-wrapper.not-visible {
898
898
  opacity: 0.5;
899
899
  }
900
- `],n([J({hasChanged:()=>!0})],v.prototype,"elementData",2),n([J()],v.prototype,"isActive",2),n([J()],v.prototype,"isExpanded",2),n([J()],v.prototype,"onToggle",2),n([Ct()],v.prototype,"currentDeviceStrategy",2),v=n([Et("single-element")],v);var m=class extends Tt{constructor(){super();this.hitCount={mouse:{hover:0,trajectory:0},scroll:{down:0,left:0,right:0,up:0},tab:{forwards:0,reverse:0},touch:0,viewport:0,total:0};this.elementListItems=new Map;this.noContentMessage="No Elements Registered To The Foresight Manager";this.runningCallbacks=new Set;this.expandedElementIds=new Set;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:pe},{value:"documentOrder",label:"Document Order",title:"Sort by Document Order",icon:he},{value:"insertionOrder",label:"Insertion Order",title:"Sort by Insertion Order",icon:me}]}_generateHitsChipTitle(e){let t=[];t.push(`Total Callback Hits: ${e.total}`),t.push("");let i=e.mouse.trajectory+e.mouse.hover,a=e.scroll.up+e.scroll.down+e.scroll.left+e.scroll.right,s=e.tab.forwards+e.tab.reverse;t.push("Desktop Strategy"),i>0?t.push(` Mouse (${i}): ${e.mouse.trajectory} trajectory, ${e.mouse.hover} hover`):t.push(" Mouse: No hits"),a>0?t.push(` Scroll (${a}): Up ${e.scroll.up}, Down ${e.scroll.down}, Left ${e.scroll.left}, Right ${e.scroll.right}`):t.push(" Scroll: No hits"),s>0?t.push(` Tab (${s}): ${e.tab.forwards} forward, ${e.tab.reverse} reverse`):t.push(" Tab: No hits"),t.push("");let d=e.touch+e.viewport;return t.push("Touch Strategy"),e.touch>0?t.push(` Touch Start: ${e.touch}`):t.push(" Touch Start: No hits"),e.viewport>0?t.push(` Viewport Enter: ${e.viewport}`):t.push(" Viewport Enter: No hits"),d===0&&i+a+s===0&&(t.push(""),t.push("Interact with registered elements to see callback statistics")),t.join(`
901
- `)}connectedCallback(){super.connectedCallback(),this._abortController=new AbortController;let{signal:e}=this._abortController;this.updateElementListFromManager(),$.instance.addEventListener("elementRegistered",t=>{this.elementListItems.set(t.elementData.element,t.elementData)},{signal:e}),$.instance.addEventListener("elementDataUpdated",t=>{this.elementListItems.get(t.elementData.element)&&(this.elementListItems.set(t.elementData.element,t.elementData),this.requestUpdate())},{signal:e}),$.instance.addEventListener("elementReactivated",t=>{this.elementListItems.get(t.elementData.element)&&(this.elementListItems.set(t.elementData.element,t.elementData),this.requestUpdate())},{signal:e}),$.instance.addEventListener("elementUnregistered",t=>{this.elementListItems.delete(t.elementData.element),this.elementListItems.size||(this.noContentMessage="No Elements Registered To The Foresight Manager"),this.runningCallbacks.delete(t.elementData.element),this.requestUpdate()},{signal:e}),$.instance.addEventListener("callbackInvoked",t=>{this.elementListItems.get(t.elementData.element)&&this.elementListItems.set(t.elementData.element,t.elementData),this.runningCallbacks.add(t.elementData.element),this.requestUpdate()},{signal:e}),$.instance.addEventListener("callbackCompleted",t=>{this.elementListItems.get(t.elementData.element)&&this.elementListItems.set(t.elementData.element,t.elementData),this.handleCallbackCompleted(t.hitType),this.runningCallbacks.delete(t.elementData.element),this.requestUpdate()},{signal:e})}disconnectedCallback(){super.disconnectedCallback(),this._abortController?.abort(),this._abortController=null}updateElementListFromManager(){this.elementListItems=new Map($.instance.registeredElements)}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;case"touch":this.hitCount.touch++;break;case"viewport":this.hitCount.viewport++;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}}getActiveElements(){return this.getSortedElements().filter(e=>e.callbackInfo.isCallbackActive)}getInactiveElements(){return this.getSortedElements().filter(e=>!e.callbackInfo.isCallbackActive)}render(){return B`
900
+ `],n([X({hasChanged:()=>!0})],y.prototype,"elementData",2),n([X()],y.prototype,"isActive",2),n([X()],y.prototype,"isExpanded",2),n([X()],y.prototype,"onToggle",2),n([Et()],y.prototype,"currentDeviceStrategy",2),y=n([Ct("single-element")],y);var b=class extends Tt{constructor(){super();this.hitCount={mouse:{hover:0,trajectory:0},scroll:{down:0,left:0,right:0,up:0},tab:{forwards:0,reverse:0},touch:0,viewport:0,total:0};this.elementListItems=new Map;this.noContentMessage="No Elements Registered To The Foresight Manager";this.runningCallbacks=new Set;this.expandedElementIds=new Set;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:ge},{value:"documentOrder",label:"Document Order",title:"Sort by Document Order",icon:he},{value:"insertionOrder",label:"Insertion Order",title:"Sort by Insertion Order",icon:me}]}_generateHitsChipTitle(e){let t=[];t.push(`Total Callback Hits: ${e.total}`),t.push("");let i=e.mouse.trajectory+e.mouse.hover,a=e.scroll.up+e.scroll.down+e.scroll.left+e.scroll.right,s=e.tab.forwards+e.tab.reverse;t.push("Desktop Strategy"),i>0?t.push(` Mouse (${i}): ${e.mouse.trajectory} trajectory, ${e.mouse.hover} hover`):t.push(" Mouse: No hits"),a>0?t.push(` Scroll (${a}): Up ${e.scroll.up}, Down ${e.scroll.down}, Left ${e.scroll.left}, Right ${e.scroll.right}`):t.push(" Scroll: No hits"),s>0?t.push(` Tab (${s}): ${e.tab.forwards} forward, ${e.tab.reverse} reverse`):t.push(" Tab: No hits"),t.push("");let d=e.touch+e.viewport;return t.push("Touch Strategy"),e.touch>0?t.push(` Touch Start: ${e.touch}`):t.push(" Touch Start: No hits"),e.viewport>0?t.push(` Viewport Enter: ${e.viewport}`):t.push(" Viewport Enter: No hits"),d===0&&i+a+s===0&&(t.push(""),t.push("Interact with registered elements to see callback statistics")),t.join(`
901
+ `)}connectedCallback(){super.connectedCallback(),this._abortController=new AbortController;let{signal:e}=this._abortController;this.updateElementListFromManager(),I.instance.addEventListener("elementRegistered",t=>{this.elementListItems.set(t.elementData.element,t.elementData)},{signal:e}),I.instance.addEventListener("elementDataUpdated",t=>{this.elementListItems.get(t.elementData.element)&&(this.elementListItems.set(t.elementData.element,t.elementData),this.requestUpdate())},{signal:e}),I.instance.addEventListener("elementReactivated",t=>{this.elementListItems.get(t.elementData.element)&&(this.elementListItems.set(t.elementData.element,t.elementData),this.requestUpdate())},{signal:e}),I.instance.addEventListener("elementUnregistered",t=>{this.elementListItems.delete(t.elementData.element),this.elementListItems.size||(this.noContentMessage="No Elements Registered To The Foresight Manager"),this.runningCallbacks.delete(t.elementData.element),this.requestUpdate()},{signal:e}),I.instance.addEventListener("callbackInvoked",t=>{this.elementListItems.get(t.elementData.element)&&this.elementListItems.set(t.elementData.element,t.elementData),this.runningCallbacks.add(t.elementData.element),this.requestUpdate()},{signal:e}),I.instance.addEventListener("callbackCompleted",t=>{this.elementListItems.get(t.elementData.element)&&this.elementListItems.set(t.elementData.element,t.elementData),this.handleCallbackCompleted(t.hitType),this.runningCallbacks.delete(t.elementData.element),this.requestUpdate()},{signal:e})}disconnectedCallback(){super.disconnectedCallback(),this._abortController?.abort(),this._abortController=null}updateElementListFromManager(){this.elementListItems=new Map(I.instance.registeredElements)}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;case"touch":this.hitCount.touch++;break;case"viewport":this.hitCount.viewport++;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}}getActiveElements(){return this.getSortedElements().filter(e=>e.callbackInfo.isCallbackActive)}getInactiveElements(){return this.getSortedElements().filter(e=>!e.callbackInfo.isCallbackActive)}render(){return W`
902
902
  <tab-header>
903
903
  <div slot="chips" class="chips-container">
904
904
  <chip-element title="${this._generateHitsChipTitle(this.hitCount)}">
@@ -917,12 +917,12 @@ var ze=Object.defineProperty;var He=Object.getOwnPropertyDescriptor;var n=(o,r,e
917
917
  .noContentMessage=${this.noContentMessage}
918
918
  .hasContent=${!!this.elementListItems.size}
919
919
  >
920
- ${this.getActiveElements().length>0?B`
920
+ ${this.getActiveElements().length>0?W`
921
921
  <div class="element-section">
922
922
  <h3 class="section-header active">
923
923
  Active Elements (${this.getActiveElements().length})
924
924
  </h3>
925
- ${Me(this.getActiveElements(),e=>B`
925
+ ${Me(this.getActiveElements(),e=>W`
926
926
  <single-element
927
927
  .elementData=${e}
928
928
  .isActive=${this.runningCallbacks.has(e.element)}
@@ -933,12 +933,12 @@ var ze=Object.defineProperty;var He=Object.getOwnPropertyDescriptor;var n=(o,r,e
933
933
  `)}
934
934
  </div>
935
935
  `:""}
936
- ${this.getInactiveElements().length>0?B`
936
+ ${this.getInactiveElements().length>0?W`
937
937
  <div class="element-section">
938
938
  <h3 class="section-header inactive">
939
939
  Inactive Elements (${this.getInactiveElements().length})
940
940
  </h3>
941
- ${Me(this.getInactiveElements(),e=>B`
941
+ ${Me(this.getInactiveElements(),e=>W`
942
942
  <single-element
943
943
  .elementData=${e}
944
944
  .isActive=${this.runningCallbacks.has(e.element)}
@@ -950,7 +950,7 @@ var ze=Object.defineProperty;var He=Object.getOwnPropertyDescriptor;var n=(o,r,e
950
950
  </div>
951
951
  `:""}
952
952
  </tab-content>
953
- `}};m.styles=St`
953
+ `}};b.styles=St`
954
954
  :host {
955
955
  display: flex;
956
956
  flex-direction: column;
@@ -983,7 +983,7 @@ var ze=Object.defineProperty;var He=Object.getOwnPropertyDescriptor;var n=(o,r,e
983
983
  .section-header.inactive {
984
984
  color: #999;
985
985
  }
986
- `,n([L()],m.prototype,"hitCount",2),n([L()],m.prototype,"sortDropdown",2),n([L()],m.prototype,"sortOrder",2),n([L()],m.prototype,"elementListItems",2),n([L()],m.prototype,"noContentMessage",2),n([L()],m.prototype,"runningCallbacks",2),n([L()],m.prototype,"expandedElementIds",2),m=n([Dt("element-tab")],m);import{css as Mt,html as Le,LitElement as Lt}from"lit";import{customElement as $t,property as _t}from"lit/decorators.js";var A=class extends Lt{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 Le`
986
+ `,n([_()],b.prototype,"hitCount",2),n([_()],b.prototype,"sortDropdown",2),n([_()],b.prototype,"sortOrder",2),n([_()],b.prototype,"elementListItems",2),n([_()],b.prototype,"noContentMessage",2),n([_()],b.prototype,"runningCallbacks",2),n([_()],b.prototype,"expandedElementIds",2),b=n([Dt("element-tab")],b);import{css as Mt,html as Le,LitElement as Lt}from"lit";import{customElement as $t,property as _t}from"lit/decorators.js";var j=class extends Lt{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 Le`
987
987
  <div class="tab-selector-wrapper">
988
988
  ${this.tabs.map(e=>Le`
989
989
  <button
@@ -995,7 +995,7 @@ var ze=Object.defineProperty;var He=Object.getOwnPropertyDescriptor;var n=(o,r,e
995
995
  </button>
996
996
  `)}
997
997
  </div>
998
- `}};A.styles=Mt`
998
+ `}};j.styles=Mt`
999
999
  .tab-selector-wrapper {
1000
1000
  border-bottom: 2px solid #444;
1001
1001
  margin-top: 12px;
@@ -1026,8 +1026,8 @@ var ze=Object.defineProperty;var He=Object.getOwnPropertyDescriptor;var n=(o,r,e
1026
1026
  color: #b0c4de;
1027
1027
  border-bottom-color: #b0c4de;
1028
1028
  }
1029
- `,n([_t({type:String})],A.prototype,"activeTab",2),A=n([$t("tab-selector")],A);import{ForesightManager as G}from"js.foresight";import{LitElement as Vt,css as Rt,html as X}from"lit";import{customElement as Ft,property as zt,state as j}from"lit/decorators.js";import{map as Ht}from"lit/directives/map.js";function _e(o,r){let e={};o.eventListeners.forEach((i,a)=>{e[a]=i.length});let t=[];return o.registeredElements.forEach((i,a)=>{let{element:s,...d}=i;t.push({...d,elementInfo:`${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:r,globalCallbackHits:o.globalCallbackHits,localizedTimestamp:new Date().toLocaleTimeString(),eventListenerCount:e,managerSettings:o.globalSettings,registeredElements:t,summary:`${t.length} elements, ${Object.values(e).flat().length} listeners,
1030
- ${o.globalCallbackHits.total} hits`}}function Ie(o,r){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:r,summary:o.elementData.registerCount===1?o.elementData.name:`${o.elementData.name} - ${$e(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:r,summary:o.elementData.registerCount===1?o.elementData.name:`${o.elementData.name} - ${$e(o.elementData.registerCount)} time`};case"elementUnregistered":return{type:"elementUnregistered",name:o.elementData.name,id:o.elementData.element.id||"",meta:o.elementData.meta,callbackInfo:o.elementData.callbackInfo,wasLastRegisteredElement:o.wasLastRegisteredElement,localizedTimestamp:new Date(o.timestamp).toLocaleTimeString(),logId:r,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:r,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:r,summary:`${o.elementData.name} - ${o.hitType.kind}`};case"callbackCompleted":{let e=It(o.elementData.callbackInfo.lastCallbackRuntime||0);return{type:"callbackCompleted",name:o.elementData.name,hitType:o.hitType,callbackInfo:o.elementData.callbackInfo,meta:o.elementData.meta,wasLastActiveElement:o.wasLastActiveElement,elapsed:e,localizedTimestamp:new Date(o.timestamp).toLocaleTimeString(),logId:r,status:o.elementData.callbackInfo.lastCallbackStatus,errorMessage:o.elementData.callbackInfo.lastCallbackErrorMessage,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:r,summary:""};case"scrollTrajectoryUpdate":return{type:"scrollTrajectoryUpdate",currentPoint:o.currentPoint,predictedPoint:o.predictedPoint,scrollDirection:o.scrollDirection,localizedTimestamp:new Date().toLocaleTimeString(),logId:r,summary:o.scrollDirection};case"managerSettingsChanged":return{type:"managerSettingsChanged",globalSettings:o.managerData?.globalSettings||{},settingsChanged:o.updatedSettings,localizedTimestamp:new Date(o.timestamp).toLocaleTimeString(),logId:r,summary:o.updatedSettings.map(e=>e.setting).join(", ")};case"deviceStrategyChanged":return{type:"deviceStrategyChanged",oldStrategy:o.oldStrategy,newStrategy:o.newStrategy,localizedTimestamp:new Date(o.timestamp).toLocaleTimeString(),logId:r,summary:`${o.oldStrategy} \u2192 ${o.newStrategy}`};default:return{type:"serializationError",error:"Failed to serialize event data",errorMessage:JSON.stringify(o),localizedTimestamp:new Date().toLocaleTimeString(),logId:r,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:r,summary:""}}}function It(o){return`${(o/1e3).toFixed(4)} s`}function $e(o){let r=["th","st","nd","rd"],e=o%100;return o+(r[(e-20)%10]||r[e]||r[0])}import{html as Oe,css as Ot}from"lit";import{customElement as Pt,property as Pe}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 Oe`
1029
+ `,n([_t({type:String})],j.prototype,"activeTab",2),j=n([$t("tab-selector")],j);import{ForesightManager as K}from"js.foresight";import{LitElement as jt,css as Rt,html as Z}from"lit";import{customElement as Ft,property as zt,state as R}from"lit/decorators.js";import{map as Ht}from"lit/directives/map.js";function _e(o,r){let e={};o.eventListeners.forEach((i,a)=>{e[a]=i.length});let t=[];return o.registeredElements.forEach((i,a)=>{let{element:s,...d}=i;t.push({...d,elementInfo:`${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:r,globalCallbackHits:o.globalCallbackHits,localizedTimestamp:new Date().toLocaleTimeString(),eventListenerCount:e,managerSettings:o.globalSettings,registeredElements:t,summary:`${t.length} elements, ${Object.values(e).flat().length} listeners,
1030
+ ${o.globalCallbackHits.total} hits`}}function Ie(o,r){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:r,summary:o.elementData.registerCount===1?o.elementData.name:`${o.elementData.name} - ${$e(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:r,summary:o.elementData.registerCount===1?o.elementData.name:`${o.elementData.name} - ${$e(o.elementData.registerCount)} time`};case"elementUnregistered":return{type:"elementUnregistered",name:o.elementData.name,id:o.elementData.element.id||"",meta:o.elementData.meta,callbackInfo:o.elementData.callbackInfo,wasLastRegisteredElement:o.wasLastRegisteredElement,localizedTimestamp:new Date(o.timestamp).toLocaleTimeString(),logId:r,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:r,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:r,summary:`${o.elementData.name} - ${o.hitType.kind}`};case"callbackCompleted":{let e=It(o.elementData.callbackInfo.lastCallbackRuntime||0);return{type:"callbackCompleted",name:o.elementData.name,hitType:o.hitType,callbackInfo:o.elementData.callbackInfo,meta:o.elementData.meta,wasLastActiveElement:o.wasLastActiveElement,elapsed:e,localizedTimestamp:new Date(o.timestamp).toLocaleTimeString(),logId:r,status:o.elementData.callbackInfo.lastCallbackStatus,errorMessage:o.elementData.callbackInfo.lastCallbackErrorMessage,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:r,summary:""};case"scrollTrajectoryUpdate":return{type:"scrollTrajectoryUpdate",currentPoint:o.currentPoint,predictedPoint:o.predictedPoint,scrollDirection:o.scrollDirection,localizedTimestamp:new Date().toLocaleTimeString(),logId:r,summary:o.scrollDirection};case"managerSettingsChanged":return{type:"managerSettingsChanged",globalSettings:o.managerData?.globalSettings||{},settingsChanged:o.updatedSettings,localizedTimestamp:new Date(o.timestamp).toLocaleTimeString(),logId:r,summary:o.updatedSettings.map(e=>e.setting).join(", ")};case"deviceStrategyChanged":return{type:"deviceStrategyChanged",oldStrategy:o.oldStrategy,newStrategy:o.newStrategy,localizedTimestamp:new Date(o.timestamp).toLocaleTimeString(),logId:r,summary:`${o.oldStrategy} \u2192 ${o.newStrategy}`};default:return{type:"serializationError",error:"Failed to serialize event data",errorMessage:JSON.stringify(o),localizedTimestamp:new Date().toLocaleTimeString(),logId:r,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:r,summary:""}}}function It(o){return`${(o/1e3).toFixed(4)} s`}function $e(o){let r=["th","st","nd","rd"],e=o%100;return o+(r[(e-20)%10]||r[e]||r[0])}import{html as Oe,css as Ot}from"lit";import{customElement as Pt,property as Pe}from"lit/decorators.js";var O=class extends ${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 u}_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 Oe`
1031
1031
  <div class="dropdown-container">
1032
1032
  <button
1033
1033
  class="${e}"
@@ -1067,7 +1067,7 @@ var ze=Object.defineProperty;var He=Object.getOwnPropertyDescriptor;var n=(o,r,e
1067
1067
  `)}
1068
1068
  </div>
1069
1069
  </div>
1070
- `}};_.styles=[...M.styles,Ot`
1070
+ `}};O.styles=[...$.styles,Ot`
1071
1071
  .dropdown-menu button.active::after {
1072
1072
  content: "✓";
1073
1073
  position: absolute;
@@ -1083,7 +1083,7 @@ var ze=Object.defineProperty;var He=Object.getOwnPropertyDescriptor;var n=(o,r,e
1083
1083
  color: #b0c4de;
1084
1084
  margin-left: 2px;
1085
1085
  }
1086
- `],n([Pe({type:Array})],_.prototype,"selectedValues",2),n([Pe()],_.prototype,"onSelectionChange",2),_=n([Pt("multi-select-dropdown")],_);import{LitElement as Ut,html as Nt,css as At}from"lit";import{customElement as jt,property as ie}from"lit/decorators.js";var C=class extends Ut{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),s=i?"rgba(244, 67, 54, 0.1)":"transparent";this.style.setProperty("--log-color",a),this.style.setProperty("--log-background-color",s)}}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",deviceStrategyChanged:"#9c27b0"}[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",deviceStrategyChanged:"Strategy"}[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 Nt`
1086
+ `],n([Pe({type:Array})],O.prototype,"selectedValues",2),n([Pe()],O.prototype,"onSelectionChange",2),O=n([Pt("multi-select-dropdown")],O);import{LitElement as Ut,html as Nt,css as At}from"lit";import{customElement as Vt,property as oe}from"lit/decorators.js";var S=class extends Ut{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),s=i?"rgba(244, 67, 54, 0.1)":"transparent";this.style.setProperty("--log-color",a),this.style.setProperty("--log-background-color",s)}}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",deviceStrategyChanged:"#9c27b0"}[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",deviceStrategyChanged:"Strategy"}[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 Nt`
1087
1087
  <expandable-item
1088
1088
  .borderColor=${i}
1089
1089
  .itemId=${e.logId}
@@ -1099,7 +1099,7 @@ var ze=Object.defineProperty;var He=Object.getOwnPropertyDescriptor;var n=(o,r,e
1099
1099
  </div>
1100
1100
  <div slot="details">${this.serializeLogDataWithoutSummary(e)}</div>
1101
1101
  </expandable-item>
1102
- `}};C.styles=[At`
1102
+ `}};S.styles=[At`
1103
1103
  :host {
1104
1104
  display: block;
1105
1105
  /*
@@ -1163,7 +1163,7 @@ var ze=Object.defineProperty;var He=Object.getOwnPropertyDescriptor;var n=(o,r,e
1163
1163
  * as all styling is now handled by setting CSS variables below.
1164
1164
  * This makes the component's styling more self-contained.
1165
1165
  */
1166
- `],n([ie({attribute:!1})],C.prototype,"log",2),n([ie({type:Boolean})],C.prototype,"isExpanded",2),n([ie()],C.prototype,"onToggle",2),C=n([jt("single-log")],C);var u=class extends Vt{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:le},{value:"console",label:"Console",title:"Log only to the console",icon:ce},{value:"both",label:"Both",title:"Log to both the control panel and the console",icon:ge},{value:"none",label:"None",title:"Dont log anywhere",icon:de}],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},{value:"deviceStrategyChanged",label:"Strategy Changed",title:"Show strategy 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),G.instance.addEventListener(e,t,{signal:this._abortController?.signal})}removeForesightEventListener(e){let t=this._eventListeners.get(e);t&&(G.instance.removeEventListener(e,t),this._eventListeners.delete(e))}removeAllEventListeners(){this._eventListeners.forEach((e,t)=>{G.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",deviceStrategyChanged:"#9c27b0"}[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(G.instance.getManagerData),(this.logLocation==="controlPanel"||this.logLocation==="both")&&this.addManagerLog())}addManagerLog(){let e=_e(G.instance.getManagerData,(++this.logIdCounter).toString());this.addLog(e)}addEventLog(e){let t=Ie(e,(++this.logIdCounter).toString());if(t.type==="serializationError"){console.error(t.error,t.errorMessage);return}this.addLog(t)}render(){return X`
1166
+ `],n([oe({attribute:!1})],S.prototype,"log",2),n([oe({type:Boolean})],S.prototype,"isExpanded",2),n([oe()],S.prototype,"onToggle",2),S=n([Vt("single-log")],S);var v=class extends jt{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:le},{value:"console",label:"Console",title:"Log only to the console",icon:ce},{value:"both",label:"Both",title:"Log to both the control panel and the console",icon:pe},{value:"none",label:"None",title:"Dont log anywhere",icon:de}],this.filterDropdown=[{value:"elementRegistered",label:"Element Registered",title:"Show element registration events",icon:u},{value:"elementUnregistered",label:"Element Unregistered",title:"Show element unregistration events",icon:u},{value:"elementReactivated",label:"Element Reactivated",title:"Show when element gets reactivated after stale time has passed",icon:u},{value:"callbackInvoked",label:"Callback Invoked",title:"Show callback invoked events",icon:u},{value:"callbackCompleted",label:"Callback Completed",title:"Show callback completed events",icon:u},{value:"mouseTrajectoryUpdate",label:"Mouse Trajectory Update",title:"Show mouse trajectory update events",icon:u},{value:"scrollTrajectoryUpdate",label:"Scroll Trajectory Update",title:"Show scroll trajectory update events",icon:u},{value:"managerSettingsChanged",label:"Manager Settings Changed",title:"Show manager settings change events",icon:u},{value:"deviceStrategyChanged",label:"Strategy Changed",title:"Show strategy change events",icon:u}]}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),K.instance.addEventListener(e,t,{signal:this._abortController?.signal})}removeForesightEventListener(e){let t=this._eventListeners.get(e);t&&(K.instance.removeEventListener(e,t),this._eventListeners.delete(e))}removeAllEventListeners(){this._eventListeners.forEach((e,t)=>{K.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",deviceStrategyChanged:"#9c27b0"}[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(K.instance.getManagerData),(this.logLocation==="controlPanel"||this.logLocation==="both")&&this.addManagerLog())}addManagerLog(){let e=_e(K.instance.getManagerData,(++this.logIdCounter).toString());this.addLog(e)}addEventLog(e){let t=Ie(e,(++this.logIdCounter).toString());if(t.type==="serializationError"){console.error(t.error,t.errorMessage);return}this.addLog(t)}render(){return Z`
1167
1167
  <tab-header>
1168
1168
  <div slot="chips" class="chips-container">
1169
1169
  <chip-element title="Number of logged events (Max ${this.MAX_LOGS})">
@@ -1171,7 +1171,7 @@ var ze=Object.defineProperty;var He=Object.getOwnPropertyDescriptor;var n=(o,r,e
1171
1171
  </chip-element>
1172
1172
  </div>
1173
1173
  <div slot="actions">
1174
- ${this.shouldShowPerformanceWarning()?X`
1174
+ ${this.shouldShowPerformanceWarning()?Z`
1175
1175
  <div
1176
1176
  class="warning-container"
1177
1177
  title="Console logging can be slow with frequent trajectory events.
@@ -1209,7 +1209,7 @@ Consider using 'Control Panel' only for better performance."
1209
1209
  </div>
1210
1210
  </tab-header>
1211
1211
  <tab-content .noContentMessage=${this.noContentMessage} .hasContent=${!!this.logs.length}>
1212
- ${this.logs.length===0?X`<div class="no-items">${this.getNoLogsMessage()}</div>`:Ht(this.logs,e=>X`
1212
+ ${this.logs.length===0?Z`<div class="no-items">${this.getNoLogsMessage()}</div>`:Ht(this.logs,e=>Z`
1213
1213
  <single-log
1214
1214
  .log=${e}
1215
1215
  .isExpanded=${this.expandedLogIds.has(e.logId)}
@@ -1217,7 +1217,7 @@ Consider using 'Control Panel' only for better performance."
1217
1217
  ></single-log>
1218
1218
  `)}
1219
1219
  </tab-content>
1220
- `}};u.styles=[Rt`
1220
+ `}};v.styles=[Rt`
1221
1221
  :host {
1222
1222
  display: flex;
1223
1223
  flex-direction: column;
@@ -1310,7 +1310,7 @@ Consider using 'Control Panel' only for better performance."
1310
1310
  .warning-container:hover svg {
1311
1311
  stroke: #ffdc3e;
1312
1312
  }
1313
- `],n([j()],u.prototype,"logDropdown",2),n([j()],u.prototype,"filterDropdown",2),n([j()],u.prototype,"logLocation",2),n([j()],u.prototype,"eventsEnabled",2),n([j()],u.prototype,"logs",2),n([j()],u.prototype,"expandedLogIds",2),n([zt()],u.prototype,"noContentMessage",2),u=n([Ft("log-tab")],u);import{ForesightManager as ae}from"js.foresight";import{css as bn,html as W,LitElement as vn}from"lit";import{customElement as fn,state as K}from"lit/decorators.js";var oe="points";var Ue="tabs";import{LitElement as qt,html as Yt,css as Jt}from"lit";import{customElement as Xt,property as Z}from"lit/decorators.js";import{LitElement as Bt,html as Gt,css as Wt}from"lit";import{customElement as Kt,property as Ne}from"lit/decorators.js";var I=class extends Bt{constructor(){super(...arguments);this.header="";this.description=""}render(){return Gt`<div class="setting-item">
1313
+ `],n([R()],v.prototype,"logDropdown",2),n([R()],v.prototype,"filterDropdown",2),n([R()],v.prototype,"logLocation",2),n([R()],v.prototype,"eventsEnabled",2),n([R()],v.prototype,"logs",2),n([R()],v.prototype,"expandedLogIds",2),n([zt()],v.prototype,"noContentMessage",2),v=n([Ft("log-tab")],v);import{ForesightManager as ee}from"js.foresight";import{css as bn,html as h,LitElement as vn}from"lit";import{customElement as fn,state as T}from"lit/decorators.js";var ae="points";var Ue="tabs";import{LitElement as qt,html as Yt,css as Jt}from"lit";import{customElement as Xt,property as Q}from"lit/decorators.js";import{LitElement as Bt,html as Gt,css as Wt}from"lit";import{customElement as Kt,property as Ne}from"lit/decorators.js";var P=class extends Bt{constructor(){super(...arguments);this.header="";this.description=""}render(){return Gt`<div class="setting-item">
1314
1314
  <label>
1315
1315
  <span class="setting-header">${this.header}</span>
1316
1316
  <span class="setting-description"> ${this.description} </span>
@@ -1318,7 +1318,7 @@ Consider using 'Control Panel' only for better performance."
1318
1318
  <div class="setting-controls">
1319
1319
  <slot name="controls"></slot>
1320
1320
  </div>
1321
- </div>`}};I.styles=[Wt`
1321
+ </div>`}};P.styles=[Wt`
1322
1322
  .setting-item {
1323
1323
  display: flex;
1324
1324
  align-items: center;
@@ -1350,7 +1350,6 @@ Consider using 'Control Panel' only for better performance."
1350
1350
  font-weight: 500;
1351
1351
  color: #fff;
1352
1352
  font-size: 13px;
1353
- cursor: pointer;
1354
1353
  min-width: 180px;
1355
1354
  }
1356
1355
  .setting-header {
@@ -1358,14 +1357,14 @@ Consider using 'Control Panel' only for better performance."
1358
1357
  color: #fff;
1359
1358
  font-size: 13px;
1360
1359
  }
1361
- `],n([Ne({type:String})],I.prototype,"header",2),n([Ne({type:String})],I.prototype,"description",2),I=n([Kt("setting-item")],I);import{ForesightManager as Zt}from"js.foresight";var w=class extends qt{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 Yt`<setting-item header=${this.header} description=${this.description}>
1360
+ `],n([Ne({type:String})],P.prototype,"header",2),n([Ne({type:String})],P.prototype,"description",2),P=n([Kt("setting-item")],P);import{ForesightManager as Zt}from"js.foresight";var k=class extends qt{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 Yt`<setting-item header=${this.header} description=${this.description}>
1362
1361
  <input
1363
1362
  slot="controls"
1364
1363
  type="checkbox"
1365
1364
  .checked=${this.isChecked}
1366
1365
  @change=${this.handleCheckboxChange}
1367
1366
  />
1368
- </setting-item>`}};w.styles=[Jt`
1367
+ </setting-item>`}};k.styles=[Jt`
1369
1368
  input[type="checkbox"] {
1370
1369
  appearance: none;
1371
1370
  -webkit-appearance: none;
@@ -1408,7 +1407,7 @@ Consider using 'Control Panel' only for better performance."
1408
1407
  input[type="checkbox"]:hover {
1409
1408
  box-shadow: 0 0 0 3px rgba(176, 196, 222, 0.1);
1410
1409
  }
1411
- `],n([Z({type:Boolean})],w.prototype,"isChecked",2),n([Z({type:String})],w.prototype,"header",2),n([Z({type:String})],w.prototype,"description",2),n([Z({type:String})],w.prototype,"setting",2),w=n([Xt("setting-item-checkbox")],w);import{LitElement as Qt,html as en,css as tn}from"lit";import{customElement as nn,property as O,state as on}from"lit/decorators.js";import{ForesightManager as an}from"js.foresight";var p=class extends Qt{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,an.instance.alterGlobalSettings({[this.setting]:i})}}willUpdate(e){super.willUpdate(e),e.has("currentValue")&&(this.displayValue=this.currentValue)}render(){return en`<setting-item header=${this.header} description=${this.description}>
1410
+ `],n([Q({type:Boolean})],k.prototype,"isChecked",2),n([Q({type:String})],k.prototype,"header",2),n([Q({type:String})],k.prototype,"description",2),n([Q({type:String})],k.prototype,"setting",2),k=n([Xt("setting-item-checkbox")],k);import{LitElement as Qt,html as en,css as tn}from"lit";import{customElement as nn,property as U,state as on}from"lit/decorators.js";import{ForesightManager as an}from"js.foresight";var g=class extends Qt{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,an.instance.alterGlobalSettings({[this.setting]:i})}}willUpdate(e){super.willUpdate(e),e.has("currentValue")&&(this.displayValue=this.currentValue)}render(){return en`<setting-item header=${this.header} description=${this.description}>
1412
1411
  <div slot="controls" class="range-wrapper">
1413
1412
  <input
1414
1413
  slot="controls"
@@ -1422,7 +1421,7 @@ Consider using 'Control Panel' only for better performance."
1422
1421
  />
1423
1422
  <span class="setting-range-value">${this.displayValue} ${this.unit}</span>
1424
1423
  </div>
1425
- </setting-item>`}};p.styles=[tn`
1424
+ </setting-item>`}};g.styles=[tn`
1426
1425
  .setting-range-value {
1427
1426
  font-size: 12px;
1428
1427
  color: #b0c4de;
@@ -1491,14 +1490,14 @@ Consider using 'Control Panel' only for better performance."
1491
1490
  transform: scale(1.1);
1492
1491
  box-shadow: 0 0 0 4px rgba(176, 196, 222, 0.2);
1493
1492
  }
1494
- `],n([O({type:Number})],p.prototype,"minValue",2),n([O({type:Number})],p.prototype,"maxValue",2),n([O({type:Number})],p.prototype,"currentValue",2),n([O({type:String})],p.prototype,"unit",2),n([O({type:String})],p.prototype,"header",2),n([O({type:String})],p.prototype,"description",2),n([O({type:String})],p.prototype,"setting",2),n([on()],p.prototype,"displayValue",2),p=n([nn("setting-item-range")],p);var f=class extends vn{constructor(){super();this.changedSettings=[];this.touchDeviceStrategyOptions=[{value:"onTouchStart",label:"On Touch Start",title:"Execute callbacks when user touches registered elements",icon:W`<span>Touch</span>`},{value:"viewport",label:"Viewport Entry",title:"Execute callbacks when registered elements enter the viewport",icon:W`<span>Viewport</span>`},{value:"none",label:"None",title:"Disable touch device prediction",icon:W`<span>None</span>`}];this._abortController=null;this._handleTouchDeviceStrategyChange=e=>{ae.instance.alterGlobalSettings({touchDeviceStrategy:e})};let e=l.instance.devtoolsSettings,t=ae.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;ae.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","touchDeviceStrategy"];for(let i of t){let a=this.initialSettings.manager[i],s=this.managerSettings[i];a!==s&&e.push({setting:i,oldValue:a,newValue:s})}}_checkDevtoolsSettingsChanges(e){let t=["showNameTags"];for(let i of t){let a=this.initialSettings.devtools[i],s=this.devtoolsSettings[i];a!==s&&e.push({setting:i,oldValue:a,newValue:s})}}_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,touchDeviceStrategy:e.touchDeviceStrategy};return`ForesightManager.initialize(${JSON.stringify(t,null,2)})`}render(){if(!this.managerSettings||!this.devtoolsSettings)return W`<tab-content
1493
+ `],n([U({type:Number})],g.prototype,"minValue",2),n([U({type:Number})],g.prototype,"maxValue",2),n([U({type:Number})],g.prototype,"currentValue",2),n([U({type:String})],g.prototype,"unit",2),n([U({type:String})],g.prototype,"header",2),n([U({type:String})],g.prototype,"description",2),n([U({type:String})],g.prototype,"setting",2),n([on()],g.prototype,"displayValue",2),g=n([nn("setting-item-range")],g);var m=class extends vn{constructor(){super();this.changedSettings=[];this.currentCorner="bottom-right";this.touchDeviceStrategyOptions=[{value:"onTouchStart",label:"On Touch Start",title:"Execute callbacks when user touches registered elements",icon:h`<span>Touch</span>`},{value:"viewport",label:"Viewport Entry",title:"Execute callbacks when registered elements enter the viewport",icon:h`<span>Viewport</span>`},{value:"none",label:"None",title:"Disable touch device prediction",icon:h`<span>None</span>`}];this.minimumConnectionTypeOptions=[{value:"slow-2g",label:"Slow 2G",title:"Slow 2G",icon:h`<span>Slow 2G</span>`},{value:"2g",label:"2G",title:"2G",icon:h`<span>2G</span>`},{value:"3g",label:"3G",title:"3G",icon:h`<span>3G</span>`},{value:"4g",label:"4G",title:"4G",icon:h`<span>4G</span>`}];this.cornerOptions=[{value:"top-left",label:"Top Left",title:"Position control panel in top-left corner",icon:h`<span>↖</span>`},{value:"top-right",label:"Top Right",title:"Position control panel in top-right corner",icon:h`<span>↗</span>`},{value:"bottom-left",label:"Bottom Left",title:"Position control panel in bottom-left corner",icon:h`<span>↙</span>`},{value:"bottom-right",label:"Bottom Right",title:"Position control panel in bottom-right corner",icon:h`<span>↘</span>`}];this._abortController=null;this._handleTouchDeviceStrategyChange=e=>{ee.instance.alterGlobalSettings({touchDeviceStrategy:e})};this._handleMinimumConnectionTypeChange=e=>{ee.instance.alterGlobalSettings({minimumConnectionType:e})};this._handleCornerChange=e=>{this.currentCorner=e,this.dispatchEvent(new CustomEvent("corner-change",{detail:{corner:e},bubbles:!0,composed:!0}))};let e=l.instance.devtoolsSettings,t=ee.instance.getManagerData.globalSettings;this.devtoolsSettings=Object.assign({},e),this.managerSettings=Object.assign({},t),this.currentCorner=this.getCurrentCorner(),this.initialSettings={devtools:Object.assign({},e),manager:Object.assign({},t)}}connectedCallback(){super.connectedCallback(),this._abortController=new AbortController;let{signal:e}=this._abortController;ee.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","touchDeviceStrategy","minimumConnectionType"];for(let i of t){let a=this.initialSettings.manager[i],s=this.managerSettings[i];a!==s&&e.push({setting:i,oldValue:a,newValue:s})}}_checkDevtoolsSettingsChanges(e){let t=["showNameTags"];for(let i of t){let a=this.initialSettings.devtools[i],s=this.devtoolsSettings[i];a!==s&&e.push({setting:i,oldValue:a,newValue:s})}}_handleDevtoolsSettingChange(e){let{setting:t,value:i}=e.detail;t==="showNameTags"&&(this.devtoolsSettings={...this.devtoolsSettings,showNameTags:i},l.instance.alterDevtoolsSettings({showNameTags:i}),this._updateChangedSettings())}getCurrentCorner(){try{let e=localStorage.getItem("foresight-devtools-control-panel-corner");if(e&&["top-left","top-right","bottom-left","bottom-right"].includes(e))return e}catch(e){console.warn("ForesightDevtools: Failed to load corner from localStorage:",e)}return"bottom-right"}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,touchDeviceStrategy:e.touchDeviceStrategy,minimumConnectionType:e.minimumConnectionType};return`ForesightManager.initialize(${JSON.stringify(t,null,2)})`}render(){if(!this.managerSettings||!this.devtoolsSettings)return h`<tab-content
1495
1494
  .noContentMessage=${"Loading settings..."}
1496
1495
  .hasContent=${!1}
1497
1496
  ></tab-content>`;let e=this.managerSettings,t=this.changedSettings.length>0?`Settings that have been changed this session compared to your initialized settings.
1498
1497
  Click on the copy icon to easely copy the new setting into your project
1499
1498
 
1500
1499
  `+this.changedSettings.map(i=>`${i.setting}: ${JSON.stringify(i.oldValue)} -> ${JSON.stringify(i.newValue)}`).join(`
1501
- `):"No settings changed from initial values";return W`
1500
+ `):"No settings changed from initial values";return h`
1502
1501
  <tab-header>
1503
1502
  <div slot="chips" class="chips-container">
1504
1503
  <chip-element .title=${t}> ${this.changedSettings.length} changed </chip-element>
@@ -1535,9 +1534,9 @@ Click on the copy icon to easely copy the new setting into your project
1535
1534
  .currentValue=${e.positionHistorySize}
1536
1535
  .maxValue=${30}
1537
1536
  .minValue=${2}
1538
- .unit=${oe}
1537
+ .unit=${ae}
1539
1538
  header="Position History Size"
1540
- description="How far into the future, in ${oe}, to calculate mouse trajectory path"
1539
+ description="How far into the future, in ${ae}, to calculate mouse trajectory path"
1541
1540
  setting="positionHistorySize"
1542
1541
  >
1543
1542
  </setting-item-range>
@@ -1597,6 +1596,21 @@ Click on the copy icon to easely copy the new setting into your project
1597
1596
  </setting-item>
1598
1597
  </div>
1599
1598
 
1599
+ <div class="settings-group">
1600
+ <h4>Minimum Connection</h4>
1601
+ <setting-item
1602
+ header="Minimum Connection Type"
1603
+ description="Minimum connection speed required to register elements"
1604
+ >
1605
+ <single-select-dropdown
1606
+ slot="controls"
1607
+ .dropdownOptions=${this.minimumConnectionTypeOptions}
1608
+ .selectedOptionValue=${e.minimumConnectionType}
1609
+ .onSelectionChange=${this._handleMinimumConnectionTypeChange}
1610
+ ></single-select-dropdown>
1611
+ </setting-item>
1612
+ </div>
1613
+
1600
1614
  <!-- Developer Tools Group -->
1601
1615
  <div class="settings-group">
1602
1616
  <h4>Developer Tools</h4>
@@ -1607,11 +1621,22 @@ Click on the copy icon to easely copy the new setting into your project
1607
1621
  setting="showNameTags"
1608
1622
  @setting-changed=${this._handleDevtoolsSettingChange}
1609
1623
  ></setting-item-checkbox>
1624
+ <setting-item
1625
+ header="Panel Position"
1626
+ description="Choose which corner to position the control panel"
1627
+ >
1628
+ <single-select-dropdown
1629
+ slot="controls"
1630
+ .dropdownOptions=${this.cornerOptions}
1631
+ .selectedOptionValue=${this.currentCorner}
1632
+ .onSelectionChange=${this._handleCornerChange}
1633
+ ></single-select-dropdown>
1634
+ </setting-item>
1610
1635
  </div>
1611
1636
  </div>
1612
1637
  </div>
1613
1638
  </tab-content>
1614
- `}};f.styles=bn`
1639
+ `}};m.styles=bn`
1615
1640
  :host {
1616
1641
  display: flex;
1617
1642
  flex-direction: column;
@@ -1642,11 +1667,11 @@ Click on the copy icon to easely copy the new setting into your project
1642
1667
  border-bottom: 1px solid rgba(176, 196, 222, 0.2);
1643
1668
  padding-bottom: 8px;
1644
1669
  }
1645
- `,n([K()],f.prototype,"managerSettings",2),n([K()],f.prototype,"initialSettings",2),n([K()],f.prototype,"devtoolsSettings",2),n([K()],f.prototype,"changedSettings",2),n([K()],f.prototype,"touchDeviceStrategyOptions",2),f=n([fn("settings-tab")],f);var x=class extends yn{constructor(){super();this.isMinimized=l.instance.devtoolsSettings.isControlPanelDefaultMinimized;this.isTouchDevice=!1;this.isWarningDismissed=!1;this.localStorageSelectedTabKey="foresight-devtools-control-panel-tab";this._abortController=null;this.activeTab=this.getStoredTab(),this.isTouchDevice=Ae.instance.getManagerData.currentDeviceStrategy==="touch"}connectedCallback(){super.connectedCallback(),this._abortController=new AbortController;let{signal:e}=this._abortController;Ae.instance.addEventListener("deviceStrategyChanged",t=>{this.isTouchDevice=t.newStrategy==="touch",t.newStrategy==="touch"&&(this.isWarningDismissed=!1)},{signal:e})}disconnectedCallback(){super.disconnectedCallback(),this._abortController?.abort(),this._abortController=null}getStoredTab(){try{return localStorage.getItem(this.localStorageSelectedTabKey)||"logs"}catch(e){return console.error(e),"logs"}}_handleTabChange(e){this.activeTab=e.detail.tab,this.setStoredTab(this.activeTab)}setStoredTab(e){try{localStorage.setItem(this.localStorageSelectedTabKey,e)}catch(t){console.warn("ForesightDevtools: Failed to save tab preference to localStorage:",t)}}dismissWarning(){this.isWarningDismissed=!0}render(){return xn`
1646
- <div class="control-wrapper ${this.isMinimized?"minimized":""}">
1670
+ `,n([T()],m.prototype,"managerSettings",2),n([T()],m.prototype,"initialSettings",2),n([T()],m.prototype,"devtoolsSettings",2),n([T()],m.prototype,"changedSettings",2),n([T()],m.prototype,"currentCorner",2),n([T()],m.prototype,"touchDeviceStrategyOptions",2),n([T()],m.prototype,"minimumConnectionTypeOptions",2),n([T()],m.prototype,"cornerOptions",2),m=n([fn("settings-tab")],m);var w=class extends yn{constructor(){super();this.isMinimized=l.instance.devtoolsSettings.isControlPanelDefaultMinimized;this.isTouchDevice=!1;this.isWarningDismissed=!1;this.corner="bottom-right";this.localStorageSelectedTabKey="foresight-devtools-control-panel-tab";this.localStorageCornerKey="foresight-devtools-control-panel-corner";this._abortController=null;this.activeTab=this.getStoredTab(),this.corner=this.getStoredCorner(),this.isTouchDevice=Ae.instance.getManagerData.currentDeviceStrategy==="touch"}connectedCallback(){super.connectedCallback(),this._abortController=new AbortController;let{signal:e}=this._abortController;Ae.instance.addEventListener("deviceStrategyChanged",t=>{this.isTouchDevice=t.newStrategy==="touch",t.newStrategy==="touch"&&(this.isWarningDismissed=!1)},{signal:e}),this.addEventListener("corner-change",t=>{this.setCorner(t.detail.corner)},{signal:e})}disconnectedCallback(){super.disconnectedCallback(),this._abortController?.abort(),this._abortController=null}getStoredTab(){try{return localStorage.getItem(this.localStorageSelectedTabKey)||"logs"}catch(e){return console.error(e),"logs"}}getStoredCorner(){try{let e=localStorage.getItem(this.localStorageCornerKey);if(e)return e}catch(e){console.error("ForesightDevtools: Failed to load corner from localStorage:",e)}return"bottom-right"}_handleTabChange(e){this.activeTab=e.detail.tab,this.setStoredTab(this.activeTab)}setStoredTab(e){try{localStorage.setItem(this.localStorageSelectedTabKey,e)}catch(t){console.warn("ForesightDevtools: Failed to save tab preference to localStorage:",t)}}setStoredCorner(e){try{localStorage.setItem(this.localStorageCornerKey,e)}catch(t){console.warn("ForesightDevtools: Failed to save corner to localStorage:",t)}}dismissWarning(){this.isWarningDismissed=!0}setCorner(e){this.corner=e,this.setStoredCorner(this.corner),this.requestUpdate()}handleMinimizeClick(e){e.stopPropagation(),this.isMinimized=!this.isMinimized}getMinimizeSymbol(){return this.isMinimized?"+":"\u2212"}render(){return xn`
1671
+ <div class="control-wrapper ${this.corner} ${this.isMinimized?"minimized":""}">
1647
1672
  <div class="title-wrapper">
1648
- <button @click="${()=>this.isMinimized=!this.isMinimized}" class="minimize-button">
1649
- -
1673
+ <button @click="${this.handleMinimizeClick}" class="minimize-button">
1674
+ ${this.getMinimizeSymbol()}
1650
1675
  </button>
1651
1676
  <h1>Foresight DevTools</h1>
1652
1677
  <div></div>
@@ -1679,12 +1704,11 @@ Click on the copy icon to easely copy the new setting into your project
1679
1704
  </div>
1680
1705
  </div>
1681
1706
  </div>
1682
- `}};x.styles=wn`
1707
+ `}};w.styles=wn`
1683
1708
  .control-wrapper {
1709
+ --panel-offset: 10px;
1684
1710
  padding: 12px;
1685
1711
  position: fixed;
1686
- bottom: 10px;
1687
- right: 10px;
1688
1712
  background-color: rgba(0, 0, 0, 0.9);
1689
1713
  color: white;
1690
1714
  font-family: Arial, sans-serif;
@@ -1697,7 +1721,27 @@ Click on the copy icon to easely copy the new setting into your project
1697
1721
  height: 450px;
1698
1722
  transition: width 0.3s ease, height 0.3s ease;
1699
1723
  box-sizing: border-box;
1724
+ border-radius: 8px;
1725
+ box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
1700
1726
  }
1727
+
1728
+ .control-wrapper.top-left {
1729
+ top: var(--panel-offset);
1730
+ left: var(--panel-offset);
1731
+ }
1732
+ .control-wrapper.top-right {
1733
+ top: var(--panel-offset);
1734
+ right: var(--panel-offset);
1735
+ }
1736
+ .control-wrapper.bottom-left {
1737
+ bottom: var(--panel-offset);
1738
+ left: var(--panel-offset);
1739
+ }
1740
+ .control-wrapper.bottom-right {
1741
+ bottom: var(--panel-offset);
1742
+ right: var(--panel-offset);
1743
+ }
1744
+
1701
1745
  .control-wrapper.minimized {
1702
1746
  width: 230px;
1703
1747
  height: 45px;
@@ -1798,7 +1842,7 @@ Click on the copy icon to easely copy the new setting into your project
1798
1842
  .dismiss-button:hover {
1799
1843
  opacity: 0.7;
1800
1844
  }
1801
- `,n([Q()],x.prototype,"activeTab",2),n([Q()],x.prototype,"isMinimized",2),n([Q()],x.prototype,"isTouchDevice",2),n([Q()],x.prototype,"isWarningDismissed",2),x=n([kn("control-panel")],x);import{LitElement as jn,css as Vn,html as Ve}from"lit";import{customElement as Rn,state as Fn}from"lit/decorators.js";import{LitElement as En,html as Cn,css as Sn}from"lit";import{customElement as Tn,state as je,query as Dn}from"lit/decorators.js";import{ForesightManager as V}from"js.foresight";var S=class extends En{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:s}=t.elementBounds,d=s.right-s.left,q=s.bottom-s.top;i.style.width=`${d}px`,i.style.height=`${q}px`,i.style.transform=`translate3d(${s.left}px, ${s.top}px, 0)`,l.instance.devtoolsSettings.showNameTags?(a.textContent=t.name,a.style.display="block",a.style.transform=`translate3d(${s.left}px, ${s.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;case"touch":break;case"viewport":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> `}};S.styles=[Sn`
1845
+ `,n([q()],w.prototype,"activeTab",2),n([q()],w.prototype,"isMinimized",2),n([q()],w.prototype,"isTouchDevice",2),n([q()],w.prototype,"isWarningDismissed",2),n([q()],w.prototype,"corner",2),w=n([kn("control-panel")],w);import{LitElement as Vn,css as jn,html as je}from"lit";import{customElement as Rn,state as Fn}from"lit/decorators.js";import{LitElement as Cn,html as En,css as Sn}from"lit";import{customElement as Tn,state as Ve,query as Dn}from"lit/decorators.js";import{ForesightManager as F}from"js.foresight";var D=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;F.instance.addEventListener("elementRegistered",t=>{t.elementData.isIntersectingWithViewport&&this.createOrUpdateElementOverlay(t.elementData)},{signal:e}),F.instance.addEventListener("elementUnregistered",t=>{this.removeElementOverlay(t.elementData)},{signal:e}),F.instance.addEventListener("elementReactivated",t=>{t.elementData.isIntersectingWithViewport&&this.createOrUpdateElementOverlay(t.elementData)},{signal:e}),F.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}),F.instance.addEventListener("callbackInvoked",t=>{this.highlightElementCallback(t.elementData,t.hitType)},{signal:e}),F.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:s}=t.elementBounds,d=s.right-s.left,Y=s.bottom-s.top;i.style.width=`${d}px`,i.style.height=`${Y}px`,i.style.transform=`translate3d(${s.left}px, ${s.top}px, 0)`,l.instance.devtoolsSettings.showNameTags?(a.textContent=t.name,a.style.display="block",a.style.transform=`translate3d(${s.left}px, ${s.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;case"touch":break;case"viewport":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 En` <div id="overlays-container"></div> `}};D.styles=[Sn`
1802
1846
  :host {
1803
1847
  position: fixed;
1804
1848
  top: 0;
@@ -1865,7 +1909,7 @@ Click on the copy icon to easely copy the new setting into your project
1865
1909
  white-space: nowrap;
1866
1910
  pointer-events: none;
1867
1911
  }
1868
- `],n([je()],S.prototype,"overlayMap",2),n([je()],S.prototype,"callbackAnimations",2),n([Dn("#overlays-container")],S.prototype,"containerElement",2),S=n([Tn("element-overlays")],S);import{LitElement as Mn,html as Ln,css as $n}from"lit";import{customElement as _n,state as se}from"lit/decorators.js";import{styleMap as In}from"lit/directives/style-map.js";import{ForesightManager as R}from"js.foresight";var T=class extends Mn{constructor(){super(...arguments);this._abortController=new AbortController;this._mousePredictionIsEnabled=R.instance.getManagerData.globalSettings.enableMousePrediction;this._isVisible=!1;this._trajectoryStyles={};this.handleTrajectoryReset=e=>{("wasLastActiveElement"in e&&e.wasLastActiveElement||"wasLastRegisteredElement"in e&&e.wasLastRegisteredElement)&&(this._isVisible=!1,this._trajectoryStyles={transform:"translate3d(0px, 0px, 0) rotate(0deg)",width:"0px"})};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,s=i.y-t.y,d=Math.sqrt(a*a+s*s),q=Math.atan2(s,a)*57.29577951308232;this._trajectoryStyles={transform:`translate3d(${t.x}px, ${t.y}px, 0) rotate(${q}deg)`,width:`${d}px`}}}connectedCallback(){super.connectedCallback();let{signal:e}=this._abortController;R.instance.addEventListener("callbackCompleted",this.handleTrajectoryReset,{signal:e}),R.instance.addEventListener("elementUnregistered",this.handleTrajectoryReset,{signal:e}),R.instance.addEventListener("mouseTrajectoryUpdate",this.handleTrajectoryUpdate,{signal:e}),R.instance.addEventListener("scrollTrajectoryUpdate",()=>{this._isVisible=!1},{signal:e}),R.instance.addEventListener("managerSettingsChanged",this.handleSettingsChange,{signal:e})}disconnectedCallback(){super.disconnectedCallback(),this._abortController.abort()}render(){let e={display:this._isVisible?"block":"none",...this._trajectoryStyles};return Ln` <div class="trajectory-line" style=${In(e)}></div> `}};T.styles=[$n`
1912
+ `],n([Ve()],D.prototype,"overlayMap",2),n([Ve()],D.prototype,"callbackAnimations",2),n([Dn("#overlays-container")],D.prototype,"containerElement",2),D=n([Tn("element-overlays")],D);import{LitElement as Mn,html as Ln,css as $n}from"lit";import{customElement as _n,state as se}from"lit/decorators.js";import{styleMap as In}from"lit/directives/style-map.js";import{ForesightManager as z}from"js.foresight";var M=class extends Mn{constructor(){super(...arguments);this._abortController=new AbortController;this._mousePredictionIsEnabled=z.instance.getManagerData.globalSettings.enableMousePrediction;this._isVisible=!1;this._trajectoryStyles={};this.handleTrajectoryReset=e=>{("wasLastActiveElement"in e&&e.wasLastActiveElement||"wasLastRegisteredElement"in e&&e.wasLastRegisteredElement)&&(this._isVisible=!1,this._trajectoryStyles={transform:"translate3d(0px, 0px, 0) rotate(0deg)",width:"0px"})};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,s=i.y-t.y,d=Math.sqrt(a*a+s*s),Y=Math.atan2(s,a)*57.29577951308232;this._trajectoryStyles={transform:`translate3d(${t.x}px, ${t.y}px, 0) rotate(${Y}deg)`,width:`${d}px`}}}connectedCallback(){super.connectedCallback();let{signal:e}=this._abortController;z.instance.addEventListener("callbackCompleted",this.handleTrajectoryReset,{signal:e}),z.instance.addEventListener("elementUnregistered",this.handleTrajectoryReset,{signal:e}),z.instance.addEventListener("mouseTrajectoryUpdate",this.handleTrajectoryUpdate,{signal:e}),z.instance.addEventListener("scrollTrajectoryUpdate",()=>{this._isVisible=!1},{signal:e}),z.instance.addEventListener("managerSettingsChanged",this.handleSettingsChange,{signal:e})}disconnectedCallback(){super.disconnectedCallback(),this._abortController.abort()}render(){let e={display:this._isVisible?"block":"none",...this._trajectoryStyles};return Ln` <div class="trajectory-line" style=${In(e)}></div> `}};M.styles=[$n`
1869
1913
  :host {
1870
1914
  display: block;
1871
1915
  }
@@ -1896,7 +1940,7 @@ Click on the copy icon to easely copy the new setting into your project
1896
1940
  border-bottom: 4px solid transparent;
1897
1941
  filter: drop-shadow(0 0 6px rgba(59, 130, 246, 0.6));
1898
1942
  }
1899
- `],n([se()],T.prototype,"_mousePredictionIsEnabled",2),n([se()],T.prototype,"_isVisible",2),n([se()],T.prototype,"_trajectoryStyles",2),T=n([_n("mouse-trajectory")],T);import{LitElement as On,html as Pn,css as Un}from"lit";import{customElement as Nn,state as ee}from"lit/decorators.js";import{styleMap as An}from"lit/directives/style-map.js";import{ForesightManager as P}from"js.foresight";var k=class extends On{constructor(){super(...arguments);this._abortController=new AbortController;this._scrollPredictionIsEnabled=P.instance.getManagerData.globalSettings.enableScrollPrediction;this._scrollMargin=P.instance.getManagerData.globalSettings.scrollMargin;this._isVisible=!1;this._trajectoryStyles={};this._isUpdateScheduled=!1;this._latestScrollTrajectory=null;this.handleTrajectoryReset=e=>{("wasLastActiveElement"in e&&e.wasLastActiveElement||"wasLastRegisteredElement"in e&&e.wasLastRegisteredElement)&&(this._isVisible=!1,this._trajectoryStyles={transform:"translate(0px, 0px) rotate(0deg)"})};this.handleSettingsChange=e=>{let t=e.managerData.globalSettings.enableScrollPrediction;this._scrollPredictionIsEnabled=t,t||(this._isVisible=!1);let i=e.updatedSettings.find(a=>a.setting==="scrollMargin");i&&(this._scrollMargin=i.newValue)};this.handleScrollUpdate=e=>{this._scrollPredictionIsEnabled&&(this._isVisible=!0,this._latestScrollTrajectory={currentPoint:e.currentPoint,predictedPoint:e.predictedPoint},this._isUpdateScheduled||(this._isUpdateScheduled=!0,requestAnimationFrame(this.renderScrollTrajectory)))};this.renderScrollTrajectory=()=>{if(!this._latestScrollTrajectory){this._isUpdateScheduled=!1;return}let{currentPoint:e,predictedPoint:t}=this._latestScrollTrajectory,i=t.x-e.x,a=t.y-e.y,s=Math.atan2(a,i)*180/Math.PI;this._trajectoryStyles={transform:`translate(${e.x}px, ${e.y}px) rotate(${s}deg)`},this._isUpdateScheduled=!1,this.requestUpdate()}}connectedCallback(){super.connectedCallback();let{signal:e}=this._abortController;P.instance.addEventListener("scrollTrajectoryUpdate",this.handleScrollUpdate,{signal:e}),P.instance.addEventListener("mouseTrajectoryUpdate",()=>{this._isVisible=!1},{signal:e}),P.instance.addEventListener("callbackCompleted",this.handleTrajectoryReset,{signal:e}),P.instance.addEventListener("elementUnregistered",this.handleTrajectoryReset,{signal:e}),P.instance.addEventListener("managerSettingsChanged",this.handleSettingsChange,{signal:e})}disconnectedCallback(){super.disconnectedCallback(),this._abortController.abort()}render(){let e={display:this._isVisible?"block":"none",width:`${this._scrollMargin}px`,...this._trajectoryStyles};return Pn` <div class="scroll-trajectory-line" style=${An(e)}></div> `}};k.styles=[Un`
1943
+ `],n([se()],M.prototype,"_mousePredictionIsEnabled",2),n([se()],M.prototype,"_isVisible",2),n([se()],M.prototype,"_trajectoryStyles",2),M=n([_n("mouse-trajectory")],M);import{LitElement as On,html as Pn,css as Un}from"lit";import{customElement as Nn,state as te}from"lit/decorators.js";import{styleMap as An}from"lit/directives/style-map.js";import{ForesightManager as N}from"js.foresight";var C=class extends On{constructor(){super(...arguments);this._abortController=new AbortController;this._scrollPredictionIsEnabled=N.instance.getManagerData.globalSettings.enableScrollPrediction;this._scrollMargin=N.instance.getManagerData.globalSettings.scrollMargin;this._isVisible=!1;this._trajectoryStyles={};this._isUpdateScheduled=!1;this._latestScrollTrajectory=null;this.handleTrajectoryReset=e=>{("wasLastActiveElement"in e&&e.wasLastActiveElement||"wasLastRegisteredElement"in e&&e.wasLastRegisteredElement)&&(this._isVisible=!1,this._trajectoryStyles={transform:"translate(0px, 0px) rotate(0deg)"})};this.handleSettingsChange=e=>{let t=e.managerData.globalSettings.enableScrollPrediction;this._scrollPredictionIsEnabled=t,t||(this._isVisible=!1);let i=e.updatedSettings.find(a=>a.setting==="scrollMargin");i&&(this._scrollMargin=i.newValue)};this.handleScrollUpdate=e=>{this._scrollPredictionIsEnabled&&(this._isVisible=!0,this._latestScrollTrajectory={currentPoint:e.currentPoint,predictedPoint:e.predictedPoint},this._isUpdateScheduled||(this._isUpdateScheduled=!0,requestAnimationFrame(this.renderScrollTrajectory)))};this.renderScrollTrajectory=()=>{if(!this._latestScrollTrajectory){this._isUpdateScheduled=!1;return}let{currentPoint:e,predictedPoint:t}=this._latestScrollTrajectory,i=t.x-e.x,a=t.y-e.y,s=Math.atan2(a,i)*180/Math.PI;this._trajectoryStyles={transform:`translate(${e.x}px, ${e.y}px) rotate(${s}deg)`},this._isUpdateScheduled=!1,this.requestUpdate()}}connectedCallback(){super.connectedCallback();let{signal:e}=this._abortController;N.instance.addEventListener("scrollTrajectoryUpdate",this.handleScrollUpdate,{signal:e}),N.instance.addEventListener("mouseTrajectoryUpdate",()=>{this._isVisible=!1},{signal:e}),N.instance.addEventListener("callbackCompleted",this.handleTrajectoryReset,{signal:e}),N.instance.addEventListener("elementUnregistered",this.handleTrajectoryReset,{signal:e}),N.instance.addEventListener("managerSettingsChanged",this.handleSettingsChange,{signal:e})}disconnectedCallback(){super.disconnectedCallback(),this._abortController.abort()}render(){let e={display:this._isVisible?"block":"none",width:`${this._scrollMargin}px`,...this._trajectoryStyles};return Pn` <div class="scroll-trajectory-line" style=${An(e)}></div> `}};C.styles=[Un`
1900
1944
  :host {
1901
1945
  display: block;
1902
1946
  }
@@ -1956,15 +2000,15 @@ Click on the copy icon to easely copy the new setting into your project
1956
2000
  filter: drop-shadow(0 0 12px rgba(234, 179, 8, 0.8));
1957
2001
  }
1958
2002
  }
1959
- `],n([ee()],k.prototype,"_scrollPredictionIsEnabled",2),n([ee()],k.prototype,"_scrollMargin",2),n([ee()],k.prototype,"_isVisible",2),n([ee()],k.prototype,"_trajectoryStyles",2),k=n([Nn("scroll-trajectory")],k);import{ForesightManager as Re}from"js.foresight";var F=class extends jn{constructor(){super(...arguments);this._abortController=null;this._strategy=Re.instance.getManagerData.currentDeviceStrategy;this.handleDeviceStrategyChange=e=>this._strategy=e.newStrategy}connectedCallback(){super.connectedCallback(),this._abortController=new AbortController;let{signal:e}=this._abortController;Re.instance.addEventListener("deviceStrategyChanged",this.handleDeviceStrategyChange,{signal:e})}disconnectedCallback(){super.disconnectedCallback(),this._abortController?.abort()}render(){return Ve`
2003
+ `],n([te()],C.prototype,"_scrollPredictionIsEnabled",2),n([te()],C.prototype,"_scrollMargin",2),n([te()],C.prototype,"_isVisible",2),n([te()],C.prototype,"_trajectoryStyles",2),C=n([Nn("scroll-trajectory")],C);import{ForesightManager as Re}from"js.foresight";var H=class extends Vn{constructor(){super(...arguments);this._abortController=null;this._strategy=Re.instance.getManagerData.currentDeviceStrategy;this.handleDeviceStrategyChange=e=>this._strategy=e.newStrategy}connectedCallback(){super.connectedCallback(),this._abortController=new AbortController;let{signal:e}=this._abortController;Re.instance.addEventListener("deviceStrategyChanged",this.handleDeviceStrategyChange,{signal:e})}disconnectedCallback(){super.disconnectedCallback(),this._abortController?.abort()}render(){return je`
1960
2004
  <div id="overlay-container">
1961
- ${this._strategy==="mouse"?Ve`
2005
+ ${this._strategy==="mouse"?je`
1962
2006
  <mouse-trajectory></mouse-trajectory>
1963
2007
  <scroll-trajectory></scroll-trajectory>
1964
2008
  <element-overlays></element-overlays>
1965
2009
  `:""}
1966
2010
  </div>
1967
- `}};F.styles=[Vn`
2011
+ `}};H.styles=[jn`
1968
2012
  :host {
1969
2013
  display: block;
1970
2014
  }
@@ -1975,7 +2019,7 @@ Click on the copy icon to easely copy the new setting into your project
1975
2019
  pointer-events: none;
1976
2020
  z-index: 9999;
1977
2021
  }
1978
- `],n([Fn()],F.prototype,"_strategy",2),F=n([Rn("debug-overlay")],F);var l=class extends zn{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,deviceStrategyChanged:!0}}}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),this.updateLoggingSetting("deviceStrategyChanged",e.logging.deviceStrategyChanged)))}cleanup(){this.requestUpdate()}render(){return!this.isInitialized||!this.devtoolsSettings.showDebugger?Fe``:Fe`<control-panel></control-panel> <debug-overlay></debug-overlay>`}};l.styles=[Hn`
2022
+ `],n([Fn()],H.prototype,"_strategy",2),H=n([Rn("debug-overlay")],H);var l=class extends zn{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,deviceStrategyChanged:!0}}}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),this.updateLoggingSetting("deviceStrategyChanged",e.logging.deviceStrategyChanged)))}cleanup(){this.requestUpdate()}render(){return!this.isInitialized||!this.devtoolsSettings.showDebugger?Fe``:Fe`<control-panel></control-panel> <debug-overlay></debug-overlay>`}};l.styles=[Hn`
1979
2023
  :host {
1980
2024
  display: block;
1981
2025
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "js.foresight-devtools",
3
- "version": "1.3.1",
3
+ "version": "1.3.2",
4
4
  "description": "Visual debugging tools for ForesightJS - mouse trajectory prediction and element interaction visualization",
5
5
  "type": "module",
6
6
  "main": "./dist/index.js",
@@ -37,15 +37,15 @@
37
37
  "llms": "https://foresightjs.com/llms.txt",
38
38
  "llmsFull": "https://foresightjs.com/llms-full.txt",
39
39
  "peerDependencies": {
40
- "js.foresight": "^3.3.0"
40
+ "js.foresight": "^3.3.2"
41
41
  },
42
42
  "devDependencies": {
43
- "@types/node": "^24.1.0",
43
+ "@types/node": "^24.3.0",
44
44
  "tslib": "^2.8.1",
45
45
  "tsup": "^8.5.0",
46
46
  "typescript": "^5.9.2",
47
47
  "vitest": "^3.2.4",
48
- "js.foresight": "3.3.0"
48
+ "js.foresight": "3.3.2"
49
49
  },
50
50
  "dependencies": {
51
51
  "@thednp/position-observer": "^1.1.0",