chatx-ai 1.0.4 → 1.0.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.
Files changed (5) hide show
  1. package/dist/index.js +6 -6
  2. package/dist/index.js.map +1 -1
  3. package/dist/index.mjs +6 -6
  4. package/dist/index.mjs.map +1 -1
  5. package/package.json +2 -5
package/dist/index.js CHANGED
@@ -1,12 +1,12 @@
1
1
  "use client";
2
- "use strict";var w=Object.defineProperty;var P=Object.getOwnPropertyDescriptor;var _=Object.getOwnPropertyNames;var T=Object.prototype.hasOwnProperty;var j=(t,r)=>{for(var a in r)w(t,a,{get:r[a],enumerable:!0})},A=(t,r,a,e)=>{if(r&&typeof r=="object"||typeof r=="function")for(let i of _(r))!T.call(t,i)&&i!==a&&w(t,i,{get:()=>r[i],enumerable:!(e=P(r,i))||e.enumerable});return t};var B=t=>A(w({},"__esModule",{value:!0}),t);var F={};j(F,{default:()=>$});module.exports=B(F);var M=require("react"),z=require("lucide-react");var N=require("react"),c=require("lucide-react");var h=require("react"),k=require("@google/generative-ai"),d=require("react/jsx-runtime"),U=({apiKey:t,botName:r,systemInstruction:a})=>{let[e,i]=(0,h.useState)(""),[n,p]=(0,h.useState)(()=>{if(typeof window<"u"){let l=localStorage.getItem("chatMessages");return l?JSON.parse(l):[{sender:"ai",text:`Hello! I'm ${r}. How can I help you today?`}]}return[{sender:"ai",text:`Hello! I'm ${r}. How can I help you today?`}]});(0,h.useEffect)(()=>{typeof window<"u"&&localStorage.setItem("chatMessages",JSON.stringify(n))},[n]);let E=async l=>{if(l.preventDefault(),!e.trim())return;if(!t){console.error("API key is missing. Please provide a valid API key.");return}p(g=>[...g,{sender:"user",text:e}]);let u=e;i("");try{let f=new k.GoogleGenerativeAI(t).getGenerativeModel({model:"gemini-2.5-flash"}),m=`
3
- ${a}
2
+ "use strict";var g=Object.defineProperty;var S=Object.getOwnPropertyDescriptor;var T=Object.getOwnPropertyNames;var B=Object.prototype.hasOwnProperty;var A=(e,a)=>{for(var r in a)g(e,r,{get:a[r],enumerable:!0})},z=(e,a,r,t)=>{if(a&&typeof a=="object"||typeof a=="function")for(let s of T(a))!B.call(e,s)&&s!==r&&g(e,s,{get:()=>a[s],enumerable:!(t=S(a,s))||t.enumerable});return e};var U=e=>z(g({},"__esModule",{value:!0}),e);var X={};A(X,{default:()=>L});module.exports=U(X);var k=require("react"),P=require("lucide-react");var N=require("react"),l=require("lucide-react");var b=require("react"),w=require("@google/generative-ai"),c=require("react/jsx-runtime"),R=({apiKey:e,botName:a,systemInstruction:r})=>{let[t,s]=(0,b.useState)(""),[n,p]=(0,b.useState)(()=>{if(typeof window<"u"){let i=localStorage.getItem("chatMessages");return i?JSON.parse(i):[{sender:"ai",text:`Hello! I'm ${a}. How can I help you today?`}]}return[{sender:"ai",text:`Hello! I'm ${a}. How can I help you today?`}]});(0,b.useEffect)(()=>{typeof window<"u"&&localStorage.setItem("chatMessages",JSON.stringify(n))},[n]);let E=async i=>{if(i.preventDefault(),!t.trim())return;if(!e){console.error("API key is missing. Please provide a valid API key.");return}p(h=>[...h,{sender:"user",text:t}]);let f=t;s("");try{let u=new w.GoogleGenerativeAI(e).getGenerativeModel({model:"gemini-2.5-flash"}),x=`
3
+ ${r}
4
4
 
5
5
  Previous conversation history:
6
- ${n.slice(1).map(b=>`${b.sender}: ${b.text}`).join(`
6
+ ${n.slice(1).map(m=>`${m.sender}: ${m.text}`).join(`
7
7
  `)}
8
8
 
9
- User asking: ${u}
10
- `,y=(await(await f.generateContent(m)).response).text();if(!y)throw new Error("Empty response from AI");p(b=>[...b,{sender:"ai",text:y}])}catch(g){console.error("Chat Error:",g);let f="I'm sorry, I'm having trouble connecting right now. Please try again later.";p(m=>[...m,{sender:"ai",text:f}])}};return(0,d.jsxs)("section",{className:"h-full flex flex-col relative max-w-100 mx-auto",children:[(0,d.jsx)("div",{className:"flex-1 px-4 py-3 space-y-3 bg-white overflow-y-auto",style:{maxHeight:"320px",scrollBehavior:"smooth"},children:n.map((l,u)=>(0,d.jsx)("div",{className:"flex w-full",children:(0,d.jsx)("div",{className:`px-3 py-2 rounded-xl shadow-sm border text-sm max-w-[80%] ${l.sender==="ai"?"bg-gray-50 border-gray-100 text-gray-800":"bg-blue-600 text-white border-blue-700 ml-auto"}`,children:l.text})},u))}),(0,d.jsxs)("form",{onSubmit:E,className:"shrink-0 flex gap-2 border-t border-gray-100 px-4 py-3 bg-white rounded-b-2xl w-full",children:[(0,d.jsx)("input",{id:"chat-input",type:"text",placeholder:"Type a message...",className:"flex-1 bg-gray-50 outline-none text-sm text-gray-800 placeholder:text-gray-400 px-2 py-1 rounded-lg border border-gray-200 focus:border-blue-300 transition",onChange:l=>i(l.target.value),value:e}),(0,d.jsx)("button",{type:"submit",className:"bg-blue-600 text-white px-4 py-1 rounded-lg text-sm shadow-sm font-medium hover:bg-blue-700 transition",children:"Send"})]})]})},C=U;var o=require("react/jsx-runtime"),R=({onClose:t,apiKey:r,botName:a,systemInstruction:e})=>{let[i,n]=(0,N.useState)(!1);return(0,o.jsxs)("div",{className:"fixed bottom-14 right-8 w-80 h-72 md:w-96 md:h-105 rounded-2xl shadow-lg bg-white font-mono border border-gray-200",children:[(0,o.jsxs)("header",{className:"flex items-center justify-between px-6 py-4 bg-white border-b shadow border-gray-100 rounded-t-2xl",children:[(0,o.jsxs)("div",{className:"flex items-center gap-3",children:[(0,o.jsx)("span",{className:"bg-blue-950 p-2 rounded-full shadow-sm",children:(0,o.jsx)(c.Bot,{className:"w-5 h-5 text-white"})}),(0,o.jsxs)("div",{children:[(0,o.jsx)("div",{className:"text-gray-900 font-semibold text-md tracking-wide",children:a}),(0,o.jsx)("div",{className:"text-gray-500 text-xs flex items-center",children:(0,o.jsx)("span",{children:"Online 24/7"})})]})]}),(0,o.jsxs)("div",{children:[(0,o.jsx)("button",{onClick:()=>n(!0),"aria-label":"Settings",className:"text-gray-400 hover:text-gray-700 bg-transparent p-2 rounded-md transition-all duration-200 focus:outline-none focus:ring-2 focus:ring-blue-200 hover:bg-gray-100 mr-2 cursor-pointer",children:(0,o.jsx)(c.Trash2,{className:"w-5 h-5"})}),(0,o.jsx)("button",{onClick:t,"aria-label":"Minimize chat",className:"text-gray-400 hover:text-gray-700 bg-transparent p-2 rounded-md transition-all duration-200 focus:outline-none focus:ring-2 focus:ring-blue-200 hover:bg-gray-100 cursor-pointer",children:(0,o.jsx)(c.Minimize2,{className:"w-5 h-5"})})]})]}),(0,o.jsx)("main",{className:"h-full",children:(0,o.jsx)(C,{apiKey:r,botName:a,systemInstruction:e})}),i&&(0,o.jsx)("div",{className:"fixed inset-0 border shadow bg-opacity-50 flex items-center justify-center",children:(0,o.jsxs)("div",{className:"bg-white p-6 rounded-lg shadow-lg",children:[(0,o.jsx)("h2",{className:"text-lg font-semibold mb-4 text-gray-800",children:"Clear Conversation"}),(0,o.jsx)("p",{className:"text-sm text-gray-600 mb-6",children:"Are you sure you want to clear the conversation?"}),(0,o.jsxs)("div",{className:"flex justify-end gap-4",children:[(0,o.jsx)("button",{onClick:()=>n(!1),className:"px-4 py-2 bg-gray-200 text-gray-700 rounded-md hover:bg-gray-300",children:"Cancel"}),(0,o.jsx)("button",{onClick:()=>{typeof window<"u"&&(localStorage.removeItem("chatMessages"),window.location.reload())},className:"px-4 py-2 bg-red-600 text-white rounded-md hover:bg-red-700",children:"Clear"})]})]})})]})},I=R;var s=require("react/jsx-runtime"),L=({apiKey:t,botName:r,systemInstruction:a})=>{let[e,i]=(0,M.useState)(!1);return(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)("button",{onClick:()=>{i(!0)},children:(0,s.jsx)("div",{className:"bg-amber-50 p-4 rounded-full shadow-md fixed bottom-10 right-10 w-16 h-16 flex items-center justify-center cursor-pointer hover:bg-blue-950 transition transform-fill ring:b-amber-500 focus:bg-amber-900 duration-300 border-gray-300 dark:border-white border-2 text-black hover:text-white",children:(0,s.jsx)(z.Bot,{className:"w-10 h-10"})})}),(0,s.jsx)("div",{className:`transition-opacity duration-100 ease-linear ${e?"opacity-100":"opacity-0 pointer-events-none"}`,children:e&&(0,s.jsx)(I,{onClose:()=>{i(!1)},apiKey:t,botName:r,systemInstruction:a})})]})},S=L;function x(t,{insertAt:r}={}){if(!t||typeof document>"u")return;let a=document.head||document.getElementsByTagName("head")[0],e=document.createElement("style");e.type="text/css",r==="top"&&a.firstChild?a.insertBefore(e,a.firstChild):a.appendChild(e),e.styleSheet?e.styleSheet.cssText=t:e.appendChild(document.createTextNode(t))}x(`/*! tailwindcss v4.1.18 | MIT License | https://tailwindcss.com */@layer properties;@layer theme,base,components,utilities;@layer theme{:root,:host{--font-sans: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--color-red-600: oklch(57.7% .245 27.325);--color-red-700: oklch(50.5% .213 27.518);--color-amber-50: oklch(98.7% .022 95.277);--color-amber-900: oklch(41.4% .112 45.904);--color-blue-200: oklch(88.2% .059 254.128);--color-blue-300: oklch(80.9% .105 251.813);--color-blue-600: oklch(54.6% .245 262.881);--color-blue-700: oklch(48.8% .243 264.376);--color-blue-950: oklch(28.2% .091 267.935);--color-gray-50: oklch(98.5% .002 247.839);--color-gray-100: oklch(96.7% .003 264.542);--color-gray-200: oklch(92.8% .006 264.531);--color-gray-300: oklch(87.2% .01 258.338);--color-gray-400: oklch(70.7% .022 261.325);--color-gray-500: oklch(55.1% .027 264.364);--color-gray-600: oklch(44.6% .03 256.802);--color-gray-700: oklch(37.3% .034 259.733);--color-gray-800: oklch(27.8% .033 256.848);--color-gray-900: oklch(21% .034 264.665);--color-black: #000;--color-white: #fff;--spacing: .25rem;--text-xs: .75rem;--text-xs--line-height: calc(1 / .75);--text-sm: .875rem;--text-sm--line-height: calc(1.25 / .875);--text-lg: 1.125rem;--text-lg--line-height: calc(1.75 / 1.125);--font-weight-medium: 500;--font-weight-semibold: 600;--tracking-wide: .025em;--radius-md: .375rem;--radius-lg: .5rem;--radius-xl: .75rem;--radius-2xl: 1rem;--default-transition-duration: .15s;--default-transition-timing-function: cubic-bezier(.4, 0, .2, 1);--default-font-family: var(--font-sans);--default-mono-font-family: var(--font-mono)}}@layer base{*,:after,:before,::backdrop,::file-selector-button{box-sizing:border-box;margin:0;padding:0;border:0 solid}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:var(--default-font-family, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings, normal);font-variation-settings:var(--default-font-variation-settings, normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-feature-settings:var(--default-mono-font-feature-settings, normal);font-variation-settings:var(--default-mono-font-variation-settings, normal);font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea,::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;border-radius:0;background-color:transparent;opacity:1}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::-moz-placeholder{opacity:1}::placeholder{opacity:1}@supports (not (-webkit-appearance: -apple-pay-button)) or (contain-intrinsic-size: 1px){::-moz-placeholder{color:currentcolor;@supports (color: color-mix(in lab,red,red)){color:color-mix(in oklab,currentcolor 50%,transparent)}}::placeholder{color:currentcolor;@supports (color: color-mix(in lab,red,red)){color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit,::-webkit-datetime-edit-year-field,::-webkit-datetime-edit-month-field,::-webkit-datetime-edit-day-field,::-webkit-datetime-edit-hour-field,::-webkit-datetime-edit-minute-field,::-webkit-datetime-edit-second-field,::-webkit-datetime-edit-millisecond-field,::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]),::file-selector-button{-webkit-appearance:button;-moz-appearance:button;appearance:button}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer utilities{.pointer-events-none{pointer-events:none}.fixed{position:fixed}.relative{position:relative}.inset-0{inset:calc(var(--spacing) * 0)}.right-8{right:calc(var(--spacing) * 8)}.right-10{right:calc(var(--spacing) * 10)}.bottom-10{bottom:calc(var(--spacing) * 10)}.bottom-14{bottom:calc(var(--spacing) * 14)}.mx-auto{margin-inline:auto}.mr-2{margin-right:calc(var(--spacing) * 2)}.mb-4{margin-bottom:calc(var(--spacing) * 4)}.mb-6{margin-bottom:calc(var(--spacing) * 6)}.ml-auto{margin-left:auto}.flex{display:flex}.h-5{height:calc(var(--spacing) * 5)}.h-10{height:calc(var(--spacing) * 10)}.h-16{height:calc(var(--spacing) * 16)}.h-72{height:calc(var(--spacing) * 72)}.h-full{height:100%}.w-5{width:calc(var(--spacing) * 5)}.w-10{width:calc(var(--spacing) * 10)}.w-16{width:calc(var(--spacing) * 16)}.w-80{width:calc(var(--spacing) * 80)}.w-full{width:100%}.max-w-100{max-width:calc(var(--spacing) * 100)}.max-w-\\[80\\%\\]{max-width:80%}.flex-1{flex:1}.shrink-0{flex-shrink:0}.cursor-pointer{cursor:pointer}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.justify-end{justify-content:flex-end}.gap-2{gap:calc(var(--spacing) * 2)}.gap-3{gap:calc(var(--spacing) * 3)}.gap-4{gap:calc(var(--spacing) * 4)}.space-y-3{:where(&>:not(:last-child)){--tw-space-y-reverse: 0;margin-block-start:calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)))}}.overflow-y-auto{overflow-y:auto}.rounded-2xl{border-radius:var(--radius-2xl)}.rounded-full{border-radius:calc(infinity * 1px)}.rounded-lg{border-radius:var(--radius-lg)}.rounded-md{border-radius:var(--radius-md)}.rounded-xl{border-radius:var(--radius-xl)}.rounded-t-2xl{border-top-left-radius:var(--radius-2xl);border-top-right-radius:var(--radius-2xl)}.rounded-b-2xl{border-bottom-right-radius:var(--radius-2xl);border-bottom-left-radius:var(--radius-2xl)}.border{border-style:var(--tw-border-style);border-width:1px}.border-2{border-style:var(--tw-border-style);border-width:2px}.border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-blue-700{border-color:var(--color-blue-700)}.border-gray-100{border-color:var(--color-gray-100)}.border-gray-200{border-color:var(--color-gray-200)}.border-gray-300{border-color:var(--color-gray-300)}.bg-amber-50{background-color:var(--color-amber-50)}.bg-blue-600{background-color:var(--color-blue-600)}.bg-blue-950{background-color:var(--color-blue-950)}.bg-gray-50{background-color:var(--color-gray-50)}.bg-gray-200{background-color:var(--color-gray-200)}.bg-red-600{background-color:var(--color-red-600)}.bg-transparent{background-color:transparent}.bg-white{background-color:var(--color-white)}.p-2{padding:calc(var(--spacing) * 2)}.p-4{padding:calc(var(--spacing) * 4)}.p-6{padding:calc(var(--spacing) * 6)}.px-2{padding-inline:calc(var(--spacing) * 2)}.px-3{padding-inline:calc(var(--spacing) * 3)}.px-4{padding-inline:calc(var(--spacing) * 4)}.px-6{padding-inline:calc(var(--spacing) * 6)}.py-1{padding-block:calc(var(--spacing) * 1)}.py-2{padding-block:calc(var(--spacing) * 2)}.py-3{padding-block:calc(var(--spacing) * 3)}.py-4{padding-block:calc(var(--spacing) * 4)}.font-mono{font-family:var(--font-mono)}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading, var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading, var(--text-sm--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading, var(--text-xs--line-height))}.font-medium{--tw-font-weight: var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-semibold{--tw-font-weight: var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.tracking-wide{--tw-tracking: var(--tracking-wide);letter-spacing:var(--tracking-wide)}.text-black{color:var(--color-black)}.text-gray-400{color:var(--color-gray-400)}.text-gray-500{color:var(--color-gray-500)}.text-gray-600{color:var(--color-gray-600)}.text-gray-700{color:var(--color-gray-700)}.text-gray-800{color:var(--color-gray-800)}.text-gray-900{color:var(--color-gray-900)}.text-white{color:var(--color-white)}.opacity-0{opacity:0%}.opacity-100{opacity:100%}.shadow{--tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-lg{--tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-md{--tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-sm{--tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function));transition-duration:var(--tw-duration, var(--default-transition-duration))}.transition-all{transition-property:all;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function));transition-duration:var(--tw-duration, var(--default-transition-duration))}.transition-opacity{transition-property:opacity;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function));transition-duration:var(--tw-duration, var(--default-transition-duration))}.duration-100{--tw-duration: .1s;transition-duration:.1s}.duration-200{--tw-duration: .2s;transition-duration:.2s}.duration-300{--tw-duration: .3s;transition-duration:.3s}.ease-linear{--tw-ease: linear;transition-timing-function:linear}.outline-none{--tw-outline-style: none;outline-style:none}.transform-fill{transform-box:fill-box}.placeholder\\:text-gray-400{&::-moz-placeholder{color:var(--color-gray-400)}&::placeholder{color:var(--color-gray-400)}}.hover\\:bg-blue-700{&:hover{@media(hover:hover){background-color:var(--color-blue-700)}}}.hover\\:bg-blue-950{&:hover{@media(hover:hover){background-color:var(--color-blue-950)}}}.hover\\:bg-gray-100{&:hover{@media(hover:hover){background-color:var(--color-gray-100)}}}.hover\\:bg-gray-300{&:hover{@media(hover:hover){background-color:var(--color-gray-300)}}}.hover\\:bg-red-700{&:hover{@media(hover:hover){background-color:var(--color-red-700)}}}.hover\\:text-gray-700{&:hover{@media(hover:hover){color:var(--color-gray-700)}}}.hover\\:text-white{&:hover{@media(hover:hover){color:var(--color-white)}}}.focus\\:border-blue-300{&:focus{border-color:var(--color-blue-300)}}.focus\\:bg-amber-900{&:focus{background-color:var(--color-amber-900)}}.focus\\:ring-2{&:focus{--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}}.focus\\:ring-blue-200{&:focus{--tw-ring-color: var(--color-blue-200)}}.focus\\:outline-none{&:focus{--tw-outline-style: none;outline-style:none}}.md\\:h-105{@media(width>=48rem){height:calc(var(--spacing) * 105)}}.md\\:w-96{@media(width>=48rem){width:calc(var(--spacing) * 96)}}.dark\\:border-white{@media(prefers-color-scheme:dark){border-color:var(--color-white)}}}*{margin:0;padding:0;box-sizing:border-box}.chatbot-container{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif}.chatbot-icon-button{position:fixed;bottom:40px;right:40px;width:64px;height:64px;border-radius:50%;background-color:#fffbeb;border:2px solid #d1d5db;box-shadow:0 4px 6px #0000001a;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s ease;z-index:9999}.chatbot-icon-button:hover{background-color:#1e3a8a;color:#fff}.chatbot-icon-button svg{width:40px;height:40px}.chatbot-modal{position:fixed;bottom:72px;right:32px;width:320px;height:288px;border-radius:16px;box-shadow:0 10px 15px #0000001a;background-color:#fff;font-family:monospace;border:1px solid #e5e7eb;transition:opacity .1s linear;z-index:9998}@media(min-width:768px){.chatbot-modal{width:384px;height:420px}}.chatbot-modal-header{display:flex;align-items:center;justify-content:space-between;padding:16px 24px;background-color:#fff;border-bottom:1px solid #f3f4f6;box-shadow:0 1px 2px #0000000d;border-top-left-radius:16px;border-top-right-radius:16px}.chatbot-modal-header-left{display:flex;align-items:center;gap:12px}.chatbot-modal-bot-icon{background-color:#172554;padding:8px;border-radius:50%;box-shadow:0 1px 2px #0000000d}.chatbot-modal-bot-icon svg{width:20px;height:20px;color:#fff}.chatbot-modal-title{color:#111827;font-weight:600;font-size:16px;letter-spacing:.025em}.chatbot-modal-status{color:#6b7280;font-size:12px;display:flex;align-items:center}.chatbot-modal-header-right{display:flex}.chatbot-modal-header-button{color:#9ca3af;background:transparent;padding:8px;border-radius:6px;transition:all .2s;border:none;cursor:pointer;margin-left:8px}.chatbot-modal-header-button:hover{color:#374151;background-color:#f3f4f6}.chatbot-modal-header-button:focus{outline:none;box-shadow:0 0 0 2px #dbeafe}.chatbot-modal-header-button svg{width:20px;height:20px}.chatbot-modal-main{height:100%}.chatbot-container-section{height:100%;display:flex;flex-direction:column;position:relative;max-width:400px;margin:0 auto}.chatbot-messages{flex:1;padding:12px 16px;display:flex;flex-direction:column;gap:12px;background-color:#fff;overflow-y:auto;max-height:320px;scroll-behavior:smooth}.chatbot-message-wrapper{display:flex;width:100%}.chatbot-message{padding:12px;border-radius:12px;box-shadow:0 1px 2px #0000000d;border:1px solid;font-size:14px;max-width:80%;word-wrap:break-word}.chatbot-message.ai{background-color:#f9fafb;border-color:#f3f4f6;color:#1f2937}.chatbot-message.user{background-color:#2563eb;color:#fff;border-color:#1d4ed8;margin-left:auto}.chatbot-form{flex-shrink:0;display:flex;gap:8px;border-top:1px solid #f3f4f6;padding:12px 16px;background-color:#fff;border-bottom-left-radius:16px;border-bottom-right-radius:16px;width:100%}.chatbot-input{flex:1;background-color:#f9fafb;outline:none;font-size:14px;color:#1f2937;padding:8px;border-radius:8px;border:1px solid #e5e7eb;transition:border-color .2s}.chatbot-input::-moz-placeholder{color:#9ca3af}.chatbot-input::placeholder{color:#9ca3af}.chatbot-input:focus{border-color:#93c5fd}.chatbot-send-button{background-color:#2563eb;color:#fff;padding:8px 16px;border-radius:8px;font-size:14px;box-shadow:0 1px 2px #0000000d;font-weight:500;border:none;cursor:pointer;transition:background-color .2s}.chatbot-send-button:hover{background-color:#1d4ed8}.chatbot-clear-modal-overlay{position:fixed;inset:0;background-color:#00000080;display:flex;align-items:center;justify-content:center;z-index:10000}.chatbot-clear-modal{background-color:#fff;padding:24px;border-radius:8px;box-shadow:0 10px 15px #0000001a}.chatbot-clear-modal-title{font-size:18px;font-weight:600;margin-bottom:16px;color:#1f2937}.chatbot-clear-modal-text{font-size:14px;color:#6b7280;margin-bottom:24px}.chatbot-clear-modal-buttons{display:flex;justify-content:flex-end;gap:16px}.chatbot-clear-modal-button{padding:8px 16px;border-radius:6px;cursor:pointer;border:none;transition:background-color .2s}.chatbot-clear-modal-button.cancel{background-color:#e5e7eb;color:#374151}.chatbot-clear-modal-button.cancel:hover{background-color:#d1d5db}.chatbot-clear-modal-button.clear{background-color:#dc2626;color:#fff}.chatbot-clear-modal-button.clear:hover{background-color:#b91c1c}.chatbot-modal-fade{opacity:0;pointer-events:none}.chatbot-modal-show{opacity:1}@property --tw-space-y-reverse{syntax: "*"; inherits: false; initial-value: 0;}@property --tw-border-style{syntax: "*"; inherits: false; initial-value: solid;}@property --tw-font-weight{syntax: "*"; inherits: false;}@property --tw-tracking{syntax: "*"; inherits: false;}@property --tw-shadow{syntax: "*"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: "*"; inherits: false;}@property --tw-shadow-alpha{syntax: "<percentage>"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: "*"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: "*"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: "<percentage>"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: "*"; inherits: false;}@property --tw-ring-shadow{syntax: "*"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: "*"; inherits: false;}@property --tw-inset-ring-shadow{syntax: "*"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: "*"; inherits: false;}@property --tw-ring-offset-width{syntax: "<length>"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: "*"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: "*"; inherits: false; initial-value: 0 0 #0000;}@property --tw-duration{syntax: "*"; inherits: false;}@property --tw-ease{syntax: "*"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-space-y-reverse: 0;--tw-border-style: solid;--tw-font-weight: initial;--tw-tracking: initial;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000;--tw-duration: initial;--tw-ease: initial}}}
11
- `);var v=require("react/jsx-runtime"),O=({apiKey:t,botName:r,systemInstruction:a})=>{let e=t||(typeof process<"u"&&process.env?.NEXT_PUBLIC_GEMINI_API_KEY?process.env.NEXT_PUBLIC_GEMINI_API_KEY:""),i=r||(typeof process<"u"&&process.env?.NEXT_PUBLIC_AI_BOT_NAME?process.env.NEXT_PUBLIC_AI_BOT_NAME:"AI Assistant"),n=a||(typeof process<"u"&&process.env?.NEXT_PUBLIC_SYSTEM_INSTRUCTION?process.env.NEXT_PUBLIC_SYSTEM_INSTRUCTION:"You are a helpful AI assistant.");return e||console.warn("ChatBot: API key is missing. Please provide it via environment variable NEXT_PUBLIC_GEMINI_API_KEY"),(0,v.jsx)("div",{className:"chatbot-container",children:(0,v.jsx)(S,{apiKey:e,botName:i,systemInstruction:n})})},$=O;
9
+ User asking: ${f}
10
+ `,C=(await(await u.generateContent(x)).response).text();if(!C)throw new Error("Empty response from AI");p(m=>[...m,{sender:"ai",text:C}])}catch(h){console.error("Chat Error:",h);let u="I'm sorry, I'm having trouble connecting right now. Please try again later.";p(x=>[...x,{sender:"ai",text:u}])}};return(0,c.jsxs)("section",{className:"chatbot-container-section",children:[(0,c.jsx)("div",{className:"chatbot-messages",children:n.map((i,f)=>(0,c.jsx)("div",{className:"chatbot-message-wrapper",children:(0,c.jsx)("div",{className:`chatbot-message ${i.sender==="ai"?"ai":"user"}`,children:i.text})},f))}),(0,c.jsxs)("form",{onSubmit:E,className:"chatbot-form",children:[(0,c.jsx)("input",{id:"chat-input",type:"text",placeholder:"Type a message...",className:"chatbot-input",onChange:i=>s(i.target.value),value:t}),(0,c.jsx)("button",{type:"submit",className:"chatbot-send-button",children:"Send"})]})]})},I=R;var o=require("react/jsx-runtime"),O=({onClose:e,apiKey:a,botName:r,systemInstruction:t})=>{let[s,n]=(0,N.useState)(!1);return(0,o.jsxs)(o.Fragment,{children:[(0,o.jsxs)("header",{className:"chatbot-modal-header",children:[(0,o.jsxs)("div",{className:"chatbot-modal-header-left",children:[(0,o.jsx)("span",{className:"chatbot-modal-bot-icon",children:(0,o.jsx)(l.Bot,{})}),(0,o.jsxs)("div",{children:[(0,o.jsx)("div",{className:"chatbot-modal-title",children:r}),(0,o.jsx)("div",{className:"chatbot-modal-status",children:(0,o.jsx)("span",{children:"Online 24/7"})})]})]}),(0,o.jsxs)("div",{className:"chatbot-modal-header-right",children:[(0,o.jsx)("button",{onClick:()=>n(!0),"aria-label":"Settings",className:"chatbot-modal-header-button",children:(0,o.jsx)(l.Trash2,{})}),(0,o.jsx)("button",{onClick:e,"aria-label":"Minimize chat",className:"chatbot-modal-header-button",children:(0,o.jsx)(l.Minimize2,{})})]})]}),(0,o.jsx)("main",{className:"chatbot-modal-main",children:(0,o.jsx)(I,{apiKey:a,botName:r,systemInstruction:t})}),s&&(0,o.jsx)("div",{className:"chatbot-clear-modal-overlay",children:(0,o.jsxs)("div",{className:"chatbot-clear-modal",children:[(0,o.jsx)("h2",{className:"chatbot-clear-modal-title",children:"Clear Conversation"}),(0,o.jsx)("p",{className:"chatbot-clear-modal-text",children:"Are you sure you want to clear the conversation?"}),(0,o.jsxs)("div",{className:"chatbot-clear-modal-buttons",children:[(0,o.jsx)("button",{onClick:()=>n(!1),className:"chatbot-clear-modal-button cancel",children:"Cancel"}),(0,o.jsx)("button",{onClick:()=>{typeof window<"u"&&(localStorage.removeItem("chatMessages"),window.location.reload())},className:"chatbot-clear-modal-button clear",children:"Clear"})]})]})})]})},M=O;var d=require("react/jsx-runtime"),$=({apiKey:e,botName:a,systemInstruction:r})=>{let[t,s]=(0,k.useState)(!1);return(0,d.jsxs)("div",{className:"chatbot-container",children:[(0,d.jsx)("button",{onClick:()=>{s(!0)},className:"chatbot-icon-button",children:(0,d.jsx)(P.Bot,{})}),(0,d.jsx)("div",{className:`chatbot-modal ${t?"chatbot-modal-show":"chatbot-modal-fade"}`,children:t&&(0,d.jsx)(M,{onClose:()=>{s(!1)},apiKey:e,botName:a,systemInstruction:r})})]})},_=$;function v(e,{insertAt:a}={}){if(!e||typeof document>"u")return;let r=document.head||document.getElementsByTagName("head")[0],t=document.createElement("style");t.type="text/css",a==="top"&&r.firstChild?r.insertBefore(t,r.firstChild):r.appendChild(t),t.styleSheet?t.styleSheet.cssText=e:t.appendChild(document.createTextNode(e))}v(`*{margin:0;padding:0;box-sizing:border-box}.chatbot-container{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif}.chatbot-icon-button{position:fixed;bottom:40px;right:40px;width:64px;height:64px;border-radius:50%;background-color:#fffbeb;border:2px solid #d1d5db;box-shadow:0 4px 6px #0000001a;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s ease;z-index:998}.chatbot-icon-button:hover{background-color:#1e3a8a;color:#fff}.chatbot-icon-button svg{width:40px;height:40px}.chatbot-modal{position:fixed;bottom:72px;right:32px;width:320px;height:288px;border-radius:16px;box-shadow:0 10px 15px #0000001a;background-color:#fff;font-family:monospace;border:1px solid #e5e7eb;transition:opacity .1s linear;z-index:999}@media(min-width:768px){.chatbot-modal{width:384px;height:420px}}.chatbot-modal-header{display:flex;align-items:center;justify-content:space-between;padding:16px 24px;background-color:#fff;border-bottom:1px solid #f3f4f6;box-shadow:0 1px 2px #0000000d;border-top-left-radius:16px;border-top-right-radius:16px}.chatbot-modal-header-left{display:flex;align-items:center;gap:12px}.chatbot-modal-bot-icon{background-color:#172554;padding:8px;border-radius:50%;box-shadow:0 1px 2px #0000000d}.chatbot-modal-bot-icon svg{width:20px;height:20px;color:#fff}.chatbot-modal-title{color:#111827;font-weight:600;font-size:16px;letter-spacing:.025em}.chatbot-modal-status{color:#6b7280;font-size:12px;display:flex;align-items:center}.chatbot-modal-header-right{display:flex}.chatbot-modal-header-button{color:#9ca3af;background:transparent;padding:8px;border-radius:6px;transition:all .2s;border:none;cursor:pointer;margin-left:8px}.chatbot-modal-header-button:hover{color:#374151;background-color:#f3f4f6}.chatbot-modal-header-button:focus{outline:none;box-shadow:0 0 0 2px #dbeafe}.chatbot-modal-header-button svg{width:20px;height:20px}.chatbot-modal-main{height:100%}.chatbot-container-section{height:100%;display:flex;flex-direction:column;position:relative;max-width:400px;margin:0 auto}.chatbot-messages{flex:1;padding:12px 16px;display:flex;flex-direction:column;gap:12px;background-color:#fff;overflow-y:auto;max-height:320px;scroll-behavior:smooth}.chatbot-message-wrapper{display:flex;width:100%}.chatbot-message{padding:12px;border-radius:12px;box-shadow:0 1px 2px #0000000d;border:1px solid;font-size:14px;max-width:80%;word-wrap:break-word}.chatbot-message.ai{background-color:#f9fafb;border-color:#f3f4f6;color:#1f2937}.chatbot-message.user{background-color:#2563eb;color:#fff;border-color:#1d4ed8;margin-left:auto}.chatbot-form{flex-shrink:0;display:flex;gap:8px;border-top:1px solid #f3f4f6;padding:12px 16px;background-color:#fff;border-bottom-left-radius:16px;border-bottom-right-radius:16px;width:100%}.chatbot-input{flex:1;background-color:#f9fafb;outline:none;font-size:14px;color:#1f2937;padding:8px;border-radius:8px;border:1px solid #e5e7eb;transition:border-color .2s}.chatbot-input::placeholder{color:#9ca3af}.chatbot-input:focus{border-color:#93c5fd}.chatbot-send-button{background-color:#2563eb;color:#fff;padding:8px 16px;border-radius:8px;font-size:14px;box-shadow:0 1px 2px #0000000d;font-weight:500;border:none;cursor:pointer;transition:background-color .2s}.chatbot-send-button:hover{background-color:#1d4ed8}.chatbot-clear-modal-overlay{position:fixed;inset:0;background-color:#00000080;display:flex;align-items:center;justify-content:center;z-index:10000}.chatbot-clear-modal{background-color:#fff;padding:24px;border-radius:8px;box-shadow:0 10px 15px #0000001a}.chatbot-clear-modal-title{font-size:18px;font-weight:600;margin-bottom:16px;color:#1f2937}.chatbot-clear-modal-text{font-size:14px;color:#6b7280;margin-bottom:24px}.chatbot-clear-modal-buttons{display:flex;justify-content:flex-end;gap:16px}.chatbot-clear-modal-button{padding:8px 16px;border-radius:6px;cursor:pointer;border:none;transition:background-color .2s}.chatbot-clear-modal-button.cancel{background-color:#e5e7eb;color:#374151}.chatbot-clear-modal-button.cancel:hover{background-color:#d1d5db}.chatbot-clear-modal-button.clear{background-color:#dc2626;color:#fff}.chatbot-clear-modal-button.clear:hover{background-color:#b91c1c}.chatbot-modal-fade{opacity:0;pointer-events:none}.chatbot-modal-show{opacity:1}
11
+ `);var y=require("react/jsx-runtime"),G=({apiKey:e,botName:a,systemInstruction:r})=>{let t=e||(typeof process<"u"&&process.env?.NEXT_PUBLIC_GEMINI_API_KEY?process.env.NEXT_PUBLIC_GEMINI_API_KEY:""),s=a||(typeof process<"u"&&process.env?.NEXT_PUBLIC_AI_BOT_NAME?process.env.NEXT_PUBLIC_AI_BOT_NAME:"AI Assistant"),n=r||(typeof process<"u"&&process.env?.NEXT_PUBLIC_SYSTEM_INSTRUCTION?process.env.NEXT_PUBLIC_SYSTEM_INSTRUCTION:"You are a helpful AI assistant.");return t||console.warn("ChatBot: API key is missing. Please provide it via environment variable NEXT_PUBLIC_GEMINI_API_KEY"),(0,y.jsx)("div",{className:"chatbot-container",children:(0,y.jsx)(_,{apiKey:t,botName:s,systemInstruction:n})})},L=G;
12
12
  //# sourceMappingURL=index.js.map
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/index.tsx","../src/components/ChatIcon.tsx","../src/components/ChatModal.tsx","../src/components/ChatContainer.tsx","#style-inject:#style-inject","../src/styles/chatbot.css"],"sourcesContent":["import React from \"react\";\r\nimport ChatIcon from \"./components/ChatIcon\";\r\nimport { ChatBotProps } from \"./types\";\r\nimport \"./styles/chatbot.css\";\r\n\r\n/**\r\n * ChatBot Component - A reusable AI chatbot powered by Google Gemini\r\n *\r\n * @param {ChatBotProps} props - Configuration props for the chatbot\r\n * @param {string} [props.apiKey] - Google Gemini API key (falls back to NEXT_PUBLIC_GEMINI_API_KEY)\r\n * @param {string} [props.botName] - Name of the bot (falls back to NEXT_PUBLIC_AI_BOT_NAME or \"AI Assistant\")\r\n * @param {string} [props.systemInstruction] - System instruction for the bot (falls back to NEXT_PUBLIC_SYSTEM_INSTRUCTION)\r\n *\r\n * @example\r\n * // Using environment variables\r\n * <ChatBot />\r\n */\r\nconst ChatBot: React.FC<ChatBotProps> = ({\r\n apiKey,\r\n botName,\r\n systemInstruction,\r\n}) => {\r\n // Fallback to environment variables if props are not provided\r\n const resolvedApiKey =\r\n apiKey ||\r\n (typeof process !== \"undefined\" && process.env?.NEXT_PUBLIC_GEMINI_API_KEY\r\n ? process.env.NEXT_PUBLIC_GEMINI_API_KEY\r\n : \"\");\r\n\r\n const resolvedBotName =\r\n botName ||\r\n (typeof process !== \"undefined\" && process.env?.NEXT_PUBLIC_AI_BOT_NAME\r\n ? process.env.NEXT_PUBLIC_AI_BOT_NAME\r\n : \"AI Assistant\");\r\n\r\n const resolvedSystemInstruction =\r\n systemInstruction ||\r\n (typeof process !== \"undefined\" &&\r\n process.env?.NEXT_PUBLIC_SYSTEM_INSTRUCTION\r\n ? process.env.NEXT_PUBLIC_SYSTEM_INSTRUCTION\r\n : \"You are a helpful AI assistant.\");\r\n\r\n // Warn if API key is missing\r\n if (!resolvedApiKey) {\r\n console.warn(\r\n \"ChatBot: API key is missing. Please provide it via environment variable NEXT_PUBLIC_GEMINI_API_KEY\"\r\n );\r\n }\r\n\r\n return (\r\n <div className=\"chatbot-container\">\r\n <ChatIcon\r\n apiKey={resolvedApiKey} // The API key used to authenticate with Google Gemini\r\n botName={resolvedBotName} // The name of the bot displayed to users\r\n systemInstruction={resolvedSystemInstruction} // The context or behavior instruction for the bot\r\n />\r\n </div>\r\n );\r\n};\r\n\r\nexport default ChatBot;\r\nexport type { ChatBotProps, Message } from \"./types\";\r\n","import { useState } from \"react\";\r\nimport { Bot } from \"lucide-react\";\r\nimport ChatModal from \"./ChatModal\";\r\nimport { ChatIconProps } from \"../types\";\r\n\r\nconst ChatIcon: React.FC<ChatIconProps> = ({\r\n apiKey,\r\n botName,\r\n systemInstruction,\r\n}) => {\r\n const [isModalOpen, setIsModalOpen] = useState(false);\r\n\r\n const openModal = () => {\r\n setIsModalOpen(true);\r\n };\r\n\r\n const closeModal = () => {\r\n setIsModalOpen(false);\r\n };\r\n\r\n return (\r\n <>\r\n <button onClick={openModal}>\r\n <div className=\"bg-amber-50 p-4 rounded-full shadow-md fixed bottom-10 right-10 w-16 h-16 flex items-center justify-center cursor-pointer hover:bg-blue-950 transition transform-fill ring:b-amber-500 focus:bg-amber-900 duration-300 border-gray-300 dark:border-white border-2 text-black hover:text-white\">\r\n <Bot className=\"w-10 h-10\" />\r\n </div>\r\n </button>\r\n <div\r\n className={`transition-opacity duration-100 ease-linear ${\r\n isModalOpen ? \"opacity-100\" : \"opacity-0 pointer-events-none\"\r\n }`}\r\n >\r\n {isModalOpen && (\r\n <ChatModal\r\n onClose={closeModal}\r\n apiKey={apiKey}\r\n botName={botName}\r\n systemInstruction={systemInstruction}\r\n />\r\n )}\r\n </div>\r\n </>\r\n );\r\n};\r\n\r\nexport default ChatIcon;\r\n","import { useState } from \"react\";\r\nimport { Minimize2, Bot, Trash2 } from \"lucide-react\";\r\nimport ChatContainer from \"./ChatContainer\";\r\nimport { ChatModalProps } from \"../types\";\r\n\r\nconst ChatModal: React.FC<ChatModalProps> = ({\r\n onClose,\r\n apiKey,\r\n botName,\r\n systemInstruction,\r\n}) => {\r\n const [showClearModal, setShowClearModal] = useState(false);\r\n\r\n const clearChat = () => {\r\n if (typeof window !== \"undefined\") {\r\n localStorage.removeItem(\"chatMessages\");\r\n window.location.reload();\r\n }\r\n };\r\n\r\n return (\r\n <div className=\"fixed bottom-14 right-8 w-80 h-72 md:w-96 md:h-105 rounded-2xl shadow-lg bg-white font-mono border border-gray-200\">\r\n <header className=\"flex items-center justify-between px-6 py-4 bg-white border-b shadow border-gray-100 rounded-t-2xl\">\r\n <div className=\"flex items-center gap-3\">\r\n <span className=\"bg-blue-950 p-2 rounded-full shadow-sm\">\r\n <Bot className=\"w-5 h-5 text-white\" />\r\n </span>\r\n <div>\r\n <div className=\"text-gray-900 font-semibold text-md tracking-wide\">\r\n {botName}\r\n </div>\r\n <div className=\"text-gray-500 text-xs flex items-center\">\r\n <span>Online 24/7</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div>\r\n <button\r\n onClick={() => setShowClearModal(true)}\r\n aria-label=\"Settings\"\r\n className=\"text-gray-400 hover:text-gray-700 bg-transparent p-2 rounded-md transition-all duration-200 focus:outline-none focus:ring-2 focus:ring-blue-200 hover:bg-gray-100 mr-2 cursor-pointer\"\r\n >\r\n <Trash2 className=\"w-5 h-5\" />\r\n </button>\r\n <button\r\n onClick={onClose}\r\n aria-label=\"Minimize chat\"\r\n className=\"text-gray-400 hover:text-gray-700 bg-transparent p-2 rounded-md transition-all duration-200 focus:outline-none focus:ring-2 focus:ring-blue-200 hover:bg-gray-100 cursor-pointer\"\r\n >\r\n <Minimize2 className=\"w-5 h-5\" />\r\n </button>\r\n </div>\r\n </header>\r\n <main className=\"h-full\">\r\n <ChatContainer\r\n apiKey={apiKey}\r\n botName={botName}\r\n systemInstruction={systemInstruction}\r\n />\r\n </main>\r\n\r\n {showClearModal && (\r\n <div className=\"fixed inset-0 border shadow bg-opacity-50 flex items-center justify-center\">\r\n <div className=\"bg-white p-6 rounded-lg shadow-lg\">\r\n <h2 className=\"text-lg font-semibold mb-4 text-gray-800\">\r\n Clear Conversation\r\n </h2>\r\n <p className=\"text-sm text-gray-600 mb-6\">\r\n Are you sure you want to clear the conversation?\r\n </p>\r\n <div className=\"flex justify-end gap-4\">\r\n <button\r\n onClick={() => setShowClearModal(false)}\r\n className=\"px-4 py-2 bg-gray-200 text-gray-700 rounded-md hover:bg-gray-300\"\r\n >\r\n Cancel\r\n </button>\r\n <button\r\n onClick={clearChat}\r\n className=\"px-4 py-2 bg-red-600 text-white rounded-md hover:bg-red-700\"\r\n >\r\n Clear\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n )}\r\n </div>\r\n );\r\n};\r\n\r\nexport default ChatModal;\r\n","import { useState, useEffect } from \"react\";\r\nimport { GoogleGenerativeAI } from \"@google/generative-ai\";\r\nimport { ChatContainerProps, Message } from \"../types\";\r\n\r\nconst ChatContainer: React.FC<ChatContainerProps> = ({\r\n apiKey,\r\n botName,\r\n systemInstruction,\r\n}) => {\r\n const [message, setMessage] = useState(\"\");\r\n const [messages, setMessages] = useState<Message[]>(() => {\r\n if (typeof window !== \"undefined\") {\r\n const storedMessages = localStorage.getItem(\"chatMessages\");\r\n return storedMessages\r\n ? JSON.parse(storedMessages)\r\n : [\r\n {\r\n sender: \"ai\",\r\n text: `Hello! I'm ${botName}. How can I help you today?`,\r\n },\r\n ];\r\n }\r\n return [\r\n {\r\n sender: \"ai\",\r\n text: `Hello! I'm ${botName}. How can I help you today?`,\r\n },\r\n ];\r\n });\r\n\r\n useEffect(() => {\r\n if (typeof window !== \"undefined\") {\r\n localStorage.setItem(\"chatMessages\", JSON.stringify(messages));\r\n }\r\n }, [messages]);\r\n\r\n const handleSend = async (e: React.FormEvent) => {\r\n e.preventDefault();\r\n if (!message.trim()) return;\r\n\r\n if (!apiKey) {\r\n console.error(\"API key is missing. Please provide a valid API key.\");\r\n return;\r\n }\r\n\r\n setMessages((prev: Message[]) => [\r\n ...prev,\r\n { sender: \"user\", text: message },\r\n ]);\r\n const currentMessage = message;\r\n setMessage(\"\");\r\n\r\n try {\r\n const ai = new GoogleGenerativeAI(apiKey);\r\n const model = ai.getGenerativeModel({\r\n model: \"gemini-2.5-flash\",\r\n });\r\n\r\n const promptWithContext = `\r\n ${systemInstruction}\r\n \r\n Previous conversation history:\r\n ${messages\r\n .slice(1)\r\n .map((m: Message) => `${m.sender}: ${m.text}`)\r\n .join(\"\\n\")}\r\n \r\n User asking: ${currentMessage}\r\n `;\r\n\r\n const result = await model.generateContent(promptWithContext);\r\n const response = await result.response;\r\n const aiText = response.text();\r\n\r\n if (!aiText) {\r\n throw new Error(\"Empty response from AI\");\r\n }\r\n\r\n setMessages((prev: Message[]) => [\r\n ...prev,\r\n { sender: \"ai\", text: aiText },\r\n ]);\r\n } catch (err) {\r\n console.error(\"Chat Error:\", err);\r\n const fallbackResponse =\r\n \"I'm sorry, I'm having trouble connecting right now. Please try again later.\";\r\n setMessages((prev: Message[]) => [\r\n ...prev,\r\n { sender: \"ai\", text: fallbackResponse },\r\n ]);\r\n }\r\n };\r\n\r\n return (\r\n <section className=\"h-full flex flex-col relative max-w-100 mx-auto\">\r\n <div\r\n className=\"flex-1 px-4 py-3 space-y-3 bg-white overflow-y-auto\"\r\n style={{ maxHeight: \"320px\", scrollBehavior: \"smooth\" }}\r\n >\r\n {messages.map((msg: Message, idx: number) => (\r\n <div key={idx} className=\"flex w-full\">\r\n <div\r\n className={`px-3 py-2 rounded-xl shadow-sm border text-sm max-w-[80%] ${\r\n msg.sender === \"ai\"\r\n ? \"bg-gray-50 border-gray-100 text-gray-800\"\r\n : \"bg-blue-600 text-white border-blue-700 ml-auto\"\r\n }`}\r\n >\r\n {msg.text}\r\n </div>\r\n </div>\r\n ))}\r\n </div>\r\n <form\r\n onSubmit={handleSend}\r\n className=\"shrink-0 flex gap-2 border-t border-gray-100 px-4 py-3 bg-white rounded-b-2xl w-full\"\r\n >\r\n <input\r\n id=\"chat-input\"\r\n type=\"text\"\r\n placeholder=\"Type a message...\"\r\n className=\"flex-1 bg-gray-50 outline-none text-sm text-gray-800 placeholder:text-gray-400 px-2 py-1 rounded-lg border border-gray-200 focus:border-blue-300 transition\"\r\n onChange={(e) => setMessage(e.target.value)}\r\n value={message}\r\n />\r\n <button\r\n type=\"submit\"\r\n className=\"bg-blue-600 text-white px-4 py-1 rounded-lg text-sm shadow-sm font-medium hover:bg-blue-700 transition\"\r\n >\r\n Send\r\n </button>\r\n </form>\r\n </section>\r\n );\r\n};\r\n\r\nexport default ChatContainer;\r\n","\n export default function styleInject(css, { insertAt } = {}) {\n if (!css || typeof document === 'undefined') return\n \n const head = document.head || document.getElementsByTagName('head')[0]\n const style = document.createElement('style')\n style.type = 'text/css'\n \n if (insertAt === 'top') {\n if (head.firstChild) {\n head.insertBefore(style, head.firstChild)\n } else {\n head.appendChild(style)\n }\n } else {\n head.appendChild(style)\n }\n \n if (style.styleSheet) {\n style.styleSheet.cssText = css\n } else {\n style.appendChild(document.createTextNode(css))\n }\n }\n ","import styleInject from '#style-inject';styleInject(\"/*! tailwindcss v4.1.18 | MIT License | https://tailwindcss.com */@layer properties;@layer theme,base,components,utilities;@layer theme{:root,:host{--font-sans: ui-sans-serif, system-ui, sans-serif, \\\"Apple Color Emoji\\\", \\\"Segoe UI Emoji\\\", \\\"Segoe UI Symbol\\\", \\\"Noto Color Emoji\\\";--font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \\\"Liberation Mono\\\", \\\"Courier New\\\", monospace;--color-red-600: oklch(57.7% .245 27.325);--color-red-700: oklch(50.5% .213 27.518);--color-amber-50: oklch(98.7% .022 95.277);--color-amber-900: oklch(41.4% .112 45.904);--color-blue-200: oklch(88.2% .059 254.128);--color-blue-300: oklch(80.9% .105 251.813);--color-blue-600: oklch(54.6% .245 262.881);--color-blue-700: oklch(48.8% .243 264.376);--color-blue-950: oklch(28.2% .091 267.935);--color-gray-50: oklch(98.5% .002 247.839);--color-gray-100: oklch(96.7% .003 264.542);--color-gray-200: oklch(92.8% .006 264.531);--color-gray-300: oklch(87.2% .01 258.338);--color-gray-400: oklch(70.7% .022 261.325);--color-gray-500: oklch(55.1% .027 264.364);--color-gray-600: oklch(44.6% .03 256.802);--color-gray-700: oklch(37.3% .034 259.733);--color-gray-800: oklch(27.8% .033 256.848);--color-gray-900: oklch(21% .034 264.665);--color-black: #000;--color-white: #fff;--spacing: .25rem;--text-xs: .75rem;--text-xs--line-height: calc(1 / .75);--text-sm: .875rem;--text-sm--line-height: calc(1.25 / .875);--text-lg: 1.125rem;--text-lg--line-height: calc(1.75 / 1.125);--font-weight-medium: 500;--font-weight-semibold: 600;--tracking-wide: .025em;--radius-md: .375rem;--radius-lg: .5rem;--radius-xl: .75rem;--radius-2xl: 1rem;--default-transition-duration: .15s;--default-transition-timing-function: cubic-bezier(.4, 0, .2, 1);--default-font-family: var(--font-sans);--default-mono-font-family: var(--font-mono)}}@layer base{*,:after,:before,::backdrop,::file-selector-button{box-sizing:border-box;margin:0;padding:0;border:0 solid}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:var(--default-font-family, ui-sans-serif, system-ui, sans-serif, \\\"Apple Color Emoji\\\", \\\"Segoe UI Emoji\\\", \\\"Segoe UI Symbol\\\", \\\"Noto Color Emoji\\\");font-feature-settings:var(--default-font-feature-settings, normal);font-variation-settings:var(--default-font-variation-settings, normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \\\"Liberation Mono\\\", \\\"Courier New\\\", monospace);font-feature-settings:var(--default-mono-font-feature-settings, normal);font-variation-settings:var(--default-mono-font-variation-settings, normal);font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea,::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;border-radius:0;background-color:transparent;opacity:1}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::-moz-placeholder{opacity:1}::placeholder{opacity:1}@supports (not (-webkit-appearance: -apple-pay-button)) or (contain-intrinsic-size: 1px){::-moz-placeholder{color:currentcolor;@supports (color: color-mix(in lab,red,red)){color:color-mix(in oklab,currentcolor 50%,transparent)}}::placeholder{color:currentcolor;@supports (color: color-mix(in lab,red,red)){color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit,::-webkit-datetime-edit-year-field,::-webkit-datetime-edit-month-field,::-webkit-datetime-edit-day-field,::-webkit-datetime-edit-hour-field,::-webkit-datetime-edit-minute-field,::-webkit-datetime-edit-second-field,::-webkit-datetime-edit-millisecond-field,::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]),::file-selector-button{-webkit-appearance:button;-moz-appearance:button;appearance:button}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer utilities{.pointer-events-none{pointer-events:none}.fixed{position:fixed}.relative{position:relative}.inset-0{inset:calc(var(--spacing) * 0)}.right-8{right:calc(var(--spacing) * 8)}.right-10{right:calc(var(--spacing) * 10)}.bottom-10{bottom:calc(var(--spacing) * 10)}.bottom-14{bottom:calc(var(--spacing) * 14)}.mx-auto{margin-inline:auto}.mr-2{margin-right:calc(var(--spacing) * 2)}.mb-4{margin-bottom:calc(var(--spacing) * 4)}.mb-6{margin-bottom:calc(var(--spacing) * 6)}.ml-auto{margin-left:auto}.flex{display:flex}.h-5{height:calc(var(--spacing) * 5)}.h-10{height:calc(var(--spacing) * 10)}.h-16{height:calc(var(--spacing) * 16)}.h-72{height:calc(var(--spacing) * 72)}.h-full{height:100%}.w-5{width:calc(var(--spacing) * 5)}.w-10{width:calc(var(--spacing) * 10)}.w-16{width:calc(var(--spacing) * 16)}.w-80{width:calc(var(--spacing) * 80)}.w-full{width:100%}.max-w-100{max-width:calc(var(--spacing) * 100)}.max-w-\\\\[80\\\\%\\\\]{max-width:80%}.flex-1{flex:1}.shrink-0{flex-shrink:0}.cursor-pointer{cursor:pointer}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.justify-end{justify-content:flex-end}.gap-2{gap:calc(var(--spacing) * 2)}.gap-3{gap:calc(var(--spacing) * 3)}.gap-4{gap:calc(var(--spacing) * 4)}.space-y-3{:where(&>:not(:last-child)){--tw-space-y-reverse: 0;margin-block-start:calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)))}}.overflow-y-auto{overflow-y:auto}.rounded-2xl{border-radius:var(--radius-2xl)}.rounded-full{border-radius:calc(infinity * 1px)}.rounded-lg{border-radius:var(--radius-lg)}.rounded-md{border-radius:var(--radius-md)}.rounded-xl{border-radius:var(--radius-xl)}.rounded-t-2xl{border-top-left-radius:var(--radius-2xl);border-top-right-radius:var(--radius-2xl)}.rounded-b-2xl{border-bottom-right-radius:var(--radius-2xl);border-bottom-left-radius:var(--radius-2xl)}.border{border-style:var(--tw-border-style);border-width:1px}.border-2{border-style:var(--tw-border-style);border-width:2px}.border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-blue-700{border-color:var(--color-blue-700)}.border-gray-100{border-color:var(--color-gray-100)}.border-gray-200{border-color:var(--color-gray-200)}.border-gray-300{border-color:var(--color-gray-300)}.bg-amber-50{background-color:var(--color-amber-50)}.bg-blue-600{background-color:var(--color-blue-600)}.bg-blue-950{background-color:var(--color-blue-950)}.bg-gray-50{background-color:var(--color-gray-50)}.bg-gray-200{background-color:var(--color-gray-200)}.bg-red-600{background-color:var(--color-red-600)}.bg-transparent{background-color:transparent}.bg-white{background-color:var(--color-white)}.p-2{padding:calc(var(--spacing) * 2)}.p-4{padding:calc(var(--spacing) * 4)}.p-6{padding:calc(var(--spacing) * 6)}.px-2{padding-inline:calc(var(--spacing) * 2)}.px-3{padding-inline:calc(var(--spacing) * 3)}.px-4{padding-inline:calc(var(--spacing) * 4)}.px-6{padding-inline:calc(var(--spacing) * 6)}.py-1{padding-block:calc(var(--spacing) * 1)}.py-2{padding-block:calc(var(--spacing) * 2)}.py-3{padding-block:calc(var(--spacing) * 3)}.py-4{padding-block:calc(var(--spacing) * 4)}.font-mono{font-family:var(--font-mono)}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading, var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading, var(--text-sm--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading, var(--text-xs--line-height))}.font-medium{--tw-font-weight: var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-semibold{--tw-font-weight: var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.tracking-wide{--tw-tracking: var(--tracking-wide);letter-spacing:var(--tracking-wide)}.text-black{color:var(--color-black)}.text-gray-400{color:var(--color-gray-400)}.text-gray-500{color:var(--color-gray-500)}.text-gray-600{color:var(--color-gray-600)}.text-gray-700{color:var(--color-gray-700)}.text-gray-800{color:var(--color-gray-800)}.text-gray-900{color:var(--color-gray-900)}.text-white{color:var(--color-white)}.opacity-0{opacity:0%}.opacity-100{opacity:100%}.shadow{--tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-lg{--tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-md{--tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-sm{--tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function));transition-duration:var(--tw-duration, var(--default-transition-duration))}.transition-all{transition-property:all;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function));transition-duration:var(--tw-duration, var(--default-transition-duration))}.transition-opacity{transition-property:opacity;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function));transition-duration:var(--tw-duration, var(--default-transition-duration))}.duration-100{--tw-duration: .1s;transition-duration:.1s}.duration-200{--tw-duration: .2s;transition-duration:.2s}.duration-300{--tw-duration: .3s;transition-duration:.3s}.ease-linear{--tw-ease: linear;transition-timing-function:linear}.outline-none{--tw-outline-style: none;outline-style:none}.transform-fill{transform-box:fill-box}.placeholder\\\\:text-gray-400{&::-moz-placeholder{color:var(--color-gray-400)}&::placeholder{color:var(--color-gray-400)}}.hover\\\\:bg-blue-700{&:hover{@media(hover:hover){background-color:var(--color-blue-700)}}}.hover\\\\:bg-blue-950{&:hover{@media(hover:hover){background-color:var(--color-blue-950)}}}.hover\\\\:bg-gray-100{&:hover{@media(hover:hover){background-color:var(--color-gray-100)}}}.hover\\\\:bg-gray-300{&:hover{@media(hover:hover){background-color:var(--color-gray-300)}}}.hover\\\\:bg-red-700{&:hover{@media(hover:hover){background-color:var(--color-red-700)}}}.hover\\\\:text-gray-700{&:hover{@media(hover:hover){color:var(--color-gray-700)}}}.hover\\\\:text-white{&:hover{@media(hover:hover){color:var(--color-white)}}}.focus\\\\:border-blue-300{&:focus{border-color:var(--color-blue-300)}}.focus\\\\:bg-amber-900{&:focus{background-color:var(--color-amber-900)}}.focus\\\\:ring-2{&:focus{--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}}.focus\\\\:ring-blue-200{&:focus{--tw-ring-color: var(--color-blue-200)}}.focus\\\\:outline-none{&:focus{--tw-outline-style: none;outline-style:none}}.md\\\\:h-105{@media(width>=48rem){height:calc(var(--spacing) * 105)}}.md\\\\:w-96{@media(width>=48rem){width:calc(var(--spacing) * 96)}}.dark\\\\:border-white{@media(prefers-color-scheme:dark){border-color:var(--color-white)}}}*{margin:0;padding:0;box-sizing:border-box}.chatbot-container{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif}.chatbot-icon-button{position:fixed;bottom:40px;right:40px;width:64px;height:64px;border-radius:50%;background-color:#fffbeb;border:2px solid #d1d5db;box-shadow:0 4px 6px #0000001a;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s ease;z-index:9999}.chatbot-icon-button:hover{background-color:#1e3a8a;color:#fff}.chatbot-icon-button svg{width:40px;height:40px}.chatbot-modal{position:fixed;bottom:72px;right:32px;width:320px;height:288px;border-radius:16px;box-shadow:0 10px 15px #0000001a;background-color:#fff;font-family:monospace;border:1px solid #e5e7eb;transition:opacity .1s linear;z-index:9998}@media(min-width:768px){.chatbot-modal{width:384px;height:420px}}.chatbot-modal-header{display:flex;align-items:center;justify-content:space-between;padding:16px 24px;background-color:#fff;border-bottom:1px solid #f3f4f6;box-shadow:0 1px 2px #0000000d;border-top-left-radius:16px;border-top-right-radius:16px}.chatbot-modal-header-left{display:flex;align-items:center;gap:12px}.chatbot-modal-bot-icon{background-color:#172554;padding:8px;border-radius:50%;box-shadow:0 1px 2px #0000000d}.chatbot-modal-bot-icon svg{width:20px;height:20px;color:#fff}.chatbot-modal-title{color:#111827;font-weight:600;font-size:16px;letter-spacing:.025em}.chatbot-modal-status{color:#6b7280;font-size:12px;display:flex;align-items:center}.chatbot-modal-header-right{display:flex}.chatbot-modal-header-button{color:#9ca3af;background:transparent;padding:8px;border-radius:6px;transition:all .2s;border:none;cursor:pointer;margin-left:8px}.chatbot-modal-header-button:hover{color:#374151;background-color:#f3f4f6}.chatbot-modal-header-button:focus{outline:none;box-shadow:0 0 0 2px #dbeafe}.chatbot-modal-header-button svg{width:20px;height:20px}.chatbot-modal-main{height:100%}.chatbot-container-section{height:100%;display:flex;flex-direction:column;position:relative;max-width:400px;margin:0 auto}.chatbot-messages{flex:1;padding:12px 16px;display:flex;flex-direction:column;gap:12px;background-color:#fff;overflow-y:auto;max-height:320px;scroll-behavior:smooth}.chatbot-message-wrapper{display:flex;width:100%}.chatbot-message{padding:12px;border-radius:12px;box-shadow:0 1px 2px #0000000d;border:1px solid;font-size:14px;max-width:80%;word-wrap:break-word}.chatbot-message.ai{background-color:#f9fafb;border-color:#f3f4f6;color:#1f2937}.chatbot-message.user{background-color:#2563eb;color:#fff;border-color:#1d4ed8;margin-left:auto}.chatbot-form{flex-shrink:0;display:flex;gap:8px;border-top:1px solid #f3f4f6;padding:12px 16px;background-color:#fff;border-bottom-left-radius:16px;border-bottom-right-radius:16px;width:100%}.chatbot-input{flex:1;background-color:#f9fafb;outline:none;font-size:14px;color:#1f2937;padding:8px;border-radius:8px;border:1px solid #e5e7eb;transition:border-color .2s}.chatbot-input::-moz-placeholder{color:#9ca3af}.chatbot-input::placeholder{color:#9ca3af}.chatbot-input:focus{border-color:#93c5fd}.chatbot-send-button{background-color:#2563eb;color:#fff;padding:8px 16px;border-radius:8px;font-size:14px;box-shadow:0 1px 2px #0000000d;font-weight:500;border:none;cursor:pointer;transition:background-color .2s}.chatbot-send-button:hover{background-color:#1d4ed8}.chatbot-clear-modal-overlay{position:fixed;inset:0;background-color:#00000080;display:flex;align-items:center;justify-content:center;z-index:10000}.chatbot-clear-modal{background-color:#fff;padding:24px;border-radius:8px;box-shadow:0 10px 15px #0000001a}.chatbot-clear-modal-title{font-size:18px;font-weight:600;margin-bottom:16px;color:#1f2937}.chatbot-clear-modal-text{font-size:14px;color:#6b7280;margin-bottom:24px}.chatbot-clear-modal-buttons{display:flex;justify-content:flex-end;gap:16px}.chatbot-clear-modal-button{padding:8px 16px;border-radius:6px;cursor:pointer;border:none;transition:background-color .2s}.chatbot-clear-modal-button.cancel{background-color:#e5e7eb;color:#374151}.chatbot-clear-modal-button.cancel:hover{background-color:#d1d5db}.chatbot-clear-modal-button.clear{background-color:#dc2626;color:#fff}.chatbot-clear-modal-button.clear:hover{background-color:#b91c1c}.chatbot-modal-fade{opacity:0;pointer-events:none}.chatbot-modal-show{opacity:1}@property --tw-space-y-reverse{syntax: \\\"*\\\"; inherits: false; initial-value: 0;}@property --tw-border-style{syntax: \\\"*\\\"; inherits: false; initial-value: solid;}@property --tw-font-weight{syntax: \\\"*\\\"; inherits: false;}@property --tw-tracking{syntax: \\\"*\\\"; inherits: false;}@property --tw-shadow{syntax: \\\"*\\\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \\\"*\\\"; inherits: false;}@property --tw-shadow-alpha{syntax: \\\"<percentage>\\\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \\\"*\\\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \\\"*\\\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \\\"<percentage>\\\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \\\"*\\\"; inherits: false;}@property --tw-ring-shadow{syntax: \\\"*\\\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \\\"*\\\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \\\"*\\\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \\\"*\\\"; inherits: false;}@property --tw-ring-offset-width{syntax: \\\"<length>\\\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \\\"*\\\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \\\"*\\\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-duration{syntax: \\\"*\\\"; inherits: false;}@property --tw-ease{syntax: \\\"*\\\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-space-y-reverse: 0;--tw-border-style: solid;--tw-font-weight: initial;--tw-tracking: initial;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000;--tw-duration: initial;--tw-ease: initial}}}\\n\")"],"mappings":"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","names":["index_exports","__export","index_default","__toCommonJS","import_react","import_lucide_react","import_react","import_lucide_react","import_react","import_generative_ai","import_jsx_runtime","ChatContainer","apiKey","botName","systemInstruction","message","setMessage","messages","setMessages","storedMessages","handleSend","e","prev","currentMessage","model","promptWithContext","m","aiText","err","fallbackResponse","msg","idx","ChatContainer_default","import_jsx_runtime","ChatModal","onClose","apiKey","botName","systemInstruction","showClearModal","setShowClearModal","ChatContainer_default","ChatModal_default","import_jsx_runtime","ChatIcon","apiKey","botName","systemInstruction","isModalOpen","setIsModalOpen","ChatModal_default","ChatIcon_default","styleInject","css","insertAt","head","style","styleInject","import_jsx_runtime","ChatBot","apiKey","botName","systemInstruction","resolvedApiKey","resolvedBotName","resolvedSystemInstruction","ChatIcon_default","index_default"]}
1
+ {"version":3,"sources":["../src/index.tsx","../src/components/ChatIcon.tsx","../src/components/ChatModal.tsx","../src/components/ChatContainer.tsx","#style-inject:#style-inject","../src/styles/chatbot.css"],"sourcesContent":["import React from \"react\";\r\nimport ChatIcon from \"./components/ChatIcon\";\r\nimport { ChatBotProps } from \"./types\";\r\nimport \"./styles/chatbot.css\";\r\n\r\n/**\r\n * ChatBot Component - A reusable AI chatbot powered by Google Gemini\r\n *\r\n * @param {ChatBotProps} props - Configuration props for the chatbot\r\n * @param {string} [props.apiKey] - Google Gemini API key (falls back to NEXT_PUBLIC_GEMINI_API_KEY)\r\n * @param {string} [props.botName] - Name of the bot (falls back to NEXT_PUBLIC_AI_BOT_NAME or \"AI Assistant\")\r\n * @param {string} [props.systemInstruction] - System instruction for the bot (falls back to NEXT_PUBLIC_SYSTEM_INSTRUCTION)\r\n *\r\n * @example\r\n * // Using environment variables\r\n * <ChatBot />\r\n */\r\nconst ChatBot: React.FC<ChatBotProps> = ({\r\n apiKey,\r\n botName,\r\n systemInstruction,\r\n}) => {\r\n // Fallback to environment variables if props are not provided\r\n const resolvedApiKey =\r\n apiKey ||\r\n (typeof process !== \"undefined\" && process.env?.NEXT_PUBLIC_GEMINI_API_KEY\r\n ? process.env.NEXT_PUBLIC_GEMINI_API_KEY\r\n : \"\");\r\n\r\n const resolvedBotName =\r\n botName ||\r\n (typeof process !== \"undefined\" && process.env?.NEXT_PUBLIC_AI_BOT_NAME\r\n ? process.env.NEXT_PUBLIC_AI_BOT_NAME\r\n : \"AI Assistant\");\r\n\r\n const resolvedSystemInstruction =\r\n systemInstruction ||\r\n (typeof process !== \"undefined\" &&\r\n process.env?.NEXT_PUBLIC_SYSTEM_INSTRUCTION\r\n ? process.env.NEXT_PUBLIC_SYSTEM_INSTRUCTION\r\n : \"You are a helpful AI assistant.\");\r\n\r\n // Warn if API key is missing\r\n if (!resolvedApiKey) {\r\n console.warn(\r\n \"ChatBot: API key is missing. Please provide it via environment variable NEXT_PUBLIC_GEMINI_API_KEY\"\r\n );\r\n }\r\n\r\n return (\r\n <div className=\"chatbot-container\">\r\n <ChatIcon\r\n apiKey={resolvedApiKey} // The API key used to authenticate with Google Gemini\r\n botName={resolvedBotName} // The name of the bot displayed to users\r\n systemInstruction={resolvedSystemInstruction} // The context or behavior instruction for the bot\r\n />\r\n </div>\r\n );\r\n};\r\n\r\nexport default ChatBot;\r\nexport type { ChatBotProps, Message } from \"./types\";\r\n","import { useState } from \"react\";\r\nimport { Bot } from \"lucide-react\";\r\nimport ChatModal from \"./ChatModal\";\r\nimport { ChatIconProps } from \"../types\";\r\n\r\nconst ChatIcon: React.FC<ChatIconProps> = ({\r\n apiKey,\r\n botName,\r\n systemInstruction,\r\n}) => {\r\n const [isModalOpen, setIsModalOpen] = useState(false);\r\n\r\n const openModal = () => {\r\n setIsModalOpen(true);\r\n };\r\n\r\n const closeModal = () => {\r\n setIsModalOpen(false);\r\n };\r\n\r\n return (\r\n <div className=\"chatbot-container\">\r\n <button onClick={openModal} className=\"chatbot-icon-button\">\r\n <Bot />\r\n </button>\r\n <div\r\n className={`chatbot-modal ${\r\n isModalOpen ? \"chatbot-modal-show\" : \"chatbot-modal-fade\"\r\n }`}\r\n >\r\n {isModalOpen && (\r\n <ChatModal\r\n onClose={closeModal}\r\n apiKey={apiKey}\r\n botName={botName}\r\n systemInstruction={systemInstruction}\r\n />\r\n )}\r\n </div>\r\n </div>\r\n );\r\n};\r\n\r\nexport default ChatIcon;\r\n","import { useState } from \"react\";\r\nimport { Minimize2, Bot, Trash2 } from \"lucide-react\";\r\nimport ChatContainer from \"./ChatContainer\";\r\nimport { ChatModalProps } from \"../types\";\r\n\r\nconst ChatModal: React.FC<ChatModalProps> = ({\r\n onClose,\r\n apiKey,\r\n botName,\r\n systemInstruction,\r\n}) => {\r\n const [showClearModal, setShowClearModal] = useState(false);\r\n\r\n const clearChat = () => {\r\n if (typeof window !== \"undefined\") {\r\n localStorage.removeItem(\"chatMessages\");\r\n window.location.reload();\r\n }\r\n };\r\n\r\n return (\r\n <>\r\n <header className=\"chatbot-modal-header\">\r\n <div className=\"chatbot-modal-header-left\">\r\n <span className=\"chatbot-modal-bot-icon\">\r\n <Bot />\r\n </span>\r\n <div>\r\n <div className=\"chatbot-modal-title\">{botName}</div>\r\n <div className=\"chatbot-modal-status\">\r\n <span>Online 24/7</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div className=\"chatbot-modal-header-right\">\r\n <button\r\n onClick={() => setShowClearModal(true)}\r\n aria-label=\"Settings\"\r\n className=\"chatbot-modal-header-button\"\r\n >\r\n <Trash2 />\r\n </button>\r\n <button\r\n onClick={onClose}\r\n aria-label=\"Minimize chat\"\r\n className=\"chatbot-modal-header-button\"\r\n >\r\n <Minimize2 />\r\n </button>\r\n </div>\r\n </header>\r\n <main className=\"chatbot-modal-main\">\r\n <ChatContainer\r\n apiKey={apiKey}\r\n botName={botName}\r\n systemInstruction={systemInstruction}\r\n />\r\n </main>\r\n\r\n {showClearModal && (\r\n <div className=\"chatbot-clear-modal-overlay\">\r\n <div className=\"chatbot-clear-modal\">\r\n <h2 className=\"chatbot-clear-modal-title\">Clear Conversation</h2>\r\n <p className=\"chatbot-clear-modal-text\">\r\n Are you sure you want to clear the conversation?\r\n </p>\r\n <div className=\"chatbot-clear-modal-buttons\">\r\n <button\r\n onClick={() => setShowClearModal(false)}\r\n className=\"chatbot-clear-modal-button cancel\"\r\n >\r\n Cancel\r\n </button>\r\n <button\r\n onClick={clearChat}\r\n className=\"chatbot-clear-modal-button clear\"\r\n >\r\n Clear\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n )}\r\n </>\r\n );\r\n};\r\n\r\nexport default ChatModal;\r\n","import { useState, useEffect } from \"react\";\r\nimport { GoogleGenerativeAI } from \"@google/generative-ai\";\r\nimport { ChatContainerProps, Message } from \"../types\";\r\n\r\nconst ChatContainer: React.FC<ChatContainerProps> = ({\r\n apiKey,\r\n botName,\r\n systemInstruction,\r\n}) => {\r\n const [message, setMessage] = useState(\"\");\r\n const [messages, setMessages] = useState<Message[]>(() => {\r\n if (typeof window !== \"undefined\") {\r\n const storedMessages = localStorage.getItem(\"chatMessages\");\r\n return storedMessages\r\n ? JSON.parse(storedMessages)\r\n : [\r\n {\r\n sender: \"ai\",\r\n text: `Hello! I'm ${botName}. How can I help you today?`,\r\n },\r\n ];\r\n }\r\n return [\r\n {\r\n sender: \"ai\",\r\n text: `Hello! I'm ${botName}. How can I help you today?`,\r\n },\r\n ];\r\n });\r\n\r\n useEffect(() => {\r\n if (typeof window !== \"undefined\") {\r\n localStorage.setItem(\"chatMessages\", JSON.stringify(messages));\r\n }\r\n }, [messages]);\r\n\r\n const handleSend = async (e: React.FormEvent) => {\r\n e.preventDefault();\r\n if (!message.trim()) return;\r\n\r\n if (!apiKey) {\r\n console.error(\"API key is missing. Please provide a valid API key.\");\r\n return;\r\n }\r\n\r\n setMessages((prev: Message[]) => [\r\n ...prev,\r\n { sender: \"user\", text: message },\r\n ]);\r\n const currentMessage = message;\r\n setMessage(\"\");\r\n\r\n try {\r\n const ai = new GoogleGenerativeAI(apiKey);\r\n const model = ai.getGenerativeModel({\r\n model: \"gemini-2.5-flash\",\r\n });\r\n\r\n const promptWithContext = `\r\n ${systemInstruction}\r\n \r\n Previous conversation history:\r\n ${messages\r\n .slice(1)\r\n .map((m: Message) => `${m.sender}: ${m.text}`)\r\n .join(\"\\n\")}\r\n \r\n User asking: ${currentMessage}\r\n `;\r\n\r\n const result = await model.generateContent(promptWithContext);\r\n const response = await result.response;\r\n const aiText = response.text();\r\n\r\n if (!aiText) {\r\n throw new Error(\"Empty response from AI\");\r\n }\r\n\r\n setMessages((prev: Message[]) => [\r\n ...prev,\r\n { sender: \"ai\", text: aiText },\r\n ]);\r\n } catch (err) {\r\n console.error(\"Chat Error:\", err);\r\n const fallbackResponse =\r\n \"I'm sorry, I'm having trouble connecting right now. Please try again later.\";\r\n setMessages((prev: Message[]) => [\r\n ...prev,\r\n { sender: \"ai\", text: fallbackResponse },\r\n ]);\r\n }\r\n };\r\n\r\n return (\r\n <section className=\"chatbot-container-section\">\r\n <div className=\"chatbot-messages\">\r\n {messages.map((msg: Message, idx: number) => (\r\n <div key={idx} className=\"chatbot-message-wrapper\">\r\n <div\r\n className={`chatbot-message ${\r\n msg.sender === \"ai\" ? \"ai\" : \"user\"\r\n }`}\r\n >\r\n {msg.text}\r\n </div>\r\n </div>\r\n ))}\r\n </div>\r\n <form onSubmit={handleSend} className=\"chatbot-form\">\r\n <input\r\n id=\"chat-input\"\r\n type=\"text\"\r\n placeholder=\"Type a message...\"\r\n className=\"chatbot-input\"\r\n onChange={(e) => setMessage(e.target.value)}\r\n value={message}\r\n />\r\n <button type=\"submit\" className=\"chatbot-send-button\">\r\n Send\r\n </button>\r\n </form>\r\n </section>\r\n );\r\n};\r\n\r\nexport default ChatContainer;\r\n","\n export default function styleInject(css, { insertAt } = {}) {\n if (!css || typeof document === 'undefined') return\n \n const head = document.head || document.getElementsByTagName('head')[0]\n const style = document.createElement('style')\n style.type = 'text/css'\n \n if (insertAt === 'top') {\n if (head.firstChild) {\n head.insertBefore(style, head.firstChild)\n } else {\n head.appendChild(style)\n }\n } else {\n head.appendChild(style)\n }\n \n if (style.styleSheet) {\n style.styleSheet.cssText = css\n } else {\n style.appendChild(document.createTextNode(css))\n }\n }\n ","import styleInject from '#style-inject';styleInject(\"*{margin:0;padding:0;box-sizing:border-box}.chatbot-container{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif}.chatbot-icon-button{position:fixed;bottom:40px;right:40px;width:64px;height:64px;border-radius:50%;background-color:#fffbeb;border:2px solid #d1d5db;box-shadow:0 4px 6px #0000001a;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s ease;z-index:998}.chatbot-icon-button:hover{background-color:#1e3a8a;color:#fff}.chatbot-icon-button svg{width:40px;height:40px}.chatbot-modal{position:fixed;bottom:72px;right:32px;width:320px;height:288px;border-radius:16px;box-shadow:0 10px 15px #0000001a;background-color:#fff;font-family:monospace;border:1px solid #e5e7eb;transition:opacity .1s linear;z-index:999}@media(min-width:768px){.chatbot-modal{width:384px;height:420px}}.chatbot-modal-header{display:flex;align-items:center;justify-content:space-between;padding:16px 24px;background-color:#fff;border-bottom:1px solid #f3f4f6;box-shadow:0 1px 2px #0000000d;border-top-left-radius:16px;border-top-right-radius:16px}.chatbot-modal-header-left{display:flex;align-items:center;gap:12px}.chatbot-modal-bot-icon{background-color:#172554;padding:8px;border-radius:50%;box-shadow:0 1px 2px #0000000d}.chatbot-modal-bot-icon svg{width:20px;height:20px;color:#fff}.chatbot-modal-title{color:#111827;font-weight:600;font-size:16px;letter-spacing:.025em}.chatbot-modal-status{color:#6b7280;font-size:12px;display:flex;align-items:center}.chatbot-modal-header-right{display:flex}.chatbot-modal-header-button{color:#9ca3af;background:transparent;padding:8px;border-radius:6px;transition:all .2s;border:none;cursor:pointer;margin-left:8px}.chatbot-modal-header-button:hover{color:#374151;background-color:#f3f4f6}.chatbot-modal-header-button:focus{outline:none;box-shadow:0 0 0 2px #dbeafe}.chatbot-modal-header-button svg{width:20px;height:20px}.chatbot-modal-main{height:100%}.chatbot-container-section{height:100%;display:flex;flex-direction:column;position:relative;max-width:400px;margin:0 auto}.chatbot-messages{flex:1;padding:12px 16px;display:flex;flex-direction:column;gap:12px;background-color:#fff;overflow-y:auto;max-height:320px;scroll-behavior:smooth}.chatbot-message-wrapper{display:flex;width:100%}.chatbot-message{padding:12px;border-radius:12px;box-shadow:0 1px 2px #0000000d;border:1px solid;font-size:14px;max-width:80%;word-wrap:break-word}.chatbot-message.ai{background-color:#f9fafb;border-color:#f3f4f6;color:#1f2937}.chatbot-message.user{background-color:#2563eb;color:#fff;border-color:#1d4ed8;margin-left:auto}.chatbot-form{flex-shrink:0;display:flex;gap:8px;border-top:1px solid #f3f4f6;padding:12px 16px;background-color:#fff;border-bottom-left-radius:16px;border-bottom-right-radius:16px;width:100%}.chatbot-input{flex:1;background-color:#f9fafb;outline:none;font-size:14px;color:#1f2937;padding:8px;border-radius:8px;border:1px solid #e5e7eb;transition:border-color .2s}.chatbot-input::placeholder{color:#9ca3af}.chatbot-input:focus{border-color:#93c5fd}.chatbot-send-button{background-color:#2563eb;color:#fff;padding:8px 16px;border-radius:8px;font-size:14px;box-shadow:0 1px 2px #0000000d;font-weight:500;border:none;cursor:pointer;transition:background-color .2s}.chatbot-send-button:hover{background-color:#1d4ed8}.chatbot-clear-modal-overlay{position:fixed;inset:0;background-color:#00000080;display:flex;align-items:center;justify-content:center;z-index:10000}.chatbot-clear-modal{background-color:#fff;padding:24px;border-radius:8px;box-shadow:0 10px 15px #0000001a}.chatbot-clear-modal-title{font-size:18px;font-weight:600;margin-bottom:16px;color:#1f2937}.chatbot-clear-modal-text{font-size:14px;color:#6b7280;margin-bottom:24px}.chatbot-clear-modal-buttons{display:flex;justify-content:flex-end;gap:16px}.chatbot-clear-modal-button{padding:8px 16px;border-radius:6px;cursor:pointer;border:none;transition:background-color .2s}.chatbot-clear-modal-button.cancel{background-color:#e5e7eb;color:#374151}.chatbot-clear-modal-button.cancel:hover{background-color:#d1d5db}.chatbot-clear-modal-button.clear{background-color:#dc2626;color:#fff}.chatbot-clear-modal-button.clear:hover{background-color:#b91c1c}.chatbot-modal-fade{opacity:0;pointer-events:none}.chatbot-modal-show{opacity:1}\\n\")"],"mappings":"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","names":["index_exports","__export","index_default","__toCommonJS","import_react","import_lucide_react","import_react","import_lucide_react","import_react","import_generative_ai","import_jsx_runtime","ChatContainer","apiKey","botName","systemInstruction","message","setMessage","messages","setMessages","storedMessages","handleSend","e","prev","currentMessage","model","promptWithContext","aiText","err","fallbackResponse","msg","idx","ChatContainer_default","import_jsx_runtime","ChatModal","onClose","apiKey","botName","systemInstruction","showClearModal","setShowClearModal","ChatContainer_default","ChatModal_default","import_jsx_runtime","ChatIcon","apiKey","botName","systemInstruction","isModalOpen","setIsModalOpen","ChatModal_default","ChatIcon_default","styleInject","css","insertAt","head","style","styleInject","import_jsx_runtime","ChatBot","apiKey","botName","systemInstruction","resolvedApiKey","resolvedBotName","resolvedSystemInstruction","ChatIcon_default","index_default"]}
package/dist/index.mjs CHANGED
@@ -1,12 +1,12 @@
1
1
  "use client";
2
- import{useState as A}from"react";import{Bot as B}from"lucide-react";import{useState as E}from"react";import{Minimize2 as P,Bot as _,Trash2 as T}from"lucide-react";import{useState as x,useEffect as M}from"react";import{GoogleGenerativeAI as z}from"@google/generative-ai";import{jsx as c,jsxs as v}from"react/jsx-runtime";var S=({apiKey:r,botName:a,systemInstruction:t})=>{let[o,n]=x(""),[i,d]=x(()=>{if(typeof window<"u"){let s=localStorage.getItem("chatMessages");return s?JSON.parse(s):[{sender:"ai",text:`Hello! I'm ${a}. How can I help you today?`}]}return[{sender:"ai",text:`Hello! I'm ${a}. How can I help you today?`}]});M(()=>{typeof window<"u"&&localStorage.setItem("chatMessages",JSON.stringify(i))},[i]);let I=async s=>{if(s.preventDefault(),!o.trim())return;if(!r){console.error("API key is missing. Please provide a valid API key.");return}d(h=>[...h,{sender:"user",text:o}]);let b=o;n("");try{let u=new z(r).getGenerativeModel({model:"gemini-2.5-flash"}),f=`
3
- ${t}
2
+ import{useState as U}from"react";import{Bot as R}from"lucide-react";import{useState as E}from"react";import{Minimize2 as S,Bot as T,Trash2 as B}from"lucide-react";import{useState as v,useEffect as k}from"react";import{GoogleGenerativeAI as P}from"@google/generative-ai";import{jsx as l,jsxs as y}from"react/jsx-runtime";var _=({apiKey:a,botName:r,systemInstruction:e})=>{let[o,n]=v(""),[s,d]=v(()=>{if(typeof window<"u"){let i=localStorage.getItem("chatMessages");return i?JSON.parse(i):[{sender:"ai",text:`Hello! I'm ${r}. How can I help you today?`}]}return[{sender:"ai",text:`Hello! I'm ${r}. How can I help you today?`}]});k(()=>{typeof window<"u"&&localStorage.setItem("chatMessages",JSON.stringify(s))},[s]);let M=async i=>{if(i.preventDefault(),!o.trim())return;if(!a){console.error("API key is missing. Please provide a valid API key.");return}d(p=>[...p,{sender:"user",text:o}]);let m=o;n("");try{let f=new P(a).getGenerativeModel({model:"gemini-2.5-flash"}),u=`
3
+ ${e}
4
4
 
5
5
  Previous conversation history:
6
- ${i.slice(1).map(g=>`${g.sender}: ${g.text}`).join(`
6
+ ${s.slice(1).map(b=>`${b.sender}: ${b.text}`).join(`
7
7
  `)}
8
8
 
9
- User asking: ${b}
10
- `,w=(await(await u.generateContent(f)).response).text();if(!w)throw new Error("Empty response from AI");d(g=>[...g,{sender:"ai",text:w}])}catch(h){console.error("Chat Error:",h);let u="I'm sorry, I'm having trouble connecting right now. Please try again later.";d(f=>[...f,{sender:"ai",text:u}])}};return v("section",{className:"h-full flex flex-col relative max-w-100 mx-auto",children:[c("div",{className:"flex-1 px-4 py-3 space-y-3 bg-white overflow-y-auto",style:{maxHeight:"320px",scrollBehavior:"smooth"},children:i.map((s,b)=>c("div",{className:"flex w-full",children:c("div",{className:`px-3 py-2 rounded-xl shadow-sm border text-sm max-w-[80%] ${s.sender==="ai"?"bg-gray-50 border-gray-100 text-gray-800":"bg-blue-600 text-white border-blue-700 ml-auto"}`,children:s.text})},b))}),v("form",{onSubmit:I,className:"shrink-0 flex gap-2 border-t border-gray-100 px-4 py-3 bg-white rounded-b-2xl w-full",children:[c("input",{id:"chat-input",type:"text",placeholder:"Type a message...",className:"flex-1 bg-gray-50 outline-none text-sm text-gray-800 placeholder:text-gray-400 px-2 py-1 rounded-lg border border-gray-200 focus:border-blue-300 transition",onChange:s=>n(s.target.value),value:o}),c("button",{type:"submit",className:"bg-blue-600 text-white px-4 py-1 rounded-lg text-sm shadow-sm font-medium hover:bg-blue-700 transition",children:"Send"})]})]})},y=S;import{jsx as e,jsxs as l}from"react/jsx-runtime";var j=({onClose:r,apiKey:a,botName:t,systemInstruction:o})=>{let[n,i]=E(!1);return l("div",{className:"fixed bottom-14 right-8 w-80 h-72 md:w-96 md:h-105 rounded-2xl shadow-lg bg-white font-mono border border-gray-200",children:[l("header",{className:"flex items-center justify-between px-6 py-4 bg-white border-b shadow border-gray-100 rounded-t-2xl",children:[l("div",{className:"flex items-center gap-3",children:[e("span",{className:"bg-blue-950 p-2 rounded-full shadow-sm",children:e(_,{className:"w-5 h-5 text-white"})}),l("div",{children:[e("div",{className:"text-gray-900 font-semibold text-md tracking-wide",children:t}),e("div",{className:"text-gray-500 text-xs flex items-center",children:e("span",{children:"Online 24/7"})})]})]}),l("div",{children:[e("button",{onClick:()=>i(!0),"aria-label":"Settings",className:"text-gray-400 hover:text-gray-700 bg-transparent p-2 rounded-md transition-all duration-200 focus:outline-none focus:ring-2 focus:ring-blue-200 hover:bg-gray-100 mr-2 cursor-pointer",children:e(T,{className:"w-5 h-5"})}),e("button",{onClick:r,"aria-label":"Minimize chat",className:"text-gray-400 hover:text-gray-700 bg-transparent p-2 rounded-md transition-all duration-200 focus:outline-none focus:ring-2 focus:ring-blue-200 hover:bg-gray-100 cursor-pointer",children:e(P,{className:"w-5 h-5"})})]})]}),e("main",{className:"h-full",children:e(y,{apiKey:a,botName:t,systemInstruction:o})}),n&&e("div",{className:"fixed inset-0 border shadow bg-opacity-50 flex items-center justify-center",children:l("div",{className:"bg-white p-6 rounded-lg shadow-lg",children:[e("h2",{className:"text-lg font-semibold mb-4 text-gray-800",children:"Clear Conversation"}),e("p",{className:"text-sm text-gray-600 mb-6",children:"Are you sure you want to clear the conversation?"}),l("div",{className:"flex justify-end gap-4",children:[e("button",{onClick:()=>i(!1),className:"px-4 py-2 bg-gray-200 text-gray-700 rounded-md hover:bg-gray-300",children:"Cancel"}),e("button",{onClick:()=>{typeof window<"u"&&(localStorage.removeItem("chatMessages"),window.location.reload())},className:"px-4 py-2 bg-red-600 text-white rounded-md hover:bg-red-700",children:"Clear"})]})]})})]})},k=j;import{Fragment as R,jsx as p,jsxs as L}from"react/jsx-runtime";var U=({apiKey:r,botName:a,systemInstruction:t})=>{let[o,n]=A(!1);return L(R,{children:[p("button",{onClick:()=>{n(!0)},children:p("div",{className:"bg-amber-50 p-4 rounded-full shadow-md fixed bottom-10 right-10 w-16 h-16 flex items-center justify-center cursor-pointer hover:bg-blue-950 transition transform-fill ring:b-amber-500 focus:bg-amber-900 duration-300 border-gray-300 dark:border-white border-2 text-black hover:text-white",children:p(B,{className:"w-10 h-10"})})}),p("div",{className:`transition-opacity duration-100 ease-linear ${o?"opacity-100":"opacity-0 pointer-events-none"}`,children:o&&p(k,{onClose:()=>{n(!1)},apiKey:r,botName:a,systemInstruction:t})})]})},C=U;function m(r,{insertAt:a}={}){if(!r||typeof document>"u")return;let t=document.head||document.getElementsByTagName("head")[0],o=document.createElement("style");o.type="text/css",a==="top"&&t.firstChild?t.insertBefore(o,t.firstChild):t.appendChild(o),o.styleSheet?o.styleSheet.cssText=r:o.appendChild(document.createTextNode(r))}m(`/*! tailwindcss v4.1.18 | MIT License | https://tailwindcss.com */@layer properties;@layer theme,base,components,utilities;@layer theme{:root,:host{--font-sans: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--color-red-600: oklch(57.7% .245 27.325);--color-red-700: oklch(50.5% .213 27.518);--color-amber-50: oklch(98.7% .022 95.277);--color-amber-900: oklch(41.4% .112 45.904);--color-blue-200: oklch(88.2% .059 254.128);--color-blue-300: oklch(80.9% .105 251.813);--color-blue-600: oklch(54.6% .245 262.881);--color-blue-700: oklch(48.8% .243 264.376);--color-blue-950: oklch(28.2% .091 267.935);--color-gray-50: oklch(98.5% .002 247.839);--color-gray-100: oklch(96.7% .003 264.542);--color-gray-200: oklch(92.8% .006 264.531);--color-gray-300: oklch(87.2% .01 258.338);--color-gray-400: oklch(70.7% .022 261.325);--color-gray-500: oklch(55.1% .027 264.364);--color-gray-600: oklch(44.6% .03 256.802);--color-gray-700: oklch(37.3% .034 259.733);--color-gray-800: oklch(27.8% .033 256.848);--color-gray-900: oklch(21% .034 264.665);--color-black: #000;--color-white: #fff;--spacing: .25rem;--text-xs: .75rem;--text-xs--line-height: calc(1 / .75);--text-sm: .875rem;--text-sm--line-height: calc(1.25 / .875);--text-lg: 1.125rem;--text-lg--line-height: calc(1.75 / 1.125);--font-weight-medium: 500;--font-weight-semibold: 600;--tracking-wide: .025em;--radius-md: .375rem;--radius-lg: .5rem;--radius-xl: .75rem;--radius-2xl: 1rem;--default-transition-duration: .15s;--default-transition-timing-function: cubic-bezier(.4, 0, .2, 1);--default-font-family: var(--font-sans);--default-mono-font-family: var(--font-mono)}}@layer base{*,:after,:before,::backdrop,::file-selector-button{box-sizing:border-box;margin:0;padding:0;border:0 solid}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:var(--default-font-family, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings, normal);font-variation-settings:var(--default-font-variation-settings, normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-feature-settings:var(--default-mono-font-feature-settings, normal);font-variation-settings:var(--default-mono-font-variation-settings, normal);font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea,::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;border-radius:0;background-color:transparent;opacity:1}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::-moz-placeholder{opacity:1}::placeholder{opacity:1}@supports (not (-webkit-appearance: -apple-pay-button)) or (contain-intrinsic-size: 1px){::-moz-placeholder{color:currentcolor;@supports (color: color-mix(in lab,red,red)){color:color-mix(in oklab,currentcolor 50%,transparent)}}::placeholder{color:currentcolor;@supports (color: color-mix(in lab,red,red)){color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit,::-webkit-datetime-edit-year-field,::-webkit-datetime-edit-month-field,::-webkit-datetime-edit-day-field,::-webkit-datetime-edit-hour-field,::-webkit-datetime-edit-minute-field,::-webkit-datetime-edit-second-field,::-webkit-datetime-edit-millisecond-field,::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]),::file-selector-button{-webkit-appearance:button;-moz-appearance:button;appearance:button}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer utilities{.pointer-events-none{pointer-events:none}.fixed{position:fixed}.relative{position:relative}.inset-0{inset:calc(var(--spacing) * 0)}.right-8{right:calc(var(--spacing) * 8)}.right-10{right:calc(var(--spacing) * 10)}.bottom-10{bottom:calc(var(--spacing) * 10)}.bottom-14{bottom:calc(var(--spacing) * 14)}.mx-auto{margin-inline:auto}.mr-2{margin-right:calc(var(--spacing) * 2)}.mb-4{margin-bottom:calc(var(--spacing) * 4)}.mb-6{margin-bottom:calc(var(--spacing) * 6)}.ml-auto{margin-left:auto}.flex{display:flex}.h-5{height:calc(var(--spacing) * 5)}.h-10{height:calc(var(--spacing) * 10)}.h-16{height:calc(var(--spacing) * 16)}.h-72{height:calc(var(--spacing) * 72)}.h-full{height:100%}.w-5{width:calc(var(--spacing) * 5)}.w-10{width:calc(var(--spacing) * 10)}.w-16{width:calc(var(--spacing) * 16)}.w-80{width:calc(var(--spacing) * 80)}.w-full{width:100%}.max-w-100{max-width:calc(var(--spacing) * 100)}.max-w-\\[80\\%\\]{max-width:80%}.flex-1{flex:1}.shrink-0{flex-shrink:0}.cursor-pointer{cursor:pointer}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.justify-end{justify-content:flex-end}.gap-2{gap:calc(var(--spacing) * 2)}.gap-3{gap:calc(var(--spacing) * 3)}.gap-4{gap:calc(var(--spacing) * 4)}.space-y-3{:where(&>:not(:last-child)){--tw-space-y-reverse: 0;margin-block-start:calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)))}}.overflow-y-auto{overflow-y:auto}.rounded-2xl{border-radius:var(--radius-2xl)}.rounded-full{border-radius:calc(infinity * 1px)}.rounded-lg{border-radius:var(--radius-lg)}.rounded-md{border-radius:var(--radius-md)}.rounded-xl{border-radius:var(--radius-xl)}.rounded-t-2xl{border-top-left-radius:var(--radius-2xl);border-top-right-radius:var(--radius-2xl)}.rounded-b-2xl{border-bottom-right-radius:var(--radius-2xl);border-bottom-left-radius:var(--radius-2xl)}.border{border-style:var(--tw-border-style);border-width:1px}.border-2{border-style:var(--tw-border-style);border-width:2px}.border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-blue-700{border-color:var(--color-blue-700)}.border-gray-100{border-color:var(--color-gray-100)}.border-gray-200{border-color:var(--color-gray-200)}.border-gray-300{border-color:var(--color-gray-300)}.bg-amber-50{background-color:var(--color-amber-50)}.bg-blue-600{background-color:var(--color-blue-600)}.bg-blue-950{background-color:var(--color-blue-950)}.bg-gray-50{background-color:var(--color-gray-50)}.bg-gray-200{background-color:var(--color-gray-200)}.bg-red-600{background-color:var(--color-red-600)}.bg-transparent{background-color:transparent}.bg-white{background-color:var(--color-white)}.p-2{padding:calc(var(--spacing) * 2)}.p-4{padding:calc(var(--spacing) * 4)}.p-6{padding:calc(var(--spacing) * 6)}.px-2{padding-inline:calc(var(--spacing) * 2)}.px-3{padding-inline:calc(var(--spacing) * 3)}.px-4{padding-inline:calc(var(--spacing) * 4)}.px-6{padding-inline:calc(var(--spacing) * 6)}.py-1{padding-block:calc(var(--spacing) * 1)}.py-2{padding-block:calc(var(--spacing) * 2)}.py-3{padding-block:calc(var(--spacing) * 3)}.py-4{padding-block:calc(var(--spacing) * 4)}.font-mono{font-family:var(--font-mono)}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading, var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading, var(--text-sm--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading, var(--text-xs--line-height))}.font-medium{--tw-font-weight: var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-semibold{--tw-font-weight: var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.tracking-wide{--tw-tracking: var(--tracking-wide);letter-spacing:var(--tracking-wide)}.text-black{color:var(--color-black)}.text-gray-400{color:var(--color-gray-400)}.text-gray-500{color:var(--color-gray-500)}.text-gray-600{color:var(--color-gray-600)}.text-gray-700{color:var(--color-gray-700)}.text-gray-800{color:var(--color-gray-800)}.text-gray-900{color:var(--color-gray-900)}.text-white{color:var(--color-white)}.opacity-0{opacity:0%}.opacity-100{opacity:100%}.shadow{--tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-lg{--tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-md{--tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-sm{--tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function));transition-duration:var(--tw-duration, var(--default-transition-duration))}.transition-all{transition-property:all;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function));transition-duration:var(--tw-duration, var(--default-transition-duration))}.transition-opacity{transition-property:opacity;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function));transition-duration:var(--tw-duration, var(--default-transition-duration))}.duration-100{--tw-duration: .1s;transition-duration:.1s}.duration-200{--tw-duration: .2s;transition-duration:.2s}.duration-300{--tw-duration: .3s;transition-duration:.3s}.ease-linear{--tw-ease: linear;transition-timing-function:linear}.outline-none{--tw-outline-style: none;outline-style:none}.transform-fill{transform-box:fill-box}.placeholder\\:text-gray-400{&::-moz-placeholder{color:var(--color-gray-400)}&::placeholder{color:var(--color-gray-400)}}.hover\\:bg-blue-700{&:hover{@media(hover:hover){background-color:var(--color-blue-700)}}}.hover\\:bg-blue-950{&:hover{@media(hover:hover){background-color:var(--color-blue-950)}}}.hover\\:bg-gray-100{&:hover{@media(hover:hover){background-color:var(--color-gray-100)}}}.hover\\:bg-gray-300{&:hover{@media(hover:hover){background-color:var(--color-gray-300)}}}.hover\\:bg-red-700{&:hover{@media(hover:hover){background-color:var(--color-red-700)}}}.hover\\:text-gray-700{&:hover{@media(hover:hover){color:var(--color-gray-700)}}}.hover\\:text-white{&:hover{@media(hover:hover){color:var(--color-white)}}}.focus\\:border-blue-300{&:focus{border-color:var(--color-blue-300)}}.focus\\:bg-amber-900{&:focus{background-color:var(--color-amber-900)}}.focus\\:ring-2{&:focus{--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}}.focus\\:ring-blue-200{&:focus{--tw-ring-color: var(--color-blue-200)}}.focus\\:outline-none{&:focus{--tw-outline-style: none;outline-style:none}}.md\\:h-105{@media(width>=48rem){height:calc(var(--spacing) * 105)}}.md\\:w-96{@media(width>=48rem){width:calc(var(--spacing) * 96)}}.dark\\:border-white{@media(prefers-color-scheme:dark){border-color:var(--color-white)}}}*{margin:0;padding:0;box-sizing:border-box}.chatbot-container{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif}.chatbot-icon-button{position:fixed;bottom:40px;right:40px;width:64px;height:64px;border-radius:50%;background-color:#fffbeb;border:2px solid #d1d5db;box-shadow:0 4px 6px #0000001a;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s ease;z-index:9999}.chatbot-icon-button:hover{background-color:#1e3a8a;color:#fff}.chatbot-icon-button svg{width:40px;height:40px}.chatbot-modal{position:fixed;bottom:72px;right:32px;width:320px;height:288px;border-radius:16px;box-shadow:0 10px 15px #0000001a;background-color:#fff;font-family:monospace;border:1px solid #e5e7eb;transition:opacity .1s linear;z-index:9998}@media(min-width:768px){.chatbot-modal{width:384px;height:420px}}.chatbot-modal-header{display:flex;align-items:center;justify-content:space-between;padding:16px 24px;background-color:#fff;border-bottom:1px solid #f3f4f6;box-shadow:0 1px 2px #0000000d;border-top-left-radius:16px;border-top-right-radius:16px}.chatbot-modal-header-left{display:flex;align-items:center;gap:12px}.chatbot-modal-bot-icon{background-color:#172554;padding:8px;border-radius:50%;box-shadow:0 1px 2px #0000000d}.chatbot-modal-bot-icon svg{width:20px;height:20px;color:#fff}.chatbot-modal-title{color:#111827;font-weight:600;font-size:16px;letter-spacing:.025em}.chatbot-modal-status{color:#6b7280;font-size:12px;display:flex;align-items:center}.chatbot-modal-header-right{display:flex}.chatbot-modal-header-button{color:#9ca3af;background:transparent;padding:8px;border-radius:6px;transition:all .2s;border:none;cursor:pointer;margin-left:8px}.chatbot-modal-header-button:hover{color:#374151;background-color:#f3f4f6}.chatbot-modal-header-button:focus{outline:none;box-shadow:0 0 0 2px #dbeafe}.chatbot-modal-header-button svg{width:20px;height:20px}.chatbot-modal-main{height:100%}.chatbot-container-section{height:100%;display:flex;flex-direction:column;position:relative;max-width:400px;margin:0 auto}.chatbot-messages{flex:1;padding:12px 16px;display:flex;flex-direction:column;gap:12px;background-color:#fff;overflow-y:auto;max-height:320px;scroll-behavior:smooth}.chatbot-message-wrapper{display:flex;width:100%}.chatbot-message{padding:12px;border-radius:12px;box-shadow:0 1px 2px #0000000d;border:1px solid;font-size:14px;max-width:80%;word-wrap:break-word}.chatbot-message.ai{background-color:#f9fafb;border-color:#f3f4f6;color:#1f2937}.chatbot-message.user{background-color:#2563eb;color:#fff;border-color:#1d4ed8;margin-left:auto}.chatbot-form{flex-shrink:0;display:flex;gap:8px;border-top:1px solid #f3f4f6;padding:12px 16px;background-color:#fff;border-bottom-left-radius:16px;border-bottom-right-radius:16px;width:100%}.chatbot-input{flex:1;background-color:#f9fafb;outline:none;font-size:14px;color:#1f2937;padding:8px;border-radius:8px;border:1px solid #e5e7eb;transition:border-color .2s}.chatbot-input::-moz-placeholder{color:#9ca3af}.chatbot-input::placeholder{color:#9ca3af}.chatbot-input:focus{border-color:#93c5fd}.chatbot-send-button{background-color:#2563eb;color:#fff;padding:8px 16px;border-radius:8px;font-size:14px;box-shadow:0 1px 2px #0000000d;font-weight:500;border:none;cursor:pointer;transition:background-color .2s}.chatbot-send-button:hover{background-color:#1d4ed8}.chatbot-clear-modal-overlay{position:fixed;inset:0;background-color:#00000080;display:flex;align-items:center;justify-content:center;z-index:10000}.chatbot-clear-modal{background-color:#fff;padding:24px;border-radius:8px;box-shadow:0 10px 15px #0000001a}.chatbot-clear-modal-title{font-size:18px;font-weight:600;margin-bottom:16px;color:#1f2937}.chatbot-clear-modal-text{font-size:14px;color:#6b7280;margin-bottom:24px}.chatbot-clear-modal-buttons{display:flex;justify-content:flex-end;gap:16px}.chatbot-clear-modal-button{padding:8px 16px;border-radius:6px;cursor:pointer;border:none;transition:background-color .2s}.chatbot-clear-modal-button.cancel{background-color:#e5e7eb;color:#374151}.chatbot-clear-modal-button.cancel:hover{background-color:#d1d5db}.chatbot-clear-modal-button.clear{background-color:#dc2626;color:#fff}.chatbot-clear-modal-button.clear:hover{background-color:#b91c1c}.chatbot-modal-fade{opacity:0;pointer-events:none}.chatbot-modal-show{opacity:1}@property --tw-space-y-reverse{syntax: "*"; inherits: false; initial-value: 0;}@property --tw-border-style{syntax: "*"; inherits: false; initial-value: solid;}@property --tw-font-weight{syntax: "*"; inherits: false;}@property --tw-tracking{syntax: "*"; inherits: false;}@property --tw-shadow{syntax: "*"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: "*"; inherits: false;}@property --tw-shadow-alpha{syntax: "<percentage>"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: "*"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: "*"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: "<percentage>"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: "*"; inherits: false;}@property --tw-ring-shadow{syntax: "*"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: "*"; inherits: false;}@property --tw-inset-ring-shadow{syntax: "*"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: "*"; inherits: false;}@property --tw-ring-offset-width{syntax: "<length>"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: "*"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: "*"; inherits: false; initial-value: 0 0 #0000;}@property --tw-duration{syntax: "*"; inherits: false;}@property --tw-ease{syntax: "*"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-space-y-reverse: 0;--tw-border-style: solid;--tw-font-weight: initial;--tw-tracking: initial;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000;--tw-duration: initial;--tw-ease: initial}}}
11
- `);import{jsx as N}from"react/jsx-runtime";var O=({apiKey:r,botName:a,systemInstruction:t})=>{let o=r||(typeof process<"u"&&process.env?.NEXT_PUBLIC_GEMINI_API_KEY?process.env.NEXT_PUBLIC_GEMINI_API_KEY:""),n=a||(typeof process<"u"&&process.env?.NEXT_PUBLIC_AI_BOT_NAME?process.env.NEXT_PUBLIC_AI_BOT_NAME:"AI Assistant"),i=t||(typeof process<"u"&&process.env?.NEXT_PUBLIC_SYSTEM_INSTRUCTION?process.env.NEXT_PUBLIC_SYSTEM_INSTRUCTION:"You are a helpful AI assistant.");return o||console.warn("ChatBot: API key is missing. Please provide it via environment variable NEXT_PUBLIC_GEMINI_API_KEY"),N("div",{className:"chatbot-container",children:N(C,{apiKey:o,botName:n,systemInstruction:i})})},no=O;export{no as default};
9
+ User asking: ${m}
10
+ `,g=(await(await f.generateContent(u)).response).text();if(!g)throw new Error("Empty response from AI");d(b=>[...b,{sender:"ai",text:g}])}catch(p){console.error("Chat Error:",p);let f="I'm sorry, I'm having trouble connecting right now. Please try again later.";d(u=>[...u,{sender:"ai",text:f}])}};return y("section",{className:"chatbot-container-section",children:[l("div",{className:"chatbot-messages",children:s.map((i,m)=>l("div",{className:"chatbot-message-wrapper",children:l("div",{className:`chatbot-message ${i.sender==="ai"?"ai":"user"}`,children:i.text})},m))}),y("form",{onSubmit:M,className:"chatbot-form",children:[l("input",{id:"chat-input",type:"text",placeholder:"Type a message...",className:"chatbot-input",onChange:i=>n(i.target.value),value:o}),l("button",{type:"submit",className:"chatbot-send-button",children:"Send"})]})]})},C=_;import{Fragment as z,jsx as t,jsxs as c}from"react/jsx-runtime";var A=({onClose:a,apiKey:r,botName:e,systemInstruction:o})=>{let[n,s]=E(!1);return c(z,{children:[c("header",{className:"chatbot-modal-header",children:[c("div",{className:"chatbot-modal-header-left",children:[t("span",{className:"chatbot-modal-bot-icon",children:t(T,{})}),c("div",{children:[t("div",{className:"chatbot-modal-title",children:e}),t("div",{className:"chatbot-modal-status",children:t("span",{children:"Online 24/7"})})]})]}),c("div",{className:"chatbot-modal-header-right",children:[t("button",{onClick:()=>s(!0),"aria-label":"Settings",className:"chatbot-modal-header-button",children:t(B,{})}),t("button",{onClick:a,"aria-label":"Minimize chat",className:"chatbot-modal-header-button",children:t(S,{})})]})]}),t("main",{className:"chatbot-modal-main",children:t(C,{apiKey:r,botName:e,systemInstruction:o})}),n&&t("div",{className:"chatbot-clear-modal-overlay",children:c("div",{className:"chatbot-clear-modal",children:[t("h2",{className:"chatbot-clear-modal-title",children:"Clear Conversation"}),t("p",{className:"chatbot-clear-modal-text",children:"Are you sure you want to clear the conversation?"}),c("div",{className:"chatbot-clear-modal-buttons",children:[t("button",{onClick:()=>s(!1),className:"chatbot-clear-modal-button cancel",children:"Cancel"}),t("button",{onClick:()=>{typeof window<"u"&&(localStorage.removeItem("chatMessages"),window.location.reload())},className:"chatbot-clear-modal-button clear",children:"Clear"})]})]})})]})},w=A;import{jsx as h,jsxs as $}from"react/jsx-runtime";var O=({apiKey:a,botName:r,systemInstruction:e})=>{let[o,n]=U(!1);return $("div",{className:"chatbot-container",children:[h("button",{onClick:()=>{n(!0)},className:"chatbot-icon-button",children:h(R,{})}),h("div",{className:`chatbot-modal ${o?"chatbot-modal-show":"chatbot-modal-fade"}`,children:o&&h(w,{onClose:()=>{n(!1)},apiKey:a,botName:r,systemInstruction:e})})]})},I=O;function x(a,{insertAt:r}={}){if(!a||typeof document>"u")return;let e=document.head||document.getElementsByTagName("head")[0],o=document.createElement("style");o.type="text/css",r==="top"&&e.firstChild?e.insertBefore(o,e.firstChild):e.appendChild(o),o.styleSheet?o.styleSheet.cssText=a:o.appendChild(document.createTextNode(a))}x(`*{margin:0;padding:0;box-sizing:border-box}.chatbot-container{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif}.chatbot-icon-button{position:fixed;bottom:40px;right:40px;width:64px;height:64px;border-radius:50%;background-color:#fffbeb;border:2px solid #d1d5db;box-shadow:0 4px 6px #0000001a;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s ease;z-index:998}.chatbot-icon-button:hover{background-color:#1e3a8a;color:#fff}.chatbot-icon-button svg{width:40px;height:40px}.chatbot-modal{position:fixed;bottom:72px;right:32px;width:320px;height:288px;border-radius:16px;box-shadow:0 10px 15px #0000001a;background-color:#fff;font-family:monospace;border:1px solid #e5e7eb;transition:opacity .1s linear;z-index:999}@media(min-width:768px){.chatbot-modal{width:384px;height:420px}}.chatbot-modal-header{display:flex;align-items:center;justify-content:space-between;padding:16px 24px;background-color:#fff;border-bottom:1px solid #f3f4f6;box-shadow:0 1px 2px #0000000d;border-top-left-radius:16px;border-top-right-radius:16px}.chatbot-modal-header-left{display:flex;align-items:center;gap:12px}.chatbot-modal-bot-icon{background-color:#172554;padding:8px;border-radius:50%;box-shadow:0 1px 2px #0000000d}.chatbot-modal-bot-icon svg{width:20px;height:20px;color:#fff}.chatbot-modal-title{color:#111827;font-weight:600;font-size:16px;letter-spacing:.025em}.chatbot-modal-status{color:#6b7280;font-size:12px;display:flex;align-items:center}.chatbot-modal-header-right{display:flex}.chatbot-modal-header-button{color:#9ca3af;background:transparent;padding:8px;border-radius:6px;transition:all .2s;border:none;cursor:pointer;margin-left:8px}.chatbot-modal-header-button:hover{color:#374151;background-color:#f3f4f6}.chatbot-modal-header-button:focus{outline:none;box-shadow:0 0 0 2px #dbeafe}.chatbot-modal-header-button svg{width:20px;height:20px}.chatbot-modal-main{height:100%}.chatbot-container-section{height:100%;display:flex;flex-direction:column;position:relative;max-width:400px;margin:0 auto}.chatbot-messages{flex:1;padding:12px 16px;display:flex;flex-direction:column;gap:12px;background-color:#fff;overflow-y:auto;max-height:320px;scroll-behavior:smooth}.chatbot-message-wrapper{display:flex;width:100%}.chatbot-message{padding:12px;border-radius:12px;box-shadow:0 1px 2px #0000000d;border:1px solid;font-size:14px;max-width:80%;word-wrap:break-word}.chatbot-message.ai{background-color:#f9fafb;border-color:#f3f4f6;color:#1f2937}.chatbot-message.user{background-color:#2563eb;color:#fff;border-color:#1d4ed8;margin-left:auto}.chatbot-form{flex-shrink:0;display:flex;gap:8px;border-top:1px solid #f3f4f6;padding:12px 16px;background-color:#fff;border-bottom-left-radius:16px;border-bottom-right-radius:16px;width:100%}.chatbot-input{flex:1;background-color:#f9fafb;outline:none;font-size:14px;color:#1f2937;padding:8px;border-radius:8px;border:1px solid #e5e7eb;transition:border-color .2s}.chatbot-input::placeholder{color:#9ca3af}.chatbot-input:focus{border-color:#93c5fd}.chatbot-send-button{background-color:#2563eb;color:#fff;padding:8px 16px;border-radius:8px;font-size:14px;box-shadow:0 1px 2px #0000000d;font-weight:500;border:none;cursor:pointer;transition:background-color .2s}.chatbot-send-button:hover{background-color:#1d4ed8}.chatbot-clear-modal-overlay{position:fixed;inset:0;background-color:#00000080;display:flex;align-items:center;justify-content:center;z-index:10000}.chatbot-clear-modal{background-color:#fff;padding:24px;border-radius:8px;box-shadow:0 10px 15px #0000001a}.chatbot-clear-modal-title{font-size:18px;font-weight:600;margin-bottom:16px;color:#1f2937}.chatbot-clear-modal-text{font-size:14px;color:#6b7280;margin-bottom:24px}.chatbot-clear-modal-buttons{display:flex;justify-content:flex-end;gap:16px}.chatbot-clear-modal-button{padding:8px 16px;border-radius:6px;cursor:pointer;border:none;transition:background-color .2s}.chatbot-clear-modal-button.cancel{background-color:#e5e7eb;color:#374151}.chatbot-clear-modal-button.cancel:hover{background-color:#d1d5db}.chatbot-clear-modal-button.clear{background-color:#dc2626;color:#fff}.chatbot-clear-modal-button.clear:hover{background-color:#b91c1c}.chatbot-modal-fade{opacity:0;pointer-events:none}.chatbot-modal-show{opacity:1}
11
+ `);import{jsx as N}from"react/jsx-runtime";var G=({apiKey:a,botName:r,systemInstruction:e})=>{let o=a||(typeof process<"u"&&process.env?.NEXT_PUBLIC_GEMINI_API_KEY?process.env.NEXT_PUBLIC_GEMINI_API_KEY:""),n=r||(typeof process<"u"&&process.env?.NEXT_PUBLIC_AI_BOT_NAME?process.env.NEXT_PUBLIC_AI_BOT_NAME:"AI Assistant"),s=e||(typeof process<"u"&&process.env?.NEXT_PUBLIC_SYSTEM_INSTRUCTION?process.env.NEXT_PUBLIC_SYSTEM_INSTRUCTION:"You are a helpful AI assistant.");return o||console.warn("ChatBot: API key is missing. Please provide it via environment variable NEXT_PUBLIC_GEMINI_API_KEY"),N("div",{className:"chatbot-container",children:N(I,{apiKey:o,botName:n,systemInstruction:s})})},no=G;export{no as default};
12
12
  //# sourceMappingURL=index.mjs.map
package/dist/index.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/ChatIcon.tsx","../src/components/ChatModal.tsx","../src/components/ChatContainer.tsx","#style-inject:#style-inject","../src/styles/chatbot.css","../src/index.tsx"],"sourcesContent":["import { useState } from \"react\";\r\nimport { Bot } from \"lucide-react\";\r\nimport ChatModal from \"./ChatModal\";\r\nimport { ChatIconProps } from \"../types\";\r\n\r\nconst ChatIcon: React.FC<ChatIconProps> = ({\r\n apiKey,\r\n botName,\r\n systemInstruction,\r\n}) => {\r\n const [isModalOpen, setIsModalOpen] = useState(false);\r\n\r\n const openModal = () => {\r\n setIsModalOpen(true);\r\n };\r\n\r\n const closeModal = () => {\r\n setIsModalOpen(false);\r\n };\r\n\r\n return (\r\n <>\r\n <button onClick={openModal}>\r\n <div className=\"bg-amber-50 p-4 rounded-full shadow-md fixed bottom-10 right-10 w-16 h-16 flex items-center justify-center cursor-pointer hover:bg-blue-950 transition transform-fill ring:b-amber-500 focus:bg-amber-900 duration-300 border-gray-300 dark:border-white border-2 text-black hover:text-white\">\r\n <Bot className=\"w-10 h-10\" />\r\n </div>\r\n </button>\r\n <div\r\n className={`transition-opacity duration-100 ease-linear ${\r\n isModalOpen ? \"opacity-100\" : \"opacity-0 pointer-events-none\"\r\n }`}\r\n >\r\n {isModalOpen && (\r\n <ChatModal\r\n onClose={closeModal}\r\n apiKey={apiKey}\r\n botName={botName}\r\n systemInstruction={systemInstruction}\r\n />\r\n )}\r\n </div>\r\n </>\r\n );\r\n};\r\n\r\nexport default ChatIcon;\r\n","import { useState } from \"react\";\r\nimport { Minimize2, Bot, Trash2 } from \"lucide-react\";\r\nimport ChatContainer from \"./ChatContainer\";\r\nimport { ChatModalProps } from \"../types\";\r\n\r\nconst ChatModal: React.FC<ChatModalProps> = ({\r\n onClose,\r\n apiKey,\r\n botName,\r\n systemInstruction,\r\n}) => {\r\n const [showClearModal, setShowClearModal] = useState(false);\r\n\r\n const clearChat = () => {\r\n if (typeof window !== \"undefined\") {\r\n localStorage.removeItem(\"chatMessages\");\r\n window.location.reload();\r\n }\r\n };\r\n\r\n return (\r\n <div className=\"fixed bottom-14 right-8 w-80 h-72 md:w-96 md:h-105 rounded-2xl shadow-lg bg-white font-mono border border-gray-200\">\r\n <header className=\"flex items-center justify-between px-6 py-4 bg-white border-b shadow border-gray-100 rounded-t-2xl\">\r\n <div className=\"flex items-center gap-3\">\r\n <span className=\"bg-blue-950 p-2 rounded-full shadow-sm\">\r\n <Bot className=\"w-5 h-5 text-white\" />\r\n </span>\r\n <div>\r\n <div className=\"text-gray-900 font-semibold text-md tracking-wide\">\r\n {botName}\r\n </div>\r\n <div className=\"text-gray-500 text-xs flex items-center\">\r\n <span>Online 24/7</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div>\r\n <button\r\n onClick={() => setShowClearModal(true)}\r\n aria-label=\"Settings\"\r\n className=\"text-gray-400 hover:text-gray-700 bg-transparent p-2 rounded-md transition-all duration-200 focus:outline-none focus:ring-2 focus:ring-blue-200 hover:bg-gray-100 mr-2 cursor-pointer\"\r\n >\r\n <Trash2 className=\"w-5 h-5\" />\r\n </button>\r\n <button\r\n onClick={onClose}\r\n aria-label=\"Minimize chat\"\r\n className=\"text-gray-400 hover:text-gray-700 bg-transparent p-2 rounded-md transition-all duration-200 focus:outline-none focus:ring-2 focus:ring-blue-200 hover:bg-gray-100 cursor-pointer\"\r\n >\r\n <Minimize2 className=\"w-5 h-5\" />\r\n </button>\r\n </div>\r\n </header>\r\n <main className=\"h-full\">\r\n <ChatContainer\r\n apiKey={apiKey}\r\n botName={botName}\r\n systemInstruction={systemInstruction}\r\n />\r\n </main>\r\n\r\n {showClearModal && (\r\n <div className=\"fixed inset-0 border shadow bg-opacity-50 flex items-center justify-center\">\r\n <div className=\"bg-white p-6 rounded-lg shadow-lg\">\r\n <h2 className=\"text-lg font-semibold mb-4 text-gray-800\">\r\n Clear Conversation\r\n </h2>\r\n <p className=\"text-sm text-gray-600 mb-6\">\r\n Are you sure you want to clear the conversation?\r\n </p>\r\n <div className=\"flex justify-end gap-4\">\r\n <button\r\n onClick={() => setShowClearModal(false)}\r\n className=\"px-4 py-2 bg-gray-200 text-gray-700 rounded-md hover:bg-gray-300\"\r\n >\r\n Cancel\r\n </button>\r\n <button\r\n onClick={clearChat}\r\n className=\"px-4 py-2 bg-red-600 text-white rounded-md hover:bg-red-700\"\r\n >\r\n Clear\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n )}\r\n </div>\r\n );\r\n};\r\n\r\nexport default ChatModal;\r\n","import { useState, useEffect } from \"react\";\r\nimport { GoogleGenerativeAI } from \"@google/generative-ai\";\r\nimport { ChatContainerProps, Message } from \"../types\";\r\n\r\nconst ChatContainer: React.FC<ChatContainerProps> = ({\r\n apiKey,\r\n botName,\r\n systemInstruction,\r\n}) => {\r\n const [message, setMessage] = useState(\"\");\r\n const [messages, setMessages] = useState<Message[]>(() => {\r\n if (typeof window !== \"undefined\") {\r\n const storedMessages = localStorage.getItem(\"chatMessages\");\r\n return storedMessages\r\n ? JSON.parse(storedMessages)\r\n : [\r\n {\r\n sender: \"ai\",\r\n text: `Hello! I'm ${botName}. How can I help you today?`,\r\n },\r\n ];\r\n }\r\n return [\r\n {\r\n sender: \"ai\",\r\n text: `Hello! I'm ${botName}. How can I help you today?`,\r\n },\r\n ];\r\n });\r\n\r\n useEffect(() => {\r\n if (typeof window !== \"undefined\") {\r\n localStorage.setItem(\"chatMessages\", JSON.stringify(messages));\r\n }\r\n }, [messages]);\r\n\r\n const handleSend = async (e: React.FormEvent) => {\r\n e.preventDefault();\r\n if (!message.trim()) return;\r\n\r\n if (!apiKey) {\r\n console.error(\"API key is missing. Please provide a valid API key.\");\r\n return;\r\n }\r\n\r\n setMessages((prev: Message[]) => [\r\n ...prev,\r\n { sender: \"user\", text: message },\r\n ]);\r\n const currentMessage = message;\r\n setMessage(\"\");\r\n\r\n try {\r\n const ai = new GoogleGenerativeAI(apiKey);\r\n const model = ai.getGenerativeModel({\r\n model: \"gemini-2.5-flash\",\r\n });\r\n\r\n const promptWithContext = `\r\n ${systemInstruction}\r\n \r\n Previous conversation history:\r\n ${messages\r\n .slice(1)\r\n .map((m: Message) => `${m.sender}: ${m.text}`)\r\n .join(\"\\n\")}\r\n \r\n User asking: ${currentMessage}\r\n `;\r\n\r\n const result = await model.generateContent(promptWithContext);\r\n const response = await result.response;\r\n const aiText = response.text();\r\n\r\n if (!aiText) {\r\n throw new Error(\"Empty response from AI\");\r\n }\r\n\r\n setMessages((prev: Message[]) => [\r\n ...prev,\r\n { sender: \"ai\", text: aiText },\r\n ]);\r\n } catch (err) {\r\n console.error(\"Chat Error:\", err);\r\n const fallbackResponse =\r\n \"I'm sorry, I'm having trouble connecting right now. Please try again later.\";\r\n setMessages((prev: Message[]) => [\r\n ...prev,\r\n { sender: \"ai\", text: fallbackResponse },\r\n ]);\r\n }\r\n };\r\n\r\n return (\r\n <section className=\"h-full flex flex-col relative max-w-100 mx-auto\">\r\n <div\r\n className=\"flex-1 px-4 py-3 space-y-3 bg-white overflow-y-auto\"\r\n style={{ maxHeight: \"320px\", scrollBehavior: \"smooth\" }}\r\n >\r\n {messages.map((msg: Message, idx: number) => (\r\n <div key={idx} className=\"flex w-full\">\r\n <div\r\n className={`px-3 py-2 rounded-xl shadow-sm border text-sm max-w-[80%] ${\r\n msg.sender === \"ai\"\r\n ? \"bg-gray-50 border-gray-100 text-gray-800\"\r\n : \"bg-blue-600 text-white border-blue-700 ml-auto\"\r\n }`}\r\n >\r\n {msg.text}\r\n </div>\r\n </div>\r\n ))}\r\n </div>\r\n <form\r\n onSubmit={handleSend}\r\n className=\"shrink-0 flex gap-2 border-t border-gray-100 px-4 py-3 bg-white rounded-b-2xl w-full\"\r\n >\r\n <input\r\n id=\"chat-input\"\r\n type=\"text\"\r\n placeholder=\"Type a message...\"\r\n className=\"flex-1 bg-gray-50 outline-none text-sm text-gray-800 placeholder:text-gray-400 px-2 py-1 rounded-lg border border-gray-200 focus:border-blue-300 transition\"\r\n onChange={(e) => setMessage(e.target.value)}\r\n value={message}\r\n />\r\n <button\r\n type=\"submit\"\r\n className=\"bg-blue-600 text-white px-4 py-1 rounded-lg text-sm shadow-sm font-medium hover:bg-blue-700 transition\"\r\n >\r\n Send\r\n </button>\r\n </form>\r\n </section>\r\n );\r\n};\r\n\r\nexport default ChatContainer;\r\n","\n export default function styleInject(css, { insertAt } = {}) {\n if (!css || typeof document === 'undefined') return\n \n const head = document.head || document.getElementsByTagName('head')[0]\n const style = document.createElement('style')\n style.type = 'text/css'\n \n if (insertAt === 'top') {\n if (head.firstChild) {\n head.insertBefore(style, head.firstChild)\n } else {\n head.appendChild(style)\n }\n } else {\n head.appendChild(style)\n }\n \n if (style.styleSheet) {\n style.styleSheet.cssText = css\n } else {\n style.appendChild(document.createTextNode(css))\n }\n }\n ","import styleInject from '#style-inject';styleInject(\"/*! tailwindcss v4.1.18 | MIT License | https://tailwindcss.com */@layer properties;@layer theme,base,components,utilities;@layer theme{:root,:host{--font-sans: ui-sans-serif, system-ui, sans-serif, \\\"Apple Color Emoji\\\", \\\"Segoe UI Emoji\\\", \\\"Segoe UI Symbol\\\", \\\"Noto Color Emoji\\\";--font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \\\"Liberation Mono\\\", \\\"Courier New\\\", monospace;--color-red-600: oklch(57.7% .245 27.325);--color-red-700: oklch(50.5% .213 27.518);--color-amber-50: oklch(98.7% .022 95.277);--color-amber-900: oklch(41.4% .112 45.904);--color-blue-200: oklch(88.2% .059 254.128);--color-blue-300: oklch(80.9% .105 251.813);--color-blue-600: oklch(54.6% .245 262.881);--color-blue-700: oklch(48.8% .243 264.376);--color-blue-950: oklch(28.2% .091 267.935);--color-gray-50: oklch(98.5% .002 247.839);--color-gray-100: oklch(96.7% .003 264.542);--color-gray-200: oklch(92.8% .006 264.531);--color-gray-300: oklch(87.2% .01 258.338);--color-gray-400: oklch(70.7% .022 261.325);--color-gray-500: oklch(55.1% .027 264.364);--color-gray-600: oklch(44.6% .03 256.802);--color-gray-700: oklch(37.3% .034 259.733);--color-gray-800: oklch(27.8% .033 256.848);--color-gray-900: oklch(21% .034 264.665);--color-black: #000;--color-white: #fff;--spacing: .25rem;--text-xs: .75rem;--text-xs--line-height: calc(1 / .75);--text-sm: .875rem;--text-sm--line-height: calc(1.25 / .875);--text-lg: 1.125rem;--text-lg--line-height: calc(1.75 / 1.125);--font-weight-medium: 500;--font-weight-semibold: 600;--tracking-wide: .025em;--radius-md: .375rem;--radius-lg: .5rem;--radius-xl: .75rem;--radius-2xl: 1rem;--default-transition-duration: .15s;--default-transition-timing-function: cubic-bezier(.4, 0, .2, 1);--default-font-family: var(--font-sans);--default-mono-font-family: var(--font-mono)}}@layer base{*,:after,:before,::backdrop,::file-selector-button{box-sizing:border-box;margin:0;padding:0;border:0 solid}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:var(--default-font-family, ui-sans-serif, system-ui, sans-serif, \\\"Apple Color Emoji\\\", \\\"Segoe UI Emoji\\\", \\\"Segoe UI Symbol\\\", \\\"Noto Color Emoji\\\");font-feature-settings:var(--default-font-feature-settings, normal);font-variation-settings:var(--default-font-variation-settings, normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \\\"Liberation Mono\\\", \\\"Courier New\\\", monospace);font-feature-settings:var(--default-mono-font-feature-settings, normal);font-variation-settings:var(--default-mono-font-variation-settings, normal);font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea,::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;border-radius:0;background-color:transparent;opacity:1}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::-moz-placeholder{opacity:1}::placeholder{opacity:1}@supports (not (-webkit-appearance: -apple-pay-button)) or (contain-intrinsic-size: 1px){::-moz-placeholder{color:currentcolor;@supports (color: color-mix(in lab,red,red)){color:color-mix(in oklab,currentcolor 50%,transparent)}}::placeholder{color:currentcolor;@supports (color: color-mix(in lab,red,red)){color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit,::-webkit-datetime-edit-year-field,::-webkit-datetime-edit-month-field,::-webkit-datetime-edit-day-field,::-webkit-datetime-edit-hour-field,::-webkit-datetime-edit-minute-field,::-webkit-datetime-edit-second-field,::-webkit-datetime-edit-millisecond-field,::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]),::file-selector-button{-webkit-appearance:button;-moz-appearance:button;appearance:button}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer utilities{.pointer-events-none{pointer-events:none}.fixed{position:fixed}.relative{position:relative}.inset-0{inset:calc(var(--spacing) * 0)}.right-8{right:calc(var(--spacing) * 8)}.right-10{right:calc(var(--spacing) * 10)}.bottom-10{bottom:calc(var(--spacing) * 10)}.bottom-14{bottom:calc(var(--spacing) * 14)}.mx-auto{margin-inline:auto}.mr-2{margin-right:calc(var(--spacing) * 2)}.mb-4{margin-bottom:calc(var(--spacing) * 4)}.mb-6{margin-bottom:calc(var(--spacing) * 6)}.ml-auto{margin-left:auto}.flex{display:flex}.h-5{height:calc(var(--spacing) * 5)}.h-10{height:calc(var(--spacing) * 10)}.h-16{height:calc(var(--spacing) * 16)}.h-72{height:calc(var(--spacing) * 72)}.h-full{height:100%}.w-5{width:calc(var(--spacing) * 5)}.w-10{width:calc(var(--spacing) * 10)}.w-16{width:calc(var(--spacing) * 16)}.w-80{width:calc(var(--spacing) * 80)}.w-full{width:100%}.max-w-100{max-width:calc(var(--spacing) * 100)}.max-w-\\\\[80\\\\%\\\\]{max-width:80%}.flex-1{flex:1}.shrink-0{flex-shrink:0}.cursor-pointer{cursor:pointer}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.justify-end{justify-content:flex-end}.gap-2{gap:calc(var(--spacing) * 2)}.gap-3{gap:calc(var(--spacing) * 3)}.gap-4{gap:calc(var(--spacing) * 4)}.space-y-3{:where(&>:not(:last-child)){--tw-space-y-reverse: 0;margin-block-start:calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)))}}.overflow-y-auto{overflow-y:auto}.rounded-2xl{border-radius:var(--radius-2xl)}.rounded-full{border-radius:calc(infinity * 1px)}.rounded-lg{border-radius:var(--radius-lg)}.rounded-md{border-radius:var(--radius-md)}.rounded-xl{border-radius:var(--radius-xl)}.rounded-t-2xl{border-top-left-radius:var(--radius-2xl);border-top-right-radius:var(--radius-2xl)}.rounded-b-2xl{border-bottom-right-radius:var(--radius-2xl);border-bottom-left-radius:var(--radius-2xl)}.border{border-style:var(--tw-border-style);border-width:1px}.border-2{border-style:var(--tw-border-style);border-width:2px}.border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-blue-700{border-color:var(--color-blue-700)}.border-gray-100{border-color:var(--color-gray-100)}.border-gray-200{border-color:var(--color-gray-200)}.border-gray-300{border-color:var(--color-gray-300)}.bg-amber-50{background-color:var(--color-amber-50)}.bg-blue-600{background-color:var(--color-blue-600)}.bg-blue-950{background-color:var(--color-blue-950)}.bg-gray-50{background-color:var(--color-gray-50)}.bg-gray-200{background-color:var(--color-gray-200)}.bg-red-600{background-color:var(--color-red-600)}.bg-transparent{background-color:transparent}.bg-white{background-color:var(--color-white)}.p-2{padding:calc(var(--spacing) * 2)}.p-4{padding:calc(var(--spacing) * 4)}.p-6{padding:calc(var(--spacing) * 6)}.px-2{padding-inline:calc(var(--spacing) * 2)}.px-3{padding-inline:calc(var(--spacing) * 3)}.px-4{padding-inline:calc(var(--spacing) * 4)}.px-6{padding-inline:calc(var(--spacing) * 6)}.py-1{padding-block:calc(var(--spacing) * 1)}.py-2{padding-block:calc(var(--spacing) * 2)}.py-3{padding-block:calc(var(--spacing) * 3)}.py-4{padding-block:calc(var(--spacing) * 4)}.font-mono{font-family:var(--font-mono)}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading, var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading, var(--text-sm--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading, var(--text-xs--line-height))}.font-medium{--tw-font-weight: var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-semibold{--tw-font-weight: var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.tracking-wide{--tw-tracking: var(--tracking-wide);letter-spacing:var(--tracking-wide)}.text-black{color:var(--color-black)}.text-gray-400{color:var(--color-gray-400)}.text-gray-500{color:var(--color-gray-500)}.text-gray-600{color:var(--color-gray-600)}.text-gray-700{color:var(--color-gray-700)}.text-gray-800{color:var(--color-gray-800)}.text-gray-900{color:var(--color-gray-900)}.text-white{color:var(--color-white)}.opacity-0{opacity:0%}.opacity-100{opacity:100%}.shadow{--tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-lg{--tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-md{--tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-sm{--tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function));transition-duration:var(--tw-duration, var(--default-transition-duration))}.transition-all{transition-property:all;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function));transition-duration:var(--tw-duration, var(--default-transition-duration))}.transition-opacity{transition-property:opacity;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function));transition-duration:var(--tw-duration, var(--default-transition-duration))}.duration-100{--tw-duration: .1s;transition-duration:.1s}.duration-200{--tw-duration: .2s;transition-duration:.2s}.duration-300{--tw-duration: .3s;transition-duration:.3s}.ease-linear{--tw-ease: linear;transition-timing-function:linear}.outline-none{--tw-outline-style: none;outline-style:none}.transform-fill{transform-box:fill-box}.placeholder\\\\:text-gray-400{&::-moz-placeholder{color:var(--color-gray-400)}&::placeholder{color:var(--color-gray-400)}}.hover\\\\:bg-blue-700{&:hover{@media(hover:hover){background-color:var(--color-blue-700)}}}.hover\\\\:bg-blue-950{&:hover{@media(hover:hover){background-color:var(--color-blue-950)}}}.hover\\\\:bg-gray-100{&:hover{@media(hover:hover){background-color:var(--color-gray-100)}}}.hover\\\\:bg-gray-300{&:hover{@media(hover:hover){background-color:var(--color-gray-300)}}}.hover\\\\:bg-red-700{&:hover{@media(hover:hover){background-color:var(--color-red-700)}}}.hover\\\\:text-gray-700{&:hover{@media(hover:hover){color:var(--color-gray-700)}}}.hover\\\\:text-white{&:hover{@media(hover:hover){color:var(--color-white)}}}.focus\\\\:border-blue-300{&:focus{border-color:var(--color-blue-300)}}.focus\\\\:bg-amber-900{&:focus{background-color:var(--color-amber-900)}}.focus\\\\:ring-2{&:focus{--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}}.focus\\\\:ring-blue-200{&:focus{--tw-ring-color: var(--color-blue-200)}}.focus\\\\:outline-none{&:focus{--tw-outline-style: none;outline-style:none}}.md\\\\:h-105{@media(width>=48rem){height:calc(var(--spacing) * 105)}}.md\\\\:w-96{@media(width>=48rem){width:calc(var(--spacing) * 96)}}.dark\\\\:border-white{@media(prefers-color-scheme:dark){border-color:var(--color-white)}}}*{margin:0;padding:0;box-sizing:border-box}.chatbot-container{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif}.chatbot-icon-button{position:fixed;bottom:40px;right:40px;width:64px;height:64px;border-radius:50%;background-color:#fffbeb;border:2px solid #d1d5db;box-shadow:0 4px 6px #0000001a;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s ease;z-index:9999}.chatbot-icon-button:hover{background-color:#1e3a8a;color:#fff}.chatbot-icon-button svg{width:40px;height:40px}.chatbot-modal{position:fixed;bottom:72px;right:32px;width:320px;height:288px;border-radius:16px;box-shadow:0 10px 15px #0000001a;background-color:#fff;font-family:monospace;border:1px solid #e5e7eb;transition:opacity .1s linear;z-index:9998}@media(min-width:768px){.chatbot-modal{width:384px;height:420px}}.chatbot-modal-header{display:flex;align-items:center;justify-content:space-between;padding:16px 24px;background-color:#fff;border-bottom:1px solid #f3f4f6;box-shadow:0 1px 2px #0000000d;border-top-left-radius:16px;border-top-right-radius:16px}.chatbot-modal-header-left{display:flex;align-items:center;gap:12px}.chatbot-modal-bot-icon{background-color:#172554;padding:8px;border-radius:50%;box-shadow:0 1px 2px #0000000d}.chatbot-modal-bot-icon svg{width:20px;height:20px;color:#fff}.chatbot-modal-title{color:#111827;font-weight:600;font-size:16px;letter-spacing:.025em}.chatbot-modal-status{color:#6b7280;font-size:12px;display:flex;align-items:center}.chatbot-modal-header-right{display:flex}.chatbot-modal-header-button{color:#9ca3af;background:transparent;padding:8px;border-radius:6px;transition:all .2s;border:none;cursor:pointer;margin-left:8px}.chatbot-modal-header-button:hover{color:#374151;background-color:#f3f4f6}.chatbot-modal-header-button:focus{outline:none;box-shadow:0 0 0 2px #dbeafe}.chatbot-modal-header-button svg{width:20px;height:20px}.chatbot-modal-main{height:100%}.chatbot-container-section{height:100%;display:flex;flex-direction:column;position:relative;max-width:400px;margin:0 auto}.chatbot-messages{flex:1;padding:12px 16px;display:flex;flex-direction:column;gap:12px;background-color:#fff;overflow-y:auto;max-height:320px;scroll-behavior:smooth}.chatbot-message-wrapper{display:flex;width:100%}.chatbot-message{padding:12px;border-radius:12px;box-shadow:0 1px 2px #0000000d;border:1px solid;font-size:14px;max-width:80%;word-wrap:break-word}.chatbot-message.ai{background-color:#f9fafb;border-color:#f3f4f6;color:#1f2937}.chatbot-message.user{background-color:#2563eb;color:#fff;border-color:#1d4ed8;margin-left:auto}.chatbot-form{flex-shrink:0;display:flex;gap:8px;border-top:1px solid #f3f4f6;padding:12px 16px;background-color:#fff;border-bottom-left-radius:16px;border-bottom-right-radius:16px;width:100%}.chatbot-input{flex:1;background-color:#f9fafb;outline:none;font-size:14px;color:#1f2937;padding:8px;border-radius:8px;border:1px solid #e5e7eb;transition:border-color .2s}.chatbot-input::-moz-placeholder{color:#9ca3af}.chatbot-input::placeholder{color:#9ca3af}.chatbot-input:focus{border-color:#93c5fd}.chatbot-send-button{background-color:#2563eb;color:#fff;padding:8px 16px;border-radius:8px;font-size:14px;box-shadow:0 1px 2px #0000000d;font-weight:500;border:none;cursor:pointer;transition:background-color .2s}.chatbot-send-button:hover{background-color:#1d4ed8}.chatbot-clear-modal-overlay{position:fixed;inset:0;background-color:#00000080;display:flex;align-items:center;justify-content:center;z-index:10000}.chatbot-clear-modal{background-color:#fff;padding:24px;border-radius:8px;box-shadow:0 10px 15px #0000001a}.chatbot-clear-modal-title{font-size:18px;font-weight:600;margin-bottom:16px;color:#1f2937}.chatbot-clear-modal-text{font-size:14px;color:#6b7280;margin-bottom:24px}.chatbot-clear-modal-buttons{display:flex;justify-content:flex-end;gap:16px}.chatbot-clear-modal-button{padding:8px 16px;border-radius:6px;cursor:pointer;border:none;transition:background-color .2s}.chatbot-clear-modal-button.cancel{background-color:#e5e7eb;color:#374151}.chatbot-clear-modal-button.cancel:hover{background-color:#d1d5db}.chatbot-clear-modal-button.clear{background-color:#dc2626;color:#fff}.chatbot-clear-modal-button.clear:hover{background-color:#b91c1c}.chatbot-modal-fade{opacity:0;pointer-events:none}.chatbot-modal-show{opacity:1}@property --tw-space-y-reverse{syntax: \\\"*\\\"; inherits: false; initial-value: 0;}@property --tw-border-style{syntax: \\\"*\\\"; inherits: false; initial-value: solid;}@property --tw-font-weight{syntax: \\\"*\\\"; inherits: false;}@property --tw-tracking{syntax: \\\"*\\\"; inherits: false;}@property --tw-shadow{syntax: \\\"*\\\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \\\"*\\\"; inherits: false;}@property --tw-shadow-alpha{syntax: \\\"<percentage>\\\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \\\"*\\\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \\\"*\\\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \\\"<percentage>\\\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \\\"*\\\"; inherits: false;}@property --tw-ring-shadow{syntax: \\\"*\\\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \\\"*\\\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \\\"*\\\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \\\"*\\\"; inherits: false;}@property --tw-ring-offset-width{syntax: \\\"<length>\\\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \\\"*\\\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \\\"*\\\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-duration{syntax: \\\"*\\\"; inherits: false;}@property --tw-ease{syntax: \\\"*\\\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-space-y-reverse: 0;--tw-border-style: solid;--tw-font-weight: initial;--tw-tracking: initial;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000;--tw-duration: initial;--tw-ease: initial}}}\\n\")","import React from \"react\";\r\nimport ChatIcon from \"./components/ChatIcon\";\r\nimport { ChatBotProps } from \"./types\";\r\nimport \"./styles/chatbot.css\";\r\n\r\n/**\r\n * ChatBot Component - A reusable AI chatbot powered by Google Gemini\r\n *\r\n * @param {ChatBotProps} props - Configuration props for the chatbot\r\n * @param {string} [props.apiKey] - Google Gemini API key (falls back to NEXT_PUBLIC_GEMINI_API_KEY)\r\n * @param {string} [props.botName] - Name of the bot (falls back to NEXT_PUBLIC_AI_BOT_NAME or \"AI Assistant\")\r\n * @param {string} [props.systemInstruction] - System instruction for the bot (falls back to NEXT_PUBLIC_SYSTEM_INSTRUCTION)\r\n *\r\n * @example\r\n * // Using environment variables\r\n * <ChatBot />\r\n */\r\nconst ChatBot: React.FC<ChatBotProps> = ({\r\n apiKey,\r\n botName,\r\n systemInstruction,\r\n}) => {\r\n // Fallback to environment variables if props are not provided\r\n const resolvedApiKey =\r\n apiKey ||\r\n (typeof process !== \"undefined\" && process.env?.NEXT_PUBLIC_GEMINI_API_KEY\r\n ? process.env.NEXT_PUBLIC_GEMINI_API_KEY\r\n : \"\");\r\n\r\n const resolvedBotName =\r\n botName ||\r\n (typeof process !== \"undefined\" && process.env?.NEXT_PUBLIC_AI_BOT_NAME\r\n ? process.env.NEXT_PUBLIC_AI_BOT_NAME\r\n : \"AI Assistant\");\r\n\r\n const resolvedSystemInstruction =\r\n systemInstruction ||\r\n (typeof process !== \"undefined\" &&\r\n process.env?.NEXT_PUBLIC_SYSTEM_INSTRUCTION\r\n ? process.env.NEXT_PUBLIC_SYSTEM_INSTRUCTION\r\n : \"You are a helpful AI assistant.\");\r\n\r\n // Warn if API key is missing\r\n if (!resolvedApiKey) {\r\n console.warn(\r\n \"ChatBot: API key is missing. Please provide it via environment variable NEXT_PUBLIC_GEMINI_API_KEY\"\r\n );\r\n }\r\n\r\n return (\r\n <div className=\"chatbot-container\">\r\n <ChatIcon\r\n apiKey={resolvedApiKey} // The API key used to authenticate with Google Gemini\r\n botName={resolvedBotName} // The name of the bot displayed to users\r\n systemInstruction={resolvedSystemInstruction} // The context or behavior instruction for the bot\r\n />\r\n </div>\r\n );\r\n};\r\n\r\nexport default ChatBot;\r\nexport type { ChatBotProps, Message } from \"./types\";\r\n"],"mappings":"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","names":["useState","Bot","useState","Minimize2","Bot","Trash2","useState","useEffect","GoogleGenerativeAI","jsx","jsxs","ChatContainer","apiKey","botName","systemInstruction","message","setMessage","messages","setMessages","storedMessages","handleSend","e","prev","currentMessage","model","promptWithContext","m","aiText","err","fallbackResponse","msg","idx","ChatContainer_default","jsx","jsxs","ChatModal","onClose","apiKey","botName","systemInstruction","showClearModal","setShowClearModal","useState","Bot","Trash2","Minimize2","ChatContainer_default","ChatModal_default","Fragment","jsx","jsxs","ChatIcon","apiKey","botName","systemInstruction","isModalOpen","setIsModalOpen","useState","Bot","ChatModal_default","ChatIcon_default","styleInject","css","insertAt","head","style","styleInject","jsx","ChatBot","apiKey","botName","systemInstruction","resolvedApiKey","resolvedBotName","resolvedSystemInstruction","ChatIcon_default","index_default"]}
1
+ {"version":3,"sources":["../src/components/ChatIcon.tsx","../src/components/ChatModal.tsx","../src/components/ChatContainer.tsx","#style-inject:#style-inject","../src/styles/chatbot.css","../src/index.tsx"],"sourcesContent":["import { useState } from \"react\";\r\nimport { Bot } from \"lucide-react\";\r\nimport ChatModal from \"./ChatModal\";\r\nimport { ChatIconProps } from \"../types\";\r\n\r\nconst ChatIcon: React.FC<ChatIconProps> = ({\r\n apiKey,\r\n botName,\r\n systemInstruction,\r\n}) => {\r\n const [isModalOpen, setIsModalOpen] = useState(false);\r\n\r\n const openModal = () => {\r\n setIsModalOpen(true);\r\n };\r\n\r\n const closeModal = () => {\r\n setIsModalOpen(false);\r\n };\r\n\r\n return (\r\n <div className=\"chatbot-container\">\r\n <button onClick={openModal} className=\"chatbot-icon-button\">\r\n <Bot />\r\n </button>\r\n <div\r\n className={`chatbot-modal ${\r\n isModalOpen ? \"chatbot-modal-show\" : \"chatbot-modal-fade\"\r\n }`}\r\n >\r\n {isModalOpen && (\r\n <ChatModal\r\n onClose={closeModal}\r\n apiKey={apiKey}\r\n botName={botName}\r\n systemInstruction={systemInstruction}\r\n />\r\n )}\r\n </div>\r\n </div>\r\n );\r\n};\r\n\r\nexport default ChatIcon;\r\n","import { useState } from \"react\";\r\nimport { Minimize2, Bot, Trash2 } from \"lucide-react\";\r\nimport ChatContainer from \"./ChatContainer\";\r\nimport { ChatModalProps } from \"../types\";\r\n\r\nconst ChatModal: React.FC<ChatModalProps> = ({\r\n onClose,\r\n apiKey,\r\n botName,\r\n systemInstruction,\r\n}) => {\r\n const [showClearModal, setShowClearModal] = useState(false);\r\n\r\n const clearChat = () => {\r\n if (typeof window !== \"undefined\") {\r\n localStorage.removeItem(\"chatMessages\");\r\n window.location.reload();\r\n }\r\n };\r\n\r\n return (\r\n <>\r\n <header className=\"chatbot-modal-header\">\r\n <div className=\"chatbot-modal-header-left\">\r\n <span className=\"chatbot-modal-bot-icon\">\r\n <Bot />\r\n </span>\r\n <div>\r\n <div className=\"chatbot-modal-title\">{botName}</div>\r\n <div className=\"chatbot-modal-status\">\r\n <span>Online 24/7</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div className=\"chatbot-modal-header-right\">\r\n <button\r\n onClick={() => setShowClearModal(true)}\r\n aria-label=\"Settings\"\r\n className=\"chatbot-modal-header-button\"\r\n >\r\n <Trash2 />\r\n </button>\r\n <button\r\n onClick={onClose}\r\n aria-label=\"Minimize chat\"\r\n className=\"chatbot-modal-header-button\"\r\n >\r\n <Minimize2 />\r\n </button>\r\n </div>\r\n </header>\r\n <main className=\"chatbot-modal-main\">\r\n <ChatContainer\r\n apiKey={apiKey}\r\n botName={botName}\r\n systemInstruction={systemInstruction}\r\n />\r\n </main>\r\n\r\n {showClearModal && (\r\n <div className=\"chatbot-clear-modal-overlay\">\r\n <div className=\"chatbot-clear-modal\">\r\n <h2 className=\"chatbot-clear-modal-title\">Clear Conversation</h2>\r\n <p className=\"chatbot-clear-modal-text\">\r\n Are you sure you want to clear the conversation?\r\n </p>\r\n <div className=\"chatbot-clear-modal-buttons\">\r\n <button\r\n onClick={() => setShowClearModal(false)}\r\n className=\"chatbot-clear-modal-button cancel\"\r\n >\r\n Cancel\r\n </button>\r\n <button\r\n onClick={clearChat}\r\n className=\"chatbot-clear-modal-button clear\"\r\n >\r\n Clear\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n )}\r\n </>\r\n );\r\n};\r\n\r\nexport default ChatModal;\r\n","import { useState, useEffect } from \"react\";\r\nimport { GoogleGenerativeAI } from \"@google/generative-ai\";\r\nimport { ChatContainerProps, Message } from \"../types\";\r\n\r\nconst ChatContainer: React.FC<ChatContainerProps> = ({\r\n apiKey,\r\n botName,\r\n systemInstruction,\r\n}) => {\r\n const [message, setMessage] = useState(\"\");\r\n const [messages, setMessages] = useState<Message[]>(() => {\r\n if (typeof window !== \"undefined\") {\r\n const storedMessages = localStorage.getItem(\"chatMessages\");\r\n return storedMessages\r\n ? JSON.parse(storedMessages)\r\n : [\r\n {\r\n sender: \"ai\",\r\n text: `Hello! I'm ${botName}. How can I help you today?`,\r\n },\r\n ];\r\n }\r\n return [\r\n {\r\n sender: \"ai\",\r\n text: `Hello! I'm ${botName}. How can I help you today?`,\r\n },\r\n ];\r\n });\r\n\r\n useEffect(() => {\r\n if (typeof window !== \"undefined\") {\r\n localStorage.setItem(\"chatMessages\", JSON.stringify(messages));\r\n }\r\n }, [messages]);\r\n\r\n const handleSend = async (e: React.FormEvent) => {\r\n e.preventDefault();\r\n if (!message.trim()) return;\r\n\r\n if (!apiKey) {\r\n console.error(\"API key is missing. Please provide a valid API key.\");\r\n return;\r\n }\r\n\r\n setMessages((prev: Message[]) => [\r\n ...prev,\r\n { sender: \"user\", text: message },\r\n ]);\r\n const currentMessage = message;\r\n setMessage(\"\");\r\n\r\n try {\r\n const ai = new GoogleGenerativeAI(apiKey);\r\n const model = ai.getGenerativeModel({\r\n model: \"gemini-2.5-flash\",\r\n });\r\n\r\n const promptWithContext = `\r\n ${systemInstruction}\r\n \r\n Previous conversation history:\r\n ${messages\r\n .slice(1)\r\n .map((m: Message) => `${m.sender}: ${m.text}`)\r\n .join(\"\\n\")}\r\n \r\n User asking: ${currentMessage}\r\n `;\r\n\r\n const result = await model.generateContent(promptWithContext);\r\n const response = await result.response;\r\n const aiText = response.text();\r\n\r\n if (!aiText) {\r\n throw new Error(\"Empty response from AI\");\r\n }\r\n\r\n setMessages((prev: Message[]) => [\r\n ...prev,\r\n { sender: \"ai\", text: aiText },\r\n ]);\r\n } catch (err) {\r\n console.error(\"Chat Error:\", err);\r\n const fallbackResponse =\r\n \"I'm sorry, I'm having trouble connecting right now. Please try again later.\";\r\n setMessages((prev: Message[]) => [\r\n ...prev,\r\n { sender: \"ai\", text: fallbackResponse },\r\n ]);\r\n }\r\n };\r\n\r\n return (\r\n <section className=\"chatbot-container-section\">\r\n <div className=\"chatbot-messages\">\r\n {messages.map((msg: Message, idx: number) => (\r\n <div key={idx} className=\"chatbot-message-wrapper\">\r\n <div\r\n className={`chatbot-message ${\r\n msg.sender === \"ai\" ? \"ai\" : \"user\"\r\n }`}\r\n >\r\n {msg.text}\r\n </div>\r\n </div>\r\n ))}\r\n </div>\r\n <form onSubmit={handleSend} className=\"chatbot-form\">\r\n <input\r\n id=\"chat-input\"\r\n type=\"text\"\r\n placeholder=\"Type a message...\"\r\n className=\"chatbot-input\"\r\n onChange={(e) => setMessage(e.target.value)}\r\n value={message}\r\n />\r\n <button type=\"submit\" className=\"chatbot-send-button\">\r\n Send\r\n </button>\r\n </form>\r\n </section>\r\n );\r\n};\r\n\r\nexport default ChatContainer;\r\n","\n export default function styleInject(css, { insertAt } = {}) {\n if (!css || typeof document === 'undefined') return\n \n const head = document.head || document.getElementsByTagName('head')[0]\n const style = document.createElement('style')\n style.type = 'text/css'\n \n if (insertAt === 'top') {\n if (head.firstChild) {\n head.insertBefore(style, head.firstChild)\n } else {\n head.appendChild(style)\n }\n } else {\n head.appendChild(style)\n }\n \n if (style.styleSheet) {\n style.styleSheet.cssText = css\n } else {\n style.appendChild(document.createTextNode(css))\n }\n }\n ","import styleInject from '#style-inject';styleInject(\"*{margin:0;padding:0;box-sizing:border-box}.chatbot-container{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif}.chatbot-icon-button{position:fixed;bottom:40px;right:40px;width:64px;height:64px;border-radius:50%;background-color:#fffbeb;border:2px solid #d1d5db;box-shadow:0 4px 6px #0000001a;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s ease;z-index:998}.chatbot-icon-button:hover{background-color:#1e3a8a;color:#fff}.chatbot-icon-button svg{width:40px;height:40px}.chatbot-modal{position:fixed;bottom:72px;right:32px;width:320px;height:288px;border-radius:16px;box-shadow:0 10px 15px #0000001a;background-color:#fff;font-family:monospace;border:1px solid #e5e7eb;transition:opacity .1s linear;z-index:999}@media(min-width:768px){.chatbot-modal{width:384px;height:420px}}.chatbot-modal-header{display:flex;align-items:center;justify-content:space-between;padding:16px 24px;background-color:#fff;border-bottom:1px solid #f3f4f6;box-shadow:0 1px 2px #0000000d;border-top-left-radius:16px;border-top-right-radius:16px}.chatbot-modal-header-left{display:flex;align-items:center;gap:12px}.chatbot-modal-bot-icon{background-color:#172554;padding:8px;border-radius:50%;box-shadow:0 1px 2px #0000000d}.chatbot-modal-bot-icon svg{width:20px;height:20px;color:#fff}.chatbot-modal-title{color:#111827;font-weight:600;font-size:16px;letter-spacing:.025em}.chatbot-modal-status{color:#6b7280;font-size:12px;display:flex;align-items:center}.chatbot-modal-header-right{display:flex}.chatbot-modal-header-button{color:#9ca3af;background:transparent;padding:8px;border-radius:6px;transition:all .2s;border:none;cursor:pointer;margin-left:8px}.chatbot-modal-header-button:hover{color:#374151;background-color:#f3f4f6}.chatbot-modal-header-button:focus{outline:none;box-shadow:0 0 0 2px #dbeafe}.chatbot-modal-header-button svg{width:20px;height:20px}.chatbot-modal-main{height:100%}.chatbot-container-section{height:100%;display:flex;flex-direction:column;position:relative;max-width:400px;margin:0 auto}.chatbot-messages{flex:1;padding:12px 16px;display:flex;flex-direction:column;gap:12px;background-color:#fff;overflow-y:auto;max-height:320px;scroll-behavior:smooth}.chatbot-message-wrapper{display:flex;width:100%}.chatbot-message{padding:12px;border-radius:12px;box-shadow:0 1px 2px #0000000d;border:1px solid;font-size:14px;max-width:80%;word-wrap:break-word}.chatbot-message.ai{background-color:#f9fafb;border-color:#f3f4f6;color:#1f2937}.chatbot-message.user{background-color:#2563eb;color:#fff;border-color:#1d4ed8;margin-left:auto}.chatbot-form{flex-shrink:0;display:flex;gap:8px;border-top:1px solid #f3f4f6;padding:12px 16px;background-color:#fff;border-bottom-left-radius:16px;border-bottom-right-radius:16px;width:100%}.chatbot-input{flex:1;background-color:#f9fafb;outline:none;font-size:14px;color:#1f2937;padding:8px;border-radius:8px;border:1px solid #e5e7eb;transition:border-color .2s}.chatbot-input::placeholder{color:#9ca3af}.chatbot-input:focus{border-color:#93c5fd}.chatbot-send-button{background-color:#2563eb;color:#fff;padding:8px 16px;border-radius:8px;font-size:14px;box-shadow:0 1px 2px #0000000d;font-weight:500;border:none;cursor:pointer;transition:background-color .2s}.chatbot-send-button:hover{background-color:#1d4ed8}.chatbot-clear-modal-overlay{position:fixed;inset:0;background-color:#00000080;display:flex;align-items:center;justify-content:center;z-index:10000}.chatbot-clear-modal{background-color:#fff;padding:24px;border-radius:8px;box-shadow:0 10px 15px #0000001a}.chatbot-clear-modal-title{font-size:18px;font-weight:600;margin-bottom:16px;color:#1f2937}.chatbot-clear-modal-text{font-size:14px;color:#6b7280;margin-bottom:24px}.chatbot-clear-modal-buttons{display:flex;justify-content:flex-end;gap:16px}.chatbot-clear-modal-button{padding:8px 16px;border-radius:6px;cursor:pointer;border:none;transition:background-color .2s}.chatbot-clear-modal-button.cancel{background-color:#e5e7eb;color:#374151}.chatbot-clear-modal-button.cancel:hover{background-color:#d1d5db}.chatbot-clear-modal-button.clear{background-color:#dc2626;color:#fff}.chatbot-clear-modal-button.clear:hover{background-color:#b91c1c}.chatbot-modal-fade{opacity:0;pointer-events:none}.chatbot-modal-show{opacity:1}\\n\")","import React from \"react\";\r\nimport ChatIcon from \"./components/ChatIcon\";\r\nimport { ChatBotProps } from \"./types\";\r\nimport \"./styles/chatbot.css\";\r\n\r\n/**\r\n * ChatBot Component - A reusable AI chatbot powered by Google Gemini\r\n *\r\n * @param {ChatBotProps} props - Configuration props for the chatbot\r\n * @param {string} [props.apiKey] - Google Gemini API key (falls back to NEXT_PUBLIC_GEMINI_API_KEY)\r\n * @param {string} [props.botName] - Name of the bot (falls back to NEXT_PUBLIC_AI_BOT_NAME or \"AI Assistant\")\r\n * @param {string} [props.systemInstruction] - System instruction for the bot (falls back to NEXT_PUBLIC_SYSTEM_INSTRUCTION)\r\n *\r\n * @example\r\n * // Using environment variables\r\n * <ChatBot />\r\n */\r\nconst ChatBot: React.FC<ChatBotProps> = ({\r\n apiKey,\r\n botName,\r\n systemInstruction,\r\n}) => {\r\n // Fallback to environment variables if props are not provided\r\n const resolvedApiKey =\r\n apiKey ||\r\n (typeof process !== \"undefined\" && process.env?.NEXT_PUBLIC_GEMINI_API_KEY\r\n ? process.env.NEXT_PUBLIC_GEMINI_API_KEY\r\n : \"\");\r\n\r\n const resolvedBotName =\r\n botName ||\r\n (typeof process !== \"undefined\" && process.env?.NEXT_PUBLIC_AI_BOT_NAME\r\n ? process.env.NEXT_PUBLIC_AI_BOT_NAME\r\n : \"AI Assistant\");\r\n\r\n const resolvedSystemInstruction =\r\n systemInstruction ||\r\n (typeof process !== \"undefined\" &&\r\n process.env?.NEXT_PUBLIC_SYSTEM_INSTRUCTION\r\n ? process.env.NEXT_PUBLIC_SYSTEM_INSTRUCTION\r\n : \"You are a helpful AI assistant.\");\r\n\r\n // Warn if API key is missing\r\n if (!resolvedApiKey) {\r\n console.warn(\r\n \"ChatBot: API key is missing. Please provide it via environment variable NEXT_PUBLIC_GEMINI_API_KEY\"\r\n );\r\n }\r\n\r\n return (\r\n <div className=\"chatbot-container\">\r\n <ChatIcon\r\n apiKey={resolvedApiKey} // The API key used to authenticate with Google Gemini\r\n botName={resolvedBotName} // The name of the bot displayed to users\r\n systemInstruction={resolvedSystemInstruction} // The context or behavior instruction for the bot\r\n />\r\n </div>\r\n );\r\n};\r\n\r\nexport default ChatBot;\r\nexport type { ChatBotProps, Message } from \"./types\";\r\n"],"mappings":"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","names":["useState","Bot","useState","Minimize2","Bot","Trash2","useState","useEffect","GoogleGenerativeAI","jsx","jsxs","ChatContainer","apiKey","botName","systemInstruction","message","setMessage","messages","setMessages","storedMessages","handleSend","e","prev","currentMessage","model","promptWithContext","m","aiText","err","fallbackResponse","msg","idx","ChatContainer_default","Fragment","jsx","jsxs","ChatModal","onClose","apiKey","botName","systemInstruction","showClearModal","setShowClearModal","useState","Bot","Trash2","Minimize2","ChatContainer_default","ChatModal_default","jsx","jsxs","ChatIcon","apiKey","botName","systemInstruction","isModalOpen","setIsModalOpen","useState","Bot","ChatModal_default","ChatIcon_default","styleInject","css","insertAt","head","style","styleInject","jsx","ChatBot","apiKey","botName","systemInstruction","resolvedApiKey","resolvedBotName","resolvedSystemInstruction","ChatIcon_default","index_default"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "chatx-ai",
3
- "version": "1.0.4",
3
+ "version": "1.0.5",
4
4
  "description": "A flexible and reusable SDK for building AI-powered chatbots in React applications, leveraging the Google Gemini API for advanced conversational capabilities.",
5
5
  "main": "./dist/index.js",
6
6
  "module": "./dist/index.mjs",
@@ -37,10 +37,7 @@
37
37
  },
38
38
  "dependencies": {
39
39
  "@google/generative-ai": "^0.24.1",
40
- "autoprefixer": "^10.4.23",
41
- "lucide-react": "^0.562.0",
42
- "postcss": "^8.5.6",
43
- "tailwindcss": "^4.1.18"
40
+ "lucide-react": "^0.562.0"
44
41
  },
45
42
  "devDependencies": {
46
43
  "@types/react": "^19.0.0",