@plucky-ai/react 0.2.1 → 0.3.1

package/README.md

@@ -1,6 +1,6 @@
 # @plucky-ai/react
 
-A React hook for using the Plucky Chat SDK.
+A React hook for using the Plucky Chat SDK. Access the full docs [here](https://docs.plucky.ai).
 
 ## Installation
 
@@ -14,12 +14,27 @@ pnpm add @plucky-ai/react
 
 ## Usage
 
-```typescript
-import { useChat } from '@plucky-ai/react'
+```tsx
+import { useTools } from '@plucky-ai/react'
 
-const { sendMessage } = useChat({
-  appId: '123',
-})
+function MyComponent(props: { temperature: number }) {
+  useTools({
+    context: {
+      temperature,
+    },
+    tools: [
+      {
+        name: 'get_current_weather',
+        description: 'Get the current weather',
+        defaultLoadingText: 'Checking the weather...',
+        defaultSuccessText: 'Weather retrieved.',
+        cb: async (_, { temperature }) => {
+          return `It's currently ${temperature} degrees.`
+        },
+      },
+    ],
+  })
 
-sendMessage('Hello, world!')
+  return <div>My component content here</div>
+}
 ```

package/dist/index.cjs

@@ -26,25 +26,36 @@ __plucky_ai_chat_sdk = __toESM(__plucky_ai_chat_sdk);
 let react = require("react");
 react = __toESM(react);
 
-//#region src/hooks/useChat.ts
-function useChat(params) {
-	const { tools,...rest } = params;
+//#region src/hooks/useTools.ts
+function useLatest(value) {
+	const ref = (0, react.useRef)(value);
 	(0, react.useEffect)(() => {
-		(0, __plucky_ai_chat_sdk.init)({ ...rest });
-	}, [rest]);
+		ref.current = value;
+	}, [value]);
+	return ref;
+}
+function useTools(params) {
+	const contextRef = useLatest(params.context);
+	const { tools } = params;
+	const wrappedTools = (0, react.useMemo)(() => tools.map((tool) => {
+		const originalCb = tool.cb;
+		return {
+			...tool,
+			cb: async (input) => {
+				if (!contextRef.current) return "Tool not yet loaded.";
+				return originalCb(input, contextRef.current);
+			}
+		};
+	}), [tools, contextRef]);
 	(0, react.useEffect)(() => {
 		if (!tools || tools.length === 0) return;
-		const api = (0, __plucky_ai_chat_sdk.getAPI)();
-		api.registerManyTools(tools);
+		(0, __plucky_ai_chat_sdk.addTools)(wrappedTools);
 		return () => {
-			tools.forEach((tool) => api.removeTool(tool.name));
+			(0, __plucky_ai_chat_sdk.removeTools)(wrappedTools.map((tool) => tool.name));
 		};
-	}, [tools]);
-	return { sendMessage: (message) => {
-		(0, __plucky_ai_chat_sdk.getAPI)().sendMessage({ content: message });
-	} };
+	}, [wrappedTools]);
 }
 
 //#endregion
-exports.useChat = useChat;
+exports.useTools = useTools;
 //# sourceMappingURL=index.cjs.map

package/dist/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","names":[],"sources":["../src/hooks/useChat.ts"],"sourcesContent":["import { getAPI, init } from '@plucky-ai/chat-sdk'\nimport { useEffect } from 'react'\n\nexport function useChat(params: Parameters<typeof init>[0]) {\n  const { tools, ...rest } = params\n\n  useEffect(() => {\n    init({\n      ...rest,\n    })\n  }, [rest])\n  useEffect(() => {\n    if (!tools || tools.length === 0) return\n    const api = getAPI()\n    api.registerManyTools(tools)\n    return () => {\n      tools.forEach((tool) => api.removeTool(tool.name))\n    }\n  }, [tools])\n  return {\n    sendMessage: (message: string) => {\n      getAPI().sendMessage({\n        content: message,\n      })\n    },\n  }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAGA,SAAgB,QAAQ,QAAoC;CAC1D,MAAM,EAAE,MAAO,GAAG,SAAS;AAE3B,4BAAgB;AACd,iCAAK,EACH,GAAG,MACJ,CAAC;IACD,CAAC,KAAK,CAAC;AACV,4BAAgB;AACd,MAAI,CAAC,SAAS,MAAM,WAAW,EAAG;EAClC,MAAM,wCAAc;AACpB,MAAI,kBAAkB,MAAM;AAC5B,eAAa;AACX,SAAM,SAAS,SAAS,IAAI,WAAW,KAAK,KAAK,CAAC;;IAEnD,CAAC,MAAM,CAAC;AACX,QAAO,EACL,cAAc,YAAoB;AAChC,oCAAQ,CAAC,YAAY,EACnB,SAAS,SACV,CAAC;IAEL"}
+{"version":3,"file":"index.cjs","names":[],"sources":["../src/hooks/useTools.ts"],"sourcesContent":["import { UseToolsParams } from '@/types'\nimport { addTools, removeTools } from '@plucky-ai/chat-sdk'\nimport { useEffect, useMemo, useRef } from 'react'\nfunction useLatest<T>(value: T) {\n  const ref = useRef(value)\n  useEffect(() => {\n    ref.current = value\n  }, [value])\n  return ref\n}\n\nexport function useTools<TContext = Record<string, unknown>>(\n  params: UseToolsParams<TContext>,\n) {\n  const contextRef = useLatest(params.context)\n\n  const { tools } = params\n  const wrappedTools = useMemo(\n    () =>\n      tools.map((tool) => {\n        const originalCb = tool.cb\n        return {\n          ...tool,\n          cb: async (input: Record<string, unknown>) => {\n            if (!contextRef.current) return 'Tool not yet loaded.'\n            return originalCb(input, contextRef.current)\n          },\n        }\n      }),\n    [tools, contextRef],\n  )\n\n  useEffect(() => {\n    if (!tools || tools.length === 0) return\n    addTools(wrappedTools)\n    return () => {\n      removeTools(wrappedTools.map((tool) => tool.name))\n    }\n  }, [wrappedTools])\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAGA,SAAS,UAAa,OAAU;CAC9B,MAAM,wBAAa,MAAM;AACzB,4BAAgB;AACd,MAAI,UAAU;IACb,CAAC,MAAM,CAAC;AACX,QAAO;;AAGT,SAAgB,SACd,QACA;CACA,MAAM,aAAa,UAAU,OAAO,QAAQ;CAE5C,MAAM,EAAE,UAAU;CAClB,MAAM,wCAEF,MAAM,KAAK,SAAS;EAClB,MAAM,aAAa,KAAK;AACxB,SAAO;GACL,GAAG;GACH,IAAI,OAAO,UAAmC;AAC5C,QAAI,CAAC,WAAW,QAAS,QAAO;AAChC,WAAO,WAAW,OAAO,WAAW,QAAQ;;GAE/C;GACD,EACJ,CAAC,OAAO,WAAW,CACpB;AAED,4BAAgB;AACd,MAAI,CAAC,SAAS,MAAM,WAAW,EAAG;AAClC,qCAAS,aAAa;AACtB,eAAa;AACX,yCAAY,aAAa,KAAK,SAAS,KAAK,KAAK,CAAC;;IAEnD,CAAC,aAAa,CAAC"}

package/dist/index.d.cts

@@ -1,10 +1,5 @@
-import { ToolConfig, init } from "@plucky-ai/chat-sdk";
+import { ToolConfig } from "@plucky-ai/chat-sdk";
 
-//#region src/hooks/useChat.d.ts
-declare function useChat(params: Parameters<typeof init>[0]): {
-  sendMessage: (message: string) => void;
-};
-//#endregion
 //#region src/types.d.ts
 type UseChatParams = {
   appId: string;
@@ -15,6 +10,15 @@ type UseChatParams = {
   tools?: ToolConfig[];
   tags?: string[];
 };
+type UseToolsParams<TContext = Record<string, unknown>> = {
+  context?: TContext;
+  tools: Array<Omit<ToolConfig, 'cb'> & {
+    cb: (input: Record<string, unknown>, context: TContext) => Promise<string> | string;
+  }>;
+};
+//#endregion
+//#region src/hooks/useTools.d.ts
+declare function useTools<TContext = Record<string, unknown>>(params: UseToolsParams<TContext>): void;
 //#endregion
-export { UseChatParams, useChat };
+export { UseChatParams, UseToolsParams, useTools };
 //# sourceMappingURL=index.d.cts.map

package/dist/index.d.ts

@@ -1,10 +1,5 @@
-import { ToolConfig, init } from "@plucky-ai/chat-sdk";
+import { ToolConfig } from "@plucky-ai/chat-sdk";
 
-//#region src/hooks/useChat.d.ts
-declare function useChat(params: Parameters<typeof init>[0]): {
-  sendMessage: (message: string) => void;
-};
-//#endregion
 //#region src/types.d.ts
 type UseChatParams = {
   appId: string;
@@ -15,6 +10,15 @@ type UseChatParams = {
   tools?: ToolConfig[];
   tags?: string[];
 };
+type UseToolsParams<TContext = Record<string, unknown>> = {
+  context?: TContext;
+  tools: Array<Omit<ToolConfig, 'cb'> & {
+    cb: (input: Record<string, unknown>, context: TContext) => Promise<string> | string;
+  }>;
+};
+//#endregion
+//#region src/hooks/useTools.d.ts
+declare function useTools<TContext = Record<string, unknown>>(params: UseToolsParams<TContext>): void;
 //#endregion
-export { UseChatParams, useChat };
+export { UseChatParams, UseToolsParams, useTools };
 //# sourceMappingURL=index.d.ts.map

package/dist/index.js

@@ -1,25 +1,36 @@
-import { getAPI, init } from "@plucky-ai/chat-sdk";
-import { useEffect } from "react";
+import { addTools, removeTools } from "@plucky-ai/chat-sdk";
+import { useEffect, useMemo, useRef } from "react";
 
-//#region src/hooks/useChat.ts
-function useChat(params) {
-	const { tools,...rest } = params;
+//#region src/hooks/useTools.ts
+function useLatest(value) {
+	const ref = useRef(value);
 	useEffect(() => {
-		init({ ...rest });
-	}, [rest]);
+		ref.current = value;
+	}, [value]);
+	return ref;
+}
+function useTools(params) {
+	const contextRef = useLatest(params.context);
+	const { tools } = params;
+	const wrappedTools = useMemo(() => tools.map((tool) => {
+		const originalCb = tool.cb;
+		return {
+			...tool,
+			cb: async (input) => {
+				if (!contextRef.current) return "Tool not yet loaded.";
+				return originalCb(input, contextRef.current);
+			}
+		};
+	}), [tools, contextRef]);
 	useEffect(() => {
 		if (!tools || tools.length === 0) return;
-		const api = getAPI();
-		api.registerManyTools(tools);
+		addTools(wrappedTools);
 		return () => {
-			tools.forEach((tool) => api.removeTool(tool.name));
+			removeTools(wrappedTools.map((tool) => tool.name));
 		};
-	}, [tools]);
-	return { sendMessage: (message) => {
-		getAPI().sendMessage({ content: message });
-	} };
+	}, [wrappedTools]);
 }
 
 //#endregion
-export { useChat };
+export { useTools };
 //# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../src/hooks/useChat.ts"],"sourcesContent":["import { getAPI, init } from '@plucky-ai/chat-sdk'\nimport { useEffect } from 'react'\n\nexport function useChat(params: Parameters<typeof init>[0]) {\n  const { tools, ...rest } = params\n\n  useEffect(() => {\n    init({\n      ...rest,\n    })\n  }, [rest])\n  useEffect(() => {\n    if (!tools || tools.length === 0) return\n    const api = getAPI()\n    api.registerManyTools(tools)\n    return () => {\n      tools.forEach((tool) => api.removeTool(tool.name))\n    }\n  }, [tools])\n  return {\n    sendMessage: (message: string) => {\n      getAPI().sendMessage({\n        content: message,\n      })\n    },\n  }\n}\n"],"mappings":";;;;AAGA,SAAgB,QAAQ,QAAoC;CAC1D,MAAM,EAAE,MAAO,GAAG,SAAS;AAE3B,iBAAgB;AACd,OAAK,EACH,GAAG,MACJ,CAAC;IACD,CAAC,KAAK,CAAC;AACV,iBAAgB;AACd,MAAI,CAAC,SAAS,MAAM,WAAW,EAAG;EAClC,MAAM,MAAM,QAAQ;AACpB,MAAI,kBAAkB,MAAM;AAC5B,eAAa;AACX,SAAM,SAAS,SAAS,IAAI,WAAW,KAAK,KAAK,CAAC;;IAEnD,CAAC,MAAM,CAAC;AACX,QAAO,EACL,cAAc,YAAoB;AAChC,UAAQ,CAAC,YAAY,EACnB,SAAS,SACV,CAAC;IAEL"}
+{"version":3,"file":"index.js","names":[],"sources":["../src/hooks/useTools.ts"],"sourcesContent":["import { UseToolsParams } from '@/types'\nimport { addTools, removeTools } from '@plucky-ai/chat-sdk'\nimport { useEffect, useMemo, useRef } from 'react'\nfunction useLatest<T>(value: T) {\n  const ref = useRef(value)\n  useEffect(() => {\n    ref.current = value\n  }, [value])\n  return ref\n}\n\nexport function useTools<TContext = Record<string, unknown>>(\n  params: UseToolsParams<TContext>,\n) {\n  const contextRef = useLatest(params.context)\n\n  const { tools } = params\n  const wrappedTools = useMemo(\n    () =>\n      tools.map((tool) => {\n        const originalCb = tool.cb\n        return {\n          ...tool,\n          cb: async (input: Record<string, unknown>) => {\n            if (!contextRef.current) return 'Tool not yet loaded.'\n            return originalCb(input, contextRef.current)\n          },\n        }\n      }),\n    [tools, contextRef],\n  )\n\n  useEffect(() => {\n    if (!tools || tools.length === 0) return\n    addTools(wrappedTools)\n    return () => {\n      removeTools(wrappedTools.map((tool) => tool.name))\n    }\n  }, [wrappedTools])\n}\n"],"mappings":";;;;AAGA,SAAS,UAAa,OAAU;CAC9B,MAAM,MAAM,OAAO,MAAM;AACzB,iBAAgB;AACd,MAAI,UAAU;IACb,CAAC,MAAM,CAAC;AACX,QAAO;;AAGT,SAAgB,SACd,QACA;CACA,MAAM,aAAa,UAAU,OAAO,QAAQ;CAE5C,MAAM,EAAE,UAAU;CAClB,MAAM,eAAe,cAEjB,MAAM,KAAK,SAAS;EAClB,MAAM,aAAa,KAAK;AACxB,SAAO;GACL,GAAG;GACH,IAAI,OAAO,UAAmC;AAC5C,QAAI,CAAC,WAAW,QAAS,QAAO;AAChC,WAAO,WAAW,OAAO,WAAW,QAAQ;;GAE/C;GACD,EACJ,CAAC,OAAO,WAAW,CACpB;AAED,iBAAgB;AACd,MAAI,CAAC,SAAS,MAAM,WAAW,EAAG;AAClC,WAAS,aAAa;AACtB,eAAa;AACX,eAAY,aAAa,KAAK,SAAS,KAAK,KAAK,CAAC;;IAEnD,CAAC,aAAa,CAAC"}

package/dist/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@plucky-ai/react",
-  "version": "0.2.1",
+  "version": "0.3.1",
   "type": "module",
   "main": "./index.cjs",
   "module": "./index.js",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@plucky-ai/react",
-  "version": "0.2.1",
+  "version": "0.3.1",
   "type": "module",
   "main": "./dist/index.cjs",
   "module": "./dist/index.js",
@@ -13,15 +13,15 @@
     }
   },
   "dependencies": {
-    "react": "19.1.1",
+    "react": "19.2.1",
     "zod": "^4.1.11",
-    "@plucky-ai/chat-sdk": "^0.2.1"
+    "@plucky-ai/chat-sdk": "^0.3.1"
   },
   "devDependencies": {
     "@types/react": "19.1.13",
-    "tsdown": "^0.15.9",
-    "tsx": "^4.20.5",
-    "typescript": "^5.9.2"
+    "tsdown": "^0.15.12",
+    "tsx": "^4.20.6",
+    "typescript": "^5.9.3"
   },
   "publishConfig": {
     "access": "public",