@docshound/chat-react 0.8.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/LICENSE ADDED
@@ -0,0 +1,7 @@
1
+ Copyright (c) 2024 DocsHound Inc.
2
+
3
+ Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
4
+
5
+ The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
6
+
7
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
package/README.md ADDED
@@ -0,0 +1,92 @@
1
+ # Docshound Chat for React
2
+
3
+ `@docshound/chat-react` is a React component library for integrating the DocsHound chat widget into your React / Next.js applications.
4
+
5
+ ## Installation
6
+
7
+ Install the package via npm:
8
+
9
+ ```bash
10
+ npm install @docshound/chat-react
11
+ ```
12
+
13
+ ## Usage
14
+
15
+ ### Location
16
+
17
+ To ensure the DocsHoundChat component remains mounted and does not unmount with navigation, you should include it in a global layout component that wraps your application's main content. This layout component will persist across different pages, preventing the chat widget from resetting every time the user navigates.
18
+
19
+ ### Basic Example
20
+
21
+ Here is a simple example of how to use the DocsHoundChat component in your React project:
22
+
23
+ ```jsx
24
+ import React from 'react';
25
+ import { DocsHoundChat } from '@docshound/chat-react';
26
+
27
+ const App = () => {
28
+ return (
29
+ <div>
30
+ <h1>My Application</h1>
31
+ <DocsHoundChat src="https://your-docshound-portal.com" />
32
+ </div>
33
+ );
34
+ };
35
+
36
+ export default App;
37
+
38
+ ```
39
+
40
+ ### Props
41
+
42
+ The DocsHoundChat component accepts the following props:
43
+
44
+ - `src` (required): The domain where the guide is published, e.g., https://docs.docshound.com.
45
+ - `agentName`: The name of the agent responding in the chat. Optional.
46
+ - `agentAvatarUrl`: The URL for the avatar image of the agent. Optional.
47
+ - `userId`: A unique identifier for the user interacting with the chat. Optional.
48
+ - `userEmail`: The email address of the user. Pre-filled when submitting a support ticket. Optional.
49
+ - `userName`: The display name of the user. Defaults to 'You'. Optional.
50
+ - `platform`: Specifies the platform where the chat is being used ('site', 'app', or 'docs'). Optional. Defaults to 'app'.
51
+ - `userAvatarUrl`: The URL for the avatar image of the user. Optional.
52
+ - `firstMessage`: The initial agent message that appears when the chat opens. Optional.
53
+ - `theme`: Defines the theme of the chat interface, either 'light' or 'dark'. Optional.
54
+ - `position`: The position of the chat widget on the screen ('center' or 'right'). Optional. Defaults to 'right'.
55
+ - `accentColor`: The accent color of the chat interface. Optional.
56
+ - `triggerLabel`: The label for the trigger button that starts the chat. Optional.
57
+
58
+ ## Hooks
59
+
60
+ This package also provides a custom hook, `useDocsHoundChat`, to programmatically control the chat component.
61
+
62
+ ### Example
63
+
64
+ ```jsx
65
+ import React from 'react';
66
+ import { useDocsHoundChat } from '@docshound/chat-react';
67
+
68
+ const ChatControls = () => {
69
+ const { show, clear } = useDocsHoundChat();
70
+
71
+ return (
72
+ <div>
73
+ <button onClick={() => show(true)}>Show Chat</button>
74
+ <button onClick={() => show(false)}>Hide Chat</button>
75
+ <button onClick={() => clear()}>Clear Chat</button>
76
+ </div>
77
+ );
78
+ };
79
+
80
+ export default ChatControls;
81
+ ```
82
+
83
+ ### API
84
+
85
+ Hook's API:
86
+
87
+ - `show(show: boolean)`: Programmatically show or hide the chat widget.
88
+ - `clear()`: Clears the chat history.
89
+
90
+ ## License
91
+
92
+ MIT
@@ -0,0 +1,104 @@
1
+ import * as react_jsx_runtime from 'react/jsx-runtime';
2
+
3
+ type DocsHoundChatProps = {
4
+ /**
5
+ * Domain where the guide is published. Eg: https://docs.docshound.com
6
+ *
7
+ * This field is not reactive, so if you change it, you need to reload the page.
8
+ *
9
+ * Required field;
10
+ */
11
+ src: string;
12
+ /**
13
+ * The name of the agent responding in the chat.
14
+ *
15
+ * Optional field. Defaults to value set in the DocsHound.
16
+ */
17
+ agentName?: string;
18
+ /**
19
+ * The URL for the avatar image of the agent.
20
+ *
21
+ * Optional field. Defaults to value set in the DocsHound.
22
+ */
23
+ agentAvatarUrl?: string;
24
+ /**
25
+ * A unique identifier for the user interacting with the chat.
26
+ * This should be unique identifier coming from your system.
27
+ * Used to identify the user and their support tickets.
28
+ *
29
+ * Optional field. Defaults to undefined.
30
+ */
31
+ userId?: string;
32
+ /**
33
+ * The email address of the user interacting with the chat.
34
+ * Will be pre-filled for the user when they decide to submit a support ticket.
35
+ *
36
+ * Optional field. Defaults to undefined.
37
+ */
38
+ userEmail?: string;
39
+ /**
40
+ * The display name of the user interacting with the chat.
41
+ *
42
+ * Optional field. Defaults to 'You'.
43
+ */
44
+ userName?: string;
45
+ /**
46
+ * The platform where the chat is being used. Could be either 'site' (marketing site), 'app' (application), or 'docs' (documentation site / platform).
47
+ *
48
+ * Optional field, defaults to 'app'.
49
+ */
50
+ platform?: 'site' | 'app' | 'docs';
51
+ /**
52
+ * The URL for the avatar image of the user interacting with the chat.
53
+ *
54
+ * Optional field. Defaults to generic user avatar.
55
+ */
56
+ userAvatarUrl?: string;
57
+ /**
58
+ * The initial agent message that will be prepopulated when user opens the chatbot widget.
59
+ *
60
+ * Optional field. Default to value set in DocsHound.
61
+ */
62
+ firstMessage?: string;
63
+ /**
64
+ * Defines the theme of the chat interface, either 'light' or 'dark'.
65
+ *
66
+ * Optional field. Defaults to value set in DocsHound.
67
+ */
68
+ theme?: 'light' | 'dark';
69
+ /**
70
+ * Defines the position of the chat widget on the screen. Can be either 'center' or 'right'.
71
+ *
72
+ * Optional field. Defaults to 'right'
73
+ */
74
+ position?: 'center' | 'right';
75
+ /**
76
+ * Sets the accent color of the chat interface (e.g., for buttons or highlights).
77
+ *
78
+ * Optional field. Defaults to value set in DocsHound.
79
+ */
80
+ accentColor?: string;
81
+ /**
82
+ * The label for the trigger button that starts the chat.
83
+ *
84
+ * Optional field. Defaults to value set in DocsHound.
85
+ */
86
+ triggerLabel?: string;
87
+ };
88
+ declare const DocsHoundChat: ({ src, agentName, agentAvatarUrl, accentColor, platform, position, theme, triggerLabel, userAvatarUrl, userId, userEmail, userName, firstMessage }: DocsHoundChatProps) => react_jsx_runtime.JSX.Element | null;
89
+
90
+ type UseDocsHoundChat = {
91
+ /**
92
+ * Method to show or hide the chat component
93
+ *
94
+ * @param show - Whether to show or hide the chat component
95
+ */
96
+ show: (show: boolean) => void;
97
+ /**
98
+ * Method to clear history of the chat component
99
+ */
100
+ clear: () => void;
101
+ };
102
+ declare function useDocsHoundChat(): UseDocsHoundChat;
103
+
104
+ export { DocsHoundChat, type DocsHoundChatProps, useDocsHoundChat };
@@ -0,0 +1,2 @@
1
+ import{jsx as e}from"react/jsx-runtime";import t,{useEffect as o,useState as n,useCallback as r}from"react";const a=({src:n,agentName:r,agentAvatarUrl:a,accentColor:s,platform:d,position:c,theme:i,triggerLabel:u,userAvatarUrl:_,userId:m,userEmail:l,userName:h,firstMessage:w})=>{const H="__DH_CHAT_SCRIPT__",[p,C]=t.useState(!1);return o((()=>{if(customElements.get("docshound-chat"))return void C(!0);let e="";e=n.endsWith("/-/chat.js")?n:n.endsWith("/")?`${n}-/chat.js`:`${n}/-/chat.js`;const t=document.createElement("script");return t.src=e,t.id=H,t.type="text/javascript",t.async=!0,t.defer=!0,t.onload=()=>{C(!0),setTimeout((()=>{window.__DH_CHAT__=document.querySelector("docshound-chat");const e=new CustomEvent("docsHoundChatLoaded");window.dispatchEvent(e)}))},document.head.appendChild(t),()=>{const e=document.getElementById(H);e&&e.remove(),delete window.__DH_CHAT__}}),[]),p?e("docshound-chat",{"agent-name":r,"agent-avatar-url":a,"accent-color":s,platform:d,position:c,theme:i,"trigger-label":u,"user-id":m,"user-email":l,"user-name":h,"user-avatar-url":_,"first-message":w}):null};function s(){const[e,t]=n(null);o((()=>{if(!window.__DH_CHAT__){const e=()=>{t(window.__DH_CHAT__)};return window.addEventListener("docsHoundChatLoaded",e),()=>{window.removeEventListener("docsHoundChatLoaded",e)}}t(window.__DH_CHAT__)}),[]);return{show:r((t=>{e&&e.show(t)}),[e]),clear:r((()=>{e&&e.clear()}),[e])}}export{a as DocsHoundChat,s as useDocsHoundChat};
2
+ //# sourceMappingURL=index.esm.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.esm.js","sources":["../src/components/DocsHoundChat.tsx","../src/hooks/useDocsHoundChat.tsx"],"sourcesContent":["import React, { useEffect } from 'react';\n\nexport type DocsHoundChatProps = {\n /**\n * Domain where the guide is published. Eg: https://docs.docshound.com\n *\n * This field is not reactive, so if you change it, you need to reload the page.\n *\n * Required field;\n */\n src: string;\n\n /**\n * The name of the agent responding in the chat.\n *\n * Optional field. Defaults to value set in the DocsHound.\n */\n agentName?: string;\n\n /**\n * The URL for the avatar image of the agent.\n *\n * Optional field. Defaults to value set in the DocsHound.\n */\n agentAvatarUrl?: string;\n\n /**\n * A unique identifier for the user interacting with the chat.\n * This should be unique identifier coming from your system.\n * Used to identify the user and their support tickets.\n *\n * Optional field. Defaults to undefined.\n */\n userId?: string;\n\n /**\n * The email address of the user interacting with the chat.\n * Will be pre-filled for the user when they decide to submit a support ticket.\n *\n * Optional field. Defaults to undefined.\n */\n userEmail?: string;\n\n /**\n * The display name of the user interacting with the chat.\n *\n * Optional field. Defaults to 'You'.\n */\n userName?: string;\n\n /**\n * The platform where the chat is being used. Could be either 'site' (marketing site), 'app' (application), or 'docs' (documentation site / platform).\n *\n * Optional field, defaults to 'app'.\n */\n platform?: 'site' | 'app' | 'docs';\n\n /**\n * The URL for the avatar image of the user interacting with the chat.\n *\n * Optional field. Defaults to generic user avatar.\n */\n userAvatarUrl?: string;\n\n /**\n * The initial agent message that will be prepopulated when user opens the chatbot widget.\n *\n * Optional field. Default to value set in DocsHound.\n */\n firstMessage?: string;\n\n /**\n * Defines the theme of the chat interface, either 'light' or 'dark'.\n *\n * Optional field. Defaults to value set in DocsHound.\n */\n theme?: 'light' | 'dark';\n\n /**\n * Defines the position of the chat widget on the screen. Can be either 'center' or 'right'.\n *\n * Optional field. Defaults to 'right'\n */\n position?: 'center' | 'right';\n\n /**\n * Sets the accent color of the chat interface (e.g., for buttons or highlights).\n *\n * Optional field. Defaults to value set in DocsHound.\n */\n accentColor?: string;\n\n /**\n * The label for the trigger button that starts the chat.\n *\n * Optional field. Defaults to value set in DocsHound.\n */\n triggerLabel?: string;\n}\n\nexport const DocsHoundChat = ({\n src,\n agentName,\n agentAvatarUrl,\n accentColor,\n platform,\n position,\n theme,\n triggerLabel,\n userAvatarUrl,\n userId,\n userEmail,\n userName,\n firstMessage\n }: DocsHoundChatProps) => {\n const id = `__DH_CHAT_SCRIPT__`;\n const [ isLoaded, setIsLoaded ] = React.useState(false);\n\n useEffect(() => {\n if (customElements.get('docshound-chat')) {\n setIsLoaded(true);\n return;\n }\n\n let finalSrc = '';\n\n if (src.endsWith('/-/chat.js')) {\n finalSrc = src;\n } else if (src.endsWith('/')) {\n finalSrc = `${src}-/chat.js`;\n } else {\n finalSrc = `${src}/-/chat.js`;\n }\n\n const script = document.createElement('script');\n script.src = finalSrc;\n script.id = id;\n script.type = 'text/javascript';\n script.async = true;\n script.defer = true;\n script.onload = () => {\n setIsLoaded(true);\n setTimeout(() => {\n window.__DH_CHAT__ = document.querySelector('docshound-chat') as DocsHoundChatElement;\n const customEvent = new CustomEvent('docsHoundChatLoaded');\n window.dispatchEvent(customEvent);\n });\n };\n document.head.appendChild(script);\n return () => {\n const element = document.getElementById(id);\n if (element) {\n element.remove();\n }\n delete window.__DH_CHAT__;\n };\n }, [ ]);\n\n if (!isLoaded) {\n return null;\n }\n\n return (\n <docshound-chat\n agent-name={agentName}\n agent-avatar-url={agentAvatarUrl}\n accent-color={accentColor}\n platform={platform}\n position={position}\n theme={theme}\n trigger-label={triggerLabel}\n user-id={userId}\n user-email={userEmail}\n user-name={userName}\n user-avatar-url={userAvatarUrl}\n first-message={firstMessage}\n />\n );\n};","import { useEffect, useState, useCallback } from 'react';\n\ntype UseDocsHoundChat = {\n\n /**\n * Method to show or hide the chat component\n *\n * @param show - Whether to show or hide the chat component\n */\n show: (show: boolean) => void;\n\n /**\n * Method to clear history of the chat component\n */\n clear: () => void;\n};\n\nexport function useDocsHoundChat(): UseDocsHoundChat {\n const [chatElement, setChatElement] = useState<DocsHoundChatElement | null>(null);\n\n useEffect(() => {\n if (window.__DH_CHAT__) {\n setChatElement(window.__DH_CHAT__);\n } else {\n const listener = () => {\n setChatElement(window.__DH_CHAT__!);\n };\n window.addEventListener('docsHoundChatLoaded', listener);\n\n return () => {\n window.removeEventListener('docsHoundChatLoaded', listener);\n }\n }\n }, []);\n\n const show = useCallback((show: boolean) => {\n if (chatElement) {\n // Assuming the dochound-chat component has a show method\n chatElement.show(show);\n }\n }, [chatElement]);\n\n const clear = useCallback(() => {\n if (chatElement) {\n // Assuming the dochound-chat component has a clear method\n chatElement.clear();\n }\n }, [chatElement]);\n\n // Return the show and clear methods\n return { show, clear };\n};\n\nexport default useDocsHoundChat;"],"names":["DocsHoundChat","src","agentName","agentAvatarUrl","accentColor","platform","position","theme","triggerLabel","userAvatarUrl","userId","userEmail","userName","firstMessage","id","isLoaded","setIsLoaded","React","useState","useEffect","customElements","get","finalSrc","endsWith","script","document","createElement","type","async","defer","onload","setTimeout","window","__DH_CHAT__","querySelector","customEvent","CustomEvent","dispatchEvent","head","appendChild","element","getElementById","remove","_jsx","useDocsHoundChat","chatElement","setChatElement","listener","addEventListener","removeEventListener","show","useCallback","clear"],"mappings":"4GAoGO,MAAMA,EAAgB,EACGC,MACAC,YACAC,iBACAC,cACAC,WACAC,WACAC,QACAC,eACAC,gBACAC,SACAC,YACAC,WACAC,mBAE9B,MAAMC,EAAK,sBACHC,EAAUC,GAAgBC,EAAMC,UAAS,GA0CjD,OAxCAC,GAAU,KACR,GAAIC,eAAeC,IAAI,kBAErB,YADAL,GAAY,GAId,IAAIM,EAAY,GAGdA,EADErB,EAAIsB,SAAS,cACJtB,EACFA,EAAIsB,SAAS,KACX,GAAGtB,aAEH,GAAGA,cAGhB,MAAMuB,EAASC,SAASC,cAAc,UAetC,OAdAF,EAAOvB,IAAMqB,EACbE,EAAOV,GAAKA,EACZU,EAAOG,KAAO,kBACdH,EAAOI,OAAQ,EACfJ,EAAOK,OAAQ,EACfL,EAAOM,OAAS,KACdd,GAAY,GACZe,YAAW,KACTC,OAAOC,YAAcR,SAASS,cAAc,kBAC5C,MAAMC,EAAc,IAAIC,YAAY,uBACpCJ,OAAOK,cAAcF,EAAY,GACjC,EAEJV,SAASa,KAAKC,YAAYf,GACnB,KACL,MAAMgB,EAAUf,SAASgB,eAAe3B,GACpC0B,GACFA,EAAQE,gBAEHV,OAAOC,WAAW,CAC1B,GACA,IAEElB,EAKH4B,EAAA,iBAAA,CAAA,aACczC,EAAS,mBACHC,EACJ,eAAAC,EACdC,SAAUA,EACVC,SAAUA,EACVC,MAAOA,EAAK,gBACGC,EAAY,UAClBE,EACG,aAAAC,EACD,YAAAC,oBACMH,EAAa,gBACfI,IAhBV,IAkBP,WChKY+B,IACd,MAAOC,EAAaC,GAAkB5B,EAAsC,MAE5EC,GAAU,KACR,IAAIa,OAAOC,YAEJ,CACL,MAAMc,EAAW,KACfD,EAAed,OAAOC,YAAa,EAIrC,OAFAD,OAAOgB,iBAAiB,sBAAuBD,GAExC,KACLf,OAAOiB,oBAAoB,sBAAuBF,EAAS,CAE9D,CAVCD,EAAed,OAAOC,YAUvB,GACA,IAiBH,MAAO,CAAEiB,KAfIC,GAAaD,IACpBL,GAEFA,EAAYK,KAAKA,EAClB,GACA,CAACL,IAUWO,MARDD,GAAY,KACpBN,GAEFA,EAAYO,OACb,GACA,CAACP,IAIN"}
package/dist/index.js ADDED
@@ -0,0 +1,2 @@
1
+ "use strict";var e=require("react/jsx-runtime"),t=require("react");exports.DocsHoundChat=({src:a,agentName:s,agentAvatarUrl:n,accentColor:o,platform:r,position:c,theme:d,triggerLabel:u,userAvatarUrl:i,userId:l,userEmail:_,userName:m,firstMessage:h})=>{const w="__DH_CHAT_SCRIPT__",[C,H]=t.useState(!1);return t.useEffect((()=>{if(customElements.get("docshound-chat"))return void H(!0);let e="";e=a.endsWith("/-/chat.js")?a:a.endsWith("/")?`${a}-/chat.js`:`${a}/-/chat.js`;const t=document.createElement("script");return t.src=e,t.id=w,t.type="text/javascript",t.async=!0,t.defer=!0,t.onload=()=>{H(!0),setTimeout((()=>{window.__DH_CHAT__=document.querySelector("docshound-chat");const e=new CustomEvent("docsHoundChatLoaded");window.dispatchEvent(e)}))},document.head.appendChild(t),()=>{const e=document.getElementById(w);e&&e.remove(),delete window.__DH_CHAT__}}),[]),C?e.jsx("docshound-chat",{"agent-name":s,"agent-avatar-url":n,"accent-color":o,platform:r,position:c,theme:d,"trigger-label":u,"user-id":l,"user-email":_,"user-name":m,"user-avatar-url":i,"first-message":h}):null},exports.useDocsHoundChat=function(){const[e,a]=t.useState(null);return t.useEffect((()=>{if(!window.__DH_CHAT__){const e=()=>{a(window.__DH_CHAT__)};return window.addEventListener("docsHoundChatLoaded",e),()=>{window.removeEventListener("docsHoundChatLoaded",e)}}a(window.__DH_CHAT__)}),[]),{show:t.useCallback((t=>{e&&e.show(t)}),[e]),clear:t.useCallback((()=>{e&&e.clear()}),[e])}};
2
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sources":["../src/components/DocsHoundChat.tsx","../src/hooks/useDocsHoundChat.tsx"],"sourcesContent":["import React, { useEffect } from 'react';\n\nexport type DocsHoundChatProps = {\n /**\n * Domain where the guide is published. Eg: https://docs.docshound.com\n *\n * This field is not reactive, so if you change it, you need to reload the page.\n *\n * Required field;\n */\n src: string;\n\n /**\n * The name of the agent responding in the chat.\n *\n * Optional field. Defaults to value set in the DocsHound.\n */\n agentName?: string;\n\n /**\n * The URL for the avatar image of the agent.\n *\n * Optional field. Defaults to value set in the DocsHound.\n */\n agentAvatarUrl?: string;\n\n /**\n * A unique identifier for the user interacting with the chat.\n * This should be unique identifier coming from your system.\n * Used to identify the user and their support tickets.\n *\n * Optional field. Defaults to undefined.\n */\n userId?: string;\n\n /**\n * The email address of the user interacting with the chat.\n * Will be pre-filled for the user when they decide to submit a support ticket.\n *\n * Optional field. Defaults to undefined.\n */\n userEmail?: string;\n\n /**\n * The display name of the user interacting with the chat.\n *\n * Optional field. Defaults to 'You'.\n */\n userName?: string;\n\n /**\n * The platform where the chat is being used. Could be either 'site' (marketing site), 'app' (application), or 'docs' (documentation site / platform).\n *\n * Optional field, defaults to 'app'.\n */\n platform?: 'site' | 'app' | 'docs';\n\n /**\n * The URL for the avatar image of the user interacting with the chat.\n *\n * Optional field. Defaults to generic user avatar.\n */\n userAvatarUrl?: string;\n\n /**\n * The initial agent message that will be prepopulated when user opens the chatbot widget.\n *\n * Optional field. Default to value set in DocsHound.\n */\n firstMessage?: string;\n\n /**\n * Defines the theme of the chat interface, either 'light' or 'dark'.\n *\n * Optional field. Defaults to value set in DocsHound.\n */\n theme?: 'light' | 'dark';\n\n /**\n * Defines the position of the chat widget on the screen. Can be either 'center' or 'right'.\n *\n * Optional field. Defaults to 'right'\n */\n position?: 'center' | 'right';\n\n /**\n * Sets the accent color of the chat interface (e.g., for buttons or highlights).\n *\n * Optional field. Defaults to value set in DocsHound.\n */\n accentColor?: string;\n\n /**\n * The label for the trigger button that starts the chat.\n *\n * Optional field. Defaults to value set in DocsHound.\n */\n triggerLabel?: string;\n}\n\nexport const DocsHoundChat = ({\n src,\n agentName,\n agentAvatarUrl,\n accentColor,\n platform,\n position,\n theme,\n triggerLabel,\n userAvatarUrl,\n userId,\n userEmail,\n userName,\n firstMessage\n }: DocsHoundChatProps) => {\n const id = `__DH_CHAT_SCRIPT__`;\n const [ isLoaded, setIsLoaded ] = React.useState(false);\n\n useEffect(() => {\n if (customElements.get('docshound-chat')) {\n setIsLoaded(true);\n return;\n }\n\n let finalSrc = '';\n\n if (src.endsWith('/-/chat.js')) {\n finalSrc = src;\n } else if (src.endsWith('/')) {\n finalSrc = `${src}-/chat.js`;\n } else {\n finalSrc = `${src}/-/chat.js`;\n }\n\n const script = document.createElement('script');\n script.src = finalSrc;\n script.id = id;\n script.type = 'text/javascript';\n script.async = true;\n script.defer = true;\n script.onload = () => {\n setIsLoaded(true);\n setTimeout(() => {\n window.__DH_CHAT__ = document.querySelector('docshound-chat') as DocsHoundChatElement;\n const customEvent = new CustomEvent('docsHoundChatLoaded');\n window.dispatchEvent(customEvent);\n });\n };\n document.head.appendChild(script);\n return () => {\n const element = document.getElementById(id);\n if (element) {\n element.remove();\n }\n delete window.__DH_CHAT__;\n };\n }, [ ]);\n\n if (!isLoaded) {\n return null;\n }\n\n return (\n <docshound-chat\n agent-name={agentName}\n agent-avatar-url={agentAvatarUrl}\n accent-color={accentColor}\n platform={platform}\n position={position}\n theme={theme}\n trigger-label={triggerLabel}\n user-id={userId}\n user-email={userEmail}\n user-name={userName}\n user-avatar-url={userAvatarUrl}\n first-message={firstMessage}\n />\n );\n};","import { useEffect, useState, useCallback } from 'react';\n\ntype UseDocsHoundChat = {\n\n /**\n * Method to show or hide the chat component\n *\n * @param show - Whether to show or hide the chat component\n */\n show: (show: boolean) => void;\n\n /**\n * Method to clear history of the chat component\n */\n clear: () => void;\n};\n\nexport function useDocsHoundChat(): UseDocsHoundChat {\n const [chatElement, setChatElement] = useState<DocsHoundChatElement | null>(null);\n\n useEffect(() => {\n if (window.__DH_CHAT__) {\n setChatElement(window.__DH_CHAT__);\n } else {\n const listener = () => {\n setChatElement(window.__DH_CHAT__!);\n };\n window.addEventListener('docsHoundChatLoaded', listener);\n\n return () => {\n window.removeEventListener('docsHoundChatLoaded', listener);\n }\n }\n }, []);\n\n const show = useCallback((show: boolean) => {\n if (chatElement) {\n // Assuming the dochound-chat component has a show method\n chatElement.show(show);\n }\n }, [chatElement]);\n\n const clear = useCallback(() => {\n if (chatElement) {\n // Assuming the dochound-chat component has a clear method\n chatElement.clear();\n }\n }, [chatElement]);\n\n // Return the show and clear methods\n return { show, clear };\n};\n\nexport default useDocsHoundChat;"],"names":["src","agentName","agentAvatarUrl","accentColor","platform","position","theme","triggerLabel","userAvatarUrl","userId","userEmail","userName","firstMessage","id","isLoaded","setIsLoaded","React","useState","useEffect","customElements","get","finalSrc","endsWith","script","document","createElement","type","async","defer","onload","setTimeout","window","__DH_CHAT__","querySelector","customEvent","CustomEvent","dispatchEvent","head","appendChild","element","getElementById","remove","_jsx","jsx","chatElement","setChatElement","listener","addEventListener","removeEventListener","show","useCallback","clear"],"mappings":"yFAoG6B,EACGA,MACAC,YACAC,iBACAC,cACAC,WACAC,WACAC,QACAC,eACAC,gBACAC,SACAC,YACAC,WACAC,mBAE9B,MAAMC,EAAK,sBACHC,EAAUC,GAAgBC,EAAMC,UAAS,GA0CjD,OAxCAC,EAAAA,WAAU,KACR,GAAIC,eAAeC,IAAI,kBAErB,YADAL,GAAY,GAId,IAAIM,EAAY,GAGdA,EADErB,EAAIsB,SAAS,cACJtB,EACFA,EAAIsB,SAAS,KACX,GAAGtB,aAEH,GAAGA,cAGhB,MAAMuB,EAASC,SAASC,cAAc,UAetC,OAdAF,EAAOvB,IAAMqB,EACbE,EAAOV,GAAKA,EACZU,EAAOG,KAAO,kBACdH,EAAOI,OAAQ,EACfJ,EAAOK,OAAQ,EACfL,EAAOM,OAAS,KACdd,GAAY,GACZe,YAAW,KACTC,OAAOC,YAAcR,SAASS,cAAc,kBAC5C,MAAMC,EAAc,IAAIC,YAAY,uBACpCJ,OAAOK,cAAcF,EAAY,GACjC,EAEJV,SAASa,KAAKC,YAAYf,GACnB,KACL,MAAMgB,EAAUf,SAASgB,eAAe3B,GACpC0B,GACFA,EAAQE,gBAEHV,OAAOC,WAAW,CAC1B,GACA,IAEElB,EAKH4B,EAAAC,IAAA,iBAAA,CAAA,aACc1C,EAAS,mBACHC,EACJ,eAAAC,EACdC,SAAUA,EACVC,SAAUA,EACVC,MAAOA,EAAK,gBACGC,EAAY,UAClBE,EACG,aAAAC,EACD,YAAAC,oBACMH,EAAa,gBACfI,IAhBV,IAkBP,sCC/JF,MAAOgC,EAAaC,GAAkB5B,EAAQA,SAA8B,MAgC5E,OA9BAC,EAAAA,WAAU,KACR,IAAIa,OAAOC,YAEJ,CACL,MAAMc,EAAW,KACfD,EAAed,OAAOC,YAAa,EAIrC,OAFAD,OAAOgB,iBAAiB,sBAAuBD,GAExC,KACLf,OAAOiB,oBAAoB,sBAAuBF,EAAS,CAE9D,CAVCD,EAAed,OAAOC,YAUvB,GACA,IAiBI,CAAEiB,KAfIC,eAAaD,IACpBL,GAEFA,EAAYK,KAAKA,EAClB,GACA,CAACL,IAUWO,MARDD,EAAAA,aAAY,KACpBN,GAEFA,EAAYO,OACb,GACA,CAACP,IAIN"}
package/package.json ADDED
@@ -0,0 +1,33 @@
1
+ {
2
+ "name": "@docshound/chat-react",
3
+ "private": false,
4
+ "version": "0.8.5",
5
+ "description": "React component library for integrating the DocsHound chat widget into React and Next.js applications.",
6
+ "keywords": ["React", "Next.js", "DocsHound", "Chat Widget", "AI", "Customer Support", "Documentation", "Knowledge Base"],
7
+ "author": "DocsHound",
8
+ "files": ["dist"],
9
+ "main": "./dist/index.js",
10
+ "module": "./dist/index.esm.js",
11
+ "types": "./dist/index.d.ts",
12
+ "license": "MIT",
13
+ "scripts": {
14
+ "build": "rollup -c --bundleConfigAsCjs",
15
+ "test": "echo \"Error: no test specified\" && exit 1"
16
+ },
17
+ "devDependencies": {
18
+ "@rollup/plugin-commonjs": "^28.0.1",
19
+ "@rollup/plugin-node-resolve": "^15.3.0",
20
+ "@rollup/plugin-terser": "^0.4.4",
21
+ "@rollup/plugin-typescript": "^12.1.1",
22
+ "@types/react": "^18",
23
+ "rollup": "^4.24.0",
24
+ "rollup-plugin-dts": "^6.1.1",
25
+ "rollup-plugin-peer-deps-external": "^2.2.4",
26
+ "tslib": "^2.8.0",
27
+ "typescript": "^5.6.3"
28
+ },
29
+ "peerDependencies": {
30
+ "react": "^18",
31
+ "react-dom": "^18"
32
+ }
33
+ }