js.foresight 0.0.5 → 0.0.8

package/dist/ForesightManager/ForesightDebugger.d.ts

@@ -1,13 +1,6 @@
 import type { ForesightManager } from "./ForesightManager";
-import type { LinkElement, Point, Rect } from "../types/types";
-type LinkManagerData = {
-    callback: () => void;
-    expandedRect: Rect | null;
-    isHovering: boolean;
-    isTrajectoryHit: boolean;
-    trajectoryHitTime: number;
-};
-export declare class IntentDebugger {
+import type { ElementData, ForesightElement, ForesightManagerProps, Point } from "../types/types";
+export declare class ForesightDebugger {
     private foresightManagerInstance;
     private shadowHost;
     private shadowRoot;
@@ -17,22 +10,13 @@ export declare class IntentDebugger {
     private debugTrajectoryLine;
     private debugControlsContainer;
     private debugStyleElement;
-    constructor(foresightManager: ForesightManager);
-    initialize(links: Map<LinkElement, LinkManagerData>, currentSettings: {
-        positionHistorySize: number;
-        trajectoryPredictionTime: number;
-        enableMouseTrajectory: boolean;
-    }, currentPoint: Point, predictedPoint: Point): void;
+    constructor(intentManager: ForesightManager);
+    initialize(links: Map<ForesightElement, ElementData>, currentSettings: ForesightManagerProps, currentPoint: Point, predictedPoint: Point): void;
     cleanup(): void;
-    createOrUpdateLinkOverlay(element: LinkElement, linkData: LinkManagerData): void;
-    removeLinkOverlay(element: LinkElement): void;
-    updateAllLinkVisuals(links: Map<LinkElement, LinkManagerData>): void;
+    createOrUpdateLinkOverlay(element: ForesightElement, elementData: ElementData): void;
+    removeLinkOverlay(element: ForesightElement): void;
+    updateAllLinkVisuals(links: Map<ForesightElement, ElementData>): void;
     updateTrajectoryVisuals(currentPoint: Point, predictedPoint: Point, enableMouseTrajectory: boolean): void;
     private createDebugControls;
-    updateControlsState(settings: {
-        positionHistorySize: number;
-        trajectoryPredictionTime: number;
-        enableMouseTrajectory: boolean;
-    }): void;
+    updateControlsState(settings: ForesightManagerProps): void;
 }
-export {};

package/dist/ForesightManager/ForesightDebugger.js

@@ -1,8 +1,5 @@
-"use strict";
 "use client";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.IntentDebugger = void 0;
-class IntentDebugger {
+export class ForesightDebugger {
     foresightManagerInstance;
     shadowHost = null;
     shadowRoot = null;
@@ -12,76 +9,87 @@ class IntentDebugger {
     debugTrajectoryLine = null;
     debugControlsContainer = null;
     debugStyleElement = null;
-    constructor(foresightManager) {
-        this.foresightManagerInstance = foresightManager;
+    constructor(intentManager) {
+        this.foresightManagerInstance = intentManager;
     }
     initialize(links, currentSettings, currentPoint, predictedPoint) {
         if (typeof window === "undefined")
             return;
         this.cleanup();
         this.shadowHost = document.createElement("div");
-        this.shadowHost.id = "intent-debugger-shadow-host";
-        // Host itself should not capture pointer events unless specifically designed to.
+        this.shadowHost.id = "jsforesight-debugger-shadow-host";
         this.shadowHost.style.pointerEvents = "none";
         document.body.appendChild(this.shadowHost);
         this.shadowRoot = this.shadowHost.attachShadow({ mode: "open" });
         this.debugStyleElement = document.createElement("style");
         this.debugStyleElement.textContent = `
-      #intent-debug-container {
+      #jsforesight-debug-container {
         position: fixed; top: 0; left: 0; width: 100%; height: 100%;
         pointer-events: none; z-index: 9999;
       }
-      .intent-link-overlay {
+      .jsforesight-link-overlay {
         position: absolute; border: 2px solid blue;
         background-color: rgba(0, 0, 255, 0.1); box-sizing: border-box;
         transition: opacity 0.2s ease, border-color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease;
       }
-      .intent-link-overlay.active {
+      .jsforesight-link-overlay.active {
         border-color: red; background-color: rgba(255, 0, 0, 0.1);
       }
-      .intent-link-overlay.trajectory-hit {
+      .jsforesight-link-overlay.trajectory-hit {
         border-color: lime; background-color: rgba(0, 255, 0, 0.3);
         box-shadow: 0 0 10px rgba(0, 255, 0, 0.8);
       }
-      .intent-expanded-overlay {
+      .jsforesight-expanded-overlay {
         position: absolute; border: 1px dashed rgba(0, 0, 255, 0.5);
         background-color: rgba(0, 0, 255, 0.05); box-sizing: border-box;
       }
-      .intent-mouse-predicted {
+      .jsforesight-mouse-predicted {
         position: absolute; width: 20px; height: 20px; border-radius: 50%;
         border: 2px solid orange; background-color: rgba(255, 165, 0, 0.3);
         transform: translate(-50%, -50%); z-index: 10000;
       }
-      .intent-trajectory-line {
+      .jsforesight-trajectory-line {
         position: absolute; height: 2px; background-color: rgba(255, 100, 0, 0.5);
         transform-origin: left center; z-index: 9999;
       }
-      #intent-debug-controls {
+      #jsforesight-debug-controls {
         position: fixed; bottom: 10px; right: 10px;
-        background-color: rgba(0, 0, 0, 0.7); color: white; padding: 10px;
-        border-radius: 5px; font-family: monospace; font-size: 12px;
-        z-index: 10001; pointer-events: auto; /* Make controls interactive */
+        background-color: rgba(0, 0, 0, 0.75); color: white; padding: 12px;
+        border-radius: 5px; font-family: Arial, sans-serif; font-size: 13px;
+        z-index: 10001; pointer-events: auto; display: flex; flex-direction: column; gap: 8px;
+        min-width: 300px; /* Ensure enough space for title and icon */
       }
-      #intent-debug-controls h3 { margin: 0 0 5px 0; font-size: 14px; }
-      #intent-debug-controls label { display: block; margin: 5px 0; }
-      #intent-debug-controls input { margin-right: 5px; vertical-align: middle; }
-      #intent-debug-controls button {
-        margin: 5px 5px 0 0; padding: 3px 8px; background: #444;
-        border: 1px solid #666; color: white; border-radius: 3px; cursor: pointer;
+      .jsforesight-debugger-title-container {
+        display: flex; align-items: center; justify-content: center; gap: 8px; margin-bottom: 8px;
+      }
+      .jsforesight-debugger-title-container h3 { margin: 0; font-size: 15px; }
+      #jsforesight-debug-controls label { display: flex; align-items: center; gap: 5px; cursor: pointer; }
+      #jsforesight-debug-controls input[type="range"] { flex-grow: 1; margin: 0 5px; cursor: pointer;}
+      #jsforesight-debug-controls input[type="checkbox"] { margin-right: 5px; cursor: pointer; }
+      #jsforesight-debug-controls .control-row { display: flex; align-items: center; justify-content: space-between; }
+      #jsforesight-debug-controls .control-row label { flex-basis: auto; /* Adjust for better spacing */ }
+      #jsforesight-debug-controls .control-row span:not(.jsforesight-info-icon) { min-width: 30px; text-align: right; }
+      .jsforesight-info-icon {
+        display: inline-flex; align-items: center; justify-content: center;
+        width: 16px; height: 16px; border-radius: 50%;
+        background-color: #555; color: white;
+        font-size: 10px; font-style: italic; font-weight: bold;
+        font-family: 'Georgia', serif;
+        cursor: help; user-select: none;
+        flex-shrink: 0; /* Prevent icon from shrinking */
       }
-      #intent-debug-controls button:hover { background: #555; }
     `;
         this.shadowRoot.appendChild(this.debugStyleElement);
         this.debugContainer = document.createElement("div");
-        this.debugContainer.id = "intent-debug-container";
+        this.debugContainer.id = "jsforesight-debug-container";
         this.shadowRoot.appendChild(this.debugContainer);
         this.debugPredictedMouseIndicator = document.createElement("div");
-        this.debugPredictedMouseIndicator.className = "intent-mouse-predicted";
+        this.debugPredictedMouseIndicator.className = "jsforesight-mouse-predicted";
         this.debugContainer.appendChild(this.debugPredictedMouseIndicator);
         this.debugTrajectoryLine = document.createElement("div");
-        this.debugTrajectoryLine.className = "intent-trajectory-line";
+        this.debugTrajectoryLine.className = "jsforesight-trajectory-line";
         this.debugContainer.appendChild(this.debugTrajectoryLine);
-        this.createDebugControls(currentSettings); // Appends to shadowRoot
+        this.createDebugControls(currentSettings);
         links.forEach((data, element) => {
             this.createOrUpdateLinkOverlay(element, data);
         });
@@ -91,37 +99,35 @@ class IntentDebugger {
         this.shadowHost?.remove();
         this.shadowHost = null;
         this.shadowRoot = null;
+        this.debugLinkOverlays.clear();
     }
-    createOrUpdateLinkOverlay(element, linkData) {
-        if (!this.debugContainer)
+    createOrUpdateLinkOverlay(element, elementData) {
+        if (!this.debugContainer || !this.shadowRoot)
             return;
         let overlays = this.debugLinkOverlays.get(element);
         if (!overlays) {
             const linkOverlay = document.createElement("div");
-            linkOverlay.className = "intent-link-overlay";
+            linkOverlay.className = "jsforesight-link-overlay";
             this.debugContainer.appendChild(linkOverlay);
             const expandedOverlay = document.createElement("div");
-            expandedOverlay.className = "intent-expanded-overlay";
+            expandedOverlay.className = "jsforesight-expanded-overlay";
             this.debugContainer.appendChild(expandedOverlay);
             overlays = { linkOverlay, expandedOverlay };
             this.debugLinkOverlays.set(element, overlays);
         }
         const { linkOverlay, expandedOverlay } = overlays;
         const rect = element.getBoundingClientRect();
-        // Corrected: Since debugContainer is position:fixed top:0 left:0,
-        // getBoundingClientRect() coords are already relative to it.
         linkOverlay.style.left = `${rect.left}px`;
         linkOverlay.style.top = `${rect.top}px`;
         linkOverlay.style.width = `${rect.width}px`;
         linkOverlay.style.height = `${rect.height}px`;
-        linkOverlay.classList.toggle("trajectory-hit", linkData.isTrajectoryHit);
-        linkOverlay.classList.toggle("active", linkData.isHovering);
-        if (linkData.expandedRect) {
-            // Corrected: Assuming expandedRect coords are viewport-relative.
-            expandedOverlay.style.left = `${linkData.expandedRect.left}px`;
-            expandedOverlay.style.top = `${linkData.expandedRect.top}px`;
-            expandedOverlay.style.width = `${linkData.expandedRect.right - linkData.expandedRect.left}px`;
-            expandedOverlay.style.height = `${linkData.expandedRect.bottom - linkData.expandedRect.top}px`;
+        linkOverlay.classList.toggle("trajectory-hit", elementData.isTrajectoryHit);
+        linkOverlay.classList.toggle("active", elementData.isHovering);
+        if (elementData.elementBounds.expandedRect) {
+            expandedOverlay.style.left = `${elementData.elementBounds.expandedRect.left}px`;
+            expandedOverlay.style.top = `${elementData.elementBounds.expandedRect.top}px`;
+            expandedOverlay.style.width = `${elementData.elementBounds.expandedRect.right - elementData.elementBounds.expandedRect.left}px`;
+            expandedOverlay.style.height = `${elementData.elementBounds.expandedRect.bottom - elementData.elementBounds.expandedRect.top}px`;
             expandedOverlay.style.display = "block";
         }
         else {
@@ -179,65 +185,102 @@ class IntentDebugger {
         if (!this.shadowRoot)
             return;
         this.debugControlsContainer = document.createElement("div");
-        this.debugControlsContainer.id = "intent-debug-controls";
+        this.debugControlsContainer.id = "jsforesight-debug-controls";
         this.shadowRoot.appendChild(this.debugControlsContainer);
         this.debugControlsContainer.innerHTML = `
-      <h3>Trajectory Debug</h3>
-      <label>
-        <input type="checkbox" id="intent-trajectory-enabled" ${initialSettings.enableMouseTrajectory ? "checked" : ""}>
-        Enable Trajectory
-      </label>
-      <label>
-        History Size: <span id="intent-history-value">${initialSettings.positionHistorySize}</span>
-        <input type="range" id="intent-history-size" min="2" max="20" value="${initialSettings.positionHistorySize}">
-      </label>
-      <label>
-        Prediction Time: <span id="intent-prediction-value">${initialSettings.trajectoryPredictionTime}</span>ms
-        <input type="range" id="intent-prediction-time" min="10" max="500" value="${initialSettings.trajectoryPredictionTime}">
-      </label>
-     
+      <div class="jsforesight-debugger-title-container">
+        <h3>Foresight Debugger</h3>
+        <span class="jsforesight-info-icon" title="Changes made here are for the current session only and won't persist. Update initial values in the ForesightManager.initialize() props for permanent changes.">i</span>
+      </div>
+      <div class="control-row">
+        <label for="jsforesight-trajectory-enabled">
+          Enable Trajectory
+          <span class="jsforesight-info-icon" title="Toggles mouse movement prediction. If disabled, only direct hovers trigger actions.">i</span>
+        </label>
+        <input type="checkbox" id="jsforesight-trajectory-enabled" ${initialSettings.enableMouseTrajectory ? "checked" : ""}>
+      </div>
+      <div class="control-row">
+        <label for="jsforesight-history-size">
+          History Size
+          <span class="jsforesight-info-icon" title="Number of past mouse positions for velocity calculation (Min: 2, Max: 20). Higher values smooth predictions but add latency.">i</span>
+        </label>
+        <input type="range" id="jsforesight-history-size" min="2" max="20" value="${initialSettings.positionHistorySize}">
+        <span id="jsforesight-history-value">${initialSettings.positionHistorySize}</span>
+      </div>
+      <div class="control-row">
+        <label for="jsforesight-prediction-time">
+          Prediction Time (ms)
+          <span class="jsforesight-info-icon" title="How far (ms) to project trajectory (Min: 10, Max: 500). Larger values detect intent sooner.">i</span>
+        </label>
+        <input type="range" id="jsforesight-prediction-time" min="10" max="500" step="10" value="${initialSettings.trajectoryPredictionTime}">
+        <span id="jsforesight-prediction-value">${initialSettings.trajectoryPredictionTime}</span>
+      </div>
+      <div class="control-row">
+        <label for="jsforesight-throttle-delay">
+          Scroll/Resize Throttle (ms)
+          <span class="jsforesight-info-icon" title="Delay (ms) for recalculating element positions on resize/scroll (Min: 0, Max: 500). Higher values improve performance during rapid events.">i</span>
+        </label>
+        <input type="range" id="jsforesight-throttle-delay" min="0" max="500" step="10" value="${initialSettings.resizeScrollThrottleDelay}">
+        <span id="jsforesight-throttle-value">${initialSettings.resizeScrollThrottleDelay}</span>
+      </div>
     `;
-        const enabledCheckbox = this.debugControlsContainer.querySelector("#intent-trajectory-enabled");
+        const enabledCheckbox = this.debugControlsContainer.querySelector("#jsforesight-trajectory-enabled");
         enabledCheckbox.addEventListener("change", () => {
-            this.foresightManagerInstance.setTrajectorySettings({
-                enabled: enabledCheckbox.checked,
+            this.foresightManagerInstance.alterGlobalSettings({
+                enableMouseTrajectory: enabledCheckbox.checked,
             });
         });
-        const historySlider = this.debugControlsContainer.querySelector("#intent-history-size");
-        const historyValueSpan = this.debugControlsContainer.querySelector("#intent-history-value");
+        const historySlider = this.debugControlsContainer.querySelector("#jsforesight-history-size");
+        const historyValueSpan = this.debugControlsContainer.querySelector("#jsforesight-history-value");
         historySlider.addEventListener("input", () => {
             const value = parseInt(historySlider.value);
             historyValueSpan.textContent = value.toString();
-            this.foresightManagerInstance.setTrajectorySettings({ historySize: value });
+            this.foresightManagerInstance.alterGlobalSettings({
+                positionHistorySize: value,
+            });
         });
-        const predictionSlider = this.debugControlsContainer.querySelector("#intent-prediction-time");
-        const predictionValueSpan = this.debugControlsContainer.querySelector("#intent-prediction-value");
+        const predictionSlider = this.debugControlsContainer.querySelector("#jsforesight-prediction-time");
+        const predictionValueSpan = this.debugControlsContainer.querySelector("#jsforesight-prediction-value");
         predictionSlider.addEventListener("input", () => {
             const value = parseInt(predictionSlider.value);
             predictionValueSpan.textContent = value.toString();
-            this.foresightManagerInstance.setTrajectorySettings({
-                predictionTime: value,
+            this.foresightManagerInstance.alterGlobalSettings({
+                trajectoryPredictionTime: value,
+            });
+        });
+        const throttleSlider = this.debugControlsContainer.querySelector("#jsforesight-throttle-delay");
+        const throttleValueSpan = this.debugControlsContainer.querySelector("#jsforesight-throttle-value");
+        throttleSlider.addEventListener("input", () => {
+            const value = parseInt(throttleSlider.value);
+            throttleValueSpan.textContent = value.toString();
+            this.foresightManagerInstance.alterGlobalSettings({
+                resizeScrollThrottleDelay: value,
             });
         });
     }
     updateControlsState(settings) {
         if (!this.debugControlsContainer)
             return;
-        const enabledCheckbox = this.debugControlsContainer.querySelector("#intent-trajectory-enabled");
+        const enabledCheckbox = this.debugControlsContainer.querySelector("#jsforesight-trajectory-enabled");
         if (enabledCheckbox)
             enabledCheckbox.checked = settings.enableMouseTrajectory;
-        const historySlider = this.debugControlsContainer.querySelector("#intent-history-size");
-        const historyValueSpan = this.debugControlsContainer.querySelector("#intent-history-value");
+        const historySlider = this.debugControlsContainer.querySelector("#jsforesight-history-size");
+        const historyValueSpan = this.debugControlsContainer.querySelector("#jsforesight-history-value");
         if (historySlider && historyValueSpan) {
             historySlider.value = settings.positionHistorySize.toString();
             historyValueSpan.textContent = settings.positionHistorySize.toString();
         }
-        const predictionSlider = this.debugControlsContainer.querySelector("#intent-prediction-time");
-        const predictionValueSpan = this.debugControlsContainer.querySelector("#intent-prediction-value");
+        const predictionSlider = this.debugControlsContainer.querySelector("#jsforesight-prediction-time");
+        const predictionValueSpan = this.debugControlsContainer.querySelector("#jsforesight-prediction-value");
         if (predictionSlider && predictionValueSpan) {
             predictionSlider.value = settings.trajectoryPredictionTime.toString();
             predictionValueSpan.textContent = settings.trajectoryPredictionTime.toString();
         }
+        const throttleSlider = this.debugControlsContainer.querySelector("#jsforesight-throttle-delay");
+        const throttleValueSpan = this.debugControlsContainer.querySelector("#jsforesight-throttle-value");
+        if (throttleSlider && throttleValueSpan) {
+            throttleSlider.value = settings.resizeScrollThrottleDelay.toString();
+            throttleValueSpan.textContent = settings.resizeScrollThrottleDelay.toString();
+        }
     }
 }
-exports.IntentDebugger = IntentDebugger;

package/dist/ForesightManager/ForesightManager.d.ts

@@ -1,30 +1,24 @@
-import type { IntentCallback, IntentManagerProps, LinkElement } from "../types/types";
+import type { ForesightCallback, ForesightManagerProps, ForesightElement, Rect } from "../types/types";
 export declare class ForesightManager {
     private static instance;
     private links;
     private isSetup;
     private debugMode;
     private debugger;
-    private positionHistorySize;
-    private trajectoryPredictionTime;
+    private globalSettings;
     private positions;
-    private enableMouseTrajectory;
     private currentPoint;
     private predictedPoint;
     private lastResizeScrollCallTimestamp;
     private resizeScrollThrottleTimeoutId;
-    private readonly resizeScrollThrottleDelay;
     private constructor();
-    static initialize(props?: Partial<IntentManagerProps>): ForesightManager;
+    static initialize(props?: Partial<ForesightManagerProps>): ForesightManager;
     static getInstance(): ForesightManager;
     private checkTrajectoryHitExpiration;
-    register(element: LinkElement, callback: IntentCallback): () => void;
+    private normalizeHitSlop;
+    register(element: ForesightElement, callback: ForesightCallback, hitSlop?: number | Rect): () => void;
     private unregister;
-    setTrajectorySettings(settings: {
-        historySize?: number;
-        predictionTime?: number;
-        enabled?: boolean;
-    }): void;
+    alterGlobalSettings(props?: Partial<ForesightManagerProps>): void;
     private turnOnDebugMode;
     private getExpandedRect;
     private updateExpandedRect;

package/dist/ForesightManager/ForesightManager.js

@@ -1,89 +1,108 @@
-"use strict";
 "use client";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ForesightManager = void 0;
-const ForesightDebugger_1 = require("./ForesightDebugger");
-class ForesightManager {
+import { ForesightDebugger } from "./ForesightDebugger";
+export class ForesightManager {
     static instance;
     links = new Map();
     isSetup = false;
-    debugMode = false;
+    debugMode = false; // Synced with globalSettings.debug
     debugger = null;
-    positionHistorySize = 6;
-    trajectoryPredictionTime = 50;
+    globalSettings = {
+        debug: false,
+        enableMouseTrajectory: true,
+        positionHistorySize: 6,
+        trajectoryPredictionTime: 50,
+        defaultHitSlop: { top: 0, left: 0, right: 0, bottom: 0 },
+        resizeScrollThrottleDelay: 50,
+    };
     positions = [];
-    enableMouseTrajectory = true;
     currentPoint = { x: 0, y: 0 };
     predictedPoint = { x: 0, y: 0 };
     lastResizeScrollCallTimestamp = 0;
     resizeScrollThrottleTimeoutId = null;
-    resizeScrollThrottleDelay = 50;
     constructor() {
+        // Ensure defaultHitSlop is normalized if it's a number initially
+        this.globalSettings.defaultHitSlop = this.normalizeHitSlop(this.globalSettings.defaultHitSlop);
         setInterval(this.checkTrajectoryHitExpiration.bind(this), 100);
     }
     static initialize(props) {
         if (!ForesightManager.instance) {
             ForesightManager.instance = new ForesightManager();
-        }
-        if (props) {
-            ForesightManager.instance.setTrajectorySettings({
-                historySize: props.positionHistorySize,
-                predictionTime: props.trajectoryPredictionTime,
-                enabled: props.enableMouseTrajectory,
-            });
-        }
-        if (props?.debug) {
-            this.instance.turnOnDebugMode();
-        }
-        else {
-            if (this.instance.debugger) {
-                this.instance.debugMode = false;
-                this.instance.debugger.cleanup();
-                this.instance.debugger = null;
+            // Apply initial props, which also handles initial debugger setup
+            if (props) {
+                ForesightManager.instance.alterGlobalSettings(props);
             }
+            else {
+                // If no props, but default globalSettings.debug is true, ensure debugger is on
+                if (ForesightManager.instance.globalSettings.debug) {
+                    ForesightManager.instance.turnOnDebugMode();
+                }
+            }
+        }
+        else if (props) {
+            // Instance exists, apply new props (handles debugger lifecycle and UI updates)
+            ForesightManager.instance.alterGlobalSettings(props);
         }
+        // Ensure internal debugMode flag is synced
+        ForesightManager.instance.debugMode = ForesightManager.instance.globalSettings.debug;
         return ForesightManager.instance;
     }
     static getInstance() {
         if (!ForesightManager.instance) {
-            return this.initialize();
+            return this.initialize(); // Initialize with defaults
         }
         return ForesightManager.instance;
     }
     checkTrajectoryHitExpiration() {
         const now = performance.now();
         let needsVisualUpdate = false;
-        const updatedLinkElements = [];
-        this.links.forEach((linkData, element) => {
-            if (linkData.isTrajectoryHit && now - linkData.trajectoryHitTime > 300) {
+        const updatedForesightElements = [];
+        this.links.forEach((elementData, element) => {
+            if (elementData.isTrajectoryHit && now - elementData.trajectoryHitTime > 300) {
                 this.links.set(element, {
-                    ...linkData,
+                    ...elementData,
                     isTrajectoryHit: false,
                 });
                 needsVisualUpdate = true;
-                updatedLinkElements.push(element);
+                updatedForesightElements.push(element);
             }
         });
         if (needsVisualUpdate && this.debugMode && this.debugger) {
-            updatedLinkElements.forEach((element) => {
+            updatedForesightElements.forEach((element) => {
                 const data = this.links.get(element);
                 if (data && this.debugger) {
-                    console.log("asda");
                     this.debugger.createOrUpdateLinkOverlay(element, data);
                 }
             });
         }
     }
-    register(element, callback) {
-        const newLinkData = {
+    normalizeHitSlop = (hitSlop) => {
+        if (typeof hitSlop === "number") {
+            return {
+                top: hitSlop,
+                left: hitSlop,
+                right: hitSlop,
+                bottom: hitSlop,
+            };
+        }
+        return hitSlop;
+    };
+    register(element, callback, hitSlop) {
+        const normalizedHitSlop = hitSlop
+            ? this.normalizeHitSlop(hitSlop)
+            : this.globalSettings.defaultHitSlop; // Already normalized in constructor/alterGlobalSettings
+        const originalRect = element.getBoundingClientRect();
+        const newElementData = {
             callback,
-            expandedRect: null,
+            elementBounds: {
+                expandedRect: this.getExpandedRect(originalRect, normalizedHitSlop),
+                originalRect: originalRect,
+                hitSlop: normalizedHitSlop,
+            },
             isHovering: false,
             isTrajectoryHit: false,
             trajectoryHitTime: 0,
         };
-        this.links.set(element, newLinkData);
-        this.updateExpandedRect(element); // This will also update debug visuals if active
+        this.links.set(element, newElementData);
         this.setupGlobalListeners();
         if (this.debugMode && this.debugger) {
             const data = this.links.get(element);
@@ -101,42 +120,68 @@ class ForesightManager {
             this.removeGlobalListeners();
         }
     }
-    setTrajectorySettings(settings) {
-        let changed = false;
-        if (settings.historySize !== undefined && this.positionHistorySize !== settings.historySize) {
-            this.positionHistorySize = settings.historySize;
-            while (this.positions.length > this.positionHistorySize) {
+    alterGlobalSettings(props) {
+        let settingsActuallyChanged = false;
+        if (props?.positionHistorySize !== undefined &&
+            this.globalSettings.positionHistorySize !== props.positionHistorySize) {
+            this.globalSettings.positionHistorySize = props.positionHistorySize;
+            while (this.positions.length > this.globalSettings.positionHistorySize) {
                 this.positions.shift();
             }
-            changed = true;
+            settingsActuallyChanged = true;
         }
-        if (settings.predictionTime !== undefined &&
-            this.trajectoryPredictionTime !== settings.predictionTime) {
-            this.trajectoryPredictionTime = settings.predictionTime;
-            changed = true;
+        if (props?.trajectoryPredictionTime !== undefined &&
+            this.globalSettings.trajectoryPredictionTime !== props.trajectoryPredictionTime) {
+            this.globalSettings.trajectoryPredictionTime = props.trajectoryPredictionTime;
+            settingsActuallyChanged = true;
         }
-        if (settings.enabled !== undefined && this.enableMouseTrajectory !== settings.enabled) {
-            this.enableMouseTrajectory = settings.enabled;
-            changed = true;
+        if (props?.enableMouseTrajectory !== undefined &&
+            this.globalSettings.enableMouseTrajectory !== props.enableMouseTrajectory) {
+            this.globalSettings.enableMouseTrajectory = props.enableMouseTrajectory;
+            settingsActuallyChanged = true;
         }
-        if (changed && this.debugMode && this.debugger) {
-            this.debugger.updateControlsState({
-                positionHistorySize: this.positionHistorySize,
-                trajectoryPredictionTime: this.trajectoryPredictionTime,
-                enableMouseTrajectory: this.enableMouseTrajectory,
-            });
-            this.debugger.updateTrajectoryVisuals(this.currentPoint, this.predictedPoint, this.enableMouseTrajectory);
+        if (props?.defaultHitSlop !== undefined) {
+            const newSlop = this.normalizeHitSlop(props.defaultHitSlop);
+            if (JSON.stringify(this.globalSettings.defaultHitSlop) !== JSON.stringify(newSlop)) {
+                this.globalSettings.defaultHitSlop = newSlop;
+                settingsActuallyChanged = true;
+                // Note: This won't update existing elements' hitSlop unless they are re-registered.
+            }
+        }
+        if (props?.resizeScrollThrottleDelay !== undefined &&
+            this.globalSettings.resizeScrollThrottleDelay !== props.resizeScrollThrottleDelay) {
+            this.globalSettings.resizeScrollThrottleDelay = props.resizeScrollThrottleDelay;
+            settingsActuallyChanged = true;
+        }
+        if (props?.debug !== undefined && this.globalSettings.debug !== props.debug) {
+            this.globalSettings.debug = props.debug;
+            if (this.globalSettings.debug) {
+                this.turnOnDebugMode();
+            }
+            else {
+                if (this.debugger) {
+                    this.debugger.cleanup();
+                    this.debugger = null;
+                }
+            }
+            this.debugMode = this.globalSettings.debug;
+        }
+        if (settingsActuallyChanged && this.globalSettings.debug && this.debugger) {
+            this.debugger.updateControlsState(this.globalSettings);
+            this.debugger.updateTrajectoryVisuals(this.currentPoint, this.predictedPoint, this.globalSettings.enableMouseTrajectory);
         }
     }
     turnOnDebugMode() {
-        this.debugMode = true;
+        this.debugMode = true; // Ensure this is true when method is called
         if (!this.debugger) {
-            this.debugger = new ForesightDebugger_1.IntentDebugger(this);
-            this.debugger.initialize(this.links, {
-                positionHistorySize: this.positionHistorySize,
-                trajectoryPredictionTime: this.trajectoryPredictionTime,
-                enableMouseTrajectory: this.enableMouseTrajectory,
-            }, this.currentPoint, this.predictedPoint);
+            this.debugger = new ForesightDebugger(this);
+            this.debugger.initialize(this.links, this.globalSettings, this.currentPoint, this.predictedPoint);
+        }
+        else {
+            // If debugger exists, ensure its controls are up-to-date with current globalSettings
+            // This could happen if debug was false, then true again, or settings changed.
+            this.debugger.updateControlsState(this.globalSettings);
+            this.debugger.updateTrajectoryVisuals(this.currentPoint, this.predictedPoint, this.globalSettings.enableMouseTrajectory);
         }
     }
     getExpandedRect(baseRect, hitSlop) {
@@ -147,21 +192,18 @@ class ForesightManager {
             bottom: baseRect.bottom + hitSlop.bottom,
         };
     }
-    updateExpandedRect(element) {
-        const linkData = this.links.get(element);
-        if (!linkData)
+    updateExpandedRect(element, hitSlop) {
+        const elementData = this.links.get(element);
+        if (!elementData)
             return;
-        const expandedRect = this.getExpandedRect(element.getBoundingClientRect(), {
-            top: 100,
-            left: 100,
-            right: 100,
-            bottom: 100,
-        });
-        if (expandedRect != linkData.expandedRect) {
-            console.log("updating rect");
+        const expandedRect = this.getExpandedRect(element.getBoundingClientRect(), hitSlop);
+        if (JSON.stringify(expandedRect) !== JSON.stringify(elementData.elementBounds.expandedRect)) {
             this.links.set(element, {
-                ...linkData,
-                expandedRect,
+                ...elementData,
+                elementBounds: {
+                    ...elementData.elementBounds,
+                    expandedRect,
+                },
             });
         }
         if (this.debugMode && this.debugger) {
@@ -171,8 +213,8 @@ class ForesightManager {
         }
     }
     updateAllRects() {
-        this.links.forEach((_, element) => {
-            this.updateExpandedRect(element);
+        this.links.forEach((data, element) => {
+            this.updateExpandedRect(element, data.elementBounds.hitSlop);
         });
     }
     predictMousePosition = (point) => {
@@ -180,7 +222,7 @@ class ForesightManager {
         const currentPosition = { point, time: now };
         const { x, y } = point;
         this.positions.push(currentPosition);
-        if (this.positions.length > this.positionHistorySize) {
+        if (this.positions.length > this.globalSettings.positionHistorySize) {
             this.positions.shift();
         }
         if (this.positions.length < 2) {
@@ -196,7 +238,7 @@ class ForesightManager {
         const dy = last.point.y - first.point.y;
         const vx = dx / dt;
         const vy = dy / dt;
-        const trajectoryPredictionTimeInSeconds = this.trajectoryPredictionTime / 1000;
+        const trajectoryPredictionTimeInSeconds = this.globalSettings.trajectoryPredictionTime / 1000;
         const predictedX = x + vx * trajectoryPredictionTimeInSeconds;
         const predictedY = y + vy * trajectoryPredictionTimeInSeconds;
         return { x: predictedX, y: predictedY };
@@ -216,22 +258,21 @@ class ForesightManager {
     };
     handleMouseMove = (e) => {
         this.currentPoint = { x: e.clientX, y: e.clientY };
-        this.predictedPoint = this.enableMouseTrajectory
+        this.predictedPoint = this.globalSettings.enableMouseTrajectory
             ? this.predictMousePosition(this.currentPoint)
             : this.currentPoint;
         const linksToUpdateInDebugger = [];
-        this.links.forEach((linkData, element) => {
-            if (!linkData.expandedRect)
+        this.links.forEach((elementData, element) => {
+            if (!elementData.elementBounds.expandedRect)
                 return;
-            const { isHoveringInArea, shouldRunCallback } = this.isMouseInExpandedArea(linkData.expandedRect, this.currentPoint, linkData.isHovering);
+            const { isHoveringInArea, shouldRunCallback } = this.isMouseInExpandedArea(elementData.elementBounds.expandedRect, this.currentPoint, elementData.isHovering);
             let linkStateChanged = false;
-            if (this.enableMouseTrajectory && !isHoveringInArea) {
-                if (this.pointIntersectsRect(this.predictedPoint.x, this.predictedPoint.y, linkData.expandedRect)) {
-                    if (!linkData.isTrajectoryHit) {
-                        linkData.callback();
-                        console.log("trajectory");
+            if (this.globalSettings.enableMouseTrajectory && !isHoveringInArea) {
+                if (this.pointIntersectsRect(this.predictedPoint.x, this.predictedPoint.y, elementData.elementBounds.expandedRect)) {
+                    if (!elementData.isTrajectoryHit) {
+                        elementData.callback();
                         this.links.set(element, {
-                            ...linkData,
+                            ...elementData,
                             isTrajectoryHit: true,
                             trajectoryHitTime: performance.now(),
                             isHovering: isHoveringInArea,
@@ -240,10 +281,11 @@ class ForesightManager {
                     }
                 }
             }
-            if (linkData.isHovering !== isHoveringInArea) {
+            if (elementData.isHovering !== isHoveringInArea) {
                 this.links.set(element, {
-                    ...linkData,
+                    ...elementData,
                     isHovering: isHoveringInArea,
+                    // Preserve trajectory hit state if it was already hit
                     isTrajectoryHit: this.links.get(element).isTrajectoryHit,
                     trajectoryHitTime: this.links.get(element).trajectoryHitTime,
                 });
@@ -253,10 +295,9 @@ class ForesightManager {
                 linksToUpdateInDebugger.push(element);
             }
             if (shouldRunCallback) {
-                if (!linkData.isTrajectoryHit ||
-                    (linkData.isTrajectoryHit && !this.enableMouseTrajectory)) {
-                    linkData.callback();
-                    console.log("hover");
+                if (!elementData.isTrajectoryHit ||
+                    (elementData.isTrajectoryHit && !this.globalSettings.enableMouseTrajectory)) {
+                    elementData.callback();
                 }
             }
         });
@@ -266,17 +307,17 @@ class ForesightManager {
                 if (data)
                     this.debugger.createOrUpdateLinkOverlay(element, data);
             });
-            this.debugger.updateTrajectoryVisuals(this.currentPoint, this.predictedPoint, this.enableMouseTrajectory);
+            this.debugger.updateTrajectoryVisuals(this.currentPoint, this.predictedPoint, this.globalSettings.enableMouseTrajectory);
         }
     };
-    // Throttled handler for resize and scroll events
     handleResizeOrScroll = () => {
         if (this.resizeScrollThrottleTimeoutId) {
             clearTimeout(this.resizeScrollThrottleTimeoutId);
         }
         const now = performance.now();
         const timeSinceLastCall = now - this.lastResizeScrollCallTimestamp;
-        if (timeSinceLastCall >= this.resizeScrollThrottleDelay) {
+        const currentDelay = this.globalSettings.resizeScrollThrottleDelay;
+        if (timeSinceLastCall >= currentDelay) {
             this.updateAllRects();
             this.lastResizeScrollCallTimestamp = now;
             this.resizeScrollThrottleTimeoutId = null;
@@ -286,24 +327,21 @@ class ForesightManager {
                 this.updateAllRects();
                 this.lastResizeScrollCallTimestamp = performance.now();
                 this.resizeScrollThrottleTimeoutId = null;
-            }, this.resizeScrollThrottleDelay - timeSinceLastCall);
+            }, currentDelay - timeSinceLastCall);
         }
     };
     setupGlobalListeners() {
         if (this.isSetup)
             return;
         document.addEventListener("mousemove", this.handleMouseMove);
-        // Use the throttled handler for resize and scroll
         window.addEventListener("resize", this.handleResizeOrScroll);
         window.addEventListener("scroll", this.handleResizeOrScroll);
         this.isSetup = true;
     }
     removeGlobalListeners() {
         document.removeEventListener("mousemove", this.handleMouseMove);
-        // Remove the throttled handler for resize and scroll
         window.removeEventListener("resize", this.handleResizeOrScroll);
         window.removeEventListener("scroll", this.handleResizeOrScroll);
-        // Clear any pending timeout for the throttled handler
         if (this.resizeScrollThrottleTimeoutId) {
             clearTimeout(this.resizeScrollThrottleTimeoutId);
             this.resizeScrollThrottleTimeoutId = null;
@@ -311,4 +349,3 @@ class ForesightManager {
         this.isSetup = false;
     }
 }
-exports.ForesightManager = ForesightManager;

package/dist/index.js

@@ -1,22 +1,4 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __exportStar = (this && this.__exportStar) || function(m, exports) {
-    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ForesightManager = void 0;
 // Export the ForesightManager (currently called IntentManager)
-var ForesightManager_1 = require("./ForesightManager/ForesightManager");
-Object.defineProperty(exports, "ForesightManager", { enumerable: true, get: function () { return ForesightManager_1.ForesightManager; } });
+export { ForesightManager } from "./ForesightManager/ForesightManager";
 // Export any types you need
-__exportStar(require("./types/types"), exports);
+export * from "./types/types";

package/dist/types/types.d.ts

@@ -4,26 +4,103 @@ export type Rect = {
     right: number;
     bottom: number;
 };
-export type IntentCallback = () => void;
-export type LinkElement = HTMLAnchorElement;
+/**
+ * A callback function that is executed when a foresight interaction
+ * (e.g., hover, trajectory hit) occurs on a registered element.
+ * Only triggers ones per interaction
+ */
+export type ForesightCallback = () => void;
+/**
+ * Represents the HTML element that is being tracked by the ForesightManager.
+ * This is typically a standard DOM `Element`.
+ */
+export type ForesightElement = Element;
+/**
+ * Represents a mouse position captured at a specific point in time.
+ * Used for tracking mouse movement history.
+ */
 export type MousePosition = {
+    /** The (x, y) coordinates of the mouse. */
     point: Point;
+    /** The timestamp (e.g., from `performance.now()`) when this position was recorded. */
     time: number;
 };
+/**
+ * Represents a 2D point with x and y coordinates.
+ */
 export type Point = {
     x: number;
     y: number;
 };
-export type LinkData = {
-    callback: IntentCallback;
-    expandedRect: Rect | null;
+/**
+ * Internal type representing the calculated boundaries of a foresight element,
+ * including its original dimensions and the expanded hit area.
+ * (This type is not exported, but commenting it is good practice for maintainability)
+ */
+type ElementBounds = {
+    /** The expanded rectangle, including hitSlop, used for interaction detection. */
+    expandedRect: Rect;
+    /** The original bounding rectangle of the element, as returned by `getBoundingClientRect()`. */
+    originalRect: DOMRect;
+    /** The hit slop values applied to this element. */
+    hitSlop: Rect;
+};
+/**
+ * Represents the data associated with a registered foresight element.
+ * This includes its callback, boundary information, and current interaction state.
+ */
+export type ElementData = {
+    /** The callback function to execute on interaction. */
+    callback: ForesightCallback;
+    /** The boundary information for the element. */
+    elementBounds: ElementBounds;
+    /** True if the mouse cursor is currently hovering over the element's expanded bounds. */
     isHovering: boolean;
+    /** True if the predicted mouse trajectory has intersected the element's expanded bounds. */
     isTrajectoryHit: boolean;
+    /** The timestamp when the last trajectory hit occurred. */
     trajectoryHitTime: number;
 };
-export type IntentManagerProps = {
+/**
+ * Configuration options for the ForesightManager
+ */
+export type ForesightManagerProps = {
+    /**
+     * Number of mouse positions to keep in history for trajectory calculation.
+     * A higher number might lead to smoother but slightly delayed predictions.
+     * @default 6
+     */
     positionHistorySize: number;
+    /**
+     * How far ahead (in milliseconds) to predict the mouse trajectory.
+     * A larger value means the prediction extends further into the future. (meaning it will trigger callbacks sooner)
+     * @default 50
+     */
     trajectoryPredictionTime: number;
+    /**
+     * Whether to enable mouse trajectory prediction.
+     * If false, only direct hover/interaction is considered.
+     * @default true
+     */
     enableMouseTrajectory: boolean;
+    /**
+     * Whether to show visual debugging information on the screen.
+     * This includes overlays for elements, hit slop areas, and the predicted mouse path.
+     * @default false
+     */
     debug: boolean;
+    /**
+     * Default hit slop to apply to all registered elements if no specific
+     * hit slop is provided during registration.
+     * Can be a single number for uniform slop on all sides, or a Rect object
+     * for different values per side.
+     * @default { top: 0, left: 0, right: 0, bottom: 0 }
+     */
+    defaultHitSlop: Rect | number;
+    /**
+     * Amount of time in ms the element bounds get recalculated on scroll/resize of the page.
+     * @default 50
+     */
+    resizeScrollThrottleDelay: number;
 };
+export {};

package/dist/types/types.js

@@ -1,2 +1 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
+export {};

package/package.json

@@ -1,13 +1,11 @@
 {
   "name": "js.foresight",
-  "version": "0.0.5",
+  "version": "0.0.8",
   "description": "",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "scripts": {
-    "clean": "rm -rf dist",
-    "build": "pnpm clean && tsc",
-    "prepublishOnly": "pnpm build",
+    "build": "tsc --build --clean && tsc",
     "test": "cd ./test_project && pnpm dev"
   },
   "exports": {