@qontinui/ui-bridge 0.1.1

package/dist/core/index.js

@@ -0,0 +1,1424 @@
+'use strict';
+
+// src/core/element-identifier.ts
+var ID_ATTRIBUTES = ["data-ui-id", "data-testid", "data-awas-element", "id"];
+function generateXPath(element) {
+  if (element.id) {
+    return `//*[@id="${element.id}"]`;
+  }
+  const parts = [];
+  let current = element;
+  while (current && current.nodeType === Node.ELEMENT_NODE) {
+    let selector = current.nodeName.toLowerCase();
+    const uiId = current.getAttribute("data-ui-id");
+    if (uiId) {
+      selector += `[@data-ui-id="${uiId}"]`;
+      parts.unshift(selector);
+      break;
+    }
+    const testId = current.getAttribute("data-testid");
+    if (testId) {
+      selector += `[@data-testid="${testId}"]`;
+      parts.unshift(selector);
+      break;
+    }
+    const id = current.id;
+    if (id) {
+      selector += `[@id="${id}"]`;
+      parts.unshift(selector);
+      break;
+    }
+    const parentEl = current.parentElement;
+    if (parentEl) {
+      const currentEl = current;
+      const siblings = Array.from(parentEl.children).filter(
+        (child) => child.nodeName === currentEl.nodeName
+      );
+      if (siblings.length > 1) {
+        const index = siblings.indexOf(currentEl) + 1;
+        selector += `[${index}]`;
+      }
+    }
+    parts.unshift(selector);
+    current = parentEl;
+  }
+  return "/" + parts.join("/");
+}
+function generateCSSSelector(element) {
+  const uiId = element.getAttribute("data-ui-id");
+  if (uiId) {
+    return `[data-ui-id="${uiId}"]`;
+  }
+  const testId = element.getAttribute("data-testid");
+  if (testId) {
+    return `[data-testid="${testId}"]`;
+  }
+  const awasId = element.getAttribute("data-awas-element");
+  if (awasId) {
+    return `[data-awas-element="${awasId}"]`;
+  }
+  if (element.id) {
+    return `#${CSS.escape(element.id)}`;
+  }
+  const path = [];
+  let current = element;
+  while (current && current.nodeType === Node.ELEMENT_NODE) {
+    let selector = current.nodeName.toLowerCase();
+    const parentUiId = current.getAttribute("data-ui-id");
+    if (parentUiId && current !== element) {
+      path.unshift(`[data-ui-id="${parentUiId}"]`);
+      break;
+    }
+    const parentTestId = current.getAttribute("data-testid");
+    if (parentTestId && current !== element) {
+      path.unshift(`[data-testid="${parentTestId}"]`);
+      break;
+    }
+    if (current.id) {
+      path.unshift(`#${CSS.escape(current.id)}`);
+      break;
+    }
+    const parentEl = current.parentElement;
+    if (parentEl) {
+      const currentEl = current;
+      const siblings = Array.from(parentEl.children);
+      const sameTagSiblings = siblings.filter(
+        (s) => s.nodeName === currentEl.nodeName
+      );
+      if (sameTagSiblings.length > 1) {
+        const index = siblings.indexOf(currentEl) + 1;
+        selector += `:nth-child(${index})`;
+      }
+    }
+    path.unshift(selector);
+    current = current.parentElement;
+  }
+  return path.join(" > ");
+}
+function getBestIdentifier(element) {
+  const uiId = element.getAttribute("data-ui-id");
+  if (uiId) return uiId;
+  const testId = element.getAttribute("data-testid");
+  if (testId) return testId;
+  const awasId = element.getAttribute("data-awas-element");
+  if (awasId) return awasId;
+  if (element.id) return element.id;
+  return generateCSSSelector(element);
+}
+function createElementIdentifier(element) {
+  return {
+    uiId: element.getAttribute("data-ui-id") || void 0,
+    testId: element.getAttribute("data-testid") || void 0,
+    awasId: element.getAttribute("data-awas-element") || void 0,
+    htmlId: element.id || void 0,
+    xpath: generateXPath(element),
+    selector: generateCSSSelector(element)
+  };
+}
+function findElementByIdentifier(identifier, root = document) {
+  if (typeof identifier === "string") {
+    const byUiId = root.querySelector(`[data-ui-id="${identifier}"]`);
+    if (byUiId) return byUiId;
+    const byTestId = root.querySelector(`[data-testid="${identifier}"]`);
+    if (byTestId) return byTestId;
+    const byAwasId = root.querySelector(`[data-awas-element="${identifier}"]`);
+    if (byAwasId) return byAwasId;
+    const byId = root.querySelector(`#${CSS.escape(identifier)}`);
+    if (byId) return byId;
+    try {
+      const bySelector = root.querySelector(identifier);
+      if (bySelector) return bySelector;
+    } catch {
+    }
+    try {
+      const result = document.evaluate(
+        identifier,
+        root,
+        null,
+        XPathResult.FIRST_ORDERED_NODE_TYPE,
+        null
+      );
+      if (result.singleNodeValue instanceof HTMLElement) {
+        return result.singleNodeValue;
+      }
+    } catch {
+    }
+    return null;
+  }
+  if (identifier.uiId) {
+    const el = root.querySelector(`[data-ui-id="${identifier.uiId}"]`);
+    if (el) return el;
+  }
+  if (identifier.testId) {
+    const el = root.querySelector(`[data-testid="${identifier.testId}"]`);
+    if (el) return el;
+  }
+  if (identifier.awasId) {
+    const el = root.querySelector(`[data-awas-element="${identifier.awasId}"]`);
+    if (el) return el;
+  }
+  if (identifier.htmlId) {
+    const el = root.querySelector(`#${CSS.escape(identifier.htmlId)}`);
+    if (el) return el;
+  }
+  if (identifier.selector) {
+    try {
+      const el = root.querySelector(identifier.selector);
+      if (el) return el;
+    } catch {
+    }
+  }
+  if (identifier.xpath) {
+    try {
+      const result = document.evaluate(
+        identifier.xpath,
+        root,
+        null,
+        XPathResult.FIRST_ORDERED_NODE_TYPE,
+        null
+      );
+      if (result.singleNodeValue instanceof HTMLElement) {
+        return result.singleNodeValue;
+      }
+    } catch {
+    }
+  }
+  return null;
+}
+function findAllElementsByIdentifier(pattern, root = document) {
+  const results = [];
+  try {
+    const elements = root.querySelectorAll(pattern);
+    results.push(...Array.from(elements));
+    if (results.length > 0) return results;
+  } catch {
+  }
+  const partials = [
+    `[data-ui-id*="${pattern}"]`,
+    `[data-testid*="${pattern}"]`,
+    `[data-awas-element*="${pattern}"]`,
+    `[id*="${pattern}"]`
+  ];
+  for (const selector of partials) {
+    try {
+      const elements = root.querySelectorAll(selector);
+      for (const el of elements) {
+        if (!results.includes(el)) {
+          results.push(el);
+        }
+      }
+    } catch {
+    }
+  }
+  return results;
+}
+function elementMatchesIdentifier(element, identifier) {
+  if (typeof identifier === "string") {
+    return element.getAttribute("data-ui-id") === identifier || element.getAttribute("data-testid") === identifier || element.getAttribute("data-awas-element") === identifier || element.id === identifier || element.matches(identifier);
+  }
+  return identifier.uiId && element.getAttribute("data-ui-id") === identifier.uiId || identifier.testId && element.getAttribute("data-testid") === identifier.testId || identifier.awasId && element.getAttribute("data-awas-element") === identifier.awasId || identifier.htmlId && element.id === identifier.htmlId || false;
+}
+
+// src/core/registry.ts
+function getElementState(element) {
+  const rect = element.getBoundingClientRect();
+  const computedStyle = window.getComputedStyle(element);
+  const state = {
+    visible: isElementVisible(element, rect, computedStyle),
+    enabled: !isElementDisabled(element),
+    focused: document.activeElement === element,
+    rect: {
+      x: rect.x,
+      y: rect.y,
+      width: rect.width,
+      height: rect.height,
+      top: rect.top,
+      right: rect.right,
+      bottom: rect.bottom,
+      left: rect.left
+    },
+    textContent: element.textContent?.trim() || void 0,
+    computedStyles: {
+      display: computedStyle.display,
+      visibility: computedStyle.visibility,
+      opacity: computedStyle.opacity,
+      pointerEvents: computedStyle.pointerEvents
+    }
+  };
+  if (element instanceof HTMLInputElement) {
+    state.value = element.value;
+    if (element.type === "checkbox" || element.type === "radio") {
+      state.checked = element.checked;
+    }
+  } else if (element instanceof HTMLTextAreaElement) {
+    state.value = element.value;
+  } else if (element instanceof HTMLSelectElement) {
+    state.value = element.value;
+    state.selectedOptions = Array.from(element.selectedOptions).map((opt) => opt.value);
+  }
+  return state;
+}
+function isElementVisible(element, rect, style) {
+  if (rect.width === 0 || rect.height === 0) return false;
+  if (style.display === "none") return false;
+  if (style.visibility === "hidden") return false;
+  if (parseFloat(style.opacity) === 0) return false;
+  const inViewport = rect.top < window.innerHeight && rect.bottom > 0 && rect.left < window.innerWidth && rect.right > 0;
+  return inViewport;
+}
+function isElementDisabled(element) {
+  if ("disabled" in element && element.disabled) {
+    return true;
+  }
+  if (element.getAttribute("aria-disabled") === "true") {
+    return true;
+  }
+  return false;
+}
+function inferActions(type) {
+  const baseActions = ["focus", "blur", "hover"];
+  switch (type) {
+    case "button":
+      return [...baseActions, "click", "doubleClick", "rightClick"];
+    case "input":
+      return [...baseActions, "click", "type", "clear"];
+    case "textarea":
+      return [...baseActions, "click", "type", "clear"];
+    case "select":
+      return [...baseActions, "click", "select"];
+    case "checkbox":
+      return [...baseActions, "click", "check", "uncheck", "toggle"];
+    case "radio":
+      return [...baseActions, "click", "check"];
+    case "link":
+      return [...baseActions, "click"];
+    case "form":
+      return ["focus", "blur"];
+    case "menu":
+    case "menuitem":
+      return [...baseActions, "click"];
+    case "tab":
+      return [...baseActions, "click"];
+    case "dialog":
+      return ["focus", "blur"];
+    case "custom":
+    default:
+      return [...baseActions, "click"];
+  }
+}
+function inferElementType(element) {
+  const tagName = element.tagName.toLowerCase();
+  const role = element.getAttribute("role");
+  if (role) {
+    switch (role) {
+      case "button":
+        return "button";
+      case "textbox":
+        return "input";
+      case "checkbox":
+        return "checkbox";
+      case "radio":
+        return "radio";
+      case "link":
+        return "link";
+      case "listbox":
+      case "combobox":
+        return "select";
+      case "menu":
+        return "menu";
+      case "menuitem":
+        return "menuitem";
+      case "tab":
+        return "tab";
+      case "dialog":
+        return "dialog";
+    }
+  }
+  switch (tagName) {
+    case "button":
+      return "button";
+    case "input": {
+      const inputType = element.type;
+      if (inputType === "checkbox") return "checkbox";
+      if (inputType === "radio") return "radio";
+      if (inputType === "submit" || inputType === "button") return "button";
+      return "input";
+    }
+    case "textarea":
+      return "textarea";
+    case "select":
+      return "select";
+    case "a":
+      return "link";
+    case "form":
+      return "form";
+    default:
+      return "custom";
+  }
+}
+var UIBridgeRegistry = class {
+  constructor(options = {}) {
+    this.elements = /* @__PURE__ */ new Map();
+    this.components = /* @__PURE__ */ new Map();
+    this.workflows = /* @__PURE__ */ new Map();
+    this.eventListeners = /* @__PURE__ */ new Map();
+    // State management
+    this.states = /* @__PURE__ */ new Map();
+    this.stateGroups = /* @__PURE__ */ new Map();
+    this.transitions = /* @__PURE__ */ new Map();
+    this.activeStates = /* @__PURE__ */ new Set();
+    this.options = options;
+  }
+  /**
+   * Emit an event
+   */
+  emit(type, data) {
+    const event = {
+      type,
+      timestamp: Date.now(),
+      data
+    };
+    this.options.onEvent?.(event);
+    const listeners = this.eventListeners.get(type);
+    if (listeners) {
+      for (const listener of listeners) {
+        try {
+          listener(event);
+        } catch (error) {
+          console.error(`Error in event listener for ${type}:`, error);
+        }
+      }
+    }
+    if (this.options.verbose) {
+      console.log("[UIBridge]", type, data);
+    }
+  }
+  /**
+   * Register an event listener
+   */
+  on(type, listener) {
+    if (!this.eventListeners.has(type)) {
+      this.eventListeners.set(type, /* @__PURE__ */ new Set());
+    }
+    this.eventListeners.get(type).add(listener);
+    return () => {
+      this.eventListeners.get(type)?.delete(listener);
+    };
+  }
+  /**
+   * Remove an event listener
+   */
+  off(type, listener) {
+    this.eventListeners.get(type)?.delete(listener);
+  }
+  /**
+   * Register an element
+   */
+  registerElement(id, element, options = {}) {
+    const type = options.type ?? inferElementType(element);
+    const actions = options.actions ?? inferActions(type);
+    element.setAttribute("data-ui-id", id);
+    const registered = {
+      id,
+      element,
+      type,
+      label: options.label,
+      actions,
+      customActions: options.customActions,
+      getState: () => getElementState(element),
+      getIdentifier: () => createElementIdentifier(element),
+      registeredAt: Date.now(),
+      mounted: true
+    };
+    this.elements.set(id, registered);
+    this.emit("element:registered", { id, type, label: options.label });
+    return registered;
+  }
+  /**
+   * Unregister an element
+   */
+  unregisterElement(id) {
+    const registered = this.elements.get(id);
+    if (registered) {
+      registered.mounted = false;
+      registered.element.removeAttribute("data-ui-id");
+      this.elements.delete(id);
+      this.emit("element:unregistered", { id });
+      return true;
+    }
+    return false;
+  }
+  /**
+   * Get a registered element
+   */
+  getElement(id) {
+    return this.elements.get(id);
+  }
+  /**
+   * Get all registered elements
+   */
+  getAllElements() {
+    return Array.from(this.elements.values());
+  }
+  /**
+   * Find element by DOM element reference
+   */
+  findByDOMElement(element) {
+    for (const registered of this.elements.values()) {
+      if (registered.element === element) {
+        return registered;
+      }
+    }
+    return void 0;
+  }
+  /**
+   * Register a component
+   */
+  registerComponent(id, options) {
+    const registered = {
+      id,
+      name: options.name,
+      description: options.description,
+      actions: options.actions?.map((a) => ({
+        id: a.id,
+        label: a.label,
+        description: a.description,
+        handler: a.handler
+      })) ?? [],
+      elementIds: options.elementIds,
+      registeredAt: Date.now(),
+      mounted: true
+    };
+    this.components.set(id, registered);
+    this.emit("component:registered", { id, name: options.name });
+    return registered;
+  }
+  /**
+   * Unregister a component
+   */
+  unregisterComponent(id) {
+    const component = this.components.get(id);
+    if (component) {
+      component.mounted = false;
+      this.components.delete(id);
+      this.emit("component:unregistered", { id });
+      return true;
+    }
+    return false;
+  }
+  /**
+   * Get a registered component
+   */
+  getComponent(id) {
+    return this.components.get(id);
+  }
+  /**
+   * Get all registered components
+   */
+  getAllComponents() {
+    return Array.from(this.components.values());
+  }
+  /**
+   * Register a workflow
+   */
+  registerWorkflow(workflow) {
+    this.workflows.set(workflow.id, workflow);
+    return workflow;
+  }
+  /**
+   * Unregister a workflow
+   */
+  unregisterWorkflow(id) {
+    return this.workflows.delete(id);
+  }
+  /**
+   * Get a workflow
+   */
+  getWorkflow(id) {
+    return this.workflows.get(id);
+  }
+  /**
+   * Get all workflows
+   */
+  getAllWorkflows() {
+    return Array.from(this.workflows.values());
+  }
+  // ==========================================================================
+  // State Management
+  // ==========================================================================
+  /**
+   * Register a state
+   */
+  registerState(state) {
+    this.states.set(state.id, state);
+    this.emit("element:registered", { id: state.id, type: "state", name: state.name });
+    return state;
+  }
+  /**
+   * Unregister a state
+   */
+  unregisterState(id) {
+    const state = this.states.get(id);
+    if (state) {
+      this.activeStates.delete(id);
+      this.states.delete(id);
+      this.emit("element:unregistered", { id, type: "state" });
+      return true;
+    }
+    return false;
+  }
+  /**
+   * Get a registered state
+   */
+  getState(id) {
+    return this.states.get(id);
+  }
+  /**
+   * Get all registered states
+   */
+  getAllStates() {
+    return Array.from(this.states.values());
+  }
+  /**
+   * Register a state group
+   */
+  registerStateGroup(group) {
+    this.stateGroups.set(group.id, group);
+    return group;
+  }
+  /**
+   * Unregister a state group
+   */
+  unregisterStateGroup(id) {
+    return this.stateGroups.delete(id);
+  }
+  /**
+   * Get a state group
+   */
+  getStateGroup(id) {
+    return this.stateGroups.get(id);
+  }
+  /**
+   * Get all state groups
+   */
+  getAllStateGroups() {
+    return Array.from(this.stateGroups.values());
+  }
+  /**
+   * Register a transition
+   */
+  registerTransition(transition) {
+    this.transitions.set(transition.id, transition);
+    return transition;
+  }
+  /**
+   * Unregister a transition
+   */
+  unregisterTransition(id) {
+    return this.transitions.delete(id);
+  }
+  /**
+   * Get a transition
+   */
+  getTransition(id) {
+    return this.transitions.get(id);
+  }
+  /**
+   * Get all transitions
+   */
+  getAllTransitions() {
+    return Array.from(this.transitions.values());
+  }
+  /**
+   * Get currently active states
+   */
+  getActiveStates() {
+    return Array.from(this.activeStates);
+  }
+  /**
+   * Check if a state is active
+   */
+  isStateActive(id) {
+    return this.activeStates.has(id);
+  }
+  /**
+   * Activate a state
+   */
+  activateState(id) {
+    const state = this.states.get(id);
+    if (!state) {
+      return false;
+    }
+    for (const activeId of this.activeStates) {
+      const activeState = this.states.get(activeId);
+      if (activeState?.blocking && activeState.id !== id) {
+        return false;
+      }
+      if (activeState?.blocks?.includes(id)) {
+        return false;
+      }
+    }
+    const wasActive = this.activeStates.has(id);
+    this.activeStates.add(id);
+    if (!wasActive) {
+      this.emit("element:stateChanged", {
+        stateId: id,
+        active: true,
+        activeStates: this.getActiveStates()
+      });
+    }
+    return true;
+  }
+  /**
+   * Deactivate a state
+   */
+  deactivateState(id) {
+    const wasActive = this.activeStates.has(id);
+    this.activeStates.delete(id);
+    if (wasActive) {
+      this.emit("element:stateChanged", {
+        stateId: id,
+        active: false,
+        activeStates: this.getActiveStates()
+      });
+    }
+    return wasActive;
+  }
+  /**
+   * Activate multiple states
+   */
+  activateStates(ids) {
+    const activated = [];
+    for (const id of ids) {
+      if (this.activateState(id)) {
+        activated.push(id);
+      }
+    }
+    return activated;
+  }
+  /**
+   * Deactivate multiple states
+   */
+  deactivateStates(ids) {
+    const deactivated = [];
+    for (const id of ids) {
+      if (this.deactivateState(id)) {
+        deactivated.push(id);
+      }
+    }
+    return deactivated;
+  }
+  /**
+   * Activate a state group (all states in the group)
+   */
+  activateStateGroup(groupId) {
+    const group = this.stateGroups.get(groupId);
+    if (!group) return [];
+    return this.activateStates(group.states);
+  }
+  /**
+   * Deactivate a state group (all states in the group)
+   */
+  deactivateStateGroup(groupId) {
+    const group = this.stateGroups.get(groupId);
+    if (!group) return [];
+    return this.deactivateStates(group.states);
+  }
+  /**
+   * Check if a transition can be executed from current state
+   */
+  canExecuteTransition(transitionId) {
+    const transition = this.transitions.get(transitionId);
+    if (!transition) return false;
+    return transition.fromStates.some((stateId) => this.activeStates.has(stateId));
+  }
+  /**
+   * Execute a transition
+   */
+  async executeTransition(transitionId) {
+    const startTime = performance.now();
+    const transition = this.transitions.get(transitionId);
+    if (!transition) {
+      return {
+        success: false,
+        activatedStates: [],
+        deactivatedStates: [],
+        error: `Transition not found: ${transitionId}`,
+        durationMs: performance.now() - startTime
+      };
+    }
+    if (!this.canExecuteTransition(transitionId)) {
+      return {
+        success: false,
+        activatedStates: [],
+        deactivatedStates: [],
+        error: "Precondition not met: none of the fromStates are active",
+        failedPhase: "precondition",
+        durationMs: performance.now() - startTime
+      };
+    }
+    try {
+      const deactivated = this.deactivateStates(transition.exitStates);
+      if (transition.exitGroups) {
+        for (const groupId of transition.exitGroups) {
+          deactivated.push(...this.deactivateStateGroup(groupId));
+        }
+      }
+      const activated = this.activateStates(transition.activateStates);
+      if (transition.activateGroups) {
+        for (const groupId of transition.activateGroups) {
+          activated.push(...this.activateStateGroup(groupId));
+        }
+      }
+      return {
+        success: true,
+        activatedStates: activated,
+        deactivatedStates: deactivated,
+        durationMs: performance.now() - startTime
+      };
+    } catch (error) {
+      return {
+        success: false,
+        activatedStates: [],
+        deactivatedStates: [],
+        error: error instanceof Error ? error.message : String(error),
+        failedPhase: "execution",
+        durationMs: performance.now() - startTime
+      };
+    }
+  }
+  /**
+   * Find a path from current state to target states
+   *
+   * Uses a simple BFS algorithm for pathfinding.
+   * For more advanced pathfinding (Dijkstra, A*), use the Python state manager service.
+   */
+  findPath(targetStates) {
+    if (targetStates.every((t) => this.activeStates.has(t))) {
+      return {
+        found: true,
+        transitions: [],
+        totalCost: 0,
+        targetStates,
+        estimatedSteps: 0
+      };
+    }
+    const queue = [
+      { activeStates: new Set(this.activeStates), path: [], cost: 0 }
+    ];
+    const visited = /* @__PURE__ */ new Set();
+    while (queue.length > 0) {
+      const current = queue.shift();
+      const stateKey = Array.from(current.activeStates).sort().join(",");
+      if (visited.has(stateKey)) continue;
+      visited.add(stateKey);
+      if (targetStates.every((t) => current.activeStates.has(t))) {
+        return {
+          found: true,
+          transitions: current.path,
+          totalCost: current.cost,
+          targetStates,
+          estimatedSteps: current.path.length
+        };
+      }
+      for (const transition of this.transitions.values()) {
+        const canExecute = transition.fromStates.some((s) => current.activeStates.has(s));
+        if (!canExecute) continue;
+        const newActive = new Set(current.activeStates);
+        for (const s of transition.exitStates) newActive.delete(s);
+        for (const s of transition.activateStates) newActive.add(s);
+        const newCost = current.cost + (transition.pathCost ?? 1);
+        queue.push({
+          activeStates: newActive,
+          path: [...current.path, transition.id],
+          cost: newCost
+        });
+      }
+    }
+    return {
+      found: false,
+      transitions: [],
+      totalCost: 0,
+      targetStates,
+      estimatedSteps: 0
+    };
+  }
+  /**
+   * Navigate to target states using pathfinding
+   */
+  async navigateTo(targetStates) {
+    const startTime = performance.now();
+    const path = this.findPath(targetStates);
+    if (!path.found) {
+      return {
+        success: false,
+        path,
+        executedTransitions: [],
+        finalActiveStates: this.getActiveStates(),
+        error: `No path found to target states: ${targetStates.join(", ")}`,
+        durationMs: performance.now() - startTime
+      };
+    }
+    const executedTransitions = [];
+    for (const transitionId of path.transitions) {
+      const result = await this.executeTransition(transitionId);
+      if (!result.success) {
+        return {
+          success: false,
+          path,
+          executedTransitions,
+          finalActiveStates: this.getActiveStates(),
+          error: result.error,
+          durationMs: performance.now() - startTime
+        };
+      }
+      executedTransitions.push(transitionId);
+    }
+    return {
+      success: true,
+      path,
+      executedTransitions,
+      finalActiveStates: this.getActiveStates(),
+      durationMs: performance.now() - startTime
+    };
+  }
+  /**
+   * Create a state snapshot
+   */
+  createStateSnapshot() {
+    return {
+      timestamp: Date.now(),
+      activeStates: this.getActiveStates(),
+      states: this.getAllStates(),
+      groups: this.getAllStateGroups(),
+      transitions: this.getAllTransitions()
+    };
+  }
+  /**
+   * Create a snapshot of the current state
+   */
+  createSnapshot() {
+    return {
+      timestamp: Date.now(),
+      elements: this.getAllElements().map((el) => ({
+        id: el.id,
+        type: el.type,
+        label: el.label,
+        identifier: el.getIdentifier(),
+        state: el.getState(),
+        actions: el.actions,
+        customActions: el.customActions ? Object.keys(el.customActions) : void 0
+      })),
+      components: this.getAllComponents().map((comp) => ({
+        id: comp.id,
+        name: comp.name,
+        description: comp.description,
+        actions: comp.actions.map((a) => a.id),
+        elementIds: comp.elementIds
+      })),
+      workflows: this.getAllWorkflows().map((wf) => ({
+        id: wf.id,
+        name: wf.name,
+        description: wf.description,
+        stepCount: wf.steps.length
+      }))
+    };
+  }
+  /**
+   * Clear all registrations
+   */
+  clear() {
+    this.elements.clear();
+    this.components.clear();
+    this.workflows.clear();
+    this.eventListeners.clear();
+    this.states.clear();
+    this.stateGroups.clear();
+    this.transitions.clear();
+    this.activeStates.clear();
+  }
+  /**
+   * Get registry statistics
+   */
+  getStats() {
+    const elements = this.getAllElements();
+    const components = this.getAllComponents();
+    return {
+      elementCount: elements.length,
+      componentCount: components.length,
+      workflowCount: this.workflows.size,
+      mountedElementCount: elements.filter((e) => e.mounted).length,
+      mountedComponentCount: components.filter((c) => c.mounted).length,
+      stateCount: this.states.size,
+      stateGroupCount: this.stateGroups.size,
+      transitionCount: this.transitions.size,
+      activeStateCount: this.activeStates.size
+    };
+  }
+};
+var globalRegistry = null;
+function getGlobalRegistry() {
+  if (!globalRegistry) {
+    globalRegistry = new UIBridgeRegistry();
+  }
+  return globalRegistry;
+}
+function setGlobalRegistry(registry) {
+  globalRegistry = registry;
+}
+function resetGlobalRegistry() {
+  globalRegistry?.clear();
+  globalRegistry = null;
+}
+
+// src/core/websocket-client.ts
+function generateId() {
+  return `${Date.now()}-${Math.random().toString(36).slice(2, 11)}`;
+}
+var UIBridgeWSClient = class {
+  constructor(config) {
+    this.ws = null;
+    this.state = "disconnected";
+    this.clientId = null;
+    this.reconnectAttempts = 0;
+    this.reconnectTimer = null;
+    this.pingTimer = null;
+    this.pendingRequests = /* @__PURE__ */ new Map();
+    // Event listeners
+    this.connectionListeners = /* @__PURE__ */ new Set();
+    this.eventListeners = /* @__PURE__ */ new Map();
+    this.errorListeners = /* @__PURE__ */ new Set();
+    // Current subscriptions
+    this.subscriptions = {};
+    this.config = {
+      url: config.url,
+      autoReconnect: config.autoReconnect ?? true,
+      reconnectDelay: config.reconnectDelay ?? 1e3,
+      maxReconnectAttempts: config.maxReconnectAttempts ?? 10,
+      pingInterval: config.pingInterval ?? 3e4,
+      connectionTimeout: config.connectionTimeout ?? 1e4
+    };
+  }
+  /**
+   * Get current connection state
+   */
+  get connectionState() {
+    return this.state;
+  }
+  /**
+   * Get assigned client ID
+   */
+  get id() {
+    return this.clientId;
+  }
+  /**
+   * Connect to the WebSocket server
+   */
+  connect() {
+    return new Promise((resolve, reject) => {
+      if (this.ws && this.state === "connected") {
+        resolve();
+        return;
+      }
+      this.setState("connecting");
+      try {
+        this.ws = new WebSocket(this.config.url);
+      } catch (error) {
+        this.setState("disconnected");
+        reject(error);
+        return;
+      }
+      const connectionTimeout = setTimeout(() => {
+        if (this.state === "connecting") {
+          this.ws?.close();
+          this.setState("disconnected");
+          reject(new Error("Connection timeout"));
+        }
+      }, this.config.connectionTimeout);
+      this.ws.onopen = () => {
+        clearTimeout(connectionTimeout);
+      };
+      this.ws.onmessage = (event) => {
+        try {
+          const message = JSON.parse(event.data);
+          this.handleMessage(message);
+          if (message.type === "welcome") {
+            clearTimeout(connectionTimeout);
+            this.reconnectAttempts = 0;
+            this.setState("connected");
+            this.startPingInterval();
+            if (this.subscriptions.events?.length || this.subscriptions.elementIds?.length || this.subscriptions.componentIds?.length) {
+              this.subscribe(this.subscriptions);
+            }
+            resolve();
+          }
+        } catch (error) {
+          console.error("Failed to parse WebSocket message:", error);
+        }
+      };
+      this.ws.onerror = (_event) => {
+        clearTimeout(connectionTimeout);
+        const error = new Error("WebSocket error");
+        this.notifyError(error);
+        if (this.state === "connecting") {
+          reject(error);
+        }
+      };
+      this.ws.onclose = () => {
+        clearTimeout(connectionTimeout);
+        this.stopPingInterval();
+        this.clientId = null;
+        const wasConnected = this.state === "connected";
+        this.setState("disconnected");
+        for (const [_id, pending] of this.pendingRequests) {
+          clearTimeout(pending.timeout);
+          pending.reject(new Error("Connection closed"));
+        }
+        this.pendingRequests.clear();
+        if (wasConnected && this.config.autoReconnect && (this.config.maxReconnectAttempts === 0 || this.reconnectAttempts < this.config.maxReconnectAttempts)) {
+          this.scheduleReconnect();
+        }
+      };
+    });
+  }
+  /**
+   * Disconnect from the server
+   */
+  disconnect() {
+    if (this.reconnectTimer) {
+      clearTimeout(this.reconnectTimer);
+      this.reconnectTimer = null;
+    }
+    this.stopPingInterval();
+    if (this.ws) {
+      this.ws.close();
+      this.ws = null;
+    }
+    this.setState("disconnected");
+  }
+  /**
+   * Subscribe to events
+   */
+  async subscribe(options) {
+    this.subscriptions = { ...this.subscriptions, ...options };
+    const response = await this.sendRequest({
+      id: generateId(),
+      type: "subscribe",
+      timestamp: Date.now(),
+      payload: options
+    });
+    return response.events;
+  }
+  /**
+   * Unsubscribe from events
+   */
+  async unsubscribe(events) {
+    if (events) {
+      this.subscriptions.events = this.subscriptions.events?.filter((e) => !events.includes(e));
+    } else {
+      this.subscriptions = {};
+    }
+    const response = await this.sendRequest({
+      id: generateId(),
+      type: "unsubscribe",
+      timestamp: Date.now(),
+      payload: { events }
+    });
+    return response.events;
+  }
+  /**
+   * Find elements
+   */
+  async find(options) {
+    const response = await this.sendRequest({
+      id: generateId(),
+      type: "find",
+      timestamp: Date.now(),
+      payload: options
+    });
+    return response.elements;
+  }
+  /**
+   * Discover elements
+   * @deprecated Use find() instead
+   */
+  async discover(options) {
+    return this.find(options);
+  }
+  /**
+   * Get element details
+   */
+  async getElement(elementId, includeState = true) {
+    const response = await this.sendRequest({
+      id: generateId(),
+      type: "getElement",
+      timestamp: Date.now(),
+      payload: { elementId, includeState }
+    });
+    return response.element;
+  }
+  /**
+   * Get full snapshot
+   */
+  async getSnapshot() {
+    const response = await this.sendRequest({
+      id: generateId(),
+      type: "getSnapshot",
+      timestamp: Date.now()
+    });
+    return response;
+  }
+  /**
+   * Execute action on an element
+   */
+  async executeAction(elementId, action) {
+    const response = await this.sendRequest({
+      id: generateId(),
+      type: "executeAction",
+      timestamp: Date.now(),
+      payload: { elementId, action }
+    });
+    return response;
+  }
+  /**
+   * Execute component action
+   */
+  async executeComponentAction(componentId, action, params) {
+    const response = await this.sendRequest({
+      id: generateId(),
+      type: "executeComponentAction",
+      timestamp: Date.now(),
+      payload: { componentId, action, params }
+    });
+    return response;
+  }
+  /**
+   * Execute workflow with optional progress streaming
+   */
+  async executeWorkflow(workflowId, params, onProgress) {
+    const id = generateId();
+    const progressHandler = onProgress ? (message) => {
+      if (message.type === "workflowProgress" && message.requestId === id) {
+        onProgress({
+          currentStep: message.payload.currentStep,
+          totalSteps: message.payload.totalSteps,
+          step: {
+            id: message.payload.step.id,
+            status: message.payload.step.status
+          }
+        });
+      }
+    } : void 0;
+    const response = await this.sendRequest(
+      {
+        id,
+        type: "executeWorkflow",
+        timestamp: Date.now(),
+        payload: { workflowId, params, streamProgress: !!onProgress }
+      },
+      progressHandler
+    );
+    return response;
+  }
+  /**
+   * Add connection state listener
+   */
+  onConnectionChange(listener) {
+    this.connectionListeners.add(listener);
+    return () => this.connectionListeners.delete(listener);
+  }
+  /**
+   * Add event listener
+   */
+  onEvent(eventType, listener) {
+    if (!this.eventListeners.has(eventType)) {
+      this.eventListeners.set(eventType, /* @__PURE__ */ new Set());
+    }
+    this.eventListeners.get(eventType).add(listener);
+    return () => this.eventListeners.get(eventType)?.delete(listener);
+  }
+  /**
+   * Add error listener
+   */
+  onError(listener) {
+    this.errorListeners.add(listener);
+    return () => this.errorListeners.delete(listener);
+  }
+  // Private methods
+  setState(state) {
+    this.state = state;
+    for (const listener of this.connectionListeners) {
+      try {
+        listener(state);
+      } catch (error) {
+        console.error("Connection listener error:", error);
+      }
+    }
+  }
+  handleMessage(message) {
+    switch (message.type) {
+      case "welcome":
+        this.clientId = message.payload.clientId;
+        break;
+      case "pong":
+        break;
+      case "subscribed":
+      case "unsubscribed":
+        break;
+      case "event":
+        this.notifyEvent(message.payload);
+        break;
+      case "response":
+        this.handleResponse(message);
+        break;
+      case "error":
+        if (message.requestId) {
+          this.handleResponse({
+            ...message,
+            type: "response",
+            requestId: message.requestId,
+            payload: {
+              success: false,
+              error: message.payload.message
+            }
+          });
+        } else {
+          this.notifyError(new Error(message.payload.message));
+        }
+        break;
+    }
+  }
+  handleResponse(message) {
+    const pending = this.pendingRequests.get(message.requestId);
+    if (!pending) return;
+    clearTimeout(pending.timeout);
+    this.pendingRequests.delete(message.requestId);
+    if (message.type === "response") {
+      if (message.payload.success) {
+        pending.resolve(message.payload.data);
+      } else {
+        pending.reject(new Error(message.payload.error || "Request failed"));
+      }
+    }
+  }
+  notifyEvent(event) {
+    const typeListeners = this.eventListeners.get(event.type);
+    if (typeListeners) {
+      for (const listener of typeListeners) {
+        try {
+          listener(event);
+        } catch (error) {
+          console.error("Event listener error:", error);
+        }
+      }
+    }
+    const wildcardListeners = this.eventListeners.get("*");
+    if (wildcardListeners) {
+      for (const listener of wildcardListeners) {
+        try {
+          listener(event);
+        } catch (error) {
+          console.error("Event listener error:", error);
+        }
+      }
+    }
+  }
+  notifyError(error) {
+    for (const listener of this.errorListeners) {
+      try {
+        listener(error);
+      } catch (e) {
+        console.error("Error listener error:", e);
+      }
+    }
+  }
+  sendRequest(message, progressHandler) {
+    return new Promise((resolve, reject) => {
+      if (!this.ws || this.state !== "connected") {
+        reject(new Error("Not connected"));
+        return;
+      }
+      const timeout = setTimeout(() => {
+        this.pendingRequests.delete(message.id);
+        reject(new Error("Request timeout"));
+      }, 3e4);
+      this.pendingRequests.set(message.id, {
+        resolve,
+        reject,
+        timeout
+      });
+      if (progressHandler && this.ws) {
+        const originalHandler = this.ws.onmessage;
+        const wsRef = this.ws;
+        const wrappedHandler = (event) => {
+          try {
+            const msg = JSON.parse(event.data);
+            if (msg.type === "workflowProgress") {
+              progressHandler(msg);
+            }
+          } catch {
+          }
+          if (originalHandler) {
+            originalHandler.call(wsRef, event);
+          }
+        };
+        this.ws.onmessage = wrappedHandler;
+      }
+      this.ws.send(JSON.stringify(message));
+    });
+  }
+  scheduleReconnect() {
+    if (this.reconnectTimer) return;
+    this.setState("reconnecting");
+    this.reconnectAttempts++;
+    const delay = Math.min(
+      this.config.reconnectDelay * Math.pow(2, this.reconnectAttempts - 1),
+      3e4
+    );
+    this.reconnectTimer = setTimeout(() => {
+      this.reconnectTimer = null;
+      this.connect().catch(() => {
+      });
+    }, delay);
+  }
+  startPingInterval() {
+    if (this.config.pingInterval <= 0) return;
+    this.pingTimer = setInterval(() => {
+      if (this.ws && this.state === "connected") {
+        this.ws.send(
+          JSON.stringify({
+            id: generateId(),
+            type: "ping",
+            timestamp: Date.now()
+          })
+        );
+      }
+    }, this.config.pingInterval);
+  }
+  stopPingInterval() {
+    if (this.pingTimer) {
+      clearInterval(this.pingTimer);
+      this.pingTimer = null;
+    }
+  }
+};
+function createWSClient(config) {
+  return new UIBridgeWSClient(config);
+}
+
+exports.ID_ATTRIBUTES = ID_ATTRIBUTES;
+exports.UIBridgeRegistry = UIBridgeRegistry;
+exports.UIBridgeWSClient = UIBridgeWSClient;
+exports.createElementIdentifier = createElementIdentifier;
+exports.createWSClient = createWSClient;
+exports.elementMatchesIdentifier = elementMatchesIdentifier;
+exports.findAllElementsByIdentifier = findAllElementsByIdentifier;
+exports.findElementByIdentifier = findElementByIdentifier;
+exports.generateCSSSelector = generateCSSSelector;
+exports.generateXPath = generateXPath;
+exports.getBestIdentifier = getBestIdentifier;
+exports.getGlobalRegistry = getGlobalRegistry;
+exports.resetGlobalRegistry = resetGlobalRegistry;
+exports.setGlobalRegistry = setGlobalRegistry;
+//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map