nui-chatbot-pkg 1.0.27 → 1.0.28
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.d.mts +2 -1
- package/dist/index.d.ts +2 -1
- package/dist/index.js +4 -4
- package/dist/index.mjs +4 -4
- package/package.json +1 -1
package/dist/index.d.mts
CHANGED
|
@@ -85,6 +85,7 @@ type MessageBubbleProps = {
|
|
|
85
85
|
cardRegistry: CardRegistryItem[];
|
|
86
86
|
themeStyles?: React.CSSProperties;
|
|
87
87
|
theming?: ChatTheming;
|
|
88
|
+
title?: string;
|
|
88
89
|
};
|
|
89
90
|
type CustomRecord = {
|
|
90
91
|
__collectionUid?: string;
|
|
@@ -108,7 +109,7 @@ declare const ChatHeader: ({ onClose, title, theming, strapiUrl, }: {
|
|
|
108
109
|
|
|
109
110
|
declare const ChatInput: ({ input, onInputChange, onSendMessage, isLoading, theming, }: ChatInputProps) => react_jsx_runtime.JSX.Element;
|
|
110
111
|
|
|
111
|
-
declare const MessageBubble: ({ message, cardRegistry, themeStyles, theming, }: MessageBubbleProps) => react_jsx_runtime.JSX.Element;
|
|
112
|
+
declare const MessageBubble: ({ message, cardRegistry, themeStyles, theming, title, }: MessageBubbleProps) => react_jsx_runtime.JSX.Element;
|
|
112
113
|
|
|
113
114
|
declare const Suggestions: ({ strapiUrl, onSelectQuestion, variant, theming, }: SuggestionsProps) => react_jsx_runtime.JSX.Element;
|
|
114
115
|
|
package/dist/index.d.ts
CHANGED
|
@@ -85,6 +85,7 @@ type MessageBubbleProps = {
|
|
|
85
85
|
cardRegistry: CardRegistryItem[];
|
|
86
86
|
themeStyles?: React.CSSProperties;
|
|
87
87
|
theming?: ChatTheming;
|
|
88
|
+
title?: string;
|
|
88
89
|
};
|
|
89
90
|
type CustomRecord = {
|
|
90
91
|
__collectionUid?: string;
|
|
@@ -108,7 +109,7 @@ declare const ChatHeader: ({ onClose, title, theming, strapiUrl, }: {
|
|
|
108
109
|
|
|
109
110
|
declare const ChatInput: ({ input, onInputChange, onSendMessage, isLoading, theming, }: ChatInputProps) => react_jsx_runtime.JSX.Element;
|
|
110
111
|
|
|
111
|
-
declare const MessageBubble: ({ message, cardRegistry, themeStyles, theming, }: MessageBubbleProps) => react_jsx_runtime.JSX.Element;
|
|
112
|
+
declare const MessageBubble: ({ message, cardRegistry, themeStyles, theming, title, }: MessageBubbleProps) => react_jsx_runtime.JSX.Element;
|
|
112
113
|
|
|
113
114
|
declare const Suggestions: ({ strapiUrl, onSelectQuestion, variant, theming, }: SuggestionsProps) => react_jsx_runtime.JSX.Element;
|
|
114
115
|
|
package/dist/index.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
"use strict";"use client";var ge=Object.create;var j=Object.defineProperty;var ue=Object.getOwnPropertyDescriptor;var we=Object.getOwnPropertyNames;var xe=Object.getPrototypeOf,ye=Object.prototype.hasOwnProperty;var ve=(e,t)=>{for(var a in t)j(e,a,{get:t[a],enumerable:!0})},ee=(e,t,a,r)=>{if(t&&typeof t=="object"||typeof t=="function")for(let i of we(t))!ye.call(e,i)&&i!==a&&j(e,i,{get:()=>t[i],enumerable:!(r=ue(t,i))||r.enumerable});return e};var H=(e,t,a)=>(a=e!=null?ge(xe(e)):{},ee(t||!e||!e.__esModule?j(a,"default",{value:e,enumerable:!0}):a,e)),ke=e=>ee(j({},"__esModule",{value:!0}),e);var Be={};ve(Be,{ChatBot:()=>X,ChatHeader:()=>W,ChatInput:()=>G,Chatbot:()=>X,ICONS:()=>M,MessageBubble:()=>U,Suggestions:()=>q});module.exports=ke(Be);var y=require("react");var p=require("react/jsx-runtime"),M={MessageCircle:({size:e=24,className:t=""})=>(0,p.jsx)("svg",{width:e,height:e,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",className:t,children:(0,p.jsx)("path",{d:"M7.9 20A9 9 0 1 0 4 16.1L2 22Z"})}),Bot:({size:e=24,className:t=""})=>(0,p.jsx)("svg",{width:e,height:e,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",className:t,children:(0,p.jsx)("path",{d:"M12 8V4m8 4V4M4 8V4M2 11h20m-1 0v10a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V11m5 5v2m8-2v2"})}),X:({size:e=24,className:t=""})=>(0,p.jsx)("svg",{width:e,height:e,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",className:t,children:(0,p.jsx)("path",{d:"M18 6 6 18M6 6l12 12"})}),Send:({size:e=24,className:t=""})=>(0,p.jsxs)("svg",{width:e,height:e,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",className:t,children:[(0,p.jsx)("path",{d:"m22 2-7 20-4-9-9-4Z"}),(0,p.jsx)("path",{d:"M22 2 11 13"})]}),Sparkles:({size:e=24,className:t=""})=>(0,p.jsxs)("svg",{width:e,height:e,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",className:t,children:[(0,p.jsx)("path",{d:"M12 2l1.8 4.6L18 8l-4.2 1.4L12 14l-1.8-4.6L6 8l4.2-1.4L12 2z"}),(0,p.jsx)("path",{d:"M5 16l.9 2.3L8 19l-2.1.7L5 22l-.9-2.3L2 19l2.1-.7L5 16z"}),(0,p.jsx)("path",{d:"M19 14l.9 2.3L22 17l-2.1.7L19 20l-.9-2.3L16 17l2.1-.7L19 14z"})]})};var I=require("react/jsx-runtime"),Ce=({isExpanded:e,onOpen:t,theming:a})=>(0,I.jsx)("div",{onClick:t,className:`chat-floating-btn ${e?"chat-btn-hidden":"chat-btn-visible"}`,children:(0,I.jsx)("div",{className:"chat-btn-border seamless-border",children:(0,I.jsxs)("div",{className:"chat-btn-inner",children:[(0,I.jsx)("div",{className:"chat-btn-gradient",style:{background:a?.showGradient===!1?"var(--cb-primary)":"linear-gradient(135deg, var(--cb-primary)0%, var(--cb-secondary)100%)"}}),(0,I.jsx)(M.Sparkles,{size:30,className:"chat-btn-icon"})]})})}),te=Ce;var O=require("react");var B=(e,t)=>t?`${e} ${t}`:e;var f=require("react/jsx-runtime"),Ne=({onClose:e,title:t,theming:a,strapiUrl:r})=>{let[i,m]=(0,O.useState)(null);(0,O.useEffect)(()=>{if(!r)return;(async()=>{try{let o=await(await fetch(`${r}/api/faq-ai-bot/suggestion-and-logo`)).json();o?.logoUrl&&m(`${r}${o.logoUrl}`)}catch(n){console.error("Failed to fetch logo",n)}})()},[r]);let b=B("chat-header",a?.header);return(0,f.jsxs)("header",{className:b,style:a?.headerStyle,children:[(0,f.jsxs)("div",{className:"chat-header-left",children:[(0,f.jsx)("div",{className:"chat-header-logo-placeholder",children:"A"}),(0,f.jsxs)("div",{className:"chat-header-title-wrap",children:[(0,f.jsxs)("div",{className:"chat-header-title-row",children:[(0,f.jsx)("span",{className:"chat-header-title",children:"Aria"}),(0,f.jsx)("span",{className:"chat-header-badge",children:t||"Assistant"})]}),(0,f.jsxs)("span",{className:"chat-header-status",children:[(0,f.jsx)("span",{className:"chat-header-status-dot"}),"Online \xB7 usually replies instantly"]})]})]}),(0,f.jsx)("div",{className:"chat-header-actions",children:(0,f.jsx)("button",{onClick:e,className:"chat-header-close-btn","aria-label":"Close chat",children:(0,f.jsx)(M.X,{size:20})})})]})},W=Ne;var Y=require("react");var k=require("react/jsx-runtime"),Me=({input:e,onInputChange:t,onSendMessage:a,isLoading:r,theming:i})=>{let m=i?.showGradient===!1?"var(--cb-primary)":"linear-gradient(135deg, var(--cb-primary) 0%, var(--cb-secondary) 100%)",s=(0,Y.useRef)(null),g=B("chat-input-container",i?.input);(0,Y.useEffect)(()=>{r||s.current?.focus()},[r]);let n=l=>{l.key==="Enter"&&!l.nativeEvent.isComposing&&o()},o=()=>{e.trim()&&!r&&a()};return(0,k.jsx)("div",{className:"chat-input-outer",children:(0,k.jsx)("div",{className:"chat-input-wrap",children:(0,k.jsxs)("div",{className:"chat-input-row",children:[(0,k.jsx)("div",{className:g,style:{...i?.inputStyle,borderRadius:"9999px"},children:(0,k.jsx)("div",{className:"chat-input-inner",children:(0,k.jsx)("input",{ref:s,type:"text",className:"chat-input-field",placeholder:r?"AI is thinking...":"Type a message...",value:e,onChange:l=>t(l.target.value),onKeyDown:n,disabled:r,"aria-label":"User message"})})}),(0,k.jsx)("button",{onClick:o,disabled:r||!e.trim(),style:{background:m},className:"chat-input-send-btn","aria-label":"Send message",children:r?(0,k.jsx)("div",{className:"chat-input-spinner"}):(0,k.jsx)(M.Send,{className:"chat-input-send-icon"})})]})})})},G=Me;var re=require("react"),ae=H(require("react-markdown")),oe=H(require("remark-gfm"));var K=H(require("react-markdown")),J=H(require("remark-gfm"));var d=require("react/jsx-runtime"),Ie=({message:e,cardRegistry:t,themeStyles:a,theming:r})=>{let i=new Date().toLocaleTimeString([],{hour:"2-digit",minute:"2-digit",hour12:!0}).toLowerCase(),m=g=>{let n=g?.__collectionUid?.split(".").pop()?.toLowerCase();return t.find(o=>o.id===n)||t.find(o=>o.id==="default")},s=e.record?m(e.record)?.component:null,b={background:r?.showGradient===!1?"#3B82F6":"linear-gradient(135deg, #1D4ED8 0%, #3B82F6 100%)"};if(e.items?.items?.length){let g=e.items.cardStyle?.toLowerCase()||e.items.collection?.toLowerCase()||e.items.title?.toLowerCase(),o=t.find(l=>l.id===g)?.component;return(0,d.jsxs)("div",{className:"mb-card-container",children:[e.content&&(0,d.jsx)("div",{className:"mb-card-content",children:(0,d.jsx)(K.default,{remarkPlugins:[J.default],children:e.content})}),o&&e.items.items.map((l,N)=>(0,d.jsx)(o,{items:l,style:a},N))]})}return(0,d.jsxs)("div",{className:`mb-row ${e.role==="user"?"mb-row-user":"mb-row-assistant"}`,children:[s&&e.record?(0,d.jsx)("div",{className:"mb-card-wrapper",children:(0,d.jsx)(s,{record:e.record,style:a})}):(0,d.jsx)("div",{style:e.role==="user"?{...b,...r?.userBubbleStyle}:{},className:`mb-bubble ${e.role==="user"?"mb-bubble-user":"mb-bubble-assistant"}`,children:e.loading&&!e.content?(0,d.jsxs)("div",{className:"mb-typing",children:[(0,d.jsx)("span",{className:"mb-dot mb-dot-1"}),(0,d.jsx)("span",{className:"mb-dot mb-dot-2"}),(0,d.jsx)("span",{className:"mb-dot mb-dot-3"})]}):(0,d.jsx)("div",{className:"mb-content-wrapper",children:(0,d.jsx)(K.default,{remarkPlugins:[J.default],children:e.content||""})})}),e.role==="assistant"&&!s&&(0,d.jsxs)("div",{className:"mb-assistant-meta",children:[(0,d.jsx)("span",{className:"mb-assistant-avatar",style:{background:r?.showGradient===!1?"#3B82F6":"linear-gradient(135deg, var(--cb-primary), var(--cb-secondary))"},children:"A"}),(0,d.jsx)("span",{className:"mb-assistant-time",children:i})]}),e.role==="user"&&!s&&(0,d.jsxs)("div",{className:"mb-user-meta",children:[(0,d.jsx)("span",{className:"mb-user-time",children:i}),(0,d.jsx)("span",{className:"mb-user-tick","aria-label":"Delivered",children:"\u2713\u2713"})]})]})},U=Ie;var C=require("react/jsx-runtime"),Se=({messages:e,scrollRef:t,resolvedRegistry:a,theming:r})=>{let i=r?.welcomeDescription||"Hi! I'm Aria, your Harbour Air travel assistant. I'm here to help you book flights, check fees, understand baggage rules, and anything else you need.",m=new Date().toLocaleTimeString([],{hour:"2-digit",minute:"2-digit",hour12:!0}).toLowerCase();return(0,re.useEffect)(()=>{let s=t.current;s&&s.scrollTo({top:s.scrollHeight,behavior:"auto"})},[e,t]),(0,C.jsxs)("div",{ref:t,className:"chat-messages-container",style:{scrollbarWidth:"none",msOverflowStyle:"none"},children:[e.length===0&&(0,C.jsx)("div",{className:"chat-welcome",children:(0,C.jsxs)("div",{className:"chat-welcome-message",children:[(0,C.jsx)("p",{className:"chat-welcome-subtitle",children:(0,C.jsx)(ae.default,{remarkPlugins:[oe.default],children:i})}),(0,C.jsxs)("div",{className:"chat-welcome-meta",children:[(0,C.jsx)("span",{className:"chat-welcome-avatar",style:{background:r?.showGradient===!1?"#3B82F6":"linear-gradient(135deg, var(--cb-primary), var(--cb-secondary))"},children:"A"}),(0,C.jsx)("span",{className:"chat-welcome-time",children:m})]})]})}),e.map(s=>(0,C.jsx)(U,{message:s,cardRegistry:a,themeStyles:{"--cb-primary":r?.primaryColor||"#2999d6","--cb-secondary":r?.secondaryColor||"#179fa3","--cb-accent":r?.accentColor||r?.secondaryColor||"#179fa3"},theming:r},s.id))]})},ne=Se;var D=require("react");var u=require("react/jsx-runtime"),Re=({strapiUrl:e,onSelectQuestion:t,variant:a,theming:r})=>{let[i,m]=(0,D.useState)([]),[s,b]=(0,D.useState)(!0);(0,D.useEffect)(()=>{let n=new AbortController;return b(!0),fetch(`${e}/api/faq-ai-bot/suggestion-and-logo`,{signal:n.signal}).then(o=>o.json()).then(o=>{m(o.suggestedQuestions||[]),b(!1)}).catch(o=>{o.name!=="AbortError"&&(console.error("Suggestions fetch failed",o),b(!1))}),()=>n.abort()},[e]);let g=()=>a==="floating"?(0,u.jsxs)("div",{className:"sug-skeleton-float",children:[[1,2].map(n=>(0,u.jsx)("div",{className:"sug-skeleton-item",style:{backgroundColor:r?.primaryColor?`${r.primaryColor}`:"hsla(178, 100%, 51%, 0.05)",transform:n%2===0?"rotate(1deg)":"rotate(-1deg)"}},n)),(0,u.jsx)("div",{className:"sug-skeleton-more"})]}):(0,u.jsx)("div",{className:"sug-skeleton-list",children:[1,2,3].map(n=>(0,u.jsx)("div",{className:"sug-skeleton-chip"},n))});return s&&i.length===0?(0,u.jsx)(g,{}):a==="floating"?(0,u.jsx)("div",{className:"sug-float-wrap",children:i.map((n,o)=>(0,u.jsx)("button",{onClick:()=>t(n),className:"sug-float-btn",style:{borderColor:"#bfdbfe",animationDelay:`${o*.1}s`},children:(0,u.jsx)("span",{className:"sug-float-text",children:n})},`float-${o}-${n}`))}):(0,u.jsx)("div",{className:"sug-list-wrap",children:i.map((n,o)=>(0,u.jsx)("button",{onClick:()=>t(n),className:"sug-list-btn",style:{animationDelay:`${o*.05}s`},children:n},`list-${o}-${n}`))})},q=Re;var x=require("react/jsx-runtime"),Le=({isExpanded:e,setIsExpanded:t,messages:a,scrollRef:r,sendMessage:i,strapiUrl:m,resolvedRegistry:s,input:b,setInput:g,isLoading:n,title:o,theming:l})=>{let N=B(`chat-window ${e?"chat-window-open":"chat-window-closed"}`,l?.container);return(0,x.jsxs)("div",{className:N,style:l?.containerStyle,children:[(0,x.jsx)("div",{className:"chat-window-header",children:(0,x.jsx)(W,{title:o,onClose:()=>t(!1),theming:l,strapiUrl:m})}),(0,x.jsx)(ne,{messages:a,scrollRef:r,resolvedRegistry:s,theming:l}),(0,x.jsxs)("div",{className:"chat-window-footer",children:[(0,x.jsx)("div",{className:"chat-window-suggestions",children:(0,x.jsx)(q,{onSelectQuestion:i,strapiUrl:m,variant:"floating",theming:l})}),(0,x.jsx)(G,{input:b,onInputChange:g,onSendMessage:i,isLoading:n,theming:l}),(0,x.jsx)("div",{className:"chat-window-powered",children:(0,x.jsx)("span",{className:"chat-powered-text",children:"Talk to a human \xB7 Privacy policy"})})]})]})},ie=Le;var F=require("react/jsx-runtime"),ze=({strapiUrl:e,cardRegistry:t,theme:a,title:r,streamSpeed:i})=>{let[m,s]=(0,y.useState)([]),[b,g]=(0,y.useState)(""),[n,o]=(0,y.useState)(!1),[l,N]=(0,y.useState)(!1),$=(0,y.useRef)(null),[se,de]=(0,y.useState)([]),le=(0,y.useRef)(null),ce={"--cb-primary":a?.primaryColor||"#2999d6","--cb-secondary":a?.secondaryColor||"#179fa3","--cb-accent":a?.accentColor||a?.secondaryColor||"#179fa3"};return(0,y.useEffect)(()=>{t.length>0&&de(t)},[t]),(0,y.useEffect)(()=>()=>$.current?.abort(),[]),(0,F.jsxs)("div",{className:"chatbot-container",style:ce,children:[(0,F.jsx)(te,{isExpanded:l,onOpen:()=>N(!0),theming:a}),(0,F.jsx)(ie,{isExpanded:l,setIsExpanded:N,messages:m,scrollRef:le,sendMessage:async me=>{let Q=me||b;if(!Q.trim())return;$.current?.abort(),$.current=new AbortController,N(!0),g(""),o(!0);let pe={role:"user",content:Q,id:Date.now()},S=Date.now()+1;s(R=>[...R,pe,{role:"assistant",content:"",items:null,loading:!0,id:S}]);try{let R=await fetch(`${e}/api/faq-ai-bot/ask`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({question:Q,history:m.slice(-4).map(h=>({role:h.role,content:h.content}))}),signal:$.current.signal});if(!R.ok)throw new Error("Network response was not ok");let A=R.body?.getReader(),E=new TextDecoder;if(!A)throw new Error("No reader available");let T=[],Z=!1,he=(async()=>{for(;!Z||T.length>0;)if(T.length>0){let h=T.shift();if(h?.type==="text")if(i&&i>0)for(let c of h.content)s(w=>w.map(v=>v.id===S?{...v,content:v.content+c}:v)),await new Promise(w=>setTimeout(w,i));else s(c=>c.map(w=>w.id===S?{...w,content:w.content+h.content}:w));else if(h?.type==="card")try{let c=h.data;s(w=>w.map(v=>v.id===S?{...v,items:{items:c.items,schema:c.schema,collection:c.title,title:c.title,cardStyle:c.cardStyle}}:v))}catch(c){console.error("Error processing card data:",c)}}else await new Promise(h=>setTimeout(h,20));o(!1),s(h=>h.map(c=>c.id===S?{...c,loading:!1}:c))})(),V="";for(;;){let{value:h,done:c}=await A.read();if(c)break;let w=E.decode(h,{stream:!0});V+=w;let v=V.split(`
|
|
1
|
+
"use strict";"use client";var be=Object.create;var A=Object.defineProperty;var ue=Object.getOwnPropertyDescriptor;var we=Object.getOwnPropertyNames;var xe=Object.getPrototypeOf,ye=Object.prototype.hasOwnProperty;var ve=(e,t)=>{for(var a in t)A(e,a,{get:t[a],enumerable:!0})},ee=(e,t,a,r)=>{if(t&&typeof t=="object"||typeof t=="function")for(let i of we(t))!ye.call(e,i)&&i!==a&&A(e,i,{get:()=>t[i],enumerable:!(r=ue(t,i))||r.enumerable});return e};var H=(e,t,a)=>(a=e!=null?be(xe(e)):{},ee(t||!e||!e.__esModule?A(a,"default",{value:e,enumerable:!0}):a,e)),ke=e=>ee(A({},"__esModule",{value:!0}),e);var Be={};ve(Be,{ChatBot:()=>X,ChatHeader:()=>W,ChatInput:()=>Y,Chatbot:()=>X,ICONS:()=>M,MessageBubble:()=>G,Suggestions:()=>q});module.exports=ke(Be);var w=require("react");var h=require("react/jsx-runtime"),M={MessageCircle:({size:e=24,className:t=""})=>(0,h.jsx)("svg",{width:e,height:e,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",className:t,children:(0,h.jsx)("path",{d:"M7.9 20A9 9 0 1 0 4 16.1L2 22Z"})}),Bot:({size:e=24,className:t=""})=>(0,h.jsx)("svg",{width:e,height:e,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",className:t,children:(0,h.jsx)("path",{d:"M12 8V4m8 4V4M4 8V4M2 11h20m-1 0v10a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V11m5 5v2m8-2v2"})}),X:({size:e=24,className:t=""})=>(0,h.jsx)("svg",{width:e,height:e,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",className:t,children:(0,h.jsx)("path",{d:"M18 6 6 18M6 6l12 12"})}),Send:({size:e=24,className:t=""})=>(0,h.jsxs)("svg",{width:e,height:e,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",className:t,children:[(0,h.jsx)("path",{d:"m22 2-7 20-4-9-9-4Z"}),(0,h.jsx)("path",{d:"M22 2 11 13"})]}),Sparkles:({size:e=24,className:t=""})=>(0,h.jsxs)("svg",{width:e,height:e,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",className:t,children:[(0,h.jsx)("path",{d:"M12 2l1.8 4.6L18 8l-4.2 1.4L12 14l-1.8-4.6L6 8l4.2-1.4L12 2z"}),(0,h.jsx)("path",{d:"M5 16l.9 2.3L8 19l-2.1.7L5 22l-.9-2.3L2 19l2.1-.7L5 16z"}),(0,h.jsx)("path",{d:"M19 14l.9 2.3L22 17l-2.1.7L19 20l-.9-2.3L16 17l2.1-.7L19 14z"})]})};var I=require("react/jsx-runtime"),Ce=({isExpanded:e,onOpen:t,theming:a})=>(0,I.jsx)("div",{onClick:t,className:`chat-floating-btn ${e?"chat-btn-hidden":"chat-btn-visible"}`,children:(0,I.jsx)("div",{className:"chat-btn-border seamless-border",children:(0,I.jsxs)("div",{className:"chat-btn-inner",children:[(0,I.jsx)("div",{className:"chat-btn-gradient",style:{background:a?.showGradient===!1?"var(--cb-primary)":"linear-gradient(135deg, var(--cb-primary)0%, var(--cb-secondary)100%)"}}),(0,I.jsx)(M.Sparkles,{size:30,className:"chat-btn-icon"})]})})}),te=Ce;var O=require("react");var E=(e,t)=>t?`${e} ${t}`:e;var v=require("react/jsx-runtime"),Ne=({onClose:e,title:t,theming:a,strapiUrl:r})=>{let[i,p]=(0,O.useState)(null);(0,O.useEffect)(()=>{if(!r)return;(async()=>{try{let n=await(await fetch(`${r}/api/faq-ai-bot/suggestion-and-logo`)).json();n?.logoUrl&&p(`${r}${n.logoUrl}`)}catch(o){console.error("Failed to fetch logo",o)}})()},[r]);let s=E("chat-header",a?.header);return(0,v.jsxs)("header",{className:s,style:a?.headerStyle,children:[(0,v.jsxs)("div",{className:"chat-header-left",children:[(0,v.jsx)("div",{className:"chat-header-logo-placeholder",children:t?.charAt(0)?.toUpperCase()}),(0,v.jsx)("div",{className:"chat-header-title-wrap",children:(0,v.jsx)("div",{className:"chat-header-title-row",children:(0,v.jsx)("span",{className:"chat-header-title",children:t})})})]}),(0,v.jsx)("div",{className:"chat-header-actions",children:(0,v.jsx)("button",{onClick:e,className:"chat-header-close-btn","aria-label":"Close chat",children:(0,v.jsx)(M.X,{size:20})})})]})},W=Ne;var U=require("react");var k=require("react/jsx-runtime"),Me=({input:e,onInputChange:t,onSendMessage:a,isLoading:r,theming:i})=>{let p=i?.showGradient===!1?"var(--cb-primary)":"linear-gradient(135deg, var(--cb-primary) 0%, var(--cb-secondary) 100%)",c=(0,U.useRef)(null),x=E("chat-input-container",i?.input);(0,U.useEffect)(()=>{r||c.current?.focus()},[r]);let o=l=>{l.key==="Enter"&&!l.nativeEvent.isComposing&&n()},n=()=>{e.trim()&&!r&&a()};return(0,k.jsx)("div",{className:"chat-input-outer",children:(0,k.jsx)("div",{className:"chat-input-wrap",children:(0,k.jsxs)("div",{className:"chat-input-row",children:[(0,k.jsx)("div",{className:x,style:{...i?.inputStyle,borderRadius:"9999px"},children:(0,k.jsx)("div",{className:"chat-input-inner",children:(0,k.jsx)("input",{ref:c,type:"text",className:"chat-input-field",placeholder:r?"AI is thinking...":"Type a message...",value:e,onChange:l=>t(l.target.value),onKeyDown:o,disabled:r,"aria-label":"User message"})})}),(0,k.jsx)("button",{onClick:n,disabled:r||!e.trim(),style:{background:p},className:"chat-input-send-btn","aria-label":"Send message",children:r?(0,k.jsx)("div",{className:"chat-input-spinner"}):(0,k.jsx)(M.Send,{className:"chat-input-send-icon"})})]})})})},Y=Me;var re=require("react"),ae=H(require("react-markdown")),oe=H(require("remark-gfm"));var K=H(require("react-markdown")),J=H(require("remark-gfm"));var d=require("react/jsx-runtime"),Ie=({message:e,cardRegistry:t,themeStyles:a,theming:r,title:i})=>{let p=new Date().toLocaleTimeString([],{hour:"2-digit",minute:"2-digit",hour12:!0}).toLowerCase(),c=o=>{let n=o?.__collectionUid?.split(".").pop()?.toLowerCase();return t.find(l=>l.id===n)||t.find(l=>l.id==="default")},s=e.record?c(e.record)?.component:null,x={background:r?.showGradient===!1?"#3B82F6":"linear-gradient(135deg, #1D4ED8 0%, #3B82F6 100%)"};if(e.items?.items?.length){let o=e.items.cardStyle?.toLowerCase()||e.items.collection?.toLowerCase()||e.items.title?.toLowerCase(),l=t.find(N=>N.id===o)?.component;return(0,d.jsxs)("div",{className:"mb-card-container",children:[e.content&&(0,d.jsx)("div",{className:"mb-card-content",children:(0,d.jsx)(K.default,{remarkPlugins:[J.default],children:e.content})}),l&&e.items.items.map((N,S)=>(0,d.jsx)(l,{items:N,style:a},S))]})}return(0,d.jsxs)("div",{className:`mb-row ${e.role==="user"?"mb-row-user":"mb-row-assistant"}`,children:[s&&e.record?(0,d.jsx)("div",{className:"mb-card-wrapper",children:(0,d.jsx)(s,{record:e.record,style:a})}):(0,d.jsx)("div",{style:e.role==="user"?{...x,...r?.userBubbleStyle}:{},className:`mb-bubble ${e.role==="user"?"mb-bubble-user":"mb-bubble-assistant"}`,children:e.loading&&!e.content?(0,d.jsxs)("div",{className:"mb-typing",children:[(0,d.jsx)("span",{className:"mb-dot mb-dot-1"}),(0,d.jsx)("span",{className:"mb-dot mb-dot-2"}),(0,d.jsx)("span",{className:"mb-dot mb-dot-3"})]}):(0,d.jsx)("div",{className:"mb-content-wrapper",children:(0,d.jsx)(K.default,{remarkPlugins:[J.default],children:e.content||""})})}),e.role==="assistant"&&!s&&(0,d.jsxs)("div",{className:"mb-assistant-meta",children:[(0,d.jsx)("span",{className:"mb-assistant-avatar",style:{background:r?.showGradient===!1?"#3B82F6":"linear-gradient(135deg, var(--cb-primary), var(--cb-secondary))"},children:i?.charAt(0)?.toUpperCase()}),(0,d.jsx)("span",{className:"mb-assistant-time",children:p})]}),e.role==="user"&&!s&&(0,d.jsxs)("div",{className:"mb-user-meta",children:[(0,d.jsx)("span",{className:"mb-user-time",children:p}),(0,d.jsx)("span",{className:"mb-user-tick","aria-label":"Delivered",children:"\u2713\u2713"})]})]})},G=Ie;var C=require("react/jsx-runtime"),Se=({messages:e,scrollRef:t,resolvedRegistry:a,theming:r,title:i})=>{let p=r?.welcomeDescription||"Hi! I'm Aria, your Harbour Air travel assistant. I'm here to help you book flights, check fees, understand baggage rules, and anything else you need.",c=new Date().toLocaleTimeString([],{hour:"2-digit",minute:"2-digit",hour12:!0}).toLowerCase();return(0,re.useEffect)(()=>{let s=t.current;s&&s.scrollTo({top:s.scrollHeight,behavior:"auto"})},[e,t]),(0,C.jsxs)("div",{ref:t,className:"chat-messages-container",style:{scrollbarWidth:"none",msOverflowStyle:"none"},children:[e.length===0&&(0,C.jsx)("div",{className:"chat-welcome",children:(0,C.jsxs)("div",{className:"chat-welcome-message",children:[(0,C.jsx)("p",{className:"chat-welcome-subtitle",children:(0,C.jsx)(ae.default,{remarkPlugins:[oe.default],children:p})}),(0,C.jsxs)("div",{className:"chat-welcome-meta",children:[(0,C.jsx)("span",{className:"chat-welcome-avatar",style:{background:r?.showGradient===!1?"#3B82F6":"linear-gradient(135deg, var(--cb-primary), var(--cb-secondary))"},children:i?.charAt(0)?.toUpperCase()}),(0,C.jsx)("span",{className:"chat-welcome-time",children:c})]})]})}),e.map(s=>(0,C.jsx)(G,{message:s,cardRegistry:a,themeStyles:{"--cb-primary":r?.primaryColor||"#2999d6","--cb-secondary":r?.secondaryColor||"#179fa3","--cb-accent":r?.accentColor||r?.secondaryColor||"#179fa3"},theming:r},s.id))]})},ne=Se;var F=require("react");var g=require("react/jsx-runtime"),Re=({strapiUrl:e,onSelectQuestion:t,variant:a,theming:r})=>{let[i,p]=(0,F.useState)([]),[c,s]=(0,F.useState)(!0);(0,F.useEffect)(()=>{let o=new AbortController;return s(!0),fetch(`${e}/api/faq-ai-bot/suggestion-and-logo`,{signal:o.signal}).then(n=>n.json()).then(n=>{p(n.suggestedQuestions||[]),s(!1)}).catch(n=>{n.name!=="AbortError"&&(console.error("Suggestions fetch failed",n),s(!1))}),()=>o.abort()},[e]);let x=()=>a==="floating"?(0,g.jsxs)("div",{className:"sug-skeleton-float",children:[[1,2].map(o=>(0,g.jsx)("div",{className:"sug-skeleton-item",style:{backgroundColor:r?.primaryColor?`${r.primaryColor}`:"hsla(178, 100%, 51%, 0.05)",transform:o%2===0?"rotate(1deg)":"rotate(-1deg)"}},o)),(0,g.jsx)("div",{className:"sug-skeleton-more"})]}):(0,g.jsx)("div",{className:"sug-skeleton-list",children:[1,2,3].map(o=>(0,g.jsx)("div",{className:"sug-skeleton-chip"},o))});return c&&i.length===0?(0,g.jsx)(x,{}):a==="floating"?(0,g.jsx)("div",{className:"sug-float-wrap",children:i.map((o,n)=>(0,g.jsx)("button",{onClick:()=>t(o),className:"sug-float-btn",style:{borderColor:"#bfdbfe",animationDelay:`${n*.1}s`},children:(0,g.jsx)("span",{className:"sug-float-text",children:o})},`float-${n}-${o}`))}):(0,g.jsx)("div",{className:"sug-list-wrap",children:i.map((o,n)=>(0,g.jsx)("button",{onClick:()=>t(o),className:"sug-list-btn",style:{animationDelay:`${n*.05}s`},children:o},`list-${n}-${o}`))})},q=Re;var u=require("react/jsx-runtime"),Le=({isExpanded:e,setIsExpanded:t,messages:a,scrollRef:r,sendMessage:i,strapiUrl:p,resolvedRegistry:c,input:s,setInput:x,isLoading:o,title:n,theming:l})=>{let N=E(`chat-window ${e?"chat-window-open":"chat-window-closed"}`,l?.container);return(0,u.jsxs)("div",{className:N,style:l?.containerStyle,children:[(0,u.jsx)("div",{className:"chat-window-header",children:(0,u.jsx)(W,{title:n,onClose:()=>t(!1),theming:l,strapiUrl:p})}),(0,u.jsx)(ne,{messages:a,scrollRef:r,resolvedRegistry:c,theming:l}),(0,u.jsxs)("div",{className:"chat-window-footer",children:[(0,u.jsx)("div",{className:"chat-window-suggestions",children:(0,u.jsx)(q,{onSelectQuestion:i,strapiUrl:p,variant:"floating",theming:l})}),(0,u.jsx)(Y,{input:s,onInputChange:x,onSendMessage:i,isLoading:o,theming:l}),(0,u.jsx)("div",{className:"chat-window-powered",children:(0,u.jsx)("span",{className:"chat-powered-text",children:"Talk to a human \xB7 Privacy policy"})})]})]})},ie=Le;var $=require("react/jsx-runtime"),ze=({strapiUrl:e,cardRegistry:t,theme:a,title:r,streamSpeed:i})=>{let[p,c]=(0,w.useState)([]),[s,x]=(0,w.useState)(""),[o,n]=(0,w.useState)(!1),[l,N]=(0,w.useState)(!1),S=(0,w.useRef)(null),[se,de]=(0,w.useState)([]),le=(0,w.useRef)(null),ce={"--cb-primary":a?.primaryColor||"#2999d6","--cb-secondary":a?.secondaryColor||"#179fa3","--cb-accent":a?.accentColor||a?.secondaryColor||"#179fa3"};return(0,w.useEffect)(()=>{t.length>0&&de(t)},[t]),(0,w.useEffect)(()=>()=>S.current?.abort(),[]),(0,$.jsxs)("div",{className:"chatbot-container",style:ce,children:[(0,$.jsx)(te,{isExpanded:l,onOpen:()=>N(!0),theming:a}),(0,$.jsx)(ie,{isExpanded:l,setIsExpanded:N,messages:p,scrollRef:le,sendMessage:async me=>{let Q=me||s;if(!Q.trim())return;S.current?.abort(),S.current=new AbortController,N(!0),x(""),n(!0);let pe={role:"user",content:Q,id:Date.now()},R=Date.now()+1;c(L=>[...L,pe,{role:"assistant",content:"",items:null,loading:!0,id:R}]);try{let L=await fetch(`${e}/api/faq-ai-bot/ask`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({question:Q,history:p.slice(-4).map(f=>({role:f.role,content:f.content}))}),signal:S.current.signal});if(!L.ok)throw new Error("Network response was not ok");let j=L.body?.getReader(),T=new TextDecoder;if(!j)throw new Error("No reader available");let P=[],Z=!1,he=(async()=>{for(;!Z||P.length>0;)if(P.length>0){let f=P.shift();if(f?.type==="text")if(i&&i>0)for(let m of f.content)c(b=>b.map(y=>y.id===R?{...y,content:y.content+m}:y)),await new Promise(b=>setTimeout(b,i));else c(m=>m.map(b=>b.id===R?{...b,content:b.content+f.content}:b));else if(f?.type==="card")try{let m=f.data;c(b=>b.map(y=>y.id===R?{...y,items:{items:m.items,schema:m.schema,collection:m.title,title:m.title,cardStyle:m.cardStyle}}:y))}catch(m){console.error("Error processing card data:",m)}}else await new Promise(f=>setTimeout(f,20));n(!1),c(f=>f.map(m=>m.id===R?{...m,loading:!1}:m))})(),V="";for(;;){let{value:f,done:m}=await j.read();if(m)break;let b=T.decode(f,{stream:!0});V+=b;let y=V.split(`
|
|
2
2
|
|
|
3
|
-
`);V=
|
|
4
|
-
`),_="message",
|
|
5
|
-
`:"")+
|
|
3
|
+
`);V=y.pop()||"";for(let fe of y){let ge=fe.split(`
|
|
4
|
+
`),_="message",D="";for(let z of ge)if(z.startsWith("event:"))_=z.slice(6).trim();else if(z.startsWith("data:")){let B=z.slice(5);if(B.startsWith(" ")&&(B=B.slice(1)),B.trim()==="[DONE]"||B.trim()==="[Done]")continue;D+=(D?`
|
|
5
|
+
`:"")+B}if(_==="cards"){let z=JSON.parse(D);P.push({type:"card",data:z})}else D&&P.push({type:"text",content:D})}}Z=!0,await he}catch(L){L.name!=="AbortError"&&c(j=>j.map(T=>T.id===R?{...T,content:"I'm sorry, I'm having trouble connecting right now.",loading:!1}:T)),n(!1)}},strapiUrl:e,resolvedRegistry:se,input:s,setInput:x,isLoading:o,title:r,theming:a})]})},X=ze;0&&(module.exports={ChatBot,ChatHeader,ChatInput,Chatbot,ICONS,MessageBubble,Suggestions});
|
package/dist/index.mjs
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
"use client";import{useState as D,useEffect as re,useRef as ae}from"react";import{jsx as u,jsxs as V}from"react/jsx-runtime";var S={MessageCircle:({size:e=24,className:t=""})=>u("svg",{width:e,height:e,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",className:t,children:u("path",{d:"M7.9 20A9 9 0 1 0 4 16.1L2 22Z"})}),Bot:({size:e=24,className:t=""})=>u("svg",{width:e,height:e,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",className:t,children:u("path",{d:"M12 8V4m8 4V4M4 8V4M2 11h20m-1 0v10a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V11m5 5v2m8-2v2"})}),X:({size:e=24,className:t=""})=>u("svg",{width:e,height:e,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",className:t,children:u("path",{d:"M18 6 6 18M6 6l12 12"})}),Send:({size:e=24,className:t=""})=>V("svg",{width:e,height:e,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",className:t,children:[u("path",{d:"m22 2-7 20-4-9-9-4Z"}),u("path",{d:"M22 2 11 13"})]}),Sparkles:({size:e=24,className:t=""})=>V("svg",{width:e,height:e,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",className:t,children:[u("path",{d:"M12 2l1.8 4.6L18 8l-4.2 1.4L12 14l-1.8-4.6L6 8l4.2-1.4L12 2z"}),u("path",{d:"M5 16l.9 2.3L8 19l-2.1.7L5 22l-.9-2.3L2 19l2.1-.7L5 16z"}),u("path",{d:"M19 14l.9 2.3L22 17l-2.1.7L19 20l-.9-2.3L16 17l2.1-.7L19 14z"})]})};import{jsx as A,jsxs as ge}from"react/jsx-runtime";var be=({isExpanded:e,onOpen:t,theming:i})=>A("div",{onClick:t,className:`chat-floating-btn ${e?"chat-btn-hidden":"chat-btn-visible"}`,children:A("div",{className:"chat-btn-border seamless-border",children:ge("div",{className:"chat-btn-inner",children:[A("div",{className:"chat-btn-gradient",style:{background:i?.showGradient===!1?"var(--cb-primary)":"linear-gradient(135deg, var(--cb-primary)0%, var(--cb-secondary)100%)"}}),A(S.Sparkles,{size:30,className:"chat-btn-icon"})]})})}),K=be;import{useEffect as ue,useState as we}from"react";var R=(e,t)=>t?`${e} ${t}`:e;import{jsx as k,jsxs as T}from"react/jsx-runtime";var xe=({onClose:e,title:t,theming:i,strapiUrl:r})=>{let[s,c]=we(null);ue(()=>{if(!r)return;(async()=>{try{let a=await(await fetch(`${r}/api/faq-ai-bot/suggestion-and-logo`)).json();a?.logoUrl&&c(`${r}${a.logoUrl}`)}catch(o){console.error("Failed to fetch logo",o)}})()},[r]);let h=R("chat-header",i?.header);return T("header",{className:h,style:i?.headerStyle,children:[T("div",{className:"chat-header-left",children:[k("div",{className:"chat-header-logo-placeholder",children:"A"}),T("div",{className:"chat-header-title-wrap",children:[T("div",{className:"chat-header-title-row",children:[k("span",{className:"chat-header-title",children:"Aria"}),k("span",{className:"chat-header-badge",children:t||"Assistant"})]}),T("span",{className:"chat-header-status",children:[k("span",{className:"chat-header-status-dot"}),"Online \xB7 usually replies instantly"]})]})]}),k("div",{className:"chat-header-actions",children:k("button",{onClick:e,className:"chat-header-close-btn","aria-label":"Close chat",children:k(S.X,{size:20})})})]})},O=xe;import{useRef as ye,useEffect as ve}from"react";import{jsx as x,jsxs as Ce}from"react/jsx-runtime";var ke=({input:e,onInputChange:t,onSendMessage:i,isLoading:r,theming:s})=>{let c=s?.showGradient===!1?"var(--cb-primary)":"linear-gradient(135deg, var(--cb-primary) 0%, var(--cb-secondary) 100%)",n=ye(null),f=R("chat-input-container",s?.input);ve(()=>{r||n.current?.focus()},[r]);let o=d=>{d.key==="Enter"&&!d.nativeEvent.isComposing&&a()},a=()=>{e.trim()&&!r&&i()};return x("div",{className:"chat-input-outer",children:x("div",{className:"chat-input-wrap",children:Ce("div",{className:"chat-input-row",children:[x("div",{className:f,style:{...s?.inputStyle,borderRadius:"9999px"},children:x("div",{className:"chat-input-inner",children:x("input",{ref:n,type:"text",className:"chat-input-field",placeholder:r?"AI is thinking...":"Type a message...",value:e,onChange:d=>t(d.target.value),onKeyDown:o,disabled:r,"aria-label":"User message"})})}),x("button",{onClick:a,disabled:r||!e.trim(),style:{background:c},className:"chat-input-send-btn","aria-label":"Send message",children:r?x("div",{className:"chat-input-spinner"}):x(S.Send,{className:"chat-input-send-icon"})})]})})})},W=ke;import{useEffect as Me}from"react";import Ie from"react-markdown";import Se from"remark-gfm";import J from"react-markdown";import X from"remark-gfm";import{jsx as m,jsxs as P}from"react/jsx-runtime";var Ne=({message:e,cardRegistry:t,themeStyles:i,theming:r})=>{let s=new Date().toLocaleTimeString([],{hour:"2-digit",minute:"2-digit",hour12:!0}).toLowerCase(),c=f=>{let o=f?.__collectionUid?.split(".").pop()?.toLowerCase();return t.find(a=>a.id===o)||t.find(a=>a.id==="default")},n=e.record?c(e.record)?.component:null,h={background:r?.showGradient===!1?"#3B82F6":"linear-gradient(135deg, #1D4ED8 0%, #3B82F6 100%)"};if(e.items?.items?.length){let f=e.items.cardStyle?.toLowerCase()||e.items.collection?.toLowerCase()||e.items.title?.toLowerCase(),a=t.find(d=>d.id===f)?.component;return P("div",{className:"mb-card-container",children:[e.content&&m("div",{className:"mb-card-content",children:m(J,{remarkPlugins:[X],children:e.content})}),a&&e.items.items.map((d,v)=>m(a,{items:d,style:i},v))]})}return P("div",{className:`mb-row ${e.role==="user"?"mb-row-user":"mb-row-assistant"}`,children:[n&&e.record?m("div",{className:"mb-card-wrapper",children:m(n,{record:e.record,style:i})}):m("div",{style:e.role==="user"?{...h,...r?.userBubbleStyle}:{},className:`mb-bubble ${e.role==="user"?"mb-bubble-user":"mb-bubble-assistant"}`,children:e.loading&&!e.content?P("div",{className:"mb-typing",children:[m("span",{className:"mb-dot mb-dot-1"}),m("span",{className:"mb-dot mb-dot-2"}),m("span",{className:"mb-dot mb-dot-3"})]}):m("div",{className:"mb-content-wrapper",children:m(J,{remarkPlugins:[X],children:e.content||""})})}),e.role==="assistant"&&!n&&P("div",{className:"mb-assistant-meta",children:[m("span",{className:"mb-assistant-avatar",style:{background:r?.showGradient===!1?"#3B82F6":"linear-gradient(135deg, var(--cb-primary), var(--cb-secondary))"},children:"A"}),m("span",{className:"mb-assistant-time",children:s})]}),e.role==="user"&&!n&&P("div",{className:"mb-user-meta",children:[m("span",{className:"mb-user-time",children:s}),m("span",{className:"mb-user-tick","aria-label":"Delivered",children:"\u2713\u2713"})]})]})},Y=Ne;import{jsx as L,jsxs as G}from"react/jsx-runtime";var Re=({messages:e,scrollRef:t,resolvedRegistry:i,theming:r})=>{let s=r?.welcomeDescription||"Hi! I'm Aria, your Harbour Air travel assistant. I'm here to help you book flights, check fees, understand baggage rules, and anything else you need.",c=new Date().toLocaleTimeString([],{hour:"2-digit",minute:"2-digit",hour12:!0}).toLowerCase();return Me(()=>{let n=t.current;n&&n.scrollTo({top:n.scrollHeight,behavior:"auto"})},[e,t]),G("div",{ref:t,className:"chat-messages-container",style:{scrollbarWidth:"none",msOverflowStyle:"none"},children:[e.length===0&&L("div",{className:"chat-welcome",children:G("div",{className:"chat-welcome-message",children:[L("p",{className:"chat-welcome-subtitle",children:L(Ie,{remarkPlugins:[Se],children:s})}),G("div",{className:"chat-welcome-meta",children:[L("span",{className:"chat-welcome-avatar",style:{background:r?.showGradient===!1?"#3B82F6":"linear-gradient(135deg, var(--cb-primary), var(--cb-secondary))"},children:"A"}),L("span",{className:"chat-welcome-time",children:c})]})]})}),e.map(n=>L(Y,{message:n,cardRegistry:i,themeStyles:{"--cb-primary":r?.primaryColor||"#2999d6","--cb-secondary":r?.secondaryColor||"#179fa3","--cb-accent":r?.accentColor||r?.secondaryColor||"#179fa3"},theming:r},n.id))]})},Z=Re;import{useState as _,useEffect as Le}from"react";import{jsx as w,jsxs as Be}from"react/jsx-runtime";var ze=({strapiUrl:e,onSelectQuestion:t,variant:i,theming:r})=>{let[s,c]=_([]),[n,h]=_(!0);Le(()=>{let o=new AbortController;return h(!0),fetch(`${e}/api/faq-ai-bot/suggestion-and-logo`,{signal:o.signal}).then(a=>a.json()).then(a=>{c(a.suggestedQuestions||[]),h(!1)}).catch(a=>{a.name!=="AbortError"&&(console.error("Suggestions fetch failed",a),h(!1))}),()=>o.abort()},[e]);let f=()=>i==="floating"?Be("div",{className:"sug-skeleton-float",children:[[1,2].map(o=>w("div",{className:"sug-skeleton-item",style:{backgroundColor:r?.primaryColor?`${r.primaryColor}`:"hsla(178, 100%, 51%, 0.05)",transform:o%2===0?"rotate(1deg)":"rotate(-1deg)"}},o)),w("div",{className:"sug-skeleton-more"})]}):w("div",{className:"sug-skeleton-list",children:[1,2,3].map(o=>w("div",{className:"sug-skeleton-chip"},o))});return n&&s.length===0?w(f,{}):i==="floating"?w("div",{className:"sug-float-wrap",children:s.map((o,a)=>w("button",{onClick:()=>t(o),className:"sug-float-btn",style:{borderColor:"#bfdbfe",animationDelay:`${a*.1}s`},children:w("span",{className:"sug-float-text",children:o})},`float-${a}-${o}`))}):w("div",{className:"sug-list-wrap",children:s.map((o,a)=>w("button",{onClick:()=>t(o),className:"sug-list-btn",style:{animationDelay:`${a*.05}s`},children:o},`list-${a}-${o}`))})},U=ze;import{jsx as y,jsxs as ee}from"react/jsx-runtime";var Ee=({isExpanded:e,setIsExpanded:t,messages:i,scrollRef:r,sendMessage:s,strapiUrl:c,resolvedRegistry:n,input:h,setInput:f,isLoading:o,title:a,theming:d})=>{let v=R(`chat-window ${e?"chat-window-open":"chat-window-closed"}`,d?.container);return ee("div",{className:v,style:d?.containerStyle,children:[y("div",{className:"chat-window-header",children:y(O,{title:a,onClose:()=>t(!1),theming:d,strapiUrl:c})}),y(Z,{messages:i,scrollRef:r,resolvedRegistry:n,theming:d}),ee("div",{className:"chat-window-footer",children:[y("div",{className:"chat-window-suggestions",children:y(U,{onSelectQuestion:s,strapiUrl:c,variant:"floating",theming:d})}),y(W,{input:h,onInputChange:f,onSendMessage:s,isLoading:o,theming:d}),y("div",{className:"chat-window-powered",children:y("span",{className:"chat-powered-text",children:"Talk to a human \xB7 Privacy policy"})})]})]})},te=Ee;import{jsx as oe,jsxs as Pe}from"react/jsx-runtime";var Te=({strapiUrl:e,cardRegistry:t,theme:i,title:r,streamSpeed:s})=>{let[c,n]=D([]),[h,f]=D(""),[o,a]=D(!1),[d,v]=D(!1),F=ae(null),[ie,se]=D([]),de=ae(null),le={"--cb-primary":i?.primaryColor||"#2999d6","--cb-secondary":i?.secondaryColor||"#179fa3","--cb-accent":i?.accentColor||i?.secondaryColor||"#179fa3"};return re(()=>{t.length>0&&se(t)},[t]),re(()=>()=>F.current?.abort(),[]),Pe("div",{className:"chatbot-container",style:le,children:[oe(K,{isExpanded:d,onOpen:()=>v(!0),theming:i}),oe(te,{isExpanded:d,setIsExpanded:v,messages:c,scrollRef:de,sendMessage:async ce=>{let j=ce||h;if(!j.trim())return;F.current?.abort(),F.current=new AbortController,v(!0),f(""),a(!0);let me={role:"user",content:j,id:Date.now()},C=Date.now()+1;n(N=>[...N,me,{role:"assistant",content:"",items:null,loading:!0,id:C}]);try{let N=await fetch(`${e}/api/faq-ai-bot/ask`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({question:j,history:c.slice(-4).map(p=>({role:p.role,content:p.content}))}),signal:F.current.signal});if(!N.ok)throw new Error("Network response was not ok");let $=N.body?.getReader(),z=new TextDecoder;if(!$)throw new Error("No reader available");let B=[],q=!1,pe=(async()=>{for(;!q||B.length>0;)if(B.length>0){let p=B.shift();if(p?.type==="text")if(s&&s>0)for(let l of p.content)n(b=>b.map(g=>g.id===C?{...g,content:g.content+l}:g)),await new Promise(b=>setTimeout(b,s));else n(l=>l.map(b=>b.id===C?{...b,content:b.content+p.content}:b));else if(p?.type==="card")try{let l=p.data;n(b=>b.map(g=>g.id===C?{...g,items:{items:l.items,schema:l.schema,collection:l.title,title:l.title,cardStyle:l.cardStyle}}:g))}catch(l){console.error("Error processing card data:",l)}}else await new Promise(p=>setTimeout(p,20));a(!1),n(p=>p.map(l=>l.id===C?{...l,loading:!1}:l))})(),H="";for(;;){let{value:p,done:l}=await $.read();if(l)break;let b=z.decode(p,{stream:!0});H+=b;let g=H.split(`
|
|
1
|
+
"use client";import{useState as D,useEffect as re,useRef as ae}from"react";import{jsx as u,jsxs as Q}from"react/jsx-runtime";var R={MessageCircle:({size:e=24,className:t=""})=>u("svg",{width:e,height:e,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",className:t,children:u("path",{d:"M7.9 20A9 9 0 1 0 4 16.1L2 22Z"})}),Bot:({size:e=24,className:t=""})=>u("svg",{width:e,height:e,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",className:t,children:u("path",{d:"M12 8V4m8 4V4M4 8V4M2 11h20m-1 0v10a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V11m5 5v2m8-2v2"})}),X:({size:e=24,className:t=""})=>u("svg",{width:e,height:e,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",className:t,children:u("path",{d:"M18 6 6 18M6 6l12 12"})}),Send:({size:e=24,className:t=""})=>Q("svg",{width:e,height:e,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",className:t,children:[u("path",{d:"m22 2-7 20-4-9-9-4Z"}),u("path",{d:"M22 2 11 13"})]}),Sparkles:({size:e=24,className:t=""})=>Q("svg",{width:e,height:e,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",className:t,children:[u("path",{d:"M12 2l1.8 4.6L18 8l-4.2 1.4L12 14l-1.8-4.6L6 8l4.2-1.4L12 2z"}),u("path",{d:"M5 16l.9 2.3L8 19l-2.1.7L5 22l-.9-2.3L2 19l2.1-.7L5 16z"}),u("path",{d:"M19 14l.9 2.3L22 17l-2.1.7L19 20l-.9-2.3L16 17l2.1-.7L19 14z"})]})};import{jsx as $,jsxs as be}from"react/jsx-runtime";var ge=({isExpanded:e,onOpen:t,theming:n})=>$("div",{onClick:t,className:`chat-floating-btn ${e?"chat-btn-hidden":"chat-btn-visible"}`,children:$("div",{className:"chat-btn-border seamless-border",children:be("div",{className:"chat-btn-inner",children:[$("div",{className:"chat-btn-gradient",style:{background:n?.showGradient===!1?"var(--cb-primary)":"linear-gradient(135deg, var(--cb-primary)0%, var(--cb-secondary)100%)"}}),$(R.Sparkles,{size:30,className:"chat-btn-icon"})]})})}),V=ge;import{useEffect as ue,useState as we}from"react";var L=(e,t)=>t?`${e} ${t}`:e;import{jsx as k,jsxs as K}from"react/jsx-runtime";var xe=({onClose:e,title:t,theming:n,strapiUrl:r})=>{let[d,m]=we(null);ue(()=>{if(!r)return;(async()=>{try{let o=await(await fetch(`${r}/api/faq-ai-bot/suggestion-and-logo`)).json();o?.logoUrl&&m(`${r}${o.logoUrl}`)}catch(a){console.error("Failed to fetch logo",a)}})()},[r]);let i=L("chat-header",n?.header);return K("header",{className:i,style:n?.headerStyle,children:[K("div",{className:"chat-header-left",children:[k("div",{className:"chat-header-logo-placeholder",children:t?.charAt(0)?.toUpperCase()}),k("div",{className:"chat-header-title-wrap",children:k("div",{className:"chat-header-title-row",children:k("span",{className:"chat-header-title",children:t})})})]}),k("div",{className:"chat-header-actions",children:k("button",{onClick:e,className:"chat-header-close-btn","aria-label":"Close chat",children:k(R.X,{size:20})})})]})},H=xe;import{useRef as ye,useEffect as ve}from"react";import{jsx as y,jsxs as Ce}from"react/jsx-runtime";var ke=({input:e,onInputChange:t,onSendMessage:n,isLoading:r,theming:d})=>{let m=d?.showGradient===!1?"var(--cb-primary)":"linear-gradient(135deg, var(--cb-primary) 0%, var(--cb-secondary) 100%)",l=ye(null),g=L("chat-input-container",d?.input);ve(()=>{r||l.current?.focus()},[r]);let a=s=>{s.key==="Enter"&&!s.nativeEvent.isComposing&&o()},o=()=>{e.trim()&&!r&&n()};return y("div",{className:"chat-input-outer",children:y("div",{className:"chat-input-wrap",children:Ce("div",{className:"chat-input-row",children:[y("div",{className:g,style:{...d?.inputStyle,borderRadius:"9999px"},children:y("div",{className:"chat-input-inner",children:y("input",{ref:l,type:"text",className:"chat-input-field",placeholder:r?"AI is thinking...":"Type a message...",value:e,onChange:s=>t(s.target.value),onKeyDown:a,disabled:r,"aria-label":"User message"})})}),y("button",{onClick:o,disabled:r||!e.trim(),style:{background:m},className:"chat-input-send-btn","aria-label":"Send message",children:r?y("div",{className:"chat-input-spinner"}):y(R.Send,{className:"chat-input-send-icon"})})]})})})},O=ke;import{useEffect as Me}from"react";import Ie from"react-markdown";import Se from"remark-gfm";import J from"react-markdown";import X from"remark-gfm";import{jsx as p,jsxs as P}from"react/jsx-runtime";var Ne=({message:e,cardRegistry:t,themeStyles:n,theming:r,title:d})=>{let m=new Date().toLocaleTimeString([],{hour:"2-digit",minute:"2-digit",hour12:!0}).toLowerCase(),l=a=>{let o=a?.__collectionUid?.split(".").pop()?.toLowerCase();return t.find(s=>s.id===o)||t.find(s=>s.id==="default")},i=e.record?l(e.record)?.component:null,g={background:r?.showGradient===!1?"#3B82F6":"linear-gradient(135deg, #1D4ED8 0%, #3B82F6 100%)"};if(e.items?.items?.length){let a=e.items.cardStyle?.toLowerCase()||e.items.collection?.toLowerCase()||e.items.title?.toLowerCase(),s=t.find(x=>x.id===a)?.component;return P("div",{className:"mb-card-container",children:[e.content&&p("div",{className:"mb-card-content",children:p(J,{remarkPlugins:[X],children:e.content})}),s&&e.items.items.map((x,C)=>p(s,{items:x,style:n},C))]})}return P("div",{className:`mb-row ${e.role==="user"?"mb-row-user":"mb-row-assistant"}`,children:[i&&e.record?p("div",{className:"mb-card-wrapper",children:p(i,{record:e.record,style:n})}):p("div",{style:e.role==="user"?{...g,...r?.userBubbleStyle}:{},className:`mb-bubble ${e.role==="user"?"mb-bubble-user":"mb-bubble-assistant"}`,children:e.loading&&!e.content?P("div",{className:"mb-typing",children:[p("span",{className:"mb-dot mb-dot-1"}),p("span",{className:"mb-dot mb-dot-2"}),p("span",{className:"mb-dot mb-dot-3"})]}):p("div",{className:"mb-content-wrapper",children:p(J,{remarkPlugins:[X],children:e.content||""})})}),e.role==="assistant"&&!i&&P("div",{className:"mb-assistant-meta",children:[p("span",{className:"mb-assistant-avatar",style:{background:r?.showGradient===!1?"#3B82F6":"linear-gradient(135deg, var(--cb-primary), var(--cb-secondary))"},children:d?.charAt(0)?.toUpperCase()}),p("span",{className:"mb-assistant-time",children:m})]}),e.role==="user"&&!i&&P("div",{className:"mb-user-meta",children:[p("span",{className:"mb-user-time",children:m}),p("span",{className:"mb-user-tick","aria-label":"Delivered",children:"\u2713\u2713"})]})]})},W=Ne;import{jsx as z,jsxs as U}from"react/jsx-runtime";var Re=({messages:e,scrollRef:t,resolvedRegistry:n,theming:r,title:d})=>{let m=r?.welcomeDescription||"Hi! I'm Aria, your Harbour Air travel assistant. I'm here to help you book flights, check fees, understand baggage rules, and anything else you need.",l=new Date().toLocaleTimeString([],{hour:"2-digit",minute:"2-digit",hour12:!0}).toLowerCase();return Me(()=>{let i=t.current;i&&i.scrollTo({top:i.scrollHeight,behavior:"auto"})},[e,t]),U("div",{ref:t,className:"chat-messages-container",style:{scrollbarWidth:"none",msOverflowStyle:"none"},children:[e.length===0&&z("div",{className:"chat-welcome",children:U("div",{className:"chat-welcome-message",children:[z("p",{className:"chat-welcome-subtitle",children:z(Ie,{remarkPlugins:[Se],children:m})}),U("div",{className:"chat-welcome-meta",children:[z("span",{className:"chat-welcome-avatar",style:{background:r?.showGradient===!1?"#3B82F6":"linear-gradient(135deg, var(--cb-primary), var(--cb-secondary))"},children:d?.charAt(0)?.toUpperCase()}),z("span",{className:"chat-welcome-time",children:l})]})]})}),e.map(i=>z(W,{message:i,cardRegistry:n,themeStyles:{"--cb-primary":r?.primaryColor||"#2999d6","--cb-secondary":r?.secondaryColor||"#179fa3","--cb-accent":r?.accentColor||r?.secondaryColor||"#179fa3"},theming:r},i.id))]})},Z=Re;import{useState as _,useEffect as Le}from"react";import{jsx as w,jsxs as Be}from"react/jsx-runtime";var ze=({strapiUrl:e,onSelectQuestion:t,variant:n,theming:r})=>{let[d,m]=_([]),[l,i]=_(!0);Le(()=>{let a=new AbortController;return i(!0),fetch(`${e}/api/faq-ai-bot/suggestion-and-logo`,{signal:a.signal}).then(o=>o.json()).then(o=>{m(o.suggestedQuestions||[]),i(!1)}).catch(o=>{o.name!=="AbortError"&&(console.error("Suggestions fetch failed",o),i(!1))}),()=>a.abort()},[e]);let g=()=>n==="floating"?Be("div",{className:"sug-skeleton-float",children:[[1,2].map(a=>w("div",{className:"sug-skeleton-item",style:{backgroundColor:r?.primaryColor?`${r.primaryColor}`:"hsla(178, 100%, 51%, 0.05)",transform:a%2===0?"rotate(1deg)":"rotate(-1deg)"}},a)),w("div",{className:"sug-skeleton-more"})]}):w("div",{className:"sug-skeleton-list",children:[1,2,3].map(a=>w("div",{className:"sug-skeleton-chip"},a))});return l&&d.length===0?w(g,{}):n==="floating"?w("div",{className:"sug-float-wrap",children:d.map((a,o)=>w("button",{onClick:()=>t(a),className:"sug-float-btn",style:{borderColor:"#bfdbfe",animationDelay:`${o*.1}s`},children:w("span",{className:"sug-float-text",children:a})},`float-${o}-${a}`))}):w("div",{className:"sug-list-wrap",children:d.map((a,o)=>w("button",{onClick:()=>t(a),className:"sug-list-btn",style:{animationDelay:`${o*.05}s`},children:a},`list-${o}-${a}`))})},Y=ze;import{jsx as v,jsxs as ee}from"react/jsx-runtime";var Ee=({isExpanded:e,setIsExpanded:t,messages:n,scrollRef:r,sendMessage:d,strapiUrl:m,resolvedRegistry:l,input:i,setInput:g,isLoading:a,title:o,theming:s})=>{let x=L(`chat-window ${e?"chat-window-open":"chat-window-closed"}`,s?.container);return ee("div",{className:x,style:s?.containerStyle,children:[v("div",{className:"chat-window-header",children:v(H,{title:o,onClose:()=>t(!1),theming:s,strapiUrl:m})}),v(Z,{messages:n,scrollRef:r,resolvedRegistry:l,theming:s}),ee("div",{className:"chat-window-footer",children:[v("div",{className:"chat-window-suggestions",children:v(Y,{onSelectQuestion:d,strapiUrl:m,variant:"floating",theming:s})}),v(O,{input:i,onInputChange:g,onSendMessage:d,isLoading:a,theming:s}),v("div",{className:"chat-window-powered",children:v("span",{className:"chat-powered-text",children:"Talk to a human \xB7 Privacy policy"})})]})]})},te=Ee;import{jsx as oe,jsxs as Pe}from"react/jsx-runtime";var Te=({strapiUrl:e,cardRegistry:t,theme:n,title:r,streamSpeed:d})=>{let[m,l]=D([]),[i,g]=D(""),[a,o]=D(!1),[s,x]=D(!1),C=ae(null),[ie,se]=D([]),de=ae(null),le={"--cb-primary":n?.primaryColor||"#2999d6","--cb-secondary":n?.secondaryColor||"#179fa3","--cb-accent":n?.accentColor||n?.secondaryColor||"#179fa3"};return re(()=>{t.length>0&&se(t)},[t]),re(()=>()=>C.current?.abort(),[]),Pe("div",{className:"chatbot-container",style:le,children:[oe(V,{isExpanded:s,onOpen:()=>x(!0),theming:n}),oe(te,{isExpanded:s,setIsExpanded:x,messages:m,scrollRef:de,sendMessage:async ce=>{let j=ce||i;if(!j.trim())return;C.current?.abort(),C.current=new AbortController,x(!0),g(""),o(!0);let me={role:"user",content:j,id:Date.now()},N=Date.now()+1;l(M=>[...M,me,{role:"assistant",content:"",items:null,loading:!0,id:N}]);try{let M=await fetch(`${e}/api/faq-ai-bot/ask`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({question:j,history:m.slice(-4).map(h=>({role:h.role,content:h.content}))}),signal:C.current.signal});if(!M.ok)throw new Error("Network response was not ok");let F=M.body?.getReader(),B=new TextDecoder;if(!F)throw new Error("No reader available");let E=[],G=!1,pe=(async()=>{for(;!G||E.length>0;)if(E.length>0){let h=E.shift();if(h?.type==="text")if(d&&d>0)for(let c of h.content)l(f=>f.map(b=>b.id===N?{...b,content:b.content+c}:b)),await new Promise(f=>setTimeout(f,d));else l(c=>c.map(f=>f.id===N?{...f,content:f.content+h.content}:f));else if(h?.type==="card")try{let c=h.data;l(f=>f.map(b=>b.id===N?{...b,items:{items:c.items,schema:c.schema,collection:c.title,title:c.title,cardStyle:c.cardStyle}}:b))}catch(c){console.error("Error processing card data:",c)}}else await new Promise(h=>setTimeout(h,20));o(!1),l(h=>h.map(c=>c.id===N?{...c,loading:!1}:c))})(),A="";for(;;){let{value:h,done:c}=await F.read();if(c)break;let f=B.decode(h,{stream:!0});A+=f;let b=A.split(`
|
|
2
2
|
|
|
3
|
-
`);
|
|
4
|
-
`),
|
|
5
|
-
`:"")+
|
|
3
|
+
`);A=b.pop()||"";for(let he of b){let fe=he.split(`
|
|
4
|
+
`),q="message",T="";for(let I of fe)if(I.startsWith("event:"))q=I.slice(6).trim();else if(I.startsWith("data:")){let S=I.slice(5);if(S.startsWith(" ")&&(S=S.slice(1)),S.trim()==="[DONE]"||S.trim()==="[Done]")continue;T+=(T?`
|
|
5
|
+
`:"")+S}if(q==="cards"){let I=JSON.parse(T);E.push({type:"card",data:I})}else T&&E.push({type:"text",content:T})}}G=!0,await pe}catch(M){M.name!=="AbortError"&&l(F=>F.map(B=>B.id===N?{...B,content:"I'm sorry, I'm having trouble connecting right now.",loading:!1}:B)),o(!1)}},strapiUrl:e,resolvedRegistry:ie,input:i,setInput:g,isLoading:a,title:r,theming:n})]})},ne=Te;export{ne as ChatBot,H as ChatHeader,O as ChatInput,ne as Chatbot,R as ICONS,W as MessageBubble,Y as Suggestions};
|