@qontinui/ui-bridge 0.1.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (47) hide show
  1. package/dist/control/index.d.mts +134 -0
  2. package/dist/control/index.d.ts +134 -0
  3. package/dist/control/index.js +924 -0
  4. package/dist/control/index.js.map +1 -0
  5. package/dist/control/index.mjs +919 -0
  6. package/dist/control/index.mjs.map +1 -0
  7. package/dist/core/index.d.mts +52 -0
  8. package/dist/core/index.d.ts +52 -0
  9. package/dist/core/index.js +1424 -0
  10. package/dist/core/index.js.map +1 -0
  11. package/dist/core/index.mjs +1409 -0
  12. package/dist/core/index.mjs.map +1 -0
  13. package/dist/debug/index.d.mts +93 -0
  14. package/dist/debug/index.d.ts +93 -0
  15. package/dist/debug/index.js +673 -0
  16. package/dist/debug/index.js.map +1 -0
  17. package/dist/debug/index.mjs +664 -0
  18. package/dist/debug/index.mjs.map +1 -0
  19. package/dist/index.d.mts +12 -0
  20. package/dist/index.d.ts +12 -0
  21. package/dist/index.js +4719 -0
  22. package/dist/index.js.map +1 -0
  23. package/dist/index.mjs +4665 -0
  24. package/dist/index.mjs.map +1 -0
  25. package/dist/metrics-BCG7z7Aq.d.mts +147 -0
  26. package/dist/metrics-QCnK0EFw.d.ts +147 -0
  27. package/dist/react/index.d.mts +786 -0
  28. package/dist/react/index.d.ts +786 -0
  29. package/dist/react/index.js +4312 -0
  30. package/dist/react/index.js.map +1 -0
  31. package/dist/react/index.mjs +4290 -0
  32. package/dist/react/index.mjs.map +1 -0
  33. package/dist/registry-CT6BVVKr.d.mts +253 -0
  34. package/dist/registry-D4mQ01B3.d.ts +253 -0
  35. package/dist/render-log/index.d.mts +340 -0
  36. package/dist/render-log/index.d.ts +340 -0
  37. package/dist/render-log/index.js +702 -0
  38. package/dist/render-log/index.js.map +1 -0
  39. package/dist/render-log/index.mjs +695 -0
  40. package/dist/render-log/index.mjs.map +1 -0
  41. package/dist/types-BDkXy5si.d.ts +354 -0
  42. package/dist/types-BpvpStn3.d.mts +802 -0
  43. package/dist/types-BpvpStn3.d.ts +802 -0
  44. package/dist/types-DdJD9yw5.d.mts +354 -0
  45. package/dist/websocket-client-B2LC9CYc.d.mts +124 -0
  46. package/dist/websocket-client-DupH0X7B.d.ts +124 -0
  47. package/package.json +83 -0
@@ -0,0 +1,786 @@
1
+ import * as react_jsx_runtime from 'react/jsx-runtime';
2
+ import React$1, { ReactNode } from 'react';
3
+ import { n as UIBridgeFeatures, U as UIBridgeConfig, t as WSConnectionState, l as RegisteredElement, R as RegisteredComponent, f as BridgeSnapshot, e as BridgeEventType, d as BridgeEventListener, X as WSSubscriptionOptions, c as BridgeEvent, i as ElementType, S as StandardAction, g as CustomAction, h as ElementState, E as ElementIdentifier, a1 as Workflow, p as UIStateGroup, o as UIState, m as StateSnapshot, a2 as WorkflowStep, T as TransitionResult, q as UITransition, N as NavigationResult, P as PathResult } from '../types-BpvpStn3.js';
4
+ import { U as UIBridgeRegistry } from '../registry-D4mQ01B3.js';
5
+ import { U as UIBridgeWSClient } from '../websocket-client-DupH0X7B.js';
6
+ import { RenderLogManager } from '../render-log/index.js';
7
+ import { M as MetricsCollector } from '../metrics-QCnK0EFw.js';
8
+ import { A as ActionExecutor, i as WorkflowEngine, b as ControlActionRequest, c as ControlActionResponse, C as ComponentActionRequest, a as ComponentActionResponse, F as FindRequest, g as FindResponse, j as WorkflowRunRequest, k as WorkflowRunResponse } from '../types-BDkXy5si.js';
9
+
10
+ /**
11
+ * UI Bridge context value
12
+ */
13
+ interface UIBridgeContextValue {
14
+ /** Feature flags */
15
+ features: UIBridgeFeatures;
16
+ /** Configuration */
17
+ config: UIBridgeConfig;
18
+ /** Element registry */
19
+ registry: UIBridgeRegistry;
20
+ /** Action executor */
21
+ executor: ActionExecutor;
22
+ /** Workflow engine */
23
+ workflowEngine: WorkflowEngine;
24
+ /** Render log manager (if enabled) */
25
+ renderLog?: RenderLogManager;
26
+ /** Metrics collector (if debug enabled) */
27
+ metrics?: MetricsCollector;
28
+ /** WebSocket client (if websocket enabled) */
29
+ wsClient?: UIBridgeWSClient;
30
+ /** WebSocket connection state */
31
+ wsConnectionState: WSConnectionState;
32
+ /** Get all registered elements */
33
+ getElements: () => RegisteredElement[];
34
+ /** Get all registered components */
35
+ getComponents: () => RegisteredComponent[];
36
+ /** Create a snapshot */
37
+ createSnapshot: () => BridgeSnapshot;
38
+ /** Subscribe to events */
39
+ on: <T = unknown>(type: BridgeEventType, listener: BridgeEventListener<T>) => () => void;
40
+ /** Unsubscribe from events */
41
+ off: <T = unknown>(type: BridgeEventType, listener: BridgeEventListener<T>) => void;
42
+ /** Whether the provider is initialized */
43
+ initialized: boolean;
44
+ /** Connect to WebSocket server */
45
+ wsConnect: () => Promise<void>;
46
+ /** Disconnect from WebSocket server */
47
+ wsDisconnect: () => void;
48
+ /** Subscribe to WebSocket events */
49
+ wsSubscribe: (options: WSSubscriptionOptions) => Promise<BridgeEventType[]>;
50
+ /** Add WebSocket event listener */
51
+ onWsEvent: (eventType: BridgeEventType | '*', listener: (event: BridgeEvent) => void) => () => void;
52
+ }
53
+ /**
54
+ * UI Bridge provider props
55
+ */
56
+ interface UIBridgeProviderProps {
57
+ /** Child components */
58
+ children: React$1.ReactNode;
59
+ /** Feature flags */
60
+ features?: UIBridgeFeatures;
61
+ /** Configuration */
62
+ config?: UIBridgeConfig;
63
+ /** Event handler */
64
+ onEvent?: BridgeEventListener;
65
+ }
66
+ /**
67
+ * UI Bridge Provider
68
+ *
69
+ * Provides UI Bridge context to child components.
70
+ */
71
+ declare function UIBridgeProvider({ children, features, config, onEvent, }: UIBridgeProviderProps): react_jsx_runtime.JSX.Element;
72
+ /**
73
+ * useUIBridgeContext hook
74
+ *
75
+ * Access the UI Bridge context. Throws if used outside provider.
76
+ */
77
+ declare function useUIBridgeContext(): UIBridgeContextValue;
78
+ /**
79
+ * useUIBridgeOptional hook
80
+ *
81
+ * Access the UI Bridge context, returning null if outside provider.
82
+ */
83
+ declare function useUIBridgeOptional(): UIBridgeContextValue | null;
84
+
85
+ /**
86
+ * useUIElement Hook
87
+ *
88
+ * Register a DOM element with UI Bridge for control and observation.
89
+ */
90
+
91
+ /**
92
+ * useUIElement options
93
+ */
94
+ interface UseUIElementOptions {
95
+ /** Unique identifier for the element */
96
+ id: string;
97
+ /** Element type (auto-detected if not provided) */
98
+ type?: ElementType;
99
+ /** Human-readable label */
100
+ label?: string;
101
+ /** Override available actions */
102
+ actions?: StandardAction[];
103
+ /** Custom actions */
104
+ customActions?: Record<string, CustomAction>;
105
+ /** Whether to automatically register on mount */
106
+ autoRegister?: boolean;
107
+ /** Callback when state changes */
108
+ onStateChange?: (state: ElementState) => void;
109
+ }
110
+ /**
111
+ * useUIElement return value
112
+ */
113
+ interface UseUIElementReturn {
114
+ /** Ref to attach to the element */
115
+ ref: React.RefCallback<HTMLElement>;
116
+ /** Current element reference */
117
+ element: HTMLElement | null;
118
+ /** Whether the element is registered */
119
+ registered: boolean;
120
+ /** Get current state */
121
+ getState: () => ElementState | null;
122
+ /** Get element identifier */
123
+ getIdentifier: () => ElementIdentifier | null;
124
+ /** Trigger an action on this element */
125
+ trigger: (action: StandardAction | string, params?: Record<string, unknown>) => Promise<void>;
126
+ /** Manually register the element */
127
+ register: () => void;
128
+ /** Manually unregister the element */
129
+ unregister: () => void;
130
+ /** The registered element info */
131
+ registeredElement: RegisteredElement | null;
132
+ }
133
+ /**
134
+ * useUIElement hook
135
+ *
136
+ * Registers a DOM element with UI Bridge for programmatic control.
137
+ *
138
+ * @example
139
+ * ```tsx
140
+ * function SubmitButton() {
141
+ * const { ref, trigger } = useUIElement({
142
+ * id: 'submit-btn',
143
+ * type: 'button',
144
+ * label: 'Submit Form',
145
+ * });
146
+ *
147
+ * return (
148
+ * <button ref={ref} data-ui-id="submit-btn">
149
+ * Submit
150
+ * </button>
151
+ * );
152
+ * }
153
+ * ```
154
+ */
155
+ declare function useUIElement(options: UseUIElementOptions): UseUIElementReturn;
156
+ /**
157
+ * useUIElementRef hook
158
+ *
159
+ * A simpler version that just adds the data-ui-id attribute.
160
+ * Useful when you only need identification without full registration.
161
+ */
162
+ declare function useUIElementRef(id: string): React.RefCallback<HTMLElement>;
163
+
164
+ /**
165
+ * useUIComponent Hook
166
+ *
167
+ * Register a component with UI Bridge for component-level actions.
168
+ */
169
+
170
+ /**
171
+ * Action definition for useUIComponent
172
+ */
173
+ interface ComponentActionDef<TParams = unknown, TResult = unknown> {
174
+ /** Action identifier */
175
+ id: string;
176
+ /** Human-readable label */
177
+ label?: string;
178
+ /** Description */
179
+ description?: string;
180
+ /** Handler function */
181
+ handler: (params?: TParams) => TResult | Promise<TResult>;
182
+ }
183
+ /**
184
+ * useUIComponent options
185
+ */
186
+ interface UseUIComponentOptions {
187
+ /** Unique identifier for the component */
188
+ id: string;
189
+ /** Human-readable name */
190
+ name: string;
191
+ /** Description */
192
+ description?: string;
193
+ /** Actions available on this component */
194
+ actions?: ComponentActionDef[];
195
+ /** Child element IDs owned by this component */
196
+ elementIds?: string[];
197
+ /** Whether to automatically register on mount */
198
+ autoRegister?: boolean;
199
+ }
200
+ /**
201
+ * useUIComponent return value
202
+ */
203
+ interface UseUIComponentReturn {
204
+ /** Whether the component is registered */
205
+ registered: boolean;
206
+ /** Execute an action on this component */
207
+ executeAction: <TParams = unknown, TResult = unknown>(actionId: string, params?: TParams) => Promise<TResult>;
208
+ /** Manually register the component */
209
+ register: () => void;
210
+ /** Manually unregister the component */
211
+ unregister: () => void;
212
+ /** Update actions dynamically */
213
+ updateActions: (actions: ComponentActionDef[]) => void;
214
+ /** Add an element ID to this component */
215
+ addElement: (elementId: string) => void;
216
+ /** Remove an element ID from this component */
217
+ removeElement: (elementId: string) => void;
218
+ /** The registered component info */
219
+ registeredComponent: RegisteredComponent | null;
220
+ }
221
+ /**
222
+ * useUIComponent hook
223
+ *
224
+ * Registers a component with UI Bridge for component-level control.
225
+ * Components can expose high-level actions that may orchestrate multiple element interactions.
226
+ *
227
+ * @example
228
+ * ```tsx
229
+ * function LoginForm() {
230
+ * const [email, setEmail] = useState('');
231
+ * const [password, setPassword] = useState('');
232
+ *
233
+ * useUIComponent({
234
+ * id: 'login-form',
235
+ * name: 'Login Form',
236
+ * actions: [
237
+ * {
238
+ * id: 'login',
239
+ * label: 'Submit Login',
240
+ * handler: async ({ email, password }) => {
241
+ * setEmail(email);
242
+ * setPassword(password);
243
+ * await submitLogin();
244
+ * },
245
+ * },
246
+ * {
247
+ * id: 'clear',
248
+ * label: 'Clear Form',
249
+ * handler: () => {
250
+ * setEmail('');
251
+ * setPassword('');
252
+ * },
253
+ * },
254
+ * ],
255
+ * });
256
+ *
257
+ * return (
258
+ * <form>
259
+ * <input value={email} onChange={(e) => setEmail(e.target.value)} />
260
+ * <input value={password} onChange={(e) => setPassword(e.target.value)} />
261
+ * <button type="submit">Login</button>
262
+ * </form>
263
+ * );
264
+ * }
265
+ * ```
266
+ */
267
+ declare function useUIComponent(options: UseUIComponentOptions): UseUIComponentReturn;
268
+ /**
269
+ * useUIComponentAction hook
270
+ *
271
+ * Create a stable action handler that can be used with useUIComponent.
272
+ * Useful for memoizing action handlers.
273
+ */
274
+ declare function useUIComponentAction<TParams = unknown, TResult = unknown>(handler: (params?: TParams) => TResult | Promise<TResult>, deps: React.DependencyList): (params?: TParams) => TResult | Promise<TResult>;
275
+
276
+ /**
277
+ * useUIBridge Hook
278
+ *
279
+ * Main hook for accessing UI Bridge functionality.
280
+ */
281
+
282
+ /**
283
+ * useUIBridge return value
284
+ */
285
+ interface UseUIBridgeReturn {
286
+ /** Whether UI Bridge is available */
287
+ available: boolean;
288
+ /** Whether initialized */
289
+ initialized: boolean;
290
+ /** Get all registered elements */
291
+ elements: RegisteredElement[];
292
+ /** Get all registered components */
293
+ components: RegisteredComponent[];
294
+ /** Get all workflows */
295
+ workflows: Workflow[];
296
+ /** Create a snapshot of the current state */
297
+ createSnapshot: () => BridgeSnapshot;
298
+ /** Execute an action on an element */
299
+ executeAction: (elementId: string, request: ControlActionRequest) => Promise<ControlActionResponse>;
300
+ /** Execute an action on a component */
301
+ executeComponentAction: (componentId: string, request: ComponentActionRequest) => Promise<ComponentActionResponse>;
302
+ /** Find controllable elements */
303
+ find: (options?: FindRequest) => Promise<FindResponse>;
304
+ /**
305
+ * Discover controllable elements
306
+ * @deprecated Use find() instead
307
+ */
308
+ discover: (options?: FindRequest) => Promise<FindResponse>;
309
+ /** Run a workflow */
310
+ runWorkflow: (workflowId: string, request?: WorkflowRunRequest) => Promise<WorkflowRunResponse>;
311
+ /** Get element by ID */
312
+ getElement: (id: string) => RegisteredElement | undefined;
313
+ /** Get component by ID */
314
+ getComponent: (id: string) => RegisteredComponent | undefined;
315
+ /** Get element state by ID */
316
+ getElementState: (id: string) => ElementState | undefined;
317
+ /** Register a workflow */
318
+ registerWorkflow: (workflow: Workflow) => void;
319
+ /** Unregister a workflow */
320
+ unregisterWorkflow: (id: string) => void;
321
+ /** Capture a render log snapshot (if enabled) */
322
+ captureRenderLog: () => Promise<void>;
323
+ /** Get render log entries (if enabled) */
324
+ getRenderLogEntries: () => Promise<unknown[]>;
325
+ /** Clear render log (if enabled) */
326
+ clearRenderLog: () => Promise<void>;
327
+ /** Get metrics (if debug enabled) */
328
+ getMetrics: () => unknown | undefined;
329
+ /** Get action history (if debug enabled) */
330
+ getActionHistory: () => unknown[] | undefined;
331
+ }
332
+ /**
333
+ * useUIBridge hook
334
+ *
335
+ * Main hook for accessing UI Bridge functionality.
336
+ * Use this to interact with registered elements, components, and workflows.
337
+ *
338
+ * @example
339
+ * ```tsx
340
+ * function AutomationController() {
341
+ * const bridge = useUIBridge();
342
+ *
343
+ * const handleSubmit = async () => {
344
+ * // Execute element action
345
+ * await bridge.executeAction('submit-btn', { action: 'click' });
346
+ *
347
+ * // Or use component action
348
+ * await bridge.executeComponentAction('login-form', {
349
+ * action: 'login',
350
+ * params: { email: 'user@example.com', password: 'secret' },
351
+ * });
352
+ * };
353
+ *
354
+ * return (
355
+ * <button onClick={handleSubmit}>
356
+ * Automate Login
357
+ * </button>
358
+ * );
359
+ * }
360
+ * ```
361
+ */
362
+ declare function useUIBridge(): UseUIBridgeReturn;
363
+ /**
364
+ * useUIBridgeRequired hook
365
+ *
366
+ * Same as useUIBridge but throws if UI Bridge is not available.
367
+ */
368
+ declare function useUIBridgeRequired(): UseUIBridgeReturn;
369
+
370
+ /**
371
+ * useUIState Hook
372
+ *
373
+ * Register and manage UI states with UI Bridge.
374
+ */
375
+
376
+ /**
377
+ * useUIState options
378
+ */
379
+ interface UseUIStateOptions {
380
+ /** Unique identifier for the state */
381
+ id: string;
382
+ /** Human-readable name */
383
+ name: string;
384
+ /** Element IDs belonging to this state */
385
+ elements?: string[];
386
+ /** Function to detect if state is active */
387
+ activeWhen?: () => boolean;
388
+ /** If true, blocks other state activations (modal behavior) */
389
+ blocking?: boolean;
390
+ /** Specific state IDs this state blocks */
391
+ blocks?: string[];
392
+ /** State group membership */
393
+ group?: string;
394
+ /** Cost for pathfinding (default: 1.0) */
395
+ pathCost?: number;
396
+ /** Custom metadata */
397
+ metadata?: Record<string, unknown>;
398
+ /** Whether to automatically register on mount */
399
+ autoRegister?: boolean;
400
+ /** Initial active state */
401
+ initialActive?: boolean;
402
+ }
403
+ /**
404
+ * useUIState return value
405
+ */
406
+ interface UseUIStateReturn {
407
+ /** Whether the state is registered */
408
+ registered: boolean;
409
+ /** Whether the state is currently active */
410
+ isActive: boolean;
411
+ /** Activate this state */
412
+ activate: () => boolean;
413
+ /** Deactivate this state */
414
+ deactivate: () => boolean;
415
+ /** Toggle active state */
416
+ toggle: () => boolean;
417
+ /** Get all currently active states */
418
+ activeStates: string[];
419
+ /** Manually register the state */
420
+ register: () => void;
421
+ /** Manually unregister the state */
422
+ unregister: () => void;
423
+ /** The registered state info */
424
+ state: UIState | undefined;
425
+ }
426
+ /**
427
+ * useUIState hook
428
+ *
429
+ * Registers a UI state with UI Bridge for state management.
430
+ *
431
+ * @example
432
+ * ```tsx
433
+ * function LoginModal() {
434
+ * const { isActive, activate, deactivate } = useUIState({
435
+ * id: 'login-modal',
436
+ * name: 'Login Modal',
437
+ * blocking: true,
438
+ * elements: ['login-email', 'login-password', 'login-submit'],
439
+ * });
440
+ *
441
+ * if (!isActive) return null;
442
+ *
443
+ * return (
444
+ * <div className="modal">
445
+ * <button onClick={deactivate}>Close</button>
446
+ * ...
447
+ * </div>
448
+ * );
449
+ * }
450
+ * ```
451
+ */
452
+ declare function useUIState(options: UseUIStateOptions): UseUIStateReturn;
453
+ /**
454
+ * useUIStateGroup hook
455
+ *
456
+ * Register and manage a state group with UI Bridge.
457
+ *
458
+ * @example
459
+ * ```tsx
460
+ * function NavigationSection() {
461
+ * const { activate, deactivate } = useUIStateGroup({
462
+ * id: 'nav-group',
463
+ * name: 'Navigation',
464
+ * states: ['nav-home', 'nav-about', 'nav-contact'],
465
+ * });
466
+ *
467
+ * // Activating the group activates all its states
468
+ * // Deactivating the group deactivates all its states
469
+ * }
470
+ * ```
471
+ */
472
+ interface UseUIStateGroupOptions {
473
+ /** Unique identifier for the group */
474
+ id: string;
475
+ /** Human-readable name */
476
+ name: string;
477
+ /** State IDs belonging to this group */
478
+ states: string[];
479
+ /** Whether to automatically register on mount */
480
+ autoRegister?: boolean;
481
+ }
482
+ interface UseUIStateGroupReturn {
483
+ /** Whether the group is registered */
484
+ registered: boolean;
485
+ /** Activate all states in this group */
486
+ activate: () => string[];
487
+ /** Deactivate all states in this group */
488
+ deactivate: () => string[];
489
+ /** Manually register the group */
490
+ register: () => void;
491
+ /** Manually unregister the group */
492
+ unregister: () => void;
493
+ /** The registered group info */
494
+ group: UIStateGroup | undefined;
495
+ }
496
+ declare function useUIStateGroup(options: UseUIStateGroupOptions): UseUIStateGroupReturn;
497
+ /**
498
+ * useActiveStates hook
499
+ *
500
+ * Subscribe to active states changes.
501
+ */
502
+ declare function useActiveStates(): string[];
503
+ /**
504
+ * useStateSnapshot hook
505
+ *
506
+ * Get a snapshot of all state management data.
507
+ */
508
+ declare function useStateSnapshot(): StateSnapshot | null;
509
+
510
+ /**
511
+ * useUITransition Hook
512
+ *
513
+ * Register and execute UI state transitions with UI Bridge.
514
+ */
515
+
516
+ /**
517
+ * useUITransition options
518
+ */
519
+ interface UseUITransitionOptions {
520
+ /** Unique identifier for the transition */
521
+ id: string;
522
+ /** Human-readable name */
523
+ name: string;
524
+ /** Precondition: at least one must be active */
525
+ fromStates: string[];
526
+ /** States to activate */
527
+ activateStates: string[];
528
+ /** States to deactivate */
529
+ exitStates: string[];
530
+ /** Groups to activate */
531
+ activateGroups?: string[];
532
+ /** Groups to deactivate */
533
+ exitGroups?: string[];
534
+ /** Actions to execute during transition */
535
+ actions?: WorkflowStep[];
536
+ /** Cost for pathfinding */
537
+ pathCost?: number;
538
+ /** Whether source states remain visible during transition */
539
+ staysVisible?: boolean;
540
+ /** Whether to automatically register on mount */
541
+ autoRegister?: boolean;
542
+ }
543
+ /**
544
+ * useUITransition return value
545
+ */
546
+ interface UseUITransitionReturn {
547
+ /** Whether the transition is registered */
548
+ registered: boolean;
549
+ /** Whether this transition can be executed from current state */
550
+ canExecute: boolean;
551
+ /** Execute the transition */
552
+ execute: () => Promise<TransitionResult>;
553
+ /** Manually register the transition */
554
+ register: () => void;
555
+ /** Manually unregister the transition */
556
+ unregister: () => void;
557
+ /** The registered transition info */
558
+ transition: UITransition | undefined;
559
+ }
560
+ /**
561
+ * useUITransition hook
562
+ *
563
+ * Registers a state transition with UI Bridge.
564
+ *
565
+ * @example
566
+ * ```tsx
567
+ * function OpenModalButton() {
568
+ * const { canExecute, execute } = useUITransition({
569
+ * id: 'open-login-modal',
570
+ * name: 'Open Login Modal',
571
+ * fromStates: ['dashboard'],
572
+ * activateStates: ['login-modal'],
573
+ * exitStates: [],
574
+ * });
575
+ *
576
+ * return (
577
+ * <button onClick={execute} disabled={!canExecute}>
578
+ * Login
579
+ * </button>
580
+ * );
581
+ * }
582
+ * ```
583
+ */
584
+ declare function useUITransition(options: UseUITransitionOptions): UseUITransitionReturn;
585
+ /**
586
+ * useTransitions hook
587
+ *
588
+ * Get all registered transitions.
589
+ */
590
+ declare function useTransitions(): UITransition[];
591
+ /**
592
+ * useAvailableTransitions hook
593
+ *
594
+ * Get transitions that can be executed from current state.
595
+ */
596
+ declare function useAvailableTransitions(): UITransition[];
597
+
598
+ /**
599
+ * useUINavigation Hook
600
+ *
601
+ * Navigate between UI states using pathfinding with UI Bridge.
602
+ */
603
+
604
+ /**
605
+ * useUINavigation return value
606
+ */
607
+ interface UseUINavigationReturn {
608
+ /** Whether UI Bridge is available */
609
+ available: boolean;
610
+ /** Whether navigation is currently in progress */
611
+ isNavigating: boolean;
612
+ /** Last navigation result */
613
+ lastResult: NavigationResult | null;
614
+ /** Find a path to target states (without executing) */
615
+ findPath: (targetStates: string[]) => PathResult;
616
+ /** Navigate to target states */
617
+ navigateTo: (targetStates: string[]) => Promise<NavigationResult>;
618
+ /** Current active states */
619
+ activeStates: string[];
620
+ }
621
+ /**
622
+ * useUINavigation hook
623
+ *
624
+ * Provides state machine navigation capabilities with pathfinding.
625
+ *
626
+ * @example
627
+ * ```tsx
628
+ * function NavigationController() {
629
+ * const { navigateTo, findPath, isNavigating, activeStates } = useUINavigation();
630
+ *
631
+ * const goToDashboard = async () => {
632
+ * // Find path first to check if navigation is possible
633
+ * const path = findPath(['dashboard']);
634
+ * if (!path.found) {
635
+ * console.log('Cannot reach dashboard from current state');
636
+ * return;
637
+ * }
638
+ *
639
+ * console.log(`Will execute ${path.transitions.length} transitions`);
640
+ *
641
+ * // Execute navigation
642
+ * const result = await navigateTo(['dashboard']);
643
+ * if (result.success) {
644
+ * console.log('Successfully navigated to dashboard');
645
+ * }
646
+ * };
647
+ *
648
+ * return (
649
+ * <div>
650
+ * <p>Current states: {activeStates.join(', ')}</p>
651
+ * <button onClick={goToDashboard} disabled={isNavigating}>
652
+ * Go to Dashboard
653
+ * </button>
654
+ * </div>
655
+ * );
656
+ * }
657
+ * ```
658
+ */
659
+ declare function useUINavigation(): UseUINavigationReturn;
660
+ /**
661
+ * useCanNavigateTo hook
662
+ *
663
+ * Check if navigation to target states is possible.
664
+ *
665
+ * @example
666
+ * ```tsx
667
+ * function DashboardLink() {
668
+ * const canNavigate = useCanNavigateTo(['dashboard']);
669
+ *
670
+ * return (
671
+ * <button disabled={!canNavigate}>
672
+ * Dashboard
673
+ * </button>
674
+ * );
675
+ * }
676
+ * ```
677
+ */
678
+ declare function useCanNavigateTo(targetStates: string[]): boolean;
679
+ /**
680
+ * useNavigationPath hook
681
+ *
682
+ * Get the path to target states (updates when active states change).
683
+ *
684
+ * @example
685
+ * ```tsx
686
+ * function PathDisplay() {
687
+ * const path = useNavigationPath(['checkout']);
688
+ *
689
+ * if (!path.found) {
690
+ * return <p>Cannot reach checkout from here</p>;
691
+ * }
692
+ *
693
+ * return (
694
+ * <p>
695
+ * Steps to checkout: {path.transitions.join(' -> ')}
696
+ * (Cost: {path.totalCost})
697
+ * </p>
698
+ * );
699
+ * }
700
+ * ```
701
+ */
702
+ declare function useNavigationPath(targetStates: string[]): PathResult;
703
+
704
+ /**
705
+ * useAutoRegister Hook
706
+ *
707
+ * Enables automatic registration of interactive DOM elements with the UI Bridge.
708
+ * This eliminates the need for manual useUIElement() calls on every component.
709
+ *
710
+ * Features:
711
+ * - Auto-discovers interactive elements (buttons, inputs, links, etc.)
712
+ * - Uses MutationObserver to detect new elements
713
+ * - Smart ID generation (data-testid > data-ui-id > semantic > auto-generated)
714
+ * - Debounced updates for performance
715
+ * - Respects existing manually registered elements
716
+ */
717
+ /**
718
+ * ID generation strategy
719
+ */
720
+ type IdStrategy = 'data-testid' | 'data-ui-id' | 'semantic' | 'auto' | 'prefer-existing';
721
+ /**
722
+ * Options for auto-registration
723
+ */
724
+ interface AutoRegisterOptions {
725
+ /** Enable auto-registration (default: true in dev mode) */
726
+ enabled?: boolean;
727
+ /** Root element to observe (default: document.body) */
728
+ root?: HTMLElement | null;
729
+ /** ID generation strategy (default: 'prefer-existing') */
730
+ idStrategy?: IdStrategy;
731
+ /** Debounce time for mutation handling (ms, default: 100) */
732
+ debounceMs?: number;
733
+ /** Include hidden elements (default: false) */
734
+ includeHidden?: boolean;
735
+ /** Only register elements matching these selectors */
736
+ includeSelectors?: string[];
737
+ /** Exclude elements matching these selectors */
738
+ excludeSelectors?: string[];
739
+ /** Custom ID generator function */
740
+ generateId?: (element: HTMLElement) => string;
741
+ /** Callback when element is registered */
742
+ onRegister?: (id: string, element: HTMLElement) => void;
743
+ /** Callback when element is unregistered */
744
+ onUnregister?: (id: string) => void;
745
+ }
746
+ /**
747
+ * Hook for automatic element registration
748
+ *
749
+ * @example
750
+ * ```tsx
751
+ * function App() {
752
+ * // Enable auto-registration for all interactive elements
753
+ * useAutoRegister({ enabled: true });
754
+ *
755
+ * return (
756
+ * <div>
757
+ * <button data-testid="submit-btn">Submit</button>
758
+ * <input data-testid="email-input" />
759
+ * </div>
760
+ * );
761
+ * }
762
+ * ```
763
+ */
764
+ declare function useAutoRegister(options?: AutoRegisterOptions): void;
765
+
766
+ interface AutoRegisterProviderProps extends Omit<AutoRegisterOptions, 'root'> {
767
+ /** Children to render */
768
+ children: ReactNode;
769
+ /** Use this element as the observation root instead of document.body */
770
+ scopeToChildren?: boolean;
771
+ }
772
+ /**
773
+ * Provider component that enables automatic element registration.
774
+ *
775
+ * Features:
776
+ * - Automatically discovers and registers interactive elements
777
+ * - Uses MutationObserver to detect new elements
778
+ * - Smart ID generation based on data-testid, semantic names, etc.
779
+ * - Configurable selectors and ID strategies
780
+ *
781
+ * Place this component at the root of your app (inside UIBridgeProvider)
782
+ * for comprehensive automatic element registration.
783
+ */
784
+ declare function AutoRegisterProvider({ children, scopeToChildren, enabled, idStrategy, debounceMs, includeHidden, includeSelectors, excludeSelectors, generateId, onRegister, onUnregister, }: AutoRegisterProviderProps): react_jsx_runtime.JSX.Element;
785
+
786
+ export { type AutoRegisterOptions, AutoRegisterProvider, type AutoRegisterProviderProps, type ComponentActionDef, type IdStrategy, type UIBridgeContextValue, UIBridgeProvider, type UIBridgeProviderProps, type UseUIBridgeReturn, type UseUIComponentOptions, type UseUIComponentReturn, type UseUIElementOptions, type UseUIElementReturn, type UseUINavigationReturn, type UseUIStateGroupOptions, type UseUIStateGroupReturn, type UseUIStateOptions, type UseUIStateReturn, type UseUITransitionOptions, type UseUITransitionReturn, useActiveStates, useAutoRegister, useAvailableTransitions, useCanNavigateTo, useNavigationPath, useStateSnapshot, useTransitions, useUIBridge, useUIBridgeContext, useUIBridgeOptional, useUIBridgeRequired, useUIComponent, useUIComponentAction, useUIElement, useUIElementRef, useUINavigation, useUIState, useUIStateGroup, useUITransition };