clarity-js 0.8.10-beta → 0.8.10

package/src/interaction/encode.ts

@@ -1,9 +1,8 @@
-import { Constant, Event, Token } from "@clarity-types/data";
+import { Constant, Event, type Token } from "@clarity-types/data";
 import * as scrub from "@src/core/scrub";
 import { time } from "@src/core/time";
 import * as baseline from "@src/data/baseline";
 import { queue } from "@src/data/upload";
-import { metadata } from "@src/layout/target";
 import * as change from "@src/interaction/change";
 import * as click from "@src/interaction/click";
 import * as clipboard from "@src/interaction/clipboard";
@@ -16,9 +15,10 @@ import * as submit from "@src/interaction/submit";
 import * as timeline from "@src/interaction/timeline";
 import * as unload from "@src/interaction/unload";
 import * as visibility from "@src/interaction/visibility";
+import { metadata } from "@src/layout/target";
 
 export default async function (type: Event, ts: number = null): Promise<void> {
-    let t = ts || time();
+    const t = ts || time();
     let tokens: Token[] = [t, type];
     switch (type) {
         case Event.MouseDown:
@@ -30,15 +30,15 @@ export default async function (type: Event, ts: number = null): Promise<void> {
         case Event.TouchEnd:
         case Event.TouchMove:
         case Event.TouchCancel:
-            for (let entry of pointer.state) {
-                let pTarget = metadata(entry.data.target as Node, entry.event);
+            for (const entry of pointer.state) {
+                const pTarget = metadata(entry.data.target as Node, entry.event);
                 if (pTarget.id > 0) {
                     tokens = [entry.time, entry.event];
                     tokens.push(pTarget.id);
                     tokens.push(entry.data.x);
                     tokens.push(entry.data.y);
-                    if (entry.data.id !== undefined) { 
-                        tokens.push(entry.data.id); 
+                    if (entry.data.id !== undefined) {
+                        tokens.push(entry.data.id);
 
                         if (entry.data.isPrimary !== undefined) {
                             tokens.push(entry.data.isPrimary.toString());
@@ -53,10 +53,10 @@ export default async function (type: Event, ts: number = null): Promise<void> {
             pointer.reset();
             break;
         case Event.Click:
-            for (let entry of click.state) {
-                let cTarget = metadata(entry.data.target as Node, entry.event, entry.data.text);
+            for (const entry of click.state) {
+                const cTarget = metadata(entry.data.target as Node, entry.event, entry.data.text);
                 tokens = [entry.time, entry.event];
-                let cHash = cTarget.hash ? cTarget.hash.join(Constant.Dot) : Constant.Empty;
+                const cHash = cTarget.hash ? cTarget.hash.join(Constant.Dot) : Constant.Empty;
                 tokens.push(cTarget.id);
                 tokens.push(entry.data.x);
                 tokens.push(entry.data.y);
@@ -76,9 +76,9 @@ export default async function (type: Event, ts: number = null): Promise<void> {
             click.reset();
             break;
         case Event.Clipboard:
-            for (let entry of clipboard.state) {
+            for (const entry of clipboard.state) {
                 tokens = [entry.time, entry.event];
-                let target = metadata(entry.data.target as Node, entry.event);
+                const target = metadata(entry.data.target as Node, entry.event);
                 if (target.id > 0) {
                     tokens.push(target.id);
                     tokens.push(entry.data.action);
@@ -87,24 +87,26 @@ export default async function (type: Event, ts: number = null): Promise<void> {
             }
             clipboard.reset();
             break;
-        case Event.Resize:
-            let r = resize.data;
+        case Event.Resize: {
+            const r = resize.data;
             tokens.push(r.width);
             tokens.push(r.height);
             baseline.track(type, r.width, r.height);
             resize.reset();
             queue(tokens);
             break;
-        case Event.Unload:
-            let u = unload.data;
+        }
+        case Event.Unload: {
+            const u = unload.data;
             tokens.push(u.name);
             tokens.push(u.persisted);
             unload.reset();
             queue(tokens);
             break;
+        }
         case Event.Input:
-            for (let entry of input.state) {
-                let iTarget = metadata(entry.data.target as Node, entry.event, entry.data.value);
+            for (const entry of input.state) {
+                const iTarget = metadata(entry.data.target as Node, entry.event, entry.data.value);
                 tokens = [entry.time, entry.event];
                 tokens.push(iTarget.id);
                 tokens.push(scrub.text(entry.data.value, "input", iTarget.privacy, false, entry.data.type));
@@ -112,11 +114,11 @@ export default async function (type: Event, ts: number = null): Promise<void> {
             }
             input.reset();
             break;
-        case Event.Selection:
-            let s = selection.data;
+        case Event.Selection: {
+            const s = selection.data;
             if (s) {
-                let startTarget = metadata(s.start as Node, type);
-                let endTarget = metadata(s.end as Node, type);
+                const startTarget = metadata(s.start as Node, type);
+                const endTarget = metadata(s.end as Node, type);
                 tokens.push(startTarget.id);
                 tokens.push(s.startOffset);
                 tokens.push(endTarget.id);
@@ -125,9 +127,10 @@ export default async function (type: Event, ts: number = null): Promise<void> {
                 queue(tokens);
             }
             break;
+        }
         case Event.Scroll:
-            for (let entry of scroll.state) {
-                let sTarget = metadata(entry.data.target as Node, entry.event);
+            for (const entry of scroll.state) {
+                const sTarget = metadata(entry.data.target as Node, entry.event);
                 const top = metadata(entry.data.top as Node, entry.event);
                 const bottom = metadata(entry.data.bottom as Node, entry.event);
                 const sTopHash = top?.hash ? top.hash.join(Constant.Dot) : Constant.Empty;
@@ -146,9 +149,9 @@ export default async function (type: Event, ts: number = null): Promise<void> {
             scroll.reset();
             break;
         case Event.Change:
-            for (let entry of change.state) {
+            for (const entry of change.state) {
                 tokens = [entry.time, entry.event];
-                let target = metadata(entry.data.target as Node, entry.event);
+                const target = metadata(entry.data.target as Node, entry.event);
                 if (target.id > 0) {
                     tokens = [entry.time, entry.event];
                     tokens.push(target.id);
@@ -161,9 +164,9 @@ export default async function (type: Event, ts: number = null): Promise<void> {
             change.reset();
             break;
         case Event.Submit:
-            for (let entry of submit.state) {
+            for (const entry of submit.state) {
                 tokens = [entry.time, entry.event];
-                let target = metadata(entry.data.target as Node, entry.event);
+                const target = metadata(entry.data.target as Node, entry.event);
                 if (target.id > 0) {
                     tokens.push(target.id);
                     queue(tokens);
@@ -172,7 +175,7 @@ export default async function (type: Event, ts: number = null): Promise<void> {
             submit.reset();
             break;
         case Event.Timeline:
-            for (let entry of timeline.updates) {
+            for (const entry of timeline.updates) {
                 tokens = [entry.time, entry.event];
                 tokens.push(entry.data.type);
                 tokens.push(entry.data.hash);
@@ -184,12 +187,13 @@ export default async function (type: Event, ts: number = null): Promise<void> {
             }
             timeline.reset();
             break;
-        case Event.Visibility:
-            let v = visibility.data;
+        case Event.Visibility: {
+            const v = visibility.data;
             tokens.push(v.visible);
             queue(tokens);
             baseline.visibility(t, v.visible);
             visibility.reset();
             break;
+        }
     }
 }

package/src/interaction/input.ts

@@ -1,13 +1,13 @@
 import { Event } from "@clarity-types/data";
-import { InputData, InputState, Setting } from "@clarity-types/interaction";
+import { type InputData, type InputState, Setting } from "@clarity-types/interaction";
 import { FunctionNames } from "@clarity-types/performance";
 import { bind } from "@src/core/event";
 import { schedule } from "@src/core/task";
 import { time } from "@src/core/time";
 import { clearTimeout, setTimeout } from "@src/core/timeout";
 import { get } from "@src/layout/dom";
-import encode from "./encode";
 import { target } from "@src/layout/target";
+import encode from "./encode";
 
 let timeout: number = null;
 export let state: InputState[] = [];
@@ -22,11 +22,11 @@ export function observe(root: Node): void {
 
 function recompute(evt: UIEvent): void {
     recompute.dn = FunctionNames.InputRecompute;
-    let input = target(evt) as HTMLInputElement;
-    let value = get(input);
-    if (input && input.type && value) {
+    const input = target(evt) as HTMLInputElement;
+    const value = get(input);
+    if (input?.type && value) {
         let v = input.value;
-        let t = input.type;
+        const t = input.type;
         switch (input.type) {
             case "radio":
             case "checkbox":
@@ -34,10 +34,12 @@ function recompute(evt: UIEvent): void {
                 break;
         }
 
-        let data: InputData = { target: input, value: v, type: t };
+        const data: InputData = { target: input, value: v, type: t };
 
         // If last entry in the queue is for the same target node as the current one, remove it so we can later swap it with current data.
-        if (state.length > 0 && (state[state.length - 1].data.target === data.target)) { state.pop(); }
+        if (state.length > 0 && state[state.length - 1].data.target === data.target) {
+            state.pop();
+        }
 
         state.push({ time: time(evt), event: Event.Input, data });
 
@@ -57,4 +59,4 @@ export function reset(): void {
 export function stop(): void {
     clearTimeout(timeout);
     reset();
-}
+}

package/src/interaction/pointer.ts

@@ -1,5 +1,5 @@
 import { Event } from "@clarity-types/data";
-import { PointerState, Setting } from "@clarity-types/interaction";
+import { type PointerState, Setting } from "@clarity-types/interaction";
 import { FunctionNames } from "@clarity-types/performance";
 import { bind } from "@src/core/event";
 import { schedule } from "@src/core/task";
@@ -34,45 +34,47 @@ export function observe(root: Node): void {
 
 function mouse(event: Event, root: Node, evt: MouseEvent): void {
     mouse.dn = FunctionNames.PointerMouse;
-    let frame = iframe(root);
-    let d = frame ? frame.contentDocument.documentElement : document.documentElement;
-    let x = "pageX" in evt ? Math.round(evt.pageX) : ("clientX" in evt ? Math.round(evt["clientX"] + d.scrollLeft) : null);
-    let y = "pageY" in evt ? Math.round(evt.pageY) : ("clientY" in evt ? Math.round(evt["clientY"] + d.scrollTop) : null);
+    const frame = iframe(root);
+    const d = frame ? frame.contentDocument.documentElement : document.documentElement;
+    let x = "pageX" in evt ? Math.round(evt.pageX) : "clientX" in evt ? Math.round((evt as MouseEvent).clientX + d.scrollLeft) : null;
+    let y = "pageY" in evt ? Math.round(evt.pageY) : "clientY" in evt ? Math.round((evt as MouseEvent).clientY + d.scrollTop) : null;
     // In case of iframe, we adjust (x,y) to be relative to top parent's origin
     if (frame) {
-        let distance = offset(frame);
+        const distance = offset(frame);
         x = x ? x + Math.round(distance.x) : x;
         y = y ? y + Math.round(distance.y) : y;
     }
 
     // Check for null values before processing this event
-    if (x !== null && y !== null) { handler({ time: time(evt), event, data: { target: target(evt), x, y } }); }
+    if (x !== null && y !== null) {
+        handler({ time: time(evt), event, data: { target: target(evt), x, y } });
+    }
 }
 
 function touch(event: Event, root: Node, evt: TouchEvent): void {
     touch.dn = FunctionNames.PointerTouch;
-    let frame = iframe(root);
-    let d = frame ? frame.contentDocument.documentElement : document.documentElement;
-    let touches = evt.changedTouches;
+    const frame = iframe(root);
+    const d = frame ? frame.contentDocument.documentElement : document.documentElement;
+    const touches = evt.changedTouches;
 
-    let t = time(evt);
+    const t = time(evt);
     if (touches) {
         for (let i = 0; i < touches.length; i++) {
-            let entry = touches[i];
-            let x = "clientX" in entry ? Math.round(entry["clientX"] + d.scrollLeft) : null;
-            let y = "clientY" in entry ? Math.round(entry["clientY"] + d.scrollTop) : null;
+            const entry = touches[i];
+            let x = "clientX" in entry ? Math.round(entry.clientX + d.scrollLeft) : null;
+            let y = "clientY" in entry ? Math.round(entry.clientY + d.scrollTop) : null;
             x = x && frame ? x + Math.round(frame.offsetLeft) : x;
             y = y && frame ? y + Math.round(frame.offsetTop) : y;
 
             // We cannot rely on identifier to determine primary touch as its value doesn't always start with 0.
             // Safari/Webkit uses the address of the UITouch object as the identifier value for each touch point.
-            const id = "identifier" in entry ? entry["identifier"] : undefined;
+            const id = "identifier" in entry ? entry.identifier : undefined;
 
-            switch(event) {
+            switch (event) {
                 case Event.TouchStart:
                     if (activeTouchPointIds.size === 0) {
                         // Track presence of primary touch separately to handle scenarios when same id is repeated
-                        hasPrimaryTouch = true;  
+                        hasPrimaryTouch = true;
                         primaryTouchId = id;
                     }
                     activeTouchPointIds.add(id);
@@ -85,11 +87,15 @@ function touch(event: Event, root: Node, evt: TouchEvent): void {
             const isPrimary = hasPrimaryTouch && primaryTouchId === id;
 
             // Check for null values before processing this event
-            if (x !== null && y !== null) { handler({ time: t, event, data: { target: target(evt), x, y, id, isPrimary } }); }
+            if (x !== null && y !== null) {
+                handler({ time: t, event, data: { target: target(evt), x, y, id, isPrimary } });
+            }
 
             // Reset primary touch point id once touch event ends
             if (event === Event.TouchCancel || event === Event.TouchEnd) {
-                if (primaryTouchId === id) { hasPrimaryTouch = false; }
+                if (primaryTouchId === id) {
+                    hasPrimaryTouch = false;
+                }
             }
         }
     }
@@ -99,15 +105,18 @@ function handler(current: PointerState): void {
     switch (current.event) {
         case Event.MouseMove:
         case Event.MouseWheel:
-        case Event.TouchMove:
-            let length = state.length;
-            let last = length > 1 ? state[length - 2] : null;
-            if (last && similar(last, current)) { state.pop(); }
+        case Event.TouchMove: {
+            const length = state.length;
+            const last = length > 1 ? state[length - 2] : null;
+            if (last && similar(last, current)) {
+                state.pop();
+            }
             state.push(current);
 
             clearTimeout(timeout);
             timeout = setTimeout(process, Setting.LookAhead, current.event);
             break;
+        }
         default:
             state.push(current);
             process(current.event);
@@ -124,17 +133,19 @@ export function reset(): void {
 }
 
 function similar(last: PointerState, current: PointerState): boolean {
-    let dx = last.data.x - current.data.x;
-    let dy = last.data.y - current.data.y;
-    let distance = Math.sqrt(dx * dx + dy * dy);
-    let gap = current.time - last.time;
-    let match = current.data.target === last.data.target;
-    let sameId = current.data.id !== undefined ? current.data.id === last.data.id : true;
+    const dx = last.data.x - current.data.x;
+    const dy = last.data.y - current.data.y;
+    const distance = Math.sqrt(dx * dx + dy * dy);
+    const gap = current.time - last.time;
+    const match = current.data.target === last.data.target;
+    const sameId = current.data.id !== undefined ? current.data.id === last.data.id : true;
     return current.event === last.event && match && distance < Setting.Distance && gap < Setting.Interval && sameId;
 }
 
 export function stop(): void {
     clearTimeout(timeout);
     // Send out any pending pointer events in the pipeline
-    if (state.length > 0) { process(state[state.length - 1].event); }
+    if (state.length > 0) {
+        process(state[state.length - 1].event);
+    }
 }

package/src/interaction/resize.ts

@@ -1,10 +1,10 @@
 import { Event } from "@clarity-types/data";
-import { ResizeData, Setting } from "@clarity-types/interaction";
+import { type ResizeData, Setting } from "@clarity-types/interaction";
 import { FunctionNames } from "@clarity-types/performance";
-import { clearTimeout, setTimeout } from "@src/core/timeout";
 import { bind } from "@src/core/event";
-import encode from "./encode";
 import { schedule } from "@src/core/task";
+import { clearTimeout, setTimeout } from "@src/core/timeout";
+import encode from "./encode";
 
 export let data: ResizeData;
 let timeout: number = null;
@@ -18,7 +18,7 @@ export function start(): void {
 
 function recompute(): void {
     recompute.dn = FunctionNames.ResizeRecompute;
-    let de = document.documentElement;
+    const de = document.documentElement;
     // window.innerWidth includes width of the scrollbar and is not a true representation of the viewport width.
     // Therefore, when possible, use documentElement's clientWidth property.
     data = {
@@ -45,4 +45,4 @@ export function reset(): void {
 
 export function stop(): void {
     reset();
-}
+}

package/src/interaction/scroll.ts

@@ -1,14 +1,14 @@
 import { Constant, Dimension, Event } from "@clarity-types/data";
-import { ScrollState, Setting } from "@clarity-types/interaction";
+import { type ScrollState, Setting } from "@clarity-types/interaction";
 import { FunctionNames } from "@clarity-types/performance";
 import { bind } from "@src/core/event";
 import { schedule } from "@src/core/task";
 import { time } from "@src/core/time";
 import { clearTimeout, setTimeout } from "@src/core/timeout";
+import * as dimension from "@src/data/dimension";
 import { iframe } from "@src/layout/dom";
-import { target, metadata } from "@src/layout/target";
+import { metadata, target } from "@src/layout/target";
 import encode from "./encode";
-import * as dimension from "@src/data/dimension";
 
 export let state: ScrollState[] = [];
 let initialTop: Node = null;
@@ -21,8 +21,8 @@ export function start(): void {
 }
 
 export function observe(root: Node): void {
-    let frame = iframe(root);
-    let node = frame ? frame.contentWindow : (root === document ? window : root);
+    const frame = iframe(root);
+    const node = frame ? frame.contentWindow : root === document ? window : root;
     bind(node, "scroll", recompute, true);
 }
 
@@ -34,7 +34,7 @@ function recompute(event: UIEvent = null): void {
 
     // If the target is a Document node, then identify corresponding documentElement and window for this document
     if (element && element.nodeType === Node.DOCUMENT_NODE) {
-        let frame = iframe(element);
+        const frame = iframe(element);
         w = frame ? frame.contentWindow : w;
         element = de = (element as Document).documentElement;
     }
@@ -42,8 +42,8 @@ function recompute(event: UIEvent = null): void {
     // Edge doesn't support scrollTop position on document.documentElement.
     // For cross browser compatibility, looking up pageYOffset on window if the scroll is on document.
     // And, if for some reason that is not available, fall back to looking up scrollTop on document.documentElement.
-    let x = element === de && "pageXOffset" in w ? Math.round(w.pageXOffset) : Math.round((element as HTMLElement).scrollLeft);
-    let y = element === de && "pageYOffset" in w ? Math.round(w.pageYOffset) : Math.round((element as HTMLElement).scrollTop);
+    const x = element === de && "pageXOffset" in w ? Math.round(w.pageXOffset) : Math.round((element as HTMLElement).scrollLeft);
+    const y = element === de && "pageYOffset" in w ? Math.round(w.pageYOffset) : Math.round((element as HTMLElement).scrollTop);
     const width = window.innerWidth;
     const height = window.innerHeight;
     const xPosition = width / 3;
@@ -53,18 +53,20 @@ function recompute(event: UIEvent = null): void {
     const top = getPositionNode(xPosition, startYPosition);
     const bottom = getPositionNode(xPosition, endYPosition);
 
-    let current: ScrollState = { time: time(event), event: Event.Scroll, data: {target: element, x, y, top, bottom} };
+    const current: ScrollState = { time: time(event), event: Event.Scroll, data: { target: element, x, y, top, bottom } };
 
     // We don't send any scroll events if this is the first event and the current position is top (0,0)
-    if ((event === null && x === 0 && y === 0) || (x === null || y === null)) {
+    if ((event === null && x === 0 && y === 0) || x === null || y === null) {
         initialTop = top;
         initialBottom = bottom;
         return;
     }
 
-    let length = state.length;
-    let last = length > 1 ? state[length - 2] : null;
-    if (last && similar(last, current)) { state.pop(); }
+    const length = state.length;
+    const last = length > 1 ? state[length - 2] : null;
+    if (last && similar(last, current)) {
+        state.pop();
+    }
     state.push(current);
 
     clearTimeout(timeout);
@@ -74,9 +76,10 @@ function recompute(event: UIEvent = null): void {
 function getPositionNode(x: number, y: number): Node {
     let node: Node;
     if ("caretPositionFromPoint" in document) {
+        // biome-ignore lint/suspicious/noExplicitAny: caretPositionFromPoint is not defined on all browsers, makes typescript unhappy
         node = (document as any).caretPositionFromPoint(x, y)?.offsetNode;
     } else if ("caretRangeFromPoint" in document) {
-        node = (document as any).caretRangeFromPoint(x, y)?.startContainer;
+        node = (document as Document).caretRangeFromPoint(x, y)?.startContainer;
     }
     if (!node) {
         node = document.elementFromPoint(x, y) as Node;
@@ -99,9 +102,9 @@ function process(event: Event): void {
 }
 
 function similar(last: ScrollState, current: ScrollState): boolean {
-    let dx = last.data.x - current.data.x;
-    let dy = last.data.y - current.data.y;
-    return (dx * dx + dy * dy < Setting.Distance * Setting.Distance) && (current.time - last.time < Setting.Interval);
+    const dx = last.data.x - current.data.x;
+    const dy = last.data.y - current.data.y;
+    return dx * dx + dy * dy < Setting.Distance * Setting.Distance && current.time - last.time < Setting.Interval;
 }
 
 export function compute(): void {

package/src/interaction/selection.ts

@@ -1,5 +1,5 @@
 import { Event } from "@clarity-types/data";
-import { SelectionData, Setting } from "@clarity-types/interaction";
+import { type SelectionData, Setting } from "@clarity-types/interaction";
 import { FunctionNames } from "@clarity-types/performance";
 import { bind } from "@src/core/event";
 import { schedule } from "@src/core/task";
@@ -21,21 +21,25 @@ export function observe(root: Node): void {
 
 function recompute(root: Node): void {
     recompute.dn = FunctionNames.SelectionRecompute;
-    let doc = root.nodeType === Node.DOCUMENT_NODE ? root as Document : document;
-    let current = doc.getSelection();
+    const doc = root.nodeType === Node.DOCUMENT_NODE ? (root as Document) : document;
+    const current = doc.getSelection();
 
     // Bail out if we don't have a valid selection
-    if (current === null) { return; }
+    if (current === null) {
+        return;
+    }
 
     // Bail out if we got a valid selection but not valid nodes
     // In Edge, selectionchange gets fired even on interactions like right clicks and
     // can result in null anchorNode and focusNode if there was no previous selection on page
     // Also, ignore any selections that start and end at the exact same point
-    if ((current.anchorNode === null && current.focusNode === null) ||
-        (current.anchorNode === current.focusNode && current.anchorOffset === current.focusOffset)) {
+    if (
+        (current.anchorNode === null && current.focusNode === null) ||
+        (current.anchorNode === current.focusNode && current.anchorOffset === current.focusOffset)
+    ) {
         return;
     }
-    let startNode = data.start ? data.start : null;
+    const startNode = data.start ? data.start : null;
     if (previous !== null && data.start !== null && startNode !== current.anchorNode) {
         clearTimeout(timeout);
         process(Event.Selection);
@@ -45,7 +49,7 @@ function recompute(root: Node): void {
         start: current.anchorNode,
         startOffset: current.anchorOffset,
         end: current.focusNode,
-        endOffset: current.focusOffset
+        endOffset: current.focusOffset,
     };
     previous = current;
 

package/src/interaction/submit.ts

@@ -1,11 +1,11 @@
 import { Event } from "@clarity-types/data";
-import { SubmitState } from "@clarity-types/interaction";
+import type { SubmitState } from "@clarity-types/interaction";
 import { FunctionNames } from "@clarity-types/performance";
 import { bind } from "@src/core/event";
 import { schedule } from "@src/core/task";
 import { time } from "@src/core/time";
-import encode from "./encode";
 import { target } from "@src/layout/target";
+import encode from "./encode";
 
 export let state: SubmitState[] = [];
 

package/src/interaction/timeline.ts

@@ -1,5 +1,5 @@
 import { BooleanFlag, Event } from "@clarity-types/data";
-import { BrowsingContext, Setting, TimelineState } from "@clarity-types/interaction";
+import { BrowsingContext, Setting, type TimelineState } from "@clarity-types/interaction";
 import * as baseline from "@src/data/baseline";
 import * as envelope from "@src/data/envelope";
 import encode from "@src/interaction/encode";
@@ -16,13 +16,15 @@ export function reset(): void {
     updates = [];
 }
 
-export function track(time: number,
+export function track(
+    time: number,
     event: Event,
     hash: string,
     x: number,
     y: number,
     reaction: number = BooleanFlag.True,
-    context: number = BrowsingContext.Self): void {
+    context: number = BrowsingContext.Self,
+): void {
     state.push({
         time,
         event: Event.Timeline,
@@ -32,8 +34,8 @@ export function track(time: number,
             x,
             y,
             reaction,
-            context
-        }
+            context,
+        },
     });
 
     // Since timeline only keeps the data for configured time, we still want to continue tracking these values
@@ -45,12 +47,14 @@ export function track(time: number,
 export function compute(): void {
     const temp = [];
     updates = [];
-    let max = envelope.data.start + envelope.data.duration;
-    let min = Math.max(max - Setting.TimelineSpan, 0);
+    const max = envelope.data.start + envelope.data.duration;
+    const min = Math.max(max - Setting.TimelineSpan, 0);
 
-    for (let s of state) {
+    for (const s of state) {
         if (s.time >= min) {
-            if (s.time <= max) { updates.push(s); }
+            if (s.time <= max) {
+                updates.push(s);
+            }
             temp.push(s);
         }
     }

package/src/interaction/unload.ts

@@ -1,5 +1,5 @@
 import { BooleanFlag, Event } from "@clarity-types/data";
-import { UnloadData } from "@clarity-types/interaction";
+import type { UnloadData } from "@clarity-types/interaction";
 import { FunctionNames } from "@clarity-types/performance";
 import * as clarity from "@src/clarity";
 import { bind } from "@src/core/event";

package/src/interaction/visibility.ts

@@ -1,5 +1,5 @@
 import { Event } from "@clarity-types/data";
-import { VisibilityData } from "@clarity-types/interaction";
+import type { VisibilityData } from "@clarity-types/interaction";
 import { FunctionNames } from "@clarity-types/performance";
 import { bind } from "@src/core/event";
 import { time } from "@src/core/time";
@@ -24,4 +24,4 @@ export function reset(): void {
 
 export function stop(): void {
     reset();
-}
+}