js.foresight-devtools 1.0.2 → 1.0.3

package/dist/index.mjs

@@ -1,4 +1,4 @@
-var $e=Object.defineProperty;var Ie=Object.getOwnPropertyDescriptor;var i=(n,s,e,t)=>{for(var o=t>1?void 0:t?Ie(s,e):s,a=n.length-1,r;a>=0;a--)(r=n[a])&&(o=(t?r(s,e,o):r(o))||o);return t&&o&&$e(s,e,o),o};import{LitElement as Si,css as Ti,html as Oe}from"lit";import{customElement as Mi,state as _i}from"lit/decorators.js";import{LitElement as ii,css as oi,html as ni}from"lit";import{customElement as si,state as W}from"lit/decorators.js";import{classMap as Q}from"lit/directives/class-map.js";import{css as dt,html as fe,LitElement as ct}from"lit";import{customElement as pt,state as f}from"lit/decorators.js";import{map as gt}from"lit/directives/map.js";import{LitElement as Pe,html as Ue,css as Ne}from"lit";import{customElement as je}from"lit/decorators.js";var j=class extends Pe{render(){return Ue`
+var Ue=Object.defineProperty;var Pe=Object.getOwnPropertyDescriptor;var i=(n,s,e,t)=>{for(var o=t>1?void 0:t?Pe(s,e):s,a=n.length-1,r;a>=0;a--)(r=n[a])&&(o=(t?r(s,e,o):r(o))||o);return t&&o&&Ue(s,e,o),o};import{LitElement as Ti,css as Mi,html as Ie}from"lit";import{customElement as Di,state as _i}from"lit/decorators.js";import{LitElement as ni,css as si,html as ai}from"lit";import{customElement as ri,state as q}from"lit/decorators.js";import{classMap as Q}from"lit/directives/class-map.js";import{css as pt,html as we,LitElement as gt}from"lit";import{customElement as ht,state as y}from"lit/decorators.js";import{map as mt}from"lit/directives/map.js";import{LitElement as Ne,html as je,css as Ve}from"lit";import{customElement as Fe}from"lit/decorators.js";var j=class extends Ne{render(){return je`
       <div class="tab-bar-elements">
         <div class="tab-bar-info">
           <div class="stats-chips">
@@ -9,7 +9,7 @@ var $e=Object.defineProperty;var Ie=Object.getOwnPropertyDescriptor;var i=(n,s,e
           <slot name="actions"></slot>
         </div>
       </div>
-    `}};j.styles=[Ne`
+    `}};j.styles=[Ve`
       :host {
       }
       .tab-bar-info {
@@ -53,11 +53,11 @@ var $e=Object.defineProperty;var Ie=Object.getOwnPropertyDescriptor;var i=(n,s,e
         z-index: 5;
         min-height: 36px;
       }
-    `],j=i([je("tab-header")],j);import{LitElement as Ve,html as q,css as Fe}from"lit";import{customElement as ze,property as ie}from"lit/decorators.js";var T=class extends Ve{constructor(){super(...arguments);this.noContentMessage="No content available.";this.hasContent=!0}render(){return q`
+    `],j=i([Fe("tab-header")],j);import{LitElement as ze,html as K,css as Re}from"lit";import{customElement as Ae,property as ne}from"lit/decorators.js";var T=class extends ze{constructor(){super(...arguments);this.noContentMessage="No content available.";this.hasContent=!0}render(){return K`
       <div class="content-container">
-        ${this.hasContent?q`<slot></slot>`:q`<div class="no-content-message">${this.noContentMessage}</div>`}
+        ${this.hasContent?K`<slot></slot>`:K`<div class="no-content-message">${this.noContentMessage}</div>`}
       </div>
-    `}};T.styles=[Fe`
+    `}};T.styles=[Re`
       :host {
         overflow: hidden;
       }
@@ -96,7 +96,7 @@ var $e=Object.defineProperty;var Ie=Object.getOwnPropertyDescriptor;var i=(n,s,e
         font-style: italic;
         font-family: "Courier New", monospace;
       }
-    `],i([ie({type:String,attribute:"no-content-message"})],T.prototype,"noContentMessage",2),i([ie({type:Boolean})],T.prototype,"hasContent",2),T=i([ze("tab-content")],T);import{html as Ge}from"lit";import{customElement as We,property as ne}from"lit/decorators.js";import{LitElement as Re,html as oe,css as Ae}from"lit";import{property as He,state as Be}from"lit/decorators.js";var d=class d extends Re{constructor(){super(...arguments);this.isDropdownOpen=!1;this.dropdownOptions=[];this._toggleDropdown=e=>{e.stopPropagation(),this.isDropdownOpen?this._closeDropdown():(d.currentlyOpen&&d.currentlyOpen!==this&&d.currentlyOpen._closeDropdown(),this.isDropdownOpen=!0,d.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),d.currentlyOpen===this&&(d.currentlyOpen=null)}_closeDropdown(){this.isDropdownOpen=!1,d.currentlyOpen===this&&(d.currentlyOpen=null)}_positionDropdown(){let e=this.shadowRoot?.querySelector(".trigger-button"),t=this.shadowRoot?.querySelector(".dropdown-menu");if(e&&t){let o=e.getBoundingClientRect(),a=t.offsetHeight||200,r=o.bottom+5,N=window.innerWidth-o.right;window.innerHeight-o.bottom<a&&o.top>a?t.style.top=`${o.top-a-5}px`:t.style.top=`${r}px`,t.style.right=`${N}px`}}render(){let e=`trigger-button ${this.isDropdownOpen?"active":""}`,t=`dropdown-menu ${this.isDropdownOpen?"active":""}`;return oe`
+    `],i([ne({type:String,attribute:"no-content-message"})],T.prototype,"noContentMessage",2),i([ne({type:Boolean})],T.prototype,"hasContent",2),T=i([Ae("tab-content")],T);import{html as We}from"lit";import{customElement as Ye,property as ae}from"lit/decorators.js";import{LitElement as He,html as se,css as Be}from"lit";import{property as Ge,state as qe}from"lit/decorators.js";var d=class d extends He{constructor(){super(...arguments);this.isDropdownOpen=!1;this.dropdownOptions=[];this._toggleDropdown=e=>{e.stopPropagation(),this.isDropdownOpen?this._closeDropdown():(d.currentlyOpen&&d.currentlyOpen!==this&&d.currentlyOpen._closeDropdown(),this.isDropdownOpen=!0,d.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),d.currentlyOpen===this&&(d.currentlyOpen=null)}_closeDropdown(){this.isDropdownOpen=!1,d.currentlyOpen===this&&(d.currentlyOpen=null)}_positionDropdown(){let e=this.shadowRoot?.querySelector(".trigger-button"),t=this.shadowRoot?.querySelector(".dropdown-menu");if(e&&t){let o=e.getBoundingClientRect(),a=t.offsetHeight||200,r=o.bottom+5,N=window.innerWidth-o.right;window.innerHeight-o.bottom<a&&o.top>a?t.style.top=`${o.top-a-5}px`:t.style.top=`${r}px`,t.style.right=`${N}px`}}render(){let e=`trigger-button ${this.isDropdownOpen?"active":""}`,t=`dropdown-menu ${this.isDropdownOpen?"active":""}`;return se`
       <div class="dropdown-container">
         <button
           class="${e}"
@@ -122,7 +122,7 @@ var $e=Object.defineProperty;var Ie=Object.getOwnPropertyDescriptor;var i=(n,s,e
         </button>
 
         <div class="${t}" id="dropdown-menu" role="menu">
-          ${this.dropdownOptions.map(o=>oe`
+          ${this.dropdownOptions.map(o=>se`
               <button
                 value="${o.value}"
                 title="${o.title}"
@@ -135,7 +135,7 @@ var $e=Object.defineProperty;var Ie=Object.getOwnPropertyDescriptor;var i=(n,s,e
             `)}
         </div>
       </div>
-    `}};d.currentlyOpen=null,d.styles=[Ae`
+    `}};d.currentlyOpen=null,d.styles=[Be`
       :host {
         display: inline-block;
       }
@@ -250,11 +250,11 @@ var $e=Object.defineProperty;var Ie=Object.getOwnPropertyDescriptor;var i=(n,s,e
         color: #b0c4de;
         font-weight: bold;
       }
-    `],i([Be()],d.prototype,"isDropdownOpen",2),i([He({type:Array})],d.prototype,"dropdownOptions",2);var M=d;var O=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:Ge``}_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)}};i([ne({type:String})],O.prototype,"selectedOptionValue",2),i([ne({type:Function})],O.prototype,"onSelectionChange",2),O=i([We("single-select-dropdown")],O);import{LitElement as Ye,html as Ke,css as qe}from"lit";import{customElement as Je,property as Xe}from"lit/decorators.js";var $=class extends Ye{constructor(){super(...arguments);this.title=""}render(){return Ke`
+    `],i([qe()],d.prototype,"isDropdownOpen",2),i([Ge({type:Array})],d.prototype,"dropdownOptions",2);var M=d;var $=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:We``}_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)}};i([ae({type:String})],$.prototype,"selectedOptionValue",2),i([ae({type:Function})],$.prototype,"onSelectionChange",2),$=i([Ye("single-select-dropdown")],$);import{LitElement as Ke,html as Je,css as Xe}from"lit";import{customElement as Ze,property as Qe}from"lit/decorators.js";var O=class extends Ke{constructor(){super(...arguments);this.title=""}render(){return Je`
       <span class="chip" title="${this.title}">
         <slot></slot>
       </span>
-    `}};$.styles=[qe`
+    `}};O.styles=[Xe`
       :host {
         display: inline-block;
       }
@@ -274,7 +274,7 @@ var $e=Object.defineProperty;var Ie=Object.getOwnPropertyDescriptor;var i=(n,s,e
         line-height: 1.2;
         transition: all 0.2s ease;
       }
-    `],i([Xe({type:String})],$.prototype,"title",2),$=i([Je("chip-element")],$);import{LitElement as st,html as at,css as rt}from"lit";import{customElement as lt,property as A}from"lit/decorators.js";import{LitElement as it,html as ye,css as ot}from"lit";import{customElement as nt,property as V}from"lit/decorators.js";import{LitElement as Ze,html as Qe,css as et}from"lit";import{customElement as tt,property as be,state as ve}from"lit/decorators.js";import{html as g}from"lit";var se=g`
+    `],i([Qe({type:String})],O.prototype,"title",2),O=i([Ze("chip-element")],O);import{LitElement as rt,html as lt,css as dt}from"lit";import{customElement as ct,property as A}from"lit/decorators.js";import{LitElement as nt,html as xe,css as st}from"lit";import{customElement as at,property as V}from"lit/decorators.js";import{LitElement as et,html as tt,css as it}from"lit";import{customElement as ot,property as fe,state as ye}from"lit/decorators.js";import{html as g}from"lit";var re=g`
   <svg
     xmlns="http://www.w3.org/2000/svg"
     width="16"
@@ -291,7 +291,7 @@ var $e=Object.defineProperty;var Ie=Object.getOwnPropertyDescriptor;var i=(n,s,e
     <line x1="7" y1="21" x2="17" y2="21"></line>
     <line x1="12" y1="17" x2="12" y2="21"></line>
   </svg>
-`,ae=g`
+`,le=g`
   <svg
     xmlns="http://www.w3.org/2000/svg"
     width="16"
@@ -306,7 +306,7 @@ var $e=Object.defineProperty;var Ie=Object.getOwnPropertyDescriptor;var i=(n,s,e
     <polyline points="4 17 10 11 4 5"></polyline>
     <line x1="12" y1="19" x2="20" y2="19"></line>
   </svg>
-`,re=g`
+`,de=g`
   <svg
     xmlns="http://www.w3.org/2000/svg"
     width="16"
@@ -322,7 +322,7 @@ var $e=Object.defineProperty;var Ie=Object.getOwnPropertyDescriptor;var i=(n,s,e
     <path d="M13.73 21a2 2 0 0 1-3.46 0"></path>
     <line x1="1" y1="1" x2="23" y2="23"></line>
   </svg>
-`,le=g`
+`,ce=g`
   <svg
     xmlns="http://www.w3.org/2000/svg"
     width="16"
@@ -340,7 +340,7 @@ var $e=Object.defineProperty;var Ie=Object.getOwnPropertyDescriptor;var i=(n,s,e
     <circle cx="6" cy="18" r="2" />
     <circle cx="18" cy="18" r="2" />
   </svg>
-`,de=g`
+`,pe=g`
   <svg
     xmlns="http://www.w3.org/2000/svg"
     width="16"
@@ -355,7 +355,7 @@ var $e=Object.defineProperty;var Ie=Object.getOwnPropertyDescriptor;var i=(n,s,e
     <path d="M2 12s3-7 10-7 10 7 10 7-3 7-10 7-10-7-10-7Z" />
     <circle cx="12" cy="12" r="3" />
   </svg>
-`,ce=g`
+`,ge=g`
   <svg
     xmlns="http://www.w3.org/2000/svg"
     width="16"
@@ -373,7 +373,7 @@ var $e=Object.defineProperty;var Ie=Object.getOwnPropertyDescriptor;var i=(n,s,e
     <line x1="16" y1="17" x2="8" y2="17" />
     <line x1="10" y1="9" x2="8" y2="9" />
   </svg>
-`,pe=g`
+`,he=g`
   <svg
     xmlns="http://www.w3.org/2000/svg"
     width="16"
@@ -401,7 +401,7 @@ var $e=Object.defineProperty;var Ie=Object.getOwnPropertyDescriptor;var i=(n,s,e
   >
     <polygon points="22,3 2,3 10,12.46 10,19 14,21 14,12.46" />
   </svg>
-`,ge=g`
+`,me=g`
   <svg
     xmlns="http://www.w3.org/2000/svg"
     width="16"
@@ -416,7 +416,7 @@ var $e=Object.defineProperty;var Ie=Object.getOwnPropertyDescriptor;var i=(n,s,e
     <circle cx="12" cy="12" r="10" />
     <line x1="4.93" y1="4.93" x2="19.07" y2="19.07" />
   </svg>
-`,he=g`
+`,ue=g`
   <svg
     xmlns="http://www.w3.org/2000/svg"
     width="24"
@@ -431,7 +431,7 @@ var $e=Object.defineProperty;var Ie=Object.getOwnPropertyDescriptor;var i=(n,s,e
     <rect x="9" y="9" width="13" height="13" rx="2" ry="2"></rect>
     <path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"></path>
   </svg>
-`,me=g`
+`,be=g`
   <svg
     xmlns="http://www.w3.org/2000/svg"
     width="24"
@@ -445,7 +445,7 @@ var $e=Object.defineProperty;var Ie=Object.getOwnPropertyDescriptor;var i=(n,s,e
   >
     <polyline points="20 6 9 17 4 12"></polyline>
   </svg>
-`,ue=g`
+`,ve=g`
   <svg
     xmlns="http://www.w3.org/2000/svg"
     width="16"
@@ -463,15 +463,15 @@ var $e=Object.defineProperty;var Ie=Object.getOwnPropertyDescriptor;var i=(n,s,e
     <line x1="12" y1="9" x2="12" y2="13"></line>
     <line x1="12" y1="17" x2="12.01" y2="17"></line>
   </svg>
-`;var v=class extends Ze{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 Qe`
+`;var v=class extends et{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 tt`
       <button
         class="copy-button ${this.isCopied?"copied":""}"
         title="${this.title}"
         @click=${this.handleClick}
       >
-        ${this.isCopied?me:he}
+        ${this.isCopied?be:ue}
       </button>
-    `}};v.styles=et`
+    `}};v.styles=it`
     .copy-button {
       background: transparent;
       border: 0px;
@@ -510,7 +510,7 @@ var $e=Object.defineProperty;var Ie=Object.getOwnPropertyDescriptor;var i=(n,s,e
     .copy-button.copied svg {
       stroke: #4caf50;
     }
-  `,i([be({type:String})],v.prototype,"title",2),i([be({type:Function})],v.prototype,"onCopy",2),i([ve()],v.prototype,"isCopied",2),i([ve()],v.prototype,"copyTimeout",2),v=i([tt("copy-icon")],v);var u=class extends it{constructor(){super(...arguments);this.borderColor="#555";this.showCopyButton=!1;this.itemId="";this.isExpanded=!1}toggleExpand(){this.onToggle&&this.onToggle(this.itemId)}async handleCopy(e){e.stopPropagation();let t=this.shadowRoot?.querySelector('slot[name="details"]');if(t){let a=t.assignedNodes().map(r=>r.textContent).join("");try{await navigator.clipboard.writeText(a)}catch(r){console.error("Failed to copy text: ",r)}}}render(){return this.style.setProperty("--border-color",this.borderColor),ye`
+  `,i([fe({type:String})],v.prototype,"title",2),i([fe({type:Function})],v.prototype,"onCopy",2),i([ye()],v.prototype,"isCopied",2),i([ye()],v.prototype,"copyTimeout",2),v=i([ot("copy-icon")],v);var u=class extends nt{constructor(){super(...arguments);this.borderColor="#555";this.showCopyButton=!1;this.itemId="";this.isExpanded=!1}toggleExpand(){this.onToggle&&this.onToggle(this.itemId)}async handleCopy(e){e.stopPropagation();let t=this.shadowRoot?.querySelector('slot[name="details"]');if(t){let a=t.assignedNodes().map(r=>r.textContent).join("");try{await navigator.clipboard.writeText(a)}catch(r){console.error("Failed to copy text: ",r)}}}render(){return this.style.setProperty("--border-color",this.borderColor),xe`
       <div class="item-entry ${this.isExpanded?"expanded":""}">
         <div class="item-header ${this.isExpanded?"expanded":""}" @click="${this.toggleExpand}">
           <div class="item-content">
@@ -522,7 +522,7 @@ var $e=Object.defineProperty;var Ie=Object.getOwnPropertyDescriptor;var i=(n,s,e
             </svg>
           </span>
         </div>
-        ${this.isExpanded?ye`
+        ${this.isExpanded?xe`
               <div class="item-details">
                 <copy-icon
                   positioned
@@ -535,7 +535,7 @@ var $e=Object.defineProperty;var Ie=Object.getOwnPropertyDescriptor;var i=(n,s,e
               </div>
             `:""}
       </div>
-    `}};u.styles=[ot`
+    `}};u.styles=[st`
       :host {
         display: block;
       }
@@ -633,7 +633,7 @@ var $e=Object.defineProperty;var Ie=Object.getOwnPropertyDescriptor;var i=(n,s,e
         display: block;
         overflow-x: auto;
       }
-    `],i([V()],u.prototype,"borderColor",2),i([V()],u.prototype,"showCopyButton",2),i([V()],u.prototype,"itemId",2),i([V()],u.prototype,"isExpanded",2),i([V()],u.prototype,"onToggle",2),u=i([nt("expandable-item")],u);var y=class extends st{constructor(){super(...arguments);this.isActive=!1;this.isExpanded=!1}getBorderColor(){return this.isActive?"#ffeb3b":this.elementData.isIntersectingWithViewport?"#4caf50":"#666"}getStatusIndicatorClass(){return this.isActive?"prefetching":this.elementData.isIntersectingWithViewport?"visible":"hidden"}formatElementDetails(){let e={tagName:this.elementData.element.tagName.toLowerCase(),isIntersecting:this.elementData.isIntersectingWithViewport,registerCount:this.elementData.registerCount,hitSlop:{top:this.elementData.elementBounds.hitSlop.top,right:this.elementData.elementBounds.hitSlop.right,bottom:this.elementData.elementBounds.hitSlop.bottom,left:this.elementData.elementBounds.hitSlop.left}};return JSON.stringify(e,null,2)}render(){return at`
+    `],i([V()],u.prototype,"borderColor",2),i([V()],u.prototype,"showCopyButton",2),i([V()],u.prototype,"itemId",2),i([V()],u.prototype,"isExpanded",2),i([V()],u.prototype,"onToggle",2),u=i([at("expandable-item")],u);var f=class extends rt{constructor(){super(...arguments);this.isActive=!1;this.isExpanded=!1}getBorderColor(){return this.isActive?"#ffeb3b":this.elementData.isIntersectingWithViewport?"#4caf50":"#666"}getStatusIndicatorClass(){return this.isActive?"prefetching":this.elementData.isIntersectingWithViewport?"visible":"hidden"}formatElementDetails(){let e={tagName:this.elementData.element.tagName.toLowerCase(),isIntersecting:this.elementData.isIntersectingWithViewport,registerCount:this.elementData.registerCount,hitSlop:{top:this.elementData.elementBounds.hitSlop.top,right:this.elementData.elementBounds.hitSlop.right,bottom:this.elementData.elementBounds.hitSlop.bottom,left:this.elementData.elementBounds.hitSlop.left}};return JSON.stringify(e,null,2)}render(){return lt`
       <expandable-item
         .borderColor=${this.getBorderColor()}
         .showCopyButton=${!0}
@@ -649,7 +649,7 @@ var $e=Object.defineProperty;var Ie=Object.getOwnPropertyDescriptor;var i=(n,s,e
         </div>
         <div slot="details">${this.formatElementDetails()}</div>
       </expandable-item>
-    `}};y.styles=[rt`
+    `}};f.styles=[dt`
       :host {
         display: block;
       }
@@ -697,8 +697,8 @@ var $e=Object.defineProperty;var Ie=Object.getOwnPropertyDescriptor;var i=(n,s,e
         color: #fff;
         font-weight: 600;
       }
-    `],i([A()],y.prototype,"elementData",2),i([A()],y.prototype,"isActive",2),i([A()],y.prototype,"isExpanded",2),i([A()],y.prototype,"onToggle",2),y=i([lt("single-element")],y);import{ForesightManager as I}from"js.foresight";var c=class extends ct{constructor(){super();this.hitCount={mouse:{hover:0,trajectory:0},scroll:{down:0,left:0,right:0,up:0},tab:{forwards:0,reverse:0},total:0};this.visibleElementsCount=0;this.totalElementsCount=0;this.elementListItems=new Map;this.noContentMessage="No Elements Registered To The Foresight Manager";this.activeCallbacks=new Set;this.expandedElementIds=new Set;this.elementIdCounter=0;this._abortController=null;this.handleSortChange=e=>{this.sortOrder=e};this.handleElementToggle=e=>{let t=new Set(this.expandedElementIds);t.has(e)?t.delete(e):t.add(e),this.expandedElementIds=t};this.sortByDocumentPosition=(e,t)=>{let o=e.element.compareDocumentPosition(t.element);return o&Node.DOCUMENT_POSITION_FOLLOWING?-1:o&Node.DOCUMENT_POSITION_PRECEDING?1:0};this.sortOrder=l.instance.devtoolsSettings.sortElementList,this.sortDropdown=[{value:"visibility",label:"Visibility",title:"Sort by Visibility",icon:de},{value:"documentOrder",label:"Document Order",title:"Sort by Document Order",icon:ce},{value:"insertionOrder",label:"Insertion Order",title:"Sort by Insertion Order",icon:pe}]}generateElementId(){return(++this.elementIdCounter).toString()}updateVisibilityCounts(){let e=0,t=0;this.elementListItems.forEach(o=>{t++,o.isIntersectingWithViewport&&e++}),this.visibleElementsCount=e,this.totalElementsCount=t,this.dispatchEvent(new CustomEvent("visibility-count-updated",{detail:{visibleCount:e,totalCount:t},bubbles:!0,composed:!0}))}_generateHitsChipTitle(e){let t=[];return t.push(`Total Hits: ${e.total}`),t.push(""),t.push(`Mouse: Trajectory: ${e.mouse.trajectory}, Hover: ${e.mouse.hover}`),t.push(`Scroll: Up: ${e.scroll.up}, Down: ${e.scroll.down}, Left: ${e.scroll.left}, Right: ${e.scroll.right}`),t.push(`Tab: Forwards: ${e.tab.forwards}, Reverse: ${e.tab.reverse}`),t.join(`
-`)}connectedCallback(){super.connectedCallback(),this._abortController=new AbortController;let{signal:e}=this._abortController;this.updateElementListFromManager(),this.updateVisibilityCounts(),I.instance.addEventListener("elementRegistered",t=>{let o={...t.elementData,elementId:this.generateElementId()};this.elementListItems.set(t.elementData.element,o),this.updateVisibilityCounts()},{signal:e}),I.instance.addEventListener("elementDataUpdated",t=>{let o=this.elementListItems.get(t.elementData.element);if(o){let a={...t.elementData,elementId:o.elementId};this.elementListItems.set(t.elementData.element,a),this.updateVisibilityCounts(),this.requestUpdate()}},{signal:e}),I.instance.addEventListener("elementUnregistered",t=>{this.elementListItems.delete(t.elementData.element),this.updateVisibilityCounts(),this.elementListItems.size||(this.noContentMessage="No Elements Registered To The Foresight Manager"),this.requestUpdate(),this.activeCallbacks.delete(t.elementData.element)},{signal:e}),I.instance.addEventListener("callbackInvoked",t=>{this.activeCallbacks.add(t.elementData.element),this.requestUpdate()},{signal:e}),I.instance.addEventListener("callbackCompleted",t=>{this.handleCallbackCompleted(t.hitType),this.activeCallbacks.delete(t.elementData.element)},{signal:e})}disconnectedCallback(){super.disconnectedCallback(),this._abortController?.abort(),this._abortController=null}updateElementListFromManager(){let e=new Map;I.instance.registeredElements.forEach((t,o)=>{e.set(o,{...t,elementId:this.generateElementId()})}),this.elementListItems=e}handleCallbackCompleted(e){switch(e.kind){case"mouse":this.hitCount.mouse[e.subType]++;break;case"tab":this.hitCount.tab[e.subType]++;break;case"scroll":this.hitCount.scroll[e.subType]++;break;default:}this.hitCount.total++,this.requestUpdate()}getSortedElements(){let e=Array.from(this.elementListItems.values());switch(this.sortOrder){case"insertionOrder":return e;case"documentOrder":return e.sort(this.sortByDocumentPosition);case"visibility":return e.sort((t,o)=>t.isIntersectingWithViewport!==o.isIntersectingWithViewport?t.isIntersectingWithViewport?-1:1:this.sortByDocumentPosition(t,o));default:return this.sortOrder,e}}render(){return fe`
+    `],i([A()],f.prototype,"elementData",2),i([A()],f.prototype,"isActive",2),i([A()],f.prototype,"isExpanded",2),i([A()],f.prototype,"onToggle",2),f=i([ct("single-element")],f);import{ForesightManager as I}from"js.foresight";var c=class extends gt{constructor(){super();this.hitCount={mouse:{hover:0,trajectory:0},scroll:{down:0,left:0,right:0,up:0},tab:{forwards:0,reverse:0},total:0};this.visibleElementsCount=0;this.totalElementsCount=0;this.elementListItems=new Map;this.noContentMessage="No Elements Registered To The Foresight Manager";this.activeCallbacks=new Set;this.expandedElementIds=new Set;this.elementIdCounter=0;this._abortController=null;this.handleSortChange=e=>{this.sortOrder=e};this.handleElementToggle=e=>{let t=new Set(this.expandedElementIds);t.has(e)?t.delete(e):t.add(e),this.expandedElementIds=t};this.sortByDocumentPosition=(e,t)=>{let o=e.element.compareDocumentPosition(t.element);return o&Node.DOCUMENT_POSITION_FOLLOWING?-1:o&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:ge},{value:"insertionOrder",label:"Insertion Order",title:"Sort by Insertion Order",icon:he}]}generateElementId(){return(++this.elementIdCounter).toString()}updateVisibilityCounts(){let e=0,t=0;this.elementListItems.forEach(o=>{t++,o.isIntersectingWithViewport&&e++}),this.visibleElementsCount=e,this.totalElementsCount=t,this.dispatchEvent(new CustomEvent("visibility-count-updated",{detail:{visibleCount:e,totalCount:t},bubbles:!0,composed:!0}))}_generateHitsChipTitle(e){let t=[];return t.push(`Total Hits: ${e.total}`),t.push(""),t.push(`Mouse: Trajectory: ${e.mouse.trajectory}, Hover: ${e.mouse.hover}`),t.push(`Scroll: Up: ${e.scroll.up}, Down: ${e.scroll.down}, Left: ${e.scroll.left}, Right: ${e.scroll.right}`),t.push(`Tab: Forwards: ${e.tab.forwards}, Reverse: ${e.tab.reverse}`),t.join(`
+`)}connectedCallback(){super.connectedCallback(),this._abortController=new AbortController;let{signal:e}=this._abortController;this.updateElementListFromManager(),this.updateVisibilityCounts(),I.instance.addEventListener("elementRegistered",t=>{let o={...t.elementData,elementId:this.generateElementId()};this.elementListItems.set(t.elementData.element,o),this.updateVisibilityCounts()},{signal:e}),I.instance.addEventListener("elementDataUpdated",t=>{let o=this.elementListItems.get(t.elementData.element);if(o){let a={...t.elementData,elementId:o.elementId};this.elementListItems.set(t.elementData.element,a),this.updateVisibilityCounts(),this.requestUpdate()}},{signal:e}),I.instance.addEventListener("elementUnregistered",t=>{this.elementListItems.delete(t.elementData.element),this.updateVisibilityCounts(),this.elementListItems.size||(this.noContentMessage="No Elements Registered To The Foresight Manager"),this.requestUpdate(),this.activeCallbacks.delete(t.elementData.element)},{signal:e}),I.instance.addEventListener("callbackInvoked",t=>{this.activeCallbacks.add(t.elementData.element),this.requestUpdate()},{signal:e}),I.instance.addEventListener("callbackCompleted",t=>{this.handleCallbackCompleted(t.hitType),this.activeCallbacks.delete(t.elementData.element)},{signal:e})}disconnectedCallback(){super.disconnectedCallback(),this._abortController?.abort(),this._abortController=null}updateElementListFromManager(){let e=new Map;I.instance.registeredElements.forEach((t,o)=>{e.set(o,{...t,elementId:this.generateElementId()})}),this.elementListItems=e}handleCallbackCompleted(e){switch(e.kind){case"mouse":this.hitCount.mouse[e.subType]++;break;case"tab":this.hitCount.tab[e.subType]++;break;case"scroll":this.hitCount.scroll[e.subType]++;break;default:}this.hitCount.total++,this.requestUpdate()}getSortedElements(){let e=Array.from(this.elementListItems.values());switch(this.sortOrder){case"insertionOrder":return e;case"documentOrder":return e.sort(this.sortByDocumentPosition);case"visibility":return e.sort((t,o)=>t.isIntersectingWithViewport!==o.isIntersectingWithViewport?t.isIntersectingWithViewport?-1:1:this.sortByDocumentPosition(t,o));default:return this.sortOrder,e}}render(){return we`
       <tab-header>
         <div slot="chips" class="chips-container">
           <chip-element title="Number of visible registered elements / total registered elements">
@@ -720,7 +720,7 @@ var $e=Object.defineProperty;var Ie=Object.getOwnPropertyDescriptor;var i=(n,s,e
         .noContentMessage=${this.noContentMessage}
         .hasContent=${!!this.elementListItems.size}
       >
-        ${gt(this.getSortedElements(),e=>fe`
+        ${mt(this.getSortedElements(),e=>we`
             <single-element
               .elementData=${e}
               .isActive=${this.activeCallbacks.has(e.element)}
@@ -729,7 +729,7 @@ var $e=Object.defineProperty;var Ie=Object.getOwnPropertyDescriptor;var i=(n,s,e
             ></single-element>
           `)}
       </tab-content>
-    `}};c.styles=dt`
+    `}};c.styles=pt`
     :host {
       display: flex;
       flex-direction: column;
@@ -784,9 +784,9 @@ var $e=Object.defineProperty;var Ie=Object.getOwnPropertyDescriptor;var i=(n,s,e
       color: #fff;
       font-weight: 600;
     }
-  `,i([f()],c.prototype,"hitCount",2),i([f()],c.prototype,"visibleElementsCount",2),i([f()],c.prototype,"totalElementsCount",2),i([f()],c.prototype,"sortDropdown",2),i([f()],c.prototype,"sortOrder",2),i([f()],c.prototype,"elementListItems",2),i([f()],c.prototype,"noContentMessage",2),i([f()],c.prototype,"activeCallbacks",2),i([f()],c.prototype,"expandedElementIds",2),c=i([pt("element-tab")],c);import{css as ht,html as xe,LitElement as mt}from"lit";import{customElement as ut,property as bt}from"lit/decorators.js";var P=class extends mt{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 xe`
+  `,i([y()],c.prototype,"hitCount",2),i([y()],c.prototype,"visibleElementsCount",2),i([y()],c.prototype,"totalElementsCount",2),i([y()],c.prototype,"sortDropdown",2),i([y()],c.prototype,"sortOrder",2),i([y()],c.prototype,"elementListItems",2),i([y()],c.prototype,"noContentMessage",2),i([y()],c.prototype,"activeCallbacks",2),i([y()],c.prototype,"expandedElementIds",2),c=i([ht("element-tab")],c);import{css as ut,html as ke,LitElement as bt}from"lit";import{customElement as vt,property as ft}from"lit/decorators.js";var U=class extends bt{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 ke`
       <div class="tab-selector-wrapper">
-        ${this.tabs.map(e=>xe`
+        ${this.tabs.map(e=>ke`
             <button
               class="tab-button ${this.activeTab===e?"active":""}"
               @click="${()=>this._handleTabClick(e)}"
@@ -796,7 +796,7 @@ var $e=Object.defineProperty;var Ie=Object.getOwnPropertyDescriptor;var i=(n,s,e
             </button>
           `)}
       </div>
-    `}};P.styles=ht`
+    `}};U.styles=ut`
     .tab-selector-wrapper {
       border-bottom: 2px solid #444;
       margin-top: 12px;
@@ -827,7 +827,7 @@ var $e=Object.defineProperty;var Ie=Object.getOwnPropertyDescriptor;var i=(n,s,e
       color: #b0c4de;
       border-bottom-color: #b0c4de;
     }
-  `,i([bt({type:String})],P.prototype,"activeTab",2),P=i([ut("tab-selector")],P);import{ForesightManager as X}from"js.foresight";import{LitElement as St,css as Tt,html as H}from"lit";import{customElement as Mt,property as _t,state as U}from"lit/decorators.js";import{map as Dt}from"lit/directives/map.js";function we(n,s){try{switch(n.type){case"elementRegistered":return{type:"elementRegistered",name:n.elementData.name,id:n.elementData.element.id||"",registerCount:n.elementData.registerCount,hitslop:n.elementData.elementBounds.hitSlop,localizedTimestamp:new Date(n.timestamp).toLocaleTimeString(),logId:s,summary:n.elementData.registerCount===1?n.elementData.name:`${n.elementData.name} - ${yt(n.elementData.registerCount)} time`};case"elementUnregistered":return{type:"elementUnregistered",name:n.elementData.name,id:n.elementData.element.id||"",registerCount:n.elementData.registerCount,unregisterReason:n.unregisterReason,localizedTimestamp:new Date(n.timestamp).toLocaleTimeString(),logId:s,summary:`${n.elementData.name} - ${n.unregisterReason}`};case"elementDataUpdated":return{type:"elementDataUpdated",name:n.elementData.name,updatedProps:n.updatedProps||[],isIntersecting:n.elementData.isIntersectingWithViewport,localizedTimestamp:new Date().toLocaleTimeString(),logId:s,summary:`${n.elementData.name} - ${n.updatedProps.toString()}`};case"callbackInvoked":return{type:"callbackInvoked",name:n.elementData.name,hitType:n.hitType,localizedTimestamp:new Date(n.timestamp).toLocaleTimeString(),logId:s,summary:`${n.elementData.name} - ${n.hitType.kind}`};case"callbackCompleted":{let e=vt(n.elapsed);return{type:"callbackCompleted",...n.status==="error"?{status:"error",errorMessage:n.errorMessage}:{status:"success"},name:n.elementData.name,hitType:n.hitType,callbackRunTimeFormatted:e,callbackRunTimeRaw:n.elapsed,localizedTimestamp:new Date(n.timestamp).toLocaleTimeString(),logId:s,summary:`${n.elementData.name} - ${e}`}}case"mouseTrajectoryUpdate":return{type:"mouseTrajectoryUpdate",currentPoint:n.trajectoryPositions?.currentPoint,predictedPoint:n.trajectoryPositions?.predictedPoint,positionCount:n.trajectoryPositions?.positions?.length||0,mousePredictionEnabled:n.predictionEnabled,localizedTimestamp:new Date().toLocaleTimeString(),logId:s,summary:""};case"scrollTrajectoryUpdate":return{type:"scrollTrajectoryUpdate",currentPoint:n.currentPoint,predictedPoint:n.predictedPoint,scrollDirection:n.scrollDirection,localizedTimestamp:new Date().toLocaleTimeString(),logId:s,summary:n.scrollDirection};case"managerSettingsChanged":return{type:"managerSettingsChanged",globalSettings:n.managerData?.globalSettings||{},settingsChanged:n.updatedSettings,localizedTimestamp:new Date(n.timestamp).toLocaleTimeString(),logId:s,summary:n.updatedSettings.map(e=>e.setting).join(", ")};default:return{type:"serializationError",error:"Failed to serialize event data",errorMessage:JSON.stringify(n),localizedTimestamp:new Date().toLocaleTimeString(),logId:s,summary:""}}}catch(e){return{type:"serializationError",error:"Failed to serialize event data",localizedTimestamp:new Date().toLocaleTimeString(),errorMessage:e instanceof Error?e.message:String(e),logId:s,summary:""}}}function vt(n){return`${(n/1e3).toFixed(4)} s`}function yt(n){let s=["th","st","nd","rd"],e=n%100;return n+(s[(e-20)%10]||s[e]||s[0])}import{html as ke,css as ft}from"lit";import{customElement as xt,property as Ee}from"lit/decorators.js";var _=class extends M{constructor(){super(...arguments);this.selectedValues=[]}_handleOptionClick(e){let t=this.selectedValues.includes(e.value);t?this.selectedValues=this.selectedValues.filter(a=>a!==e.value):this.selectedValues=[...this.selectedValues,e.value];let o=!t;this.onSelectionChange?.(e.value,o)}_getTriggerIcon(){return m}_isOptionSelected(e){return this.selectedValues.includes(e.value)}_getTriggerTitle(){let e=this.selectedValues.length;return e===0?"No items selected":e===1?"1 item selected":`${e} items selected`}_getTriggerLabel(){return`Filter options: ${this.selectedValues.length} selected`}render(){let e=`trigger-button ${this.isDropdownOpen?"active":""}`,t=`dropdown-menu ${this.isDropdownOpen?"active":""}`;return ke`
+  `,i([ft({type:String})],U.prototype,"activeTab",2),U=i([vt("tab-selector")],U);import{ForesightManager as X}from"js.foresight";import{LitElement as Mt,css as Dt,html as H}from"lit";import{customElement as _t,property as Lt,state as P}from"lit/decorators.js";import{map as $t}from"lit/directives/map.js";function Ce(n,s){try{switch(n.type){case"elementRegistered":return{type:"elementRegistered",name:n.elementData.name,id:n.elementData.element.id||"",registerCount:n.elementData.registerCount,hitslop:n.elementData.elementBounds.hitSlop,localizedTimestamp:new Date(n.timestamp).toLocaleTimeString(),logId:s,summary:n.elementData.registerCount===1?n.elementData.name:`${n.elementData.name} - ${xt(n.elementData.registerCount)} time`};case"elementUnregistered":return{type:"elementUnregistered",name:n.elementData.name,id:n.elementData.element.id||"",registerCount:n.elementData.registerCount,unregisterReason:n.unregisterReason,localizedTimestamp:new Date(n.timestamp).toLocaleTimeString(),logId:s,summary:`${n.elementData.name} - ${n.unregisterReason}`};case"elementDataUpdated":return{type:"elementDataUpdated",name:n.elementData.name,updatedProps:n.updatedProps||[],isIntersecting:n.elementData.isIntersectingWithViewport,localizedTimestamp:new Date().toLocaleTimeString(),logId:s,summary:`${n.elementData.name} - ${n.updatedProps.toString()}`};case"callbackInvoked":return{type:"callbackInvoked",name:n.elementData.name,hitType:n.hitType,localizedTimestamp:new Date(n.timestamp).toLocaleTimeString(),logId:s,summary:`${n.elementData.name} - ${n.hitType.kind}`};case"callbackCompleted":{let e=yt(n.elapsed);return{type:"callbackCompleted",...n.status==="error"?{status:"error",errorMessage:n.errorMessage}:{status:"success"},name:n.elementData.name,hitType:n.hitType,callbackRunTimeFormatted:e,callbackRunTimeRaw:n.elapsed,localizedTimestamp:new Date(n.timestamp).toLocaleTimeString(),logId:s,summary:`${n.elementData.name} - ${e}`}}case"mouseTrajectoryUpdate":return{type:"mouseTrajectoryUpdate",currentPoint:n.trajectoryPositions?.currentPoint,predictedPoint:n.trajectoryPositions?.predictedPoint,positionCount:n.trajectoryPositions?.positions?.length||0,mousePredictionEnabled:n.predictionEnabled,localizedTimestamp:new Date().toLocaleTimeString(),logId:s,summary:""};case"scrollTrajectoryUpdate":return{type:"scrollTrajectoryUpdate",currentPoint:n.currentPoint,predictedPoint:n.predictedPoint,scrollDirection:n.scrollDirection,localizedTimestamp:new Date().toLocaleTimeString(),logId:s,summary:n.scrollDirection};case"managerSettingsChanged":return{type:"managerSettingsChanged",globalSettings:n.managerData?.globalSettings||{},settingsChanged:n.updatedSettings,localizedTimestamp:new Date(n.timestamp).toLocaleTimeString(),logId:s,summary:n.updatedSettings.map(e=>e.setting).join(", ")};default:return{type:"serializationError",error:"Failed to serialize event data",errorMessage:JSON.stringify(n),localizedTimestamp:new Date().toLocaleTimeString(),logId:s,summary:""}}}catch(e){return{type:"serializationError",error:"Failed to serialize event data",localizedTimestamp:new Date().toLocaleTimeString(),errorMessage:e instanceof Error?e.message:String(e),logId:s,summary:""}}}function yt(n){return`${(n/1e3).toFixed(4)} s`}function xt(n){let s=["th","st","nd","rd"],e=n%100;return n+(s[(e-20)%10]||s[e]||s[0])}import{html as Ee,css as wt}from"lit";import{customElement as kt,property as Se}from"lit/decorators.js";var D=class extends M{constructor(){super(...arguments);this.selectedValues=[]}_handleOptionClick(e){let t=this.selectedValues.includes(e.value);t?this.selectedValues=this.selectedValues.filter(a=>a!==e.value):this.selectedValues=[...this.selectedValues,e.value];let o=!t;this.onSelectionChange?.(e.value,o)}_getTriggerIcon(){return m}_isOptionSelected(e){return this.selectedValues.includes(e.value)}_getTriggerTitle(){let e=this.selectedValues.length;return e===0?"No items selected":e===1?"1 item selected":`${e} items selected`}_getTriggerLabel(){return`Filter options: ${this.selectedValues.length} selected`}render(){let e=`trigger-button ${this.isDropdownOpen?"active":""}`,t=`dropdown-menu ${this.isDropdownOpen?"active":""}`;return Ee`
       <div class="dropdown-container">
         <button
           class="${e}"
@@ -854,7 +854,7 @@ var $e=Object.defineProperty;var Ie=Object.getOwnPropertyDescriptor;var i=(n,s,e
         </button>
 
         <div class="${t}" id="dropdown-menu" role="menu">
-          ${this.dropdownOptions.map(o=>ke`
+          ${this.dropdownOptions.map(o=>Ee`
               <button
                 value="${o.value}"
                 title="${o.title}"
@@ -867,7 +867,7 @@ var $e=Object.defineProperty;var Ie=Object.getOwnPropertyDescriptor;var i=(n,s,e
             `)}
         </div>
       </div>
-    `}};_.styles=[...M.styles,ft`
+    `}};D.styles=[...M.styles,wt`
       .dropdown-menu button.active::after {
         content: "✓";
         position: absolute;
@@ -883,7 +883,7 @@ var $e=Object.defineProperty;var Ie=Object.getOwnPropertyDescriptor;var i=(n,s,e
         color: #b0c4de;
         margin-left: 2px;
       }
-    `],i([Ee({type:Array})],_.prototype,"selectedValues",2),i([Ee()],_.prototype,"onSelectionChange",2),_=i([xt("multi-select-dropdown")],_);import{LitElement as wt,html as kt,css as Et}from"lit";import{customElement as Ct,property as J}from"lit/decorators.js";var E=class extends wt{constructor(e){super();this.isExpanded=!1;this.log=e}updated(e){if(e.has("log")&&this.log){let t=this.log,o=t.type==="callbackCompleted"&&"status"in t&&t.status==="error",a=o?"#f44336":this.getLogTypeColor(t.type),r=o?"rgba(244, 67, 54, 0.1)":"transparent";this.style.setProperty("--log-color",a),this.style.setProperty("--log-background-color",r)}}serializeLogDataWithoutSummary(e){let{summary:t,...o}=e;return JSON.stringify(o,null,2)}getLogTypeColor(e){return{elementRegistered:"#2196f3",callbackInvoked:"#00bcd4",callbackCompleted:"#4caf50",elementDataUpdated:"#ffc107",elementUnregistered:"#ff9800",managerSettingsChanged:"#f44336",mouseTrajectoryUpdate:"#78909c",scrollTrajectoryUpdate:"#607d8b"}[e]||"#555"}getEventDisplayName(e){return{elementRegistered:"Registered",elementUnregistered:"Unregistered",elementDataUpdated:"Data Updated",callbackInvoked:"Invoked",callbackCompleted:"Completed",mouseTrajectoryUpdate:"Mouse",scrollTrajectoryUpdate:"Scroll",managerSettingsChanged:"Settings"}[e]||e}truncateLogSummary(e,t=50){return e.length<=t?e:e.substring(0,t)+"..."}render(){let e=this.log,o=e.type==="callbackCompleted"&&"status"in e&&e.status==="error"?"#f44336":this.getLogTypeColor(e.type);return kt`
+    `],i([Se({type:Array})],D.prototype,"selectedValues",2),i([Se()],D.prototype,"onSelectionChange",2),D=i([kt("multi-select-dropdown")],D);import{LitElement as Ct,html as Et,css as St}from"lit";import{customElement as Tt,property as J}from"lit/decorators.js";var C=class extends Ct{constructor(e){super();this.isExpanded=!1;this.log=e}updated(e){if(e.has("log")&&this.log){let t=this.log,o=t.type==="callbackCompleted"&&"status"in t&&t.status==="error",a=o?"#f44336":this.getLogTypeColor(t.type),r=o?"rgba(244, 67, 54, 0.1)":"transparent";this.style.setProperty("--log-color",a),this.style.setProperty("--log-background-color",r)}}serializeLogDataWithoutSummary(e){let{summary:t,...o}=e;return JSON.stringify(o,null,2)}getLogTypeColor(e){return{elementRegistered:"#2196f3",callbackInvoked:"#00bcd4",callbackCompleted:"#4caf50",elementDataUpdated:"#ffc107",elementUnregistered:"#ff9800",managerSettingsChanged:"#f44336",mouseTrajectoryUpdate:"#78909c",scrollTrajectoryUpdate:"#607d8b"}[e]||"#555"}getEventDisplayName(e){return{elementRegistered:"Registered",elementUnregistered:"Unregistered",elementDataUpdated:"Data Updated",callbackInvoked:"Invoked",callbackCompleted:"Completed",mouseTrajectoryUpdate:"Mouse",scrollTrajectoryUpdate:"Scroll",managerSettingsChanged:"Settings"}[e]||e}truncateLogSummary(e,t=50){return e.length<=t?e:e.substring(0,t)+"..."}render(){let e=this.log,o=e.type==="callbackCompleted"&&"status"in e&&e.status==="error"?"#f44336":this.getLogTypeColor(e.type);return Et`
       <expandable-item
         .borderColor=${o}
         .itemId=${e.logId}
@@ -899,7 +899,7 @@ var $e=Object.defineProperty;var Ie=Object.getOwnPropertyDescriptor;var i=(n,s,e
         </div>
         <div slot="details">${this.serializeLogDataWithoutSummary(e)}</div>
       </expandable-item>
-    `}};E.styles=[Et`
+    `}};C.styles=[St`
       :host {
         display: block;
         /*
@@ -963,7 +963,7 @@ var $e=Object.defineProperty;var Ie=Object.getOwnPropertyDescriptor;var i=(n,s,e
        * as all styling is now handled by setting CSS variables below.
        * This makes the component's styling more self-contained.
        */
-    `],i([J({attribute:!1})],E.prototype,"log",2),i([J({type:Boolean})],E.prototype,"isExpanded",2),i([J()],E.prototype,"onToggle",2),E=i([Ct("single-log")],E);var h=class extends St{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:se},{value:"console",label:"Console",title:"Log only to the console",icon:ae},{value:"both",label:"Both",title:"Log to both the control panel and the console",icon:le},{value:"none",label:"None",title:"Dont log anywhere",icon:re}],this.filterDropdown=[{value:"elementRegistered",label:"Element Registered",title:"Show element registration events",icon:m},{value:"elementUnregistered",label:"Element Unregistered",title:"Show element unregistration events",icon:m},{value:"elementDataUpdated",label:"Element Data Updated",title:"Show element data update events",icon:m},{value:"callbackInvoked",label:"Callback Invoked",title:"Show callback invoked events",icon:m},{value:"callbackCompleted",label:"Callback Completed",title:"Show callback completed events",icon:m},{value:"mouseTrajectoryUpdate",label:"Mouse Trajectory Update",title:"Show mouse trajectory update events",icon:m},{value:"scrollTrajectoryUpdate",label:"Scroll Trajectory Update",title:"Show scroll trajectory update events",icon:m},{value:"managerSettingsChanged",label:"Manager Settings Changed",title:"Show manager settings change events",icon:m}]}getSelectedEventFilters(){return Object.entries(this.eventsEnabled).filter(([e])=>e).map(([e])=>e)}shouldShowPerformanceWarning(){let e=this.logLocation==="console"||this.logLocation==="both",t=this.eventsEnabled.mouseTrajectoryUpdate||this.eventsEnabled.scrollTrajectoryUpdate||this.eventsEnabled.elementDataUpdated;return e&&t}getNoLogsMessage(){return Object.values(this.eventsEnabled).filter(Boolean).length===0?"Logging for all events is turned off":this.logLocation==="console"?"No logs to display. Logging location is set to console - check browser console for events.":this.logLocation==="none"?"No logs to display. Logging location is set to none":"Interact with Foresight to generate events."}clearLogs(){this.logs=[],this.expandedLogIds.clear(),this.noContentMessage="Logs cleared"}connectedCallback(){super.connectedCallback(),this._abortController=new AbortController,this.setupDynamicEventListeners()}disconnectedCallback(){super.disconnectedCallback(),this._abortController?.abort(),this.removeAllEventListeners()}setupDynamicEventListeners(){Object.entries(this.eventsEnabled).forEach(([e,t])=>{t&&this.addForesightEventListener(e)})}addForesightEventListener(e){if(this._eventListeners.has(e))return;let t=o=>{this.handleEvent(e,o)};this._eventListeners.set(e,t),X.instance.addEventListener(e,t,{signal:this._abortController?.signal})}removeForesightEventListener(e){let t=this._eventListeners.get(e);t&&(X.instance.removeEventListener(e,t),this._eventListeners.delete(e))}removeAllEventListeners(){this._eventListeners.forEach((e,t)=>{X.instance.removeEventListener(t,e)}),this._eventListeners.clear()}getEventColor(e){return{elementRegistered:"#2196f3",callbackInvoked:"#00bcd4",callbackCompleted:"#4caf50",elementDataUpdated:"#ffc107",elementUnregistered:"#ff9800",managerSettingsChanged:"#f44336",mouseTrajectoryUpdate:"#78909c",scrollTrajectoryUpdate:"#607d8b"}[e]||"#ffffff"}handleEvent(e,t){if(this.logLocation!=="none"){if(this.logLocation==="console"||this.logLocation==="both"){let o=this.getEventColor(e);console.log(`%c[ForesightJS] ${e}`,`color: ${o}; font-weight: bold;`,t)}(this.logLocation==="controlPanel"||this.logLocation==="both")&&this.addEventLog(t)}}addEventLog(e){let t=we(e,(++this.logIdCounter).toString());if(t.type==="serializationError"){console.error(t.error,t.errorMessage);return}this.logs.unshift(t),this.logs.length>this.MAX_LOGS&&this.logs.pop(),this.requestUpdate()}render(){return H`
+    `],i([J({attribute:!1})],C.prototype,"log",2),i([J({type:Boolean})],C.prototype,"isExpanded",2),i([J()],C.prototype,"onToggle",2),C=i([Tt("single-log")],C);var h=class extends Mt{constructor(){super();this.logs=[];this.expandedLogIds=new Set;this.MAX_LOGS=100;this.logIdCounter=0;this.noContentMessage="No logs available";this._abortController=null;this._eventListeners=new Map;this.handleLogLocationChange=e=>{this.logLocation=e};this.handleFilterChange=(e,t)=>{this.eventsEnabled={...this.eventsEnabled,[e]:t},t?this.addForesightEventListener(e):this.removeForesightEventListener(e)};this.handleLogToggle=e=>{let t=new Set(this.expandedLogIds);t.has(e)?t.delete(e):t.add(e),this.expandedLogIds=t};let{logging:{logLocation:e,...t}}=l.instance.devtoolsSettings;this.eventsEnabled=t,this.logLocation=e,this.logDropdown=[{value:"controlPanel",label:"Control Panel",title:"Log only to the control panel",icon:re},{value:"console",label:"Console",title:"Log only to the console",icon:le},{value:"both",label:"Both",title:"Log to both the control panel and the console",icon:ce},{value:"none",label:"None",title:"Dont log anywhere",icon:de}],this.filterDropdown=[{value:"elementRegistered",label:"Element Registered",title:"Show element registration events",icon:m},{value:"elementUnregistered",label:"Element Unregistered",title:"Show element unregistration events",icon:m},{value:"elementDataUpdated",label:"Element Data Updated",title:"Show element data update events",icon:m},{value:"callbackInvoked",label:"Callback Invoked",title:"Show callback invoked events",icon:m},{value:"callbackCompleted",label:"Callback Completed",title:"Show callback completed events",icon:m},{value:"mouseTrajectoryUpdate",label:"Mouse Trajectory Update",title:"Show mouse trajectory update events",icon:m},{value:"scrollTrajectoryUpdate",label:"Scroll Trajectory Update",title:"Show scroll trajectory update events",icon:m},{value:"managerSettingsChanged",label:"Manager Settings Changed",title:"Show manager settings change events",icon:m}]}getSelectedEventFilters(){return Object.entries(this.eventsEnabled).filter(([,e])=>e).map(([e])=>e)}shouldShowPerformanceWarning(){let e=this.logLocation==="console"||this.logLocation==="both",t=this.eventsEnabled.mouseTrajectoryUpdate||this.eventsEnabled.scrollTrajectoryUpdate||this.eventsEnabled.elementDataUpdated;return e&&t}getNoLogsMessage(){return Object.values(this.eventsEnabled).filter(Boolean).length===0?"Logging for all events is turned off":this.logLocation==="console"?"No logs to display. Logging location is set to console - check browser console for events.":this.logLocation==="none"?"No logs to display. Logging location is set to none":"Interact with Foresight to generate events."}clearLogs(){this.logs=[],this.expandedLogIds.clear(),this.noContentMessage="Logs cleared"}connectedCallback(){super.connectedCallback(),this._abortController=new AbortController,this.setupDynamicEventListeners()}disconnectedCallback(){super.disconnectedCallback(),this._abortController?.abort(),this.removeAllEventListeners()}setupDynamicEventListeners(){Object.entries(this.eventsEnabled).forEach(([e,t])=>{t&&this.addForesightEventListener(e)})}addForesightEventListener(e){if(this._eventListeners.has(e))return;let t=o=>{this.handleEvent(e,o)};this._eventListeners.set(e,t),X.instance.addEventListener(e,t,{signal:this._abortController?.signal})}removeForesightEventListener(e){let t=this._eventListeners.get(e);t&&(X.instance.removeEventListener(e,t),this._eventListeners.delete(e))}removeAllEventListeners(){this._eventListeners.forEach((e,t)=>{X.instance.removeEventListener(t,e)}),this._eventListeners.clear()}getEventColor(e){return{elementRegistered:"#2196f3",callbackInvoked:"#00bcd4",callbackCompleted:"#4caf50",elementDataUpdated:"#ffc107",elementUnregistered:"#ff9800",managerSettingsChanged:"#f44336",mouseTrajectoryUpdate:"#78909c",scrollTrajectoryUpdate:"#607d8b"}[e]||"#ffffff"}handleEvent(e,t){if(this.logLocation!=="none"){if(this.logLocation==="console"||this.logLocation==="both"){let o=this.getEventColor(e);console.log(`%c[ForesightJS] ${e}`,`color: ${o}; font-weight: bold;`,t)}(this.logLocation==="controlPanel"||this.logLocation==="both")&&this.addEventLog(t)}}addEventLog(e){let t=Ce(e,(++this.logIdCounter).toString());if(t.type==="serializationError"){console.error(t.error,t.errorMessage);return}this.logs.unshift(t),this.logs.length>this.MAX_LOGS&&this.logs.pop(),this.requestUpdate()}render(){return H`
       <tab-header>
         <div slot="chips" class="chips-container">
           <chip-element title="Number of logged events (Max ${this.MAX_LOGS})">
@@ -977,7 +977,7 @@ var $e=Object.defineProperty;var Ie=Object.getOwnPropertyDescriptor;var i=(n,s,e
                   title="Console logging can be slow with frequent trajectory events.
 Consider using 'Control Panel' only for better performance."
                 >
-                  ${ue}
+                  ${ve}
                 </div>
               `:""}
           <single-select-dropdown
@@ -997,12 +997,12 @@ Consider using 'Control Panel' only for better performance."
             ?disabled="${this.logs.length===0}"
             @click="${this.clearLogs}"
           >
-            ${ge}
+            ${me}
           </button>
         </div>
       </tab-header>
       <tab-content .noContentMessage=${this.noContentMessage} .hasContent=${!!this.logs.length}>
-        ${this.logs.length===0?H`<div class="no-items">${this.getNoLogsMessage()}</div>`:Dt(this.logs,e=>H`
+        ${this.logs.length===0?H`<div class="no-items">${this.getNoLogsMessage()}</div>`:$t(this.logs,e=>H`
                 <single-log
                   .log=${e}
                   .isExpanded=${this.expandedLogIds.has(e.logId)}
@@ -1010,7 +1010,7 @@ Consider using 'Control Panel' only for better performance."
                 ></single-log>
               `)}
       </tab-content>
-    `}};h.styles=[Tt`
+    `}};h.styles=[Dt`
       :host {
         display: flex;
         flex-direction: column;
@@ -1103,7 +1103,7 @@ Consider using 'Control Panel' only for better performance."
       .warning-container:hover svg {
         stroke: #ffdc3e;
       }
-    `],i([U()],h.prototype,"logDropdown",2),i([U()],h.prototype,"filterDropdown",2),i([U()],h.prototype,"logLocation",2),i([U()],h.prototype,"eventsEnabled",2),i([U()],h.prototype,"logs",2),i([U()],h.prototype,"expandedLogIds",2),i([_t()],h.prototype,"noContentMessage",2),h=i([Mt("log-tab")],h);import{ForesightManager as _e}from"js.foresight";import{css as Qt,html as De,LitElement as ei}from"lit";import{customElement as ti,state as G}from"lit/decorators.js";var Z="points",Ce="px",Se="tabs",Te="ms";import{LitElement as Pt,html as Ut,css as Nt}from"lit";import{customElement as jt,property as B}from"lit/decorators.js";import{LitElement as Lt,html as Ot,css as $t}from"lit";import{customElement as It,property as Me}from"lit/decorators.js";var D=class extends Lt{constructor(){super(...arguments);this.header="";this.description=""}render(){return Ot`<div class="setting-item">
+    `],i([P()],h.prototype,"logDropdown",2),i([P()],h.prototype,"filterDropdown",2),i([P()],h.prototype,"logLocation",2),i([P()],h.prototype,"eventsEnabled",2),i([P()],h.prototype,"logs",2),i([P()],h.prototype,"expandedLogIds",2),i([Lt()],h.prototype,"noContentMessage",2),h=i([_t("log-tab")],h);import{ForesightManager as Le}from"js.foresight";import{css as ti,html as $e,LitElement as ii}from"lit";import{customElement as oi,state as G}from"lit/decorators.js";var Z="points",Te="px",Me="tabs",De="ms";import{LitElement as Nt,html as jt,css as Vt}from"lit";import{customElement as Ft,property as B}from"lit/decorators.js";import{LitElement as Ot,html as It,css as Ut}from"lit";import{customElement as Pt,property as _e}from"lit/decorators.js";var _=class extends Ot{constructor(){super(...arguments);this.header="";this.description=""}render(){return It`<div class="setting-item">
       <label>
         <span class="setting-header">${this.header}</span>
         <span class="setting-description"> ${this.description} </span>
@@ -1111,7 +1111,7 @@ Consider using 'Control Panel' only for better performance."
       <div class="setting-controls">
         <slot name="controls"></slot>
       </div>
-    </div>`}};D.styles=[$t`
+    </div>`}};_.styles=[Ut`
       .setting-item {
         display: flex;
         align-items: center;
@@ -1151,14 +1151,14 @@ Consider using 'Control Panel' only for better performance."
         color: #fff;
         font-size: 13px;
       }
-    `],i([Me({type:String})],D.prototype,"header",2),i([Me({type:String})],D.prototype,"description",2),D=i([It("setting-item")],D);import{ForesightManager as Vt}from"js.foresight";var x=class extends Pt{constructor(){super(...arguments);this.isChecked=!1;this.header="";this.description="";this.setting="enableMousePrediction"}handleCheckboxChange(e){let t=e.target;if(t instanceof HTMLInputElement){let o=t.checked;this.setting==="showNameTags"?this.dispatchEvent(new CustomEvent("setting-changed",{detail:{setting:this.setting,value:o},bubbles:!0})):Vt.instance.alterGlobalSettings({[this.setting]:o})}}render(){return Ut`<setting-item header=${this.header} description=${this.description}>
+    `],i([_e({type:String})],_.prototype,"header",2),i([_e({type:String})],_.prototype,"description",2),_=i([Pt("setting-item")],_);import{ForesightManager as zt}from"js.foresight";var x=class extends Nt{constructor(){super(...arguments);this.isChecked=!1;this.header="";this.description="";this.setting="enableMousePrediction"}handleCheckboxChange(e){let t=e.target;if(t instanceof HTMLInputElement){let o=t.checked;this.setting==="showNameTags"?this.dispatchEvent(new CustomEvent("setting-changed",{detail:{setting:this.setting,value:o},bubbles:!0})):zt.instance.alterGlobalSettings({[this.setting]:o})}}render(){return jt`<setting-item header=${this.header} description=${this.description}>
       <input
         slot="controls"
         type="checkbox"
         .checked=${this.isChecked}
         @change=${this.handleCheckboxChange}
       />
-    </setting-item>`}};x.styles=[Nt`
+    </setting-item>`}};x.styles=[Vt`
       input[type="checkbox"] {
         appearance: none;
         -webkit-appearance: none;
@@ -1201,7 +1201,7 @@ Consider using 'Control Panel' only for better performance."
       input[type="checkbox"]:hover {
         box-shadow: 0 0 0 3px rgba(176, 196, 222, 0.1);
       }
-    `],i([B({type:Boolean})],x.prototype,"isChecked",2),i([B({type:String})],x.prototype,"header",2),i([B({type:String})],x.prototype,"description",2),i([B({type:String})],x.prototype,"setting",2),x=i([jt("setting-item-checkbox")],x);import{LitElement as Ft,html as zt,css as Rt}from"lit";import{customElement as At,property as L,state as Ht}from"lit/decorators.js";import{ForesightManager as Bt}from"js.foresight";var p=class extends Ft{constructor(){super(...arguments);this.minValue=0;this.maxValue=100;this.currentValue=50;this.unit="px";this.header="";this.description="";this.setting="tabOffset";this.displayValue=50}handleRangeInput(e){let t=e.target;t instanceof HTMLInputElement&&(this.displayValue=parseInt(t.value,10))}handleRangeChange(e){let t=e.target;if(t instanceof HTMLInputElement){let o=parseInt(t.value,10);this.displayValue=o,Bt.instance.alterGlobalSettings({[this.setting]:o})}}willUpdate(e){super.willUpdate(e),e.has("currentValue")&&(this.displayValue=this.currentValue)}render(){return zt`<setting-item header=${this.header} description=${this.description}>
+    `],i([B({type:Boolean})],x.prototype,"isChecked",2),i([B({type:String})],x.prototype,"header",2),i([B({type:String})],x.prototype,"description",2),i([B({type:String})],x.prototype,"setting",2),x=i([Ft("setting-item-checkbox")],x);import{LitElement as Rt,html as At,css as Ht}from"lit";import{customElement as Bt,property as L,state as Gt}from"lit/decorators.js";import{ForesightManager as qt}from"js.foresight";var p=class extends Rt{constructor(){super(...arguments);this.minValue=0;this.maxValue=100;this.currentValue=50;this.unit="px";this.header="";this.description="";this.setting="tabOffset";this.displayValue=50}handleRangeInput(e){let t=e.target;t instanceof HTMLInputElement&&(this.displayValue=parseInt(t.value,10))}handleRangeChange(e){let t=e.target;if(t instanceof HTMLInputElement){let o=parseInt(t.value,10);this.displayValue=o,qt.instance.alterGlobalSettings({[this.setting]:o})}}willUpdate(e){super.willUpdate(e),e.has("currentValue")&&(this.displayValue=this.currentValue)}render(){return At`<setting-item header=${this.header} description=${this.description}>
       <div slot="controls" class="range-wrapper">
         <input
           slot="controls"
@@ -1215,7 +1215,7 @@ Consider using 'Control Panel' only for better performance."
         />
         <span class="setting-range-value">${this.displayValue} ${this.unit}</span>
       </div>
-    </setting-item>`}};p.styles=[Rt`
+    </setting-item>`}};p.styles=[Ht`
       .setting-range-value {
         font-size: 12px;
         color: #b0c4de;
@@ -1284,14 +1284,14 @@ Consider using 'Control Panel' only for better performance."
         transform: scale(1.1);
         box-shadow: 0 0 0 4px rgba(176, 196, 222, 0.2);
       }
-    `],i([L({type:Number})],p.prototype,"minValue",2),i([L({type:Number})],p.prototype,"maxValue",2),i([L({type:Number})],p.prototype,"currentValue",2),i([L({type:String})],p.prototype,"unit",2),i([L({type:String})],p.prototype,"header",2),i([L({type:String})],p.prototype,"description",2),i([L({type:String})],p.prototype,"setting",2),i([Ht()],p.prototype,"displayValue",2),p=i([At("setting-item-range")],p);var w=class extends ei{constructor(){super();this.changedSettings=[];this._abortController=null;let e=l.instance.devtoolsSettings,t=_e.instance.getManagerData.globalSettings;this.devtoolsSettings=Object.assign({},e),this.managerSettings=Object.assign({},t),this.initialSettings={devtools:Object.assign({},e),manager:Object.assign({},t)}}connectedCallback(){super.connectedCallback(),this._abortController=new AbortController;let{signal:e}=this._abortController;_e.instance.addEventListener("managerSettingsChanged",t=>{this.managerSettings=t.managerData.globalSettings,this._updateChangedSettings()},{signal:e}),this._updateChangedSettings()}disconnectedCallback(){super.disconnectedCallback(),this._abortController?.abort(),this._abortController=null}_updateChangedSettings(){let e=[];this._checkManagerSettingsChanges(e),this._checkDevtoolsSettingsChanges(e),this.changedSettings=e}_checkManagerSettingsChanges(e){let t=["enableMousePrediction","enableTabPrediction","enableScrollPrediction","trajectoryPredictionTime","positionHistorySize","tabOffset","scrollMargin"];for(let o of t){let a=this.initialSettings.manager[o],r=this.managerSettings[o];a!==r&&e.push({setting:o,oldValue:a,newValue:r})}}_checkDevtoolsSettingsChanges(e){let t=["showNameTags"];for(let o of t){let a=this.initialSettings.devtools[o],r=this.devtoolsSettings[o];a!==r&&e.push({setting:o,oldValue:a,newValue:r})}}_handleDevtoolsSettingChange(e){let{setting:t,value:o}=e.detail;t==="showNameTags"&&(this.devtoolsSettings={...this.devtoolsSettings,showNameTags:o},l.instance.alterDevtoolsSettings({showNameTags:o}),this._updateChangedSettings())}async handleCopySettings(){if(this.managerSettings)try{let e=this.generateSettingsCode(this.managerSettings);navigator.clipboard&&navigator.clipboard.writeText&&await navigator.clipboard.writeText(e)}catch(e){console.error("Failed to copy settings code:",e)}}generateSettingsCode(e){let t={enableMousePrediction:e.enableMousePrediction,enableTabPrediction:e.enableTabPrediction,enableScrollPrediction:e.enableScrollPrediction,positionHistorySize:e.positionHistorySize,trajectoryPredictionTime:e.trajectoryPredictionTime,tabOffset:e.tabOffset,scrollMargin:e.scrollMargin};return`ForesightManager.initialize(${JSON.stringify(t,null,2)})`}render(){if(!this.managerSettings||!this.devtoolsSettings)return De`<tab-content
+    `],i([L({type:Number})],p.prototype,"minValue",2),i([L({type:Number})],p.prototype,"maxValue",2),i([L({type:Number})],p.prototype,"currentValue",2),i([L({type:String})],p.prototype,"unit",2),i([L({type:String})],p.prototype,"header",2),i([L({type:String})],p.prototype,"description",2),i([L({type:String})],p.prototype,"setting",2),i([Gt()],p.prototype,"displayValue",2),p=i([Bt("setting-item-range")],p);var w=class extends ii{constructor(){super();this.changedSettings=[];this._abortController=null;let e=l.instance.devtoolsSettings,t=Le.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;Le.instance.addEventListener("managerSettingsChanged",t=>{this.managerSettings=t.managerData.globalSettings,this._updateChangedSettings()},{signal:e}),this._updateChangedSettings()}disconnectedCallback(){super.disconnectedCallback(),this._abortController?.abort(),this._abortController=null}_updateChangedSettings(){let e=[];this._checkManagerSettingsChanges(e),this._checkDevtoolsSettingsChanges(e),this.changedSettings=e}_checkManagerSettingsChanges(e){let t=["enableMousePrediction","enableTabPrediction","enableScrollPrediction","trajectoryPredictionTime","positionHistorySize","tabOffset","scrollMargin"];for(let o of t){let a=this.initialSettings.manager[o],r=this.managerSettings[o];a!==r&&e.push({setting:o,oldValue:a,newValue:r})}}_checkDevtoolsSettingsChanges(e){let t=["showNameTags"];for(let o of t){let a=this.initialSettings.devtools[o],r=this.devtoolsSettings[o];a!==r&&e.push({setting:o,oldValue:a,newValue:r})}}_handleDevtoolsSettingChange(e){let{setting:t,value:o}=e.detail;t==="showNameTags"&&(this.devtoolsSettings={...this.devtoolsSettings,showNameTags:o},l.instance.alterDevtoolsSettings({showNameTags:o}),this._updateChangedSettings())}async handleCopySettings(){if(this.managerSettings)try{let e=this.generateSettingsCode(this.managerSettings);navigator.clipboard&&navigator.clipboard.writeText&&await navigator.clipboard.writeText(e)}catch(e){console.error("Failed to copy settings code:",e)}}generateSettingsCode(e){let t={enableMousePrediction:e.enableMousePrediction,enableTabPrediction:e.enableTabPrediction,enableScrollPrediction:e.enableScrollPrediction,positionHistorySize:e.positionHistorySize,trajectoryPredictionTime:e.trajectoryPredictionTime,tabOffset:e.tabOffset,scrollMargin:e.scrollMargin};return`ForesightManager.initialize(${JSON.stringify(t,null,2)})`}render(){if(!this.managerSettings||!this.devtoolsSettings)return $e`<tab-content
         .noContentMessage=${"Loading settings..."}
         .hasContent=${!1}
       ></tab-content>`;let e=this.managerSettings,t=this.changedSettings.length>0?`Settings that have been changed this session compared to your initialized settings.
 Click on the copy icon to easely copy the new setting into your project
 
 `+this.changedSettings.map(o=>`${o.setting}: ${JSON.stringify(o.oldValue)} -> ${JSON.stringify(o.newValue)}`).join(`
-`):"No settings changed from initial values";return De`
+`):"No settings changed from initial values";return $e`
       <tab-header>
         <div slot="chips" class="chips-container">
           <chip-element .title=${t}> ${this.changedSettings.length} changed </chip-element>
@@ -1319,7 +1319,7 @@ Click on the copy icon to easely copy the new setting into your project
                 .currentValue=${e.trajectoryPredictionTime}
                 .maxValue=${200}
                 .minValue=${10}
-                .unit=${Te}
+                .unit=${De}
                 header="Prediction Time"
                 description="How far into the future to calculate mouse trajectory path"
                 setting="trajectoryPredictionTime"
@@ -1348,7 +1348,7 @@ Click on the copy icon to easely copy the new setting into your project
                 .currentValue=${e.tabOffset}
                 .maxValue=${20}
                 .minValue=${0}
-                .unit=${Se}
+                .unit=${Me}
                 header="Tab Offset"
                 description="Number of tabbable elements to look ahead when predicting navigation"
                 setting="tabOffset"
@@ -1368,7 +1368,7 @@ Click on the copy icon to easely copy the new setting into your project
                 .currentValue=${e.scrollMargin}
                 .maxValue=${300}
                 .minValue=${30}
-                .unit=${Ce}
+                .unit=${Te}
                 header="Scroll Margin"
                 description="Pixel distance to check from mouse position in scroll direction"
                 setting="scrollMargin"
@@ -1389,7 +1389,7 @@ Click on the copy icon to easely copy the new setting into your project
           </div>
         </div>
       </tab-content>
-    `}};w.styles=Qt`
+    `}};w.styles=ti`
     :host {
       display: flex;
       flex-direction: column;
@@ -1420,7 +1420,7 @@ Click on the copy icon to easely copy the new setting into your project
       border-bottom: 1px solid rgba(176, 196, 222, 0.2);
       padding-bottom: 8px;
     }
-  `,i([G()],w.prototype,"managerSettings",2),i([G()],w.prototype,"initialSettings",2),i([G()],w.prototype,"devtoolsSettings",2),i([G()],w.prototype,"changedSettings",2),w=i([ti("settings-tab")],w);var b=class extends ii{constructor(){super();this.isMinimized=!1;this.visibleCount=0;this.totalCount=0;this.localStorageSelectedTabKey="foresight-devtools-control-panel-tab";this._handleVisibilityCountChange=e=>{let t=e;this.visibleCount=t.detail.visibleCount,this.totalCount=t.detail.totalCount};let e=localStorage.getItem(this.localStorageSelectedTabKey);this.activeTab=e||"logs"}_handleTabChange(e){this.activeTab=e.detail.tab,localStorage.setItem(this.localStorageSelectedTabKey,this.activeTab)}connectedCallback(){super.connectedCallback(),this.addEventListener("visibility-count-updated",this._handleVisibilityCountChange)}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("visibility-count-updated",this._handleVisibilityCountChange)}render(){return ni`
+  `,i([G()],w.prototype,"managerSettings",2),i([G()],w.prototype,"initialSettings",2),i([G()],w.prototype,"devtoolsSettings",2),i([G()],w.prototype,"changedSettings",2),w=i([oi("settings-tab")],w);var b=class extends ni{constructor(){super();this.isMinimized=!1;this.visibleCount=0;this.totalCount=0;this.localStorageSelectedTabKey="foresight-devtools-control-panel-tab";this._handleVisibilityCountChange=e=>{let t=e;this.visibleCount=t.detail.visibleCount,this.totalCount=t.detail.totalCount};let e=localStorage.getItem(this.localStorageSelectedTabKey);this.activeTab=e||"logs"}_handleTabChange(e){this.activeTab=e.detail.tab,localStorage.setItem(this.localStorageSelectedTabKey,this.activeTab)}connectedCallback(){super.connectedCallback(),this.addEventListener("visibility-count-updated",this._handleVisibilityCountChange)}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("visibility-count-updated",this._handleVisibilityCountChange)}render(){return ai`
       <div class="control-wrapper ${this.isMinimized?"minimized":""}">
         <div class="title-wrapper">
           <button @click="${()=>this.isMinimized=!this.isMinimized}" class="minimize-button">
@@ -1449,7 +1449,7 @@ Click on the copy icon to easely copy the new setting into your project
           </div>
         </div>
       </div>
-    `}};b.styles=oi`
+    `}};b.styles=si`
     .control-wrapper {
       padding: 12px;
       position: fixed;
@@ -1531,7 +1531,14 @@ Click on the copy icon to easely copy the new setting into your project
       width: 100%;
       height: 100%;
     }
-  `,i([W()],b.prototype,"activeTab",2),i([W()],b.prototype,"isMinimized",2),i([W()],b.prototype,"visibleCount",2),i([W()],b.prototype,"totalCount",2),b=i([si("control-panel")],b);customElements.get("control-panel")||customElements.define("control-panel",b);import{LitElement as wi,css as ki,html as Ei}from"lit";import{customElement as Ci}from"lit/decorators.js";import{LitElement as ai,html as ri,css as li}from"lit";import{customElement as di,state as Le,query as ci}from"lit/decorators.js";import{ForesightManager as F}from"js.foresight";var C=class extends ai{constructor(){super(...arguments);this.overlayMap=new Map;this.callbackAnimations=new Map;this._abortController=null}connectedCallback(){super.connectedCallback(),this._abortController=new AbortController;let{signal:e}=this._abortController;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("elementDataUpdated",t=>{t.updatedProps.includes("bounds")&&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)},{signal:e}),document.addEventListener("showNameTagsChanged",t=>{let o=t;this.updateNameTagVisibility(o.detail.showNameTags)},{signal:e})}createElementOverlays(e){let t=document.createElement("div");t.className="expanded-overlay";let o=document.createElement("div");o.className="name-label",this.containerElement.appendChild(t),this.containerElement.appendChild(o);let a={expandedOverlay:t,nameLabel:o};return this.overlayMap.set(e.element,a),a}updateElementOverlays(e,t){let{expandedOverlay:o,nameLabel:a}=e,{expandedRect:r}=t.elementBounds,N=r.right-r.left,te=r.bottom-r.top;o.style.width=`${N}px`,o.style.height=`${te}px`,o.style.transform=`translate3d(${r.left}px, ${r.top}px, 0)`,l.instance.devtoolsSettings.showNameTags?(a.textContent=t.name,a.style.display="block",a.style.transform=`translate3d(${r.left}px, ${r.top-25}px, 0)`):a.style.display="none"}createOrUpdateElementOverlay(e){let t=this.overlayMap.get(e.element);t||(t=this.createElementOverlays(e)),this.updateElementOverlays(t,e)}removeElementOverlay(e){let t=this.overlayMap.get(e.element);t&&(t.expandedOverlay.remove(),t.nameLabel.remove(),this.overlayMap.delete(e.element)),this.clearCallbackAnimationTimeout(e.element)}clearCallbackAnimationTimeout(e){let t=this.callbackAnimations.get(e);t&&(clearTimeout(t.timeoutId),this.callbackAnimations.delete(e))}highlightElementCallback(e,t){let o=this.overlayMap.get(e.element);if(o)switch(this.clearCallbackAnimationTimeout(e.element),t.kind){case"mouse":o.expandedOverlay.classList.add("invoked-by-mouse");break;case"scroll":o.expandedOverlay.classList.add("invoked-by-scroll");break;case"tab":o.expandedOverlay.classList.add("invoked-by-tab");break;default:}}unhighlightElementCallback(e){let t=this.overlayMap.get(e.element);if(t){let o=setTimeout(()=>{t.expandedOverlay.classList.remove("callback-invoked"),this.callbackAnimations.delete(e.element)},400);this.callbackAnimations.set(e.element,{element:e.element,timeoutId:o})}}updateNameTagVisibility(e){this.overlayMap.forEach(t=>{let o=t.nameLabel;e?o.style.display="block":o.style.display="none"})}disconnectedCallback(){super.disconnectedCallback(),this._abortController?.abort(),this._abortController=null}render(){return ri` <div id="overlays-container"></div> `}};C.styles=[li`
+  `,i([q()],b.prototype,"activeTab",2),i([q()],b.prototype,"isMinimized",2),i([q()],b.prototype,"visibleCount",2),i([q()],b.prototype,"totalCount",2),b=i([ri("control-panel")],b);customElements.get("control-panel")||customElements.define("control-panel",b);import{LitElement as ki,css as Ci,html as Ei}from"lit";import{customElement as Si}from"lit/decorators.js";import{LitElement as li,html as ee,css as di}from"lit";import{customElement as ci,state as te}from"lit/decorators.js";import{styleMap as Oe}from"lit/directives/style-map.js";import{map as pi}from"lit/directives/map.js";import{ForesightManager as F}from"js.foresight";var E=class extends li{constructor(){super(...arguments);this.overlayDataMap=new Map;this.callbackAnimations=new Map;this.showNameTags=!1;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("elementDataUpdated",t=>{t.updatedProps.includes("bounds")&&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)},{signal:e}),document.addEventListener("showNameTagsChanged",t=>{let o=t;this.updateNameTagVisibility(o.detail.showNameTags)},{signal:e})}createOrUpdateElementOverlay(e){let{expandedRect:t}=e.elementBounds,o=t.right-t.left,a=t.bottom-t.top,r={elementData:e,expandedStyles:{width:`${o}px`,height:`${a}px`,transform:`translate3d(${t.left}px, ${t.top}px, 0)`},nameLabelStyles:{transform:`translate3d(${t.left}px, ${t.top-25}px, 0)`,display:this.showNameTags?"block":"none"},callbackClasses:[],showNameTag:this.showNameTags};this.overlayDataMap.set(e.element,r),this.requestUpdate()}removeElementOverlay(e){this.overlayDataMap.delete(e.element),this.clearCallbackAnimationTimeout(e.element),this.requestUpdate()}clearCallbackAnimationTimeout(e){let t=this.callbackAnimations.get(e);t&&(clearTimeout(t.timeoutId),this.callbackAnimations.delete(e))}highlightElementCallback(e,t){let o=this.overlayDataMap.get(e.element);if(o){this.clearCallbackAnimationTimeout(e.element);let a=`invoked-by-${t.kind}`;o.callbackClasses.includes(a)||o.callbackClasses.push(a),this.requestUpdate()}}unhighlightElementCallback(e){let t=this.overlayDataMap.get(e.element);if(t){let o=setTimeout(()=>{t.callbackClasses=[],this.callbackAnimations.delete(e.element),this.requestUpdate()},400);this.callbackAnimations.set(e.element,{element:e.element,timeoutId:o})}}updateNameTagVisibility(e){this.showNameTags=e,this.overlayDataMap.forEach(t=>{t.showNameTag=e,t.nameLabelStyles.display=e?"block":"none"}),this.requestUpdate()}disconnectedCallback(){super.disconnectedCallback(),this._abortController?.abort(),this._abortController=null,this.overlayDataMap.clear(),this.callbackAnimations.forEach(e=>clearTimeout(e.timeoutId)),this.callbackAnimations.clear()}render(){return ee`
+      ${pi(this.overlayDataMap.values(),e=>{let{elementData:t,expandedStyles:o,nameLabelStyles:a,callbackClasses:r,showNameTag:N}=e,oe=["expanded-overlay",...r].join(" ");return ee`
+          <div class="${oe}" style=${Oe(o)}></div>
+          ${N?ee`
+                <div class="name-label" style=${Oe(a)}>${t.name}</div>
+              `:""}
+        `})}
+    `}};E.styles=[di`
       :host {
         position: fixed;
         top: 0;
@@ -1547,9 +1554,7 @@ Click on the copy icon to easely copy the new setting into your project
         will-change: transform, box-shadow;
         border: 1px dashed rgba(100, 116, 139, 0.4);
         background-color: rgba(100, 116, 139, 0.05);
-        transition:
-          border-color 0.2s ease,
-          background-color 0.2s ease;
+        transition: border-color 0.2s ease, background-color 0.2s ease;
       }
 
       .expanded-overlay.invoked-by-scroll {
@@ -1600,7 +1605,7 @@ Click on the copy icon to easely copy the new setting into your project
         white-space: nowrap;
         pointer-events: none;
       }
-    `],i([Le()],C.prototype,"overlayMap",2),i([Le()],C.prototype,"callbackAnimations",2),i([ci("#overlays-container")],C.prototype,"containerElement",2),C=i([di("element-overlays")],C);import{LitElement as pi,html as gi,css as hi}from"lit";import{customElement as mi,state as ee}from"lit/decorators.js";import{styleMap as ui}from"lit/directives/style-map.js";import{ForesightManager as Y}from"js.foresight";var S=class extends pi{constructor(){super(...arguments);this._abortController=new AbortController;this._mousePredictionIsEnabled=Y.instance.getManagerData.globalSettings.enableMousePrediction;this._isVisible=!1;this._trajectoryStyles={};this._isUpdateScheduled=!1;this._latestTrajectory=null;this.handleSettingsChange=e=>{let t=e.managerData.globalSettings.enableMousePrediction;this._mousePredictionIsEnabled=t,t||(this._isVisible=!1)};this.handleTrajectoryUpdate=e=>{this._mousePredictionIsEnabled&&(this._isVisible=!0,this._latestTrajectory=e.trajectoryPositions,this._isUpdateScheduled||(this._isUpdateScheduled=!0,requestAnimationFrame(this.renderTrajectory)))};this.renderTrajectory=()=>{if(!this._latestTrajectory){this._isUpdateScheduled=!1;return}let{currentPoint:e,predictedPoint:t}=this._latestTrajectory,o=t.x-e.x,a=t.y-e.y,r=Math.sqrt(o*o+a*a);if(r===0)this._trajectoryStyles={display:"none"};else{let N=Math.atan2(a,o)*180/Math.PI;this._trajectoryStyles={transform:`translate(${e.x}px, ${e.y}px) rotate(${N}deg)`,width:`${r}px`}}this._isUpdateScheduled=!1,this.requestUpdate()}}connectedCallback(){super.connectedCallback();let{signal:e}=this._abortController;Y.instance.addEventListener("mouseTrajectoryUpdate",this.handleTrajectoryUpdate,{signal:e}),Y.instance.addEventListener("scrollTrajectoryUpdate",()=>{this._isVisible=!1},{signal:e}),Y.instance.addEventListener("managerSettingsChanged",this.handleSettingsChange,{signal:e})}disconnectedCallback(){super.disconnectedCallback(),this._abortController.abort()}render(){let e={display:this._isVisible?"block":"none",...this._trajectoryStyles};return gi` <div class="trajectory-line" style=${ui(e)}></div> `}};S.styles=[hi`
+    `],i([te()],E.prototype,"overlayDataMap",2),i([te()],E.prototype,"callbackAnimations",2),i([te()],E.prototype,"showNameTags",2),E=i([ci("element-overlays")],E);import{LitElement as gi,html as hi,css as mi}from"lit";import{customElement as ui,state as ie}from"lit/decorators.js";import{styleMap as bi}from"lit/directives/style-map.js";import{ForesightManager as W}from"js.foresight";var S=class extends gi{constructor(){super(...arguments);this._abortController=new AbortController;this._mousePredictionIsEnabled=W.instance.getManagerData.globalSettings.enableMousePrediction;this._isVisible=!1;this._trajectoryStyles={};this._isUpdateScheduled=!1;this._latestTrajectory=null;this.handleSettingsChange=e=>{let t=e.managerData.globalSettings.enableMousePrediction;this._mousePredictionIsEnabled=t,t||(this._isVisible=!1)};this.handleTrajectoryUpdate=e=>{this._mousePredictionIsEnabled&&(this._isVisible=!0,this._latestTrajectory=e.trajectoryPositions,this._isUpdateScheduled||(this._isUpdateScheduled=!0,requestAnimationFrame(this.renderTrajectory)))};this.renderTrajectory=()=>{if(!this._latestTrajectory){this._isUpdateScheduled=!1;return}let{currentPoint:e,predictedPoint:t}=this._latestTrajectory,o=t.x-e.x,a=t.y-e.y,r=Math.sqrt(o*o+a*a);if(r===0)this._trajectoryStyles={display:"none"};else{let N=Math.atan2(a,o)*180/Math.PI;this._trajectoryStyles={transform:`translate(${e.x}px, ${e.y}px) rotate(${N}deg)`,width:`${r}px`}}this._isUpdateScheduled=!1,this.requestUpdate()}}connectedCallback(){super.connectedCallback();let{signal:e}=this._abortController;W.instance.addEventListener("mouseTrajectoryUpdate",this.handleTrajectoryUpdate,{signal:e}),W.instance.addEventListener("scrollTrajectoryUpdate",()=>{this._isVisible=!1},{signal:e}),W.instance.addEventListener("managerSettingsChanged",this.handleSettingsChange,{signal:e})}disconnectedCallback(){super.disconnectedCallback(),this._abortController.abort()}render(){let e={display:this._isVisible?"block":"none",...this._trajectoryStyles};return hi` <div class="trajectory-line" style=${bi(e)}></div> `}};S.styles=[mi`
       :host {
         display: block;
       }
@@ -1631,7 +1636,7 @@ Click on the copy icon to easely copy the new setting into your project
         border-bottom: 4px solid transparent;
         filter: drop-shadow(0 0 6px rgba(59, 130, 246, 0.6));
       }
-    `],i([ee()],S.prototype,"_mousePredictionIsEnabled",2),i([ee()],S.prototype,"_isVisible",2),i([ee()],S.prototype,"_trajectoryStyles",2),S=i([mi("mouse-trajectory")],S);import{LitElement as bi,html as vi,css as yi}from"lit";import{customElement as fi,state as K}from"lit/decorators.js";import{styleMap as xi}from"lit/directives/style-map.js";import{ForesightManager as z}from"js.foresight";var k=class extends bi{constructor(){super(...arguments);this._abortController=new AbortController;this._scrollPredictionIsEnabled=z.instance.getManagerData.globalSettings.enableScrollPrediction;this._scrollMargin=z.instance.getManagerData.globalSettings.scrollMargin;this._isVisible=!1;this._trajectoryStyles={};this._isUpdateScheduled=!1;this._latestScrollTrajectory=null;this.handleSettingsChange=e=>{let t=e.managerData.globalSettings.enableScrollPrediction;this._scrollPredictionIsEnabled=t,t||(this._isVisible=!1);let o=e.updatedSettings.find(a=>a.setting==="scrollMargin");o&&(this._scrollMargin=o.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,o=t.x-e.x,a=t.y-e.y,r=Math.atan2(a,o)*180/Math.PI;this._trajectoryStyles={transform:`translate(${e.x}px, ${e.y}px) rotate(${r}deg)`},this._isUpdateScheduled=!1,this.requestUpdate()}}connectedCallback(){super.connectedCallback();let{signal:e}=this._abortController;z.instance.addEventListener("scrollTrajectoryUpdate",this.handleScrollUpdate,{signal:e}),z.instance.addEventListener("mouseTrajectoryUpdate",()=>{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",width:`${this._scrollMargin}px`,...this._trajectoryStyles};return vi` <div class="scroll-trajectory-line" style=${xi(e)}></div> `}};k.styles=[yi`
+    `],i([ie()],S.prototype,"_mousePredictionIsEnabled",2),i([ie()],S.prototype,"_isVisible",2),i([ie()],S.prototype,"_trajectoryStyles",2),S=i([ui("mouse-trajectory")],S);import{LitElement as vi,html as fi,css as yi}from"lit";import{customElement as xi,state as Y}from"lit/decorators.js";import{styleMap as wi}from"lit/directives/style-map.js";import{ForesightManager as z}from"js.foresight";var k=class extends vi{constructor(){super(...arguments);this._abortController=new AbortController;this._scrollPredictionIsEnabled=z.instance.getManagerData.globalSettings.enableScrollPrediction;this._scrollMargin=z.instance.getManagerData.globalSettings.scrollMargin;this._isVisible=!1;this._trajectoryStyles={};this._isUpdateScheduled=!1;this._latestScrollTrajectory=null;this.handleSettingsChange=e=>{let t=e.managerData.globalSettings.enableScrollPrediction;this._scrollPredictionIsEnabled=t,t||(this._isVisible=!1);let o=e.updatedSettings.find(a=>a.setting==="scrollMargin");o&&(this._scrollMargin=o.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,o=t.x-e.x,a=t.y-e.y,r=Math.atan2(a,o)*180/Math.PI;this._trajectoryStyles={transform:`translate(${e.x}px, ${e.y}px) rotate(${r}deg)`},this._isUpdateScheduled=!1,this.requestUpdate()}}connectedCallback(){super.connectedCallback();let{signal:e}=this._abortController;z.instance.addEventListener("scrollTrajectoryUpdate",this.handleScrollUpdate,{signal:e}),z.instance.addEventListener("mouseTrajectoryUpdate",()=>{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",width:`${this._scrollMargin}px`,...this._trajectoryStyles};return fi` <div class="scroll-trajectory-line" style=${wi(e)}></div> `}};k.styles=[yi`
       :host {
         display: block;
       }
@@ -1691,13 +1696,13 @@ Click on the copy icon to easely copy the new setting into your project
           filter: drop-shadow(0 0 12px rgba(234, 179, 8, 0.8));
         }
       }
-    `],i([K()],k.prototype,"_scrollPredictionIsEnabled",2),i([K()],k.prototype,"_scrollMargin",2),i([K()],k.prototype,"_isVisible",2),i([K()],k.prototype,"_trajectoryStyles",2),k=i([fi("scroll-trajectory")],k);var R=class extends wi{render(){return Ei`
+    `],i([Y()],k.prototype,"_scrollPredictionIsEnabled",2),i([Y()],k.prototype,"_scrollMargin",2),i([Y()],k.prototype,"_isVisible",2),i([Y()],k.prototype,"_trajectoryStyles",2),k=i([xi("scroll-trajectory")],k);var R=class extends ki{render(){return Ei`
       <div id="overlay-container">
         <mouse-trajectory></mouse-trajectory>
         <scroll-trajectory></scroll-trajectory>
         <element-overlays></element-overlays>
       </div>
-    `}};R.styles=[ki`
+    `}};R.styles=[Ci`
       :host {
         display: block;
       }
@@ -1708,9 +1713,9 @@ Click on the copy icon to easely copy the new setting into your project
         pointer-events: none;
         z-index: 9999;
       }
-    `],R=i([Ci("debug-overlay")],R);var l=class extends Si{constructor(){super();this.isInitialized=!1;this.devtoolsSettings={showDebugger:!0,isControlPanelDefaultMinimized:!1,showNameTags:!0,sortElementList:"visibility",logging:{logLocation:"controlPanel",callbackCompleted:!0,callbackInvoked:!0,elementDataUpdated:!1,elementRegistered:!1,elementUnregistered:!1,managerSettingsChanged:!0,mouseTrajectoryUpdate:!1,scrollTrajectoryUpdate:!1}}}static createAndAppendInstance(){typeof window>"u"||typeof document>"u"||(l._instance=document.createElement("foresight-devtools"),document.body.appendChild(l._instance))}static initialize(e){if(l._instance||l.createAndAppendInstance(),!l._instance)return l._instance;let t=l._instance;return t.isInitialized=!0,e!==void 0&&t.alterDevtoolsSettings(e),t}static get instance(){return l._instance?l._instance:l.initialize()}disconnectedCallback(){super.disconnectedCallback(),this.cleanup()}shouldUpdateSetting(e,t){return e!==void 0&&e!==t}alterDevtoolsSettings(e){e&&(this.shouldUpdateSetting(e.showNameTags,this.devtoolsSettings.showNameTags)&&(this.devtoolsSettings.showNameTags=e.showNameTags,this.dispatchEvent(new CustomEvent("showNameTagsChanged",{detail:{showNameTags:e.showNameTags},bubbles:!0}))),this.shouldUpdateSetting(e.showDebugger,this.devtoolsSettings.showDebugger)&&(this.devtoolsSettings.showDebugger=e.showDebugger,this.requestUpdate()),this.shouldUpdateSetting(e.isControlPanelDefaultMinimized,this.devtoolsSettings.isControlPanelDefaultMinimized)&&(this.devtoolsSettings.isControlPanelDefaultMinimized=e.isControlPanelDefaultMinimized),this.shouldUpdateSetting(e.sortElementList,this.devtoolsSettings.sortElementList)&&(this.devtoolsSettings.sortElementList=e.sortElementList),e.logging&&(this.shouldUpdateSetting(e.logging.logLocation,this.devtoolsSettings.logging.logLocation)&&(this.devtoolsSettings.logging.logLocation=e.logging.logLocation),this.shouldUpdateSetting(e.logging.callbackCompleted,this.devtoolsSettings.logging.callbackCompleted)&&(this.devtoolsSettings.logging.callbackCompleted=e.logging.callbackCompleted),this.shouldUpdateSetting(e.logging.callbackInvoked,this.devtoolsSettings.logging.callbackInvoked)&&(this.devtoolsSettings.logging.callbackInvoked=e.logging.callbackInvoked),this.shouldUpdateSetting(e.logging.elementDataUpdated,this.devtoolsSettings.logging.elementDataUpdated)&&(this.devtoolsSettings.logging.elementDataUpdated=e.logging.elementDataUpdated),this.shouldUpdateSetting(e.logging.elementRegistered,this.devtoolsSettings.logging.elementRegistered)&&(this.devtoolsSettings.logging.elementRegistered=e.logging.elementRegistered),this.shouldUpdateSetting(e.logging.elementUnregistered,this.devtoolsSettings.logging.elementUnregistered)&&(this.devtoolsSettings.logging.elementUnregistered=e.logging.elementUnregistered),this.shouldUpdateSetting(e.logging.managerSettingsChanged,this.devtoolsSettings.logging.managerSettingsChanged)&&(this.devtoolsSettings.logging.managerSettingsChanged=e.logging.managerSettingsChanged),this.shouldUpdateSetting(e.logging.mouseTrajectoryUpdate,this.devtoolsSettings.logging.mouseTrajectoryUpdate)&&(this.devtoolsSettings.logging.mouseTrajectoryUpdate=e.logging.mouseTrajectoryUpdate),this.shouldUpdateSetting(e.logging.scrollTrajectoryUpdate,this.devtoolsSettings.logging.scrollTrajectoryUpdate)&&(this.devtoolsSettings.logging.scrollTrajectoryUpdate=e.logging.scrollTrajectoryUpdate)))}cleanup(){this.requestUpdate()}render(){return!this.isInitialized||!this.devtoolsSettings.showDebugger?Oe``:Oe`<control-panel></control-panel> <debug-overlay></debug-overlay>`}};l.styles=[Ti`
+    `],R=i([Si("debug-overlay")],R);var l=class extends Ti{constructor(){super();this.isInitialized=!1;this.devtoolsSettings={showDebugger:!0,isControlPanelDefaultMinimized:!1,showNameTags:!0,sortElementList:"visibility",logging:{logLocation:"controlPanel",callbackCompleted:!0,callbackInvoked:!0,elementDataUpdated:!1,elementRegistered:!1,elementUnregistered:!1,managerSettingsChanged:!0,mouseTrajectoryUpdate:!1,scrollTrajectoryUpdate:!1}}}static createAndAppendInstance(){typeof window>"u"||typeof document>"u"||(l._instance=document.createElement("foresight-devtools"),document.body.appendChild(l._instance))}static initialize(e){if(l._instance||l.createAndAppendInstance(),!l._instance)return l._instance;let t=l._instance;return t.isInitialized=!0,e!==void 0&&t.alterDevtoolsSettings(e),t}static get instance(){return l._instance?l._instance:l.initialize()}disconnectedCallback(){super.disconnectedCallback(),this.cleanup()}shouldUpdateSetting(e,t){return e!==void 0&&e!==t}alterDevtoolsSettings(e){e&&(this.shouldUpdateSetting(e.showNameTags,this.devtoolsSettings.showNameTags)&&(this.devtoolsSettings.showNameTags=e.showNameTags,this.dispatchEvent(new CustomEvent("showNameTagsChanged",{detail:{showNameTags:e.showNameTags},bubbles:!0}))),this.shouldUpdateSetting(e.showDebugger,this.devtoolsSettings.showDebugger)&&(this.devtoolsSettings.showDebugger=e.showDebugger,this.requestUpdate()),this.shouldUpdateSetting(e.isControlPanelDefaultMinimized,this.devtoolsSettings.isControlPanelDefaultMinimized)&&(this.devtoolsSettings.isControlPanelDefaultMinimized=e.isControlPanelDefaultMinimized),this.shouldUpdateSetting(e.sortElementList,this.devtoolsSettings.sortElementList)&&(this.devtoolsSettings.sortElementList=e.sortElementList),e.logging&&(this.shouldUpdateSetting(e.logging.logLocation,this.devtoolsSettings.logging.logLocation)&&(this.devtoolsSettings.logging.logLocation=e.logging.logLocation),this.shouldUpdateSetting(e.logging.callbackCompleted,this.devtoolsSettings.logging.callbackCompleted)&&(this.devtoolsSettings.logging.callbackCompleted=e.logging.callbackCompleted),this.shouldUpdateSetting(e.logging.callbackInvoked,this.devtoolsSettings.logging.callbackInvoked)&&(this.devtoolsSettings.logging.callbackInvoked=e.logging.callbackInvoked),this.shouldUpdateSetting(e.logging.elementDataUpdated,this.devtoolsSettings.logging.elementDataUpdated)&&(this.devtoolsSettings.logging.elementDataUpdated=e.logging.elementDataUpdated),this.shouldUpdateSetting(e.logging.elementRegistered,this.devtoolsSettings.logging.elementRegistered)&&(this.devtoolsSettings.logging.elementRegistered=e.logging.elementRegistered),this.shouldUpdateSetting(e.logging.elementUnregistered,this.devtoolsSettings.logging.elementUnregistered)&&(this.devtoolsSettings.logging.elementUnregistered=e.logging.elementUnregistered),this.shouldUpdateSetting(e.logging.managerSettingsChanged,this.devtoolsSettings.logging.managerSettingsChanged)&&(this.devtoolsSettings.logging.managerSettingsChanged=e.logging.managerSettingsChanged),this.shouldUpdateSetting(e.logging.mouseTrajectoryUpdate,this.devtoolsSettings.logging.mouseTrajectoryUpdate)&&(this.devtoolsSettings.logging.mouseTrajectoryUpdate=e.logging.mouseTrajectoryUpdate),this.shouldUpdateSetting(e.logging.scrollTrajectoryUpdate,this.devtoolsSettings.logging.scrollTrajectoryUpdate)&&(this.devtoolsSettings.logging.scrollTrajectoryUpdate=e.logging.scrollTrajectoryUpdate)))}cleanup(){this.requestUpdate()}render(){return!this.isInitialized||!this.devtoolsSettings.showDebugger?Ie``:Ie`<control-panel></control-panel> <debug-overlay></debug-overlay>`}};l.styles=[Mi`
       :host {
         display: block;
       }
-    `],l._instance=null,i([_i()],l.prototype,"isInitialized",2),l=i([Mi("foresight-devtools")],l);export{l as ForesightDevtools};
+    `],l._instance=null,i([_i()],l.prototype,"isInitialized",2),l=i([Di("foresight-devtools")],l);export{l as ForesightDevtools};
 //# sourceMappingURL=index.mjs.map