@copilotkit/a2ui-renderer 1.53.0 → 1.53.1-next.0

package/dist/react-renderer/components/layout/List.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"List.d.cts","names":[],"sources":["../../../../src/react-renderer/components/layout/List.tsx"],"mappings":";;;;;;;;AAYA;;cAAa,IAAA,EAAI,KAAA,CAAA,oBAAA,CAAA,kBAAA,CAAA,KAAA,CAAA,QAAA"}

package/dist/react-renderer/components/layout/List.d.mts

@@ -0,0 +1,14 @@
+import { A2UIComponentProps } from "../../types.mjs";
+import * as react from "react";
+import { Types } from "@a2ui/lit/0.8";
+
+//#region src/react-renderer/components/layout/List.d.ts
+/**
+ * List component - renders a scrollable list of items.
+ *
+ * Supports direction (vertical/horizontal) properties.
+ */
+declare const List: react.NamedExoticComponent<A2UIComponentProps<Types.ListNode>>;
+//#endregion
+export { List };
+//# sourceMappingURL=List.d.mts.map

package/dist/react-renderer/components/layout/List.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"List.d.mts","names":[],"sources":["../../../../src/react-renderer/components/layout/List.tsx"],"mappings":";;;;;;;;AAYA;;cAAa,IAAA,EAAI,KAAA,CAAA,oBAAA,CAAA,kBAAA,CAAA,KAAA,CAAA,QAAA"}

package/dist/react-renderer/components/layout/Modal.d.cts

@@ -0,0 +1,19 @@
+import { A2UIComponentProps } from "../../types.cjs";
+import * as react from "react";
+import { Types } from "@a2ui/lit/0.8";
+
+//#region src/react-renderer/components/layout/Modal.d.ts
+/**
+ * Modal component - displays content in a dialog overlay.
+ *
+ * Matches Lit's rendering approach:
+ * - When closed: renders section with entry point child
+ * - When open: renders dialog with content child (entry point is replaced)
+ *
+ * The dialog is rendered in place (no portal) so it stays inside .a2ui-surface
+ * and CSS selectors work correctly. showModal() handles the top-layer overlay.
+ */
+declare const Modal: react.NamedExoticComponent<A2UIComponentProps<Types.ModalNode>>;
+//#endregion
+export { Modal };
+//# sourceMappingURL=Modal.d.cts.map

package/dist/react-renderer/components/layout/Modal.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Modal.d.cts","names":[],"sources":["../../../../src/react-renderer/components/layout/Modal.tsx"],"mappings":";;;;;;;;AAiBA;;;;;;;cAAa,KAAA,EAAK,KAAA,CAAA,oBAAA,CAAA,kBAAA,CAAA,KAAA,CAAA,SAAA"}

package/dist/react-renderer/components/layout/Modal.d.mts

@@ -0,0 +1,19 @@
+import { A2UIComponentProps } from "../../types.mjs";
+import * as react from "react";
+import { Types } from "@a2ui/lit/0.8";
+
+//#region src/react-renderer/components/layout/Modal.d.ts
+/**
+ * Modal component - displays content in a dialog overlay.
+ *
+ * Matches Lit's rendering approach:
+ * - When closed: renders section with entry point child
+ * - When open: renders dialog with content child (entry point is replaced)
+ *
+ * The dialog is rendered in place (no portal) so it stays inside .a2ui-surface
+ * and CSS selectors work correctly. showModal() handles the top-layer overlay.
+ */
+declare const Modal: react.NamedExoticComponent<A2UIComponentProps<Types.ModalNode>>;
+//#endregion
+export { Modal };
+//# sourceMappingURL=Modal.d.mts.map

package/dist/react-renderer/components/layout/Modal.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Modal.d.mts","names":[],"sources":["../../../../src/react-renderer/components/layout/Modal.tsx"],"mappings":";;;;;;;;AAiBA;;;;;;;cAAa,KAAA,EAAK,KAAA,CAAA,oBAAA,CAAA,kBAAA,CAAA,KAAA,CAAA,SAAA"}

package/dist/react-renderer/components/layout/Row.d.cts

@@ -0,0 +1,14 @@
+import { A2UIComponentProps } from "../../types.cjs";
+import * as react from "react";
+import { Types } from "@a2ui/lit/0.8";
+
+//#region src/react-renderer/components/layout/Row.d.ts
+/**
+ * Row component - arranges children horizontally using flexbox.
+ *
+ * Supports distribution (justify-content) and alignment (align-items) properties.
+ */
+declare const Row: react.NamedExoticComponent<A2UIComponentProps<Types.RowNode>>;
+//#endregion
+export { Row };
+//# sourceMappingURL=Row.d.cts.map

package/dist/react-renderer/components/layout/Row.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Row.d.cts","names":[],"sources":["../../../../src/react-renderer/components/layout/Row.tsx"],"mappings":";;;;;;;;AAYA;;cAAa,GAAA,EAAG,KAAA,CAAA,oBAAA,CAAA,kBAAA,CAAA,KAAA,CAAA,OAAA"}

package/dist/react-renderer/components/layout/Row.d.mts

@@ -0,0 +1,14 @@
+import { A2UIComponentProps } from "../../types.mjs";
+import * as react from "react";
+import { Types } from "@a2ui/lit/0.8";
+
+//#region src/react-renderer/components/layout/Row.d.ts
+/**
+ * Row component - arranges children horizontally using flexbox.
+ *
+ * Supports distribution (justify-content) and alignment (align-items) properties.
+ */
+declare const Row: react.NamedExoticComponent<A2UIComponentProps<Types.RowNode>>;
+//#endregion
+export { Row };
+//# sourceMappingURL=Row.d.mts.map

package/dist/react-renderer/components/layout/Row.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Row.d.mts","names":[],"sources":["../../../../src/react-renderer/components/layout/Row.tsx"],"mappings":";;;;;;;;AAYA;;cAAa,GAAA,EAAG,KAAA,CAAA,oBAAA,CAAA,kBAAA,CAAA,KAAA,CAAA,OAAA"}

package/dist/react-renderer/components/layout/Tabs.d.cts

@@ -0,0 +1,12 @@
+import { A2UIComponentProps } from "../../types.cjs";
+import * as react from "react";
+import { Types } from "@a2ui/lit/0.8";
+
+//#region src/react-renderer/components/layout/Tabs.d.ts
+/**
+ * Tabs component - displays content in switchable tabs.
+ */
+declare const Tabs: react.NamedExoticComponent<A2UIComponentProps<Types.TabsNode>>;
+//#endregion
+export { Tabs };
+//# sourceMappingURL=Tabs.d.cts.map

package/dist/react-renderer/components/layout/Tabs.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tabs.d.cts","names":[],"sources":["../../../../src/react-renderer/components/layout/Tabs.tsx"],"mappings":";;;;;;;;cAca,IAAA,EAAI,KAAA,CAAA,oBAAA,CAAA,kBAAA,CAAA,KAAA,CAAA,QAAA"}

package/dist/react-renderer/components/layout/Tabs.d.mts

@@ -0,0 +1,12 @@
+import { A2UIComponentProps } from "../../types.mjs";
+import * as react from "react";
+import { Types } from "@a2ui/lit/0.8";
+
+//#region src/react-renderer/components/layout/Tabs.d.ts
+/**
+ * Tabs component - displays content in switchable tabs.
+ */
+declare const Tabs: react.NamedExoticComponent<A2UIComponentProps<Types.TabsNode>>;
+//#endregion
+export { Tabs };
+//# sourceMappingURL=Tabs.d.mts.map

package/dist/react-renderer/components/layout/Tabs.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tabs.d.mts","names":[],"sources":["../../../../src/react-renderer/components/layout/Tabs.tsx"],"mappings":";;;;;;;;cAca,IAAA,EAAI,KAAA,CAAA,oBAAA,CAAA,kBAAA,CAAA,KAAA,CAAA,QAAA"}

package/dist/react-renderer/core/A2UIProvider.cjs

@@ -115,9 +115,44 @@ function useA2UIState() {
 	if (!state) throw new Error("useA2UIState must be used within an A2UIProvider");
 	return state;
 }
+/**
+* Hook to access the full A2UI context (actions + state).
+* Components using this will re-render when state changes.
+*
+* @returns The A2UI context value
+* @throws If used outside of an A2UIProvider
+*/
+function useA2UIContext() {
+	const actions = useA2UIActions();
+	const state = useA2UIState();
+	return (0, react.useMemo)(() => ({
+		...actions,
+		processor: null,
+		version: state.version,
+		onAction: null
+	}), [actions, state.version]);
+}
+/**
+* @deprecated Use useA2UIContext instead. This alias exists for backward compatibility only.
+*/
+const useA2UIStore = useA2UIContext;
+/**
+* @deprecated This selector pattern does not provide performance benefits with React Context.
+* Components will re-render on any context change regardless of what you select.
+* Use useA2UIContext() or useA2UI() directly instead.
+*
+* @param selector - Function to select a slice of state
+* @returns The selected state
+*/
+function useA2UIStoreSelector(selector) {
+	return selector(useA2UIContext());
+}
 
 //#endregion
 exports.A2UIProvider = A2UIProvider;
 exports.useA2UIActions = useA2UIActions;
+exports.useA2UIContext = useA2UIContext;
 exports.useA2UIState = useA2UIState;
+exports.useA2UIStore = useA2UIStore;
+exports.useA2UIStoreSelector = useA2UIStoreSelector;
 //# sourceMappingURL=A2UIProvider.cjs.map

package/dist/react-renderer/core/A2UIProvider.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"A2UIProvider.cjs","names":["Data","ThemeProvider"],"sources":["../../../src/react-renderer/core/A2UIProvider.tsx"],"sourcesContent":["import {\n  createContext,\n  useContext,\n  useRef,\n  useState,\n  useMemo,\n  type ReactNode,\n} from \"react\";\nimport { Data, type Types } from \"@a2ui/lit/0.8\";\nimport type { A2UIContextValue, A2UIActions } from \"./store\";\nimport { ThemeProvider } from \"../theme/ThemeContext\";\nimport type { OnActionCallback } from \"../types\";\n\n/**\n * Context for stable actions (never changes reference, prevents re-renders).\n * Components that only need to dispatch actions or read data won't re-render.\n */\nconst A2UIActionsContext = createContext<A2UIActions | null>(null);\n\n/**\n * Context for reactive state (changes trigger re-renders).\n * Only components that need to react to state changes subscribe to this.\n */\nconst A2UIStateContext = createContext<{ version: number } | null>(null);\n\n/**\n * Props for the A2UIProvider component.\n */\nexport interface A2UIProviderProps {\n  /** Callback invoked when a user action is dispatched (button click, etc.) */\n  onAction?: OnActionCallback;\n  /** Theme configuration. Falls back to default theme if not provided. */\n  theme?: Types.Theme;\n  /** Child components */\n  children: ReactNode;\n}\n\n/**\n * Provider component that sets up the A2UI context for descendant components.\n *\n * This provider uses a two-context architecture for performance:\n * - A2UIActionsContext: Stable actions that never change (no re-renders)\n * - A2UIStateContext: Reactive state that triggers re-renders when needed\n *\n * @example\n * ```tsx\n * function App() {\n *   const handleAction = async (message) => {\n *     const response = await fetch('/api/a2ui', {\n *       method: 'POST',\n *       body: JSON.stringify(message)\n *     });\n *     const newMessages = await response.json();\n *   };\n *\n *   return (\n *     <A2UIProvider onAction={handleAction}>\n *       <A2UIRenderer surfaceId=\"main\" />\n *     </A2UIProvider>\n *   );\n * }\n * ```\n */\nexport function A2UIProvider({ onAction, theme, children }: A2UIProviderProps) {\n  // Create message processor only once using ref\n  const processorRef = useRef<Types.MessageProcessor | null>(null);\n  if (!processorRef.current) {\n    processorRef.current = Data.createSignalA2uiMessageProcessor();\n  }\n  const processor = processorRef.current;\n\n  // Version counter for triggering re-renders\n  const [version, setVersion] = useState(0);\n\n  // Store onAction in a ref so callbacks always have the latest value\n  const onActionRef = useRef<OnActionCallback | null>(onAction ?? null);\n  onActionRef.current = onAction ?? null;\n\n  // Create stable actions object once - stored in ref, never changes\n  const actionsRef = useRef<A2UIActions | null>(null);\n  if (!actionsRef.current) {\n    actionsRef.current = {\n      processMessages: (messages: Types.ServerToClientMessage[]) => {\n        processor.processMessages(messages);\n        setVersion((v) => v + 1);\n      },\n\n      setData: (\n        node: Types.AnyComponentNode | null,\n        path: string,\n        value: Types.DataValue,\n        surfaceId: string,\n      ) => {\n        processor.setData(node, path, value, surfaceId);\n        setVersion((v) => v + 1);\n      },\n\n      dispatch: (message: Types.A2UIClientEventMessage) => {\n        if (onActionRef.current) {\n          onActionRef.current(message);\n        }\n      },\n\n      clearSurfaces: () => {\n        processor.clearSurfaces();\n        setVersion((v) => v + 1);\n      },\n\n      getSurface: (surfaceId: string) => {\n        return processor.getSurfaces().get(surfaceId);\n      },\n\n      getSurfaces: () => {\n        return processor.getSurfaces();\n      },\n\n      getData: (\n        node: Types.AnyComponentNode,\n        path: string,\n        surfaceId: string,\n      ) => {\n        return processor.getData(node, path, surfaceId);\n      },\n\n      resolvePath: (path: string, dataContextPath?: string) => {\n        return processor.resolvePath(path, dataContextPath);\n      },\n    };\n  }\n  const actions = actionsRef.current;\n\n  // State context value - only changes when version changes\n  const stateValue = useMemo(() => ({ version }), [version]);\n\n  return (\n    <A2UIActionsContext.Provider value={actions}>\n      <A2UIStateContext.Provider value={stateValue}>\n        <ThemeProvider theme={theme}>{children}</ThemeProvider>\n      </A2UIStateContext.Provider>\n    </A2UIActionsContext.Provider>\n  );\n}\n\n/**\n * Hook to access stable A2UI actions (won't cause re-renders).\n * Use this when you only need to dispatch actions or read data.\n *\n * @returns Stable actions object\n * @throws If used outside of an A2UIProvider\n */\nexport function useA2UIActions(): A2UIActions {\n  const actions = useContext(A2UIActionsContext);\n  if (!actions) {\n    throw new Error(\"useA2UIActions must be used within an A2UIProvider\");\n  }\n  return actions;\n}\n\n/**\n * Hook to subscribe to A2UI state changes.\n * Components using this will re-render when state changes.\n *\n * @returns Current version number\n * @throws If used outside of an A2UIProvider\n */\nexport function useA2UIState(): { version: number } {\n  const state = useContext(A2UIStateContext);\n  if (!state) {\n    throw new Error(\"useA2UIState must be used within an A2UIProvider\");\n  }\n  return state;\n}\n\n/**\n * Hook to access the full A2UI context (actions + state).\n * Components using this will re-render when state changes.\n *\n * @returns The A2UI context value\n * @throws If used outside of an A2UIProvider\n */\nexport function useA2UIContext(): A2UIContextValue {\n  const actions = useA2UIActions();\n  const state = useA2UIState();\n\n  // Memoize combined value - only changes when state changes\n  // Actions are stable, so this only re-creates when version changes\n  return useMemo(\n    () => ({\n      ...actions,\n      processor: null as unknown as Types.MessageProcessor, // Not exposed directly\n      version: state.version,\n      onAction: null, // Use dispatch instead\n    }),\n    [actions, state.version],\n  );\n}\n\n/**\n * @deprecated Use useA2UIContext instead. This alias exists for backward compatibility only.\n */\nexport const useA2UIStore = useA2UIContext;\n\n/**\n * @deprecated This selector pattern does not provide performance benefits with React Context.\n * Components will re-render on any context change regardless of what you select.\n * Use useA2UIContext() or useA2UI() directly instead.\n *\n * @param selector - Function to select a slice of state\n * @returns The selected state\n */\nexport function useA2UIStoreSelector<T>(\n  selector: (state: A2UIContextValue) => T,\n): T {\n  const context = useA2UIContext();\n  return selector(context);\n}\n"],"mappings":";;;;;;;;;;;AAiBA,MAAM,8CAAuD,KAAK;;;;;AAMlE,MAAM,4CAA6D,KAAK;;;;;;;;;;;;;;;;;;;;;;;;;;;AAwCxE,SAAgB,aAAa,EAAE,UAAU,OAAO,YAA+B;CAE7E,MAAM,iCAAqD,KAAK;AAChE,KAAI,CAAC,aAAa,QAChB,cAAa,UAAUA,mBAAK,kCAAkC;CAEhE,MAAM,YAAY,aAAa;CAG/B,MAAM,CAAC,SAAS,kCAAuB,EAAE;CAGzC,MAAM,gCAA8C,YAAY,KAAK;AACrE,aAAY,UAAU,YAAY;CAGlC,MAAM,+BAAwC,KAAK;AACnD,KAAI,CAAC,WAAW,QACd,YAAW,UAAU;EACnB,kBAAkB,aAA4C;AAC5D,aAAU,gBAAgB,SAAS;AACnC,eAAY,MAAM,IAAI,EAAE;;EAG1B,UACE,MACA,MACA,OACA,cACG;AACH,aAAU,QAAQ,MAAM,MAAM,OAAO,UAAU;AAC/C,eAAY,MAAM,IAAI,EAAE;;EAG1B,WAAW,YAA0C;AACnD,OAAI,YAAY,QACd,aAAY,QAAQ,QAAQ;;EAIhC,qBAAqB;AACnB,aAAU,eAAe;AACzB,eAAY,MAAM,IAAI,EAAE;;EAG1B,aAAa,cAAsB;AACjC,UAAO,UAAU,aAAa,CAAC,IAAI,UAAU;;EAG/C,mBAAmB;AACjB,UAAO,UAAU,aAAa;;EAGhC,UACE,MACA,MACA,cACG;AACH,UAAO,UAAU,QAAQ,MAAM,MAAM,UAAU;;EAGjD,cAAc,MAAc,oBAA6B;AACvD,UAAO,UAAU,YAAY,MAAM,gBAAgB;;EAEtD;CAEH,MAAM,UAAU,WAAW;CAG3B,MAAM,uCAA4B,EAAE,SAAS,GAAG,CAAC,QAAQ,CAAC;AAE1D,QACE,2CAAC,mBAAmB;EAAS,OAAO;YAClC,2CAAC,iBAAiB;GAAS,OAAO;aAChC,2CAACC;IAAqB;IAAQ;KAAyB;IAC7B;GACA;;;;;;;;;AAWlC,SAAgB,iBAA8B;CAC5C,MAAM,gCAAqB,mBAAmB;AAC9C,KAAI,CAAC,QACH,OAAM,IAAI,MAAM,qDAAqD;AAEvE,QAAO;;;;;;;;;AAUT,SAAgB,eAAoC;CAClD,MAAM,8BAAmB,iBAAiB;AAC1C,KAAI,CAAC,MACH,OAAM,IAAI,MAAM,mDAAmD;AAErE,QAAO"}
+{"version":3,"file":"A2UIProvider.cjs","names":["Data","ThemeProvider"],"sources":["../../../src/react-renderer/core/A2UIProvider.tsx"],"sourcesContent":["import {\n  createContext,\n  useContext,\n  useRef,\n  useState,\n  useMemo,\n  type ReactNode,\n} from \"react\";\nimport { Data, type Types } from \"@a2ui/lit/0.8\";\nimport type { A2UIContextValue, A2UIActions } from \"./store\";\nimport { ThemeProvider } from \"../theme/ThemeContext\";\nimport type { OnActionCallback } from \"../types\";\n\n/**\n * Context for stable actions (never changes reference, prevents re-renders).\n * Components that only need to dispatch actions or read data won't re-render.\n */\nconst A2UIActionsContext = createContext<A2UIActions | null>(null);\n\n/**\n * Context for reactive state (changes trigger re-renders).\n * Only components that need to react to state changes subscribe to this.\n */\nconst A2UIStateContext = createContext<{ version: number } | null>(null);\n\n/**\n * Props for the A2UIProvider component.\n */\nexport interface A2UIProviderProps {\n  /** Callback invoked when a user action is dispatched (button click, etc.) */\n  onAction?: OnActionCallback;\n  /** Theme configuration. Falls back to default theme if not provided. */\n  theme?: Types.Theme;\n  /** Child components */\n  children: ReactNode;\n}\n\n/**\n * Provider component that sets up the A2UI context for descendant components.\n *\n * This provider uses a two-context architecture for performance:\n * - A2UIActionsContext: Stable actions that never change (no re-renders)\n * - A2UIStateContext: Reactive state that triggers re-renders when needed\n *\n * @example\n * ```tsx\n * function App() {\n *   const handleAction = async (message) => {\n *     const response = await fetch('/api/a2ui', {\n *       method: 'POST',\n *       body: JSON.stringify(message)\n *     });\n *     const newMessages = await response.json();\n *   };\n *\n *   return (\n *     <A2UIProvider onAction={handleAction}>\n *       <A2UIRenderer surfaceId=\"main\" />\n *     </A2UIProvider>\n *   );\n * }\n * ```\n */\nexport function A2UIProvider({ onAction, theme, children }: A2UIProviderProps) {\n  // Create message processor only once using ref\n  const processorRef = useRef<Types.MessageProcessor | null>(null);\n  if (!processorRef.current) {\n    processorRef.current = Data.createSignalA2uiMessageProcessor();\n  }\n  const processor = processorRef.current;\n\n  // Version counter for triggering re-renders\n  const [version, setVersion] = useState(0);\n\n  // Store onAction in a ref so callbacks always have the latest value\n  const onActionRef = useRef<OnActionCallback | null>(onAction ?? null);\n  onActionRef.current = onAction ?? null;\n\n  // Create stable actions object once - stored in ref, never changes\n  const actionsRef = useRef<A2UIActions | null>(null);\n  if (!actionsRef.current) {\n    actionsRef.current = {\n      processMessages: (messages: Types.ServerToClientMessage[]) => {\n        processor.processMessages(messages);\n        setVersion((v) => v + 1);\n      },\n\n      setData: (\n        node: Types.AnyComponentNode | null,\n        path: string,\n        value: Types.DataValue,\n        surfaceId: string,\n      ) => {\n        processor.setData(node, path, value, surfaceId);\n        setVersion((v) => v + 1);\n      },\n\n      dispatch: (message: Types.A2UIClientEventMessage) => {\n        if (onActionRef.current) {\n          onActionRef.current(message);\n        }\n      },\n\n      clearSurfaces: () => {\n        processor.clearSurfaces();\n        setVersion((v) => v + 1);\n      },\n\n      getSurface: (surfaceId: string) => {\n        return processor.getSurfaces().get(surfaceId);\n      },\n\n      getSurfaces: () => {\n        return processor.getSurfaces();\n      },\n\n      getData: (\n        node: Types.AnyComponentNode,\n        path: string,\n        surfaceId: string,\n      ) => {\n        return processor.getData(node, path, surfaceId);\n      },\n\n      resolvePath: (path: string, dataContextPath?: string) => {\n        return processor.resolvePath(path, dataContextPath);\n      },\n    };\n  }\n  const actions = actionsRef.current;\n\n  // State context value - only changes when version changes\n  const stateValue = useMemo(() => ({ version }), [version]);\n\n  return (\n    <A2UIActionsContext.Provider value={actions}>\n      <A2UIStateContext.Provider value={stateValue}>\n        <ThemeProvider theme={theme}>{children}</ThemeProvider>\n      </A2UIStateContext.Provider>\n    </A2UIActionsContext.Provider>\n  );\n}\n\n/**\n * Hook to access stable A2UI actions (won't cause re-renders).\n * Use this when you only need to dispatch actions or read data.\n *\n * @returns Stable actions object\n * @throws If used outside of an A2UIProvider\n */\nexport function useA2UIActions(): A2UIActions {\n  const actions = useContext(A2UIActionsContext);\n  if (!actions) {\n    throw new Error(\"useA2UIActions must be used within an A2UIProvider\");\n  }\n  return actions;\n}\n\n/**\n * Hook to subscribe to A2UI state changes.\n * Components using this will re-render when state changes.\n *\n * @returns Current version number\n * @throws If used outside of an A2UIProvider\n */\nexport function useA2UIState(): { version: number } {\n  const state = useContext(A2UIStateContext);\n  if (!state) {\n    throw new Error(\"useA2UIState must be used within an A2UIProvider\");\n  }\n  return state;\n}\n\n/**\n * Hook to access the full A2UI context (actions + state).\n * Components using this will re-render when state changes.\n *\n * @returns The A2UI context value\n * @throws If used outside of an A2UIProvider\n */\nexport function useA2UIContext(): A2UIContextValue {\n  const actions = useA2UIActions();\n  const state = useA2UIState();\n\n  // Memoize combined value - only changes when state changes\n  // Actions are stable, so this only re-creates when version changes\n  return useMemo(\n    () => ({\n      ...actions,\n      processor: null as unknown as Types.MessageProcessor, // Not exposed directly\n      version: state.version,\n      onAction: null, // Use dispatch instead\n    }),\n    [actions, state.version],\n  );\n}\n\n/**\n * @deprecated Use useA2UIContext instead. This alias exists for backward compatibility only.\n */\nexport const useA2UIStore = useA2UIContext;\n\n/**\n * @deprecated This selector pattern does not provide performance benefits with React Context.\n * Components will re-render on any context change regardless of what you select.\n * Use useA2UIContext() or useA2UI() directly instead.\n *\n * @param selector - Function to select a slice of state\n * @returns The selected state\n */\nexport function useA2UIStoreSelector<T>(\n  selector: (state: A2UIContextValue) => T,\n): T {\n  const context = useA2UIContext();\n  return selector(context);\n}\n"],"mappings":";;;;;;;;;;;AAiBA,MAAM,8CAAuD,KAAK;;;;;AAMlE,MAAM,4CAA6D,KAAK;;;;;;;;;;;;;;;;;;;;;;;;;;;AAwCxE,SAAgB,aAAa,EAAE,UAAU,OAAO,YAA+B;CAE7E,MAAM,iCAAqD,KAAK;AAChE,KAAI,CAAC,aAAa,QAChB,cAAa,UAAUA,mBAAK,kCAAkC;CAEhE,MAAM,YAAY,aAAa;CAG/B,MAAM,CAAC,SAAS,kCAAuB,EAAE;CAGzC,MAAM,gCAA8C,YAAY,KAAK;AACrE,aAAY,UAAU,YAAY;CAGlC,MAAM,+BAAwC,KAAK;AACnD,KAAI,CAAC,WAAW,QACd,YAAW,UAAU;EACnB,kBAAkB,aAA4C;AAC5D,aAAU,gBAAgB,SAAS;AACnC,eAAY,MAAM,IAAI,EAAE;;EAG1B,UACE,MACA,MACA,OACA,cACG;AACH,aAAU,QAAQ,MAAM,MAAM,OAAO,UAAU;AAC/C,eAAY,MAAM,IAAI,EAAE;;EAG1B,WAAW,YAA0C;AACnD,OAAI,YAAY,QACd,aAAY,QAAQ,QAAQ;;EAIhC,qBAAqB;AACnB,aAAU,eAAe;AACzB,eAAY,MAAM,IAAI,EAAE;;EAG1B,aAAa,cAAsB;AACjC,UAAO,UAAU,aAAa,CAAC,IAAI,UAAU;;EAG/C,mBAAmB;AACjB,UAAO,UAAU,aAAa;;EAGhC,UACE,MACA,MACA,cACG;AACH,UAAO,UAAU,QAAQ,MAAM,MAAM,UAAU;;EAGjD,cAAc,MAAc,oBAA6B;AACvD,UAAO,UAAU,YAAY,MAAM,gBAAgB;;EAEtD;CAEH,MAAM,UAAU,WAAW;CAG3B,MAAM,uCAA4B,EAAE,SAAS,GAAG,CAAC,QAAQ,CAAC;AAE1D,QACE,2CAAC,mBAAmB;EAAS,OAAO;YAClC,2CAAC,iBAAiB;GAAS,OAAO;aAChC,2CAACC;IAAqB;IAAQ;KAAyB;IAC7B;GACA;;;;;;;;;AAWlC,SAAgB,iBAA8B;CAC5C,MAAM,gCAAqB,mBAAmB;AAC9C,KAAI,CAAC,QACH,OAAM,IAAI,MAAM,qDAAqD;AAEvE,QAAO;;;;;;;;;AAUT,SAAgB,eAAoC;CAClD,MAAM,8BAAmB,iBAAiB;AAC1C,KAAI,CAAC,MACH,OAAM,IAAI,MAAM,mDAAmD;AAErE,QAAO;;;;;;;;;AAUT,SAAgB,iBAAmC;CACjD,MAAM,UAAU,gBAAgB;CAChC,MAAM,QAAQ,cAAc;AAI5B,kCACS;EACL,GAAG;EACH,WAAW;EACX,SAAS,MAAM;EACf,UAAU;EACX,GACD,CAAC,SAAS,MAAM,QAAQ,CACzB;;;;;AAMH,MAAa,eAAe;;;;;;;;;AAU5B,SAAgB,qBACd,UACG;AAEH,QAAO,SADS,gBAAgB,CACR"}

package/dist/react-renderer/core/A2UIProvider.d.cts

@@ -0,0 +1,91 @@
+import { OnActionCallback } from "../types.cjs";
+import { A2UIActions, A2UIContextValue } from "./store.cjs";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+import { ReactNode } from "react";
+import { Types } from "@a2ui/lit/0.8";
+
+//#region src/react-renderer/core/A2UIProvider.d.ts
+/**
+ * Props for the A2UIProvider component.
+ */
+interface A2UIProviderProps {
+  /** Callback invoked when a user action is dispatched (button click, etc.) */
+  onAction?: OnActionCallback;
+  /** Theme configuration. Falls back to default theme if not provided. */
+  theme?: Types.Theme;
+  /** Child components */
+  children: ReactNode;
+}
+/**
+ * Provider component that sets up the A2UI context for descendant components.
+ *
+ * This provider uses a two-context architecture for performance:
+ * - A2UIActionsContext: Stable actions that never change (no re-renders)
+ * - A2UIStateContext: Reactive state that triggers re-renders when needed
+ *
+ * @example
+ * ```tsx
+ * function App() {
+ *   const handleAction = async (message) => {
+ *     const response = await fetch('/api/a2ui', {
+ *       method: 'POST',
+ *       body: JSON.stringify(message)
+ *     });
+ *     const newMessages = await response.json();
+ *   };
+ *
+ *   return (
+ *     <A2UIProvider onAction={handleAction}>
+ *       <A2UIRenderer surfaceId="main" />
+ *     </A2UIProvider>
+ *   );
+ * }
+ * ```
+ */
+declare function A2UIProvider({
+  onAction,
+  theme,
+  children
+}: A2UIProviderProps): react_jsx_runtime0.JSX.Element;
+/**
+ * Hook to access stable A2UI actions (won't cause re-renders).
+ * Use this when you only need to dispatch actions or read data.
+ *
+ * @returns Stable actions object
+ * @throws If used outside of an A2UIProvider
+ */
+declare function useA2UIActions(): A2UIActions;
+/**
+ * Hook to subscribe to A2UI state changes.
+ * Components using this will re-render when state changes.
+ *
+ * @returns Current version number
+ * @throws If used outside of an A2UIProvider
+ */
+declare function useA2UIState(): {
+  version: number;
+};
+/**
+ * Hook to access the full A2UI context (actions + state).
+ * Components using this will re-render when state changes.
+ *
+ * @returns The A2UI context value
+ * @throws If used outside of an A2UIProvider
+ */
+declare function useA2UIContext(): A2UIContextValue;
+/**
+ * @deprecated Use useA2UIContext instead. This alias exists for backward compatibility only.
+ */
+declare const useA2UIStore: typeof useA2UIContext;
+/**
+ * @deprecated This selector pattern does not provide performance benefits with React Context.
+ * Components will re-render on any context change regardless of what you select.
+ * Use useA2UIContext() or useA2UI() directly instead.
+ *
+ * @param selector - Function to select a slice of state
+ * @returns The selected state
+ */
+declare function useA2UIStoreSelector<T>(selector: (state: A2UIContextValue) => T): T;
+//#endregion
+export { A2UIProvider, A2UIProviderProps, useA2UIActions, useA2UIContext, useA2UIState, useA2UIStore, useA2UIStoreSelector };
+//# sourceMappingURL=A2UIProvider.d.cts.map

package/dist/react-renderer/core/A2UIProvider.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"A2UIProvider.d.cts","names":[],"sources":["../../../src/react-renderer/core/A2UIProvider.tsx"],"mappings":";;;;;;;;;;UA4BiB,iBAAA;EAAiB;EAEhC,QAAA,GAAW,gBAAA;EAAA;EAEX,KAAA,GAAQ,KAAA,CAAM,KAAA;EAEJ;EAAV,QAAA,EAAU,SAAA;AAAA;;;;;;;;;;AA6BZ;;;;;;;;;;;;;;;;;iBAAgB,YAAA,CAAA;EAAe,QAAA;EAAU,KAAA;EAAO;AAAA,GAAY,iBAAA,GAAiB,kBAAA,CAAA,GAAA,CAAA,OAAA;;;;AAuF7E;;;;iBAAgB,cAAA,CAAA,GAAkB,WAAA;AAelC;;;;;AAeA;;AAfA,iBAAgB,YAAA,CAAA;EAAkB,OAAA;AAAA;AAmClC;;;;;AAUA;;AAVA,iBApBgB,cAAA,CAAA,GAAkB,gBAAA;;;;cAoBrB,YAAA,SAAY,cAAA;;;;;;;;;iBAUT,oBAAA,GAAA,CACd,QAAA,GAAW,KAAA,EAAO,gBAAA,KAAqB,CAAA,GACtC,CAAA"}

package/dist/react-renderer/core/A2UIProvider.d.mts

@@ -0,0 +1,91 @@
+import { OnActionCallback } from "../types.mjs";
+import { A2UIActions, A2UIContextValue } from "./store.mjs";
+import { ReactNode } from "react";
+import { Types } from "@a2ui/lit/0.8";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/react-renderer/core/A2UIProvider.d.ts
+/**
+ * Props for the A2UIProvider component.
+ */
+interface A2UIProviderProps {
+  /** Callback invoked when a user action is dispatched (button click, etc.) */
+  onAction?: OnActionCallback;
+  /** Theme configuration. Falls back to default theme if not provided. */
+  theme?: Types.Theme;
+  /** Child components */
+  children: ReactNode;
+}
+/**
+ * Provider component that sets up the A2UI context for descendant components.
+ *
+ * This provider uses a two-context architecture for performance:
+ * - A2UIActionsContext: Stable actions that never change (no re-renders)
+ * - A2UIStateContext: Reactive state that triggers re-renders when needed
+ *
+ * @example
+ * ```tsx
+ * function App() {
+ *   const handleAction = async (message) => {
+ *     const response = await fetch('/api/a2ui', {
+ *       method: 'POST',
+ *       body: JSON.stringify(message)
+ *     });
+ *     const newMessages = await response.json();
+ *   };
+ *
+ *   return (
+ *     <A2UIProvider onAction={handleAction}>
+ *       <A2UIRenderer surfaceId="main" />
+ *     </A2UIProvider>
+ *   );
+ * }
+ * ```
+ */
+declare function A2UIProvider({
+  onAction,
+  theme,
+  children
+}: A2UIProviderProps): react_jsx_runtime0.JSX.Element;
+/**
+ * Hook to access stable A2UI actions (won't cause re-renders).
+ * Use this when you only need to dispatch actions or read data.
+ *
+ * @returns Stable actions object
+ * @throws If used outside of an A2UIProvider
+ */
+declare function useA2UIActions(): A2UIActions;
+/**
+ * Hook to subscribe to A2UI state changes.
+ * Components using this will re-render when state changes.
+ *
+ * @returns Current version number
+ * @throws If used outside of an A2UIProvider
+ */
+declare function useA2UIState(): {
+  version: number;
+};
+/**
+ * Hook to access the full A2UI context (actions + state).
+ * Components using this will re-render when state changes.
+ *
+ * @returns The A2UI context value
+ * @throws If used outside of an A2UIProvider
+ */
+declare function useA2UIContext(): A2UIContextValue;
+/**
+ * @deprecated Use useA2UIContext instead. This alias exists for backward compatibility only.
+ */
+declare const useA2UIStore: typeof useA2UIContext;
+/**
+ * @deprecated This selector pattern does not provide performance benefits with React Context.
+ * Components will re-render on any context change regardless of what you select.
+ * Use useA2UIContext() or useA2UI() directly instead.
+ *
+ * @param selector - Function to select a slice of state
+ * @returns The selected state
+ */
+declare function useA2UIStoreSelector<T>(selector: (state: A2UIContextValue) => T): T;
+//#endregion
+export { A2UIProvider, A2UIProviderProps, useA2UIActions, useA2UIContext, useA2UIState, useA2UIStore, useA2UIStoreSelector };
+//# sourceMappingURL=A2UIProvider.d.mts.map

package/dist/react-renderer/core/A2UIProvider.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"A2UIProvider.d.mts","names":[],"sources":["../../../src/react-renderer/core/A2UIProvider.tsx"],"mappings":";;;;;;;;;;UA4BiB,iBAAA;EAAiB;EAEhC,QAAA,GAAW,gBAAA;EAAA;EAEX,KAAA,GAAQ,KAAA,CAAM,KAAA;EAEJ;EAAV,QAAA,EAAU,SAAA;AAAA;;;;;;;;;;AA6BZ;;;;;;;;;;;;;;;;;iBAAgB,YAAA,CAAA;EAAe,QAAA;EAAU,KAAA;EAAO;AAAA,GAAY,iBAAA,GAAiB,kBAAA,CAAA,GAAA,CAAA,OAAA;;;;AAuF7E;;;;iBAAgB,cAAA,CAAA,GAAkB,WAAA;AAelC;;;;;AAeA;;AAfA,iBAAgB,YAAA,CAAA;EAAkB,OAAA;AAAA;AAmClC;;;;;AAUA;;AAVA,iBApBgB,cAAA,CAAA,GAAkB,gBAAA;;;;cAoBrB,YAAA,SAAY,cAAA;;;;;;;;;iBAUT,oBAAA,GAAA,CACd,QAAA,GAAW,KAAA,EAAO,gBAAA,KAAqB,CAAA,GACtC,CAAA"}

package/dist/react-renderer/core/A2UIProvider.mjs

@@ -114,7 +114,39 @@ function useA2UIState() {
 	if (!state) throw new Error("useA2UIState must be used within an A2UIProvider");
 	return state;
 }
+/**
+* Hook to access the full A2UI context (actions + state).
+* Components using this will re-render when state changes.
+*
+* @returns The A2UI context value
+* @throws If used outside of an A2UIProvider
+*/
+function useA2UIContext() {
+	const actions = useA2UIActions();
+	const state = useA2UIState();
+	return useMemo(() => ({
+		...actions,
+		processor: null,
+		version: state.version,
+		onAction: null
+	}), [actions, state.version]);
+}
+/**
+* @deprecated Use useA2UIContext instead. This alias exists for backward compatibility only.
+*/
+const useA2UIStore = useA2UIContext;
+/**
+* @deprecated This selector pattern does not provide performance benefits with React Context.
+* Components will re-render on any context change regardless of what you select.
+* Use useA2UIContext() or useA2UI() directly instead.
+*
+* @param selector - Function to select a slice of state
+* @returns The selected state
+*/
+function useA2UIStoreSelector(selector) {
+	return selector(useA2UIContext());
+}
 
 //#endregion
-export { A2UIProvider, useA2UIActions, useA2UIState };
+export { A2UIProvider, useA2UIActions, useA2UIContext, useA2UIState, useA2UIStore, useA2UIStoreSelector };
 //# sourceMappingURL=A2UIProvider.mjs.map

package/dist/react-renderer/core/A2UIProvider.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"A2UIProvider.mjs","names":[],"sources":["../../../src/react-renderer/core/A2UIProvider.tsx"],"sourcesContent":["import {\n  createContext,\n  useContext,\n  useRef,\n  useState,\n  useMemo,\n  type ReactNode,\n} from \"react\";\nimport { Data, type Types } from \"@a2ui/lit/0.8\";\nimport type { A2UIContextValue, A2UIActions } from \"./store\";\nimport { ThemeProvider } from \"../theme/ThemeContext\";\nimport type { OnActionCallback } from \"../types\";\n\n/**\n * Context for stable actions (never changes reference, prevents re-renders).\n * Components that only need to dispatch actions or read data won't re-render.\n */\nconst A2UIActionsContext = createContext<A2UIActions | null>(null);\n\n/**\n * Context for reactive state (changes trigger re-renders).\n * Only components that need to react to state changes subscribe to this.\n */\nconst A2UIStateContext = createContext<{ version: number } | null>(null);\n\n/**\n * Props for the A2UIProvider component.\n */\nexport interface A2UIProviderProps {\n  /** Callback invoked when a user action is dispatched (button click, etc.) */\n  onAction?: OnActionCallback;\n  /** Theme configuration. Falls back to default theme if not provided. */\n  theme?: Types.Theme;\n  /** Child components */\n  children: ReactNode;\n}\n\n/**\n * Provider component that sets up the A2UI context for descendant components.\n *\n * This provider uses a two-context architecture for performance:\n * - A2UIActionsContext: Stable actions that never change (no re-renders)\n * - A2UIStateContext: Reactive state that triggers re-renders when needed\n *\n * @example\n * ```tsx\n * function App() {\n *   const handleAction = async (message) => {\n *     const response = await fetch('/api/a2ui', {\n *       method: 'POST',\n *       body: JSON.stringify(message)\n *     });\n *     const newMessages = await response.json();\n *   };\n *\n *   return (\n *     <A2UIProvider onAction={handleAction}>\n *       <A2UIRenderer surfaceId=\"main\" />\n *     </A2UIProvider>\n *   );\n * }\n * ```\n */\nexport function A2UIProvider({ onAction, theme, children }: A2UIProviderProps) {\n  // Create message processor only once using ref\n  const processorRef = useRef<Types.MessageProcessor | null>(null);\n  if (!processorRef.current) {\n    processorRef.current = Data.createSignalA2uiMessageProcessor();\n  }\n  const processor = processorRef.current;\n\n  // Version counter for triggering re-renders\n  const [version, setVersion] = useState(0);\n\n  // Store onAction in a ref so callbacks always have the latest value\n  const onActionRef = useRef<OnActionCallback | null>(onAction ?? null);\n  onActionRef.current = onAction ?? null;\n\n  // Create stable actions object once - stored in ref, never changes\n  const actionsRef = useRef<A2UIActions | null>(null);\n  if (!actionsRef.current) {\n    actionsRef.current = {\n      processMessages: (messages: Types.ServerToClientMessage[]) => {\n        processor.processMessages(messages);\n        setVersion((v) => v + 1);\n      },\n\n      setData: (\n        node: Types.AnyComponentNode | null,\n        path: string,\n        value: Types.DataValue,\n        surfaceId: string,\n      ) => {\n        processor.setData(node, path, value, surfaceId);\n        setVersion((v) => v + 1);\n      },\n\n      dispatch: (message: Types.A2UIClientEventMessage) => {\n        if (onActionRef.current) {\n          onActionRef.current(message);\n        }\n      },\n\n      clearSurfaces: () => {\n        processor.clearSurfaces();\n        setVersion((v) => v + 1);\n      },\n\n      getSurface: (surfaceId: string) => {\n        return processor.getSurfaces().get(surfaceId);\n      },\n\n      getSurfaces: () => {\n        return processor.getSurfaces();\n      },\n\n      getData: (\n        node: Types.AnyComponentNode,\n        path: string,\n        surfaceId: string,\n      ) => {\n        return processor.getData(node, path, surfaceId);\n      },\n\n      resolvePath: (path: string, dataContextPath?: string) => {\n        return processor.resolvePath(path, dataContextPath);\n      },\n    };\n  }\n  const actions = actionsRef.current;\n\n  // State context value - only changes when version changes\n  const stateValue = useMemo(() => ({ version }), [version]);\n\n  return (\n    <A2UIActionsContext.Provider value={actions}>\n      <A2UIStateContext.Provider value={stateValue}>\n        <ThemeProvider theme={theme}>{children}</ThemeProvider>\n      </A2UIStateContext.Provider>\n    </A2UIActionsContext.Provider>\n  );\n}\n\n/**\n * Hook to access stable A2UI actions (won't cause re-renders).\n * Use this when you only need to dispatch actions or read data.\n *\n * @returns Stable actions object\n * @throws If used outside of an A2UIProvider\n */\nexport function useA2UIActions(): A2UIActions {\n  const actions = useContext(A2UIActionsContext);\n  if (!actions) {\n    throw new Error(\"useA2UIActions must be used within an A2UIProvider\");\n  }\n  return actions;\n}\n\n/**\n * Hook to subscribe to A2UI state changes.\n * Components using this will re-render when state changes.\n *\n * @returns Current version number\n * @throws If used outside of an A2UIProvider\n */\nexport function useA2UIState(): { version: number } {\n  const state = useContext(A2UIStateContext);\n  if (!state) {\n    throw new Error(\"useA2UIState must be used within an A2UIProvider\");\n  }\n  return state;\n}\n\n/**\n * Hook to access the full A2UI context (actions + state).\n * Components using this will re-render when state changes.\n *\n * @returns The A2UI context value\n * @throws If used outside of an A2UIProvider\n */\nexport function useA2UIContext(): A2UIContextValue {\n  const actions = useA2UIActions();\n  const state = useA2UIState();\n\n  // Memoize combined value - only changes when state changes\n  // Actions are stable, so this only re-creates when version changes\n  return useMemo(\n    () => ({\n      ...actions,\n      processor: null as unknown as Types.MessageProcessor, // Not exposed directly\n      version: state.version,\n      onAction: null, // Use dispatch instead\n    }),\n    [actions, state.version],\n  );\n}\n\n/**\n * @deprecated Use useA2UIContext instead. This alias exists for backward compatibility only.\n */\nexport const useA2UIStore = useA2UIContext;\n\n/**\n * @deprecated This selector pattern does not provide performance benefits with React Context.\n * Components will re-render on any context change regardless of what you select.\n * Use useA2UIContext() or useA2UI() directly instead.\n *\n * @param selector - Function to select a slice of state\n * @returns The selected state\n */\nexport function useA2UIStoreSelector<T>(\n  selector: (state: A2UIContextValue) => T,\n): T {\n  const context = useA2UIContext();\n  return selector(context);\n}\n"],"mappings":";;;;;;;;;;AAiBA,MAAM,qBAAqB,cAAkC,KAAK;;;;;AAMlE,MAAM,mBAAmB,cAA0C,KAAK;;;;;;;;;;;;;;;;;;;;;;;;;;;AAwCxE,SAAgB,aAAa,EAAE,UAAU,OAAO,YAA+B;CAE7E,MAAM,eAAe,OAAsC,KAAK;AAChE,KAAI,CAAC,aAAa,QAChB,cAAa,UAAU,KAAK,kCAAkC;CAEhE,MAAM,YAAY,aAAa;CAG/B,MAAM,CAAC,SAAS,cAAc,SAAS,EAAE;CAGzC,MAAM,cAAc,OAAgC,YAAY,KAAK;AACrE,aAAY,UAAU,YAAY;CAGlC,MAAM,aAAa,OAA2B,KAAK;AACnD,KAAI,CAAC,WAAW,QACd,YAAW,UAAU;EACnB,kBAAkB,aAA4C;AAC5D,aAAU,gBAAgB,SAAS;AACnC,eAAY,MAAM,IAAI,EAAE;;EAG1B,UACE,MACA,MACA,OACA,cACG;AACH,aAAU,QAAQ,MAAM,MAAM,OAAO,UAAU;AAC/C,eAAY,MAAM,IAAI,EAAE;;EAG1B,WAAW,YAA0C;AACnD,OAAI,YAAY,QACd,aAAY,QAAQ,QAAQ;;EAIhC,qBAAqB;AACnB,aAAU,eAAe;AACzB,eAAY,MAAM,IAAI,EAAE;;EAG1B,aAAa,cAAsB;AACjC,UAAO,UAAU,aAAa,CAAC,IAAI,UAAU;;EAG/C,mBAAmB;AACjB,UAAO,UAAU,aAAa;;EAGhC,UACE,MACA,MACA,cACG;AACH,UAAO,UAAU,QAAQ,MAAM,MAAM,UAAU;;EAGjD,cAAc,MAAc,oBAA6B;AACvD,UAAO,UAAU,YAAY,MAAM,gBAAgB;;EAEtD;CAEH,MAAM,UAAU,WAAW;CAG3B,MAAM,aAAa,eAAe,EAAE,SAAS,GAAG,CAAC,QAAQ,CAAC;AAE1D,QACE,oBAAC,mBAAmB;EAAS,OAAO;YAClC,oBAAC,iBAAiB;GAAS,OAAO;aAChC,oBAAC;IAAqB;IAAQ;KAAyB;IAC7B;GACA;;;;;;;;;AAWlC,SAAgB,iBAA8B;CAC5C,MAAM,UAAU,WAAW,mBAAmB;AAC9C,KAAI,CAAC,QACH,OAAM,IAAI,MAAM,qDAAqD;AAEvE,QAAO;;;;;;;;;AAUT,SAAgB,eAAoC;CAClD,MAAM,QAAQ,WAAW,iBAAiB;AAC1C,KAAI,CAAC,MACH,OAAM,IAAI,MAAM,mDAAmD;AAErE,QAAO"}
+{"version":3,"file":"A2UIProvider.mjs","names":[],"sources":["../../../src/react-renderer/core/A2UIProvider.tsx"],"sourcesContent":["import {\n  createContext,\n  useContext,\n  useRef,\n  useState,\n  useMemo,\n  type ReactNode,\n} from \"react\";\nimport { Data, type Types } from \"@a2ui/lit/0.8\";\nimport type { A2UIContextValue, A2UIActions } from \"./store\";\nimport { ThemeProvider } from \"../theme/ThemeContext\";\nimport type { OnActionCallback } from \"../types\";\n\n/**\n * Context for stable actions (never changes reference, prevents re-renders).\n * Components that only need to dispatch actions or read data won't re-render.\n */\nconst A2UIActionsContext = createContext<A2UIActions | null>(null);\n\n/**\n * Context for reactive state (changes trigger re-renders).\n * Only components that need to react to state changes subscribe to this.\n */\nconst A2UIStateContext = createContext<{ version: number } | null>(null);\n\n/**\n * Props for the A2UIProvider component.\n */\nexport interface A2UIProviderProps {\n  /** Callback invoked when a user action is dispatched (button click, etc.) */\n  onAction?: OnActionCallback;\n  /** Theme configuration. Falls back to default theme if not provided. */\n  theme?: Types.Theme;\n  /** Child components */\n  children: ReactNode;\n}\n\n/**\n * Provider component that sets up the A2UI context for descendant components.\n *\n * This provider uses a two-context architecture for performance:\n * - A2UIActionsContext: Stable actions that never change (no re-renders)\n * - A2UIStateContext: Reactive state that triggers re-renders when needed\n *\n * @example\n * ```tsx\n * function App() {\n *   const handleAction = async (message) => {\n *     const response = await fetch('/api/a2ui', {\n *       method: 'POST',\n *       body: JSON.stringify(message)\n *     });\n *     const newMessages = await response.json();\n *   };\n *\n *   return (\n *     <A2UIProvider onAction={handleAction}>\n *       <A2UIRenderer surfaceId=\"main\" />\n *     </A2UIProvider>\n *   );\n * }\n * ```\n */\nexport function A2UIProvider({ onAction, theme, children }: A2UIProviderProps) {\n  // Create message processor only once using ref\n  const processorRef = useRef<Types.MessageProcessor | null>(null);\n  if (!processorRef.current) {\n    processorRef.current = Data.createSignalA2uiMessageProcessor();\n  }\n  const processor = processorRef.current;\n\n  // Version counter for triggering re-renders\n  const [version, setVersion] = useState(0);\n\n  // Store onAction in a ref so callbacks always have the latest value\n  const onActionRef = useRef<OnActionCallback | null>(onAction ?? null);\n  onActionRef.current = onAction ?? null;\n\n  // Create stable actions object once - stored in ref, never changes\n  const actionsRef = useRef<A2UIActions | null>(null);\n  if (!actionsRef.current) {\n    actionsRef.current = {\n      processMessages: (messages: Types.ServerToClientMessage[]) => {\n        processor.processMessages(messages);\n        setVersion((v) => v + 1);\n      },\n\n      setData: (\n        node: Types.AnyComponentNode | null,\n        path: string,\n        value: Types.DataValue,\n        surfaceId: string,\n      ) => {\n        processor.setData(node, path, value, surfaceId);\n        setVersion((v) => v + 1);\n      },\n\n      dispatch: (message: Types.A2UIClientEventMessage) => {\n        if (onActionRef.current) {\n          onActionRef.current(message);\n        }\n      },\n\n      clearSurfaces: () => {\n        processor.clearSurfaces();\n        setVersion((v) => v + 1);\n      },\n\n      getSurface: (surfaceId: string) => {\n        return processor.getSurfaces().get(surfaceId);\n      },\n\n      getSurfaces: () => {\n        return processor.getSurfaces();\n      },\n\n      getData: (\n        node: Types.AnyComponentNode,\n        path: string,\n        surfaceId: string,\n      ) => {\n        return processor.getData(node, path, surfaceId);\n      },\n\n      resolvePath: (path: string, dataContextPath?: string) => {\n        return processor.resolvePath(path, dataContextPath);\n      },\n    };\n  }\n  const actions = actionsRef.current;\n\n  // State context value - only changes when version changes\n  const stateValue = useMemo(() => ({ version }), [version]);\n\n  return (\n    <A2UIActionsContext.Provider value={actions}>\n      <A2UIStateContext.Provider value={stateValue}>\n        <ThemeProvider theme={theme}>{children}</ThemeProvider>\n      </A2UIStateContext.Provider>\n    </A2UIActionsContext.Provider>\n  );\n}\n\n/**\n * Hook to access stable A2UI actions (won't cause re-renders).\n * Use this when you only need to dispatch actions or read data.\n *\n * @returns Stable actions object\n * @throws If used outside of an A2UIProvider\n */\nexport function useA2UIActions(): A2UIActions {\n  const actions = useContext(A2UIActionsContext);\n  if (!actions) {\n    throw new Error(\"useA2UIActions must be used within an A2UIProvider\");\n  }\n  return actions;\n}\n\n/**\n * Hook to subscribe to A2UI state changes.\n * Components using this will re-render when state changes.\n *\n * @returns Current version number\n * @throws If used outside of an A2UIProvider\n */\nexport function useA2UIState(): { version: number } {\n  const state = useContext(A2UIStateContext);\n  if (!state) {\n    throw new Error(\"useA2UIState must be used within an A2UIProvider\");\n  }\n  return state;\n}\n\n/**\n * Hook to access the full A2UI context (actions + state).\n * Components using this will re-render when state changes.\n *\n * @returns The A2UI context value\n * @throws If used outside of an A2UIProvider\n */\nexport function useA2UIContext(): A2UIContextValue {\n  const actions = useA2UIActions();\n  const state = useA2UIState();\n\n  // Memoize combined value - only changes when state changes\n  // Actions are stable, so this only re-creates when version changes\n  return useMemo(\n    () => ({\n      ...actions,\n      processor: null as unknown as Types.MessageProcessor, // Not exposed directly\n      version: state.version,\n      onAction: null, // Use dispatch instead\n    }),\n    [actions, state.version],\n  );\n}\n\n/**\n * @deprecated Use useA2UIContext instead. This alias exists for backward compatibility only.\n */\nexport const useA2UIStore = useA2UIContext;\n\n/**\n * @deprecated This selector pattern does not provide performance benefits with React Context.\n * Components will re-render on any context change regardless of what you select.\n * Use useA2UIContext() or useA2UI() directly instead.\n *\n * @param selector - Function to select a slice of state\n * @returns The selected state\n */\nexport function useA2UIStoreSelector<T>(\n  selector: (state: A2UIContextValue) => T,\n): T {\n  const context = useA2UIContext();\n  return selector(context);\n}\n"],"mappings":";;;;;;;;;;AAiBA,MAAM,qBAAqB,cAAkC,KAAK;;;;;AAMlE,MAAM,mBAAmB,cAA0C,KAAK;;;;;;;;;;;;;;;;;;;;;;;;;;;AAwCxE,SAAgB,aAAa,EAAE,UAAU,OAAO,YAA+B;CAE7E,MAAM,eAAe,OAAsC,KAAK;AAChE,KAAI,CAAC,aAAa,QAChB,cAAa,UAAU,KAAK,kCAAkC;CAEhE,MAAM,YAAY,aAAa;CAG/B,MAAM,CAAC,SAAS,cAAc,SAAS,EAAE;CAGzC,MAAM,cAAc,OAAgC,YAAY,KAAK;AACrE,aAAY,UAAU,YAAY;CAGlC,MAAM,aAAa,OAA2B,KAAK;AACnD,KAAI,CAAC,WAAW,QACd,YAAW,UAAU;EACnB,kBAAkB,aAA4C;AAC5D,aAAU,gBAAgB,SAAS;AACnC,eAAY,MAAM,IAAI,EAAE;;EAG1B,UACE,MACA,MACA,OACA,cACG;AACH,aAAU,QAAQ,MAAM,MAAM,OAAO,UAAU;AAC/C,eAAY,MAAM,IAAI,EAAE;;EAG1B,WAAW,YAA0C;AACnD,OAAI,YAAY,QACd,aAAY,QAAQ,QAAQ;;EAIhC,qBAAqB;AACnB,aAAU,eAAe;AACzB,eAAY,MAAM,IAAI,EAAE;;EAG1B,aAAa,cAAsB;AACjC,UAAO,UAAU,aAAa,CAAC,IAAI,UAAU;;EAG/C,mBAAmB;AACjB,UAAO,UAAU,aAAa;;EAGhC,UACE,MACA,MACA,cACG;AACH,UAAO,UAAU,QAAQ,MAAM,MAAM,UAAU;;EAGjD,cAAc,MAAc,oBAA6B;AACvD,UAAO,UAAU,YAAY,MAAM,gBAAgB;;EAEtD;CAEH,MAAM,UAAU,WAAW;CAG3B,MAAM,aAAa,eAAe,EAAE,SAAS,GAAG,CAAC,QAAQ,CAAC;AAE1D,QACE,oBAAC,mBAAmB;EAAS,OAAO;YAClC,oBAAC,iBAAiB;GAAS,OAAO;aAChC,oBAAC;IAAqB;IAAQ;KAAyB;IAC7B;GACA;;;;;;;;;AAWlC,SAAgB,iBAA8B;CAC5C,MAAM,UAAU,WAAW,mBAAmB;AAC9C,KAAI,CAAC,QACH,OAAM,IAAI,MAAM,qDAAqD;AAEvE,QAAO;;;;;;;;;AAUT,SAAgB,eAAoC;CAClD,MAAM,QAAQ,WAAW,iBAAiB;AAC1C,KAAI,CAAC,MACH,OAAM,IAAI,MAAM,mDAAmD;AAErE,QAAO;;;;;;;;;AAUT,SAAgB,iBAAmC;CACjD,MAAM,UAAU,gBAAgB;CAChC,MAAM,QAAQ,cAAc;AAI5B,QAAO,eACE;EACL,GAAG;EACH,WAAW;EACX,SAAS,MAAM;EACf,UAAU;EACX,GACD,CAAC,SAAS,MAAM,QAAQ,CACzB;;;;;AAMH,MAAa,eAAe;;;;;;;;;AAU5B,SAAgB,qBACd,UACG;AAEH,QAAO,SADS,gBAAgB,CACR"}

package/dist/react-renderer/core/A2UIRenderer.d.cts

@@ -0,0 +1,40 @@
+import { ComponentRegistry } from "../registry/ComponentRegistry.cjs";
+import * as react from "react";
+import { ReactNode } from "react";
+
+//#region src/react-renderer/core/A2UIRenderer.d.ts
+interface A2UIRendererProps {
+  /** The surface ID to render */
+  surfaceId: string;
+  /** Additional CSS classes for the surface container */
+  className?: string;
+  /** Fallback content when surface is not yet available */
+  fallback?: ReactNode;
+  /** Loading fallback for lazy-loaded components */
+  loadingFallback?: ReactNode;
+  /** Optional custom component registry */
+  registry?: ComponentRegistry;
+}
+/**
+ * A2UIRenderer - renders an A2UI surface.
+ *
+ * This is the main entry point for rendering A2UI content in your React app.
+ * It reads the surface state from the A2UI store and renders the component tree.
+ *
+ * Memoized to prevent unnecessary re-renders when props haven't changed.
+ *
+ * @example
+ * ```tsx
+ * function App() {
+ *   return (
+ *     <A2UIProvider onAction={handleAction}>
+ *       <A2UIRenderer surfaceId="main" />
+ *     </A2UIProvider>
+ *   );
+ * }
+ * ```
+ */
+declare const A2UIRenderer: react.NamedExoticComponent<A2UIRendererProps>;
+//#endregion
+export { A2UIRenderer, A2UIRendererProps };
+//# sourceMappingURL=A2UIRenderer.d.cts.map

package/dist/react-renderer/core/A2UIRenderer.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"A2UIRenderer.d.cts","names":[],"sources":["../../../src/react-renderer/core/A2UIRenderer.tsx"],"mappings":";;;;;UAeiB,iBAAA;;EAEf,SAAA;EAFe;EAIf,SAAA;;EAEA,QAAA,GAAW,SAAA;EAEO;EAAlB,eAAA,GAAkB,SAAA;EAEU;EAA5B,QAAA,GAAW,iBAAA;AAAA;;;;;;;;;;AAsBb;;;;;;;;;;cAAa,YAAA,EAAY,KAAA,CAAA,oBAAA,CAAA,iBAAA"}

package/dist/react-renderer/core/A2UIRenderer.d.mts

@@ -0,0 +1,40 @@
+import { ComponentRegistry } from "../registry/ComponentRegistry.mjs";
+import * as react from "react";
+import { ReactNode } from "react";
+
+//#region src/react-renderer/core/A2UIRenderer.d.ts
+interface A2UIRendererProps {
+  /** The surface ID to render */
+  surfaceId: string;
+  /** Additional CSS classes for the surface container */
+  className?: string;
+  /** Fallback content when surface is not yet available */
+  fallback?: ReactNode;
+  /** Loading fallback for lazy-loaded components */
+  loadingFallback?: ReactNode;
+  /** Optional custom component registry */
+  registry?: ComponentRegistry;
+}
+/**
+ * A2UIRenderer - renders an A2UI surface.
+ *
+ * This is the main entry point for rendering A2UI content in your React app.
+ * It reads the surface state from the A2UI store and renders the component tree.
+ *
+ * Memoized to prevent unnecessary re-renders when props haven't changed.
+ *
+ * @example
+ * ```tsx
+ * function App() {
+ *   return (
+ *     <A2UIProvider onAction={handleAction}>
+ *       <A2UIRenderer surfaceId="main" />
+ *     </A2UIProvider>
+ *   );
+ * }
+ * ```
+ */
+declare const A2UIRenderer: react.NamedExoticComponent<A2UIRendererProps>;
+//#endregion
+export { A2UIRenderer, A2UIRendererProps };
+//# sourceMappingURL=A2UIRenderer.d.mts.map

package/dist/react-renderer/core/A2UIRenderer.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"A2UIRenderer.d.mts","names":[],"sources":["../../../src/react-renderer/core/A2UIRenderer.tsx"],"mappings":";;;;;UAeiB,iBAAA;;EAEf,SAAA;EAFe;EAIf,SAAA;;EAEA,QAAA,GAAW,SAAA;EAEO;EAAlB,eAAA,GAAkB,SAAA;EAEU;EAA5B,QAAA,GAAW,iBAAA;AAAA;;;;;;;;;;AAsBb;;;;;;;;;;cAAa,YAAA,EAAY,KAAA,CAAA,oBAAA,CAAA,iBAAA"}

package/dist/react-renderer/core/A2UIViewer.cjs

@@ -0,0 +1,11 @@
+"use client";
+
+const require_runtime = require('../../_virtual/_rolldown/runtime.cjs');
+require('../theme/litTheme.cjs');
+require('./A2UIProvider.cjs');
+require('./A2UIRenderer.cjs');
+require('../registry/defaultCatalog.cjs');
+require('../styles/index.cjs');
+let react = require("react");
+react = require_runtime.__toESM(react);
+let react_jsx_runtime = require("react/jsx-runtime");

package/dist/react-renderer/core/A2UIViewer.d.cts

@@ -0,0 +1,16 @@
+import "react/jsx-runtime";
+import { Types } from "@a2ui/lit/0.8";
+
+//#region src/react-renderer/core/A2UIViewer.d.ts
+/**
+ * Action event dispatched when a user interacts with a component.
+ */
+interface A2UIActionEvent {
+  actionName: string;
+  sourceComponentId: string;
+  timestamp: string;
+  context: Record<string, unknown>;
+}
+//#endregion
+export { A2UIActionEvent };
+//# sourceMappingURL=A2UIViewer.d.cts.map

package/dist/react-renderer/core/A2UIViewer.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"A2UIViewer.d.cts","names":[],"sources":["../../../src/react-renderer/core/A2UIViewer.tsx"],"mappings":";;;;;;;UAsBiB,eAAA;EACf,UAAA;EACA,iBAAA;EACA,SAAA;EACA,OAAA,EAAS,MAAA;AAAA"}