@ai11y/core 0.0.1

package/dist/agent/types.d.mts

@@ -0,0 +1,77 @@
+import { Ai11yContext } from "../context.mjs";
+import { Instruction } from "../instruction.mjs";
+
+//#region src/agent/types.d.ts
+interface AgentResponse {
+  reply: string;
+  instructions?: Instruction[];
+}
+interface ConversationMessage {
+  role: "user" | "assistant";
+  content: string;
+}
+interface AgentRequest {
+  input: string;
+  context: Ai11yContext;
+  messages?: ConversationMessage[];
+}
+/**
+ * Configuration for LLM-based agent
+ */
+interface LLMAgentConfig {
+  /**
+   * API endpoint URL for the agent server (e.g., "http://localhost:3000/ai11y/agent")
+   */
+  apiEndpoint: string;
+}
+/**
+ * Agent mode selection
+ */
+type AgentMode = "llm" | "rule-based" | "auto";
+/**
+ * Configuration for agent selection
+ */
+interface AgentAdapterConfig {
+  /**
+   * Agent mode selection strategy
+   * - "llm": Always use LLM agent (requires llmConfig)
+   * - "rule-based": Always use rule-based agent
+   * - "auto": Use LLM if configured, fallback to rule-based on error or when offline
+   * @default "auto"
+   */
+  mode?: AgentMode;
+  /**
+   * LLM configuration (required for "llm" mode, optional for "auto")
+   */
+  llmConfig?: LLMAgentConfig | null;
+  /**
+   * Force rule-based mode (skip LLM even if config is available)
+   * @default false
+   */
+  forceRuleBased?: boolean;
+}
+/**
+ * Unified agent configuration combining LLM settings with agent selection options
+ */
+interface AgentConfig {
+  /**
+   * API endpoint URL for the LLM agent server (required for "llm" mode)
+   */
+  apiEndpoint?: string;
+  /**
+   * Agent mode selection strategy
+   * - "llm": Always use LLM agent (requires apiEndpoint)
+   * - "rule-based": Always use rule-based agent
+   * - "auto": Use LLM if apiEndpoint is provided, fallback to rule-based on error or when offline
+   * @default "auto"
+   */
+  mode?: AgentMode;
+  /**
+   * Force rule-based mode (skip LLM even if apiEndpoint is available)
+   * @default false
+   */
+  forceRuleBased?: boolean;
+}
+//#endregion
+export { AgentAdapterConfig, AgentConfig, AgentMode, AgentRequest, AgentResponse, ConversationMessage, LLMAgentConfig };
+//# sourceMappingURL=types.d.mts.map

package/dist/agent/types.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.mts","names":[],"sources":["../../src/agent/types.ts"],"sourcesContent":[],"mappings":";;;;UAGiB,aAAA;;EAAA,YAAA,CAAA,EAED,WAFc,EAEd;AAGhB;AAKiB,UALA,mBAAA,CAOP;EAOO,IAAA,EAAA,MAAA,GAAA,WAAc;EAUnB,OAAA,EAAA,MAAS;AAKrB;AAyBiB,UAjDA,YAAA,CA8DT;;WA5DE;aACE;;;;;UAMK,cAAA;;;;;;;;;KAUL,SAAA;;;;UAKK,kBAAA;;;;;;;;SAQT;;;;cAKK;;;;;;;;;;UAYI,WAAA;;;;;;;;;;;;SAaT"}

package/dist/client-api.d.mts

@@ -0,0 +1,49 @@
+import { Ai11yContext } from "./context.mjs";
+import { Instruction } from "./instruction.mjs";
+
+//#region src/client-api.d.ts
+
+/**
+ * Client interface for interacting with the AI accessibility system
+ */
+interface Ai11yClient {
+  /**
+   * Describes the current UI context (markers, route, state, errors)
+   */
+  describe(): Ai11yContext;
+  /**
+   * Executes an instruction on the UI
+   */
+  act(instruction: Instruction): void;
+  /**
+   * Tracks a custom event
+   */
+  track(event: string, payload?: unknown): void;
+  /**
+   * Reports an error to the system
+   */
+  reportError(error: Error, meta?: {
+    surface?: string;
+    markerId?: string;
+  }): void;
+}
+interface CreateClientOptions {
+  onNavigate?: (route: string) => void;
+}
+/**
+ * Creates a new AI accessibility client instance
+ *
+ * @param options - Optional configuration
+ * @returns An Ai11yClient instance
+ *
+ * @example
+ * ```ts
+ * const ctx = createClient({ onNavigate: (route) => navigate(route) })
+ * const ui = ctx.describe()
+ * ctx.act({ action: "click", id: "save_button" })
+ * ```
+ */
+declare function createClient(options?: CreateClientOptions): Ai11yClient;
+//#endregion
+export { Ai11yClient, createClient };
+//# sourceMappingURL=client-api.d.mts.map

package/dist/client-api.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"client-api.d.mts","names":[],"sources":["../src/client-api.ts"],"sourcesContent":[],"mappings":";;;;;;;AAeA;AAIa,UAJI,WAAA,CAIJ;EAKK;;;EAgBR,QAAA,EAAA,EArBG,YAqBgB;EAiBb;;;mBAjCE;;;;;;;;qBAWT;;;;;UAKC,mBAAA;;;;;;;;;;;;;;;;iBAiBM,YAAA,WAAuB,sBAAsB"}

package/dist/client-api.mjs

@@ -0,0 +1,68 @@
+import { setError, track } from "./store.mjs";
+import { getContext } from "./dom.mjs";
+import { clickMarker } from "./dom-actions/click.mjs";
+import { fillInputMarker } from "./dom-actions/fill-input.mjs";
+import { highlightMarker } from "./dom-actions/highlight.mjs";
+import { navigateToRoute } from "./dom-actions/navigate.mjs";
+import { scrollToMarker } from "./dom-actions/scroll.mjs";
+
+//#region src/client-api.ts
+/**
+* Creates a new AI accessibility client instance
+*
+* @param options - Optional configuration
+* @returns An Ai11yClient instance
+*
+* @example
+* ```ts
+* const ctx = createClient({ onNavigate: (route) => navigate(route) })
+* const ui = ctx.describe()
+* ctx.act({ action: "click", id: "save_button" })
+* ```
+*/
+function createClient(options) {
+	const { onNavigate } = options || {};
+	return {
+		describe() {
+			return getContext();
+		},
+		act(instruction) {
+			switch (instruction.action) {
+				case "click":
+					clickMarker(instruction.id);
+					break;
+				case "navigate":
+					if (onNavigate) onNavigate(instruction.route);
+					else navigateToRoute(instruction.route);
+					break;
+				case "highlight":
+					highlightMarker(instruction.id);
+					break;
+				case "scroll":
+					scrollToMarker(instruction.id);
+					break;
+				case "fillInput":
+					fillInputMarker(instruction.id, instruction.value);
+					break;
+			}
+		},
+		track(event, payload) {
+			track(event, payload);
+		},
+		reportError(error, meta) {
+			setError({
+				error,
+				meta,
+				timestamp: Date.now()
+			});
+			track("error", {
+				error: error.message,
+				meta
+			});
+		}
+	};
+}
+
+//#endregion
+export { createClient };
+//# sourceMappingURL=client-api.mjs.map

package/dist/client-api.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"client-api.mjs","names":[],"sources":["../src/client-api.ts"],"sourcesContent":["import type { Ai11yContext, Ai11yError } from \"./context.js\";\nimport { getContext } from \"./dom.js\";\nimport {\n\tclickMarker,\n\tfillInputMarker,\n\thighlightMarker,\n\tnavigateToRoute,\n\tscrollToMarker,\n} from \"./dom-actions/index.js\";\nimport type { Instruction } from \"./instruction.js\";\nimport { setError, track as trackToStore } from \"./store.js\";\n\n/**\n * Client interface for interacting with the AI accessibility system\n */\nexport interface Ai11yClient {\n\t/**\n\t * Describes the current UI context (markers, route, state, errors)\n\t */\n\tdescribe(): Ai11yContext;\n\n\t/**\n\t * Executes an instruction on the UI\n\t */\n\tact(instruction: Instruction): void;\n\n\t/**\n\t * Tracks a custom event\n\t */\n\ttrack(event: string, payload?: unknown): void;\n\n\t/**\n\t * Reports an error to the system\n\t */\n\treportError(\n\t\terror: Error,\n\t\tmeta?: { surface?: string; markerId?: string },\n\t): void;\n}\n\ninterface CreateClientOptions {\n\tonNavigate?: (route: string) => void;\n}\n\n/**\n * Creates a new AI accessibility client instance\n *\n * @param options - Optional configuration\n * @returns An Ai11yClient instance\n *\n * @example\n * ```ts\n * const ctx = createClient({ onNavigate: (route) => navigate(route) })\n * const ui = ctx.describe()\n * ctx.act({ action: \"click\", id: \"save_button\" })\n * ```\n */\nexport function createClient(options?: CreateClientOptions): Ai11yClient {\n\tconst { onNavigate } = options || {};\n\n\treturn {\n\t\tdescribe(): Ai11yContext {\n\t\t\treturn getContext();\n\t\t},\n\n\t\tact(instruction: Instruction): void {\n\t\t\tswitch (instruction.action) {\n\t\t\t\tcase \"click\":\n\t\t\t\t\tclickMarker(instruction.id);\n\t\t\t\t\tbreak;\n\t\t\t\tcase \"navigate\":\n\t\t\t\t\tif (onNavigate) {\n\t\t\t\t\t\tonNavigate(instruction.route);\n\t\t\t\t\t} else {\n\t\t\t\t\t\tnavigateToRoute(instruction.route);\n\t\t\t\t\t}\n\t\t\t\t\tbreak;\n\t\t\t\tcase \"highlight\":\n\t\t\t\t\thighlightMarker(instruction.id);\n\t\t\t\t\tbreak;\n\t\t\t\tcase \"scroll\":\n\t\t\t\t\tscrollToMarker(instruction.id);\n\t\t\t\t\tbreak;\n\t\t\t\tcase \"fillInput\":\n\t\t\t\t\tfillInputMarker(instruction.id, instruction.value);\n\t\t\t\t\tbreak;\n\t\t\t}\n\t\t},\n\n\t\ttrack(event: string, payload?: unknown): void {\n\t\t\ttrackToStore(event, payload);\n\t\t},\n\n\t\treportError(\n\t\t\terror: Error,\n\t\t\tmeta?: { surface?: string; markerId?: string },\n\t\t): void {\n\t\t\tconst assistError: Ai11yError = {\n\t\t\t\terror,\n\t\t\t\tmeta,\n\t\t\t\ttimestamp: Date.now(),\n\t\t\t};\n\t\t\tsetError(assistError);\n\t\t\ttrackToStore(\"error\", { error: error.message, meta });\n\t\t},\n\t};\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAyDA,SAAgB,aAAa,SAA4C;CACxE,MAAM,EAAE,eAAe,WAAW,EAAE;AAEpC,QAAO;EACN,WAAyB;AACxB,UAAO,YAAY;;EAGpB,IAAI,aAAgC;AACnC,WAAQ,YAAY,QAApB;IACC,KAAK;AACJ,iBAAY,YAAY,GAAG;AAC3B;IACD,KAAK;AACJ,SAAI,WACH,YAAW,YAAY,MAAM;SAE7B,iBAAgB,YAAY,MAAM;AAEnC;IACD,KAAK;AACJ,qBAAgB,YAAY,GAAG;AAC/B;IACD,KAAK;AACJ,oBAAe,YAAY,GAAG;AAC9B;IACD,KAAK;AACJ,qBAAgB,YAAY,IAAI,YAAY,MAAM;AAClD;;;EAIH,MAAM,OAAe,SAAyB;AAC7C,SAAa,OAAO,QAAQ;;EAG7B,YACC,OACA,MACO;AAMP,YALgC;IAC/B;IACA;IACA,WAAW,KAAK,KAAK;IACrB,CACoB;AACrB,SAAa,SAAS;IAAE,OAAO,MAAM;IAAS;IAAM,CAAC;;EAEtD"}

package/dist/context.d.mts

@@ -0,0 +1,29 @@
+import { Marker } from "./marker.mjs";
+
+//#region src/context.d.ts
+interface Ai11yState {
+  [key: string]: unknown;
+}
+interface Ai11yError {
+  error: Error;
+  meta?: {
+    surface?: string;
+    markerId?: string;
+  };
+  timestamp: number;
+}
+interface Ai11yEvent {
+  type: string;
+  payload?: unknown;
+  timestamp: number;
+}
+interface Ai11yContext {
+  markers: Marker[];
+  inViewMarkerIds?: string[];
+  route?: string;
+  state?: Ai11yState;
+  error?: Ai11yError | null;
+}
+//#endregion
+export { Ai11yContext, Ai11yError, Ai11yEvent, Ai11yState };
+//# sourceMappingURL=context.d.mts.map

package/dist/context.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"context.d.mts","names":[],"sources":["../src/context.ts"],"sourcesContent":[],"mappings":";;;UAEiB,UAAA;;AAAjB;AAIiB,UAAA,UAAA,CACT;EAQS,KAAA,EART,KAQS;EAMA,IAAA,CAAA,EAAA;IACP,OAAA,CAAA,EAAA,MAAA;IAGD,QAAA,CAAA,EAAA,MAAA;EACA,CAAA;EAAU,SAAA,EAAA,MAAA;;UAXF,UAAA;;;;;UAMA,YAAA;WACP;;;UAGD;UACA"}

package/dist/dom-actions/click.d.mts

@@ -0,0 +1,15 @@
+//#region src/dom-actions/click.d.ts
+/**
+ * Clicks a marker element by its ID
+ *
+ * @param markerId - The marker ID to click
+ *
+ * @example
+ * ```ts
+ * clickMarker('connect_stripe');
+ * ```
+ */
+declare function clickMarker(markerId: string): void;
+//#endregion
+export { clickMarker };
+//# sourceMappingURL=click.d.mts.map

package/dist/dom-actions/click.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"click.d.mts","names":[],"sources":["../../src/dom-actions/click.ts"],"sourcesContent":[],"mappings":";;AAaA;;;;;;;;;iBAAgB,WAAA"}

package/dist/dom-actions/click.mjs

@@ -0,0 +1,36 @@
+import { track } from "../store.mjs";
+import { findMarkerElement } from "./find-element.mjs";
+
+//#region src/dom-actions/click.ts
+/**
+* Clicks a marker element by its ID
+*
+* @param markerId - The marker ID to click
+*
+* @example
+* ```ts
+* clickMarker('connect_stripe');
+* ```
+*/
+function clickMarker(markerId) {
+	const element = findMarkerElement(markerId);
+	if (!element) {
+		console.warn(`Marker ${markerId} not found`);
+		return;
+	}
+	if ("click" in element && typeof element.click === "function") element.click();
+	else {
+		const mouseEvent = new MouseEvent("click", {
+			view: window,
+			bubbles: true,
+			cancelable: true,
+			buttons: 1
+		});
+		element.dispatchEvent(mouseEvent);
+	}
+	track("click", { markerId });
+}
+
+//#endregion
+export { clickMarker };
+//# sourceMappingURL=click.mjs.map

package/dist/dom-actions/click.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"click.mjs","names":[],"sources":["../../src/dom-actions/click.ts"],"sourcesContent":["import { track } from \"../store.js\";\nimport { findMarkerElement } from \"./find-element.js\";\n\n/**\n * Clicks a marker element by its ID\n *\n * @param markerId - The marker ID to click\n *\n * @example\n * ```ts\n * clickMarker('connect_stripe');\n * ```\n */\nexport function clickMarker(markerId: string): void {\n\tconst element = findMarkerElement(markerId);\n\tif (!element) {\n\t\tconsole.warn(`Marker ${markerId} not found`);\n\t\treturn;\n\t}\n\n\t// Prefer native click to avoid double-firing handlers (important for toggles)\n\tif (\n\t\t\"click\" in element &&\n\t\ttypeof (element as HTMLElement).click === \"function\"\n\t) {\n\t\t(element as HTMLElement).click();\n\t} else {\n\t\t// Fallback: dispatch a synthetic mouse event\n\t\tconst mouseEvent = new MouseEvent(\"click\", {\n\t\t\tview: window,\n\t\t\tbubbles: true,\n\t\t\tcancelable: true,\n\t\t\tbuttons: 1,\n\t\t});\n\t\telement.dispatchEvent(mouseEvent);\n\t}\n\n\ttrack(\"click\", { markerId });\n}\n"],"mappings":";;;;;;;;;;;;;;AAaA,SAAgB,YAAY,UAAwB;CACnD,MAAM,UAAU,kBAAkB,SAAS;AAC3C,KAAI,CAAC,SAAS;AACb,UAAQ,KAAK,UAAU,SAAS,YAAY;AAC5C;;AAID,KACC,WAAW,WACX,OAAQ,QAAwB,UAAU,WAE1C,CAAC,QAAwB,OAAO;MAC1B;EAEN,MAAM,aAAa,IAAI,WAAW,SAAS;GAC1C,MAAM;GACN,SAAS;GACT,YAAY;GACZ,SAAS;GACT,CAAC;AACF,UAAQ,cAAc,WAAW;;AAGlC,OAAM,SAAS,EAAE,UAAU,CAAC"}

package/dist/dom-actions/fill-input.d.mts

@@ -0,0 +1,17 @@
+//#region src/dom-actions/fill-input.d.ts
+/**
+ * Fills an input, textarea, or select element by its marker ID with a value, emitting native browser events
+ *
+ * @param markerId - The marker ID of the input/textarea/select element to fill
+ * @param value - The value to fill into the element. For select elements, this must match one of the available option values.
+ *
+ * @example
+ * ```ts
+ * fillInputMarker('email_input', 'test@example.com');
+ * fillInputMarker('category_select', 'feedback');
+ * ```
+ */
+declare function fillInputMarker(markerId: string, value: string): void;
+//#endregion
+export { fillInputMarker };
+//# sourceMappingURL=fill-input.d.mts.map

package/dist/dom-actions/fill-input.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"fill-input.d.mts","names":[],"sources":["../../src/dom-actions/fill-input.ts"],"sourcesContent":[],"mappings":";;AAeA;;;;;;;;;;;iBAAgB,eAAA"}

package/dist/dom-actions/fill-input.mjs

@@ -0,0 +1,69 @@
+import { track } from "../store.mjs";
+import { findMarkerElement } from "./find-element.mjs";
+
+//#region src/dom-actions/fill-input.ts
+/**
+* Fills an input, textarea, or select element by its marker ID with a value, emitting native browser events
+*
+* @param markerId - The marker ID of the input/textarea/select element to fill
+* @param value - The value to fill into the element. For select elements, this must match one of the available option values.
+*
+* @example
+* ```ts
+* fillInputMarker('email_input', 'test@example.com');
+* fillInputMarker('category_select', 'feedback');
+* ```
+*/
+function fillInputMarker(markerId, value) {
+	const element = findMarkerElement(markerId);
+	if (!element) {
+		console.warn(`Marker ${markerId} not found`);
+		return;
+	}
+	let inputElement = null;
+	let selectElement = null;
+	if (element instanceof HTMLInputElement || element instanceof HTMLTextAreaElement) inputElement = element;
+	else if (element instanceof HTMLSelectElement) selectElement = element;
+	else if (element instanceof HTMLElement) {
+		const nestedInput = element.querySelector("input, textarea");
+		if (nestedInput instanceof HTMLInputElement || nestedInput instanceof HTMLTextAreaElement) inputElement = nestedInput;
+		else {
+			const nestedSelect = element.querySelector("select");
+			if (nestedSelect instanceof HTMLSelectElement) selectElement = nestedSelect;
+		}
+	}
+	const isContentEditable = element instanceof HTMLElement && element.contentEditable === "true";
+	if (!inputElement && !selectElement && !isContentEditable) {
+		console.warn(`Marker ${markerId} does not contain an input, textarea, select, or contenteditable element`);
+		return;
+	}
+	if (inputElement) {
+		const prototype = inputElement instanceof HTMLTextAreaElement ? HTMLTextAreaElement.prototype : HTMLInputElement.prototype;
+		const setter = Object.getOwnPropertyDescriptor(prototype, "value")?.set;
+		if (setter) setter.call(inputElement, value);
+		else inputElement.value = value;
+		inputElement.dispatchEvent(new Event("input", { bubbles: true }));
+		inputElement.dispatchEvent(new Event("change", { bubbles: true }));
+		inputElement.focus();
+	} else if (selectElement) {
+		selectElement.value = value;
+		selectElement.dispatchEvent(new Event("change", { bubbles: true }));
+		selectElement.focus();
+	} else if (isContentEditable) {
+		const editableElement = element;
+		editableElement.textContent = value;
+		const inputEvent = new InputEvent("input", {
+			bubbles: true,
+			cancelable: true
+		});
+		element.dispatchEvent(inputEvent);
+	}
+	track("fillInput", {
+		markerId,
+		value
+	});
+}
+
+//#endregion
+export { fillInputMarker };
+//# sourceMappingURL=fill-input.mjs.map

package/dist/dom-actions/fill-input.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"fill-input.mjs","names":["inputElement: HTMLInputElement | HTMLTextAreaElement | null","selectElement: HTMLSelectElement | null"],"sources":["../../src/dom-actions/fill-input.ts"],"sourcesContent":["import { track } from \"../store.js\";\nimport { findMarkerElement } from \"./find-element.js\";\n\n/**\n * Fills an input, textarea, or select element by its marker ID with a value, emitting native browser events\n *\n * @param markerId - The marker ID of the input/textarea/select element to fill\n * @param value - The value to fill into the element. For select elements, this must match one of the available option values.\n *\n * @example\n * ```ts\n * fillInputMarker('email_input', 'test@example.com');\n * fillInputMarker('category_select', 'feedback');\n * ```\n */\nexport function fillInputMarker(markerId: string, value: string): void {\n\tconst element = findMarkerElement(markerId);\n\tif (!element) {\n\t\tconsole.warn(`Marker ${markerId} not found`);\n\t\treturn;\n\t}\n\n\t// If the marked element is not itself an input, try to find an input inside it\n\t// (in case Mark wraps the input in a container)\n\tlet inputElement: HTMLInputElement | HTMLTextAreaElement | null = null;\n\tlet selectElement: HTMLSelectElement | null = null;\n\n\tif (\n\t\telement instanceof HTMLInputElement ||\n\t\telement instanceof HTMLTextAreaElement\n\t) {\n\t\tinputElement = element;\n\t} else if (element instanceof HTMLSelectElement) {\n\t\tselectElement = element;\n\t} else if (element instanceof HTMLElement) {\n\t\t// Search for input, textarea, or select within the marked element\n\t\tconst nestedInput = element.querySelector(\"input, textarea\");\n\t\tif (\n\t\t\tnestedInput instanceof HTMLInputElement ||\n\t\t\tnestedInput instanceof HTMLTextAreaElement\n\t\t) {\n\t\t\tinputElement = nestedInput;\n\t\t} else {\n\t\t\tconst nestedSelect = element.querySelector(\"select\");\n\t\t\tif (nestedSelect instanceof HTMLSelectElement) {\n\t\t\t\tselectElement = nestedSelect;\n\t\t\t}\n\t\t}\n\t}\n\n\tconst isContentEditable =\n\t\telement instanceof HTMLElement && element.contentEditable === \"true\";\n\n\tif (!inputElement && !selectElement && !isContentEditable) {\n\t\tconsole.warn(\n\t\t\t`Marker ${markerId} does not contain an input, textarea, select, or contenteditable element`,\n\t\t);\n\t\treturn;\n\t}\n\n\t// Set the value property (for React controlled components)\n\tif (inputElement) {\n\t\t// Step 1: Directly set the value\n\t\t// For React-controlled inputs, we must use the native setter to bypass React's value prop\n\t\tconst prototype =\n\t\t\tinputElement instanceof HTMLTextAreaElement\n\t\t\t\t? HTMLTextAreaElement.prototype\n\t\t\t\t: HTMLInputElement.prototype;\n\t\tconst setter = Object.getOwnPropertyDescriptor(prototype, \"value\")?.set;\n\n\t\tif (setter) {\n\t\t\t// Use native setter for React-controlled inputs\n\t\t\tsetter.call(inputElement, value);\n\t\t} else {\n\t\t\t// Fallback: direct assignment for native inputs\n\t\t\tinputElement.value = value;\n\t\t}\n\n\t\t// Step 2: Dispatch the right events with bubbles: true\n\t\t// This is crucial - bubbles: true allows React/Vue/Angular to catch the events\n\t\t// input event → updates live state\n\t\tinputElement.dispatchEvent(new Event(\"input\", { bubbles: true }));\n\n\t\t// change event → commits value (important for forms)\n\t\tinputElement.dispatchEvent(new Event(\"change\", { bubbles: true }));\n\n\t\t// Step 3: Focus management (optional but useful)\n\t\t// Helps with validation, conditional UI, and accessibility expectations\n\t\tinputElement.focus();\n\t} else if (selectElement) {\n\t\t// For select elements, set the value property\n\t\tselectElement.value = value;\n\n\t\t// Dispatch change event to trigger React onChange handlers\n\t\tselectElement.dispatchEvent(new Event(\"change\", { bubbles: true }));\n\n\t\t// Focus the select element\n\t\tselectElement.focus();\n\t} else if (isContentEditable) {\n\t\t// For contenteditable elements, set textContent and dispatch events\n\t\tconst editableElement = element as HTMLElement;\n\t\teditableElement.textContent = value;\n\n\t\t// Dispatch input event\n\t\tconst inputEvent = new InputEvent(\"input\", {\n\t\t\tbubbles: true,\n\t\t\tcancelable: true,\n\t\t});\n\t\telement.dispatchEvent(inputEvent);\n\t}\n\n\ttrack(\"fillInput\", { markerId, value });\n}\n"],"mappings":";;;;;;;;;;;;;;;;AAeA,SAAgB,gBAAgB,UAAkB,OAAqB;CACtE,MAAM,UAAU,kBAAkB,SAAS;AAC3C,KAAI,CAAC,SAAS;AACb,UAAQ,KAAK,UAAU,SAAS,YAAY;AAC5C;;CAKD,IAAIA,eAA8D;CAClE,IAAIC,gBAA0C;AAE9C,KACC,mBAAmB,oBACnB,mBAAmB,oBAEnB,gBAAe;UACL,mBAAmB,kBAC7B,iBAAgB;UACN,mBAAmB,aAAa;EAE1C,MAAM,cAAc,QAAQ,cAAc,kBAAkB;AAC5D,MACC,uBAAuB,oBACvB,uBAAuB,oBAEvB,gBAAe;OACT;GACN,MAAM,eAAe,QAAQ,cAAc,SAAS;AACpD,OAAI,wBAAwB,kBAC3B,iBAAgB;;;CAKnB,MAAM,oBACL,mBAAmB,eAAe,QAAQ,oBAAoB;AAE/D,KAAI,CAAC,gBAAgB,CAAC,iBAAiB,CAAC,mBAAmB;AAC1D,UAAQ,KACP,UAAU,SAAS,0EACnB;AACD;;AAID,KAAI,cAAc;EAGjB,MAAM,YACL,wBAAwB,sBACrB,oBAAoB,YACpB,iBAAiB;EACrB,MAAM,SAAS,OAAO,yBAAyB,WAAW,QAAQ,EAAE;AAEpE,MAAI,OAEH,QAAO,KAAK,cAAc,MAAM;MAGhC,cAAa,QAAQ;AAMtB,eAAa,cAAc,IAAI,MAAM,SAAS,EAAE,SAAS,MAAM,CAAC,CAAC;AAGjE,eAAa,cAAc,IAAI,MAAM,UAAU,EAAE,SAAS,MAAM,CAAC,CAAC;AAIlE,eAAa,OAAO;YACV,eAAe;AAEzB,gBAAc,QAAQ;AAGtB,gBAAc,cAAc,IAAI,MAAM,UAAU,EAAE,SAAS,MAAM,CAAC,CAAC;AAGnE,gBAAc,OAAO;YACX,mBAAmB;EAE7B,MAAM,kBAAkB;AACxB,kBAAgB,cAAc;EAG9B,MAAM,aAAa,IAAI,WAAW,SAAS;GAC1C,SAAS;GACT,YAAY;GACZ,CAAC;AACF,UAAQ,cAAc,WAAW;;AAGlC,OAAM,aAAa;EAAE;EAAU;EAAO,CAAC"}

package/dist/dom-actions/find-element.mjs

@@ -0,0 +1,17 @@
+import { getMarkerSelector } from "../util/attributes.mjs";
+
+//#region src/dom-actions/find-element.ts
+/**
+* Finds an element by its marker ID (data-ai-id attribute)
+*
+* @param markerId - The marker ID to find
+* @returns The element if found, null otherwise
+*/
+function findMarkerElement(markerId) {
+	if (typeof document === "undefined") return null;
+	return document.querySelector(getMarkerSelector(markerId));
+}
+
+//#endregion
+export { findMarkerElement };
+//# sourceMappingURL=find-element.mjs.map

package/dist/dom-actions/find-element.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"find-element.mjs","names":[],"sources":["../../src/dom-actions/find-element.ts"],"sourcesContent":["import { getMarkerSelector } from \"../util/attributes.js\";\n\n/**\n * Finds an element by its marker ID (data-ai-id attribute)\n *\n * @param markerId - The marker ID to find\n * @returns The element if found, null otherwise\n */\nexport function findMarkerElement(markerId: string): Element | null {\n\tif (typeof document === \"undefined\") {\n\t\treturn null;\n\t}\n\treturn document.querySelector(getMarkerSelector(markerId));\n}\n"],"mappings":";;;;;;;;;AAQA,SAAgB,kBAAkB,UAAkC;AACnE,KAAI,OAAO,aAAa,YACvB,QAAO;AAER,QAAO,SAAS,cAAc,kBAAkB,SAAS,CAAC"}

package/dist/dom-actions/highlight.d.mts

@@ -0,0 +1,34 @@
+//#region src/dom-actions/highlight.d.ts
+/**
+ * Options for highlighting a marker
+ */
+interface HighlightOptions {
+  /**
+   * Callback function called when marker is highlighted
+   */
+  onHighlight?: (markerId: string, element: Element) => void;
+  /**
+   * Duration in milliseconds for the highlight (default: 2000)
+   * Set to 0 to skip visual highlighting (useful when using custom highlight wrapper)
+   */
+  duration?: number;
+}
+/**
+ * Highlights a marker element by its ID
+ * Scrolls the element into view (only if not already in view) and applies visual highlighting
+ *
+ * @param markerId - The marker ID to highlight
+ * @param options - Optional configuration for highlighting
+ *
+ * @example
+ * ```ts
+ * highlightMarker('connect_stripe', {
+ *   onHighlight: (id, el) => console.log('Highlighted:', id),
+ *   duration: 3000
+ * });
+ * ```
+ */
+declare function highlightMarker(markerId: string, options?: HighlightOptions): void;
+//#endregion
+export { HighlightOptions, highlightMarker };
+//# sourceMappingURL=highlight.d.mts.map

package/dist/dom-actions/highlight.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"highlight.d.mts","names":[],"sources":["../../src/dom-actions/highlight.ts"],"sourcesContent":[],"mappings":";;AAMA;AA6CA;UA7CiB,gBAAA;;;;4CAI0B;;;;;;;;;;;;;;;;;;;;;;iBAyC3B,eAAA,6BAEN"}

package/dist/dom-actions/highlight.mjs

@@ -0,0 +1,60 @@
+import { track } from "../store.mjs";
+import { findMarkerElement } from "./find-element.mjs";
+
+//#region src/dom-actions/highlight.ts
+/**
+* Checks if an element is currently visible in the viewport
+*/
+function isElementInView(element) {
+	const rect = element.getBoundingClientRect();
+	const windowHeight = window.innerHeight || document.documentElement.clientHeight;
+	const windowWidth = window.innerWidth || document.documentElement.clientWidth;
+	return rect.top < windowHeight && rect.bottom > 0 && rect.left < windowWidth && rect.right > 0;
+}
+/**
+* Highlights a marker element by its ID
+* Scrolls the element into view (only if not already in view) and applies visual highlighting
+*
+* @param markerId - The marker ID to highlight
+* @param options - Optional configuration for highlighting
+*
+* @example
+* ```ts
+* highlightMarker('connect_stripe', {
+*   onHighlight: (id, el) => console.log('Highlighted:', id),
+*   duration: 3000
+* });
+* ```
+*/
+function highlightMarker(markerId, options = {}) {
+	const element = findMarkerElement(markerId);
+	if (!element) {
+		console.warn(`Marker ${markerId} not found`);
+		return;
+	}
+	const { onHighlight, duration = 2e3 } = options;
+	if (!isElementInView(element)) element.scrollIntoView({
+		behavior: "smooth",
+		block: "center",
+		inline: "nearest"
+	});
+	if (onHighlight) onHighlight(markerId, element);
+	if (duration > 0) {
+		const originalOutline = element.style.outline;
+		const originalOutlineOffset = element.style.outlineOffset;
+		const originalTransition = element.style.transition;
+		element.style.outline = "3px solid #3b82f6";
+		element.style.outlineOffset = "2px";
+		element.style.transition = "outline 0.2s ease";
+		window.setTimeout(() => {
+			element.style.outline = originalOutline;
+			element.style.outlineOffset = originalOutlineOffset;
+			element.style.transition = originalTransition;
+		}, duration);
+	}
+	track("highlight", { markerId });
+}
+
+//#endregion
+export { highlightMarker };
+//# sourceMappingURL=highlight.mjs.map

package/dist/dom-actions/highlight.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"highlight.mjs","names":[],"sources":["../../src/dom-actions/highlight.ts"],"sourcesContent":["import { track } from \"../store.js\";\nimport { findMarkerElement } from \"./find-element.js\";\n\n/**\n * Options for highlighting a marker\n */\nexport interface HighlightOptions {\n\t/**\n\t * Callback function called when marker is highlighted\n\t */\n\tonHighlight?: (markerId: string, element: Element) => void;\n\t/**\n\t * Duration in milliseconds for the highlight (default: 2000)\n\t * Set to 0 to skip visual highlighting (useful when using custom highlight wrapper)\n\t */\n\tduration?: number;\n}\n\n/**\n * Checks if an element is currently visible in the viewport\n */\nfunction isElementInView(element: Element): boolean {\n\tconst rect = element.getBoundingClientRect();\n\tconst windowHeight =\n\t\twindow.innerHeight || document.documentElement.clientHeight;\n\tconst windowWidth = window.innerWidth || document.documentElement.clientWidth;\n\n\tconst isPartiallyVisible =\n\t\trect.top < windowHeight &&\n\t\trect.bottom > 0 &&\n\t\trect.left < windowWidth &&\n\t\trect.right > 0;\n\n\treturn isPartiallyVisible;\n}\n\n/**\n * Highlights a marker element by its ID\n * Scrolls the element into view (only if not already in view) and applies visual highlighting\n *\n * @param markerId - The marker ID to highlight\n * @param options - Optional configuration for highlighting\n *\n * @example\n * ```ts\n * highlightMarker('connect_stripe', {\n *   onHighlight: (id, el) => console.log('Highlighted:', id),\n *   duration: 3000\n * });\n * ```\n */\nexport function highlightMarker(\n\tmarkerId: string,\n\toptions: HighlightOptions = {},\n): void {\n\tconst element = findMarkerElement(markerId);\n\tif (!element) {\n\t\tconsole.warn(`Marker ${markerId} not found`);\n\t\treturn;\n\t}\n\n\tconst { onHighlight, duration = 2000 } = options;\n\n\tif (!isElementInView(element)) {\n\t\telement.scrollIntoView({\n\t\t\tbehavior: \"smooth\",\n\t\t\tblock: \"center\",\n\t\t\tinline: \"nearest\",\n\t\t});\n\t}\n\n\tif (onHighlight) {\n\t\tonHighlight(markerId, element);\n\t}\n\n\tif (duration > 0) {\n\t\tconst originalOutline = (element as HTMLElement).style.outline;\n\t\tconst originalOutlineOffset = (element as HTMLElement).style.outlineOffset;\n\t\tconst originalTransition = (element as HTMLElement).style.transition;\n\n\t\t(element as HTMLElement).style.outline = \"3px solid #3b82f6\";\n\t\t(element as HTMLElement).style.outlineOffset = \"2px\";\n\t\t(element as HTMLElement).style.transition = \"outline 0.2s ease\";\n\n\t\twindow.setTimeout(() => {\n\t\t\t(element as HTMLElement).style.outline = originalOutline;\n\t\t\t(element as HTMLElement).style.outlineOffset = originalOutlineOffset;\n\t\t\t(element as HTMLElement).style.transition = originalTransition;\n\t\t}, duration);\n\t}\n\n\ttrack(\"highlight\", { markerId });\n}\n"],"mappings":";;;;;;;AAqBA,SAAS,gBAAgB,SAA2B;CACnD,MAAM,OAAO,QAAQ,uBAAuB;CAC5C,MAAM,eACL,OAAO,eAAe,SAAS,gBAAgB;CAChD,MAAM,cAAc,OAAO,cAAc,SAAS,gBAAgB;AAQlE,QALC,KAAK,MAAM,gBACX,KAAK,SAAS,KACd,KAAK,OAAO,eACZ,KAAK,QAAQ;;;;;;;;;;;;;;;;;AAoBf,SAAgB,gBACf,UACA,UAA4B,EAAE,EACvB;CACP,MAAM,UAAU,kBAAkB,SAAS;AAC3C,KAAI,CAAC,SAAS;AACb,UAAQ,KAAK,UAAU,SAAS,YAAY;AAC5C;;CAGD,MAAM,EAAE,aAAa,WAAW,QAAS;AAEzC,KAAI,CAAC,gBAAgB,QAAQ,CAC5B,SAAQ,eAAe;EACtB,UAAU;EACV,OAAO;EACP,QAAQ;EACR,CAAC;AAGH,KAAI,YACH,aAAY,UAAU,QAAQ;AAG/B,KAAI,WAAW,GAAG;EACjB,MAAM,kBAAmB,QAAwB,MAAM;EACvD,MAAM,wBAAyB,QAAwB,MAAM;EAC7D,MAAM,qBAAsB,QAAwB,MAAM;AAE1D,EAAC,QAAwB,MAAM,UAAU;AACzC,EAAC,QAAwB,MAAM,gBAAgB;AAC/C,EAAC,QAAwB,MAAM,aAAa;AAE5C,SAAO,iBAAiB;AACvB,GAAC,QAAwB,MAAM,UAAU;AACzC,GAAC,QAAwB,MAAM,gBAAgB;AAC/C,GAAC,QAAwB,MAAM,aAAa;KAC1C,SAAS;;AAGb,OAAM,aAAa,EAAE,UAAU,CAAC"}

package/dist/dom-actions/navigate.d.mts

@@ -0,0 +1,16 @@
+//#region src/dom-actions/navigate.d.ts
+/**
+ * Navigates to a route
+ * Updates the route in the store and tracks the navigation event
+ *
+ * @param route - The route to navigate to
+ *
+ * @example
+ * ```ts
+ * navigateToRoute('/billing');
+ * ```
+ */
+declare function navigateToRoute(route: string): void;
+//#endregion
+export { navigateToRoute };
+//# sourceMappingURL=navigate.d.mts.map

package/dist/dom-actions/navigate.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"navigate.d.mts","names":[],"sources":["../../src/dom-actions/navigate.ts"],"sourcesContent":[],"mappings":";;AAaA;;;;;;;;;;iBAAgB,eAAA"}

package/dist/dom-actions/navigate.mjs

@@ -0,0 +1,22 @@
+import { setRoute, track } from "../store.mjs";
+
+//#region src/dom-actions/navigate.ts
+/**
+* Navigates to a route
+* Updates the route in the store and tracks the navigation event
+*
+* @param route - The route to navigate to
+*
+* @example
+* ```ts
+* navigateToRoute('/billing');
+* ```
+*/
+function navigateToRoute(route) {
+	setRoute(route);
+	track("navigate", { route });
+}
+
+//#endregion
+export { navigateToRoute };
+//# sourceMappingURL=navigate.mjs.map

package/dist/dom-actions/navigate.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"navigate.mjs","names":[],"sources":["../../src/dom-actions/navigate.ts"],"sourcesContent":["import { setRoute, track } from \"../store.js\";\n\n/**\n * Navigates to a route\n * Updates the route in the store and tracks the navigation event\n *\n * @param route - The route to navigate to\n *\n * @example\n * ```ts\n * navigateToRoute('/billing');\n * ```\n */\nexport function navigateToRoute(route: string): void {\n\tsetRoute(route);\n\ttrack(\"navigate\", { route });\n}\n"],"mappings":";;;;;;;;;;;;;;AAaA,SAAgB,gBAAgB,OAAqB;AACpD,UAAS,MAAM;AACf,OAAM,YAAY,EAAE,OAAO,CAAC"}

package/dist/dom-actions/scroll.d.mts

@@ -0,0 +1,16 @@
+//#region src/dom-actions/scroll.d.ts
+/**
+ * Scrolls to a marker element by its ID
+ * Does not apply highlight animation - use highlightMarker() if you want both scroll and highlight
+ *
+ * @param markerId - The marker ID to scroll to
+ *
+ * @example
+ * ```ts
+ * scrollToMarker('connect_stripe');
+ * ```
+ */
+declare function scrollToMarker(markerId: string): void;
+//#endregion
+export { scrollToMarker };
+//# sourceMappingURL=scroll.d.mts.map

package/dist/dom-actions/scroll.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"scroll.d.mts","names":[],"sources":["../../src/dom-actions/scroll.ts"],"sourcesContent":[],"mappings":";;AAcA;;;;;;;;;;iBAAgB,cAAA"}

package/dist/dom-actions/scroll.mjs

@@ -0,0 +1,32 @@
+import { track } from "../store.mjs";
+import { findMarkerElement } from "./find-element.mjs";
+
+//#region src/dom-actions/scroll.ts
+/**
+* Scrolls to a marker element by its ID
+* Does not apply highlight animation - use highlightMarker() if you want both scroll and highlight
+*
+* @param markerId - The marker ID to scroll to
+*
+* @example
+* ```ts
+* scrollToMarker('connect_stripe');
+* ```
+*/
+function scrollToMarker(markerId) {
+	const element = findMarkerElement(markerId);
+	if (!element) {
+		console.warn(`Marker ${markerId} not found`);
+		return;
+	}
+	element.scrollIntoView({
+		behavior: "smooth",
+		block: "center",
+		inline: "nearest"
+	});
+	track("scroll", { markerId });
+}
+
+//#endregion
+export { scrollToMarker };
+//# sourceMappingURL=scroll.mjs.map

package/dist/dom-actions/scroll.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"scroll.mjs","names":[],"sources":["../../src/dom-actions/scroll.ts"],"sourcesContent":["import { track } from \"../store.js\";\nimport { findMarkerElement } from \"./find-element.js\";\n\n/**\n * Scrolls to a marker element by its ID\n * Does not apply highlight animation - use highlightMarker() if you want both scroll and highlight\n *\n * @param markerId - The marker ID to scroll to\n *\n * @example\n * ```ts\n * scrollToMarker('connect_stripe');\n * ```\n */\nexport function scrollToMarker(markerId: string): void {\n\tconst element = findMarkerElement(markerId);\n\tif (!element) {\n\t\tconsole.warn(`Marker ${markerId} not found`);\n\t\treturn;\n\t}\n\n\telement.scrollIntoView({\n\t\tbehavior: \"smooth\",\n\t\tblock: \"center\",\n\t\tinline: \"nearest\",\n\t});\n\n\ttrack(\"scroll\", { markerId });\n}\n"],"mappings":";;;;;;;;;;;;;;;AAcA,SAAgB,eAAe,UAAwB;CACtD,MAAM,UAAU,kBAAkB,SAAS;AAC3C,KAAI,CAAC,SAAS;AACb,UAAQ,KAAK,UAAU,SAAS,YAAY;AAC5C;;AAGD,SAAQ,eAAe;EACtB,UAAU;EACV,OAAO;EACP,QAAQ;EACR,CAAC;AAEF,OAAM,UAAU,EAAE,UAAU,CAAC"}