@developer.notchatbot/webchat 1.2.10 → 1.2.11
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +14 -33
- package/dist/webchat-bundle.min.js +7 -7
- package/dist/webchat-bundle.min.umd.cjs +1 -1
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -1,23 +1,4 @@
|
|
|
1
|
-
# 🔷 WebChat
|
|
2
|
-
|
|
3
|
-
A beautiful, embeddable chatbot widget built with **React**, **TypeScript**, **Vite**, **pnpm**, and **Tailwind CSS** that can be easily integrated into any website with **just one file**.
|
|
4
|
-
|
|
5
|
-
## ✨ Features
|
|
6
|
-
|
|
7
|
-
- **📦 Single File Bundle**: Everything in one file - no separate CSS needed!
|
|
8
|
-
- **🔷 TypeScript**: Full type safety with strict typing and excellent IntelliSense
|
|
9
|
-
- **⚛️ React 18**: Component-based architecture for maintainability
|
|
10
|
-
- **🎨 Tailwind CSS**: Utility-first styling with prefixed classes (`ncb-`)
|
|
11
|
-
- **⚡ Vite**: Lightning-fast development and optimized builds
|
|
12
|
-
- **📦 pnpm**: Efficient package management and faster installs
|
|
13
|
-
- **🔧 Easy Integration**: Add to any website with just one script tag
|
|
14
|
-
- **🎨 Modern Design**: Beautiful, responsive UI that works on all devices
|
|
15
|
-
- **🛠️ Customizable**: Configure colors, text, and behavior to match your brand
|
|
16
|
-
- **✨ Smooth Animations**: Typing indicators and smooth transitions
|
|
17
|
-
- **📱 Mobile Responsive**: Optimized for mobile and desktop
|
|
18
|
-
- **🔌 API Ready**: Built-in support for chat API integration
|
|
19
|
-
- **🚫 Zero Conflicts**: Prefixed CSS classes prevent style conflicts
|
|
20
|
-
- **🛡️ Type Safe**: Catch errors at compile time with TypeScript
|
|
1
|
+
# 🔷 WebChat - Embedded Chat
|
|
21
2
|
|
|
22
3
|
## 📦 Quick Start
|
|
23
4
|
|
|
@@ -343,21 +324,21 @@ We emit **custom browser events** so you can capture interactions and feed them
|
|
|
343
324
|
|
|
344
325
|
| Widget | Event name | Fired when | `detail` payload |
|
|
345
326
|
|--------|------------|------------|------------------|
|
|
346
|
-
| WebChat | `
|
|
347
|
-
| WebChat | `
|
|
348
|
-
| WebChat | `
|
|
349
|
-
| WebChat | `
|
|
350
|
-
| EmbedChat | `
|
|
351
|
-
| EmbedChat | `
|
|
327
|
+
| WebChat | `notchatbot-webchat-open` | The floating chat is opened | `{ conversationId }` |
|
|
328
|
+
| WebChat | `notchatbot-webchat-closed` | The floating chat is closed | `{ conversationId }` |
|
|
329
|
+
| WebChat | `notchatbot-webchat-message-sent` | The user sends one or more messages | `{ messages: Message[] }` |
|
|
330
|
+
| WebChat | `notchatbot-webchat-message-received` | A message is received from the server | `{ message: Message, role: 'assistant' \| 'employee' }` |
|
|
331
|
+
| EmbedChat | `notchatbot-embedchat-message-sent` | The user sends a message | `{ message: Message }` |
|
|
332
|
+
| EmbedChat | `notchatbot-embedchat-message-received` | A message is received | `{ message: Message, role: 'assistant' \| 'employee' }` |
|
|
352
333
|
|
|
353
334
|
`Message` follows the same interface used internally by the widget (id, text, sender, timestamp, etc.).
|
|
354
335
|
|
|
355
336
|
#### Quick example
|
|
356
337
|
```js
|
|
357
|
-
window.addEventListener('
|
|
358
|
-
window.addEventListener('
|
|
359
|
-
window.addEventListener('
|
|
360
|
-
window.addEventListener('
|
|
338
|
+
window.addEventListener('notchatbot-webchat-open', e => console.log('WebChat opened', e.detail));
|
|
339
|
+
window.addEventListener('notchatbot-webchat-closed', e => console.log('WebChat closed', e.detail));
|
|
340
|
+
window.addEventListener('notchatbot-webchat-message-sent', e => console.log('Sent', e.detail.messages));
|
|
341
|
+
window.addEventListener('notchatbot-webchat-message-received', e => {
|
|
361
342
|
const { role, message } = e.detail;
|
|
362
343
|
console.log('Received', role, message);
|
|
363
344
|
});
|
|
@@ -366,7 +347,7 @@ window.addEventListener('WebChatMessageReceived', e => {
|
|
|
366
347
|
#### Google Tag Manager / Google Analytics (GA4)
|
|
367
348
|
Push data directly to the **dataLayer** and create a trigger in GTM:
|
|
368
349
|
```js
|
|
369
|
-
window.addEventListener('
|
|
350
|
+
window.addEventListener('notchatbot-webchat-message-sent', e => {
|
|
370
351
|
window.dataLayer = window.dataLayer || [];
|
|
371
352
|
window.dataLayer.push({
|
|
372
353
|
event: 'webchat_message_sent',
|
|
@@ -379,13 +360,13 @@ Then in GTM, add a **Custom Event** trigger called `webchat_message_sent` and li
|
|
|
379
360
|
|
|
380
361
|
#### Meta / Facebook Pixel
|
|
381
362
|
```js
|
|
382
|
-
window.addEventListener('
|
|
363
|
+
window.addEventListener('notchatbot-webchat-open', () => {
|
|
383
364
|
if (window.fbq) {
|
|
384
365
|
fbq('trackCustom', 'WebChatOpened');
|
|
385
366
|
}
|
|
386
367
|
});
|
|
387
368
|
|
|
388
|
-
window.addEventListener('
|
|
369
|
+
window.addEventListener('notchatbot-webchat-message-received', e => {
|
|
389
370
|
if (window.fbq) {
|
|
390
371
|
fbq('trackCustom', 'WebChatMessageReceived', {
|
|
391
372
|
role: e.detail.role
|
|
@@ -16470,7 +16470,7 @@ También puedes pedir hablar con nuestro equipo de los sueños!`, xd = (e) => ({
|
|
|
16470
16470
|
return;
|
|
16471
16471
|
}
|
|
16472
16472
|
if (typeof window != "undefined") {
|
|
16473
|
-
const ee = o ? "
|
|
16473
|
+
const ee = o ? "notchatbot-webchat-open" : "notchatbot-webchat-closed";
|
|
16474
16474
|
window.dispatchEvent(new CustomEvent(ee, { detail: { conversationId: f } }));
|
|
16475
16475
|
}
|
|
16476
16476
|
}, [o, f]);
|
|
@@ -16485,7 +16485,7 @@ También puedes pedir hablar con nuestro equipo de los sueños!`, xd = (e) => ({
|
|
|
16485
16485
|
]), T = Z.useCallback((ee, Y = "bot") => {
|
|
16486
16486
|
if (A((le) => [...le, ee]), !o && (ee.sender === "bot" || Y === "bot") && ee.id !== s && h(!0), typeof window != "undefined" && (Y === "bot" || Y === "ably")) {
|
|
16487
16487
|
const le = Y === "bot" ? "assistant" : "employee";
|
|
16488
|
-
window.dispatchEvent(new CustomEvent("
|
|
16488
|
+
window.dispatchEvent(new CustomEvent("notchatbot-webchat-message-received", {
|
|
16489
16489
|
detail: { message: ee, role: le }
|
|
16490
16490
|
}));
|
|
16491
16491
|
}
|
|
@@ -16604,7 +16604,7 @@ También puedes pedir hablar con nuestro equipo de los sueños!`, xd = (e) => ({
|
|
|
16604
16604
|
}));
|
|
16605
16605
|
ae.push(...ce), be.push(...ce);
|
|
16606
16606
|
}
|
|
16607
|
-
A((ce) => [...ce, ...ae]), typeof window != "undefined" && ae.length > 0 && window.dispatchEvent(new CustomEvent("
|
|
16607
|
+
A((ce) => [...ce, ...ae]), typeof window != "undefined" && ae.length > 0 && window.dispatchEvent(new CustomEvent("notchatbot-webchat-message-sent", {
|
|
16608
16608
|
detail: { messages: ae }
|
|
16609
16609
|
})), C(!0);
|
|
16610
16610
|
try {
|
|
@@ -16897,7 +16897,7 @@ También puedes pedir hablar con nuestro equipo de los sueños!`, xd = (e) => ({
|
|
|
16897
16897
|
});
|
|
16898
16898
|
}, []);
|
|
16899
16899
|
const C = Z.useCallback((p) => {
|
|
16900
|
-
u(p), typeof window != "undefined" && window.dispatchEvent(new CustomEvent("
|
|
16900
|
+
u(p), typeof window != "undefined" && window.dispatchEvent(new CustomEvent("notchatbot-embedchat-message-received", {
|
|
16901
16901
|
detail: { message: p, role: "employee" }
|
|
16902
16902
|
}));
|
|
16903
16903
|
}, [u]), P = Z.useCallback((p) => {
|
|
@@ -16916,7 +16916,7 @@ También puedes pedir hablar con nuestro equipo de los sueños!`, xd = (e) => ({
|
|
|
16916
16916
|
conversationId: S,
|
|
16917
16917
|
type: "text"
|
|
16918
16918
|
};
|
|
16919
|
-
u(s), typeof window != "undefined" && window.dispatchEvent(new CustomEvent("
|
|
16919
|
+
u(s), typeof window != "undefined" && window.dispatchEvent(new CustomEvent("notchatbot-embedchat-message-sent", {
|
|
16920
16920
|
detail: { message: s }
|
|
16921
16921
|
})), d.push(s), c.push(s);
|
|
16922
16922
|
}
|
|
@@ -16931,7 +16931,7 @@ También puedes pedir hablar con nuestro equipo de los sueños!`, xd = (e) => ({
|
|
|
16931
16931
|
metaContent: w.url
|
|
16932
16932
|
}));
|
|
16933
16933
|
s.forEach((w) => {
|
|
16934
|
-
u(w), typeof window != "undefined" && window.dispatchEvent(new CustomEvent("
|
|
16934
|
+
u(w), typeof window != "undefined" && window.dispatchEvent(new CustomEvent("notchatbot-embedchat-message-sent", {
|
|
16935
16935
|
detail: { message: w }
|
|
16936
16936
|
})), c.push(w);
|
|
16937
16937
|
}), d.push(...s);
|
|
@@ -16957,7 +16957,7 @@ También puedes pedir hablar con nuestro equipo de los sueños!`, xd = (e) => ({
|
|
|
16957
16957
|
l(k), f.current = k.client, m(!0);
|
|
16958
16958
|
}
|
|
16959
16959
|
const v = bd(w.response.message);
|
|
16960
|
-
v && (u(v), typeof window != "undefined" && window.dispatchEvent(new CustomEvent("
|
|
16960
|
+
v && (u(v), typeof window != "undefined" && window.dispatchEvent(new CustomEvent("notchatbot-embedchat-message-received", {
|
|
16961
16961
|
detail: { message: v, role: "assistant" }
|
|
16962
16962
|
})));
|
|
16963
16963
|
} else {
|
|
@@ -146,4 +146,4 @@ Please report this to https://github.com/markedjs/marked.`,e){const r="<p>An err
|
|
|
146
146
|
|
|
147
147
|
Aunque no lo creas, soy una inteligencia artificial! Puedo resolver todas tus dudas 😊
|
|
148
148
|
|
|
149
|
-
También puedes pedir hablar con nuestro equipo de los sueños!`,Cd=e=>({id:ut(),text:lm(e),sender:"bot",timestamp:new Date().toISOString(),type:"text"}),kd=()=>typeof window!="undefined"&&window.innerWidth<640,um=({config:e,exposeControl:t})=>{if(!e.apiKey)return null;const[n,r]=Z.useState(()=>Ti(e)),[o,i]=Z.useState(!1),[a,l]=Z.useState(()=>kd()),[d,m]=Z.useState(""),[x,R]=Z.useState(!1),[y,E]=Z.useState(!1),[u,C]=Z.useState(!1),[P,b]=Z.useState(""),[,p]=Z.useState(null),g=Z.useRef(null),[S,h]=Z.useState(!1),[f,c]=Z.useState(!1),[s,w]=Z.useState(""),[v,k]=Z.useState(!0),[L,N]=Z.useState(!1),I=Z.useRef(!0);Z.useEffect(()=>{if(I.current){I.current=!1;return}if(typeof window!="undefined"){const ee=o?"WebChatOpened":"WebChatClosed";window.dispatchEvent(new CustomEvent(ee,{detail:{conversationId:d}}))}},[o,d]);const[O,A]=Z.useState([e.initialMessage?{id:ut(),text:e.initialMessage,sender:"bot",timestamp:new Date().toISOString(),type:"text"}:Cd(e.title)]),T=Z.useCallback((ee,Y="bot")=>{if(A(le=>[...le,ee]),!o&&(ee.sender==="bot"||Y==="bot")&&ee.id!==s&&h(!0),typeof window!="undefined"&&(Y==="bot"||Y==="ably")){const le=Y==="bot"?"assistant":"employee";window.dispatchEvent(new CustomEvent("WebChatMessageReceived",{detail:{message:ee,role:le}}))}},[o,s]);Z.useEffect(()=>{const ee=()=>{const Y=kd();l(Y)};return window.addEventListener("resize",ee),()=>window.removeEventListener("resize",ee)},[]),Z.useEffect(()=>em(()=>{r(Ti(e))}),[e]),Z.useEffect(()=>{r(Ti(e))},[e]),Z.useEffect(()=>{De(this,null,function*(){const Y=pd();m(Y);const le=yield md();b(le)})},[]),Z.useEffect(()=>{if(O.length>0){const ee=O[O.length-1];ee.sender==="bot"&&w(ee.id)}},[]);const j=Z.useCallback(ee=>{T(ee,"ably")},[T]),B=Z.useCallback(ee=>{k(ee)},[]),z=Z.useCallback(ee=>De(this,null,function*(){if(!(f||g.current))try{if(ee.tokenDetails){const Y=yield Ai(ee.tokenDetails,e.apiKey||"",d,j,B);p(Y),g.current=Y.client,c(!0)}}catch(Y){console.error("[❌ ABLY SETUP ERROR from history]",Y)}}),[f,d,j]),$=Z.useCallback(()=>De(this,null,function*(){if(!(f||g.current))try{const ee=yield sm(d,e.apiKey||"");if(ee!=null&&ee.tokenDetails){const Y=yield Ai(ee.tokenDetails,e.apiKey||"",d,j,B);p(Y),g.current=Y.client,c(!0)}}catch(ee){console.error("[❌ ABLY SETUP ERROR from endpoint]",ee)}}),[f,d,e.apiKey,j]),V=Z.useCallback(()=>De(this,null,function*(){var Y,le;const ee=o;if(i(se=>!se),!ee){h(!1);const se=O.filter(ke=>ke.sender==="bot").slice(-1)[0];se&&w(se.id)}if(!ee&&!x&&d&&gd()&&!f){E(!0);const se=yield nm(d,e.apiKey||"");if(((le=(Y=se==null?void 0:se.conversation)==null?void 0:Y.messages)==null?void 0:le.length)>0){const ke=rm(se.conversation.messages);A(ke),se.conversation.chatbotActivated!==void 0&&k(se.conversation.chatbotActivated),se.conversation.isRated!==void 0&&N(se.conversation.isRated);const ce=ke.filter(xe=>xe.sender==="bot").slice(-1)[0];ce&&w(ce.id),yield z(se)}else console.warn("WebChat: No conversation history found, showing initial message");E(!1),R(!0)}else!ee&&gd()&&!f&&(yield $())}),[o,d,x,f,e.apiKey,z,$,O]),G=Z.useCallback(()=>{i(!1)},[]),M=Z.useCallback((ee,Y)=>De(this,null,function*(){const le=new Date().toISOString(),se=[],ke=[...O];if(ee.trim()){const ce={id:ut(),text:ee,sender:"user",timestamp:le,type:"text"};se.push(ce),ke.push(ce)}if(Y&&Y.length>0){const ce=Y.map(xe=>({id:ut(),text:xe.type.startsWith("image/")?``:`[${xe.name}](${xe.url})`,sender:"user",timestamp:le,type:xe.type.startsWith("image/")?"image":"file",metaContent:xe.url}));se.push(...ce),ke.push(...ce)}A(ce=>[...ce,...se]),typeof window!="undefined"&&se.length>0&&window.dispatchEvent(new CustomEvent("WebChatMessageSent",{detail:{messages:se}})),C(!0);try{const ce=bd(d,ke,se,{apiKey:e.apiKey||""},P),xe=yield xd(ce);if(xe){if(xe.response.tokenDetails&&!g.current){const tt=yield Ai(xe.response.tokenDetails,e.apiKey||"",d,j,B);p(tt),g.current=tt.client,c(!0)}const Wt=Sd(xe.response.message);Wt&&T(Wt,"bot")}else{setTimeout(()=>{const Wt=Ii();T(Wt,"bot"),C(!1)},1e3);return}}catch(ce){console.error("WebChat: Error in message handling:",ce),setTimeout(()=>{const xe=Ii();T(xe,"bot"),C(!1)},1e3);return}C(!1),Zg(!0)}),[d,O,e.apiKey,P,j,T]),D=tm(n);Z.useEffect(()=>()=>{wd(g.current),g.current=null},[]);const U=Z.useCallback(ee=>i(ee),[]),_=Z.useCallback(ee=>r(Y=>ae(ae({},Y),ee)),[]),W=Z.useCallback(ee=>r(Y=>ae(ae({},Y),ee)),[]),[X,q]=Z.useState(!1),re=Z.useCallback(()=>q(!0),[]),ie=Z.useCallback(()=>q(!1),[]);return Z.useEffect(()=>{t&&t({setIsOpen:U,updateConfig:_,setPosition:W,hide:re,show:ie})},[t,U,_,W,re,ie]),F.jsxs("div",{className:"nbc-font-sans",style:{zIndex:2147483647,display:X?"none":void 0},children:[D.showPopup!==!1&&F.jsx(Yg,{initialMessage:e.initialMessage,avatar:n.avatar,position:D.position,marginBottom:D.marginBottom,marginSide:D.marginSide,primaryColor:n.primaryColor||"#007bff",isMobile:a,isOpen:o,onPopoverClick:V}),F.jsx(tg,{isOpen:o,onClick:V,primaryColor:n.primaryColor,position:D.position,marginBottom:D.marginBottom,marginSide:D.marginSide,hasNewMessages:S,isMobile:a}),F.jsx(Qg,{isOpen:o,onClose:G,config:n,messages:O,onSendMessage:M,isLoading:y,isAiTyping:u,position:D.position,marginBottom:D.marginBottom,marginSide:D.marginSide,isMobile:a,apiKeyMissing:!e.apiKey,chatbotActivated:v,isRated:L,onRatingChange:N,conversationId:d})]})},Ed='*,:before,:after{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }*,:before,:after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb}:before,:after{--tw-content: ""}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}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;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;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}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=until-found])){display:none}.nbc-pointer-events-none{pointer-events:none}.nbc-pointer-events-auto{pointer-events:auto}.nbc-fixed{position:fixed}.nbc-absolute{position:absolute}.nbc-relative{position:relative}.nbc-inset-0{inset:0}.nbc-inset-auto{inset:auto}.nbc-left-2{left:8px}.nbc-right-0{right:0}.nbc-right-2{right:8px}.nbc-top-0{top:0}.nbc-top-1\\/2{top:50%}.nbc-top-2{top:8px}.nbc-top-full{top:100%}.nbc-m-0{margin:0}.nbc-mx-auto{margin-left:auto;margin-right:auto}.nbc-mb-1{margin-bottom:4px}.nbc-mb-2{margin-bottom:8px}.nbc-mb-4{margin-bottom:16px}.nbc-ml-1{margin-left:4px}.nbc-ml-2{margin-left:8px}.nbc-mr-1{margin-right:4px}.nbc-mr-3{margin-right:12px}.nbc-mt-1{margin-top:4px}.nbc-line-clamp-2{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}.nbc-flex{display:flex}.nbc-hidden{display:none}.nbc-h-0{height:0px}.nbc-h-10{height:40px}.nbc-h-12{height:48px}.nbc-h-16{height:64px}.nbc-h-2{height:8px}.nbc-h-24{height:96px}.nbc-h-3{height:12px}.nbc-h-4{height:16px}.nbc-h-5{height:20px}.nbc-h-6{height:24px}.nbc-h-7{height:28px}.nbc-h-8{height:32px}.nbc-h-auto{height:auto}.nbc-h-full{height:100%}.nbc-min-h-0{min-height:0px}.nbc-min-h-\\[220px\\]{min-height:220px}.nbc-w-0{width:0px}.nbc-w-10{width:40px}.nbc-w-12{width:48px}.nbc-w-16{width:64px}.nbc-w-2{width:8px}.nbc-w-3{width:12px}.nbc-w-4{width:16px}.nbc-w-5{width:20px}.nbc-w-6{width:24px}.nbc-w-7{width:28px}.nbc-w-8{width:32px}.nbc-w-auto{width:auto}.nbc-w-full{width:100%}.nbc-max-w-20{max-width:80px}.nbc-max-w-\\[90\\%\\]{max-width:90%}.nbc-max-w-xs{max-width:20rem}.nbc-flex-1{flex:1 1 0%}.nbc-flex-shrink-0{flex-shrink:0}.-nbc-translate-y-4{--tw-translate-y: -16px;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.nbc--translate-y-1\\/2{--tw-translate-y: -50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.nbc-translate-y-0{--tw-translate-y: 0px;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.nbc-translate-y-2{--tw-translate-y: 8px;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.nbc-translate-y-3{--tw-translate-y: 12px;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.nbc-translate-y-4{--tw-translate-y: 16px;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.nbc-translate-y-\\[-10px\\]{--tw-translate-y: -10px;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.nbc-rotate-180{--tw-rotate: 180deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.nbc-scale-100{--tw-scale-x: 1;--tw-scale-y: 1;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.nbc-scale-90{--tw-scale-x: .9;--tw-scale-y: .9;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.nbc-scale-95{--tw-scale-x: .95;--tw-scale-y: .95;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.nbc-scale-\\[1\\.13\\]{--tw-scale-x: 1.13;--tw-scale-y: 1.13;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.nbc-transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}@keyframes nbc-bounce{0%,to{transform:translateY(-25%);animation-timing-function:cubic-bezier(.8,0,1,1)}50%{transform:none;animation-timing-function:cubic-bezier(0,0,.2,1)}}.nbc-animate-bounce{animation:nbc-bounce 1s infinite}@keyframes nbc-ping{75%,to{transform:scale(2);opacity:0}}.nbc-animate-ping{animation:nbc-ping 1s cubic-bezier(0,0,.2,1) infinite}@keyframes nbc-pulse{50%{opacity:.5}}.nbc-animate-pulse{animation:nbc-pulse 2s cubic-bezier(.4,0,.6,1) infinite}@keyframes nbc-spin{to{transform:rotate(360deg)}}.nbc-animate-spin{animation:nbc-spin 1s linear infinite}.nbc-cursor-pointer{cursor:pointer}.nbc-flex-col{flex-direction:column}.nbc-flex-wrap{flex-wrap:wrap}.nbc-items-start{align-items:flex-start}.nbc-items-end{align-items:flex-end}.nbc-items-center{align-items:center}.nbc-justify-start{justify-content:flex-start}.nbc-justify-end{justify-content:flex-end}.nbc-justify-center{justify-content:center}.nbc-justify-between{justify-content:space-between}.nbc-gap-2{gap:8px}.nbc-space-x-1>:not([hidden])~:not([hidden]){--tw-space-x-reverse: 0;margin-right:calc(4px * var(--tw-space-x-reverse));margin-left:calc(4px * calc(1 - var(--tw-space-x-reverse)))}.nbc-space-x-3>:not([hidden])~:not([hidden]){--tw-space-x-reverse: 0;margin-right:calc(12px * var(--tw-space-x-reverse));margin-left:calc(12px * calc(1 - var(--tw-space-x-reverse)))}.nbc-space-y-2>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(8px * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(8px * var(--tw-space-y-reverse))}.nbc-space-y-4>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(16px * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(16px * var(--tw-space-y-reverse))}.nbc-overflow-hidden{overflow:hidden}.nbc-overflow-y-auto{overflow-y:auto}.nbc-truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.nbc-whitespace-nowrap{white-space:nowrap}.nbc-break-words{overflow-wrap:break-word}.nbc-rounded{border-radius:4px}.nbc-rounded-2xl{border-radius:16px}.nbc-rounded-full{border-radius:9999px}.nbc-rounded-lg{border-radius:8px}.nbc-rounded-none{border-radius:0}.nbc-rounded-bl-md{border-bottom-left-radius:6px}.nbc-rounded-br-md{border-bottom-right-radius:6px}.nbc-border{border-width:1px}.nbc-border-0{border-width:0px}.nbc-border-2{border-width:2px}.nbc-border-b{border-bottom-width:1px}.nbc-border-t{border-top-width:1px}.nbc-border-none{border-style:none}.nbc-border-gray-100{--tw-border-opacity: 1;border-color:rgb(243 244 246 / var(--tw-border-opacity, 1))}.nbc-border-gray-300{--tw-border-opacity: 1;border-color:rgb(209 213 219 / var(--tw-border-opacity, 1))}.nbc-border-white{--tw-border-opacity: 1;border-color:rgb(255 255 255 / var(--tw-border-opacity, 1))}.nbc-border-t-gray-600{--tw-border-opacity: 1;border-top-color:rgb(75 85 99 / var(--tw-border-opacity, 1))}.nbc-bg-blue-500{--tw-bg-opacity: 1;background-color:rgb(59 130 246 / var(--tw-bg-opacity, 1))}.nbc-bg-gray-100{--tw-bg-opacity: 1;background-color:rgb(243 244 246 / var(--tw-bg-opacity, 1))}.nbc-bg-gray-200{--tw-bg-opacity: 1;background-color:rgb(229 231 235 / var(--tw-bg-opacity, 1))}.nbc-bg-gray-300{--tw-bg-opacity: 1;background-color:rgb(209 213 219 / var(--tw-bg-opacity, 1))}.nbc-bg-gray-400{--tw-bg-opacity: 1;background-color:rgb(156 163 175 / var(--tw-bg-opacity, 1))}.nbc-bg-gray-50{--tw-bg-opacity: 1;background-color:rgb(249 250 251 / var(--tw-bg-opacity, 1))}.nbc-bg-green-400{--tw-bg-opacity: 1;background-color:rgb(74 222 128 / var(--tw-bg-opacity, 1))}.nbc-bg-green-500{--tw-bg-opacity: 1;background-color:rgb(34 197 94 / var(--tw-bg-opacity, 1))}.nbc-bg-transparent{background-color:transparent}.nbc-bg-white{--tw-bg-opacity: 1;background-color:rgb(255 255 255 / var(--tw-bg-opacity, 1))}.nbc-bg-none{background-image:none}.nbc-object-cover{-o-object-fit:cover;object-fit:cover}.nbc-p-0{padding:0}.nbc-p-1{padding:4px}.nbc-p-2{padding:8px}.nbc-p-4{padding:16px}.nbc-p-5{padding:20px}.nbc-px-2{padding-left:8px;padding-right:8px}.nbc-px-4{padding-left:16px;padding-right:16px}.nbc-py-1{padding-top:4px;padding-bottom:4px}.nbc-py-2{padding-top:8px;padding-bottom:8px}.nbc-py-3{padding-top:12px;padding-bottom:12px}.nbc-pl-12{padding-left:48px}.nbc-pr-12{padding-right:48px}.nbc-pt-4{padding-top:16px}.nbc-text-center{text-align:center}.nbc-text-right{text-align:right}.nbc-font-sans{font-family:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji"}.nbc-text-\\[15px\\]{font-size:15px}.nbc-text-lg{font-size:18px}.nbc-text-sm{font-size:14px}.nbc-text-xs{font-size:12px}.nbc-font-bold{font-weight:700}.nbc-font-medium{font-weight:500}.nbc-italic{font-style:italic}.nbc-leading-none{line-height:1}.nbc-leading-relaxed{line-height:1.625}.nbc-text-black{--tw-text-opacity: 1;color:rgb(0 0 0 / var(--tw-text-opacity, 1))}.nbc-text-blue-400{--tw-text-opacity: 1;color:rgb(96 165 250 / var(--tw-text-opacity, 1))}.nbc-text-blue-500{--tw-text-opacity: 1;color:rgb(59 130 246 / var(--tw-text-opacity, 1))}.nbc-text-gray-400{--tw-text-opacity: 1;color:rgb(156 163 175 / var(--tw-text-opacity, 1))}.nbc-text-gray-500{--tw-text-opacity: 1;color:rgb(107 114 128 / var(--tw-text-opacity, 1))}.nbc-text-gray-600{--tw-text-opacity: 1;color:rgb(75 85 99 / var(--tw-text-opacity, 1))}.nbc-text-gray-700{--tw-text-opacity: 1;color:rgb(55 65 81 / var(--tw-text-opacity, 1))}.nbc-text-gray-800{--tw-text-opacity: 1;color:rgb(31 41 55 / var(--tw-text-opacity, 1))}.nbc-text-gray-900{--tw-text-opacity: 1;color:rgb(17 24 39 / var(--tw-text-opacity, 1))}.nbc-text-white{--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity, 1))}.nbc-no-underline{text-decoration-line:none}.nbc-opacity-0{opacity:0}.nbc-opacity-100{opacity:1}.nbc-opacity-50{opacity:.5}.nbc-opacity-70{opacity:.7}.nbc-opacity-75{opacity:.75}.nbc-shadow-2xl{--tw-shadow: 0 25px 50px -12px rgb(0 0 0 / .25);--tw-shadow-colored: 0 25px 50px -12px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.nbc-shadow-lg{--tw-shadow: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.nbc-shadow-md{--tw-shadow: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.nbc-shadow-none{--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.nbc-shadow-sm{--tw-shadow: 0 1px 2px 0 rgb(0 0 0 / .05);--tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.nbc-shadow-xl{--tw-shadow: 0 20px 25px -5px rgb(0 0 0 / .1), 0 8px 10px -6px rgb(0 0 0 / .1);--tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.nbc-outline-none{outline:2px solid transparent;outline-offset:2px}.nbc-transition-all{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.nbc-transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.nbc-transition-transform{transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.nbc-duration-200{transition-duration:.2s}.nbc-duration-300{transition-duration:.3s}.nbc-duration-500{transition-duration:.5s}.nbc-ease-out{transition-timing-function:cubic-bezier(0,0,.2,1)}.hover\\:nbc-scale-105:hover{--tw-scale-x: 1.05;--tw-scale-y: 1.05;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.hover\\:nbc-scale-\\[1\\.02\\]:hover{--tw-scale-x: 1.02;--tw-scale-y: 1.02;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.hover\\:nbc-bg-black:hover{--tw-bg-opacity: 1;background-color:rgb(0 0 0 / var(--tw-bg-opacity, 1))}.hover\\:nbc-bg-gray-100:hover{--tw-bg-opacity: 1;background-color:rgb(243 244 246 / var(--tw-bg-opacity, 1))}.hover\\:nbc-bg-opacity-20:hover{--tw-bg-opacity: .2}.hover\\:nbc-text-gray-600:hover{--tw-text-opacity: 1;color:rgb(75 85 99 / var(--tw-text-opacity, 1))}.hover\\:nbc-text-gray-700:hover{--tw-text-opacity: 1;color:rgb(55 65 81 / var(--tw-text-opacity, 1))}.disabled\\:nbc-cursor-not-allowed:disabled{cursor:not-allowed}.disabled\\:nbc-opacity-50:disabled{opacity:.5}',cm={apiKey:"",primaryColor:"#111111",avatar:"",title:"NotChatBot",placeholder:"Escribe tu mensaje...",initialMessage:"¡Hola! ¿En qué puedo ayudarte?",position:"bottom-right",marginBottom:20,marginSide:20,showPopup:!0,mobile:{position:"bottom-right",marginBottom:15,marginSide:15,showPopup:!0},desktop:{position:"bottom-right",marginBottom:25,marginSide:25,showPopup:!0},closeButtonIcon:"default",closeButtonText:"Cerrar",closeButtonCustomIcon:""},fm=({title:e,primaryColor:t="#3b82f6",avatar:n})=>{const r={backgroundColor:t};return F.jsxs("div",{id:"notchatbot-embed-chat-header",style:r,className:"nbc-flex nbc-items-center nbc-p-4",children:[F.jsx("div",{className:"nbc-flex nbc-items-center nbc-mr-3 nbc-text-black",children:n?F.jsx("img",{src:n,alt:"Avatar",className:"nbc-w-8 nbc-h-8 nbc-rounded-full nbc-object-cover"}):F.jsxs("svg",{xmlns:"http://www.w3.org/2000/svg",width:"40",height:"40",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",className:"nbc-w-8 nbc-h-8 nbc-bg-white nbc-rounded-full nbc-p-1",children:[F.jsx("path",{d:"M12 6V2H8"}),F.jsx("path",{d:"m8 18-4 4V8a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2Z"}),F.jsx("path",{d:"M2 12h2"}),F.jsx("path",{d:"M9 11v2"}),F.jsx("path",{d:"M15 11v2"}),F.jsx("path",{d:"M20 12h2"})]})}),F.jsx("h3",{className:"nbc-m-0 nbc-text-lg nbc-font-bold nbc-text-white",children:e})]})},dm=({footerText:e,primaryColor:t,footerColor:n})=>{if(!e)return null;const r=o=>{const i=/(https?:\/\/[^\s]+)/g;return o.split(i).map((l,d)=>i.test(l)?F.jsx("a",{href:l,target:"_blank",rel:"noopener noreferrer",className:"nbc-font-medium nbc-no-underline",style:{color:t},children:l},d):l)};return F.jsx("div",{id:"notchatbot-embed-chat-footer",className:"nbc-py-3 nbc-px-4 nbc-bg-gray-50 nbc-text-xs nbc-text-gray-600 nbc-text-center nbc-leading-relaxed nbc-italic",style:{backgroundColor:n},children:r(e)})},hm=({config:e,messages:t,onSendMessage:n,isLoading:r,isAiTyping:o,chatbotActivated:i=!0})=>{var d;const a=(m,x="auto")=>m===void 0?x:typeof m=="number"?`${m}px`:m,l={width:a(e.width,"100%"),height:a(e.height,"400px"),maxWidth:a(e.maxWidth,"100%"),maxHeight:a(e.maxHeight,"100vh"),minWidth:a(e.minWidth,"280px"),minHeight:a(e.minHeight,"300px"),display:"flex",flexDirection:"column",backgroundColor:e.chatTransparent?"transparent":e.chatBackground||"#ffffff",borderRadius:a(e.borderRadius,"0px"),border:e.border||"1px solid #e5e7eb",boxShadow:e.boxShadow||"0 10px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04)",overflow:"hidden",position:"relative"};return F.jsxs("div",{id:"notchatbot-embed-chat",className:"nbc-font-sans",style:l,children:[e.showHeader!==!1&&F.jsx(fm,{title:e.title||"Chat",primaryColor:e.primaryColor,avatar:e.avatar}),F.jsxs("div",{id:"notchatbot-embed-chat-body",className:"nbc-flex-1 nbc-flex nbc-flex-col nbc-min-h-0",style:{position:"relative",overflow:"hidden"},children:[r?F.jsx("div",{className:"nbc-flex-1 nbc-p-4",children:F.jsx(ld,{})}):F.jsx(od,{messages:t,isTyping:o||!1,avatar:e.avatar,textColor:e.textColor,bubbleUserColor:e.bubbleUserColor,chatbotActivated:i}),F.jsx("div",{id:"notchatbot-embed-chat-body-input",className:"nbc-py-2 nbc-bg-gray-50 nbc-border-none",style:{backgroundColor:(d=e.input)==null?void 0:d.backgroundColor},children:F.jsx(sd,{onSendMessage:n,placeholder:e.placeholder||"Escribe un mensaje...",primaryColor:e.primaryColor,disabled:r,input:e.input,apiKey:e.apiKey})})]}),e.showFooter!==!1&&e.footerText&&F.jsx(dm,{footerText:e.footerText,primaryColor:e.primaryColor,footerColor:e.footerColor})]})},pm=({config:e})=>{if(!e.apiKey)return null;const[t,n]=Z.useState(""),[r,o]=Z.useState(!1),[i,a]=Z.useState(""),[,l]=Z.useState(null),d=Z.useRef(null),[,m]=Z.useState(!1),[x,R]=Z.useState(!0),[y,E]=Z.useState([e.initialMessage?{id:ut(),text:e.initialMessage,sender:"bot",timestamp:new Date().toISOString(),type:"text"}:Cd(e.title)]),u=Z.useCallback(p=>{E(g=>[...g,p])},[]);Z.useEffect(()=>{De(this,null,function*(){const g=yield md();a(g)})},[]);const C=Z.useCallback(p=>{u(p),typeof window!="undefined"&&window.dispatchEvent(new CustomEvent("EmbedChatMessageReceived",{detail:{message:p,role:"employee"}}))},[u]),P=Z.useCallback(p=>{R(p)},[]),b=Z.useCallback((p,g)=>De(this,null,function*(){if(!p.trim()&&(!g||g.length===0))return;let S=t;S||(S=ut(),n(S));const h=new Date().toISOString(),f=[...y],c=[];if(p.trim()){const s={id:ut(),text:p,sender:"user",timestamp:h,conversationId:S,type:"text"};u(s),typeof window!="undefined"&&window.dispatchEvent(new CustomEvent("EmbedChatMessageSent",{detail:{message:s}})),f.push(s),c.push(s)}if(g&&g.length>0){const s=g.map(w=>({id:ut(),text:w.type.startsWith("image/")?``:`[${w.name}](${w.url})`,sender:"user",timestamp:h,conversationId:S,type:w.type.startsWith("image/")?"image":"file",metaContent:w.url}));s.forEach(w=>{u(w),typeof window!="undefined"&&window.dispatchEvent(new CustomEvent("EmbedChatMessageSent",{detail:{message:w}})),c.push(w)}),f.push(...s)}o(!0);try{const s=bd(S,f,c,{apiKey:e.apiKey||""},i),w=yield xd(s);if(w){if(w.response.tokenDetails&&!d.current){const k=yield Ai(w.response.tokenDetails,e.apiKey||"",S,C,P);l(k),d.current=k.client,m(!0)}const v=Sd(w.response.message);v&&(u(v),typeof window!="undefined"&&window.dispatchEvent(new CustomEvent("EmbedChatMessageReceived",{detail:{message:v,role:"assistant"}})))}else{setTimeout(()=>{const v=Ii();u(v),o(!1)},1e3);return}o(!1)}catch(s){console.error("EmbedChat: Error sending message:",s),setTimeout(()=>{const w=Ii();u(w),o(!1)},1e3);return}}),[t,i,e.apiKey,u,C,y]);return Z.useEffect(()=>()=>{d.current&&wd(d.current)},[]),F.jsx(hm,{config:e,messages:y,onSendMessage:b,isLoading:!1,isAiTyping:r,chatbotActivated:x})};(()=>{if(typeof document=="undefined")return;const e={},t=document.dispatchEvent.bind(document);document.dispatchEvent=r=>{const o=r==null?void 0:r.type;return(o==="WebChatReady"||o==="EmbedChatReady")&&(e[o]=!0),t(r)};const n=document.addEventListener.bind(document);document.addEventListener=(r,o,i)=>{const a=r;if((a==="WebChatReady"||a==="EmbedChatReady")&&e[a]){const l=new CustomEvent(a);setTimeout(()=>{typeof o=="function"?o.call(document,l):o&&typeof o.handleEvent=="function"&&o.handleEvent(l)},0)}return n(r,o,i)}})();let or=null;const qr={},Pi={};let ct=null,Ne=null,ul=!1,eo={};const cl={},Rd=e=>{try{if(!e.elementId)return console.error("EmbedChat: elementId is required"),null;const t=document.getElementById(e.elementId);if(!t)return null;let n;t.shadowRoot?(n=t.shadowRoot,n.innerHTML=""):n=t.attachShadow({mode:"open"});const r=document.createElement("style");if(r.textContent=Ed,n.appendChild(r),e.customCSS){const a=document.createElement("style");a.setAttribute("data-custom","true"),a.textContent=e.customCSS,n.appendChild(a)}const o=document.createElement("div");n.appendChild(o);const i=Ys(o);return i.render(Hi.createElement(pm,{config:e})),Pi[e.elementId]={destroy:()=>{i.unmount(),n.innerHTML="",delete Pi[e.elementId],cl[e.elementId]=e}},cl[e.elementId]=e,Pi[e.elementId]}catch(t){return console.error("EmbedChat: Failed to initialize",t),null}};function Gt(){let e=qr["webchat-notchatbot"];if(!e){const n=ae(ae({},Ne),eo);let r="webchat-notchatbot";typeof(Ne==null?void 0:Ne.elementId)=="string"&&Ne.elementId&&(r=Ne.elementId);const t=n,{elementId:o}=t,i=vl(t,["elementId"]);"elementId"in i&&delete i.elementId;const a=Object.assign({elementId:r},i);e=Od(a),ul&&e&&e.setIsOpen&&e.setIsOpen(!0);const l=new CustomEvent("WebChatReady");document.dispatchEvent(l)}return e}const Od=e=>{try{let t=function(u){return Hi.createElement(um,We(ae({},u),{exposeControl:C=>{l=C.setIsOpen,d=C.updateConfig,m=C.setPosition,x=C.hide,R=C.show,y=C.getIsOpen}}))};or&&(or.destroy(),or=null);const n=ae(ae({elementId:"webchat-notchatbot"},cm),e);Ne=n;let r=document.getElementById(n.elementId);r||(r=document.createElement("div"),r.id=n.elementId,document.body.appendChild(r));let o;r.shadowRoot?(o=r.shadowRoot,o.innerHTML=""):o=r.attachShadow({mode:"open"}),ct=o;const i=document.createElement("style");i.textContent=Ed,o.appendChild(i);const a=document.createElement("div");o.appendChild(a);let l=null,d=null,m=null,x=null,R=null,y=null;const E=Ys(a);return E.render(Hi.createElement(t,{config:n})),qr[n.elementId]={root:E,destroy:()=>{E.unmount(),or=null,ct&&(ct.innerHTML=""),delete qr[n.elementId]},getConversationId:()=>pd(),setIsOpen:u=>{ul=u,l&&l(u)},updateConfig:u=>{Ne=dl(ae(ae({},Ne),u)),d&&d(u)},setPosition:u=>{eo=to(eo,u),Ne=dl(to(Ne||{},u)),m&&m(u),d&&d(u)},hide:()=>x&&x(),show:()=>R&&R(),injectCSS:u=>{if(!ct)return;let C=ct.querySelector("style[data-custom]");C&&C.remove(),C=document.createElement("style"),C.setAttribute("data-custom","true"),C.textContent=u,ct.appendChild(C)},removeCustomCSS:()=>{if(!ct)return;const u=ct.querySelector("style[data-custom]");u&&u.remove()},getIsOpen:()=>y?y():ul},or=qr[n.elementId],or}catch(t){return console.error("WebChat: Failed to initialize",t),null}},Td={initialize:Od},Ad={initialize:Rd};typeof window!="undefined"&&(window.WebChat=Td,window.EmbedChat=Ad,window.openWebChat=()=>{const e=Gt();e&&e.setIsOpen(!0)},window.closeWebChat=()=>{const e=Gt();e&&e.setIsOpen(!1)},window.toggleWebChat=()=>{const e=Gt();e&&e.setIsOpen&&e.getIsOpen&&e.setIsOpen(!e.getIsOpen())},window.unmountWebChat=()=>{const e=qr["webchat-notchatbot"];e&&e.destroy()},window.mountWebChat=()=>{Gt()},window.setWebChatPosition=e=>{const t=Gt();if(!t||!t.setPosition)return;let n={};if(e.mobile||e.desktop)n=to({},e);else if(e.device==="mobile"||e.device==="desktop"){const r=e.device;n[r]=ae(ae({},Ne&&typeof Ne[r]=="object"?Ne[r]:{}),e),n[r]&&typeof n[r]=="object"&&"device"in n[r]&&delete n[r].device}else n=ae({},e);Ne=dl(to(Ne||{},n)),eo=to(eo,n),t.setPosition(n)},window.hideWebChat=()=>{const e=Gt();e&&e.hide&&e.hide()},window.showWebChat=()=>{const e=Gt();e&&e.show&&e.show()},window.injectWebChatCSS=e=>{if(Gt(),ct){let t=ct.querySelector("style[data-custom]");t&&t.remove(),t=document.createElement("style"),t.setAttribute("data-custom","true"),t.textContent=e,ct.appendChild(t)}},window.removeWebChatCSS=()=>{if(Gt(),ct){const e=ct.querySelector("style[data-custom]");e&&e.remove()}},window.unmountEmbedChat=e=>{const t=Pi[e];t&&t.destroy()},window.mountEmbedChat=e=>{const t=cl[e];t?Rd(t):console.warn(`No config found for EmbedChat with elementId: ${e}`)},window.addEventListener("openWebChatbot",()=>window.openWebChat()),window.addEventListener("closeWebChatbot",()=>window.closeWebChat()),window.addEventListener("toggleWebChatbot",()=>window.toggleWebChat()),window.addEventListener("addCustomPadding",e=>{if(e&&e.detail){let t={};if(typeof e.detail=="object")if(e.detail.mobile||e.detail.desktop)t=ae({},e.detail);else if(e.detail.device==="mobile"||e.detail.device==="desktop"){const n=e.detail.device;t[n]=ae(ae({},Ne&&typeof Ne[n]=="object"?Ne[n]:{}),e.detail),t[n]&&typeof t[n]=="object"&&"device"in t[n]&&delete t[n].device}else("y"in e.detail||"marginBottom"in e.detail)&&(t={},"y"in e.detail&&(t.marginBottom=parseInt(e.detail.y,10)),"x"in e.detail&&(t.marginSide=parseInt(e.detail.x,10)),"marginBottom"in e.detail&&(t.marginBottom=parseInt(e.detail.marginBottom,10)),"marginSide"in e.detail&&(t.marginSide=parseInt(e.detail.marginSide,10)));window.setWebChatPosition(t)}}),setTimeout(()=>{const e=new CustomEvent("WebChatReady",{bubbles:!0});document.dispatchEvent(e)},0),setTimeout(()=>{const e=new CustomEvent("EmbedChatReady",{bubbles:!0});document.dispatchEvent(e)},0));const gm=()=>{const e=new CustomEvent("WebChatReady",{bubbles:!0});document.dispatchEvent(e)},Id=()=>{const e=new CustomEvent("EmbedChatReady",{bubbles:!0});document.dispatchEvent(e)},Pd=()=>{gm(),Id()},fl=()=>{requestAnimationFrame(()=>{setTimeout(()=>{Id()},0)})};document.readyState==="loading"?document.addEventListener("DOMContentLoaded",Pd):setTimeout(Pd,0),function(e){const t=e.pushState,n=e.replaceState;e.pushState=function(...r){const o=t.apply(e,r);return window.dispatchEvent(new Event("routechange")),o},e.replaceState=function(...r){const o=n.apply(e,r);return window.dispatchEvent(new Event("routechange")),o}}(window.history),window.addEventListener("popstate",fl),window.addEventListener("hashchange",fl),window.addEventListener("routechange",fl);function to(e,t){if(!t)return e;const n=ae({},e);for(const r of Object.keys(t))r==="mobile"||r==="desktop"?n[r]=ae(ae({},e[r]||{}),t[r]):n[r]=t[r];return n}function dl(e){const t=typeof e.elementId=="string"&&e.elementId?e.elementId:"webchat-notchatbot",o=e,{elementId:n}=o,r=vl(o,["elementId"]);return ae({elementId:t},r)}pe.EmbedChatAPI=Ad,pe.WebChat=Td,Object.defineProperty(pe,Symbol.toStringTag,{value:"Module"})});
|
|
149
|
+
También puedes pedir hablar con nuestro equipo de los sueños!`,Cd=e=>({id:ut(),text:lm(e),sender:"bot",timestamp:new Date().toISOString(),type:"text"}),kd=()=>typeof window!="undefined"&&window.innerWidth<640,um=({config:e,exposeControl:t})=>{if(!e.apiKey)return null;const[n,r]=Z.useState(()=>Ti(e)),[o,i]=Z.useState(!1),[a,l]=Z.useState(()=>kd()),[d,m]=Z.useState(""),[x,R]=Z.useState(!1),[y,E]=Z.useState(!1),[u,C]=Z.useState(!1),[P,b]=Z.useState(""),[,p]=Z.useState(null),g=Z.useRef(null),[S,h]=Z.useState(!1),[f,c]=Z.useState(!1),[s,w]=Z.useState(""),[v,k]=Z.useState(!0),[L,N]=Z.useState(!1),I=Z.useRef(!0);Z.useEffect(()=>{if(I.current){I.current=!1;return}if(typeof window!="undefined"){const ee=o?"notchatbot-webchat-open":"notchatbot-webchat-closed";window.dispatchEvent(new CustomEvent(ee,{detail:{conversationId:d}}))}},[o,d]);const[O,A]=Z.useState([e.initialMessage?{id:ut(),text:e.initialMessage,sender:"bot",timestamp:new Date().toISOString(),type:"text"}:Cd(e.title)]),T=Z.useCallback((ee,Y="bot")=>{if(A(le=>[...le,ee]),!o&&(ee.sender==="bot"||Y==="bot")&&ee.id!==s&&h(!0),typeof window!="undefined"&&(Y==="bot"||Y==="ably")){const le=Y==="bot"?"assistant":"employee";window.dispatchEvent(new CustomEvent("notchatbot-webchat-message-received",{detail:{message:ee,role:le}}))}},[o,s]);Z.useEffect(()=>{const ee=()=>{const Y=kd();l(Y)};return window.addEventListener("resize",ee),()=>window.removeEventListener("resize",ee)},[]),Z.useEffect(()=>em(()=>{r(Ti(e))}),[e]),Z.useEffect(()=>{r(Ti(e))},[e]),Z.useEffect(()=>{De(this,null,function*(){const Y=pd();m(Y);const le=yield md();b(le)})},[]),Z.useEffect(()=>{if(O.length>0){const ee=O[O.length-1];ee.sender==="bot"&&w(ee.id)}},[]);const j=Z.useCallback(ee=>{T(ee,"ably")},[T]),B=Z.useCallback(ee=>{k(ee)},[]),z=Z.useCallback(ee=>De(this,null,function*(){if(!(f||g.current))try{if(ee.tokenDetails){const Y=yield Ai(ee.tokenDetails,e.apiKey||"",d,j,B);p(Y),g.current=Y.client,c(!0)}}catch(Y){console.error("[❌ ABLY SETUP ERROR from history]",Y)}}),[f,d,j]),$=Z.useCallback(()=>De(this,null,function*(){if(!(f||g.current))try{const ee=yield sm(d,e.apiKey||"");if(ee!=null&&ee.tokenDetails){const Y=yield Ai(ee.tokenDetails,e.apiKey||"",d,j,B);p(Y),g.current=Y.client,c(!0)}}catch(ee){console.error("[❌ ABLY SETUP ERROR from endpoint]",ee)}}),[f,d,e.apiKey,j]),V=Z.useCallback(()=>De(this,null,function*(){var Y,le;const ee=o;if(i(se=>!se),!ee){h(!1);const se=O.filter(ke=>ke.sender==="bot").slice(-1)[0];se&&w(se.id)}if(!ee&&!x&&d&&gd()&&!f){E(!0);const se=yield nm(d,e.apiKey||"");if(((le=(Y=se==null?void 0:se.conversation)==null?void 0:Y.messages)==null?void 0:le.length)>0){const ke=rm(se.conversation.messages);A(ke),se.conversation.chatbotActivated!==void 0&&k(se.conversation.chatbotActivated),se.conversation.isRated!==void 0&&N(se.conversation.isRated);const ce=ke.filter(xe=>xe.sender==="bot").slice(-1)[0];ce&&w(ce.id),yield z(se)}else console.warn("WebChat: No conversation history found, showing initial message");E(!1),R(!0)}else!ee&&gd()&&!f&&(yield $())}),[o,d,x,f,e.apiKey,z,$,O]),G=Z.useCallback(()=>{i(!1)},[]),M=Z.useCallback((ee,Y)=>De(this,null,function*(){const le=new Date().toISOString(),se=[],ke=[...O];if(ee.trim()){const ce={id:ut(),text:ee,sender:"user",timestamp:le,type:"text"};se.push(ce),ke.push(ce)}if(Y&&Y.length>0){const ce=Y.map(xe=>({id:ut(),text:xe.type.startsWith("image/")?``:`[${xe.name}](${xe.url})`,sender:"user",timestamp:le,type:xe.type.startsWith("image/")?"image":"file",metaContent:xe.url}));se.push(...ce),ke.push(...ce)}A(ce=>[...ce,...se]),typeof window!="undefined"&&se.length>0&&window.dispatchEvent(new CustomEvent("notchatbot-webchat-message-sent",{detail:{messages:se}})),C(!0);try{const ce=bd(d,ke,se,{apiKey:e.apiKey||""},P),xe=yield xd(ce);if(xe){if(xe.response.tokenDetails&&!g.current){const tt=yield Ai(xe.response.tokenDetails,e.apiKey||"",d,j,B);p(tt),g.current=tt.client,c(!0)}const Wt=Sd(xe.response.message);Wt&&T(Wt,"bot")}else{setTimeout(()=>{const Wt=Ii();T(Wt,"bot"),C(!1)},1e3);return}}catch(ce){console.error("WebChat: Error in message handling:",ce),setTimeout(()=>{const xe=Ii();T(xe,"bot"),C(!1)},1e3);return}C(!1),Zg(!0)}),[d,O,e.apiKey,P,j,T]),D=tm(n);Z.useEffect(()=>()=>{wd(g.current),g.current=null},[]);const U=Z.useCallback(ee=>i(ee),[]),_=Z.useCallback(ee=>r(Y=>ae(ae({},Y),ee)),[]),W=Z.useCallback(ee=>r(Y=>ae(ae({},Y),ee)),[]),[X,q]=Z.useState(!1),re=Z.useCallback(()=>q(!0),[]),ie=Z.useCallback(()=>q(!1),[]);return Z.useEffect(()=>{t&&t({setIsOpen:U,updateConfig:_,setPosition:W,hide:re,show:ie})},[t,U,_,W,re,ie]),F.jsxs("div",{className:"nbc-font-sans",style:{zIndex:2147483647,display:X?"none":void 0},children:[D.showPopup!==!1&&F.jsx(Yg,{initialMessage:e.initialMessage,avatar:n.avatar,position:D.position,marginBottom:D.marginBottom,marginSide:D.marginSide,primaryColor:n.primaryColor||"#007bff",isMobile:a,isOpen:o,onPopoverClick:V}),F.jsx(tg,{isOpen:o,onClick:V,primaryColor:n.primaryColor,position:D.position,marginBottom:D.marginBottom,marginSide:D.marginSide,hasNewMessages:S,isMobile:a}),F.jsx(Qg,{isOpen:o,onClose:G,config:n,messages:O,onSendMessage:M,isLoading:y,isAiTyping:u,position:D.position,marginBottom:D.marginBottom,marginSide:D.marginSide,isMobile:a,apiKeyMissing:!e.apiKey,chatbotActivated:v,isRated:L,onRatingChange:N,conversationId:d})]})},Ed='*,:before,:after{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }*,:before,:after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb}:before,:after{--tw-content: ""}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}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;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;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}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=until-found])){display:none}.nbc-pointer-events-none{pointer-events:none}.nbc-pointer-events-auto{pointer-events:auto}.nbc-fixed{position:fixed}.nbc-absolute{position:absolute}.nbc-relative{position:relative}.nbc-inset-0{inset:0}.nbc-inset-auto{inset:auto}.nbc-left-2{left:8px}.nbc-right-0{right:0}.nbc-right-2{right:8px}.nbc-top-0{top:0}.nbc-top-1\\/2{top:50%}.nbc-top-2{top:8px}.nbc-top-full{top:100%}.nbc-m-0{margin:0}.nbc-mx-auto{margin-left:auto;margin-right:auto}.nbc-mb-1{margin-bottom:4px}.nbc-mb-2{margin-bottom:8px}.nbc-mb-4{margin-bottom:16px}.nbc-ml-1{margin-left:4px}.nbc-ml-2{margin-left:8px}.nbc-mr-1{margin-right:4px}.nbc-mr-3{margin-right:12px}.nbc-mt-1{margin-top:4px}.nbc-line-clamp-2{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}.nbc-flex{display:flex}.nbc-hidden{display:none}.nbc-h-0{height:0px}.nbc-h-10{height:40px}.nbc-h-12{height:48px}.nbc-h-16{height:64px}.nbc-h-2{height:8px}.nbc-h-24{height:96px}.nbc-h-3{height:12px}.nbc-h-4{height:16px}.nbc-h-5{height:20px}.nbc-h-6{height:24px}.nbc-h-7{height:28px}.nbc-h-8{height:32px}.nbc-h-auto{height:auto}.nbc-h-full{height:100%}.nbc-min-h-0{min-height:0px}.nbc-min-h-\\[220px\\]{min-height:220px}.nbc-w-0{width:0px}.nbc-w-10{width:40px}.nbc-w-12{width:48px}.nbc-w-16{width:64px}.nbc-w-2{width:8px}.nbc-w-3{width:12px}.nbc-w-4{width:16px}.nbc-w-5{width:20px}.nbc-w-6{width:24px}.nbc-w-7{width:28px}.nbc-w-8{width:32px}.nbc-w-auto{width:auto}.nbc-w-full{width:100%}.nbc-max-w-20{max-width:80px}.nbc-max-w-\\[90\\%\\]{max-width:90%}.nbc-max-w-xs{max-width:20rem}.nbc-flex-1{flex:1 1 0%}.nbc-flex-shrink-0{flex-shrink:0}.-nbc-translate-y-4{--tw-translate-y: -16px;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.nbc--translate-y-1\\/2{--tw-translate-y: -50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.nbc-translate-y-0{--tw-translate-y: 0px;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.nbc-translate-y-2{--tw-translate-y: 8px;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.nbc-translate-y-3{--tw-translate-y: 12px;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.nbc-translate-y-4{--tw-translate-y: 16px;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.nbc-translate-y-\\[-10px\\]{--tw-translate-y: -10px;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.nbc-rotate-180{--tw-rotate: 180deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.nbc-scale-100{--tw-scale-x: 1;--tw-scale-y: 1;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.nbc-scale-90{--tw-scale-x: .9;--tw-scale-y: .9;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.nbc-scale-95{--tw-scale-x: .95;--tw-scale-y: .95;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.nbc-scale-\\[1\\.13\\]{--tw-scale-x: 1.13;--tw-scale-y: 1.13;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.nbc-transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}@keyframes nbc-bounce{0%,to{transform:translateY(-25%);animation-timing-function:cubic-bezier(.8,0,1,1)}50%{transform:none;animation-timing-function:cubic-bezier(0,0,.2,1)}}.nbc-animate-bounce{animation:nbc-bounce 1s infinite}@keyframes nbc-ping{75%,to{transform:scale(2);opacity:0}}.nbc-animate-ping{animation:nbc-ping 1s cubic-bezier(0,0,.2,1) infinite}@keyframes nbc-pulse{50%{opacity:.5}}.nbc-animate-pulse{animation:nbc-pulse 2s cubic-bezier(.4,0,.6,1) infinite}@keyframes nbc-spin{to{transform:rotate(360deg)}}.nbc-animate-spin{animation:nbc-spin 1s linear infinite}.nbc-cursor-pointer{cursor:pointer}.nbc-flex-col{flex-direction:column}.nbc-flex-wrap{flex-wrap:wrap}.nbc-items-start{align-items:flex-start}.nbc-items-end{align-items:flex-end}.nbc-items-center{align-items:center}.nbc-justify-start{justify-content:flex-start}.nbc-justify-end{justify-content:flex-end}.nbc-justify-center{justify-content:center}.nbc-justify-between{justify-content:space-between}.nbc-gap-2{gap:8px}.nbc-space-x-1>:not([hidden])~:not([hidden]){--tw-space-x-reverse: 0;margin-right:calc(4px * var(--tw-space-x-reverse));margin-left:calc(4px * calc(1 - var(--tw-space-x-reverse)))}.nbc-space-x-3>:not([hidden])~:not([hidden]){--tw-space-x-reverse: 0;margin-right:calc(12px * var(--tw-space-x-reverse));margin-left:calc(12px * calc(1 - var(--tw-space-x-reverse)))}.nbc-space-y-2>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(8px * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(8px * var(--tw-space-y-reverse))}.nbc-space-y-4>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(16px * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(16px * var(--tw-space-y-reverse))}.nbc-overflow-hidden{overflow:hidden}.nbc-overflow-y-auto{overflow-y:auto}.nbc-truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.nbc-whitespace-nowrap{white-space:nowrap}.nbc-break-words{overflow-wrap:break-word}.nbc-rounded{border-radius:4px}.nbc-rounded-2xl{border-radius:16px}.nbc-rounded-full{border-radius:9999px}.nbc-rounded-lg{border-radius:8px}.nbc-rounded-none{border-radius:0}.nbc-rounded-bl-md{border-bottom-left-radius:6px}.nbc-rounded-br-md{border-bottom-right-radius:6px}.nbc-border{border-width:1px}.nbc-border-0{border-width:0px}.nbc-border-2{border-width:2px}.nbc-border-b{border-bottom-width:1px}.nbc-border-t{border-top-width:1px}.nbc-border-none{border-style:none}.nbc-border-gray-100{--tw-border-opacity: 1;border-color:rgb(243 244 246 / var(--tw-border-opacity, 1))}.nbc-border-gray-300{--tw-border-opacity: 1;border-color:rgb(209 213 219 / var(--tw-border-opacity, 1))}.nbc-border-white{--tw-border-opacity: 1;border-color:rgb(255 255 255 / var(--tw-border-opacity, 1))}.nbc-border-t-gray-600{--tw-border-opacity: 1;border-top-color:rgb(75 85 99 / var(--tw-border-opacity, 1))}.nbc-bg-blue-500{--tw-bg-opacity: 1;background-color:rgb(59 130 246 / var(--tw-bg-opacity, 1))}.nbc-bg-gray-100{--tw-bg-opacity: 1;background-color:rgb(243 244 246 / var(--tw-bg-opacity, 1))}.nbc-bg-gray-200{--tw-bg-opacity: 1;background-color:rgb(229 231 235 / var(--tw-bg-opacity, 1))}.nbc-bg-gray-300{--tw-bg-opacity: 1;background-color:rgb(209 213 219 / var(--tw-bg-opacity, 1))}.nbc-bg-gray-400{--tw-bg-opacity: 1;background-color:rgb(156 163 175 / var(--tw-bg-opacity, 1))}.nbc-bg-gray-50{--tw-bg-opacity: 1;background-color:rgb(249 250 251 / var(--tw-bg-opacity, 1))}.nbc-bg-green-400{--tw-bg-opacity: 1;background-color:rgb(74 222 128 / var(--tw-bg-opacity, 1))}.nbc-bg-green-500{--tw-bg-opacity: 1;background-color:rgb(34 197 94 / var(--tw-bg-opacity, 1))}.nbc-bg-transparent{background-color:transparent}.nbc-bg-white{--tw-bg-opacity: 1;background-color:rgb(255 255 255 / var(--tw-bg-opacity, 1))}.nbc-bg-none{background-image:none}.nbc-object-cover{-o-object-fit:cover;object-fit:cover}.nbc-p-0{padding:0}.nbc-p-1{padding:4px}.nbc-p-2{padding:8px}.nbc-p-4{padding:16px}.nbc-p-5{padding:20px}.nbc-px-2{padding-left:8px;padding-right:8px}.nbc-px-4{padding-left:16px;padding-right:16px}.nbc-py-1{padding-top:4px;padding-bottom:4px}.nbc-py-2{padding-top:8px;padding-bottom:8px}.nbc-py-3{padding-top:12px;padding-bottom:12px}.nbc-pl-12{padding-left:48px}.nbc-pr-12{padding-right:48px}.nbc-pt-4{padding-top:16px}.nbc-text-center{text-align:center}.nbc-text-right{text-align:right}.nbc-font-sans{font-family:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji"}.nbc-text-\\[15px\\]{font-size:15px}.nbc-text-lg{font-size:18px}.nbc-text-sm{font-size:14px}.nbc-text-xs{font-size:12px}.nbc-font-bold{font-weight:700}.nbc-font-medium{font-weight:500}.nbc-italic{font-style:italic}.nbc-leading-none{line-height:1}.nbc-leading-relaxed{line-height:1.625}.nbc-text-black{--tw-text-opacity: 1;color:rgb(0 0 0 / var(--tw-text-opacity, 1))}.nbc-text-blue-400{--tw-text-opacity: 1;color:rgb(96 165 250 / var(--tw-text-opacity, 1))}.nbc-text-blue-500{--tw-text-opacity: 1;color:rgb(59 130 246 / var(--tw-text-opacity, 1))}.nbc-text-gray-400{--tw-text-opacity: 1;color:rgb(156 163 175 / var(--tw-text-opacity, 1))}.nbc-text-gray-500{--tw-text-opacity: 1;color:rgb(107 114 128 / var(--tw-text-opacity, 1))}.nbc-text-gray-600{--tw-text-opacity: 1;color:rgb(75 85 99 / var(--tw-text-opacity, 1))}.nbc-text-gray-700{--tw-text-opacity: 1;color:rgb(55 65 81 / var(--tw-text-opacity, 1))}.nbc-text-gray-800{--tw-text-opacity: 1;color:rgb(31 41 55 / var(--tw-text-opacity, 1))}.nbc-text-gray-900{--tw-text-opacity: 1;color:rgb(17 24 39 / var(--tw-text-opacity, 1))}.nbc-text-white{--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity, 1))}.nbc-no-underline{text-decoration-line:none}.nbc-opacity-0{opacity:0}.nbc-opacity-100{opacity:1}.nbc-opacity-50{opacity:.5}.nbc-opacity-70{opacity:.7}.nbc-opacity-75{opacity:.75}.nbc-shadow-2xl{--tw-shadow: 0 25px 50px -12px rgb(0 0 0 / .25);--tw-shadow-colored: 0 25px 50px -12px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.nbc-shadow-lg{--tw-shadow: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.nbc-shadow-md{--tw-shadow: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.nbc-shadow-none{--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.nbc-shadow-sm{--tw-shadow: 0 1px 2px 0 rgb(0 0 0 / .05);--tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.nbc-shadow-xl{--tw-shadow: 0 20px 25px -5px rgb(0 0 0 / .1), 0 8px 10px -6px rgb(0 0 0 / .1);--tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.nbc-outline-none{outline:2px solid transparent;outline-offset:2px}.nbc-transition-all{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.nbc-transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.nbc-transition-transform{transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.nbc-duration-200{transition-duration:.2s}.nbc-duration-300{transition-duration:.3s}.nbc-duration-500{transition-duration:.5s}.nbc-ease-out{transition-timing-function:cubic-bezier(0,0,.2,1)}.hover\\:nbc-scale-105:hover{--tw-scale-x: 1.05;--tw-scale-y: 1.05;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.hover\\:nbc-scale-\\[1\\.02\\]:hover{--tw-scale-x: 1.02;--tw-scale-y: 1.02;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.hover\\:nbc-bg-black:hover{--tw-bg-opacity: 1;background-color:rgb(0 0 0 / var(--tw-bg-opacity, 1))}.hover\\:nbc-bg-gray-100:hover{--tw-bg-opacity: 1;background-color:rgb(243 244 246 / var(--tw-bg-opacity, 1))}.hover\\:nbc-bg-opacity-20:hover{--tw-bg-opacity: .2}.hover\\:nbc-text-gray-600:hover{--tw-text-opacity: 1;color:rgb(75 85 99 / var(--tw-text-opacity, 1))}.hover\\:nbc-text-gray-700:hover{--tw-text-opacity: 1;color:rgb(55 65 81 / var(--tw-text-opacity, 1))}.disabled\\:nbc-cursor-not-allowed:disabled{cursor:not-allowed}.disabled\\:nbc-opacity-50:disabled{opacity:.5}',cm={apiKey:"",primaryColor:"#111111",avatar:"",title:"NotChatBot",placeholder:"Escribe tu mensaje...",initialMessage:"¡Hola! ¿En qué puedo ayudarte?",position:"bottom-right",marginBottom:20,marginSide:20,showPopup:!0,mobile:{position:"bottom-right",marginBottom:15,marginSide:15,showPopup:!0},desktop:{position:"bottom-right",marginBottom:25,marginSide:25,showPopup:!0},closeButtonIcon:"default",closeButtonText:"Cerrar",closeButtonCustomIcon:""},fm=({title:e,primaryColor:t="#3b82f6",avatar:n})=>{const r={backgroundColor:t};return F.jsxs("div",{id:"notchatbot-embed-chat-header",style:r,className:"nbc-flex nbc-items-center nbc-p-4",children:[F.jsx("div",{className:"nbc-flex nbc-items-center nbc-mr-3 nbc-text-black",children:n?F.jsx("img",{src:n,alt:"Avatar",className:"nbc-w-8 nbc-h-8 nbc-rounded-full nbc-object-cover"}):F.jsxs("svg",{xmlns:"http://www.w3.org/2000/svg",width:"40",height:"40",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",className:"nbc-w-8 nbc-h-8 nbc-bg-white nbc-rounded-full nbc-p-1",children:[F.jsx("path",{d:"M12 6V2H8"}),F.jsx("path",{d:"m8 18-4 4V8a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2Z"}),F.jsx("path",{d:"M2 12h2"}),F.jsx("path",{d:"M9 11v2"}),F.jsx("path",{d:"M15 11v2"}),F.jsx("path",{d:"M20 12h2"})]})}),F.jsx("h3",{className:"nbc-m-0 nbc-text-lg nbc-font-bold nbc-text-white",children:e})]})},dm=({footerText:e,primaryColor:t,footerColor:n})=>{if(!e)return null;const r=o=>{const i=/(https?:\/\/[^\s]+)/g;return o.split(i).map((l,d)=>i.test(l)?F.jsx("a",{href:l,target:"_blank",rel:"noopener noreferrer",className:"nbc-font-medium nbc-no-underline",style:{color:t},children:l},d):l)};return F.jsx("div",{id:"notchatbot-embed-chat-footer",className:"nbc-py-3 nbc-px-4 nbc-bg-gray-50 nbc-text-xs nbc-text-gray-600 nbc-text-center nbc-leading-relaxed nbc-italic",style:{backgroundColor:n},children:r(e)})},hm=({config:e,messages:t,onSendMessage:n,isLoading:r,isAiTyping:o,chatbotActivated:i=!0})=>{var d;const a=(m,x="auto")=>m===void 0?x:typeof m=="number"?`${m}px`:m,l={width:a(e.width,"100%"),height:a(e.height,"400px"),maxWidth:a(e.maxWidth,"100%"),maxHeight:a(e.maxHeight,"100vh"),minWidth:a(e.minWidth,"280px"),minHeight:a(e.minHeight,"300px"),display:"flex",flexDirection:"column",backgroundColor:e.chatTransparent?"transparent":e.chatBackground||"#ffffff",borderRadius:a(e.borderRadius,"0px"),border:e.border||"1px solid #e5e7eb",boxShadow:e.boxShadow||"0 10px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04)",overflow:"hidden",position:"relative"};return F.jsxs("div",{id:"notchatbot-embed-chat",className:"nbc-font-sans",style:l,children:[e.showHeader!==!1&&F.jsx(fm,{title:e.title||"Chat",primaryColor:e.primaryColor,avatar:e.avatar}),F.jsxs("div",{id:"notchatbot-embed-chat-body",className:"nbc-flex-1 nbc-flex nbc-flex-col nbc-min-h-0",style:{position:"relative",overflow:"hidden"},children:[r?F.jsx("div",{className:"nbc-flex-1 nbc-p-4",children:F.jsx(ld,{})}):F.jsx(od,{messages:t,isTyping:o||!1,avatar:e.avatar,textColor:e.textColor,bubbleUserColor:e.bubbleUserColor,chatbotActivated:i}),F.jsx("div",{id:"notchatbot-embed-chat-body-input",className:"nbc-py-2 nbc-bg-gray-50 nbc-border-none",style:{backgroundColor:(d=e.input)==null?void 0:d.backgroundColor},children:F.jsx(sd,{onSendMessage:n,placeholder:e.placeholder||"Escribe un mensaje...",primaryColor:e.primaryColor,disabled:r,input:e.input,apiKey:e.apiKey})})]}),e.showFooter!==!1&&e.footerText&&F.jsx(dm,{footerText:e.footerText,primaryColor:e.primaryColor,footerColor:e.footerColor})]})},pm=({config:e})=>{if(!e.apiKey)return null;const[t,n]=Z.useState(""),[r,o]=Z.useState(!1),[i,a]=Z.useState(""),[,l]=Z.useState(null),d=Z.useRef(null),[,m]=Z.useState(!1),[x,R]=Z.useState(!0),[y,E]=Z.useState([e.initialMessage?{id:ut(),text:e.initialMessage,sender:"bot",timestamp:new Date().toISOString(),type:"text"}:Cd(e.title)]),u=Z.useCallback(p=>{E(g=>[...g,p])},[]);Z.useEffect(()=>{De(this,null,function*(){const g=yield md();a(g)})},[]);const C=Z.useCallback(p=>{u(p),typeof window!="undefined"&&window.dispatchEvent(new CustomEvent("notchatbot-embedchat-message-received",{detail:{message:p,role:"employee"}}))},[u]),P=Z.useCallback(p=>{R(p)},[]),b=Z.useCallback((p,g)=>De(this,null,function*(){if(!p.trim()&&(!g||g.length===0))return;let S=t;S||(S=ut(),n(S));const h=new Date().toISOString(),f=[...y],c=[];if(p.trim()){const s={id:ut(),text:p,sender:"user",timestamp:h,conversationId:S,type:"text"};u(s),typeof window!="undefined"&&window.dispatchEvent(new CustomEvent("notchatbot-embedchat-message-sent",{detail:{message:s}})),f.push(s),c.push(s)}if(g&&g.length>0){const s=g.map(w=>({id:ut(),text:w.type.startsWith("image/")?``:`[${w.name}](${w.url})`,sender:"user",timestamp:h,conversationId:S,type:w.type.startsWith("image/")?"image":"file",metaContent:w.url}));s.forEach(w=>{u(w),typeof window!="undefined"&&window.dispatchEvent(new CustomEvent("notchatbot-embedchat-message-sent",{detail:{message:w}})),c.push(w)}),f.push(...s)}o(!0);try{const s=bd(S,f,c,{apiKey:e.apiKey||""},i),w=yield xd(s);if(w){if(w.response.tokenDetails&&!d.current){const k=yield Ai(w.response.tokenDetails,e.apiKey||"",S,C,P);l(k),d.current=k.client,m(!0)}const v=Sd(w.response.message);v&&(u(v),typeof window!="undefined"&&window.dispatchEvent(new CustomEvent("notchatbot-embedchat-message-received",{detail:{message:v,role:"assistant"}})))}else{setTimeout(()=>{const v=Ii();u(v),o(!1)},1e3);return}o(!1)}catch(s){console.error("EmbedChat: Error sending message:",s),setTimeout(()=>{const w=Ii();u(w),o(!1)},1e3);return}}),[t,i,e.apiKey,u,C,y]);return Z.useEffect(()=>()=>{d.current&&wd(d.current)},[]),F.jsx(hm,{config:e,messages:y,onSendMessage:b,isLoading:!1,isAiTyping:r,chatbotActivated:x})};(()=>{if(typeof document=="undefined")return;const e={},t=document.dispatchEvent.bind(document);document.dispatchEvent=r=>{const o=r==null?void 0:r.type;return(o==="WebChatReady"||o==="EmbedChatReady")&&(e[o]=!0),t(r)};const n=document.addEventListener.bind(document);document.addEventListener=(r,o,i)=>{const a=r;if((a==="WebChatReady"||a==="EmbedChatReady")&&e[a]){const l=new CustomEvent(a);setTimeout(()=>{typeof o=="function"?o.call(document,l):o&&typeof o.handleEvent=="function"&&o.handleEvent(l)},0)}return n(r,o,i)}})();let or=null;const qr={},Pi={};let ct=null,Ne=null,ul=!1,eo={};const cl={},Rd=e=>{try{if(!e.elementId)return console.error("EmbedChat: elementId is required"),null;const t=document.getElementById(e.elementId);if(!t)return null;let n;t.shadowRoot?(n=t.shadowRoot,n.innerHTML=""):n=t.attachShadow({mode:"open"});const r=document.createElement("style");if(r.textContent=Ed,n.appendChild(r),e.customCSS){const a=document.createElement("style");a.setAttribute("data-custom","true"),a.textContent=e.customCSS,n.appendChild(a)}const o=document.createElement("div");n.appendChild(o);const i=Ys(o);return i.render(Hi.createElement(pm,{config:e})),Pi[e.elementId]={destroy:()=>{i.unmount(),n.innerHTML="",delete Pi[e.elementId],cl[e.elementId]=e}},cl[e.elementId]=e,Pi[e.elementId]}catch(t){return console.error("EmbedChat: Failed to initialize",t),null}};function Gt(){let e=qr["webchat-notchatbot"];if(!e){const n=ae(ae({},Ne),eo);let r="webchat-notchatbot";typeof(Ne==null?void 0:Ne.elementId)=="string"&&Ne.elementId&&(r=Ne.elementId);const t=n,{elementId:o}=t,i=vl(t,["elementId"]);"elementId"in i&&delete i.elementId;const a=Object.assign({elementId:r},i);e=Od(a),ul&&e&&e.setIsOpen&&e.setIsOpen(!0);const l=new CustomEvent("WebChatReady");document.dispatchEvent(l)}return e}const Od=e=>{try{let t=function(u){return Hi.createElement(um,We(ae({},u),{exposeControl:C=>{l=C.setIsOpen,d=C.updateConfig,m=C.setPosition,x=C.hide,R=C.show,y=C.getIsOpen}}))};or&&(or.destroy(),or=null);const n=ae(ae({elementId:"webchat-notchatbot"},cm),e);Ne=n;let r=document.getElementById(n.elementId);r||(r=document.createElement("div"),r.id=n.elementId,document.body.appendChild(r));let o;r.shadowRoot?(o=r.shadowRoot,o.innerHTML=""):o=r.attachShadow({mode:"open"}),ct=o;const i=document.createElement("style");i.textContent=Ed,o.appendChild(i);const a=document.createElement("div");o.appendChild(a);let l=null,d=null,m=null,x=null,R=null,y=null;const E=Ys(a);return E.render(Hi.createElement(t,{config:n})),qr[n.elementId]={root:E,destroy:()=>{E.unmount(),or=null,ct&&(ct.innerHTML=""),delete qr[n.elementId]},getConversationId:()=>pd(),setIsOpen:u=>{ul=u,l&&l(u)},updateConfig:u=>{Ne=dl(ae(ae({},Ne),u)),d&&d(u)},setPosition:u=>{eo=to(eo,u),Ne=dl(to(Ne||{},u)),m&&m(u),d&&d(u)},hide:()=>x&&x(),show:()=>R&&R(),injectCSS:u=>{if(!ct)return;let C=ct.querySelector("style[data-custom]");C&&C.remove(),C=document.createElement("style"),C.setAttribute("data-custom","true"),C.textContent=u,ct.appendChild(C)},removeCustomCSS:()=>{if(!ct)return;const u=ct.querySelector("style[data-custom]");u&&u.remove()},getIsOpen:()=>y?y():ul},or=qr[n.elementId],or}catch(t){return console.error("WebChat: Failed to initialize",t),null}},Td={initialize:Od},Ad={initialize:Rd};typeof window!="undefined"&&(window.WebChat=Td,window.EmbedChat=Ad,window.openWebChat=()=>{const e=Gt();e&&e.setIsOpen(!0)},window.closeWebChat=()=>{const e=Gt();e&&e.setIsOpen(!1)},window.toggleWebChat=()=>{const e=Gt();e&&e.setIsOpen&&e.getIsOpen&&e.setIsOpen(!e.getIsOpen())},window.unmountWebChat=()=>{const e=qr["webchat-notchatbot"];e&&e.destroy()},window.mountWebChat=()=>{Gt()},window.setWebChatPosition=e=>{const t=Gt();if(!t||!t.setPosition)return;let n={};if(e.mobile||e.desktop)n=to({},e);else if(e.device==="mobile"||e.device==="desktop"){const r=e.device;n[r]=ae(ae({},Ne&&typeof Ne[r]=="object"?Ne[r]:{}),e),n[r]&&typeof n[r]=="object"&&"device"in n[r]&&delete n[r].device}else n=ae({},e);Ne=dl(to(Ne||{},n)),eo=to(eo,n),t.setPosition(n)},window.hideWebChat=()=>{const e=Gt();e&&e.hide&&e.hide()},window.showWebChat=()=>{const e=Gt();e&&e.show&&e.show()},window.injectWebChatCSS=e=>{if(Gt(),ct){let t=ct.querySelector("style[data-custom]");t&&t.remove(),t=document.createElement("style"),t.setAttribute("data-custom","true"),t.textContent=e,ct.appendChild(t)}},window.removeWebChatCSS=()=>{if(Gt(),ct){const e=ct.querySelector("style[data-custom]");e&&e.remove()}},window.unmountEmbedChat=e=>{const t=Pi[e];t&&t.destroy()},window.mountEmbedChat=e=>{const t=cl[e];t?Rd(t):console.warn(`No config found for EmbedChat with elementId: ${e}`)},window.addEventListener("openWebChatbot",()=>window.openWebChat()),window.addEventListener("closeWebChatbot",()=>window.closeWebChat()),window.addEventListener("toggleWebChatbot",()=>window.toggleWebChat()),window.addEventListener("addCustomPadding",e=>{if(e&&e.detail){let t={};if(typeof e.detail=="object")if(e.detail.mobile||e.detail.desktop)t=ae({},e.detail);else if(e.detail.device==="mobile"||e.detail.device==="desktop"){const n=e.detail.device;t[n]=ae(ae({},Ne&&typeof Ne[n]=="object"?Ne[n]:{}),e.detail),t[n]&&typeof t[n]=="object"&&"device"in t[n]&&delete t[n].device}else("y"in e.detail||"marginBottom"in e.detail)&&(t={},"y"in e.detail&&(t.marginBottom=parseInt(e.detail.y,10)),"x"in e.detail&&(t.marginSide=parseInt(e.detail.x,10)),"marginBottom"in e.detail&&(t.marginBottom=parseInt(e.detail.marginBottom,10)),"marginSide"in e.detail&&(t.marginSide=parseInt(e.detail.marginSide,10)));window.setWebChatPosition(t)}}),setTimeout(()=>{const e=new CustomEvent("WebChatReady",{bubbles:!0});document.dispatchEvent(e)},0),setTimeout(()=>{const e=new CustomEvent("EmbedChatReady",{bubbles:!0});document.dispatchEvent(e)},0));const gm=()=>{const e=new CustomEvent("WebChatReady",{bubbles:!0});document.dispatchEvent(e)},Id=()=>{const e=new CustomEvent("EmbedChatReady",{bubbles:!0});document.dispatchEvent(e)},Pd=()=>{gm(),Id()},fl=()=>{requestAnimationFrame(()=>{setTimeout(()=>{Id()},0)})};document.readyState==="loading"?document.addEventListener("DOMContentLoaded",Pd):setTimeout(Pd,0),function(e){const t=e.pushState,n=e.replaceState;e.pushState=function(...r){const o=t.apply(e,r);return window.dispatchEvent(new Event("routechange")),o},e.replaceState=function(...r){const o=n.apply(e,r);return window.dispatchEvent(new Event("routechange")),o}}(window.history),window.addEventListener("popstate",fl),window.addEventListener("hashchange",fl),window.addEventListener("routechange",fl);function to(e,t){if(!t)return e;const n=ae({},e);for(const r of Object.keys(t))r==="mobile"||r==="desktop"?n[r]=ae(ae({},e[r]||{}),t[r]):n[r]=t[r];return n}function dl(e){const t=typeof e.elementId=="string"&&e.elementId?e.elementId:"webchat-notchatbot",o=e,{elementId:n}=o,r=vl(o,["elementId"]);return ae({elementId:t},r)}pe.EmbedChatAPI=Ad,pe.WebChat=Td,Object.defineProperty(pe,Symbol.toStringTag,{value:"Module"})});
|
package/package.json
CHANGED