@onedeskpro/chatbot-react 0.2.1 → 0.3.0

package/README.md

@@ -89,7 +89,7 @@ function SupportPanel() {
 
 | Field | Description |
 | --- | --- |
-| `messages` | The conversation. `message.type` is `'human'` (the visitor), `'ai'`, or `'agent'` (a human agent). |
+| `messages` | The conversation. `message.type` is `'human'` (the visitor), `'ai'`, or `'agent'` (a human agent). A media message carries `message.attachments` (`type`, `url`, `fileName`, `size`). |
 | `isOpen`, `isLoading`, `isReady` | Panel visibility, a request in flight, and whether the agent can answer. |
 | `needsIdentify` | `true` until the visitor has identified. `sendMessage` rejects while it is. |
 | `visitorToken`, `visitorName` | The identified visitor, or `null`. |
@@ -97,6 +97,8 @@ function SupportPanel() {
 | `blockReason`, `error` | Why the agent cannot answer (for example `server-unavailable` or `no-credits`), and the last error message. |
 | `submitIdentify({ name, phone, email? })` | Identifies the visitor and unlocks the chat. |
 | `sendMessage(text)` | Sends a message. |
+| `sendAttachments(files, text?)` | Sends up to 10 files (10 MB each) as one media message, with `text` as the caption. The message appears with `pending: true` and local previews until the uploads finish. |
+| `sendVoice(recording)` | Sends a voice note recorded with `VoiceRecorder` from `@onedeskpro/chatbot-core`. |
 | `requestHuman()` | Escalates to a human agent. Does nothing unless `mode` is `'ai'` and a conversation has started. |
 | `resetSession()` | Clears a `closed` conversation. Does nothing in any other mode. |
 | `open()`, `close()`, `toggle()` | Control the built-in widget's panel. |

package/dist/index.cjs

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e=Object.create,t=Object.defineProperty,n=Object.getOwnPropertyDescriptor,r=Object.getOwnPropertyNames,i=Object.getPrototypeOf,a=Object.prototype.hasOwnProperty,o=(e,i,o,s)=>{if(i&&typeof i==`object`||typeof i==`function`)for(var c=r(i),l=0,u=c.length,d;l<u;l++)d=c[l],!a.call(e,d)&&d!==o&&t(e,d,{get:(e=>i[e]).bind(null,d),enumerable:!(s=n(i,d))||s.enumerable});return e},s=(n,r,s)=>(s=n==null?{}:e(i(n)),o(r||!n||!n.__esModule||!a.call(n,`default`)?t(s,`default`,{value:n,enumerable:!0}):s,n));let c=require("react");c=s(c,1);let l=require("@onedeskpro/chatbot-core"),u=require("react/jsx-runtime");var d=(0,c.createContext)(null);function f(){let e=(0,c.useContext)(d);if(!e)throw Error(`useChatbot must be used inside <ChatbotProvider>.`);return e}function p({children:e,...t}){let n=(0,c.useRef)(null);return n.current||=new l.ChatbotCore,(0,c.useEffect)(()=>{let e=n.current;return e.init(t).catch(e=>{console.error(`[onedeskpro-chatbot] Failed to initialise:`,e)}),()=>e.destroy()},[]),(0,u.jsx)(d.Provider,{value:n.current,children:e})}function m(){let e=f(),[t,n]=(0,c.useState)(()=>e.getState());(0,c.useEffect)(()=>{let t=e.on(`state-change`,e=>n({...e}));return n({...e.getState()}),t},[e]);let r=(0,c.useCallback)(t=>e.sendMessage(t),[e]),i=(0,c.useCallback)(t=>e.submitIdentify(t),[e]),a=(0,c.useCallback)(()=>e.requestHuman(),[e]),o=(0,c.useCallback)(()=>e.open(),[e]),s=(0,c.useCallback)(()=>e.close(),[e]),l=(0,c.useCallback)(()=>e.toggle(),[e]),u=(0,c.useCallback)(()=>e.resetSession(),[e]);return{messages:t.messages,isOpen:t.isOpen,isLoading:t.isLoading,isReady:t.isReady,needsIdentify:t.needsIdentify,blockReason:t.blockReason,error:t.error,visitorToken:t.visitorToken,visitorName:t.visitorName,mode:t.mode,sessionId:t.visitorToken,sendMessage:r,submitIdentify:i,requestHuman:a,open:o,close:s,toggle:l,resetSession:u}}function h(){let e=f();return(0,c.useEffect)(()=>{},[e]),(0,u.jsx)(`div`,{style:{display:`none`},"aria-hidden":`true`})}function g({renderLauncher:e,renderWindow:t}){let{isOpen:n,toggle:r,open:i,close:a,messages:o,sendMessage:s,isLoading:c,error:l}=m();return(0,u.jsxs)(u.Fragment,{children:[e({isOpen:n,toggle:r,open:i,close:a}),t({isOpen:n,messages:o,sendMessage:s,isLoading:c,error:l,close:a})]})}exports.ChatbotContext=d,exports.ChatbotHeadless=g,exports.ChatbotProvider=p,exports.ChatbotWidget=h,exports.useChatbot=m;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e=Object.create,t=Object.defineProperty,n=Object.getOwnPropertyDescriptor,r=Object.getOwnPropertyNames,i=Object.getPrototypeOf,a=Object.prototype.hasOwnProperty,o=(e,i,o,s)=>{if(i&&typeof i==`object`||typeof i==`function`)for(var c=r(i),l=0,u=c.length,d;l<u;l++)d=c[l],!a.call(e,d)&&d!==o&&t(e,d,{get:(e=>i[e]).bind(null,d),enumerable:!(s=n(i,d))||s.enumerable});return e},s=(n,r,s)=>(s=n==null?{}:e(i(n)),o(r||!n||!n.__esModule||!a.call(n,`default`)?t(s,`default`,{value:n,enumerable:!0}):s,n));let c=require("react");c=s(c,1);let l=require("@onedeskpro/chatbot-core"),u=require("react/jsx-runtime");var d=(0,c.createContext)(null);function f(){let e=(0,c.useContext)(d);if(!e)throw Error(`useChatbot must be used inside <ChatbotProvider>.`);return e}function p({children:e,...t}){let n=(0,c.useRef)(null);return n.current||=new l.ChatbotCore,(0,c.useEffect)(()=>{let e=n.current;return e.init(t).catch(e=>{console.error(`[onedeskpro-chatbot] Failed to initialise:`,e)}),()=>e.destroy()},[]),(0,u.jsx)(d.Provider,{value:n.current,children:e})}function m(){let e=f(),[t,n]=(0,c.useState)(()=>e.getState());(0,c.useEffect)(()=>{let t=e.on(`state-change`,e=>n({...e}));return n({...e.getState()}),t},[e]);let r=(0,c.useCallback)(t=>e.sendMessage(t),[e]),i=(0,c.useCallback)((t,n)=>e.sendAttachments(t,n),[e]),a=(0,c.useCallback)(t=>e.sendVoice(t),[e]),o=(0,c.useCallback)(t=>e.submitIdentify(t),[e]),s=(0,c.useCallback)(()=>e.requestHuman(),[e]),l=(0,c.useCallback)(()=>e.open(),[e]),u=(0,c.useCallback)(()=>e.close(),[e]),d=(0,c.useCallback)(()=>e.toggle(),[e]),p=(0,c.useCallback)(()=>e.resetSession(),[e]);return{messages:t.messages,isOpen:t.isOpen,isLoading:t.isLoading,isReady:t.isReady,needsIdentify:t.needsIdentify,blockReason:t.blockReason,error:t.error,visitorToken:t.visitorToken,visitorName:t.visitorName,mode:t.mode,sessionId:t.visitorToken,sendMessage:r,sendAttachments:i,sendVoice:a,submitIdentify:o,requestHuman:s,open:l,close:u,toggle:d,resetSession:p}}function h(){let e=f();return(0,c.useEffect)(()=>{},[e]),(0,u.jsx)(`div`,{style:{display:`none`},"aria-hidden":`true`})}function g({renderLauncher:e,renderWindow:t}){let{isOpen:n,toggle:r,open:i,close:a,messages:o,sendMessage:s,sendAttachments:c,isLoading:l,error:d}=m();return(0,u.jsxs)(u.Fragment,{children:[e({isOpen:n,toggle:r,open:i,close:a}),t({isOpen:n,messages:o,sendMessage:s,sendAttachments:c,isLoading:l,error:d,close:a})]})}exports.ChatbotContext=d,exports.ChatbotHeadless=g,exports.ChatbotProvider=p,exports.ChatbotWidget=h,exports.useChatbot=m;

package/dist/index.d.cts

@@ -1,3 +1,4 @@
+import { ChatAttachment } from '@onedeskpro/chatbot-types';
 import { ChatbotBlockReason } from '@onedeskpro/chatbot-types';
 import { ChatbotCore } from '@onedeskpro/chatbot-core';
 import { ChatbotEventMap } from '@onedeskpro/chatbot-types';
@@ -9,6 +10,9 @@ import { Context } from 'react';
 import { default as default_2 } from 'react';
 import { ReactNode } from 'react';
 import { TicketStatusData } from '@onedeskpro/chatbot-types';
+import { VoiceRecording } from '@onedeskpro/chatbot-types';
+
+export { ChatAttachment }
 
 export declare const ChatbotContext: Context<ChatbotCore | null>;
 
@@ -31,6 +35,7 @@ export declare interface ChatbotHeadlessProps {
         isOpen: boolean;
         messages: ReturnType<typeof useChatbot>['messages'];
         sendMessage: (text: string) => Promise<void>;
+        sendAttachments: (files: File[], text?: string) => Promise<void>;
         isLoading: boolean;
         error: string | null;
         close: () => void;
@@ -77,6 +82,13 @@ export declare interface UseChatbotReturn {
     /** @deprecated Use visitorToken. */
     sessionId: string | null;
     sendMessage: (text: string) => Promise<void>;
+    /**
+     * Sends files as one media message, with `text` as the caption. The message shows
+     * up in `messages` with `pending: true` and local previews until the uploads land.
+     */
+    sendAttachments: (files: File[], text?: string) => Promise<void>;
+    /** Sends a recorded voice note (record one with `VoiceRecorder` from `@onedeskpro/chatbot-core`). */
+    sendVoice: (recording: VoiceRecording) => Promise<void>;
     submitIdentify: (payload: {
         name: string;
         phone: string;
@@ -90,4 +102,6 @@ export declare interface UseChatbotReturn {
     resetSession: () => void;
 }
 
+export { VoiceRecording }
+
 export { }

package/dist/index.d.ts

@@ -1,3 +1,4 @@
+import { ChatAttachment } from '@onedeskpro/chatbot-types';
 import { ChatbotBlockReason } from '@onedeskpro/chatbot-types';
 import { ChatbotCore } from '@onedeskpro/chatbot-core';
 import { ChatbotEventMap } from '@onedeskpro/chatbot-types';
@@ -9,6 +10,9 @@ import { Context } from 'react';
 import { default as default_2 } from 'react';
 import { ReactNode } from 'react';
 import { TicketStatusData } from '@onedeskpro/chatbot-types';
+import { VoiceRecording } from '@onedeskpro/chatbot-types';
+
+export { ChatAttachment }
 
 export declare const ChatbotContext: Context<ChatbotCore | null>;
 
@@ -31,6 +35,7 @@ export declare interface ChatbotHeadlessProps {
         isOpen: boolean;
         messages: ReturnType<typeof useChatbot>['messages'];
         sendMessage: (text: string) => Promise<void>;
+        sendAttachments: (files: File[], text?: string) => Promise<void>;
         isLoading: boolean;
         error: string | null;
         close: () => void;
@@ -77,6 +82,13 @@ export declare interface UseChatbotReturn {
     /** @deprecated Use visitorToken. */
     sessionId: string | null;
     sendMessage: (text: string) => Promise<void>;
+    /**
+     * Sends files as one media message, with `text` as the caption. The message shows
+     * up in `messages` with `pending: true` and local previews until the uploads land.
+     */
+    sendAttachments: (files: File[], text?: string) => Promise<void>;
+    /** Sends a recorded voice note (record one with `VoiceRecorder` from `@onedeskpro/chatbot-core`). */
+    sendVoice: (recording: VoiceRecording) => Promise<void>;
     submitIdentify: (payload: {
         name: string;
         phone: string;
@@ -90,4 +102,6 @@ export declare interface UseChatbotReturn {
     resetSession: () => void;
 }
 
+export { VoiceRecording }
+
 export { }

package/dist/index.js

@@ -30,7 +30,7 @@ function p() {
 		let t = e.on("state-change", (e) => i({ ...e }));
 		return i({ ...e.getState() }), t;
 	}, [e]);
-	let o = t((t) => e.sendMessage(t), [e]), s = t((t) => e.submitIdentify(t), [e]), c = t(() => e.requestHuman(), [e]), l = t(() => e.open(), [e]), u = t(() => e.close(), [e]), f = t(() => e.toggle(), [e]), p = t(() => e.resetSession(), [e]);
+	let o = t((t) => e.sendMessage(t), [e]), s = t((t, n) => e.sendAttachments(t, n), [e]), c = t((t) => e.sendVoice(t), [e]), l = t((t) => e.submitIdentify(t), [e]), u = t(() => e.requestHuman(), [e]), f = t(() => e.open(), [e]), p = t(() => e.close(), [e]), m = t(() => e.toggle(), [e]), h = t(() => e.resetSession(), [e]);
 	return {
 		messages: n.messages,
 		isOpen: n.isOpen,
@@ -44,12 +44,14 @@ function p() {
 		mode: n.mode,
 		sessionId: n.visitorToken,
 		sendMessage: o,
-		submitIdentify: s,
-		requestHuman: c,
-		open: l,
-		close: u,
-		toggle: f,
-		resetSession: p
+		sendAttachments: s,
+		sendVoice: c,
+		submitIdentify: l,
+		requestHuman: u,
+		open: f,
+		close: p,
+		toggle: m,
+		resetSession: h
 	};
 }
 //#endregion
@@ -62,7 +64,7 @@ function m() {
 	});
 }
 function h({ renderLauncher: e, renderWindow: t }) {
-	let { isOpen: n, toggle: r, open: i, close: a, messages: o, sendMessage: c, isLoading: u, error: d } = p();
+	let { isOpen: n, toggle: r, open: i, close: a, messages: o, sendMessage: c, sendAttachments: u, isLoading: d, error: f } = p();
 	return /* @__PURE__ */ l(s, { children: [e({
 		isOpen: n,
 		toggle: r,
@@ -72,8 +74,9 @@ function h({ renderLauncher: e, renderWindow: t }) {
 		isOpen: n,
 		messages: o,
 		sendMessage: c,
-		isLoading: u,
-		error: d,
+		sendAttachments: u,
+		isLoading: d,
+		error: f,
 		close: a
 	})] });
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@onedeskpro/chatbot-react",
-  "version": "0.2.1",
+  "version": "0.3.0",
   "description": "React SDK for the Onedesk Pro Chatbot",
   "license": "MIT",
   "author": "Typetech IT <support@onedeskpro.com>",
@@ -50,26 +50,26 @@
     "react-dom": ">=18.0.0"
   },
   "dependencies": {
-    "@onedeskpro/chatbot-core": "0.2.1",
-    "@onedeskpro/chatbot-types": "0.2.1"
+    "@onedeskpro/chatbot-core": "0.3.0",
+    "@onedeskpro/chatbot-types": "0.3.0"
   },
   "devDependencies": {
     "@microsoft/api-extractor": "^7.59.4",
     "@testing-library/dom": "^10.4.2",
     "@testing-library/jest-dom": "^7.0.1",
     "@testing-library/react": "^16.3.3",
-    "@testing-library/user-event": "^14.6.7",
+    "@testing-library/user-event": "^14.6.8",
     "@types/react": "^19.3.0",
     "@types/react-dom": "^19.3.0",
     "@vitejs/plugin-react": "^6.1.2",
-    "jsdom": "^30.1.2",
-    "msw": "^2.15.0",
-    "react": "^19.3.0",
-    "react-dom": "^19.3.0",
+    "jsdom": "^30.1.3",
+    "msw": "^3.0.3",
+    "react": "^19.3.1",
+    "react-dom": "^19.3.1",
     "typescript": "^6",
     "vite": "^8.3.4",
     "vite-plugin-dts": "^5.1.2",
-    "vitest": "^5.0.4"
+    "vitest": "^5.0.5"
   },
   "scripts": {
     "build": "vite build && cp dist/index.d.ts dist/index.d.cts",