@tambo-ai/react 0.75.0 → 1.0.0-rc.4

package/{dist/hooks/use-current-message.d.ts → esm/v1/hooks/use-tambo-current-message.d.ts}

@@ -1,6 +1,23 @@
 import React from "react";
-import { InteractableMetadata, TamboThreadMessage } from "../model/generate-component-response";
-export declare const TamboMessageContext: React.Context<TamboThreadMessage | null>;
+import type { InteractableConfig } from "../../hoc/with-tambo-interactable.js";
+import type { TamboThreadMessage } from "../types/message.js";
+/**
+ * Metadata for interactable components.
+ * Used when a component is wrapped with withTamboInteractable.
+ */
+export interface InteractableMetadata extends InteractableConfig {
+    /** Unique identifier for this interactable instance */
+    id: string;
+}
+/**
+ * Message with optional interactable metadata merged in by the provider.
+ * Used as the context type so consumers can access both the message and
+ * any interactable information attached by withTamboInteractable.
+ */
+type MessageWithMetadata = TamboThreadMessage & {
+    interactableMetadata?: InteractableMetadata;
+};
+export declare const TamboMessageContext: React.Context<MessageWithMetadata | null>;
 export interface TamboMessageProviderProps {
     children: React.ReactNode;
     message: TamboThreadMessage;
@@ -8,9 +25,9 @@ export interface TamboMessageProviderProps {
     interactableMetadata?: InteractableMetadata;
 }
 /**
- * Wraps all components, so that they can find what message they are in.
+ * Wraps all components so that they can find what message they are in.
  * Also supports optional interactable metadata for components wrapped with withInteractable.
- * @param props - props for the TamboMessageProvider
+ * @param props - Props for the TamboMessageProvider
  * @param props.children - The children to wrap
  * @param props.message - The message object
  * @param props.interactableMetadata - Optional interactable component metadata
@@ -19,7 +36,7 @@ export interface TamboMessageProviderProps {
 export declare const TamboMessageProvider: React.FC<TamboMessageProviderProps>;
 /**
  * Wraps a component with a TamboMessageProvider - this allows the provider
- * to be used outside of a TSX file
+ * to be used outside of a TSX file.
  * @param children - The children to wrap
  * @param message - The message object
  * @param interactableMetadata - Optional interactable metadata
@@ -31,7 +48,7 @@ export declare function wrapWithTamboMessageProvider(children: React.ReactNode,
  * the current message.
  * @returns The current message that is used to render the component
  */
-export declare const useTamboCurrentMessage: () => TamboThreadMessage;
+export declare const useTamboCurrentMessage: () => MessageWithMetadata;
 /**
  * Component info extracted from the current message and interactable context.
  * Provides a unified interface for accessing component metadata.
@@ -40,18 +57,21 @@ export interface TamboCurrentComponent {
     /** Component name from the message */
     componentName?: string;
     /** Component props from the message */
-    props?: Record<string, any>;
+    props?: Record<string, unknown>;
     /** Interactable ID (only present for components wrapped with withInteractable) */
     interactableId?: string;
     /** Description (only present for components wrapped with withInteractable) */
     description?: string;
-    /** Thread ID from the message (only present when the component is part of a thread) */
+    /** Thread ID (not available on messages directly) */
     threadId?: string;
 }
 /**
  * Hook to access the current component information from the message context.
  * Provides a unified interface for both AI-generated and interactable components.
  *
+ * Component info is derived from content blocks rather than
+ * top-level message fields.
+ *
  * **Use this hook when you need component metadata regardless of the context.**
  * @returns Component info including name, props, and interactable metadata if available, or null if used outside TamboMessageProvider
  * @example
@@ -71,4 +91,5 @@ export interface TamboCurrentComponent {
  * ```
  */
 export declare const useTamboCurrentComponent: () => TamboCurrentComponent | null;
-//# sourceMappingURL=use-current-message.d.ts.map
+export {};
+//# sourceMappingURL=use-tambo-current-message.d.ts.map

package/esm/v1/hooks/use-tambo-current-message.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-tambo-current-message.d.ts","sourceRoot":"","sources":["../../../src/v1/hooks/use-tambo-current-message.tsx"],"names":[],"mappings":"AACA,OAAO,KAAoC,MAAM,OAAO,CAAC;AACzD,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,mCAAmC,CAAC;AAC5E,OAAO,KAAK,EACV,kBAAkB,EAEnB,MAAM,kBAAkB,CAAC;AAE1B;;;GAGG;AACH,MAAM,WAAW,oBAAqB,SAAQ,kBAAkB;IAC9D,uDAAuD;IACvD,EAAE,EAAE,MAAM,CAAC;CACZ;AAED;;;;GAIG;AACH,KAAK,mBAAmB,GAAG,kBAAkB,GAAG;IAC9C,oBAAoB,CAAC,EAAE,oBAAoB,CAAC;CAC7C,CAAC;AAEF,eAAO,MAAM,mBAAmB,2CAE/B,CAAC;AAEF,MAAM,WAAW,yBAAyB;IACxC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,OAAO,EAAE,kBAAkB,CAAC;IAC5B,kFAAkF;IAClF,oBAAoB,CAAC,EAAE,oBAAoB,CAAC;CAC7C;AAED;;;;;;;;GAQG;AACH,eAAO,MAAM,oBAAoB,EAAE,KAAK,CAAC,EAAE,CAAC,yBAAyB,CAkBpE,CAAC;AAEF;;;;;;;GAOG;AACH,wBAAgB,4BAA4B,CAC1C,QAAQ,EAAE,KAAK,CAAC,SAAS,EACzB,OAAO,EAAE,kBAAkB,EAC3B,oBAAoB,CAAC,EAAE,oBAAoB,qBAU5C;AAED;;;;GAIG;AACH,eAAO,MAAM,sBAAsB,2BAQlC,CAAC;AAEF;;;GAGG;AACH,MAAM,WAAW,qBAAqB;IACpC,sCAAsC;IACtC,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,uCAAuC;IACvC,KAAK,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAChC,kFAAkF;IAClF,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,8EAA8E;IAC9E,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,qDAAqD;IACrD,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,eAAO,MAAM,wBAAwB,QAAO,qBAAqB,GAAG,IAsBnE,CAAC"}

package/esm/{hooks/use-current-message.js → v1/hooks/use-tambo-current-message.js}

@@ -2,9 +2,9 @@
 import React, { createContext, useContext } from "react";
 export const TamboMessageContext = createContext(null);
 /**
- * Wraps all components, so that they can find what message they are in.
+ * Wraps all components so that they can find what message they are in.
  * Also supports optional interactable metadata for components wrapped with withInteractable.
- * @param props - props for the TamboMessageProvider
+ * @param props - Props for the TamboMessageProvider
  * @param props.children - The children to wrap
  * @param props.message - The message object
  * @param props.interactableMetadata - Optional interactable component metadata
@@ -16,13 +16,13 @@ export const TamboMessageProvider = ({ children, message, interactableMetadata,
         ? { ...message, interactableMetadata }
         : message;
     // Use a unique key={...} to force a re-render when the message changes - this
-    // make sure that if the rendered component is swapped into a tree (like if
+    // makes sure that if the rendered component is swapped into a tree (like if
     // you always show the last rendered component) then the state/etc is correct
     return (React.createElement(TamboMessageContext.Provider, { value: enhancedMessage, key: message.id }, children));
 };
 /**
  * Wraps a component with a TamboMessageProvider - this allows the provider
- * to be used outside of a TSX file
+ * to be used outside of a TSX file.
  * @param children - The children to wrap
  * @param message - The message object
  * @param interactableMetadata - Optional interactable metadata
@@ -47,6 +47,9 @@ export const useTamboCurrentMessage = () => {
  * Hook to access the current component information from the message context.
  * Provides a unified interface for both AI-generated and interactable components.
  *
+ * Component info is derived from content blocks rather than
+ * top-level message fields.
+ *
  * **Use this hook when you need component metadata regardless of the context.**
  * @returns Component info including name, props, and interactable metadata if available, or null if used outside TamboMessageProvider
  * @example
@@ -70,14 +73,16 @@ export const useTamboCurrentComponent = () => {
     if (!message) {
         return null;
     }
+    // Find first component content block
+    const componentContent = message.content.find((c) => c.type === "component");
     return {
         componentName: message.interactableMetadata?.componentName ??
-            message.component?.componentName ??
+            componentContent?.name ??
             undefined,
-        props: message.component?.props,
+        props: componentContent?.props,
         interactableId: message.interactableMetadata?.id ?? undefined,
         description: message.interactableMetadata?.description ?? undefined,
-        threadId: message.threadId,
+        threadId: undefined, // Messages don't carry threadId
     };
 };
-//# sourceMappingURL=use-current-message.js.map
+//# sourceMappingURL=use-tambo-current-message.js.map

package/esm/v1/hooks/use-tambo-current-message.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-tambo-current-message.js","sourceRoot":"","sources":["../../../src/v1/hooks/use-tambo-current-message.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;AACb,OAAO,KAAK,EAAE,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAyBzD,MAAM,CAAC,MAAM,mBAAmB,GAAG,aAAa,CAC9C,IAAI,CACL,CAAC;AASF;;;;;;;;GAQG;AACH,MAAM,CAAC,MAAM,oBAAoB,GAAwC,CAAC,EACxE,QAAQ,EACR,OAAO,EACP,oBAAoB,GACrB,EAAE,EAAE;IACH,uDAAuD;IACvD,MAAM,eAAe,GAAwB,oBAAoB;QAC/D,CAAC,CAAC,EAAE,GAAG,OAAO,EAAE,oBAAoB,EAAE;QACtC,CAAC,CAAC,OAAO,CAAC;IAEZ,8EAA8E;IAC9E,4EAA4E;IAC5E,6EAA6E;IAC7E,OAAO,CACL,oBAAC,mBAAmB,CAAC,QAAQ,IAAC,KAAK,EAAE,eAAe,EAAE,GAAG,EAAE,OAAO,CAAC,EAAE,IAClE,QAAQ,CACoB,CAChC,CAAC;AACJ,CAAC,CAAC;AAEF;;;;;;;GAOG;AACH,MAAM,UAAU,4BAA4B,CAC1C,QAAyB,EACzB,OAA2B,EAC3B,oBAA2C;IAE3C,OAAO,CACL,oBAAC,oBAAoB,IACnB,OAAO,EAAE,OAAO,EAChB,oBAAoB,EAAE,oBAAoB,IAEzC,QAAQ,CACY,CACxB,CAAC;AACJ,CAAC;AAED;;;;GAIG;AACH,MAAM,CAAC,MAAM,sBAAsB,GAAG,GAAG,EAAE;IACzC,MAAM,OAAO,GAAG,UAAU,CAAC,mBAAmB,CAAC,CAAC;IAChD,IAAI,CAAC,OAAO,EAAE,CAAC;QACb,MAAM,IAAI,KAAK,CACb,mEAAmE,CACpE,CAAC;IACJ,CAAC;IACD,OAAO,OAAO,CAAC;AACjB,CAAC,CAAC;AAmBF;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,MAAM,CAAC,MAAM,wBAAwB,GAAG,GAAiC,EAAE;IACzE,MAAM,OAAO,GAAG,UAAU,CAAC,mBAAmB,CAAC,CAAC;IAEhD,IAAI,CAAC,OAAO,EAAE,CAAC;QACb,OAAO,IAAI,CAAC;IACd,CAAC;IAED,qCAAqC;IACrC,MAAM,gBAAgB,GAAG,OAAO,CAAC,OAAO,CAAC,IAAI,CAC3C,CAAC,CAAC,EAA8B,EAAE,CAAC,CAAC,CAAC,IAAI,KAAK,WAAW,CAC1D,CAAC;IAEF,OAAO;QACL,aAAa,EACX,OAAO,CAAC,oBAAoB,EAAE,aAAa;YAC3C,gBAAgB,EAAE,IAAI;YACtB,SAAS;QACX,KAAK,EAAE,gBAAgB,EAAE,KAA4C;QACrE,cAAc,EAAE,OAAO,CAAC,oBAAoB,EAAE,EAAE,IAAI,SAAS;QAC7D,WAAW,EAAE,OAAO,CAAC,oBAAoB,EAAE,WAAW,IAAI,SAAS;QACnE,QAAQ,EAAE,SAAS,EAAE,gCAAgC;KACtD,CAAC;AACJ,CAAC,CAAC","sourcesContent":["\"use client\";\nimport React, { createContext, useContext } from \"react\";\nimport type { InteractableConfig } from \"../../hoc/with-tambo-interactable\";\nimport type {\n  TamboThreadMessage,\n  TamboComponentContent,\n} from \"../types/message\";\n\n/**\n * Metadata for interactable components.\n * Used when a component is wrapped with withTamboInteractable.\n */\nexport interface InteractableMetadata extends InteractableConfig {\n  /** Unique identifier for this interactable instance */\n  id: string;\n}\n\n/**\n * Message with optional interactable metadata merged in by the provider.\n * Used as the context type so consumers can access both the message and\n * any interactable information attached by withTamboInteractable.\n */\ntype MessageWithMetadata = TamboThreadMessage & {\n  interactableMetadata?: InteractableMetadata;\n};\n\nexport const TamboMessageContext = createContext<MessageWithMetadata | null>(\n  null,\n);\n\nexport interface TamboMessageProviderProps {\n  children: React.ReactNode;\n  message: TamboThreadMessage;\n  /** Optional interactable metadata for components wrapped with withInteractable */\n  interactableMetadata?: InteractableMetadata;\n}\n\n/**\n * Wraps all components so that they can find what message they are in.\n * Also supports optional interactable metadata for components wrapped with withInteractable.\n * @param props - Props for the TamboMessageProvider\n * @param props.children - The children to wrap\n * @param props.message - The message object\n * @param props.interactableMetadata - Optional interactable component metadata\n * @returns The wrapped component\n */\nexport const TamboMessageProvider: React.FC<TamboMessageProviderProps> = ({\n  children,\n  message,\n  interactableMetadata,\n}) => {\n  // Merge interactable metadata into message if provided\n  const enhancedMessage: MessageWithMetadata = interactableMetadata\n    ? { ...message, interactableMetadata }\n    : message;\n\n  // Use a unique key={...} to force a re-render when the message changes - this\n  // makes sure that if the rendered component is swapped into a tree (like if\n  // you always show the last rendered component) then the state/etc is correct\n  return (\n    <TamboMessageContext.Provider value={enhancedMessage} key={message.id}>\n      {children}\n    </TamboMessageContext.Provider>\n  );\n};\n\n/**\n * Wraps a component with a TamboMessageProvider - this allows the provider\n * to be used outside of a TSX file.\n * @param children - The children to wrap\n * @param message - The message object\n * @param interactableMetadata - Optional interactable metadata\n * @returns The wrapped component\n */\nexport function wrapWithTamboMessageProvider(\n  children: React.ReactNode,\n  message: TamboThreadMessage,\n  interactableMetadata?: InteractableMetadata,\n) {\n  return (\n    <TamboMessageProvider\n      message={message}\n      interactableMetadata={interactableMetadata}\n    >\n      {children}\n    </TamboMessageProvider>\n  );\n}\n\n/**\n * Hook used inside a component wrapped with TamboMessageProvider, to get\n * the current message.\n * @returns The current message that is used to render the component\n */\nexport const useTamboCurrentMessage = () => {\n  const message = useContext(TamboMessageContext);\n  if (!message) {\n    throw new Error(\n      \"useTamboCurrentMessage must be used within a TamboMessageProvider\",\n    );\n  }\n  return message;\n};\n\n/**\n * Component info extracted from the current message and interactable context.\n * Provides a unified interface for accessing component metadata.\n */\nexport interface TamboCurrentComponent {\n  /** Component name from the message */\n  componentName?: string;\n  /** Component props from the message */\n  props?: Record<string, unknown>;\n  /** Interactable ID (only present for components wrapped with withInteractable) */\n  interactableId?: string;\n  /** Description (only present for components wrapped with withInteractable) */\n  description?: string;\n  /** Thread ID (not available on messages directly) */\n  threadId?: string;\n}\n\n/**\n * Hook to access the current component information from the message context.\n * Provides a unified interface for both AI-generated and interactable components.\n *\n * Component info is derived from content blocks rather than\n * top-level message fields.\n *\n * **Use this hook when you need component metadata regardless of the context.**\n * @returns Component info including name, props, and interactable metadata if available, or null if used outside TamboMessageProvider\n * @example\n * ```tsx\n * function MyInlineEditor() {\n *   const component = useTamboCurrentComponent();\n *\n *   if (!component) return null; // Not inside a component\n *\n *   return (\n *     <div>\n *       Editing: {component.componentName}\n *       {component.interactableId && <span>ID: {component.interactableId}</span>}\n *     </div>\n *   );\n * }\n * ```\n */\nexport const useTamboCurrentComponent = (): TamboCurrentComponent | null => {\n  const message = useContext(TamboMessageContext);\n\n  if (!message) {\n    return null;\n  }\n\n  // Find first component content block\n  const componentContent = message.content.find(\n    (c): c is TamboComponentContent => c.type === \"component\",\n  );\n\n  return {\n    componentName:\n      message.interactableMetadata?.componentName ??\n      componentContent?.name ??\n      undefined,\n    props: componentContent?.props as Record<string, unknown> | undefined,\n    interactableId: message.interactableMetadata?.id ?? undefined,\n    description: message.interactableMetadata?.description ?? undefined,\n    threadId: undefined, // Messages don't carry threadId\n  };\n};\n"]}

package/esm/v1/hooks/use-tambo-v1-auth-state.d.ts

@@ -1,11 +1,11 @@
-import type { TamboV1AuthState } from "../types/auth.js";
+import type { TamboAuthState } from "../types/auth.js";
 /**
- * Hook to compute the current authentication state for the v1 SDK.
+ * Hook to compute the current authentication state for the SDK.
  *
- * Reads from TamboClientContext and TamboV1ConfigContext to determine
+ * Reads from TamboClientContext and TamboConfigContext to determine
  * whether the SDK is ready to make API calls.
  * @returns The current auth state as a discriminated union
- * @throws {Error} If used outside TamboV1Provider
+ * @throws {Error} If used outside TamboProvider
  */
-export declare function useTamboV1AuthState(): TamboV1AuthState;
+export declare function useTamboAuthState(): TamboAuthState;
 //# sourceMappingURL=use-tambo-v1-auth-state.d.ts.map

package/esm/v1/hooks/use-tambo-v1-auth-state.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"use-tambo-v1-auth-state.d.ts","sourceRoot":"","sources":["../../../src/v1/hooks/use-tambo-v1-auth-state.ts"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC;AAEtD;;;;;;;GAOG;AACH,wBAAgB,mBAAmB,IAAI,gBAAgB,CAqCtD"}
+{"version":3,"file":"use-tambo-v1-auth-state.d.ts","sourceRoot":"","sources":["../../../src/v1/hooks/use-tambo-v1-auth-state.ts"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAEpD;;;;;;;GAOG;AACH,wBAAgB,iBAAiB,IAAI,cAAc,CAqClD"}

package/esm/v1/hooks/use-tambo-v1-auth-state.js

@@ -1,23 +1,23 @@
 "use client";
 import { useContext } from "react";
 import { TamboClientContext } from "../../providers/tambo-client-provider.js";
-import { TamboV1ConfigContext } from "../providers/tambo-v1-provider.js";
+import { TamboConfigContext } from "../providers/tambo-v1-provider.js";
 /**
- * Hook to compute the current authentication state for the v1 SDK.
+ * Hook to compute the current authentication state for the SDK.
  *
- * Reads from TamboClientContext and TamboV1ConfigContext to determine
+ * Reads from TamboClientContext and TamboConfigContext to determine
  * whether the SDK is ready to make API calls.
  * @returns The current auth state as a discriminated union
- * @throws {Error} If used outside TamboV1Provider
+ * @throws {Error} If used outside TamboProvider
  */
-export function useTamboV1AuthState() {
+export function useTamboAuthState() {
     const clientContext = useContext(TamboClientContext);
     if (!clientContext) {
-        throw new Error("useTamboV1AuthState must be used within TamboV1Provider");
+        throw new Error("useTamboAuthState must be used within TamboProvider");
     }
-    const config = useContext(TamboV1ConfigContext);
+    const config = useContext(TamboConfigContext);
     if (!config) {
-        throw new Error("useTamboV1AuthState must be used within TamboV1Provider");
+        throw new Error("useTamboAuthState must be used within TamboProvider");
     }
     const { tokenExchangeError, userToken, hasValidToken } = clientContext;
     const { userKey } = config;

package/esm/v1/hooks/use-tambo-v1-auth-state.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-tambo-v1-auth-state.js","sourceRoot":"","sources":["../../../src/v1/hooks/use-tambo-v1-auth-state.ts"],"names":[],"mappings":"AAAA,YAAY,CAAC;AAEb,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AACnC,OAAO,EAAE,kBAAkB,EAAE,MAAM,uCAAuC,CAAC;AAC3E,OAAO,EAAE,oBAAoB,EAAE,MAAM,gCAAgC,CAAC;AAGtE;;;;;;;GAOG;AACH,MAAM,UAAU,mBAAmB;IACjC,MAAM,aAAa,GAAG,UAAU,CAAC,kBAAkB,CAAC,CAAC;IACrD,IAAI,CAAC,aAAa,EAAE,CAAC;QACnB,MAAM,IAAI,KAAK,CAAC,yDAAyD,CAAC,CAAC;IAC7E,CAAC;IAED,MAAM,MAAM,GAAG,UAAU,CAAC,oBAAoB,CAAC,CAAC;IAChD,IAAI,CAAC,MAAM,EAAE,CAAC;QACZ,MAAM,IAAI,KAAK,CAAC,yDAAyD,CAAC,CAAC;IAC7E,CAAC;IAED,MAAM,EAAE,kBAAkB,EAAE,SAAS,EAAE,aAAa,EAAE,GAAG,aAAa,CAAC;IACvE,MAAM,EAAE,OAAO,EAAE,GAAG,MAAM,CAAC;IAE3B,+CAA+C;IAC/C,IAAI,OAAO,IAAI,SAAS,EAAE,CAAC;QACzB,OAAO,EAAE,MAAM,EAAE,SAAS,EAAE,CAAC;IAC/B,CAAC;IAED,yBAAyB;IACzB,IAAI,OAAO,EAAE,CAAC;QACZ,OAAO,EAAE,MAAM,EAAE,YAAY,EAAE,MAAM,EAAE,SAAS,EAAE,CAAC;IACrD,CAAC;IAED,2BAA2B;IAC3B,IAAI,SAAS,EAAE,CAAC;QACd,IAAI,kBAAkB,EAAE,CAAC;YACvB,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,KAAK,EAAE,kBAAkB,EAAE,CAAC;QACxD,CAAC;QACD,IAAI,aAAa,EAAE,CAAC;YAClB,OAAO,EAAE,MAAM,EAAE,YAAY,EAAE,MAAM,EAAE,eAAe,EAAE,CAAC;QAC3D,CAAC;QACD,OAAO,EAAE,MAAM,EAAE,YAAY,EAAE,CAAC;IAClC,CAAC;IAED,mBAAmB;IACnB,OAAO,EAAE,MAAM,EAAE,iBAAiB,EAAE,CAAC;AACvC,CAAC","sourcesContent":["\"use client\";\n\nimport { useContext } from \"react\";\nimport { TamboClientContext } from \"../../providers/tambo-client-provider\";\nimport { TamboV1ConfigContext } from \"../providers/tambo-v1-provider\";\nimport type { TamboV1AuthState } from \"../types/auth\";\n\n/**\n * Hook to compute the current authentication state for the v1 SDK.\n *\n * Reads from TamboClientContext and TamboV1ConfigContext to determine\n * whether the SDK is ready to make API calls.\n * @returns The current auth state as a discriminated union\n * @throws {Error} If used outside TamboV1Provider\n */\nexport function useTamboV1AuthState(): TamboV1AuthState {\n  const clientContext = useContext(TamboClientContext);\n  if (!clientContext) {\n    throw new Error(\"useTamboV1AuthState must be used within TamboV1Provider\");\n  }\n\n  const config = useContext(TamboV1ConfigContext);\n  if (!config) {\n    throw new Error(\"useTamboV1AuthState must be used within TamboV1Provider\");\n  }\n\n  const { tokenExchangeError, userToken, hasValidToken } = clientContext;\n  const { userKey } = config;\n\n  // Invalid: both userKey AND userToken provided\n  if (userKey && userToken) {\n    return { status: \"invalid\" };\n  }\n\n  // Identified via userKey\n  if (userKey) {\n    return { status: \"identified\", source: \"userKey\" };\n  }\n\n  // Token exchange scenarios\n  if (userToken) {\n    if (tokenExchangeError) {\n      return { status: \"error\", error: tokenExchangeError };\n    }\n    if (hasValidToken) {\n      return { status: \"identified\", source: \"tokenExchange\" };\n    }\n    return { status: \"exchanging\" };\n  }\n\n  // Neither provided\n  return { status: \"unauthenticated\" };\n}\n"]}
+{"version":3,"file":"use-tambo-v1-auth-state.js","sourceRoot":"","sources":["../../../src/v1/hooks/use-tambo-v1-auth-state.ts"],"names":[],"mappings":"AAAA,YAAY,CAAC;AAEb,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AACnC,OAAO,EAAE,kBAAkB,EAAE,MAAM,uCAAuC,CAAC;AAC3E,OAAO,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AAGpE;;;;;;;GAOG;AACH,MAAM,UAAU,iBAAiB;IAC/B,MAAM,aAAa,GAAG,UAAU,CAAC,kBAAkB,CAAC,CAAC;IACrD,IAAI,CAAC,aAAa,EAAE,CAAC;QACnB,MAAM,IAAI,KAAK,CAAC,qDAAqD,CAAC,CAAC;IACzE,CAAC;IAED,MAAM,MAAM,GAAG,UAAU,CAAC,kBAAkB,CAAC,CAAC;IAC9C,IAAI,CAAC,MAAM,EAAE,CAAC;QACZ,MAAM,IAAI,KAAK,CAAC,qDAAqD,CAAC,CAAC;IACzE,CAAC;IAED,MAAM,EAAE,kBAAkB,EAAE,SAAS,EAAE,aAAa,EAAE,GAAG,aAAa,CAAC;IACvE,MAAM,EAAE,OAAO,EAAE,GAAG,MAAM,CAAC;IAE3B,+CAA+C;IAC/C,IAAI,OAAO,IAAI,SAAS,EAAE,CAAC;QACzB,OAAO,EAAE,MAAM,EAAE,SAAS,EAAE,CAAC;IAC/B,CAAC;IAED,yBAAyB;IACzB,IAAI,OAAO,EAAE,CAAC;QACZ,OAAO,EAAE,MAAM,EAAE,YAAY,EAAE,MAAM,EAAE,SAAS,EAAE,CAAC;IACrD,CAAC;IAED,2BAA2B;IAC3B,IAAI,SAAS,EAAE,CAAC;QACd,IAAI,kBAAkB,EAAE,CAAC;YACvB,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,KAAK,EAAE,kBAAkB,EAAE,CAAC;QACxD,CAAC;QACD,IAAI,aAAa,EAAE,CAAC;YAClB,OAAO,EAAE,MAAM,EAAE,YAAY,EAAE,MAAM,EAAE,eAAe,EAAE,CAAC;QAC3D,CAAC;QACD,OAAO,EAAE,MAAM,EAAE,YAAY,EAAE,CAAC;IAClC,CAAC;IAED,mBAAmB;IACnB,OAAO,EAAE,MAAM,EAAE,iBAAiB,EAAE,CAAC;AACvC,CAAC","sourcesContent":["\"use client\";\n\nimport { useContext } from \"react\";\nimport { TamboClientContext } from \"../../providers/tambo-client-provider\";\nimport { TamboConfigContext } from \"../providers/tambo-v1-provider\";\nimport type { TamboAuthState } from \"../types/auth\";\n\n/**\n * Hook to compute the current authentication state for the SDK.\n *\n * Reads from TamboClientContext and TamboConfigContext to determine\n * whether the SDK is ready to make API calls.\n * @returns The current auth state as a discriminated union\n * @throws {Error} If used outside TamboProvider\n */\nexport function useTamboAuthState(): TamboAuthState {\n  const clientContext = useContext(TamboClientContext);\n  if (!clientContext) {\n    throw new Error(\"useTamboAuthState must be used within TamboProvider\");\n  }\n\n  const config = useContext(TamboConfigContext);\n  if (!config) {\n    throw new Error(\"useTamboAuthState must be used within TamboProvider\");\n  }\n\n  const { tokenExchangeError, userToken, hasValidToken } = clientContext;\n  const { userKey } = config;\n\n  // Invalid: both userKey AND userToken provided\n  if (userKey && userToken) {\n    return { status: \"invalid\" };\n  }\n\n  // Identified via userKey\n  if (userKey) {\n    return { status: \"identified\", source: \"userKey\" };\n  }\n\n  // Token exchange scenarios\n  if (userToken) {\n    if (tokenExchangeError) {\n      return { status: \"error\", error: tokenExchangeError };\n    }\n    if (hasValidToken) {\n      return { status: \"identified\", source: \"tokenExchange\" };\n    }\n    return { status: \"exchanging\" };\n  }\n\n  // Neither provided\n  return { status: \"unauthenticated\" };\n}\n"]}

package/esm/v1/hooks/use-tambo-v1-auth-state.test.js

@@ -2,8 +2,8 @@ import { renderHook } from "@testing-library/react";
 import React from "react";
 import { QueryClient } from "@tanstack/react-query";
 import { TamboClientContext } from "../../providers/tambo-client-provider.js";
-import { TamboV1ConfigContext, } from "../providers/tambo-v1-provider.js";
-import { useTamboV1AuthState } from "./use-tambo-v1-auth-state.js";
+import { TamboConfigContext, } from "../providers/tambo-v1-provider.js";
+import { useTamboAuthState } from "./use-tambo-v1-auth-state.js";
 function createWrapper(clientOverrides, configOverrides = {}) {
     const clientContext = {
         client: {},
@@ -19,13 +19,13 @@ function createWrapper(clientOverrides, configOverrides = {}) {
         ...configOverrides,
     };
     function Wrapper({ children }) {
-        return React.createElement(TamboClientContext.Provider, { value: clientContext }, React.createElement(TamboV1ConfigContext.Provider, { value: config }, children));
+        return React.createElement(TamboClientContext.Provider, { value: clientContext }, React.createElement(TamboConfigContext.Provider, { value: config }, children));
     }
     return Wrapper;
 }
-describe("useTamboV1AuthState", () => {
+describe("useTamboAuthState", () => {
     it("returns 'identified' with source 'userKey' when only userKey is provided", () => {
-        const { result } = renderHook(() => useTamboV1AuthState(), {
+        const { result } = renderHook(() => useTamboAuthState(), {
             wrapper: createWrapper({}, { userKey: "user_123" }),
         });
         expect(result.current).toEqual({
@@ -34,7 +34,7 @@ describe("useTamboV1AuthState", () => {
         });
     });
     it("returns 'identified' with source 'tokenExchange' when token exchange succeeded", () => {
-        const { result } = renderHook(() => useTamboV1AuthState(), {
+        const { result } = renderHook(() => useTamboAuthState(), {
             wrapper: createWrapper({
                 userToken: "oauth_token",
                 hasValidToken: true,
@@ -46,7 +46,7 @@ describe("useTamboV1AuthState", () => {
         });
     });
     it("returns 'exchanging' when userToken provided but exchange not yet complete", () => {
-        const { result } = renderHook(() => useTamboV1AuthState(), {
+        const { result } = renderHook(() => useTamboAuthState(), {
             wrapper: createWrapper({
                 userToken: "oauth_token",
                 hasValidToken: false,
@@ -56,7 +56,7 @@ describe("useTamboV1AuthState", () => {
     });
     it("returns 'error' when token exchange failed", () => {
         const exchangeError = new Error("Token exchange failed");
-        const { result } = renderHook(() => useTamboV1AuthState(), {
+        const { result } = renderHook(() => useTamboAuthState(), {
             wrapper: createWrapper({
                 userToken: "oauth_token",
                 tokenExchangeError: exchangeError,
@@ -69,22 +69,22 @@ describe("useTamboV1AuthState", () => {
         });
     });
     it("returns 'invalid' when both userKey and userToken are provided", () => {
-        const { result } = renderHook(() => useTamboV1AuthState(), {
+        const { result } = renderHook(() => useTamboAuthState(), {
             wrapper: createWrapper({ userToken: "oauth_token" }, { userKey: "user_123" }),
         });
         expect(result.current).toEqual({ status: "invalid" });
     });
     it("returns 'unauthenticated' when neither userKey nor userToken is provided", () => {
-        const { result } = renderHook(() => useTamboV1AuthState(), {
+        const { result } = renderHook(() => useTamboAuthState(), {
             wrapper: createWrapper({}),
         });
         expect(result.current).toEqual({ status: "unauthenticated" });
     });
     it("throws when used outside TamboClientContext", () => {
-        const wrapper = ({ children }) => React.createElement(TamboV1ConfigContext.Provider, { value: { userKey: "x" } }, children);
-        expect(() => renderHook(() => useTamboV1AuthState(), { wrapper })).toThrow("useTamboV1AuthState must be used within TamboV1Provider");
+        const wrapper = ({ children }) => React.createElement(TamboConfigContext.Provider, { value: { userKey: "x" } }, children);
+        expect(() => renderHook(() => useTamboAuthState(), { wrapper })).toThrow("useTamboAuthState must be used within TamboProvider");
     });
-    it("throws when used outside TamboV1ConfigContext", () => {
+    it("throws when used outside TamboConfigContext", () => {
         const clientContext = {
             client: {},
             queryClient: new QueryClient(),
@@ -94,7 +94,7 @@ describe("useTamboV1AuthState", () => {
             hasValidToken: false,
         };
         const wrapper = ({ children }) => React.createElement(TamboClientContext.Provider, { value: clientContext }, children);
-        expect(() => renderHook(() => useTamboV1AuthState(), { wrapper })).toThrow("useTamboV1AuthState must be used within TamboV1Provider");
+        expect(() => renderHook(() => useTamboAuthState(), { wrapper })).toThrow("useTamboAuthState must be used within TamboProvider");
     });
 });
 //# sourceMappingURL=use-tambo-v1-auth-state.test.js.map

package/esm/v1/hooks/use-tambo-v1-auth-state.test.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-tambo-v1-auth-state.test.js","sourceRoot":"","sources":["../../../src/v1/hooks/use-tambo-v1-auth-state.test.ts"],"names":[],"mappings":"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","sourcesContent":["import { renderHook } from \"@testing-library/react\";\nimport React from \"react\";\nimport { QueryClient } from \"@tanstack/react-query\";\nimport TamboAI from \"@tambo-ai/typescript-sdk\";\nimport { TamboClientContext } from \"../../providers/tambo-client-provider\";\nimport type { TamboClientContextProps } from \"../../providers/tambo-client-provider\";\nimport {\n  TamboV1ConfigContext,\n  type TamboV1Config,\n} from \"../providers/tambo-v1-provider\";\nimport { useTamboV1AuthState } from \"./use-tambo-v1-auth-state\";\n\nfunction createWrapper(\n  clientOverrides: Partial<TamboClientContextProps>,\n  configOverrides: Partial<TamboV1Config> = {},\n) {\n  const clientContext: TamboClientContextProps = {\n    client: {} as TamboAI,\n    queryClient: new QueryClient(),\n    isUpdatingToken: false,\n    tokenExchangeError: null,\n    userToken: undefined,\n    hasValidToken: false,\n    ...clientOverrides,\n  };\n\n  const config: TamboV1Config = {\n    userKey: undefined,\n    ...configOverrides,\n  };\n\n  function Wrapper({ children }: { children: React.ReactNode }) {\n    return React.createElement(\n      TamboClientContext.Provider,\n      { value: clientContext },\n      React.createElement(\n        TamboV1ConfigContext.Provider,\n        { value: config },\n        children,\n      ),\n    );\n  }\n  return Wrapper;\n}\n\ndescribe(\"useTamboV1AuthState\", () => {\n  it(\"returns 'identified' with source 'userKey' when only userKey is provided\", () => {\n    const { result } = renderHook(() => useTamboV1AuthState(), {\n      wrapper: createWrapper({}, { userKey: \"user_123\" }),\n    });\n\n    expect(result.current).toEqual({\n      status: \"identified\",\n      source: \"userKey\",\n    });\n  });\n\n  it(\"returns 'identified' with source 'tokenExchange' when token exchange succeeded\", () => {\n    const { result } = renderHook(() => useTamboV1AuthState(), {\n      wrapper: createWrapper({\n        userToken: \"oauth_token\",\n        hasValidToken: true,\n      }),\n    });\n\n    expect(result.current).toEqual({\n      status: \"identified\",\n      source: \"tokenExchange\",\n    });\n  });\n\n  it(\"returns 'exchanging' when userToken provided but exchange not yet complete\", () => {\n    const { result } = renderHook(() => useTamboV1AuthState(), {\n      wrapper: createWrapper({\n        userToken: \"oauth_token\",\n        hasValidToken: false,\n      }),\n    });\n\n    expect(result.current).toEqual({ status: \"exchanging\" });\n  });\n\n  it(\"returns 'error' when token exchange failed\", () => {\n    const exchangeError = new Error(\"Token exchange failed\");\n    const { result } = renderHook(() => useTamboV1AuthState(), {\n      wrapper: createWrapper({\n        userToken: \"oauth_token\",\n        tokenExchangeError: exchangeError,\n        hasValidToken: false,\n      }),\n    });\n\n    expect(result.current).toEqual({\n      status: \"error\",\n      error: exchangeError,\n    });\n  });\n\n  it(\"returns 'invalid' when both userKey and userToken are provided\", () => {\n    const { result } = renderHook(() => useTamboV1AuthState(), {\n      wrapper: createWrapper(\n        { userToken: \"oauth_token\" },\n        { userKey: \"user_123\" },\n      ),\n    });\n\n    expect(result.current).toEqual({ status: \"invalid\" });\n  });\n\n  it(\"returns 'unauthenticated' when neither userKey nor userToken is provided\", () => {\n    const { result } = renderHook(() => useTamboV1AuthState(), {\n      wrapper: createWrapper({}),\n    });\n\n    expect(result.current).toEqual({ status: \"unauthenticated\" });\n  });\n\n  it(\"throws when used outside TamboClientContext\", () => {\n    const wrapper = ({ children }: { children: React.ReactNode }) =>\n      React.createElement(\n        TamboV1ConfigContext.Provider,\n        { value: { userKey: \"x\" } },\n        children,\n      );\n\n    expect(() => renderHook(() => useTamboV1AuthState(), { wrapper })).toThrow(\n      \"useTamboV1AuthState must be used within TamboV1Provider\",\n    );\n  });\n\n  it(\"throws when used outside TamboV1ConfigContext\", () => {\n    const clientContext: TamboClientContextProps = {\n      client: {} as TamboAI,\n      queryClient: new QueryClient(),\n      isUpdatingToken: false,\n      tokenExchangeError: null,\n      userToken: undefined,\n      hasValidToken: false,\n    };\n\n    const wrapper = ({ children }: { children: React.ReactNode }) =>\n      React.createElement(\n        TamboClientContext.Provider,\n        { value: clientContext },\n        children,\n      );\n\n    expect(() => renderHook(() => useTamboV1AuthState(), { wrapper })).toThrow(\n      \"useTamboV1AuthState must be used within TamboV1Provider\",\n    );\n  });\n});\n"]}
+{"version":3,"file":"use-tambo-v1-auth-state.test.js","sourceRoot":"","sources":["../../../src/v1/hooks/use-tambo-v1-auth-state.test.ts"],"names":[],"mappings":"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","sourcesContent":["import { renderHook } from \"@testing-library/react\";\nimport React from \"react\";\nimport { QueryClient } from \"@tanstack/react-query\";\nimport TamboAI from \"@tambo-ai/typescript-sdk\";\nimport { TamboClientContext } from \"../../providers/tambo-client-provider\";\nimport type { TamboClientContextProps } from \"../../providers/tambo-client-provider\";\nimport {\n  TamboConfigContext,\n  type TamboConfig,\n} from \"../providers/tambo-v1-provider\";\nimport { useTamboAuthState } from \"./use-tambo-v1-auth-state\";\n\nfunction createWrapper(\n  clientOverrides: Partial<TamboClientContextProps>,\n  configOverrides: Partial<TamboConfig> = {},\n) {\n  const clientContext: TamboClientContextProps = {\n    client: {} as TamboAI,\n    queryClient: new QueryClient(),\n    isUpdatingToken: false,\n    tokenExchangeError: null,\n    userToken: undefined,\n    hasValidToken: false,\n    ...clientOverrides,\n  };\n\n  const config: TamboConfig = {\n    userKey: undefined,\n    ...configOverrides,\n  };\n\n  function Wrapper({ children }: { children: React.ReactNode }) {\n    return React.createElement(\n      TamboClientContext.Provider,\n      { value: clientContext },\n      React.createElement(\n        TamboConfigContext.Provider,\n        { value: config },\n        children,\n      ),\n    );\n  }\n  return Wrapper;\n}\n\ndescribe(\"useTamboAuthState\", () => {\n  it(\"returns 'identified' with source 'userKey' when only userKey is provided\", () => {\n    const { result } = renderHook(() => useTamboAuthState(), {\n      wrapper: createWrapper({}, { userKey: \"user_123\" }),\n    });\n\n    expect(result.current).toEqual({\n      status: \"identified\",\n      source: \"userKey\",\n    });\n  });\n\n  it(\"returns 'identified' with source 'tokenExchange' when token exchange succeeded\", () => {\n    const { result } = renderHook(() => useTamboAuthState(), {\n      wrapper: createWrapper({\n        userToken: \"oauth_token\",\n        hasValidToken: true,\n      }),\n    });\n\n    expect(result.current).toEqual({\n      status: \"identified\",\n      source: \"tokenExchange\",\n    });\n  });\n\n  it(\"returns 'exchanging' when userToken provided but exchange not yet complete\", () => {\n    const { result } = renderHook(() => useTamboAuthState(), {\n      wrapper: createWrapper({\n        userToken: \"oauth_token\",\n        hasValidToken: false,\n      }),\n    });\n\n    expect(result.current).toEqual({ status: \"exchanging\" });\n  });\n\n  it(\"returns 'error' when token exchange failed\", () => {\n    const exchangeError = new Error(\"Token exchange failed\");\n    const { result } = renderHook(() => useTamboAuthState(), {\n      wrapper: createWrapper({\n        userToken: \"oauth_token\",\n        tokenExchangeError: exchangeError,\n        hasValidToken: false,\n      }),\n    });\n\n    expect(result.current).toEqual({\n      status: \"error\",\n      error: exchangeError,\n    });\n  });\n\n  it(\"returns 'invalid' when both userKey and userToken are provided\", () => {\n    const { result } = renderHook(() => useTamboAuthState(), {\n      wrapper: createWrapper(\n        { userToken: \"oauth_token\" },\n        { userKey: \"user_123\" },\n      ),\n    });\n\n    expect(result.current).toEqual({ status: \"invalid\" });\n  });\n\n  it(\"returns 'unauthenticated' when neither userKey nor userToken is provided\", () => {\n    const { result } = renderHook(() => useTamboAuthState(), {\n      wrapper: createWrapper({}),\n    });\n\n    expect(result.current).toEqual({ status: \"unauthenticated\" });\n  });\n\n  it(\"throws when used outside TamboClientContext\", () => {\n    const wrapper = ({ children }: { children: React.ReactNode }) =>\n      React.createElement(\n        TamboConfigContext.Provider,\n        { value: { userKey: \"x\" } },\n        children,\n      );\n\n    expect(() => renderHook(() => useTamboAuthState(), { wrapper })).toThrow(\n      \"useTamboAuthState must be used within TamboProvider\",\n    );\n  });\n\n  it(\"throws when used outside TamboConfigContext\", () => {\n    const clientContext: TamboClientContextProps = {\n      client: {} as TamboAI,\n      queryClient: new QueryClient(),\n      isUpdatingToken: false,\n      tokenExchangeError: null,\n      userToken: undefined,\n      hasValidToken: false,\n    };\n\n    const wrapper = ({ children }: { children: React.ReactNode }) =>\n      React.createElement(\n        TamboClientContext.Provider,\n        { value: clientContext },\n        children,\n      );\n\n    expect(() => renderHook(() => useTamboAuthState(), { wrapper })).toThrow(\n      \"useTamboAuthState must be used within TamboProvider\",\n    );\n  });\n});\n"]}

package/esm/v1/hooks/use-tambo-v1-component-state.d.ts

@@ -1,8 +1,8 @@
 /**
- * Return type for useTamboV1ComponentState hook.
+ * Return type for useTamboComponentState hook.
  * Similar to useState but with additional metadata.
  */
-export type UseTamboV1ComponentStateReturn<S> = [
+export type UseTamboComponentStateReturn<S> = [
     currentState: S,
     setState: (newState: S | ((prev: S) => S)) => void,
     meta: {
@@ -18,7 +18,8 @@ export type UseTamboV1ComponentStateReturn<S> = [
  * to the Tambo backend. Server-side state updates are also reflected
  * in the component.
  *
- * Must be used within a component rendered via the component renderer.
+ * Can be used within rendered components, interactable components, or
+ * components awaiting provider context (acts as plain useState until context is available).
  * @param keyName - The unique key to identify this state value within the component's state
  * @param initialValue - Initial value for the state (used if no server state exists)
  * @param debounceTime - Debounce time in milliseconds (default: 500ms)
@@ -26,7 +27,7 @@ export type UseTamboV1ComponentStateReturn<S> = [
  * @example
  * ```tsx
  * function Counter() {
- *   const [count, setCount, { isPending }] = useTamboV1ComponentState('count', 0);
+ *   const [count, setCount, { isPending }] = useTamboComponentState('count', 0);
  *
  *   return (
  *     <div>
@@ -39,6 +40,6 @@ export type UseTamboV1ComponentStateReturn<S> = [
  * }
  * ```
  */
-export declare function useTamboV1ComponentState<S = undefined>(keyName: string, initialValue?: S, debounceTime?: number): UseTamboV1ComponentStateReturn<S | undefined>;
-export declare function useTamboV1ComponentState<S>(keyName: string, initialValue: S, debounceTime?: number): UseTamboV1ComponentStateReturn<S>;
+export declare function useTamboComponentState<S = undefined>(keyName: string, initialValue?: S, debounceTime?: number): UseTamboComponentStateReturn<S | undefined>;
+export declare function useTamboComponentState<S>(keyName: string, initialValue: S, debounceTime?: number): UseTamboComponentStateReturn<S>;
 //# sourceMappingURL=use-tambo-v1-component-state.d.ts.map

package/esm/v1/hooks/use-tambo-v1-component-state.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"use-tambo-v1-component-state.d.ts","sourceRoot":"","sources":["../../../src/v1/hooks/use-tambo-v1-component-state.ts"],"names":[],"mappings":"AAqBA;;;GAGG;AACH,MAAM,MAAM,8BAA8B,CAAC,CAAC,IAAI;IAC9C,YAAY,EAAE,CAAC;IACf,QAAQ,EAAE,CAAC,QAAQ,EAAE,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,KAAK,CAAC,CAAC,KAAK,IAAI;IAClD,IAAI,EAAE;QACJ,SAAS,EAAE,OAAO,CAAC;QACnB,KAAK,EAAE,KAAK,GAAG,IAAI,CAAC;QACpB,KAAK,EAAE,MAAM,IAAI,CAAC;KACnB;CACF,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AACH,wBAAgB,wBAAwB,CAAC,CAAC,GAAG,SAAS,EACpD,OAAO,EAAE,MAAM,EACf,YAAY,CAAC,EAAE,CAAC,EAChB,YAAY,CAAC,EAAE,MAAM,GACpB,8BAA8B,CAAC,CAAC,GAAG,SAAS,CAAC,CAAC;AACjD,wBAAgB,wBAAwB,CAAC,CAAC,EACxC,OAAO,EAAE,MAAM,EACf,YAAY,EAAE,CAAC,EACf,YAAY,CAAC,EAAE,MAAM,GACpB,8BAA8B,CAAC,CAAC,CAAC,CAAC"}
+{"version":3,"file":"use-tambo-v1-component-state.d.ts","sourceRoot":"","sources":["../../../src/v1/hooks/use-tambo-v1-component-state.ts"],"names":[],"mappings":"AA0BA;;;GAGG;AACH,MAAM,MAAM,4BAA4B,CAAC,CAAC,IAAI;IAC5C,YAAY,EAAE,CAAC;IACf,QAAQ,EAAE,CAAC,QAAQ,EAAE,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,KAAK,CAAC,CAAC,KAAK,IAAI;IAClD,IAAI,EAAE;QACJ,SAAS,EAAE,OAAO,CAAC;QACnB,KAAK,EAAE,KAAK,GAAG,IAAI,CAAC;QACpB,KAAK,EAAE,MAAM,IAAI,CAAC;KACnB;CACF,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AACH,wBAAgB,sBAAsB,CAAC,CAAC,GAAG,SAAS,EAClD,OAAO,EAAE,MAAM,EACf,YAAY,CAAC,EAAE,CAAC,EAChB,YAAY,CAAC,EAAE,MAAM,GACpB,4BAA4B,CAAC,CAAC,GAAG,SAAS,CAAC,CAAC;AAC/C,wBAAgB,sBAAsB,CAAC,CAAC,EACtC,OAAO,EAAE,MAAM,EACf,YAAY,EAAE,CAAC,EACf,YAAY,CAAC,EAAE,MAAM,GACpB,4BAA4B,CAAC,CAAC,CAAC,CAAC"}

package/esm/v1/hooks/use-tambo-v1-component-state.js

@@ -1,33 +1,47 @@
 "use client";
 /**
- * useTamboV1ComponentState - Component State Hook for v1 API
+ * useTamboComponentState - Component State Hook
  *
  * Provides bidirectional state synchronization between React components
  * and the Tambo backend. State changes are debounced before syncing to
  * the server, and server state updates are reflected in the component.
  *
- * Must be used within a component rendered via the component renderer.
+ * Works in three modes:
+ * - **Rendered components**: syncs state bidirectionally with the server
+ * - **Interactable components**: syncs state via the interactable provider
+ * - **No context yet**: acts as plain useState (no side effects) until a
+ *   provider wraps the component (e.g., first render before withTamboInteractable)
  */
 import { useCallback, useEffect, useState, useRef } from "react";
 import { useDebouncedCallback } from "use-debounce";
 import { deepEqual } from "fast-equals";
 import { useTamboClient } from "../../providers/tambo-client-provider.js";
 import { useTamboInteractable } from "../../providers/tambo-interactable-provider.js";
-import { useV1ComponentContent } from "../utils/component-renderer.js";
+import { useComponentContentOptional } from "../utils/component-renderer.js";
+import { useTamboConfig } from "../providers/tambo-v1-provider.js";
 import { useStreamState } from "../providers/tambo-v1-stream-context.js";
 import { findComponentContent } from "../utils/thread-utils.js";
-export function useTamboV1ComponentState(keyName, initialValue, debounceTime = 500) {
+export function useTamboComponentState(keyName, initialValue, debounceTime = 500) {
     const client = useTamboClient();
-    const { componentId, threadId } = useV1ComponentContent();
+    const { userKey } = useTamboConfig();
+    const componentContent = useComponentContentOptional();
     const streamState = useStreamState();
     const { setInteractableState, getInteractableComponentState } = useTamboInteractable();
-    // Interactable components use threadId="" (set by withTamboInteractable)
-    const isInteractable = threadId === "";
-    // Find the component content to get server state (only for v1-rendered components)
-    const componentContent = isInteractable
+    // componentContent is null on the first render of interactable components
+    // (before withTamboInteractable sets the interactableId and wraps with provider).
+    // When null, we act as plain useState with no side effects.
+    const isContextAvailable = componentContent !== null;
+    const componentId = componentContent?.componentId ?? "";
+    const threadId = componentContent?.threadId ?? "";
+    // Only treat as interactable when we have real context with threadId=""
+    // (set by withTamboInteractable). When context is missing entirely,
+    // neither interactable nor server-sync paths should run.
+    const isInteractable = isContextAvailable && threadId === "";
+    // Find the component content to get server state (only for rendered components)
+    const renderedContent = isInteractable
         ? undefined
         : findComponentContent(streamState, threadId, componentId);
-    const serverState = componentContent?.state;
+    const serverState = renderedContent?.state;
     const serverValue = serverState?.[keyName];
     // For interactable components, read state from the interactable provider
     const interactableState = isInteractable
@@ -44,9 +58,9 @@ export function useTamboV1ComponentState(keyName, initialValue, debounceTime = 5
     const hasPendingLocalChangeRef = useRef(false);
     // Track in-flight sync requests to avoid stale completions clearing pending state
     const syncSeqRef = useRef(0);
-    // Debounced function to sync state to server (only used for v1-rendered components)
+    // Debounced function to sync state to server (only used for rendered components)
     const syncToServer = useDebouncedCallback(async (newState) => {
-        if (isInteractable)
+        if (!isContextAvailable || isInteractable)
             return;
         const seq = ++syncSeqRef.current;
         setIsPending(true);
@@ -56,6 +70,7 @@ export function useTamboV1ComponentState(keyName, initialValue, debounceTime = 5
             await client.threads.state.updateState(componentId, {
                 threadId,
                 state: { [keyName]: newState },
+                userKey,
             });
             // Clear pending flag after successful sync
             hasPendingLocalChangeRef.current = false;
@@ -65,7 +80,7 @@ export function useTamboV1ComponentState(keyName, initialValue, debounceTime = 5
             hasPendingLocalChangeRef.current = false;
             const syncError = err instanceof Error ? err : new Error(String(err));
             setError(syncError);
-            console.error(`[useTamboV1ComponentState] Failed to sync state for ${componentId}:`, syncError);
+            console.error(`[useTamboComponentState] Failed to sync state for ${componentId}:`, syncError);
         }
         finally {
             // Only clear isPending if this is the most recent request
@@ -80,18 +95,29 @@ export function useTamboV1ComponentState(keyName, initialValue, debounceTime = 5
             const nextState = typeof newState === "function"
                 ? newState(prev)
                 : newState;
+            // No side effects when context isn't available yet (local-only update)
+            if (!isContextAvailable) {
+                return nextState;
+            }
             if (isInteractable) {
                 // For interactable components, update the interactable provider's state
                 setInteractableState(componentId, keyName, nextState);
             }
             else {
-                // For v1-rendered components, trigger debounced sync to server
+                // For rendered components, trigger debounced sync to server
                 hasPendingLocalChangeRef.current = true;
                 void syncToServer(nextState);
             }
             return nextState;
         });
-    }, [isInteractable, syncToServer, setInteractableState, componentId, keyName]);
+    }, [
+        isContextAvailable,
+        isInteractable,
+        syncToServer,
+        setInteractableState,
+        componentId,
+        keyName,
+    ]);
     // Set initial value in interactable state on mount if no existing state
     const existingInteractableState = isInteractable
         ? getInteractableComponentState(componentId)?.[keyName]
@@ -118,9 +144,9 @@ export function useTamboV1ComponentState(keyName, initialValue, debounceTime = 5
             return;
         setLocalState((prev) => deepEqual(prev, interactableState) ? prev : interactableState);
     }, [isInteractable, interactableState]);
-    // Sync from server state when it changes (e.g., from streaming events) - v1-rendered only
+    // Sync from server state when it changes (e.g., from streaming events) - rendered components only
     useEffect(() => {
-        if (isInteractable)
+        if (!isContextAvailable || isInteractable)
             return;
         if (serverValue === undefined)
             return;
@@ -135,21 +161,21 @@ export function useTamboV1ComponentState(keyName, initialValue, debounceTime = 5
         }
         // Use functional update to avoid localState in deps
         setLocalState((prev) => deepEqual(serverValue, prev) ? prev : serverValue);
-    }, [isInteractable, serverValue]);
-    // Flush pending updates on unmount (only for v1-rendered components)
+    }, [isContextAvailable, isInteractable, serverValue]);
+    // Flush pending updates on unmount (only for rendered components)
     useEffect(() => {
-        if (isInteractable)
+        if (!isContextAvailable || isInteractable)
             return;
         return () => {
             void syncToServer.flush();
         };
-    }, [isInteractable, syncToServer]);
-    // Flush function for immediate sync (noop for interactable)
+    }, [isContextAvailable, isInteractable, syncToServer]);
+    // Flush function for immediate sync (noop when context is unavailable or interactable)
     const flush = useCallback(() => {
-        if (isInteractable)
+        if (!isContextAvailable || isInteractable)
             return;
         void syncToServer.flush();
-    }, [isInteractable, syncToServer]);
+    }, [isContextAvailable, isInteractable, syncToServer]);
     return [localState, setState, { isPending, error, flush }];
 }
 //# sourceMappingURL=use-tambo-v1-component-state.js.map