js.foresight-devtools 1.0.5 → 1.0.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.d.ts +6 -0
- package/dist/index.js +39 -39
- package/dist/index.js.map +1 -1
- package/package.json +3 -3
package/dist/index.d.ts
CHANGED
|
@@ -249,6 +249,7 @@ interface ElementRegisteredPayload extends PayloadBase {
|
|
|
249
249
|
id: string;
|
|
250
250
|
registerCount: number;
|
|
251
251
|
hitslop: HitSlop;
|
|
252
|
+
meta: Record<string, unknown>;
|
|
252
253
|
}
|
|
253
254
|
interface ElementUnregisteredPayload extends PayloadBase {
|
|
254
255
|
type: "elementUnregistered";
|
|
@@ -257,17 +258,20 @@ interface ElementUnregisteredPayload extends PayloadBase {
|
|
|
257
258
|
registerCount: number;
|
|
258
259
|
unregisterReason: string;
|
|
259
260
|
wasLastElement: boolean;
|
|
261
|
+
meta: Record<string, unknown>;
|
|
260
262
|
}
|
|
261
263
|
interface ElementDataUpdatedPayload extends PayloadBase {
|
|
262
264
|
type: "elementDataUpdated";
|
|
263
265
|
name: string;
|
|
264
266
|
updatedProps: UpdatedDataPropertyNames[];
|
|
265
267
|
isIntersecting: boolean;
|
|
268
|
+
meta: Record<string, unknown>;
|
|
266
269
|
}
|
|
267
270
|
interface CallbackInvokedPayload extends PayloadBase {
|
|
268
271
|
type: "callbackInvoked";
|
|
269
272
|
name: string;
|
|
270
273
|
hitType: CallbackHitType;
|
|
274
|
+
meta: Record<string, unknown>;
|
|
271
275
|
}
|
|
272
276
|
interface CallbackCompletedBasePayload extends PayloadBase {
|
|
273
277
|
type: "callbackCompleted";
|
|
@@ -276,6 +280,7 @@ interface CallbackCompletedBasePayload extends PayloadBase {
|
|
|
276
280
|
callbackRunTimeRaw: number;
|
|
277
281
|
hitType: CallbackHitType;
|
|
278
282
|
status: "success" | "error";
|
|
283
|
+
meta: Record<string, unknown>;
|
|
279
284
|
}
|
|
280
285
|
type CallbackCompletedPayload = CallbackCompletedBasePayload & ({
|
|
281
286
|
status: "success";
|
|
@@ -495,6 +500,7 @@ declare class ForesightDevtools extends LitElement {
|
|
|
495
500
|
static get instance(): ForesightDevtools;
|
|
496
501
|
disconnectedCallback(): void;
|
|
497
502
|
private shouldUpdateSetting;
|
|
503
|
+
private updateLoggingSetting;
|
|
498
504
|
alterDevtoolsSettings(props?: DeepPartial<DevtoolsSettings>): void;
|
|
499
505
|
private cleanup;
|
|
500
506
|
render(): lit.TemplateResult<1>;
|
package/dist/index.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
var Pe=Object.defineProperty;var Ue=Object.getOwnPropertyDescriptor;var i=(o,s,e,t)=>{for(var n=t>1?void 0:t?Ue(s,e):s,a=o.length-1,r;a>=0;a--)(r=o[a])&&(n=(t?r(s,e,n):r(n))||n);return t&&n&&Pe(s,e,n),n};import{LitElement as Mi,css as
|
|
1
|
+
var Pe=Object.defineProperty;var Ue=Object.getOwnPropertyDescriptor;var i=(o,s,e,t)=>{for(var n=t>1?void 0:t?Ue(s,e):s,a=o.length-1,r;a>=0;a--)(r=o[a])&&(n=(t?r(s,e,n):r(n))||n);return t&&n&&Pe(s,e,n),n};import{LitElement as Mi,css as Li,html as Ie}from"lit";import{customElement as Di,state as _i}from"lit/decorators.js";import{LitElement as oi,css as ai,html as si}from"lit";import{customElement as ri,state as q}from"lit/decorators.js";import{classMap as ee}from"lit/directives/class-map.js";import{css as pt,html as xe,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 Ve,css as Fe}from"lit";import{customElement as je}from"lit/decorators.js";var F=class extends Ne{render(){return Ve`
|
|
2
2
|
<div class="tab-bar-elements">
|
|
3
3
|
<div class="tab-bar-info">
|
|
4
4
|
<div class="stats-chips">
|
|
@@ -9,7 +9,7 @@ var Pe=Object.defineProperty;var Ue=Object.getOwnPropertyDescriptor;var i=(o,s,e
|
|
|
9
9
|
<slot name="actions"></slot>
|
|
10
10
|
</div>
|
|
11
11
|
</div>
|
|
12
|
-
`}};
|
|
12
|
+
`}};F.styles=[Fe`
|
|
13
13
|
:host {
|
|
14
14
|
}
|
|
15
15
|
.tab-bar-info {
|
|
@@ -53,7 +53,7 @@ var Pe=Object.defineProperty;var Ue=Object.getOwnPropertyDescriptor;var i=(o,s,e
|
|
|
53
53
|
z-index: 5;
|
|
54
54
|
min-height: 36px;
|
|
55
55
|
}
|
|
56
|
-
`],
|
|
56
|
+
`],F=i([je("tab-header")],F);import{LitElement as ze,html as X,css as Re}from"lit";import{customElement as Ae,property as ie}from"lit/decorators.js";var M=class extends ze{constructor(){super(...arguments);this.noContentMessage="No content available.";this.hasContent=!0}render(){return X`
|
|
57
57
|
<div class="content-container">
|
|
58
58
|
${this.hasContent?X`<slot></slot>`:X`<div class="no-content-message">${this.noContentMessage}</div>`}
|
|
59
59
|
</div>
|
|
@@ -96,7 +96,7 @@ var Pe=Object.defineProperty;var Ue=Object.getOwnPropertyDescriptor;var i=(o,s,e
|
|
|
96
96
|
font-style: italic;
|
|
97
97
|
font-family: "Courier New", monospace;
|
|
98
98
|
}
|
|
99
|
-
`],i([ie({type:String,attribute:"no-content-message"})],M.prototype,"noContentMessage",2),i([ie({type:Boolean})],M.prototype,"hasContent",2),M=i([Ae("tab-content")],M);import{html as
|
|
99
|
+
`],i([ie({type:String,attribute:"no-content-message"})],M.prototype,"noContentMessage",2),i([ie({type:Boolean})],M.prototype,"hasContent",2),M=i([Ae("tab-content")],M);import{html as Ke}from"lit";import{customElement as Ye,property as oe}from"lit/decorators.js";import{LitElement as He,html as ne,css as Be}from"lit";import{property as Ge,state as We}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 n=e.getBoundingClientRect(),a=t.offsetHeight||200,r=n.bottom+5,T=window.innerWidth-n.right;window.innerHeight-n.bottom<a&&n.top>a?t.style.top=`${n.top-a-5}px`:t.style.top=`${r}px`,t.style.right=`${T}px`}}render(){let e=`trigger-button ${this.isDropdownOpen?"active":""}`,t=`dropdown-menu ${this.isDropdownOpen?"active":""}`;return ne`
|
|
100
100
|
<div class="dropdown-container">
|
|
101
101
|
<button
|
|
102
102
|
class="${e}"
|
|
@@ -250,7 +250,7 @@ var Pe=Object.defineProperty;var Ue=Object.getOwnPropertyDescriptor;var i=(o,s,e
|
|
|
250
250
|
color: #b0c4de;
|
|
251
251
|
font-weight: bold;
|
|
252
252
|
}
|
|
253
|
-
`],i([We()],d.prototype,"isDropdownOpen",2),i([Ge({type:Array})],d.prototype,"dropdownOptions",2);var
|
|
253
|
+
`],i([We()],d.prototype,"isDropdownOpen",2),i([Ge({type:Array})],d.prototype,"dropdownOptions",2);var L=d;var O=class extends L{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:Ke``}_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([oe({type:String})],O.prototype,"selectedOptionValue",2),i([oe({type:Function})],O.prototype,"onSelectionChange",2),O=i([Ye("single-select-dropdown")],O);import{LitElement as qe,html as Je,css as Xe}from"lit";import{customElement as Ze,property as Qe}from"lit/decorators.js";var I=class extends qe{constructor(){super(...arguments);this.title=""}render(){return Je`
|
|
254
254
|
<span class="chip" title="${this.title}">
|
|
255
255
|
<slot></slot>
|
|
256
256
|
</span>
|
|
@@ -274,7 +274,7 @@ var Pe=Object.defineProperty;var Ue=Object.getOwnPropertyDescriptor;var i=(o,s,e
|
|
|
274
274
|
line-height: 1.2;
|
|
275
275
|
transition: all 0.2s ease;
|
|
276
276
|
}
|
|
277
|
-
`],i([Qe({type:String})],I.prototype,"title",2),I=i([Ze("chip-element")],I);import{LitElement as rt,html as lt,css as dt}from"lit";import{customElement as ct,property as G}from"lit/decorators.js";import{LitElement as ot,html as ye,css as at}from"lit";import{customElement as st,property as
|
|
277
|
+
`],i([Qe({type:String})],I.prototype,"title",2),I=i([Ze("chip-element")],I);import{LitElement as rt,html as lt,css as dt}from"lit";import{customElement as ct,property as G}from"lit/decorators.js";import{LitElement as ot,html as ye,css as at}from"lit";import{customElement as st,property as j}from"lit/decorators.js";import{LitElement as et,html as tt,css as it}from"lit";import{customElement as nt,property as ve,state as fe}from"lit/decorators.js";import{html as p}from"lit";var ae=p`
|
|
278
278
|
<svg
|
|
279
279
|
xmlns="http://www.w3.org/2000/svg"
|
|
280
280
|
width="16"
|
|
@@ -291,7 +291,7 @@ var Pe=Object.defineProperty;var Ue=Object.getOwnPropertyDescriptor;var i=(o,s,e
|
|
|
291
291
|
<line x1="7" y1="21" x2="17" y2="21"></line>
|
|
292
292
|
<line x1="12" y1="17" x2="12" y2="21"></line>
|
|
293
293
|
</svg>
|
|
294
|
-
`,se=
|
|
294
|
+
`,se=p`
|
|
295
295
|
<svg
|
|
296
296
|
xmlns="http://www.w3.org/2000/svg"
|
|
297
297
|
width="16"
|
|
@@ -306,7 +306,7 @@ var Pe=Object.defineProperty;var Ue=Object.getOwnPropertyDescriptor;var i=(o,s,e
|
|
|
306
306
|
<polyline points="4 17 10 11 4 5"></polyline>
|
|
307
307
|
<line x1="12" y1="19" x2="20" y2="19"></line>
|
|
308
308
|
</svg>
|
|
309
|
-
`,re=
|
|
309
|
+
`,re=p`
|
|
310
310
|
<svg
|
|
311
311
|
xmlns="http://www.w3.org/2000/svg"
|
|
312
312
|
width="16"
|
|
@@ -322,7 +322,7 @@ var Pe=Object.defineProperty;var Ue=Object.getOwnPropertyDescriptor;var i=(o,s,e
|
|
|
322
322
|
<path d="M13.73 21a2 2 0 0 1-3.46 0"></path>
|
|
323
323
|
<line x1="1" y1="1" x2="23" y2="23"></line>
|
|
324
324
|
</svg>
|
|
325
|
-
`,le=
|
|
325
|
+
`,le=p`
|
|
326
326
|
<svg
|
|
327
327
|
xmlns="http://www.w3.org/2000/svg"
|
|
328
328
|
width="16"
|
|
@@ -340,7 +340,7 @@ var Pe=Object.defineProperty;var Ue=Object.getOwnPropertyDescriptor;var i=(o,s,e
|
|
|
340
340
|
<circle cx="6" cy="18" r="2" />
|
|
341
341
|
<circle cx="18" cy="18" r="2" />
|
|
342
342
|
</svg>
|
|
343
|
-
`,de=
|
|
343
|
+
`,de=p`
|
|
344
344
|
<svg
|
|
345
345
|
xmlns="http://www.w3.org/2000/svg"
|
|
346
346
|
width="16"
|
|
@@ -355,7 +355,7 @@ var Pe=Object.defineProperty;var Ue=Object.getOwnPropertyDescriptor;var i=(o,s,e
|
|
|
355
355
|
<path d="M2 12s3-7 10-7 10 7 10 7-3 7-10 7-10-7-10-7Z" />
|
|
356
356
|
<circle cx="12" cy="12" r="3" />
|
|
357
357
|
</svg>
|
|
358
|
-
`,ce=
|
|
358
|
+
`,ce=p`
|
|
359
359
|
<svg
|
|
360
360
|
xmlns="http://www.w3.org/2000/svg"
|
|
361
361
|
width="16"
|
|
@@ -373,7 +373,7 @@ var Pe=Object.defineProperty;var Ue=Object.getOwnPropertyDescriptor;var i=(o,s,e
|
|
|
373
373
|
<line x1="16" y1="17" x2="8" y2="17" />
|
|
374
374
|
<line x1="10" y1="9" x2="8" y2="9" />
|
|
375
375
|
</svg>
|
|
376
|
-
`,
|
|
376
|
+
`,pe=p`
|
|
377
377
|
<svg
|
|
378
378
|
xmlns="http://www.w3.org/2000/svg"
|
|
379
379
|
width="16"
|
|
@@ -387,7 +387,7 @@ var Pe=Object.defineProperty;var Ue=Object.getOwnPropertyDescriptor;var i=(o,s,e
|
|
|
387
387
|
>
|
|
388
388
|
<path d="M8 6h13M8 12h13M8 18h13M3 6h.01M3 12h.01M3 18h.01" />
|
|
389
389
|
</svg>
|
|
390
|
-
`,m=
|
|
390
|
+
`,m=p`
|
|
391
391
|
<svg
|
|
392
392
|
xmlns="http://www.w3.org/2000/svg"
|
|
393
393
|
width="16"
|
|
@@ -401,7 +401,7 @@ var Pe=Object.defineProperty;var Ue=Object.getOwnPropertyDescriptor;var i=(o,s,e
|
|
|
401
401
|
>
|
|
402
402
|
<polygon points="22,3 2,3 10,12.46 10,19 14,21 14,12.46" />
|
|
403
403
|
</svg>
|
|
404
|
-
`,
|
|
404
|
+
`,ge=p`
|
|
405
405
|
<svg
|
|
406
406
|
xmlns="http://www.w3.org/2000/svg"
|
|
407
407
|
width="16"
|
|
@@ -416,7 +416,7 @@ var Pe=Object.defineProperty;var Ue=Object.getOwnPropertyDescriptor;var i=(o,s,e
|
|
|
416
416
|
<circle cx="12" cy="12" r="10" />
|
|
417
417
|
<line x1="4.93" y1="4.93" x2="19.07" y2="19.07" />
|
|
418
418
|
</svg>
|
|
419
|
-
`,he=
|
|
419
|
+
`,he=p`
|
|
420
420
|
<svg
|
|
421
421
|
xmlns="http://www.w3.org/2000/svg"
|
|
422
422
|
width="24"
|
|
@@ -431,7 +431,7 @@ var Pe=Object.defineProperty;var Ue=Object.getOwnPropertyDescriptor;var i=(o,s,e
|
|
|
431
431
|
<rect x="9" y="9" width="13" height="13" rx="2" ry="2"></rect>
|
|
432
432
|
<path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"></path>
|
|
433
433
|
</svg>
|
|
434
|
-
`,me=
|
|
434
|
+
`,me=p`
|
|
435
435
|
<svg
|
|
436
436
|
xmlns="http://www.w3.org/2000/svg"
|
|
437
437
|
width="24"
|
|
@@ -445,7 +445,7 @@ var Pe=Object.defineProperty;var Ue=Object.getOwnPropertyDescriptor;var i=(o,s,e
|
|
|
445
445
|
>
|
|
446
446
|
<polyline points="20 6 9 17 4 12"></polyline>
|
|
447
447
|
</svg>
|
|
448
|
-
`,ue=
|
|
448
|
+
`,ue=p`
|
|
449
449
|
<svg
|
|
450
450
|
xmlns="http://www.w3.org/2000/svg"
|
|
451
451
|
width="16"
|
|
@@ -463,7 +463,7 @@ var Pe=Object.defineProperty;var Ue=Object.getOwnPropertyDescriptor;var i=(o,s,e
|
|
|
463
463
|
<line x1="12" y1="9" x2="12" y2="13"></line>
|
|
464
464
|
<line x1="12" y1="17" x2="12.01" y2="17"></line>
|
|
465
465
|
</svg>
|
|
466
|
-
`,be=
|
|
466
|
+
`,be=p`
|
|
467
467
|
<svg
|
|
468
468
|
xmlns="http://www.w3.org/2000/svg"
|
|
469
469
|
width="16"
|
|
@@ -654,7 +654,7 @@ var Pe=Object.defineProperty;var Ue=Object.getOwnPropertyDescriptor;var i=(o,s,e
|
|
|
654
654
|
display: block;
|
|
655
655
|
overflow-x: auto;
|
|
656
656
|
}
|
|
657
|
-
`],i([
|
|
657
|
+
`],i([j()],u.prototype,"borderColor",2),i([j()],u.prototype,"showCopyButton",2),i([j()],u.prototype,"itemId",2),i([j()],u.prototype,"isExpanded",2),i([j()],u.prototype,"onToggle",2),u=i([st("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=this.elementData,t={tagName:e.element.tagName.toLowerCase(),isIntersecting:e.isIntersectingWithViewport,registerCount:e.registerCount,hitSlop:{top:e.elementBounds.hitSlop.top,right:e.elementBounds.hitSlop.right,bottom:e.elementBounds.hitSlop.bottom,left:e.elementBounds.hitSlop.left},meta:this.elementData.meta};return JSON.stringify(t,null,2)}render(){return lt`
|
|
658
658
|
<expandable-item
|
|
659
659
|
.borderColor=${this.getBorderColor()}
|
|
660
660
|
.showCopyButton=${!0}
|
|
@@ -718,7 +718,7 @@ var Pe=Object.defineProperty;var Ue=Object.getOwnPropertyDescriptor;var i=(o,s,e
|
|
|
718
718
|
color: #fff;
|
|
719
719
|
font-weight: 600;
|
|
720
720
|
}
|
|
721
|
-
`],i([G()],f.prototype,"elementData",2),i([G()],f.prototype,"isActive",2),i([G()],f.prototype,"isExpanded",2),i([G()],f.prototype,"onToggle",2),f=i([ct("single-element")],f);import{ForesightManager as P}from"js.foresight";var c=class extends
|
|
721
|
+
`],i([G()],f.prototype,"elementData",2),i([G()],f.prototype,"isActive",2),i([G()],f.prototype,"isExpanded",2),i([G()],f.prototype,"onToggle",2),f=i([ct("single-element")],f);import{ForesightManager as P}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 n=e.element.compareDocumentPosition(t.element);return n&Node.DOCUMENT_POSITION_FOLLOWING?-1:n&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(n=>{t++,n.isIntersectingWithViewport&&e++}),this.visibleElementsCount=e,this.totalElementsCount=t,this.dispatchEvent(new CustomEvent("visibility-count-updated",{detail:{visibleCount:e,totalCount:t},bubbles:!0,composed:!0}))}_generateHitsChipTitle(e){let t=[];return t.push(`Total Hits: ${e.total}`),t.push(""),t.push(`Mouse: Trajectory: ${e.mouse.trajectory}, Hover: ${e.mouse.hover}`),t.push(`Scroll: Up: ${e.scroll.up}, Down: ${e.scroll.down}, Left: ${e.scroll.left}, Right: ${e.scroll.right}`),t.push(`Tab: Forwards: ${e.tab.forwards}, Reverse: ${e.tab.reverse}`),t.join(`
|
|
722
722
|
`)}connectedCallback(){super.connectedCallback(),this._abortController=new AbortController;let{signal:e}=this._abortController;this.updateElementListFromManager(),this.updateVisibilityCounts(),P.instance.addEventListener("elementRegistered",t=>{let n={...t.elementData,elementId:this.generateElementId()};this.elementListItems.set(t.elementData.element,n),this.updateVisibilityCounts()},{signal:e}),P.instance.addEventListener("elementDataUpdated",t=>{let n=this.elementListItems.get(t.elementData.element);if(n){let a={...t.elementData,elementId:n.elementId};this.elementListItems.set(t.elementData.element,a),this.updateVisibilityCounts(),this.requestUpdate()}},{signal:e}),P.instance.addEventListener("elementUnregistered",t=>{this.elementListItems.delete(t.elementData.element),this.updateVisibilityCounts(),this.elementListItems.size||(this.noContentMessage="No Elements Registered To The Foresight Manager"),this.requestUpdate(),this.activeCallbacks.delete(t.elementData.element)},{signal:e}),P.instance.addEventListener("callbackInvoked",t=>{this.activeCallbacks.add(t.elementData.element),this.requestUpdate()},{signal:e}),P.instance.addEventListener("callbackCompleted",t=>{this.handleCallbackCompleted(t.hitType),this.activeCallbacks.delete(t.elementData.element)},{signal:e})}disconnectedCallback(){super.disconnectedCallback(),this._abortController?.abort(),this._abortController=null}updateElementListFromManager(){let e=new Map;P.instance.registeredElements.forEach((t,n)=>{e.set(n,{...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,n)=>t.isIntersectingWithViewport!==n.isIntersectingWithViewport?t.isIntersectingWithViewport?-1:1:this.sortByDocumentPosition(t,n));default:return this.sortOrder,e}}render(){return xe`
|
|
723
723
|
<tab-header>
|
|
724
724
|
<div slot="chips" class="chips-container">
|
|
@@ -750,7 +750,7 @@ var Pe=Object.defineProperty;var Ue=Object.getOwnPropertyDescriptor;var i=(o,s,e
|
|
|
750
750
|
></single-element>
|
|
751
751
|
`)}
|
|
752
752
|
</tab-content>
|
|
753
|
-
`}};c.styles=
|
|
753
|
+
`}};c.styles=pt`
|
|
754
754
|
:host {
|
|
755
755
|
display: flex;
|
|
756
756
|
flex-direction: column;
|
|
@@ -848,8 +848,8 @@ var Pe=Object.defineProperty;var Ue=Object.getOwnPropertyDescriptor;var i=(o,s,e
|
|
|
848
848
|
color: #b0c4de;
|
|
849
849
|
border-bottom-color: #b0c4de;
|
|
850
850
|
}
|
|
851
|
-
`,i([ft({type:String})],U.prototype,"activeTab",2),U=i([vt("tab-selector")],U);import{ForesightManager as z}from"js.foresight";import{LitElement as Mt,css as
|
|
852
|
-
${o.globalCallbackHits.total} hits`}}function ke(o,s){try{switch(o.type){case"elementRegistered":return{type:"elementRegistered",name:o.elementData.name,id:o.elementData.element.id||"",registerCount:o.elementData.registerCount,hitslop:o.elementData.elementBounds.hitSlop,localizedTimestamp:new Date(o.timestamp).toLocaleTimeString(),logId:s,summary:o.elementData.registerCount===1?o.elementData.name:`${o.elementData.name} - ${xt(o.elementData.registerCount)} time`};case"elementUnregistered":return{type:"elementUnregistered",name:o.elementData.name,id:o.elementData.element.id||"",registerCount:o.elementData.registerCount,unregisterReason:o.unregisterReason,wasLastElement:o.wasLastElement,localizedTimestamp:new Date(o.timestamp).toLocaleTimeString(),logId:s,summary:`${o.elementData.name} - ${o.unregisterReason}`};case"elementDataUpdated":return{type:"elementDataUpdated",name:o.elementData.name,updatedProps:o.updatedProps||[],isIntersecting:o.elementData.isIntersectingWithViewport,localizedTimestamp:new Date().toLocaleTimeString(),logId:s,summary:`${o.elementData.name} - ${o.updatedProps.toString()}`};case"callbackInvoked":return{type:"callbackInvoked",name:o.elementData.name,hitType:o.hitType,localizedTimestamp:new Date(o.timestamp).toLocaleTimeString(),logId:s,summary:`${o.elementData.name} - ${o.hitType.kind}`};case"callbackCompleted":{let e=yt(o.elapsed);return{type:"callbackCompleted",...o.status==="error"?{status:"error",errorMessage:o.errorMessage}:{status:"success"},name:o.elementData.name,hitType:o.hitType,callbackRunTimeFormatted:e,callbackRunTimeRaw:o.elapsed,localizedTimestamp:new Date(o.timestamp).toLocaleTimeString(),logId:s,summary:`${o.elementData.name} - ${e}`}}case"mouseTrajectoryUpdate":return{type:"mouseTrajectoryUpdate",currentPoint:o.trajectoryPositions?.currentPoint,predictedPoint:o.trajectoryPositions?.predictedPoint,positionCount:o.trajectoryPositions?.positions?.length||0,mousePredictionEnabled:o.predictionEnabled,localizedTimestamp:new Date().toLocaleTimeString(),logId:s,summary:""};case"scrollTrajectoryUpdate":return{type:"scrollTrajectoryUpdate",currentPoint:o.currentPoint,predictedPoint:o.predictedPoint,scrollDirection:o.scrollDirection,localizedTimestamp:new Date().toLocaleTimeString(),logId:s,summary:o.scrollDirection};case"managerSettingsChanged":return{type:"managerSettingsChanged",globalSettings:o.managerData?.globalSettings||{},settingsChanged:o.updatedSettings,localizedTimestamp:new Date(o.timestamp).toLocaleTimeString(),logId:s,summary:o.updatedSettings.map(e=>e.setting).join(", ")};default:return{type:"serializationError",error:"Failed to serialize event data",errorMessage:JSON.stringify(o),localizedTimestamp:new Date().toLocaleTimeString(),logId:s,summary:""}}}catch(e){return{type:"serializationError",error:"Failed to serialize event data",localizedTimestamp:new Date().toLocaleTimeString(),errorMessage:e instanceof Error?e.message:String(e),logId:s,summary:""}}}function yt(o){return`${(o/1e3).toFixed(4)} s`}function xt(o){let s=["th","st","nd","rd"],e=o%100;return o+(s[(e-20)%10]||s[e]||s[0])}import{html as Ce,css as wt}from"lit";import{customElement as Et,property as Se}from"lit/decorators.js";var
|
|
851
|
+
`,i([ft({type:String})],U.prototype,"activeTab",2),U=i([vt("tab-selector")],U);import{ForesightManager as z}from"js.foresight";import{LitElement as Mt,css as Lt,html as W}from"lit";import{customElement as Dt,property as _t,state as N}from"lit/decorators.js";import{map as $t}from"lit/directives/map.js";function Ee(o,s){let e={};o.eventListeners.forEach((n,a)=>{e[a]=n.length});let t=[];return o.registeredElements.forEach((n,a)=>{let{element:r,...T}=n;t.push({...T,elementInfo:`${a.tagName.toLowerCase()}${a.id?`#${a.id}`:""}${a.className?`.${a.className.replace(/\s+/g,".")}`:""}`})}),{type:"managerDataPayload",warning:"this is a lot easier to view in the console",logId:s,globalCallbackHits:o.globalCallbackHits,localizedTimestamp:new Date().toLocaleTimeString(),eventListenerCount:e,managerSettings:o.globalSettings,registeredElements:t,summary:`${t.length} elements, ${Object.values(e).flat().length} listeners,
|
|
852
|
+
${o.globalCallbackHits.total} hits`}}function ke(o,s){try{switch(o.type){case"elementRegistered":return{type:"elementRegistered",name:o.elementData.name,id:o.elementData.element.id||"",registerCount:o.elementData.registerCount,hitslop:o.elementData.elementBounds.hitSlop,localizedTimestamp:new Date(o.timestamp).toLocaleTimeString(),meta:o.elementData.meta,logId:s,summary:o.elementData.registerCount===1?o.elementData.name:`${o.elementData.name} - ${xt(o.elementData.registerCount)} time`};case"elementUnregistered":return{type:"elementUnregistered",name:o.elementData.name,id:o.elementData.element.id||"",registerCount:o.elementData.registerCount,unregisterReason:o.unregisterReason,wasLastElement:o.wasLastElement,meta:o.elementData.meta,localizedTimestamp:new Date(o.timestamp).toLocaleTimeString(),logId:s,summary:`${o.elementData.name} - ${o.unregisterReason}`};case"elementDataUpdated":return{type:"elementDataUpdated",name:o.elementData.name,updatedProps:o.updatedProps||[],isIntersecting:o.elementData.isIntersectingWithViewport,meta:o.elementData.meta,localizedTimestamp:new Date().toLocaleTimeString(),logId:s,summary:`${o.elementData.name} - ${o.updatedProps.toString()}`};case"callbackInvoked":return{type:"callbackInvoked",name:o.elementData.name,hitType:o.hitType,meta:o.elementData.meta,localizedTimestamp:new Date(o.timestamp).toLocaleTimeString(),logId:s,summary:`${o.elementData.name} - ${o.hitType.kind}`};case"callbackCompleted":{let e=yt(o.elapsed);return{type:"callbackCompleted",...o.status==="error"?{status:"error",errorMessage:o.errorMessage}:{status:"success"},name:o.elementData.name,hitType:o.hitType,callbackRunTimeFormatted:e,callbackRunTimeRaw:o.elapsed,meta:o.elementData.meta,localizedTimestamp:new Date(o.timestamp).toLocaleTimeString(),logId:s,summary:`${o.elementData.name} - ${e}`}}case"mouseTrajectoryUpdate":return{type:"mouseTrajectoryUpdate",currentPoint:o.trajectoryPositions?.currentPoint,predictedPoint:o.trajectoryPositions?.predictedPoint,positionCount:o.trajectoryPositions?.positions?.length||0,mousePredictionEnabled:o.predictionEnabled,localizedTimestamp:new Date().toLocaleTimeString(),logId:s,summary:""};case"scrollTrajectoryUpdate":return{type:"scrollTrajectoryUpdate",currentPoint:o.currentPoint,predictedPoint:o.predictedPoint,scrollDirection:o.scrollDirection,localizedTimestamp:new Date().toLocaleTimeString(),logId:s,summary:o.scrollDirection};case"managerSettingsChanged":return{type:"managerSettingsChanged",globalSettings:o.managerData?.globalSettings||{},settingsChanged:o.updatedSettings,localizedTimestamp:new Date(o.timestamp).toLocaleTimeString(),logId:s,summary:o.updatedSettings.map(e=>e.setting).join(", ")};default:return{type:"serializationError",error:"Failed to serialize event data",errorMessage:JSON.stringify(o),localizedTimestamp:new Date().toLocaleTimeString(),logId:s,summary:""}}}catch(e){return{type:"serializationError",error:"Failed to serialize event data",localizedTimestamp:new Date().toLocaleTimeString(),errorMessage:e instanceof Error?e.message:String(e),logId:s,summary:""}}}function yt(o){return`${(o/1e3).toFixed(4)} s`}function xt(o){let s=["th","st","nd","rd"],e=o%100;return o+(s[(e-20)%10]||s[e]||s[0])}import{html as Ce,css as wt}from"lit";import{customElement as Et,property as Se}from"lit/decorators.js";var D=class extends L{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 n=!t;this.onSelectionChange?.(e.value,n)}_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 Ce`
|
|
853
853
|
<div class="dropdown-container">
|
|
854
854
|
<button
|
|
855
855
|
class="${e}"
|
|
@@ -889,7 +889,7 @@ var Pe=Object.defineProperty;var Ue=Object.getOwnPropertyDescriptor;var i=(o,s,e
|
|
|
889
889
|
`)}
|
|
890
890
|
</div>
|
|
891
891
|
</div>
|
|
892
|
-
`}};
|
|
892
|
+
`}};D.styles=[...L.styles,wt`
|
|
893
893
|
.dropdown-menu button.active::after {
|
|
894
894
|
content: "✓";
|
|
895
895
|
position: absolute;
|
|
@@ -905,7 +905,7 @@ var Pe=Object.defineProperty;var Ue=Object.getOwnPropertyDescriptor;var i=(o,s,e
|
|
|
905
905
|
color: #b0c4de;
|
|
906
906
|
margin-left: 2px;
|
|
907
907
|
}
|
|
908
|
-
`],i([Se({type:Array})],
|
|
908
|
+
`],i([Se({type:Array})],D.prototype,"selectedValues",2),i([Se()],D.prototype,"onSelectionChange",2),D=i([Et("multi-select-dropdown")],D);import{LitElement as kt,html as Ct,css as St}from"lit";import{customElement as Tt,property as Z}from"lit/decorators.js";var k=class extends kt{constructor(e){super();this.isExpanded=!1;this.log=e}updated(e){if(e.has("log")&&this.log){let t=this.log,n=t.type==="callbackCompleted"&&"status"in t&&t.status==="error",a=n?"#f44336":this.getLogTypeColor(t.type),r=n?"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,...n}=e;return JSON.stringify(n,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",managerDataPayload:"ManagerData"}[e]||e}truncateLogSummary(e,t=50){return e.length<=t?e:e.substring(0,t)+"..."}render(){let e=this.log,n=e.type==="callbackCompleted"&&"status"in e&&e.status==="error"?"#f44336":this.getLogTypeColor(e.type);return Ct`
|
|
909
909
|
<expandable-item
|
|
910
910
|
.borderColor=${n}
|
|
911
911
|
.itemId=${e.logId}
|
|
@@ -1026,7 +1026,7 @@ Consider using 'Control Panel' only for better performance."
|
|
|
1026
1026
|
?disabled="${this.logs.length===0}"
|
|
1027
1027
|
@click="${this.clearLogs}"
|
|
1028
1028
|
>
|
|
1029
|
-
${
|
|
1029
|
+
${ge}
|
|
1030
1030
|
</button>
|
|
1031
1031
|
</div>
|
|
1032
1032
|
</tab-header>
|
|
@@ -1039,7 +1039,7 @@ Consider using 'Control Panel' only for better performance."
|
|
|
1039
1039
|
></single-log>
|
|
1040
1040
|
`)}
|
|
1041
1041
|
</tab-content>
|
|
1042
|
-
`}};h.styles=[
|
|
1042
|
+
`}};h.styles=[Lt`
|
|
1043
1043
|
:host {
|
|
1044
1044
|
display: flex;
|
|
1045
1045
|
flex-direction: column;
|
|
@@ -1132,7 +1132,7 @@ Consider using 'Control Panel' only for better performance."
|
|
|
1132
1132
|
.warning-container:hover svg {
|
|
1133
1133
|
stroke: #ffdc3e;
|
|
1134
1134
|
}
|
|
1135
|
-
`],i([N()],h.prototype,"logDropdown",2),i([N()],h.prototype,"filterDropdown",2),i([N()],h.prototype,"logLocation",2),i([N()],h.prototype,"eventsEnabled",2),i([N()],h.prototype,"logs",2),i([N()],h.prototype,"expandedLogIds",2),i([_t()],h.prototype,"noContentMessage",2),h=i([
|
|
1135
|
+
`],i([N()],h.prototype,"logDropdown",2),i([N()],h.prototype,"filterDropdown",2),i([N()],h.prototype,"logLocation",2),i([N()],h.prototype,"eventsEnabled",2),i([N()],h.prototype,"logs",2),i([N()],h.prototype,"expandedLogIds",2),i([_t()],h.prototype,"noContentMessage",2),h=i([Dt("log-tab")],h);import{ForesightManager as _e}from"js.foresight";import{css as ti,html as $e,LitElement as ii}from"lit";import{customElement as ni,state as Y}from"lit/decorators.js";var Q="points",Te="px",Me="tabs",Le="ms";import{LitElement as Nt,html as Vt,css as Ft}from"lit";import{customElement as jt,property as K}from"lit/decorators.js";import{LitElement as Ot,html as It,css as Pt}from"lit";import{customElement as Ut,property as De}from"lit/decorators.js";var _=class extends Ot{constructor(){super(...arguments);this.header="";this.description=""}render(){return It`<div class="setting-item">
|
|
1136
1136
|
<label>
|
|
1137
1137
|
<span class="setting-header">${this.header}</span>
|
|
1138
1138
|
<span class="setting-description"> ${this.description} </span>
|
|
@@ -1180,14 +1180,14 @@ Consider using 'Control Panel' only for better performance."
|
|
|
1180
1180
|
color: #fff;
|
|
1181
1181
|
font-size: 13px;
|
|
1182
1182
|
}
|
|
1183
|
-
`],i([
|
|
1183
|
+
`],i([De({type:String})],_.prototype,"header",2),i([De({type:String})],_.prototype,"description",2),_=i([Ut("setting-item")],_);import{ForesightManager as zt}from"js.foresight";var x=class extends Nt{constructor(){super(...arguments);this.isChecked=!1;this.header="";this.description="";this.setting="enableMousePrediction"}handleCheckboxChange(e){let t=e.target;if(t instanceof HTMLInputElement){let n=t.checked;this.setting==="showNameTags"?this.dispatchEvent(new CustomEvent("setting-changed",{detail:{setting:this.setting,value:n},bubbles:!0})):zt.instance.alterGlobalSettings({[this.setting]:n})}}render(){return Vt`<setting-item header=${this.header} description=${this.description}>
|
|
1184
1184
|
<input
|
|
1185
1185
|
slot="controls"
|
|
1186
1186
|
type="checkbox"
|
|
1187
1187
|
.checked=${this.isChecked}
|
|
1188
1188
|
@change=${this.handleCheckboxChange}
|
|
1189
1189
|
/>
|
|
1190
|
-
</setting-item>`}};x.styles=[
|
|
1190
|
+
</setting-item>`}};x.styles=[Ft`
|
|
1191
1191
|
input[type="checkbox"] {
|
|
1192
1192
|
appearance: none;
|
|
1193
1193
|
-webkit-appearance: none;
|
|
@@ -1230,7 +1230,7 @@ Consider using 'Control Panel' only for better performance."
|
|
|
1230
1230
|
input[type="checkbox"]:hover {
|
|
1231
1231
|
box-shadow: 0 0 0 3px rgba(176, 196, 222, 0.1);
|
|
1232
1232
|
}
|
|
1233
|
-
`],i([
|
|
1233
|
+
`],i([K({type:Boolean})],x.prototype,"isChecked",2),i([K({type:String})],x.prototype,"header",2),i([K({type:String})],x.prototype,"description",2),i([K({type:String})],x.prototype,"setting",2),x=i([jt("setting-item-checkbox")],x);import{LitElement as Rt,html as At,css as Ht}from"lit";import{customElement as Bt,property as $,state as Gt}from"lit/decorators.js";import{ForesightManager as Wt}from"js.foresight";var g=class extends Rt{constructor(){super(...arguments);this.minValue=0;this.maxValue=100;this.currentValue=50;this.unit="px";this.header="";this.description="";this.setting="tabOffset";this.displayValue=50}handleRangeInput(e){let t=e.target;t instanceof HTMLInputElement&&(this.displayValue=parseInt(t.value,10))}handleRangeChange(e){let t=e.target;if(t instanceof HTMLInputElement){let n=parseInt(t.value,10);this.displayValue=n,Wt.instance.alterGlobalSettings({[this.setting]:n})}}willUpdate(e){super.willUpdate(e),e.has("currentValue")&&(this.displayValue=this.currentValue)}render(){return At`<setting-item header=${this.header} description=${this.description}>
|
|
1234
1234
|
<div slot="controls" class="range-wrapper">
|
|
1235
1235
|
<input
|
|
1236
1236
|
slot="controls"
|
|
@@ -1244,7 +1244,7 @@ Consider using 'Control Panel' only for better performance."
|
|
|
1244
1244
|
/>
|
|
1245
1245
|
<span class="setting-range-value">${this.displayValue} ${this.unit}</span>
|
|
1246
1246
|
</div>
|
|
1247
|
-
</setting-item>`}};
|
|
1247
|
+
</setting-item>`}};g.styles=[Ht`
|
|
1248
1248
|
.setting-range-value {
|
|
1249
1249
|
font-size: 12px;
|
|
1250
1250
|
color: #b0c4de;
|
|
@@ -1313,7 +1313,7 @@ Consider using 'Control Panel' only for better performance."
|
|
|
1313
1313
|
transform: scale(1.1);
|
|
1314
1314
|
box-shadow: 0 0 0 4px rgba(176, 196, 222, 0.2);
|
|
1315
1315
|
}
|
|
1316
|
-
`],i([$({type:Number})],
|
|
1316
|
+
`],i([$({type:Number})],g.prototype,"minValue",2),i([$({type:Number})],g.prototype,"maxValue",2),i([$({type:Number})],g.prototype,"currentValue",2),i([$({type:String})],g.prototype,"unit",2),i([$({type:String})],g.prototype,"header",2),i([$({type:String})],g.prototype,"description",2),i([$({type:String})],g.prototype,"setting",2),i([Gt()],g.prototype,"displayValue",2),g=i([Bt("setting-item-range")],g);var w=class extends ii{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 n of t){let a=this.initialSettings.manager[n],r=this.managerSettings[n];a!==r&&e.push({setting:n,oldValue:a,newValue:r})}}_checkDevtoolsSettingsChanges(e){let t=["showNameTags"];for(let n of t){let a=this.initialSettings.devtools[n],r=this.devtoolsSettings[n];a!==r&&e.push({setting:n,oldValue:a,newValue:r})}}_handleDevtoolsSettingChange(e){let{setting:t,value:n}=e.detail;t==="showNameTags"&&(this.devtoolsSettings={...this.devtoolsSettings,showNameTags:n},l.instance.alterDevtoolsSettings({showNameTags:n}),this._updateChangedSettings())}async handleCopySettings(){if(this.managerSettings)try{let e=this.generateSettingsCode(this.managerSettings);navigator.clipboard&&navigator.clipboard.writeText&&await navigator.clipboard.writeText(e)}catch(e){console.error("Failed to copy settings code:",e)}}generateSettingsCode(e){let t={enableMousePrediction:e.enableMousePrediction,enableTabPrediction:e.enableTabPrediction,enableScrollPrediction:e.enableScrollPrediction,positionHistorySize:e.positionHistorySize,trajectoryPredictionTime:e.trajectoryPredictionTime,tabOffset:e.tabOffset,scrollMargin:e.scrollMargin};return`ForesightManager.initialize(${JSON.stringify(t,null,2)})`}render(){if(!this.managerSettings||!this.devtoolsSettings)return $e`<tab-content
|
|
1317
1317
|
.noContentMessage=${"Loading settings..."}
|
|
1318
1318
|
.hasContent=${!1}
|
|
1319
1319
|
></tab-content>`;let e=this.managerSettings,t=this.changedSettings.length>0?`Settings that have been changed this session compared to your initialized settings.
|
|
@@ -1348,7 +1348,7 @@ Click on the copy icon to easely copy the new setting into your project
|
|
|
1348
1348
|
.currentValue=${e.trajectoryPredictionTime}
|
|
1349
1349
|
.maxValue=${200}
|
|
1350
1350
|
.minValue=${10}
|
|
1351
|
-
.unit=${
|
|
1351
|
+
.unit=${Le}
|
|
1352
1352
|
header="Prediction Time"
|
|
1353
1353
|
description="How far into the future to calculate mouse trajectory path"
|
|
1354
1354
|
setting="trajectoryPredictionTime"
|
|
@@ -1449,7 +1449,7 @@ Click on the copy icon to easely copy the new setting into your project
|
|
|
1449
1449
|
border-bottom: 1px solid rgba(176, 196, 222, 0.2);
|
|
1450
1450
|
padding-bottom: 8px;
|
|
1451
1451
|
}
|
|
1452
|
-
`,i([
|
|
1452
|
+
`,i([Y()],w.prototype,"managerSettings",2),i([Y()],w.prototype,"initialSettings",2),i([Y()],w.prototype,"devtoolsSettings",2),i([Y()],w.prototype,"changedSettings",2),w=i([ni("settings-tab")],w);var b=class extends oi{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 si`
|
|
1453
1453
|
<div class="control-wrapper ${this.isMinimized?"minimized":""}">
|
|
1454
1454
|
<div class="title-wrapper">
|
|
1455
1455
|
<button @click="${()=>this.isMinimized=!this.isMinimized}" class="minimize-button">
|
|
@@ -1560,7 +1560,7 @@ Click on the copy icon to easely copy the new setting into your project
|
|
|
1560
1560
|
width: 100%;
|
|
1561
1561
|
height: 100%;
|
|
1562
1562
|
}
|
|
1563
|
-
`,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 Si}from"lit";import{customElement as Ti}from"lit/decorators.js";import{LitElement as li,html as di,css as ci}from"lit";import{customElement as
|
|
1563
|
+
`,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 Si}from"lit";import{customElement as Ti}from"lit/decorators.js";import{LitElement as li,html as di,css as ci}from"lit";import{customElement as pi,state as Oe,query as gi}from"lit/decorators.js";import{ForesightManager as R}from"js.foresight";var C=class extends li{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;R.instance.addEventListener("elementRegistered",t=>{t.elementData.isIntersectingWithViewport&&this.createOrUpdateElementOverlay(t.elementData)},{signal:e}),R.instance.addEventListener("elementUnregistered",t=>{this.removeElementOverlay(t.elementData)},{signal:e}),R.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}),R.instance.addEventListener("callbackInvoked",t=>{this.highlightElementCallback(t.elementData,t.hitType)},{signal:e}),R.instance.addEventListener("callbackCompleted",t=>{this.unhighlightElementCallback(t.elementData)},{signal:e}),document.addEventListener("showNameTagsChanged",t=>{let n=t;this.updateNameTagVisibility(n.detail.showNameTags)},{signal:e})}createElementOverlays(e){let t=document.createElement("div");t.className="expanded-overlay";let n=document.createElement("div");n.className="name-label",this.containerElement.appendChild(t),this.containerElement.appendChild(n);let a={expandedOverlay:t,nameLabel:n};return this.overlayMap.set(e.element,a),a}updateElementOverlays(e,t){let{expandedOverlay:n,nameLabel:a}=e,{expandedRect:r}=t.elementBounds,T=r.right-r.left,B=r.bottom-r.top;n.style.width=`${T}px`,n.style.height=`${B}px`,n.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 n=this.overlayMap.get(e.element);if(n)switch(this.clearCallbackAnimationTimeout(e.element),t.kind){case"mouse":n.expandedOverlay.classList.add("invoked-by-mouse");break;case"scroll":n.expandedOverlay.classList.add("invoked-by-scroll");break;case"tab":n.expandedOverlay.classList.add("invoked-by-tab");break;default:}}unhighlightElementCallback(e){let t=this.overlayMap.get(e.element);if(!t)return;let n=setTimeout(()=>{t.expandedOverlay.classList.remove("callback-invoked"),this.callbackAnimations.delete(e.element)},400);this.callbackAnimations.set(e.element,{element:e.element,timeoutId:n})}updateNameTagVisibility(e){this.overlayMap.forEach(t=>{let n=t.nameLabel;e?n.style.display="block":n.style.display="none"})}disconnectedCallback(){super.disconnectedCallback(),this.callbackAnimations.forEach(e=>{clearTimeout(e.timeoutId)}),this.callbackAnimations.clear(),this.overlayMap.clear(),this._abortController?.abort(),this._abortController=null}render(){return di` <div id="overlays-container"></div> `}};C.styles=[ci`
|
|
1564
1564
|
:host {
|
|
1565
1565
|
position: fixed;
|
|
1566
1566
|
top: 0;
|
|
@@ -1627,7 +1627,7 @@ Click on the copy icon to easely copy the new setting into your project
|
|
|
1627
1627
|
white-space: nowrap;
|
|
1628
1628
|
pointer-events: none;
|
|
1629
1629
|
}
|
|
1630
|
-
`],i([Oe()],C.prototype,"overlayMap",2),i([Oe()],C.prototype,"callbackAnimations",2),i([
|
|
1630
|
+
`],i([Oe()],C.prototype,"overlayMap",2),i([Oe()],C.prototype,"callbackAnimations",2),i([gi("#overlays-container")],C.prototype,"containerElement",2),C=i([pi("element-overlays")],C);import{LitElement as hi,html as mi,css as ui}from"lit";import{customElement as bi,state as te}from"lit/decorators.js";import{styleMap as vi}from"lit/directives/style-map.js";import{ForesightManager as A}from"js.foresight";var S=class extends hi{constructor(){super(...arguments);this._abortController=new AbortController;this._mousePredictionIsEnabled=A.instance.getManagerData.globalSettings.enableMousePrediction;this._isVisible=!1;this._trajectoryStyles={};this.handleElementUnregistered=e=>{e.wasLastElement&&(this._isVisible=!1)};this.handleSettingsChange=e=>{let t=e.managerData.globalSettings.enableMousePrediction;this._mousePredictionIsEnabled=t,t||(this._isVisible=!1),this.requestUpdate()};this.handleTrajectoryUpdate=e=>{if(!this._mousePredictionIsEnabled)return;this._isVisible=!0;let{currentPoint:t,predictedPoint:n}=e.trajectoryPositions,a=n.x-t.x,r=n.y-t.y,T=Math.sqrt(a*a+r*r),B=Math.atan2(r,a)*57.29577951308232;this._trajectoryStyles={transform:`translate3d(${t.x}px, ${t.y}px, 0) rotate(${B}deg)`,width:`${T}px`}}}connectedCallback(){super.connectedCallback();let{signal:e}=this._abortController;A.instance.addEventListener("mouseTrajectoryUpdate",this.handleTrajectoryUpdate,{signal:e}),A.instance.addEventListener("elementUnregistered",this.handleElementUnregistered,{signal:e}),A.instance.addEventListener("scrollTrajectoryUpdate",()=>{this._isVisible=!1},{signal:e}),A.instance.addEventListener("managerSettingsChanged",this.handleSettingsChange,{signal:e})}disconnectedCallback(){super.disconnectedCallback(),this._abortController.abort()}render(){let e={display:this._isVisible?"block":"none",...this._trajectoryStyles};return mi` <div class="trajectory-line" style=${vi(e)}></div> `}};S.styles=[ui`
|
|
1631
1631
|
:host {
|
|
1632
1632
|
display: block;
|
|
1633
1633
|
}
|
|
@@ -1735,9 +1735,9 @@ Click on the copy icon to easely copy the new setting into your project
|
|
|
1735
1735
|
pointer-events: none;
|
|
1736
1736
|
z-index: 9999;
|
|
1737
1737
|
}
|
|
1738
|
-
`],H=i([Ti("debug-overlay")],H);var l=class extends Mi{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.
|
|
1738
|
+
`],H=i([Ti("debug-overlay")],H);var l=class extends Mi{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}updateLoggingSetting(e,t){this.shouldUpdateSetting(t,this.devtoolsSettings.logging[e])&&(this.devtoolsSettings.logging[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.updateLoggingSetting("callbackCompleted",e.logging.callbackCompleted),this.updateLoggingSetting("callbackInvoked",e.logging.callbackInvoked),this.updateLoggingSetting("elementDataUpdated",e.logging.elementDataUpdated),this.updateLoggingSetting("elementRegistered",e.logging.elementRegistered),this.updateLoggingSetting("elementUnregistered",e.logging.elementUnregistered),this.updateLoggingSetting("managerSettingsChanged",e.logging.managerSettingsChanged),this.updateLoggingSetting("mouseTrajectoryUpdate",e.logging.mouseTrajectoryUpdate),this.updateLoggingSetting("scrollTrajectoryUpdate",e.logging.scrollTrajectoryUpdate)))}cleanup(){this.requestUpdate()}render(){return!this.isInitialized||!this.devtoolsSettings.showDebugger?Ie``:Ie`<control-panel></control-panel> <debug-overlay></debug-overlay>`}};l.styles=[Li`
|
|
1739
1739
|
:host {
|
|
1740
1740
|
display: block;
|
|
1741
1741
|
}
|
|
1742
|
-
`],l._instance=null,i([_i()],l.prototype,"isInitialized",2),l=i([
|
|
1742
|
+
`],l._instance=null,i([_i()],l.prototype,"isInitialized",2),l=i([Di("foresight-devtools")],l);export{l as ForesightDevtools};
|
|
1743
1743
|
//# sourceMappingURL=index.js.map
|