react-groq-chat 1.0.4 → 1.0.6

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/dist/index.cjs CHANGED
@@ -1,3 +1,3 @@
1
- 'use strict';var v=require('@radix-ui/react-popover'),react=require('react'),jsxRuntime=require('react/jsx-runtime'),D=require('react-markdown'),fa=require('react-icons/fa');function _interopDefault(e){return e&&e.__esModule?e:{default:e}}function _interopNamespace(e){if(e&&e.__esModule)return e;var n=Object.create(null);if(e){Object.keys(e).forEach(function(k){if(k!=='default'){var d=Object.getOwnPropertyDescriptor(e,k);Object.defineProperty(n,k,d.get?d:{enumerable:true,get:function(){return e[k]}});}})}n.default=e;return Object.freeze(n)}var v__namespace=/*#__PURE__*/_interopNamespace(v);var D__default=/*#__PURE__*/_interopDefault(D);async function B({messages:o,model:t,apiKey:s}){let e="https://api.groq.com/openai/v1/chat/completions",n={method:"POST",headers:{Authorization:`Bearer ${s}`,"Content-Type":"application/json"},body:JSON.stringify({model:t,messages:o,temperature:.3})};try{return (await(await fetch(e,n)).json()).choices[0].message}catch(r){return console.error(r),"error"}}function K({apiKey:o,systemPrompt:t,assistantFirstMessage:s}){let e=["openai/gpt-oss-120b","llama-3.3-70b-versatile","moonshotai/kimi-k2-instruct-0905","meta-llama/llama-4-maverick-17b-128e-instruct","meta-llama/llama-4-scout-17b-16e-instruct","groq/compound","openai/gpt-oss-20b","openai/gpt-oss-safeguard-20b","llama-3.1-8b-instant","groq/compound-mini","meta-llama/llama-guard-4-12b","meta-llama/llama-prompt-guard-2-86m","meta-llama/llama-prompt-guard-2-22m"],[n,r]=react.useState([{role:"system",content:t},{role:"assistant",content:s}]),[a,d]=react.useState(""),[x,c]=react.useState(false),p=react.useRef(null),l=react.useRef(0);react.useEffect(()=>{p?.current?.scrollTo({top:p.current.scrollHeight,behavior:"smooth"});},[n]);function y(h=""){let f=typeof h=="string"?h:"";if(!a.trim()&&!f.trim())return;let C={role:"user",content:a||f},b=[...n,C];r(b),d(""),c(true),B({model:e[l.current],messages:b,apiKey:o}).then(g=>{g==="error"?(r(u=>[...u,{role:"assistant",content:"Sorry, I encountered an error. Please try again."}]),l.current++,l.current>=e.length&&(l.current=0)):r(u=>[...u,g]);}).catch(g=>{console.error(g);}).finally(()=>{c(false);});}return {messages:n,input:a,setInput:d,handleSendMessage:y,messagesRef:p,isLoading:x}}var N=K;function j({triggerColor:o="#111",triggerImg:t,triggerRightPosition:s=24,triggerBottomPosition:e=24}){return jsxRuntime.jsx(v.PopoverTrigger,{asChild:true,children:jsxRuntime.jsxs("button",{className:`fixed right-[${s}px] ${t?"":"h-14 w-14"} bottom-[${e}px] z-10 cursor-pointer rounded-full bg-[${o}] p-1 shadow-lg transition-all hover:scale-110 hover:bg-[${o}]/90 active:scale-95`,children:[t&&jsxRuntime.jsx("img",{src:t,alt:"Chat with chatbot",className:"h-14 w-14"}),!t&&jsxRuntime.jsx("p",{className:"text-white text-center text-xl",children:"C"})]})})}var _=j;function E({messages:o,messagesRef:t,isLoading:s,userMessageBgColor:e="#fff",assistantMessageBgColor:n="#007bff"}){return jsxRuntime.jsxs("div",{ref:t,style:{scrollbarWidth:"none",msOverflowStyle:"none"},className:" flex h-full flex-col gap-4 overflow-x-hidden overflow-y-auto",children:[o.map((r,a)=>{if(r.role==="user")return jsxRuntime.jsx("div",{className:"flex justify-start",children:jsxRuntime.jsx("div",{dir:"auto",style:{unicodeBidi:"isolate"},className:`max-w-[95%] rounded-2xl rounded-bl-none bg-[${e}] px-4 py-2 text-start text-sm shadow-sm`,children:r.content.replace(/\[\[.*?\]\]/g,"")})},a);if(r.role==="assistant")return jsxRuntime.jsx("div",{className:"flex justify-end",children:jsxRuntime.jsx("div",{dir:"rtl",style:{unicodeBidi:"isolate",display:"inline-block"},className:`bg-[${n}] max-w-[95%] rounded-2xl rounded-br-none px-4 py-2 text-start text-sm wrap-break-word whitespace-normal text-white shadow-md`,children:jsxRuntime.jsx(D__default.default,{children:r.content})})},a)}),s&&jsxRuntime.jsx("div",{className:"flex justify-end",children:jsxRuntime.jsx("div",{className:"bg-red/90 rounded-2xl rounded-br-none px-4 py-2 text-white shadow-md",children:jsxRuntime.jsx("span",{className:"loading loading-dots loading-xs"})})})]})}var $=E;function H({handleSendMessage:o,input:t,setInput:s}){return jsxRuntime.jsxs("div",{className:"flex h-full items-end gap-2",children:[jsxRuntime.jsx("textarea",{onKeyDown:e=>{e.key==="Enter"&&!e.shiftKey&&(e.preventDefault(),o());},value:t,onChange:e=>s(e.target.value),placeholder:"Ask me anything...",style:{fieldSizing:"content",scrollbarWidth:"none",msOverflowStyle:"none"},dir:"auto",className:"auto-expand text-yellowish-white placeholder:text-dark-yellowish-white max-h-[20vh] min-h-6 w-full resize-none overflow-auto bg-transparent py-1 ring-transparent outline-none"}),jsxRuntime.jsx("button",{onClick:()=>o(),className:"bg-red hover:bg-light-red cursor-pointer rounded-full p-2 text-white transition-colors",children:jsxRuntime.jsx(fa.FaPaperPlane,{className:"h-4 w-4"})})]})}var I=H;var U=v__namespace.Popover,J=v__namespace.Content;function Q({apiKey:o,triggerColor:t,triggerImg:s,contentBgColor:e="#1a1a1a",contentHeight:n=500,contentWidth:r=350,contentBorder:a=1,contentBorderColor:d="#333333",textColor:x="#ffffff",userMessageBgColor:c="#007bff",assistantMessageBgColor:p="#2d2d2d",triggerRightPosition:l=24,triggerBottomPosition:y=24,contentRightPosition:h=24,systemPrompt:f="You are a helpful AI assistant. Provide clear, concise, and accurate responses.",assistantFirstMessage:C="Hello! I'm here to help you. What can I assist you with today?",contentBorderRoundness:b=16}){let{messages:g,input:u,setInput:L,handleSendMessage:T,messagesRef:S,isLoading:q}=N({apiKey:o,systemPrompt:f,assistantFirstMessage:C});return jsxRuntime.jsxs(U,{children:[jsxRuntime.jsx(_,{triggerColor:t,triggerImg:s,triggerRightPosition:l,triggerBottomPosition:y}),jsxRuntime.jsx(J,{className:`bg-[${e}] mr-[${h}px] h-[${n}px] max-h-[${n}px] w-[${r}px] border-[${a}px] border-[${d}] text-[${x}] shadow-2xl ring-1 ring-white/10 rounded-[${b}px]`,children:jsxRuntime.jsxs("div",{className:"flex h-full flex-col gap-4 p-2",children:[jsxRuntime.jsx("div",{className:"min-h-0 flex-1",children:jsxRuntime.jsx($,{messages:g,messagesRef:S,isLoading:q,userMessageBgColor:c,assistantMessageBgColor:p})}),jsxRuntime.jsx("div",{className:"shrink-0 rounded-xl bg-black/40 p-2",children:jsxRuntime.jsx(I,{handleSendMessage:T,input:u,setInput:L})})]})})]})}
1
+ 'use strict';var x=require('@radix-ui/react-popover'),react=require('react'),jsxRuntime=require('react/jsx-runtime'),z=require('react-markdown'),fa=require('react-icons/fa');function _interopDefault(e){return e&&e.__esModule?e:{default:e}}function _interopNamespace(e){if(e&&e.__esModule)return e;var n=Object.create(null);if(e){Object.keys(e).forEach(function(k){if(k!=='default'){var d=Object.getOwnPropertyDescriptor(e,k);Object.defineProperty(n,k,d.get?d:{enumerable:true,get:function(){return e[k]}});}})}n.default=e;return Object.freeze(n)}var x__namespace=/*#__PURE__*/_interopNamespace(x);var z__default=/*#__PURE__*/_interopDefault(z);async function B({messages:r,model:t,apiKey:s}){let e="https://api.groq.com/openai/v1/chat/completions",n={method:"POST",headers:{Authorization:`Bearer ${s}`,"Content-Type":"application/json"},body:JSON.stringify({model:t,messages:r,temperature:.3})};try{return (await(await fetch(e,n)).json()).choices[0].message}catch(o){return console.error(o),"error"}}function K({apiKey:r,systemPrompt:t,assistantFirstMessage:s}){let e=["openai/gpt-oss-120b","llama-3.3-70b-versatile","moonshotai/kimi-k2-instruct-0905","meta-llama/llama-4-maverick-17b-128e-instruct","meta-llama/llama-4-scout-17b-16e-instruct","groq/compound","openai/gpt-oss-20b","openai/gpt-oss-safeguard-20b","llama-3.1-8b-instant","groq/compound-mini","meta-llama/llama-guard-4-12b","meta-llama/llama-prompt-guard-2-86m","meta-llama/llama-prompt-guard-2-22m"],[n,o]=react.useState([{role:"system",content:t},{role:"assistant",content:s}]),[a,d]=react.useState(""),[v,c]=react.useState(false),p=react.useRef(null),l=react.useRef(0);react.useEffect(()=>{p?.current?.scrollTo({top:p.current.scrollHeight,behavior:"smooth"});},[n]);function y(h=""){let f=typeof h=="string"?h:"";if(!a.trim()&&!f.trim())return;let C={role:"user",content:a||f},b=[...n,C];o(b),d(""),c(true),B({model:e[l.current],messages:b,apiKey:r}).then(g=>{g==="error"?(o(u=>[...u,{role:"assistant",content:"Sorry, I encountered an error. Please try again."}]),l.current++,l.current>=e.length&&(l.current=0)):o(u=>[...u,g]);}).catch(g=>{console.error(g);}).finally(()=>{c(false);});}return {messages:n,input:a,setInput:d,handleSendMessage:y,messagesRef:p,isLoading:v}}var N=K;function H({triggerColor:r="#111",triggerImg:t,triggerRightPosition:s=24,triggerBottomPosition:e=24}){return jsxRuntime.jsx(x.PopoverTrigger,{asChild:true,children:jsxRuntime.jsxs("button",{className:"fixed z-10 cursor-pointer rounded-full p-1 shadow-lg transition-all hover:scale-110 active:scale-95",style:{right:`${s}px`,bottom:`${e}px`,backgroundColor:r,width:t?"auto":"56px",height:t?"auto":"56px"},children:[t&&jsxRuntime.jsx("img",{src:t,alt:"Chat with chatbot",className:"h-14 w-14"}),!t&&jsxRuntime.jsx("p",{className:"text-white text-center text-xl",children:"C"})]})})}var _=H;function D({messages:r,messagesRef:t,isLoading:s,userMessageBgColor:e="#fff",assistantMessageBgColor:n="#007bff"}){return jsxRuntime.jsxs("div",{ref:t,style:{scrollbarWidth:"none",msOverflowStyle:"none"},className:" flex h-full flex-col gap-4 overflow-x-hidden overflow-y-auto",children:[r.map((o,a)=>{if(o.role==="user")return jsxRuntime.jsx("div",{className:"flex justify-start",children:jsxRuntime.jsx("div",{dir:"auto",style:{unicodeBidi:"isolate",backgroundColor:e},className:"max-w-[95%] rounded-2xl rounded-bl-none px-4 py-2 text-start text-sm shadow-sm",children:o.content.replace(/\[\[.*?\]\]/g,"")})},a);if(o.role==="assistant")return jsxRuntime.jsx("div",{className:"flex justify-end",children:jsxRuntime.jsx("div",{dir:"rtl",style:{unicodeBidi:"isolate",display:"inline-block",backgroundColor:n},className:"max-w-[95%] rounded-2xl rounded-br-none px-4 py-2 text-start text-sm wrap-break-word whitespace-normal text-white shadow-md",children:jsxRuntime.jsx(z__default.default,{children:o.content})})},a)}),s&&jsxRuntime.jsx("div",{className:"flex justify-end",children:jsxRuntime.jsx("div",{className:"bg-red/90 rounded-2xl rounded-br-none px-4 py-2 text-white shadow-md",children:jsxRuntime.jsx("span",{className:"loading loading-dots loading-xs"})})})]})}var R=D;function G({handleSendMessage:r,input:t,setInput:s}){return jsxRuntime.jsxs("div",{className:"flex h-full items-end gap-2",children:[jsxRuntime.jsx("textarea",{onKeyDown:e=>{e.key==="Enter"&&!e.shiftKey&&(e.preventDefault(),r());},value:t,onChange:e=>s(e.target.value),placeholder:"Ask me anything...",style:{fieldSizing:"content",scrollbarWidth:"none",msOverflowStyle:"none"},dir:"auto",className:"auto-expand text-yellowish-white placeholder:text-dark-yellowish-white max-h-[20vh] min-h-6 w-full resize-none overflow-auto bg-transparent py-1 ring-transparent outline-none"}),jsxRuntime.jsx("button",{onClick:()=>r(),className:"bg-red hover:bg-light-red cursor-pointer rounded-full p-2 text-white transition-colors",children:jsxRuntime.jsx(fa.FaPaperPlane,{className:"h-4 w-4"})})]})}var I=G;var U=x__namespace.Popover,J=x__namespace.Content;function Q({apiKey:r,triggerColor:t,triggerImg:s,contentBgColor:e="#1a1a1a",contentHeight:n=500,contentWidth:o=350,contentBorder:a=1,contentBorderColor:d="#333333",textColor:v="#ffffff",userMessageBgColor:c="#007bff",assistantMessageBgColor:p="#2d2d2d",triggerRightPosition:l=24,triggerBottomPosition:y=24,contentRightPosition:h=24,systemPrompt:f="You are a helpful AI assistant. Provide clear, concise, and accurate responses.",assistantFirstMessage:C="Hello! I'm here to help you. What can I assist you with today?",contentBorderRoundness:b=16}){let{messages:g,input:u,setInput:T,handleSendMessage:S,messagesRef:$,isLoading:q}=N({apiKey:r,systemPrompt:f,assistantFirstMessage:C});return jsxRuntime.jsxs(U,{children:[jsxRuntime.jsx(_,{triggerColor:t,triggerImg:s,triggerRightPosition:l,triggerBottomPosition:y}),jsxRuntime.jsx(J,{className:"shadow-2xl ring-1 ring-white/10",style:{backgroundColor:e,marginRight:`${h}px`,height:`${n}px`,maxHeight:`${n}px`,width:`${o}px`,border:`${a}px solid ${d}`,color:v,borderRadius:`${b}px`},children:jsxRuntime.jsxs("div",{className:"flex h-full flex-col gap-4 p-2",children:[jsxRuntime.jsx("div",{className:"min-h-0 flex-1",children:jsxRuntime.jsx(R,{messages:g,messagesRef:$,isLoading:q,userMessageBgColor:c,assistantMessageBgColor:p})}),jsxRuntime.jsx("div",{className:"shrink-0 rounded-xl bg-black/40 p-2",children:jsxRuntime.jsx(I,{handleSendMessage:S,input:u,setInput:T})})]})})]})}
2
2
  exports.ChatBot=Q;//# sourceMappingURL=index.cjs.map
3
3
  //# sourceMappingURL=index.cjs.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/api/groqApi.ts","../src/ChatBot/hooks/useChat.tsx","../src/ChatBot/components/ChatTrigger.tsx","../src/ChatBot/components/MessageList.tsx","../src/ChatBot/components/ChatInput.tsx","../src/ChatBot/ChatBot.tsx"],"names":["chatWithGroq","messages","model","apiKey","url","options","error","useChat","systemPrompt","assistantFirstMessage","models","setMessages","useState","input","setInput","isLoading","setIsLoading","messagesRef","useRef","modelNumber","useEffect","handleSendMessage","text","messageContent","userMessage","newMessages","res","prev","err","useChat_default","ChatTrigger","triggerColor","triggerImg","triggerRightPosition","triggerBottomPosition","jsx","PopoverTrigger","jsxs","ChatTrigger_default","MessageList","userMessageBgColor","assistantMessageBgColor","item","index","Markdown","MessageList_default","ChatInput","FaPaperPlane","ChatInput_default","Popover","v","PopoverContent","ChatBot","contentBgColor","contentHeight","contentWidth","contentBorder","contentBorderColor","textColor","contentRightPosition","contentBorderRoundness"],"mappings":"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","file":"index.cjs","sourcesContent":["type chatWithGroqProps = {\r\n messages: {\r\n role: string;\r\n content: string;\r\n }[];\r\n model: string;\r\n apiKey: string;\r\n};\r\n\r\ntype response = {\r\n id: string;\r\n object: string;\r\n created: number;\r\n model: string;\r\n choices: {\r\n index: number;\r\n message: {\r\n role: string;\r\n content: string;\r\n reasoning?: string;\r\n };\r\n logprobs: null;\r\n finish_reason: string;\r\n }[];\r\n usage: {\r\n queue_time: number;\r\n prompt_tokens: number;\r\n prompt_time: number;\r\n completion_tokens: number;\r\n completion_time: number;\r\n total_tokens: number;\r\n total_time: number;\r\n prompt_tokens_details: {\r\n cached_tokens: number;\r\n };\r\n completion_tokens_details: {\r\n reasoning_tokens: number;\r\n };\r\n };\r\n usage_breakdown: null;\r\n system_fingerprint: string;\r\n x_groq: {\r\n id: string;\r\n seed: number;\r\n };\r\n service_tier: string;\r\n};\r\n\r\nexport async function chatWithGroq({\r\n messages,\r\n model,\r\n apiKey,\r\n}: chatWithGroqProps) {\r\n const url = \"https://api.groq.com/openai/v1/chat/completions\";\r\n const options = {\r\n method: \"POST\",\r\n headers: {\r\n Authorization: `Bearer ${apiKey}`,\r\n \"Content-Type\": \"application/json\",\r\n },\r\n body: JSON.stringify({\r\n model: model,\r\n messages,\r\n temperature: 0.3,\r\n }),\r\n };\r\n\r\n try {\r\n const response = await fetch(url, options);\r\n const result: response = await response.json();\r\n return result.choices[0].message;\r\n } catch (error) {\r\n console.error(error);\r\n return \"error\";\r\n }\r\n}\r\n","import { chatWithGroq } from \"@/api/groqApi\";\r\nimport { useEffect, useRef, useState } from \"react\";\r\n\r\nexport type UseChatProps = {\r\n apiKey: string;\r\n systemPrompt: string;\r\n assistantFirstMessage: string;\r\n};\r\n\r\nfunction useChat({\r\n apiKey,\r\n systemPrompt,\r\n assistantFirstMessage,\r\n}: UseChatProps) {\r\n const models = [\r\n \"openai/gpt-oss-120b\",\r\n \"llama-3.3-70b-versatile\",\r\n \"moonshotai/kimi-k2-instruct-0905\",\r\n \"meta-llama/llama-4-maverick-17b-128e-instruct\",\r\n \"meta-llama/llama-4-scout-17b-16e-instruct\",\r\n \"groq/compound\",\r\n \"openai/gpt-oss-20b\",\r\n \"openai/gpt-oss-safeguard-20b\",\r\n \"llama-3.1-8b-instant\",\r\n \"groq/compound-mini\",\r\n \"meta-llama/llama-guard-4-12b\",\r\n \"meta-llama/llama-prompt-guard-2-86m\",\r\n \"meta-llama/llama-prompt-guard-2-22m\",\r\n ];\r\n const [messages, setMessages] = useState([\r\n {\r\n role: \"system\",\r\n content: systemPrompt,\r\n },\r\n {\r\n role: \"assistant\",\r\n content: assistantFirstMessage,\r\n },\r\n ]);\r\n const [input, setInput] = useState(\"\");\r\n const [isLoading, setIsLoading] = useState(false);\r\n const messagesRef = useRef<HTMLDivElement>(null);\r\n const modelNumber = useRef(0);\r\n\r\n useEffect(() => {\r\n // Scroll to the bottom of the messages container\r\n messagesRef?.current?.scrollTo({\r\n top: messagesRef.current.scrollHeight,\r\n behavior: \"smooth\",\r\n });\r\n }, [messages]);\r\n\r\n function handleSendMessage(text = \"\") {\r\n const messageContent = typeof text === \"string\" ? text : \"\";\r\n if (!input.trim() && !messageContent.trim()) return;\r\n\r\n const userMessage = { role: \"user\", content: input || messageContent };\r\n const newMessages = [...messages, userMessage];\r\n\r\n setMessages(newMessages);\r\n setInput(\"\");\r\n setIsLoading(true);\r\n\r\n chatWithGroq({\r\n model: models[modelNumber.current],\r\n messages: newMessages,\r\n apiKey: apiKey,\r\n })\r\n .then((res) => {\r\n if (res === \"error\") {\r\n setMessages((prev) => [\r\n ...prev,\r\n {\r\n role: \"assistant\",\r\n content: \"Sorry, I encountered an error. Please try again.\",\r\n },\r\n ]);\r\n modelNumber.current++;\r\n if (modelNumber.current >= models.length) {\r\n modelNumber.current = 0;\r\n }\r\n } else {\r\n setMessages((prev) => [...prev, res]);\r\n }\r\n })\r\n .catch((err) => {\r\n console.error(err);\r\n })\r\n .finally(() => {\r\n setIsLoading(false);\r\n });\r\n }\r\n return {\r\n messages,\r\n input,\r\n setInput,\r\n handleSendMessage,\r\n messagesRef,\r\n isLoading,\r\n };\r\n}\r\n\r\nexport default useChat;\r\n","import { PopoverTrigger } from \"@radix-ui/react-popover\";\r\n\r\ntype ChatTriggerProps = {\r\n triggerColor?: string;\r\n triggerImg?: string;\r\n triggerRightPosition?: number;\r\n triggerBottomPosition?: number;\r\n};\r\n\r\nfunction ChatTrigger({\r\n triggerColor = \"#111\",\r\n triggerImg,\r\n triggerRightPosition = 24,\r\n triggerBottomPosition = 24,\r\n}: ChatTriggerProps) {\r\n return (\r\n <PopoverTrigger asChild>\r\n <button\r\n className={`fixed right-[${triggerRightPosition}px] ${triggerImg ? \"\" : \"h-14 w-14\"} bottom-[${triggerBottomPosition}px] z-10 cursor-pointer rounded-full bg-[${triggerColor}] p-1 shadow-lg transition-all hover:scale-110 hover:bg-[${triggerColor}]/90 active:scale-95`}\r\n >\r\n {triggerImg && (\r\n <img src={triggerImg} alt=\"Chat with chatbot\" className=\"h-14 w-14\" />\r\n )}\r\n {!triggerImg && <p className=\"text-white text-center text-xl\">C</p>}\r\n </button>\r\n </PopoverTrigger>\r\n );\r\n}\r\n\r\nexport default ChatTrigger;\r\n","import type { RefObject } from \"react\";\r\nimport Markdown from \"react-markdown\";\r\n\r\ntype MessageListProps = {\r\n messages: { role: string; content: string }[];\r\n messagesRef: RefObject<HTMLDivElement | null>;\r\n isLoading: boolean;\r\n userMessageBgColor?: string;\r\n assistantMessageBgColor?: string;\r\n};\r\n\r\nfunction MessageList({\r\n messages,\r\n messagesRef,\r\n isLoading,\r\n userMessageBgColor = \"#fff\",\r\n assistantMessageBgColor = \"#007bff\",\r\n}: MessageListProps) {\r\n return (\r\n <div\r\n ref={messagesRef}\r\n style={{ scrollbarWidth: \"none\", msOverflowStyle: \"none\" }}\r\n className=\" flex h-full flex-col gap-4 overflow-x-hidden overflow-y-auto\"\r\n >\r\n {messages.map((item, index) => {\r\n if (item.role === \"user\")\r\n return (\r\n <div key={index} className=\"flex justify-start\">\r\n <div\r\n dir=\"auto\"\r\n style={{ unicodeBidi: \"isolate\" }}\r\n className={`max-w-[95%] rounded-2xl rounded-bl-none bg-[${userMessageBgColor}] px-4 py-2 text-start text-sm shadow-sm`}\r\n >\r\n {item.content.replace(/\\[\\[.*?\\]\\]/g, \"\")}\r\n </div>\r\n </div>\r\n );\r\n if (item.role === \"assistant\") {\r\n return (\r\n <div key={index} className=\"flex justify-end\">\r\n <div\r\n dir=\"rtl\"\r\n style={{ unicodeBidi: \"isolate\", display: \"inline-block\" }}\r\n className={`bg-[${assistantMessageBgColor}] max-w-[95%] rounded-2xl rounded-br-none px-4 py-2 text-start text-sm wrap-break-word whitespace-normal text-white shadow-md`}\r\n >\r\n <Markdown>{item.content}</Markdown>\r\n </div>\r\n </div>\r\n );\r\n }\r\n })}\r\n {isLoading && (\r\n <div className=\"flex justify-end\">\r\n <div className=\"bg-red/90 rounded-2xl rounded-br-none px-4 py-2 text-white shadow-md\">\r\n <span className=\"loading loading-dots loading-xs\"></span>\r\n </div>\r\n </div>\r\n )}\r\n </div>\r\n );\r\n}\r\n\r\nexport default MessageList;\r\n","import { FaPaperPlane } from \"react-icons/fa\";\r\nimport { FaQuestionCircle } from \"react-icons/fa\";\r\n\r\ntype ChatInputProps = {\r\n handleSendMessage: (text?: string) => void;\r\n input: string;\r\n setInput: (text: string) => void;\r\n};\r\n\r\nfunction ChatInput({ handleSendMessage, input, setInput }: ChatInputProps) {\r\n return (\r\n <div className=\"flex h-full items-end gap-2\">\r\n <textarea\r\n onKeyDown={(e) => {\r\n if (e.key === \"Enter\" && !e.shiftKey) {\r\n e.preventDefault();\r\n handleSendMessage();\r\n }\r\n }}\r\n value={input}\r\n onChange={(e) => setInput(e.target.value)}\r\n placeholder=\"Ask me anything...\"\r\n style={{\r\n fieldSizing: \"content\",\r\n scrollbarWidth: \"none\",\r\n msOverflowStyle: \"none\",\r\n }}\r\n dir=\"auto\"\r\n className=\"auto-expand text-yellowish-white placeholder:text-dark-yellowish-white max-h-[20vh] min-h-6 w-full resize-none overflow-auto bg-transparent py-1 ring-transparent outline-none\"\r\n />\r\n <button\r\n onClick={() => handleSendMessage()}\r\n className=\"bg-red hover:bg-light-red cursor-pointer rounded-full p-2 text-white transition-colors\"\r\n >\r\n <FaPaperPlane className=\"h-4 w-4\" />\r\n </button>\r\n </div>\r\n );\r\n}\r\n\r\nexport default ChatInput;\r\n","import * as PopoverPrimitive from \"@radix-ui/react-popover\";\r\nimport useChat from \"./hooks/useChat\";\r\nimport ChatTrigger from \"./components/ChatTrigger\";\r\nimport MessageList from \"./components/MessageList\";\r\nimport ChatInput from \"./components/ChatInput\";\r\n\r\n// Custom popover components to avoid shadcn dependency\r\nconst Popover = PopoverPrimitive.Popover;\r\nconst PopoverContent = PopoverPrimitive.Content;\r\n\r\nexport type ChatBotProps = {\r\n apiKey: string;\r\n triggerColor?: string;\r\n triggerImg?: string;\r\n contentBgColor?: string;\r\n contentHeight?: number;\r\n contentWidth?: number;\r\n contentBorder?: number;\r\n contentBorderColor?: string;\r\n contentBorderRoundness?: number;\r\n textColor?: string;\r\n userMessageBgColor?: string;\r\n assistantMessageBgColor?: string;\r\n triggerRightPosition?: number;\r\n triggerBottomPosition?: number;\r\n contentRightPosition?: number;\r\n systemPrompt?: string;\r\n assistantFirstMessage?: string;\r\n};\r\n\r\nexport function ChatBot({\r\n apiKey,\r\n triggerColor,\r\n triggerImg,\r\n contentBgColor = \"#1a1a1a\",\r\n contentHeight = 500,\r\n contentWidth = 350,\r\n contentBorder = 1,\r\n contentBorderColor = \"#333333\",\r\n textColor = \"#ffffff\",\r\n userMessageBgColor = \"#007bff\",\r\n assistantMessageBgColor = \"#2d2d2d\",\r\n triggerRightPosition = 24,\r\n triggerBottomPosition = 24,\r\n contentRightPosition = 24,\r\n systemPrompt = `You are a helpful AI assistant. Provide clear, concise, and accurate responses.`,\r\n assistantFirstMessage = \"Hello! I'm here to help you. What can I assist you with today?\",\r\n contentBorderRoundness = 16,\r\n}: ChatBotProps) {\r\n const {\r\n messages,\r\n input,\r\n setInput,\r\n handleSendMessage,\r\n messagesRef,\r\n isLoading,\r\n } = useChat({ apiKey, systemPrompt, assistantFirstMessage });\r\n return (\r\n <Popover>\r\n <ChatTrigger\r\n triggerColor={triggerColor}\r\n triggerImg={triggerImg}\r\n triggerRightPosition={triggerRightPosition}\r\n triggerBottomPosition={triggerBottomPosition}\r\n />\r\n <PopoverContent\r\n className={`bg-[${contentBgColor}] mr-[${contentRightPosition}px] h-[${contentHeight}px] max-h-[${contentHeight}px] w-[${contentWidth}px] border-[${contentBorder}px] border-[${contentBorderColor}] text-[${textColor}] shadow-2xl ring-1 ring-white/10 rounded-[${contentBorderRoundness}px]`}\r\n >\r\n <div className=\"flex h-full flex-col gap-4 p-2\">\r\n <div className=\"min-h-0 flex-1\">\r\n <MessageList\r\n messages={messages}\r\n messagesRef={messagesRef}\r\n isLoading={isLoading}\r\n userMessageBgColor={userMessageBgColor}\r\n assistantMessageBgColor={assistantMessageBgColor}\r\n />\r\n </div>\r\n\r\n <div className=\"shrink-0 rounded-xl bg-black/40 p-2\">\r\n <ChatInput\r\n handleSendMessage={handleSendMessage}\r\n input={input}\r\n setInput={setInput}\r\n />\r\n </div>\r\n </div>\r\n </PopoverContent>\r\n </Popover>\r\n );\r\n}\r\n"]}
1
+ {"version":3,"sources":["../src/api/groqApi.ts","../src/ChatBot/hooks/useChat.tsx","../src/ChatBot/components/ChatTrigger.tsx","../src/ChatBot/components/MessageList.tsx","../src/ChatBot/components/ChatInput.tsx","../src/ChatBot/ChatBot.tsx"],"names":["chatWithGroq","messages","model","apiKey","url","options","error","useChat","systemPrompt","assistantFirstMessage","models","setMessages","useState","input","setInput","isLoading","setIsLoading","messagesRef","useRef","modelNumber","useEffect","handleSendMessage","text","messageContent","userMessage","newMessages","res","prev","err","useChat_default","ChatTrigger","triggerColor","triggerImg","triggerRightPosition","triggerBottomPosition","jsx","PopoverTrigger","jsxs","ChatTrigger_default","MessageList","userMessageBgColor","assistantMessageBgColor","item","index","Markdown","MessageList_default","ChatInput","FaPaperPlane","ChatInput_default","Popover","x","PopoverContent","ChatBot","contentBgColor","contentHeight","contentWidth","contentBorder","contentBorderColor","textColor","contentRightPosition","contentBorderRoundness"],"mappings":"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","file":"index.cjs","sourcesContent":["type chatWithGroqProps = {\r\n messages: {\r\n role: string;\r\n content: string;\r\n }[];\r\n model: string;\r\n apiKey: string;\r\n};\r\n\r\ntype response = {\r\n id: string;\r\n object: string;\r\n created: number;\r\n model: string;\r\n choices: {\r\n index: number;\r\n message: {\r\n role: string;\r\n content: string;\r\n reasoning?: string;\r\n };\r\n logprobs: null;\r\n finish_reason: string;\r\n }[];\r\n usage: {\r\n queue_time: number;\r\n prompt_tokens: number;\r\n prompt_time: number;\r\n completion_tokens: number;\r\n completion_time: number;\r\n total_tokens: number;\r\n total_time: number;\r\n prompt_tokens_details: {\r\n cached_tokens: number;\r\n };\r\n completion_tokens_details: {\r\n reasoning_tokens: number;\r\n };\r\n };\r\n usage_breakdown: null;\r\n system_fingerprint: string;\r\n x_groq: {\r\n id: string;\r\n seed: number;\r\n };\r\n service_tier: string;\r\n};\r\n\r\nexport async function chatWithGroq({\r\n messages,\r\n model,\r\n apiKey,\r\n}: chatWithGroqProps) {\r\n const url = \"https://api.groq.com/openai/v1/chat/completions\";\r\n const options = {\r\n method: \"POST\",\r\n headers: {\r\n Authorization: `Bearer ${apiKey}`,\r\n \"Content-Type\": \"application/json\",\r\n },\r\n body: JSON.stringify({\r\n model: model,\r\n messages,\r\n temperature: 0.3,\r\n }),\r\n };\r\n\r\n try {\r\n const response = await fetch(url, options);\r\n const result: response = await response.json();\r\n return result.choices[0].message;\r\n } catch (error) {\r\n console.error(error);\r\n return \"error\";\r\n }\r\n}\r\n","import { chatWithGroq } from \"@/api/groqApi\";\r\nimport { useEffect, useRef, useState } from \"react\";\r\n\r\nexport type UseChatProps = {\r\n apiKey: string;\r\n systemPrompt: string;\r\n assistantFirstMessage: string;\r\n};\r\n\r\nfunction useChat({\r\n apiKey,\r\n systemPrompt,\r\n assistantFirstMessage,\r\n}: UseChatProps) {\r\n const models = [\r\n \"openai/gpt-oss-120b\",\r\n \"llama-3.3-70b-versatile\",\r\n \"moonshotai/kimi-k2-instruct-0905\",\r\n \"meta-llama/llama-4-maverick-17b-128e-instruct\",\r\n \"meta-llama/llama-4-scout-17b-16e-instruct\",\r\n \"groq/compound\",\r\n \"openai/gpt-oss-20b\",\r\n \"openai/gpt-oss-safeguard-20b\",\r\n \"llama-3.1-8b-instant\",\r\n \"groq/compound-mini\",\r\n \"meta-llama/llama-guard-4-12b\",\r\n \"meta-llama/llama-prompt-guard-2-86m\",\r\n \"meta-llama/llama-prompt-guard-2-22m\",\r\n ];\r\n const [messages, setMessages] = useState([\r\n {\r\n role: \"system\",\r\n content: systemPrompt,\r\n },\r\n {\r\n role: \"assistant\",\r\n content: assistantFirstMessage,\r\n },\r\n ]);\r\n const [input, setInput] = useState(\"\");\r\n const [isLoading, setIsLoading] = useState(false);\r\n const messagesRef = useRef<HTMLDivElement>(null);\r\n const modelNumber = useRef(0);\r\n\r\n useEffect(() => {\r\n // Scroll to the bottom of the messages container\r\n messagesRef?.current?.scrollTo({\r\n top: messagesRef.current.scrollHeight,\r\n behavior: \"smooth\",\r\n });\r\n }, [messages]);\r\n\r\n function handleSendMessage(text = \"\") {\r\n const messageContent = typeof text === \"string\" ? text : \"\";\r\n if (!input.trim() && !messageContent.trim()) return;\r\n\r\n const userMessage = { role: \"user\", content: input || messageContent };\r\n const newMessages = [...messages, userMessage];\r\n\r\n setMessages(newMessages);\r\n setInput(\"\");\r\n setIsLoading(true);\r\n\r\n chatWithGroq({\r\n model: models[modelNumber.current],\r\n messages: newMessages,\r\n apiKey: apiKey,\r\n })\r\n .then((res) => {\r\n if (res === \"error\") {\r\n setMessages((prev) => [\r\n ...prev,\r\n {\r\n role: \"assistant\",\r\n content: \"Sorry, I encountered an error. Please try again.\",\r\n },\r\n ]);\r\n modelNumber.current++;\r\n if (modelNumber.current >= models.length) {\r\n modelNumber.current = 0;\r\n }\r\n } else {\r\n setMessages((prev) => [...prev, res]);\r\n }\r\n })\r\n .catch((err) => {\r\n console.error(err);\r\n })\r\n .finally(() => {\r\n setIsLoading(false);\r\n });\r\n }\r\n return {\r\n messages,\r\n input,\r\n setInput,\r\n handleSendMessage,\r\n messagesRef,\r\n isLoading,\r\n };\r\n}\r\n\r\nexport default useChat;\r\n","import { PopoverTrigger } from \"@radix-ui/react-popover\";\r\n\r\ntype ChatTriggerProps = {\r\n triggerColor?: string;\r\n triggerImg?: string;\r\n triggerRightPosition?: number;\r\n triggerBottomPosition?: number;\r\n};\r\n\r\nfunction ChatTrigger({\r\n triggerColor = \"#111\",\r\n triggerImg,\r\n triggerRightPosition = 24,\r\n triggerBottomPosition = 24,\r\n}: ChatTriggerProps) {\r\n return (\r\n <PopoverTrigger asChild>\r\n <button\r\n className=\"fixed z-10 cursor-pointer rounded-full p-1 shadow-lg transition-all hover:scale-110 active:scale-95\"\r\n style={{\r\n right: `${triggerRightPosition}px`,\r\n bottom: `${triggerBottomPosition}px`,\r\n backgroundColor: triggerColor,\r\n width: triggerImg ? \"auto\" : \"56px\",\r\n height: triggerImg ? \"auto\" : \"56px\",\r\n }}\r\n >\r\n {triggerImg && (\r\n <img src={triggerImg} alt=\"Chat with chatbot\" className=\"h-14 w-14\" />\r\n )}\r\n {!triggerImg && <p className=\"text-white text-center text-xl\">C</p>}\r\n </button>\r\n </PopoverTrigger>\r\n );\r\n}\r\n\r\nexport default ChatTrigger;\r\n","import type { RefObject } from \"react\";\r\nimport Markdown from \"react-markdown\";\r\n\r\ntype MessageListProps = {\r\n messages: { role: string; content: string }[];\r\n messagesRef: RefObject<HTMLDivElement | null>;\r\n isLoading: boolean;\r\n userMessageBgColor?: string;\r\n assistantMessageBgColor?: string;\r\n};\r\n\r\nfunction MessageList({\r\n messages,\r\n messagesRef,\r\n isLoading,\r\n userMessageBgColor = \"#fff\",\r\n assistantMessageBgColor = \"#007bff\",\r\n}: MessageListProps) {\r\n return (\r\n <div\r\n ref={messagesRef}\r\n style={{ scrollbarWidth: \"none\", msOverflowStyle: \"none\" }}\r\n className=\" flex h-full flex-col gap-4 overflow-x-hidden overflow-y-auto\"\r\n >\r\n {messages.map((item, index) => {\r\n if (item.role === \"user\")\r\n return (\r\n <div key={index} className=\"flex justify-start\">\r\n <div\r\n dir=\"auto\"\r\n style={{\r\n unicodeBidi: \"isolate\",\r\n backgroundColor: userMessageBgColor,\r\n }}\r\n className=\"max-w-[95%] rounded-2xl rounded-bl-none px-4 py-2 text-start text-sm shadow-sm\"\r\n >\r\n {item.content.replace(/\\[\\[.*?\\]\\]/g, \"\")}\r\n </div>\r\n </div>\r\n );\r\n if (item.role === \"assistant\") {\r\n return (\r\n <div key={index} className=\"flex justify-end\">\r\n <div\r\n dir=\"rtl\"\r\n style={{\r\n unicodeBidi: \"isolate\",\r\n display: \"inline-block\",\r\n backgroundColor: assistantMessageBgColor,\r\n }}\r\n className=\"max-w-[95%] rounded-2xl rounded-br-none px-4 py-2 text-start text-sm wrap-break-word whitespace-normal text-white shadow-md\"\r\n >\r\n <Markdown>{item.content}</Markdown>\r\n </div>\r\n </div>\r\n );\r\n }\r\n })}\r\n {isLoading && (\r\n <div className=\"flex justify-end\">\r\n <div className=\"bg-red/90 rounded-2xl rounded-br-none px-4 py-2 text-white shadow-md\">\r\n <span className=\"loading loading-dots loading-xs\"></span>\r\n </div>\r\n </div>\r\n )}\r\n </div>\r\n );\r\n}\r\n\r\nexport default MessageList;\r\n","import { FaPaperPlane } from \"react-icons/fa\";\r\nimport { FaQuestionCircle } from \"react-icons/fa\";\r\n\r\ntype ChatInputProps = {\r\n handleSendMessage: (text?: string) => void;\r\n input: string;\r\n setInput: (text: string) => void;\r\n};\r\n\r\nfunction ChatInput({ handleSendMessage, input, setInput }: ChatInputProps) {\r\n return (\r\n <div className=\"flex h-full items-end gap-2\">\r\n <textarea\r\n onKeyDown={(e) => {\r\n if (e.key === \"Enter\" && !e.shiftKey) {\r\n e.preventDefault();\r\n handleSendMessage();\r\n }\r\n }}\r\n value={input}\r\n onChange={(e) => setInput(e.target.value)}\r\n placeholder=\"Ask me anything...\"\r\n style={{\r\n fieldSizing: \"content\",\r\n scrollbarWidth: \"none\",\r\n msOverflowStyle: \"none\",\r\n }}\r\n dir=\"auto\"\r\n className=\"auto-expand text-yellowish-white placeholder:text-dark-yellowish-white max-h-[20vh] min-h-6 w-full resize-none overflow-auto bg-transparent py-1 ring-transparent outline-none\"\r\n />\r\n <button\r\n onClick={() => handleSendMessage()}\r\n className=\"bg-red hover:bg-light-red cursor-pointer rounded-full p-2 text-white transition-colors\"\r\n >\r\n <FaPaperPlane className=\"h-4 w-4\" />\r\n </button>\r\n </div>\r\n );\r\n}\r\n\r\nexport default ChatInput;\r\n","import * as PopoverPrimitive from \"@radix-ui/react-popover\";\r\nimport useChat from \"./hooks/useChat\";\r\nimport ChatTrigger from \"./components/ChatTrigger\";\r\nimport MessageList from \"./components/MessageList\";\r\nimport ChatInput from \"./components/ChatInput\";\r\n\r\n// Custom popover components to avoid shadcn dependency\r\nconst Popover = PopoverPrimitive.Popover;\r\nconst PopoverContent = PopoverPrimitive.Content;\r\n\r\nexport type ChatBotProps = {\r\n apiKey: string;\r\n triggerColor?: string;\r\n triggerImg?: string;\r\n contentBgColor?: string;\r\n contentHeight?: number;\r\n contentWidth?: number;\r\n contentBorder?: number;\r\n contentBorderColor?: string;\r\n contentBorderRoundness?: number;\r\n textColor?: string;\r\n userMessageBgColor?: string;\r\n assistantMessageBgColor?: string;\r\n triggerRightPosition?: number;\r\n triggerBottomPosition?: number;\r\n contentRightPosition?: number;\r\n systemPrompt?: string;\r\n assistantFirstMessage?: string;\r\n};\r\n\r\nexport function ChatBot({\r\n apiKey,\r\n triggerColor,\r\n triggerImg,\r\n contentBgColor = \"#1a1a1a\",\r\n contentHeight = 500,\r\n contentWidth = 350,\r\n contentBorder = 1,\r\n contentBorderColor = \"#333333\",\r\n textColor = \"#ffffff\",\r\n userMessageBgColor = \"#007bff\",\r\n assistantMessageBgColor = \"#2d2d2d\",\r\n triggerRightPosition = 24,\r\n triggerBottomPosition = 24,\r\n contentRightPosition = 24,\r\n systemPrompt = `You are a helpful AI assistant. Provide clear, concise, and accurate responses.`,\r\n assistantFirstMessage = \"Hello! I'm here to help you. What can I assist you with today?\",\r\n contentBorderRoundness = 16,\r\n}: ChatBotProps) {\r\n const {\r\n messages,\r\n input,\r\n setInput,\r\n handleSendMessage,\r\n messagesRef,\r\n isLoading,\r\n } = useChat({ apiKey, systemPrompt, assistantFirstMessage });\r\n return (\r\n <Popover>\r\n <ChatTrigger\r\n triggerColor={triggerColor}\r\n triggerImg={triggerImg}\r\n triggerRightPosition={triggerRightPosition}\r\n triggerBottomPosition={triggerBottomPosition}\r\n />\r\n <PopoverContent\r\n className=\"shadow-2xl ring-1 ring-white/10\"\r\n style={{\r\n backgroundColor: contentBgColor,\r\n marginRight: `${contentRightPosition}px`,\r\n height: `${contentHeight}px`,\r\n maxHeight: `${contentHeight}px`,\r\n width: `${contentWidth}px`,\r\n border: `${contentBorder}px solid ${contentBorderColor}`,\r\n color: textColor,\r\n borderRadius: `${contentBorderRoundness}px`,\r\n }}\r\n >\r\n <div className=\"flex h-full flex-col gap-4 p-2\">\r\n <div className=\"min-h-0 flex-1\">\r\n <MessageList\r\n messages={messages}\r\n messagesRef={messagesRef}\r\n isLoading={isLoading}\r\n userMessageBgColor={userMessageBgColor}\r\n assistantMessageBgColor={assistantMessageBgColor}\r\n />\r\n </div>\r\n\r\n <div className=\"shrink-0 rounded-xl bg-black/40 p-2\">\r\n <ChatInput\r\n handleSendMessage={handleSendMessage}\r\n input={input}\r\n setInput={setInput}\r\n />\r\n </div>\r\n </div>\r\n </PopoverContent>\r\n </Popover>\r\n );\r\n}\r\n"]}
package/dist/index.js CHANGED
@@ -1,3 +1,3 @@
1
- import*as v from'@radix-ui/react-popover';import {PopoverTrigger}from'@radix-ui/react-popover';import {useState,useRef,useEffect}from'react';import {jsxs,jsx}from'react/jsx-runtime';import D from'react-markdown';import {FaPaperPlane}from'react-icons/fa';async function B({messages:o,model:t,apiKey:s}){let e="https://api.groq.com/openai/v1/chat/completions",n={method:"POST",headers:{Authorization:`Bearer ${s}`,"Content-Type":"application/json"},body:JSON.stringify({model:t,messages:o,temperature:.3})};try{return (await(await fetch(e,n)).json()).choices[0].message}catch(r){return console.error(r),"error"}}function K({apiKey:o,systemPrompt:t,assistantFirstMessage:s}){let e=["openai/gpt-oss-120b","llama-3.3-70b-versatile","moonshotai/kimi-k2-instruct-0905","meta-llama/llama-4-maverick-17b-128e-instruct","meta-llama/llama-4-scout-17b-16e-instruct","groq/compound","openai/gpt-oss-20b","openai/gpt-oss-safeguard-20b","llama-3.1-8b-instant","groq/compound-mini","meta-llama/llama-guard-4-12b","meta-llama/llama-prompt-guard-2-86m","meta-llama/llama-prompt-guard-2-22m"],[n,r]=useState([{role:"system",content:t},{role:"assistant",content:s}]),[a,d]=useState(""),[x,c]=useState(false),p=useRef(null),l=useRef(0);useEffect(()=>{p?.current?.scrollTo({top:p.current.scrollHeight,behavior:"smooth"});},[n]);function y(h=""){let f=typeof h=="string"?h:"";if(!a.trim()&&!f.trim())return;let C={role:"user",content:a||f},b=[...n,C];r(b),d(""),c(true),B({model:e[l.current],messages:b,apiKey:o}).then(g=>{g==="error"?(r(u=>[...u,{role:"assistant",content:"Sorry, I encountered an error. Please try again."}]),l.current++,l.current>=e.length&&(l.current=0)):r(u=>[...u,g]);}).catch(g=>{console.error(g);}).finally(()=>{c(false);});}return {messages:n,input:a,setInput:d,handleSendMessage:y,messagesRef:p,isLoading:x}}var N=K;function j({triggerColor:o="#111",triggerImg:t,triggerRightPosition:s=24,triggerBottomPosition:e=24}){return jsx(PopoverTrigger,{asChild:true,children:jsxs("button",{className:`fixed right-[${s}px] ${t?"":"h-14 w-14"} bottom-[${e}px] z-10 cursor-pointer rounded-full bg-[${o}] p-1 shadow-lg transition-all hover:scale-110 hover:bg-[${o}]/90 active:scale-95`,children:[t&&jsx("img",{src:t,alt:"Chat with chatbot",className:"h-14 w-14"}),!t&&jsx("p",{className:"text-white text-center text-xl",children:"C"})]})})}var _=j;function E({messages:o,messagesRef:t,isLoading:s,userMessageBgColor:e="#fff",assistantMessageBgColor:n="#007bff"}){return jsxs("div",{ref:t,style:{scrollbarWidth:"none",msOverflowStyle:"none"},className:" flex h-full flex-col gap-4 overflow-x-hidden overflow-y-auto",children:[o.map((r,a)=>{if(r.role==="user")return jsx("div",{className:"flex justify-start",children:jsx("div",{dir:"auto",style:{unicodeBidi:"isolate"},className:`max-w-[95%] rounded-2xl rounded-bl-none bg-[${e}] px-4 py-2 text-start text-sm shadow-sm`,children:r.content.replace(/\[\[.*?\]\]/g,"")})},a);if(r.role==="assistant")return jsx("div",{className:"flex justify-end",children:jsx("div",{dir:"rtl",style:{unicodeBidi:"isolate",display:"inline-block"},className:`bg-[${n}] max-w-[95%] rounded-2xl rounded-br-none px-4 py-2 text-start text-sm wrap-break-word whitespace-normal text-white shadow-md`,children:jsx(D,{children:r.content})})},a)}),s&&jsx("div",{className:"flex justify-end",children:jsx("div",{className:"bg-red/90 rounded-2xl rounded-br-none px-4 py-2 text-white shadow-md",children:jsx("span",{className:"loading loading-dots loading-xs"})})})]})}var $=E;function H({handleSendMessage:o,input:t,setInput:s}){return jsxs("div",{className:"flex h-full items-end gap-2",children:[jsx("textarea",{onKeyDown:e=>{e.key==="Enter"&&!e.shiftKey&&(e.preventDefault(),o());},value:t,onChange:e=>s(e.target.value),placeholder:"Ask me anything...",style:{fieldSizing:"content",scrollbarWidth:"none",msOverflowStyle:"none"},dir:"auto",className:"auto-expand text-yellowish-white placeholder:text-dark-yellowish-white max-h-[20vh] min-h-6 w-full resize-none overflow-auto bg-transparent py-1 ring-transparent outline-none"}),jsx("button",{onClick:()=>o(),className:"bg-red hover:bg-light-red cursor-pointer rounded-full p-2 text-white transition-colors",children:jsx(FaPaperPlane,{className:"h-4 w-4"})})]})}var I=H;var U=v.Popover,J=v.Content;function Q({apiKey:o,triggerColor:t,triggerImg:s,contentBgColor:e="#1a1a1a",contentHeight:n=500,contentWidth:r=350,contentBorder:a=1,contentBorderColor:d="#333333",textColor:x="#ffffff",userMessageBgColor:c="#007bff",assistantMessageBgColor:p="#2d2d2d",triggerRightPosition:l=24,triggerBottomPosition:y=24,contentRightPosition:h=24,systemPrompt:f="You are a helpful AI assistant. Provide clear, concise, and accurate responses.",assistantFirstMessage:C="Hello! I'm here to help you. What can I assist you with today?",contentBorderRoundness:b=16}){let{messages:g,input:u,setInput:L,handleSendMessage:T,messagesRef:S,isLoading:q}=N({apiKey:o,systemPrompt:f,assistantFirstMessage:C});return jsxs(U,{children:[jsx(_,{triggerColor:t,triggerImg:s,triggerRightPosition:l,triggerBottomPosition:y}),jsx(J,{className:`bg-[${e}] mr-[${h}px] h-[${n}px] max-h-[${n}px] w-[${r}px] border-[${a}px] border-[${d}] text-[${x}] shadow-2xl ring-1 ring-white/10 rounded-[${b}px]`,children:jsxs("div",{className:"flex h-full flex-col gap-4 p-2",children:[jsx("div",{className:"min-h-0 flex-1",children:jsx($,{messages:g,messagesRef:S,isLoading:q,userMessageBgColor:c,assistantMessageBgColor:p})}),jsx("div",{className:"shrink-0 rounded-xl bg-black/40 p-2",children:jsx(I,{handleSendMessage:T,input:u,setInput:L})})]})})]})}
1
+ import*as x from'@radix-ui/react-popover';import {PopoverTrigger}from'@radix-ui/react-popover';import {useState,useRef,useEffect}from'react';import {jsxs,jsx}from'react/jsx-runtime';import z from'react-markdown';import {FaPaperPlane}from'react-icons/fa';async function B({messages:r,model:t,apiKey:s}){let e="https://api.groq.com/openai/v1/chat/completions",n={method:"POST",headers:{Authorization:`Bearer ${s}`,"Content-Type":"application/json"},body:JSON.stringify({model:t,messages:r,temperature:.3})};try{return (await(await fetch(e,n)).json()).choices[0].message}catch(o){return console.error(o),"error"}}function K({apiKey:r,systemPrompt:t,assistantFirstMessage:s}){let e=["openai/gpt-oss-120b","llama-3.3-70b-versatile","moonshotai/kimi-k2-instruct-0905","meta-llama/llama-4-maverick-17b-128e-instruct","meta-llama/llama-4-scout-17b-16e-instruct","groq/compound","openai/gpt-oss-20b","openai/gpt-oss-safeguard-20b","llama-3.1-8b-instant","groq/compound-mini","meta-llama/llama-guard-4-12b","meta-llama/llama-prompt-guard-2-86m","meta-llama/llama-prompt-guard-2-22m"],[n,o]=useState([{role:"system",content:t},{role:"assistant",content:s}]),[a,d]=useState(""),[v,c]=useState(false),p=useRef(null),l=useRef(0);useEffect(()=>{p?.current?.scrollTo({top:p.current.scrollHeight,behavior:"smooth"});},[n]);function y(h=""){let f=typeof h=="string"?h:"";if(!a.trim()&&!f.trim())return;let C={role:"user",content:a||f},b=[...n,C];o(b),d(""),c(true),B({model:e[l.current],messages:b,apiKey:r}).then(g=>{g==="error"?(o(u=>[...u,{role:"assistant",content:"Sorry, I encountered an error. Please try again."}]),l.current++,l.current>=e.length&&(l.current=0)):o(u=>[...u,g]);}).catch(g=>{console.error(g);}).finally(()=>{c(false);});}return {messages:n,input:a,setInput:d,handleSendMessage:y,messagesRef:p,isLoading:v}}var N=K;function H({triggerColor:r="#111",triggerImg:t,triggerRightPosition:s=24,triggerBottomPosition:e=24}){return jsx(PopoverTrigger,{asChild:true,children:jsxs("button",{className:"fixed z-10 cursor-pointer rounded-full p-1 shadow-lg transition-all hover:scale-110 active:scale-95",style:{right:`${s}px`,bottom:`${e}px`,backgroundColor:r,width:t?"auto":"56px",height:t?"auto":"56px"},children:[t&&jsx("img",{src:t,alt:"Chat with chatbot",className:"h-14 w-14"}),!t&&jsx("p",{className:"text-white text-center text-xl",children:"C"})]})})}var _=H;function D({messages:r,messagesRef:t,isLoading:s,userMessageBgColor:e="#fff",assistantMessageBgColor:n="#007bff"}){return jsxs("div",{ref:t,style:{scrollbarWidth:"none",msOverflowStyle:"none"},className:" flex h-full flex-col gap-4 overflow-x-hidden overflow-y-auto",children:[r.map((o,a)=>{if(o.role==="user")return jsx("div",{className:"flex justify-start",children:jsx("div",{dir:"auto",style:{unicodeBidi:"isolate",backgroundColor:e},className:"max-w-[95%] rounded-2xl rounded-bl-none px-4 py-2 text-start text-sm shadow-sm",children:o.content.replace(/\[\[.*?\]\]/g,"")})},a);if(o.role==="assistant")return jsx("div",{className:"flex justify-end",children:jsx("div",{dir:"rtl",style:{unicodeBidi:"isolate",display:"inline-block",backgroundColor:n},className:"max-w-[95%] rounded-2xl rounded-br-none px-4 py-2 text-start text-sm wrap-break-word whitespace-normal text-white shadow-md",children:jsx(z,{children:o.content})})},a)}),s&&jsx("div",{className:"flex justify-end",children:jsx("div",{className:"bg-red/90 rounded-2xl rounded-br-none px-4 py-2 text-white shadow-md",children:jsx("span",{className:"loading loading-dots loading-xs"})})})]})}var R=D;function G({handleSendMessage:r,input:t,setInput:s}){return jsxs("div",{className:"flex h-full items-end gap-2",children:[jsx("textarea",{onKeyDown:e=>{e.key==="Enter"&&!e.shiftKey&&(e.preventDefault(),r());},value:t,onChange:e=>s(e.target.value),placeholder:"Ask me anything...",style:{fieldSizing:"content",scrollbarWidth:"none",msOverflowStyle:"none"},dir:"auto",className:"auto-expand text-yellowish-white placeholder:text-dark-yellowish-white max-h-[20vh] min-h-6 w-full resize-none overflow-auto bg-transparent py-1 ring-transparent outline-none"}),jsx("button",{onClick:()=>r(),className:"bg-red hover:bg-light-red cursor-pointer rounded-full p-2 text-white transition-colors",children:jsx(FaPaperPlane,{className:"h-4 w-4"})})]})}var I=G;var U=x.Popover,J=x.Content;function Q({apiKey:r,triggerColor:t,triggerImg:s,contentBgColor:e="#1a1a1a",contentHeight:n=500,contentWidth:o=350,contentBorder:a=1,contentBorderColor:d="#333333",textColor:v="#ffffff",userMessageBgColor:c="#007bff",assistantMessageBgColor:p="#2d2d2d",triggerRightPosition:l=24,triggerBottomPosition:y=24,contentRightPosition:h=24,systemPrompt:f="You are a helpful AI assistant. Provide clear, concise, and accurate responses.",assistantFirstMessage:C="Hello! I'm here to help you. What can I assist you with today?",contentBorderRoundness:b=16}){let{messages:g,input:u,setInput:T,handleSendMessage:S,messagesRef:$,isLoading:q}=N({apiKey:r,systemPrompt:f,assistantFirstMessage:C});return jsxs(U,{children:[jsx(_,{triggerColor:t,triggerImg:s,triggerRightPosition:l,triggerBottomPosition:y}),jsx(J,{className:"shadow-2xl ring-1 ring-white/10",style:{backgroundColor:e,marginRight:`${h}px`,height:`${n}px`,maxHeight:`${n}px`,width:`${o}px`,border:`${a}px solid ${d}`,color:v,borderRadius:`${b}px`},children:jsxs("div",{className:"flex h-full flex-col gap-4 p-2",children:[jsx("div",{className:"min-h-0 flex-1",children:jsx(R,{messages:g,messagesRef:$,isLoading:q,userMessageBgColor:c,assistantMessageBgColor:p})}),jsx("div",{className:"shrink-0 rounded-xl bg-black/40 p-2",children:jsx(I,{handleSendMessage:S,input:u,setInput:T})})]})})]})}
2
2
  export{Q as ChatBot};//# sourceMappingURL=index.js.map
3
3
  //# sourceMappingURL=index.js.map
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/api/groqApi.ts","../src/ChatBot/hooks/useChat.tsx","../src/ChatBot/components/ChatTrigger.tsx","../src/ChatBot/components/MessageList.tsx","../src/ChatBot/components/ChatInput.tsx","../src/ChatBot/ChatBot.tsx"],"names":["chatWithGroq","messages","model","apiKey","url","options","error","useChat","systemPrompt","assistantFirstMessage","models","setMessages","useState","input","setInput","isLoading","setIsLoading","messagesRef","useRef","modelNumber","useEffect","handleSendMessage","text","messageContent","userMessage","newMessages","res","prev","err","useChat_default","ChatTrigger","triggerColor","triggerImg","triggerRightPosition","triggerBottomPosition","jsx","PopoverTrigger","jsxs","ChatTrigger_default","MessageList","userMessageBgColor","assistantMessageBgColor","item","index","Markdown","MessageList_default","ChatInput","FaPaperPlane","ChatInput_default","Popover","PopoverContent","ChatBot","contentBgColor","contentHeight","contentWidth","contentBorder","contentBorderColor","textColor","contentRightPosition","contentBorderRoundness"],"mappings":"8PAgDA,eAAsBA,CAAAA,CAAa,CACjC,QAAA,CAAAC,CAAAA,CACA,MAAAC,CAAAA,CACA,MAAA,CAAAC,CACF,CAAA,CAAsB,CACpB,IAAMC,CAAAA,CAAM,iDAAA,CACNC,EAAU,CACd,MAAA,CAAQ,OACR,OAAA,CAAS,CACP,cAAe,CAAA,OAAA,EAAUF,CAAM,GAC/B,cAAA,CAAgB,kBAClB,EACA,IAAA,CAAM,IAAA,CAAK,UAAU,CACnB,KAAA,CAAOD,EACP,QAAA,CAAAD,CAAAA,CACA,YAAa,EACf,CAAC,CACH,CAAA,CAEA,GAAI,CAGF,OAAA,CADyB,KAAA,CADR,MAAM,KAAA,CAAMG,CAAAA,CAAKC,CAAO,CAAA,EACD,IAAA,IAC1B,OAAA,CAAQ,CAAC,EAAE,OAC3B,CAAA,MAASC,EAAO,CACd,OAAA,OAAA,CAAQ,MAAMA,CAAK,CAAA,CACZ,OACT,CACF,CClEA,SAASC,EAAQ,CACf,MAAA,CAAAJ,EACA,YAAA,CAAAK,CAAAA,CACA,sBAAAC,CACF,CAAA,CAAiB,CACf,IAAMC,CAAAA,CAAS,CACb,qBAAA,CACA,yBAAA,CACA,kCAAA,CACA,+CAAA,CACA,2CAAA,CACA,eAAA,CACA,qBACA,8BAAA,CACA,sBAAA,CACA,qBACA,8BAAA,CACA,qCAAA,CACA,qCACF,CAAA,CACM,CAACT,EAAUU,CAAW,CAAA,CAAIC,SAAS,CACvC,CACE,KAAM,QAAA,CACN,OAAA,CAASJ,CACX,CAAA,CACA,CACE,KAAM,WAAA,CACN,OAAA,CAASC,CACX,CACF,CAAC,EACK,CAACI,CAAAA,CAAOC,CAAQ,CAAA,CAAIF,QAAAA,CAAS,EAAE,CAAA,CAC/B,CAACG,EAAWC,CAAY,CAAA,CAAIJ,SAAS,KAAK,CAAA,CAC1CK,EAAcC,MAAAA,CAAuB,IAAI,EACzCC,CAAAA,CAAcD,MAAAA,CAAO,CAAC,CAAA,CAE5BE,SAAAA,CAAU,IAAM,CAEdH,CAAAA,EAAa,SAAS,QAAA,CAAS,CAC7B,IAAKA,CAAAA,CAAY,OAAA,CAAQ,aACzB,QAAA,CAAU,QACZ,CAAC,EACH,CAAA,CAAG,CAAChB,CAAQ,CAAC,EAEb,SAASoB,CAAAA,CAAkBC,EAAO,EAAA,CAAI,CACpC,IAAMC,CAAAA,CAAiB,OAAOD,GAAS,QAAA,CAAWA,CAAAA,CAAO,GACzD,GAAI,CAACT,EAAM,IAAA,EAAK,EAAK,CAACU,CAAAA,CAAe,IAAA,GAAQ,OAE7C,IAAMC,CAAAA,CAAc,CAAE,IAAA,CAAM,MAAA,CAAQ,QAASX,CAAAA,EAASU,CAAe,EAC/DE,CAAAA,CAAc,CAAC,GAAGxB,CAAAA,CAAUuB,CAAW,EAE7Cb,CAAAA,CAAYc,CAAW,EACvBX,CAAAA,CAAS,EAAE,EACXE,CAAAA,CAAa,IAAI,EAEjBhB,CAAAA,CAAa,CACX,MAAOU,CAAAA,CAAOS,CAAAA,CAAY,OAAO,CAAA,CACjC,QAAA,CAAUM,EACV,MAAA,CAAQtB,CACV,CAAC,CAAA,CACE,IAAA,CAAMuB,GAAQ,CACTA,CAAAA,GAAQ,SACVf,CAAAA,CAAagB,CAAAA,EAAS,CACpB,GAAGA,CAAAA,CACH,CACE,IAAA,CAAM,WAAA,CACN,QAAS,kDACX,CACF,CAAC,CAAA,CACDR,CAAAA,CAAY,UACRA,CAAAA,CAAY,OAAA,EAAWT,EAAO,MAAA,GAChCS,CAAAA,CAAY,QAAU,CAAA,CAAA,EAGxBR,CAAAA,CAAagB,GAAS,CAAC,GAAGA,EAAMD,CAAG,CAAC,EAExC,CAAC,CAAA,CACA,MAAOE,CAAAA,EAAQ,CACd,QAAQ,KAAA,CAAMA,CAAG,EACnB,CAAC,CAAA,CACA,QAAQ,IAAM,CACbZ,EAAa,KAAK,EACpB,CAAC,EACL,CACA,OAAO,CACL,QAAA,CAAAf,EACA,KAAA,CAAAY,CAAAA,CACA,QAAA,CAAAC,CAAAA,CACA,iBAAA,CAAAO,CAAAA,CACA,YAAAJ,CAAAA,CACA,SAAA,CAAAF,CACF,CACF,CAEA,IAAOc,CAAAA,CAAQtB,CAAAA,CC7Ff,SAASuB,CAAAA,CAAY,CACnB,YAAA,CAAAC,CAAAA,CAAe,OACf,UAAA,CAAAC,CAAAA,CACA,qBAAAC,CAAAA,CAAuB,EAAA,CACvB,sBAAAC,CAAAA,CAAwB,EAC1B,EAAqB,CACnB,OACEC,IAACC,cAAAA,CAAA,CAAe,QAAO,IAAA,CACrB,QAAA,CAAAC,KAAC,QAAA,CAAA,CACC,SAAA,CAAW,CAAA,aAAA,EAAgBJ,CAAoB,CAAA,IAAA,EAAOD,CAAAA,CAAa,GAAK,WAAW,CAAA,SAAA,EAAYE,CAAqB,CAAA,yCAAA,EAA4CH,CAAY,4DAA4DA,CAAY,CAAA,oBAAA,CAAA,CAEnP,UAAAC,CAAAA,EACCG,GAAAA,CAAC,OAAI,GAAA,CAAKH,CAAAA,CAAY,IAAI,mBAAA,CAAoB,SAAA,CAAU,YAAY,CAAA,CAErE,CAACA,GAAcG,GAAAA,CAAC,GAAA,CAAA,CAAE,UAAU,gCAAA,CAAiC,QAAA,CAAA,GAAA,CAAC,GACjE,CAAA,CACF,CAEJ,CAEA,IAAOG,CAAAA,CAAQR,EClBf,SAASS,CAAAA,CAAY,CACnB,QAAA,CAAAtC,CAAAA,CACA,WAAA,CAAAgB,EACA,SAAA,CAAAF,CAAAA,CACA,mBAAAyB,CAAAA,CAAqB,MAAA,CACrB,wBAAAC,CAAAA,CAA0B,SAC5B,EAAqB,CACnB,OACEJ,KAAC,KAAA,CAAA,CACC,GAAA,CAAKpB,EACL,KAAA,CAAO,CAAE,eAAgB,MAAA,CAAQ,eAAA,CAAiB,MAAO,CAAA,CACzD,SAAA,CAAU,gEAET,QAAA,CAAA,CAAAhB,CAAAA,CAAS,IAAI,CAACyC,CAAAA,CAAMC,IAAU,CAC7B,GAAID,EAAK,IAAA,GAAS,MAAA,CAChB,OACEP,GAAAA,CAAC,KAAA,CAAA,CAAgB,UAAU,oBAAA,CACzB,QAAA,CAAAA,IAAC,KAAA,CAAA,CACC,GAAA,CAAI,OACJ,KAAA,CAAO,CAAE,YAAa,SAAU,CAAA,CAChC,UAAW,CAAA,4CAAA,EAA+CK,CAAkB,2CAE3E,QAAA,CAAAE,CAAAA,CAAK,QAAQ,OAAA,CAAQ,cAAA,CAAgB,EAAE,CAAA,CAC1C,CAAA,CAAA,CAPQC,CAQV,CAAA,CAEJ,GAAID,EAAK,IAAA,GAAS,WAAA,CAChB,OACEP,GAAAA,CAAC,KAAA,CAAA,CAAgB,UAAU,kBAAA,CACzB,QAAA,CAAAA,IAAC,KAAA,CAAA,CACC,GAAA,CAAI,MACJ,KAAA,CAAO,CAAE,YAAa,SAAA,CAAW,OAAA,CAAS,cAAe,CAAA,CACzD,SAAA,CAAW,OAAOM,CAAuB,CAAA,6HAAA,CAAA,CAEzC,SAAAN,GAAAA,CAACS,CAAAA,CAAA,CAAU,QAAA,CAAAF,CAAAA,CAAK,OAAA,CAAQ,EAC1B,CAAA,CAAA,CAPQC,CAQV,CAGN,CAAC,CAAA,CACA5B,GACCoB,GAAAA,CAAC,KAAA,CAAA,CAAI,UAAU,kBAAA,CACb,QAAA,CAAAA,IAAC,KAAA,CAAA,CAAI,SAAA,CAAU,uEACb,QAAA,CAAAA,GAAAA,CAAC,QAAK,SAAA,CAAU,iCAAA,CAAkC,EACpD,CAAA,CACF,CAAA,CAAA,CAEJ,CAEJ,CAEA,IAAOU,EAAQN,CAAAA,CCrDf,SAASO,CAAAA,CAAU,CAAE,kBAAAzB,CAAAA,CAAmB,KAAA,CAAAR,CAAAA,CAAO,QAAA,CAAAC,CAAS,CAAA,CAAmB,CACzE,OACEuB,IAAAA,CAAC,OAAI,SAAA,CAAU,6BAAA,CACb,UAAAF,GAAAA,CAAC,UAAA,CAAA,CACC,UAAY,CAAA,EAAM,CACZ,EAAE,GAAA,GAAQ,OAAA,EAAW,CAAC,CAAA,CAAE,QAAA,GAC1B,EAAE,cAAA,EAAe,CACjBd,GAAkB,EAEtB,CAAA,CACA,MAAOR,CAAAA,CACP,QAAA,CAAW,GAAMC,CAAAA,CAAS,CAAA,CAAE,OAAO,KAAK,CAAA,CACxC,YAAY,oBAAA,CACZ,KAAA,CAAO,CACL,WAAA,CAAa,SAAA,CACb,eAAgB,MAAA,CAChB,eAAA,CAAiB,MACnB,CAAA,CACA,GAAA,CAAI,MAAA,CACJ,SAAA,CAAU,gLAAA,CACZ,CAAA,CACAqB,IAAC,QAAA,CAAA,CACC,OAAA,CAAS,IAAMd,CAAAA,EAAkB,CACjC,UAAU,wFAAA,CAEV,QAAA,CAAAc,IAACY,YAAAA,CAAA,CAAa,UAAU,SAAA,CAAU,CAAA,CACpC,GACF,CAEJ,CAEA,IAAOC,CAAAA,CAAQF,CAAAA,CCjCf,IAAMG,EAA2B,CAAA,CAAA,OAAA,CAC3BC,CAAAA,CAAkC,UAsBjC,SAASC,CAAAA,CAAQ,CACtB,MAAA,CAAAhD,CAAAA,CACA,aAAA4B,CAAAA,CACA,UAAA,CAAAC,EACA,cAAA,CAAAoB,CAAAA,CAAiB,UACjB,aAAA,CAAAC,CAAAA,CAAgB,IAChB,YAAA,CAAAC,CAAAA,CAAe,IACf,aAAA,CAAAC,CAAAA,CAAgB,EAChB,kBAAA,CAAAC,CAAAA,CAAqB,UACrB,SAAA,CAAAC,CAAAA,CAAY,UACZ,kBAAA,CAAAjB,CAAAA,CAAqB,UACrB,uBAAA,CAAAC,CAAAA,CAA0B,UAC1B,oBAAA,CAAAR,CAAAA,CAAuB,GACvB,qBAAA,CAAAC,CAAAA,CAAwB,GACxB,oBAAA,CAAAwB,CAAAA,CAAuB,GACvB,YAAA,CAAAlD,CAAAA,CAAe,kFACf,qBAAA,CAAAC,CAAAA,CAAwB,iEACxB,sBAAA,CAAAkD,CAAAA,CAAyB,EAC3B,CAAA,CAAiB,CACf,GAAM,CACJ,QAAA,CAAA1D,EACA,KAAA,CAAAY,CAAAA,CACA,SAAAC,CAAAA,CACA,iBAAA,CAAAO,CAAAA,CACA,WAAA,CAAAJ,CAAAA,CACA,SAAA,CAAAF,CACF,CAAA,CAAIc,CAAAA,CAAQ,CAAE,MAAA,CAAA1B,CAAAA,CAAQ,aAAAK,CAAAA,CAAc,qBAAA,CAAAC,CAAsB,CAAC,CAAA,CAC3D,OACE4B,IAAAA,CAACY,CAAAA,CAAA,CACC,QAAA,CAAA,CAAAd,GAAAA,CAACG,EAAA,CACC,YAAA,CAAcP,EACd,UAAA,CAAYC,CAAAA,CACZ,qBAAsBC,CAAAA,CACtB,qBAAA,CAAuBC,EACzB,CAAA,CACAC,GAAAA,CAACe,EAAA,CACC,SAAA,CAAW,OAAOE,CAAc,CAAA,MAAA,EAASM,CAAoB,CAAA,OAAA,EAAUL,CAAa,cAAcA,CAAa,CAAA,OAAA,EAAUC,CAAY,CAAA,YAAA,EAAeC,CAAa,CAAA,YAAA,EAAeC,CAAkB,CAAA,QAAA,EAAWC,CAAS,8CAA8CE,CAAsB,CAAA,GAAA,CAAA,CAE1R,SAAAtB,IAAAA,CAAC,KAAA,CAAA,CAAI,UAAU,gCAAA,CACb,QAAA,CAAA,CAAAF,IAAC,KAAA,CAAA,CAAI,SAAA,CAAU,iBACb,QAAA,CAAAA,GAAAA,CAACU,EAAA,CACC,QAAA,CAAU5C,EACV,WAAA,CAAagB,CAAAA,CACb,UAAWF,CAAAA,CACX,kBAAA,CAAoByB,EACpB,uBAAA,CAAyBC,CAAAA,CAC3B,EACF,CAAA,CAEAN,GAAAA,CAAC,OAAI,SAAA,CAAU,qCAAA,CACb,SAAAA,GAAAA,CAACa,CAAAA,CAAA,CACC,iBAAA,CAAmB3B,CAAAA,CACnB,MAAOR,CAAAA,CACP,QAAA,CAAUC,EACZ,CAAA,CACF,CAAA,CAAA,CACF,CAAA,CACF,CAAA,CAAA,CACF,CAEJ","file":"index.js","sourcesContent":["type chatWithGroqProps = {\r\n messages: {\r\n role: string;\r\n content: string;\r\n }[];\r\n model: string;\r\n apiKey: string;\r\n};\r\n\r\ntype response = {\r\n id: string;\r\n object: string;\r\n created: number;\r\n model: string;\r\n choices: {\r\n index: number;\r\n message: {\r\n role: string;\r\n content: string;\r\n reasoning?: string;\r\n };\r\n logprobs: null;\r\n finish_reason: string;\r\n }[];\r\n usage: {\r\n queue_time: number;\r\n prompt_tokens: number;\r\n prompt_time: number;\r\n completion_tokens: number;\r\n completion_time: number;\r\n total_tokens: number;\r\n total_time: number;\r\n prompt_tokens_details: {\r\n cached_tokens: number;\r\n };\r\n completion_tokens_details: {\r\n reasoning_tokens: number;\r\n };\r\n };\r\n usage_breakdown: null;\r\n system_fingerprint: string;\r\n x_groq: {\r\n id: string;\r\n seed: number;\r\n };\r\n service_tier: string;\r\n};\r\n\r\nexport async function chatWithGroq({\r\n messages,\r\n model,\r\n apiKey,\r\n}: chatWithGroqProps) {\r\n const url = \"https://api.groq.com/openai/v1/chat/completions\";\r\n const options = {\r\n method: \"POST\",\r\n headers: {\r\n Authorization: `Bearer ${apiKey}`,\r\n \"Content-Type\": \"application/json\",\r\n },\r\n body: JSON.stringify({\r\n model: model,\r\n messages,\r\n temperature: 0.3,\r\n }),\r\n };\r\n\r\n try {\r\n const response = await fetch(url, options);\r\n const result: response = await response.json();\r\n return result.choices[0].message;\r\n } catch (error) {\r\n console.error(error);\r\n return \"error\";\r\n }\r\n}\r\n","import { chatWithGroq } from \"@/api/groqApi\";\r\nimport { useEffect, useRef, useState } from \"react\";\r\n\r\nexport type UseChatProps = {\r\n apiKey: string;\r\n systemPrompt: string;\r\n assistantFirstMessage: string;\r\n};\r\n\r\nfunction useChat({\r\n apiKey,\r\n systemPrompt,\r\n assistantFirstMessage,\r\n}: UseChatProps) {\r\n const models = [\r\n \"openai/gpt-oss-120b\",\r\n \"llama-3.3-70b-versatile\",\r\n \"moonshotai/kimi-k2-instruct-0905\",\r\n \"meta-llama/llama-4-maverick-17b-128e-instruct\",\r\n \"meta-llama/llama-4-scout-17b-16e-instruct\",\r\n \"groq/compound\",\r\n \"openai/gpt-oss-20b\",\r\n \"openai/gpt-oss-safeguard-20b\",\r\n \"llama-3.1-8b-instant\",\r\n \"groq/compound-mini\",\r\n \"meta-llama/llama-guard-4-12b\",\r\n \"meta-llama/llama-prompt-guard-2-86m\",\r\n \"meta-llama/llama-prompt-guard-2-22m\",\r\n ];\r\n const [messages, setMessages] = useState([\r\n {\r\n role: \"system\",\r\n content: systemPrompt,\r\n },\r\n {\r\n role: \"assistant\",\r\n content: assistantFirstMessage,\r\n },\r\n ]);\r\n const [input, setInput] = useState(\"\");\r\n const [isLoading, setIsLoading] = useState(false);\r\n const messagesRef = useRef<HTMLDivElement>(null);\r\n const modelNumber = useRef(0);\r\n\r\n useEffect(() => {\r\n // Scroll to the bottom of the messages container\r\n messagesRef?.current?.scrollTo({\r\n top: messagesRef.current.scrollHeight,\r\n behavior: \"smooth\",\r\n });\r\n }, [messages]);\r\n\r\n function handleSendMessage(text = \"\") {\r\n const messageContent = typeof text === \"string\" ? text : \"\";\r\n if (!input.trim() && !messageContent.trim()) return;\r\n\r\n const userMessage = { role: \"user\", content: input || messageContent };\r\n const newMessages = [...messages, userMessage];\r\n\r\n setMessages(newMessages);\r\n setInput(\"\");\r\n setIsLoading(true);\r\n\r\n chatWithGroq({\r\n model: models[modelNumber.current],\r\n messages: newMessages,\r\n apiKey: apiKey,\r\n })\r\n .then((res) => {\r\n if (res === \"error\") {\r\n setMessages((prev) => [\r\n ...prev,\r\n {\r\n role: \"assistant\",\r\n content: \"Sorry, I encountered an error. Please try again.\",\r\n },\r\n ]);\r\n modelNumber.current++;\r\n if (modelNumber.current >= models.length) {\r\n modelNumber.current = 0;\r\n }\r\n } else {\r\n setMessages((prev) => [...prev, res]);\r\n }\r\n })\r\n .catch((err) => {\r\n console.error(err);\r\n })\r\n .finally(() => {\r\n setIsLoading(false);\r\n });\r\n }\r\n return {\r\n messages,\r\n input,\r\n setInput,\r\n handleSendMessage,\r\n messagesRef,\r\n isLoading,\r\n };\r\n}\r\n\r\nexport default useChat;\r\n","import { PopoverTrigger } from \"@radix-ui/react-popover\";\r\n\r\ntype ChatTriggerProps = {\r\n triggerColor?: string;\r\n triggerImg?: string;\r\n triggerRightPosition?: number;\r\n triggerBottomPosition?: number;\r\n};\r\n\r\nfunction ChatTrigger({\r\n triggerColor = \"#111\",\r\n triggerImg,\r\n triggerRightPosition = 24,\r\n triggerBottomPosition = 24,\r\n}: ChatTriggerProps) {\r\n return (\r\n <PopoverTrigger asChild>\r\n <button\r\n className={`fixed right-[${triggerRightPosition}px] ${triggerImg ? \"\" : \"h-14 w-14\"} bottom-[${triggerBottomPosition}px] z-10 cursor-pointer rounded-full bg-[${triggerColor}] p-1 shadow-lg transition-all hover:scale-110 hover:bg-[${triggerColor}]/90 active:scale-95`}\r\n >\r\n {triggerImg && (\r\n <img src={triggerImg} alt=\"Chat with chatbot\" className=\"h-14 w-14\" />\r\n )}\r\n {!triggerImg && <p className=\"text-white text-center text-xl\">C</p>}\r\n </button>\r\n </PopoverTrigger>\r\n );\r\n}\r\n\r\nexport default ChatTrigger;\r\n","import type { RefObject } from \"react\";\r\nimport Markdown from \"react-markdown\";\r\n\r\ntype MessageListProps = {\r\n messages: { role: string; content: string }[];\r\n messagesRef: RefObject<HTMLDivElement | null>;\r\n isLoading: boolean;\r\n userMessageBgColor?: string;\r\n assistantMessageBgColor?: string;\r\n};\r\n\r\nfunction MessageList({\r\n messages,\r\n messagesRef,\r\n isLoading,\r\n userMessageBgColor = \"#fff\",\r\n assistantMessageBgColor = \"#007bff\",\r\n}: MessageListProps) {\r\n return (\r\n <div\r\n ref={messagesRef}\r\n style={{ scrollbarWidth: \"none\", msOverflowStyle: \"none\" }}\r\n className=\" flex h-full flex-col gap-4 overflow-x-hidden overflow-y-auto\"\r\n >\r\n {messages.map((item, index) => {\r\n if (item.role === \"user\")\r\n return (\r\n <div key={index} className=\"flex justify-start\">\r\n <div\r\n dir=\"auto\"\r\n style={{ unicodeBidi: \"isolate\" }}\r\n className={`max-w-[95%] rounded-2xl rounded-bl-none bg-[${userMessageBgColor}] px-4 py-2 text-start text-sm shadow-sm`}\r\n >\r\n {item.content.replace(/\\[\\[.*?\\]\\]/g, \"\")}\r\n </div>\r\n </div>\r\n );\r\n if (item.role === \"assistant\") {\r\n return (\r\n <div key={index} className=\"flex justify-end\">\r\n <div\r\n dir=\"rtl\"\r\n style={{ unicodeBidi: \"isolate\", display: \"inline-block\" }}\r\n className={`bg-[${assistantMessageBgColor}] max-w-[95%] rounded-2xl rounded-br-none px-4 py-2 text-start text-sm wrap-break-word whitespace-normal text-white shadow-md`}\r\n >\r\n <Markdown>{item.content}</Markdown>\r\n </div>\r\n </div>\r\n );\r\n }\r\n })}\r\n {isLoading && (\r\n <div className=\"flex justify-end\">\r\n <div className=\"bg-red/90 rounded-2xl rounded-br-none px-4 py-2 text-white shadow-md\">\r\n <span className=\"loading loading-dots loading-xs\"></span>\r\n </div>\r\n </div>\r\n )}\r\n </div>\r\n );\r\n}\r\n\r\nexport default MessageList;\r\n","import { FaPaperPlane } from \"react-icons/fa\";\r\nimport { FaQuestionCircle } from \"react-icons/fa\";\r\n\r\ntype ChatInputProps = {\r\n handleSendMessage: (text?: string) => void;\r\n input: string;\r\n setInput: (text: string) => void;\r\n};\r\n\r\nfunction ChatInput({ handleSendMessage, input, setInput }: ChatInputProps) {\r\n return (\r\n <div className=\"flex h-full items-end gap-2\">\r\n <textarea\r\n onKeyDown={(e) => {\r\n if (e.key === \"Enter\" && !e.shiftKey) {\r\n e.preventDefault();\r\n handleSendMessage();\r\n }\r\n }}\r\n value={input}\r\n onChange={(e) => setInput(e.target.value)}\r\n placeholder=\"Ask me anything...\"\r\n style={{\r\n fieldSizing: \"content\",\r\n scrollbarWidth: \"none\",\r\n msOverflowStyle: \"none\",\r\n }}\r\n dir=\"auto\"\r\n className=\"auto-expand text-yellowish-white placeholder:text-dark-yellowish-white max-h-[20vh] min-h-6 w-full resize-none overflow-auto bg-transparent py-1 ring-transparent outline-none\"\r\n />\r\n <button\r\n onClick={() => handleSendMessage()}\r\n className=\"bg-red hover:bg-light-red cursor-pointer rounded-full p-2 text-white transition-colors\"\r\n >\r\n <FaPaperPlane className=\"h-4 w-4\" />\r\n </button>\r\n </div>\r\n );\r\n}\r\n\r\nexport default ChatInput;\r\n","import * as PopoverPrimitive from \"@radix-ui/react-popover\";\r\nimport useChat from \"./hooks/useChat\";\r\nimport ChatTrigger from \"./components/ChatTrigger\";\r\nimport MessageList from \"./components/MessageList\";\r\nimport ChatInput from \"./components/ChatInput\";\r\n\r\n// Custom popover components to avoid shadcn dependency\r\nconst Popover = PopoverPrimitive.Popover;\r\nconst PopoverContent = PopoverPrimitive.Content;\r\n\r\nexport type ChatBotProps = {\r\n apiKey: string;\r\n triggerColor?: string;\r\n triggerImg?: string;\r\n contentBgColor?: string;\r\n contentHeight?: number;\r\n contentWidth?: number;\r\n contentBorder?: number;\r\n contentBorderColor?: string;\r\n contentBorderRoundness?: number;\r\n textColor?: string;\r\n userMessageBgColor?: string;\r\n assistantMessageBgColor?: string;\r\n triggerRightPosition?: number;\r\n triggerBottomPosition?: number;\r\n contentRightPosition?: number;\r\n systemPrompt?: string;\r\n assistantFirstMessage?: string;\r\n};\r\n\r\nexport function ChatBot({\r\n apiKey,\r\n triggerColor,\r\n triggerImg,\r\n contentBgColor = \"#1a1a1a\",\r\n contentHeight = 500,\r\n contentWidth = 350,\r\n contentBorder = 1,\r\n contentBorderColor = \"#333333\",\r\n textColor = \"#ffffff\",\r\n userMessageBgColor = \"#007bff\",\r\n assistantMessageBgColor = \"#2d2d2d\",\r\n triggerRightPosition = 24,\r\n triggerBottomPosition = 24,\r\n contentRightPosition = 24,\r\n systemPrompt = `You are a helpful AI assistant. Provide clear, concise, and accurate responses.`,\r\n assistantFirstMessage = \"Hello! I'm here to help you. What can I assist you with today?\",\r\n contentBorderRoundness = 16,\r\n}: ChatBotProps) {\r\n const {\r\n messages,\r\n input,\r\n setInput,\r\n handleSendMessage,\r\n messagesRef,\r\n isLoading,\r\n } = useChat({ apiKey, systemPrompt, assistantFirstMessage });\r\n return (\r\n <Popover>\r\n <ChatTrigger\r\n triggerColor={triggerColor}\r\n triggerImg={triggerImg}\r\n triggerRightPosition={triggerRightPosition}\r\n triggerBottomPosition={triggerBottomPosition}\r\n />\r\n <PopoverContent\r\n className={`bg-[${contentBgColor}] mr-[${contentRightPosition}px] h-[${contentHeight}px] max-h-[${contentHeight}px] w-[${contentWidth}px] border-[${contentBorder}px] border-[${contentBorderColor}] text-[${textColor}] shadow-2xl ring-1 ring-white/10 rounded-[${contentBorderRoundness}px]`}\r\n >\r\n <div className=\"flex h-full flex-col gap-4 p-2\">\r\n <div className=\"min-h-0 flex-1\">\r\n <MessageList\r\n messages={messages}\r\n messagesRef={messagesRef}\r\n isLoading={isLoading}\r\n userMessageBgColor={userMessageBgColor}\r\n assistantMessageBgColor={assistantMessageBgColor}\r\n />\r\n </div>\r\n\r\n <div className=\"shrink-0 rounded-xl bg-black/40 p-2\">\r\n <ChatInput\r\n handleSendMessage={handleSendMessage}\r\n input={input}\r\n setInput={setInput}\r\n />\r\n </div>\r\n </div>\r\n </PopoverContent>\r\n </Popover>\r\n );\r\n}\r\n"]}
1
+ {"version":3,"sources":["../src/api/groqApi.ts","../src/ChatBot/hooks/useChat.tsx","../src/ChatBot/components/ChatTrigger.tsx","../src/ChatBot/components/MessageList.tsx","../src/ChatBot/components/ChatInput.tsx","../src/ChatBot/ChatBot.tsx"],"names":["chatWithGroq","messages","model","apiKey","url","options","error","useChat","systemPrompt","assistantFirstMessage","models","setMessages","useState","input","setInput","isLoading","setIsLoading","messagesRef","useRef","modelNumber","useEffect","handleSendMessage","text","messageContent","userMessage","newMessages","res","prev","err","useChat_default","ChatTrigger","triggerColor","triggerImg","triggerRightPosition","triggerBottomPosition","jsx","PopoverTrigger","jsxs","ChatTrigger_default","MessageList","userMessageBgColor","assistantMessageBgColor","item","index","Markdown","MessageList_default","ChatInput","FaPaperPlane","ChatInput_default","Popover","PopoverContent","ChatBot","contentBgColor","contentHeight","contentWidth","contentBorder","contentBorderColor","textColor","contentRightPosition","contentBorderRoundness"],"mappings":"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","file":"index.js","sourcesContent":["type chatWithGroqProps = {\r\n messages: {\r\n role: string;\r\n content: string;\r\n }[];\r\n model: string;\r\n apiKey: string;\r\n};\r\n\r\ntype response = {\r\n id: string;\r\n object: string;\r\n created: number;\r\n model: string;\r\n choices: {\r\n index: number;\r\n message: {\r\n role: string;\r\n content: string;\r\n reasoning?: string;\r\n };\r\n logprobs: null;\r\n finish_reason: string;\r\n }[];\r\n usage: {\r\n queue_time: number;\r\n prompt_tokens: number;\r\n prompt_time: number;\r\n completion_tokens: number;\r\n completion_time: number;\r\n total_tokens: number;\r\n total_time: number;\r\n prompt_tokens_details: {\r\n cached_tokens: number;\r\n };\r\n completion_tokens_details: {\r\n reasoning_tokens: number;\r\n };\r\n };\r\n usage_breakdown: null;\r\n system_fingerprint: string;\r\n x_groq: {\r\n id: string;\r\n seed: number;\r\n };\r\n service_tier: string;\r\n};\r\n\r\nexport async function chatWithGroq({\r\n messages,\r\n model,\r\n apiKey,\r\n}: chatWithGroqProps) {\r\n const url = \"https://api.groq.com/openai/v1/chat/completions\";\r\n const options = {\r\n method: \"POST\",\r\n headers: {\r\n Authorization: `Bearer ${apiKey}`,\r\n \"Content-Type\": \"application/json\",\r\n },\r\n body: JSON.stringify({\r\n model: model,\r\n messages,\r\n temperature: 0.3,\r\n }),\r\n };\r\n\r\n try {\r\n const response = await fetch(url, options);\r\n const result: response = await response.json();\r\n return result.choices[0].message;\r\n } catch (error) {\r\n console.error(error);\r\n return \"error\";\r\n }\r\n}\r\n","import { chatWithGroq } from \"@/api/groqApi\";\r\nimport { useEffect, useRef, useState } from \"react\";\r\n\r\nexport type UseChatProps = {\r\n apiKey: string;\r\n systemPrompt: string;\r\n assistantFirstMessage: string;\r\n};\r\n\r\nfunction useChat({\r\n apiKey,\r\n systemPrompt,\r\n assistantFirstMessage,\r\n}: UseChatProps) {\r\n const models = [\r\n \"openai/gpt-oss-120b\",\r\n \"llama-3.3-70b-versatile\",\r\n \"moonshotai/kimi-k2-instruct-0905\",\r\n \"meta-llama/llama-4-maverick-17b-128e-instruct\",\r\n \"meta-llama/llama-4-scout-17b-16e-instruct\",\r\n \"groq/compound\",\r\n \"openai/gpt-oss-20b\",\r\n \"openai/gpt-oss-safeguard-20b\",\r\n \"llama-3.1-8b-instant\",\r\n \"groq/compound-mini\",\r\n \"meta-llama/llama-guard-4-12b\",\r\n \"meta-llama/llama-prompt-guard-2-86m\",\r\n \"meta-llama/llama-prompt-guard-2-22m\",\r\n ];\r\n const [messages, setMessages] = useState([\r\n {\r\n role: \"system\",\r\n content: systemPrompt,\r\n },\r\n {\r\n role: \"assistant\",\r\n content: assistantFirstMessage,\r\n },\r\n ]);\r\n const [input, setInput] = useState(\"\");\r\n const [isLoading, setIsLoading] = useState(false);\r\n const messagesRef = useRef<HTMLDivElement>(null);\r\n const modelNumber = useRef(0);\r\n\r\n useEffect(() => {\r\n // Scroll to the bottom of the messages container\r\n messagesRef?.current?.scrollTo({\r\n top: messagesRef.current.scrollHeight,\r\n behavior: \"smooth\",\r\n });\r\n }, [messages]);\r\n\r\n function handleSendMessage(text = \"\") {\r\n const messageContent = typeof text === \"string\" ? text : \"\";\r\n if (!input.trim() && !messageContent.trim()) return;\r\n\r\n const userMessage = { role: \"user\", content: input || messageContent };\r\n const newMessages = [...messages, userMessage];\r\n\r\n setMessages(newMessages);\r\n setInput(\"\");\r\n setIsLoading(true);\r\n\r\n chatWithGroq({\r\n model: models[modelNumber.current],\r\n messages: newMessages,\r\n apiKey: apiKey,\r\n })\r\n .then((res) => {\r\n if (res === \"error\") {\r\n setMessages((prev) => [\r\n ...prev,\r\n {\r\n role: \"assistant\",\r\n content: \"Sorry, I encountered an error. Please try again.\",\r\n },\r\n ]);\r\n modelNumber.current++;\r\n if (modelNumber.current >= models.length) {\r\n modelNumber.current = 0;\r\n }\r\n } else {\r\n setMessages((prev) => [...prev, res]);\r\n }\r\n })\r\n .catch((err) => {\r\n console.error(err);\r\n })\r\n .finally(() => {\r\n setIsLoading(false);\r\n });\r\n }\r\n return {\r\n messages,\r\n input,\r\n setInput,\r\n handleSendMessage,\r\n messagesRef,\r\n isLoading,\r\n };\r\n}\r\n\r\nexport default useChat;\r\n","import { PopoverTrigger } from \"@radix-ui/react-popover\";\r\n\r\ntype ChatTriggerProps = {\r\n triggerColor?: string;\r\n triggerImg?: string;\r\n triggerRightPosition?: number;\r\n triggerBottomPosition?: number;\r\n};\r\n\r\nfunction ChatTrigger({\r\n triggerColor = \"#111\",\r\n triggerImg,\r\n triggerRightPosition = 24,\r\n triggerBottomPosition = 24,\r\n}: ChatTriggerProps) {\r\n return (\r\n <PopoverTrigger asChild>\r\n <button\r\n className=\"fixed z-10 cursor-pointer rounded-full p-1 shadow-lg transition-all hover:scale-110 active:scale-95\"\r\n style={{\r\n right: `${triggerRightPosition}px`,\r\n bottom: `${triggerBottomPosition}px`,\r\n backgroundColor: triggerColor,\r\n width: triggerImg ? \"auto\" : \"56px\",\r\n height: triggerImg ? \"auto\" : \"56px\",\r\n }}\r\n >\r\n {triggerImg && (\r\n <img src={triggerImg} alt=\"Chat with chatbot\" className=\"h-14 w-14\" />\r\n )}\r\n {!triggerImg && <p className=\"text-white text-center text-xl\">C</p>}\r\n </button>\r\n </PopoverTrigger>\r\n );\r\n}\r\n\r\nexport default ChatTrigger;\r\n","import type { RefObject } from \"react\";\r\nimport Markdown from \"react-markdown\";\r\n\r\ntype MessageListProps = {\r\n messages: { role: string; content: string }[];\r\n messagesRef: RefObject<HTMLDivElement | null>;\r\n isLoading: boolean;\r\n userMessageBgColor?: string;\r\n assistantMessageBgColor?: string;\r\n};\r\n\r\nfunction MessageList({\r\n messages,\r\n messagesRef,\r\n isLoading,\r\n userMessageBgColor = \"#fff\",\r\n assistantMessageBgColor = \"#007bff\",\r\n}: MessageListProps) {\r\n return (\r\n <div\r\n ref={messagesRef}\r\n style={{ scrollbarWidth: \"none\", msOverflowStyle: \"none\" }}\r\n className=\" flex h-full flex-col gap-4 overflow-x-hidden overflow-y-auto\"\r\n >\r\n {messages.map((item, index) => {\r\n if (item.role === \"user\")\r\n return (\r\n <div key={index} className=\"flex justify-start\">\r\n <div\r\n dir=\"auto\"\r\n style={{\r\n unicodeBidi: \"isolate\",\r\n backgroundColor: userMessageBgColor,\r\n }}\r\n className=\"max-w-[95%] rounded-2xl rounded-bl-none px-4 py-2 text-start text-sm shadow-sm\"\r\n >\r\n {item.content.replace(/\\[\\[.*?\\]\\]/g, \"\")}\r\n </div>\r\n </div>\r\n );\r\n if (item.role === \"assistant\") {\r\n return (\r\n <div key={index} className=\"flex justify-end\">\r\n <div\r\n dir=\"rtl\"\r\n style={{\r\n unicodeBidi: \"isolate\",\r\n display: \"inline-block\",\r\n backgroundColor: assistantMessageBgColor,\r\n }}\r\n className=\"max-w-[95%] rounded-2xl rounded-br-none px-4 py-2 text-start text-sm wrap-break-word whitespace-normal text-white shadow-md\"\r\n >\r\n <Markdown>{item.content}</Markdown>\r\n </div>\r\n </div>\r\n );\r\n }\r\n })}\r\n {isLoading && (\r\n <div className=\"flex justify-end\">\r\n <div className=\"bg-red/90 rounded-2xl rounded-br-none px-4 py-2 text-white shadow-md\">\r\n <span className=\"loading loading-dots loading-xs\"></span>\r\n </div>\r\n </div>\r\n )}\r\n </div>\r\n );\r\n}\r\n\r\nexport default MessageList;\r\n","import { FaPaperPlane } from \"react-icons/fa\";\r\nimport { FaQuestionCircle } from \"react-icons/fa\";\r\n\r\ntype ChatInputProps = {\r\n handleSendMessage: (text?: string) => void;\r\n input: string;\r\n setInput: (text: string) => void;\r\n};\r\n\r\nfunction ChatInput({ handleSendMessage, input, setInput }: ChatInputProps) {\r\n return (\r\n <div className=\"flex h-full items-end gap-2\">\r\n <textarea\r\n onKeyDown={(e) => {\r\n if (e.key === \"Enter\" && !e.shiftKey) {\r\n e.preventDefault();\r\n handleSendMessage();\r\n }\r\n }}\r\n value={input}\r\n onChange={(e) => setInput(e.target.value)}\r\n placeholder=\"Ask me anything...\"\r\n style={{\r\n fieldSizing: \"content\",\r\n scrollbarWidth: \"none\",\r\n msOverflowStyle: \"none\",\r\n }}\r\n dir=\"auto\"\r\n className=\"auto-expand text-yellowish-white placeholder:text-dark-yellowish-white max-h-[20vh] min-h-6 w-full resize-none overflow-auto bg-transparent py-1 ring-transparent outline-none\"\r\n />\r\n <button\r\n onClick={() => handleSendMessage()}\r\n className=\"bg-red hover:bg-light-red cursor-pointer rounded-full p-2 text-white transition-colors\"\r\n >\r\n <FaPaperPlane className=\"h-4 w-4\" />\r\n </button>\r\n </div>\r\n );\r\n}\r\n\r\nexport default ChatInput;\r\n","import * as PopoverPrimitive from \"@radix-ui/react-popover\";\r\nimport useChat from \"./hooks/useChat\";\r\nimport ChatTrigger from \"./components/ChatTrigger\";\r\nimport MessageList from \"./components/MessageList\";\r\nimport ChatInput from \"./components/ChatInput\";\r\n\r\n// Custom popover components to avoid shadcn dependency\r\nconst Popover = PopoverPrimitive.Popover;\r\nconst PopoverContent = PopoverPrimitive.Content;\r\n\r\nexport type ChatBotProps = {\r\n apiKey: string;\r\n triggerColor?: string;\r\n triggerImg?: string;\r\n contentBgColor?: string;\r\n contentHeight?: number;\r\n contentWidth?: number;\r\n contentBorder?: number;\r\n contentBorderColor?: string;\r\n contentBorderRoundness?: number;\r\n textColor?: string;\r\n userMessageBgColor?: string;\r\n assistantMessageBgColor?: string;\r\n triggerRightPosition?: number;\r\n triggerBottomPosition?: number;\r\n contentRightPosition?: number;\r\n systemPrompt?: string;\r\n assistantFirstMessage?: string;\r\n};\r\n\r\nexport function ChatBot({\r\n apiKey,\r\n triggerColor,\r\n triggerImg,\r\n contentBgColor = \"#1a1a1a\",\r\n contentHeight = 500,\r\n contentWidth = 350,\r\n contentBorder = 1,\r\n contentBorderColor = \"#333333\",\r\n textColor = \"#ffffff\",\r\n userMessageBgColor = \"#007bff\",\r\n assistantMessageBgColor = \"#2d2d2d\",\r\n triggerRightPosition = 24,\r\n triggerBottomPosition = 24,\r\n contentRightPosition = 24,\r\n systemPrompt = `You are a helpful AI assistant. Provide clear, concise, and accurate responses.`,\r\n assistantFirstMessage = \"Hello! I'm here to help you. What can I assist you with today?\",\r\n contentBorderRoundness = 16,\r\n}: ChatBotProps) {\r\n const {\r\n messages,\r\n input,\r\n setInput,\r\n handleSendMessage,\r\n messagesRef,\r\n isLoading,\r\n } = useChat({ apiKey, systemPrompt, assistantFirstMessage });\r\n return (\r\n <Popover>\r\n <ChatTrigger\r\n triggerColor={triggerColor}\r\n triggerImg={triggerImg}\r\n triggerRightPosition={triggerRightPosition}\r\n triggerBottomPosition={triggerBottomPosition}\r\n />\r\n <PopoverContent\r\n className=\"shadow-2xl ring-1 ring-white/10\"\r\n style={{\r\n backgroundColor: contentBgColor,\r\n marginRight: `${contentRightPosition}px`,\r\n height: `${contentHeight}px`,\r\n maxHeight: `${contentHeight}px`,\r\n width: `${contentWidth}px`,\r\n border: `${contentBorder}px solid ${contentBorderColor}`,\r\n color: textColor,\r\n borderRadius: `${contentBorderRoundness}px`,\r\n }}\r\n >\r\n <div className=\"flex h-full flex-col gap-4 p-2\">\r\n <div className=\"min-h-0 flex-1\">\r\n <MessageList\r\n messages={messages}\r\n messagesRef={messagesRef}\r\n isLoading={isLoading}\r\n userMessageBgColor={userMessageBgColor}\r\n assistantMessageBgColor={assistantMessageBgColor}\r\n />\r\n </div>\r\n\r\n <div className=\"shrink-0 rounded-xl bg-black/40 p-2\">\r\n <ChatInput\r\n handleSendMessage={handleSendMessage}\r\n input={input}\r\n setInput={setInput}\r\n />\r\n </div>\r\n </div>\r\n </PopoverContent>\r\n </Popover>\r\n );\r\n}\r\n"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "react-groq-chat",
3
- "version": "1.0.4",
3
+ "version": "1.0.6",
4
4
  "description": "A modern, customizable React component for integrating a chatbot with the Groq API",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.js",