diff --git a/404.html b/404.html index 8ffd0ca58..f2066d5fb 100644 --- a/404.html +++ b/404.html @@ -13,7 +13,7 @@ - + diff --git a/assets/js/c214479d.031ee1fe.js b/assets/js/c214479d.031ee1fe.js deleted file mode 100644 index e431ced87..000000000 --- a/assets/js/c214479d.031ee1fe.js +++ /dev/null @@ -1 +0,0 @@ -"use strict";(self.webpackChunkwebsite=self.webpackChunkwebsite||[]).push([[3555],{88096:(e,s,n)=>{n.r(s),n.d(s,{assets:()=>p,contentTitle:()=>x,default:()=>g,frontMatter:()=>h,metadata:()=>u,toc:()=>m});var r=n(74848),a=n(28453),l=n(24033),t=n(50363),i=n(15781),o=n(78478),d=n(19365),c=n(11470);const h={sidebar_position:6},x="Messages",u={id:"docs/messages/messages",title:"Messages",description:"Properties related to messages.",source:"@site/docs/docs/messages/messages.mdx",sourceDirName:"docs/messages",slug:"/docs/messages/",permalink:"/docs/messages/",draft:!1,unlisted:!1,editUrl:"https://github.com/OvidijusParsiunas/deep-chat/tree/main/website/docs/docs/messages/messages.mdx",tags:[],version:"current",sidebarPosition:6,frontMatter:{sidebar_position:6},sidebar:"docs",previous:{title:"Styles",permalink:"/docs/styles"},next:{title:"Styles",permalink:"/docs/messages/styles"}},p={},m=[{value:"history",id:"history",level:3},{value:"Example",id:"example",level:4},{value:"introMessage",id:"introMessage",level:3},{value:"Example",id:"example-1",level:4},{value:"avatars",id:"avatars",level:3},{value:"Example",id:"example-2",level:4},{value:"Avatar",id:"Avatar",level:4},{value:"Example",id:"example-3",level:4},{value:"names",id:"names",level:3},{value:"Example",id:"example-4",level:4},{value:"Name",id:"Name",level:4},{value:"Example",id:"example-5",level:4},{value:"displayLoadingBubble",id:"displayLoadingBubble",level:3},{value:"Example",id:"example-6",level:4},{value:"errorMessages",id:"errorMessages",level:3},{value:"Example",id:"example-7",level:4},{value:"Types",id:"types",level:2},{value:"MessageContent",id:"MessageContent",level:3},{value:"Example",id:"example-8",level:4},{value:"MessageRole",id:"MessageRole",level:3},{value:"MessageFile",id:"MessageFile",level:3},{value:"Example",id:"example-9",level:4},{value:"MessageFileType",id:"MessageFileType",level:3},{value:"Code messages",id:"code-messages",level:2},{value:"Example",id:"example-10",level:4}];function j(e){const s={a:"a",admonition:"admonition",code:"code",em:"em",h1:"h1",h2:"h2",h3:"h3",h4:"h4",header:"header",li:"li",p:"p",pre:"pre",ul:"ul",...(0,a.R)(),...e.components};return(0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)(s.header,{children:(0,r.jsx)(s.h1,{id:"messages",children:"Messages"})}),"\n",(0,r.jsx)(s.p,{children:"Properties related to messages."}),"\n",(0,r.jsx)(s.h3,{id:"history",children:(0,r.jsx)(s.code,{children:"history"})}),"\n",(0,r.jsxs)(s.ul,{children:["\n",(0,r.jsxs)(s.li,{children:["Type: ",(0,r.jsx)(s.a,{href:"#MessageContent",children:(0,r.jsx)(s.code,{children:"MessageContent[]"})})]}),"\n"]}),"\n",(0,r.jsxs)(s.p,{children:["Messages that are pre-populated when the chat loads up. Use ",(0,r.jsx)(s.a,{href:"/docs/interceptors#loadHistory",children:(0,r.jsx)(s.code,{children:"loadHistory"})})," to load messages asynchronously. ",(0,r.jsx)("br",{})]}),"\n","\n",(0,r.jsx)(o.A,{children:()=>n(61886).readdAutoNavShadowToggle()}),"\n",(0,r.jsx)(o.A,{children:()=>n(9475).OI()}),"\n",(0,r.jsx)(s.h4,{id:"example",children:"Example"}),"\n",(0,r.jsx)(l.A,{children:(0,r.jsx)(t.A,{demo:!0,history:[{text:"Show me a modern city",role:"user"},{files:[{src:"/img/city.jpeg",type:"image"}],role:"ai"},{text:"Whats on your mind?",role:"user"},{text:"Peace and tranquility",role:"ai"}],style:{height:"370px",borderRadius:"8px"}})}),"\n",(0,r.jsxs)(c.A,{children:[(0,r.jsx)(d.A,{value:"js",label:"Sample code",children:(0,r.jsx)(s.pre,{children:(0,r.jsx)(s.code,{className:"language-html",children:'\n'})})}),(0,r.jsx)(d.A,{value:"py",label:"Full code",children:(0,r.jsx)(s.pre,{children:(0,r.jsx)(s.code,{className:"language-html",children:'\x3c!-- This example is for Vanilla JS and should be tailored to your framework (see Examples) --\x3e\n\n\n'})})})]}),"\n",(0,r.jsx)(i.A,{}),"\n",(0,r.jsx)(s.h3,{id:"introMessage",children:(0,r.jsx)(s.code,{children:"introMessage"})}),"\n",(0,r.jsxs)(s.ul,{children:["\n",(0,r.jsxs)(s.li,{children:["Type: {",(0,r.jsx)(s.code,{children:"text?: string"}),", ",(0,r.jsx)(s.code,{children:"html?: string"}),"}"]}),"\n"]}),"\n",(0,r.jsxs)(s.p,{children:["Initial ",(0,r.jsx)(s.code,{children:"ai"})," message that is displayed when the chat is loaded. It is different to ",(0,r.jsx)(s.a,{href:"#history",children:(0,r.jsx)(s.code,{children:"history"})})," as it will not trigger\nthe ",(0,r.jsx)(s.a,{href:"/docs/events#onMessage",children:(0,r.jsx)(s.code,{children:"onMessage"})})," listener, will not be part of the returned messages when ",(0,r.jsx)(s.a,{href:"/docs/methods#getMessages",children:(0,r.jsx)(s.code,{children:"getMessages"})})," is called and\nis not taken into consideration when calculating ",(0,r.jsx)(s.a,{href:"/docs/connect#requestBodyLimits",children:(0,r.jsx)(s.code,{children:"requestBodyLimits"})}),". ",(0,r.jsx)("br",{}),"\n",(0,r.jsx)(s.code,{children:"html"})," is used to render ",(0,r.jsx)(s.a,{href:"/docs/messages/HTML",children:"custom code"})," and can be coupled with a ",(0,r.jsx)(s.a,{href:"/docs/messages/HTML#deepChatClasses",children:(0,r.jsx)(s.code,{children:"deep-chat-temporary-message"})}),"\nclass to make this message disappear after a new one is added."]}),"\n",(0,r.jsx)(s.h4,{id:"example-1",children:"Example"}),"\n",(0,r.jsx)(l.A,{children:(0,r.jsx)(t.A,{style:{borderRadius:"8px"},introMessage:{text:"Hi I am your assistant, ask me anything!"},demo:!0})}),"\n",(0,r.jsxs)(c.A,{children:[(0,r.jsx)(d.A,{value:"js",label:"Sample code",children:(0,r.jsx)(s.pre,{children:(0,r.jsx)(s.code,{className:"language-html",children:'\n'})})}),(0,r.jsx)(d.A,{value:"py",label:"Full code",children:(0,r.jsx)(s.pre,{children:(0,r.jsx)(s.code,{className:"language-html",children:'\x3c!-- This example is for Vanilla JS and should be tailored to your framework (see Examples) --\x3e\n\n\n'})})})]}),"\n",(0,r.jsx)(i.A,{}),"\n",(0,r.jsx)(s.h3,{id:"avatars",children:(0,r.jsx)(s.code,{children:"avatars"})}),"\n",(0,r.jsxs)(s.ul,{children:["\n",(0,r.jsxs)(s.li,{children:["Type: ",(0,r.jsx)(s.code,{children:"true"})," | {",(0,r.jsx)(s.a,{href:"#Avatar",children:(0,r.jsx)(s.code,{children:"default?: Avatar"})}),", ",(0,r.jsx)(s.a,{href:"#Avatar",children:(0,r.jsx)(s.code,{children:"ai?: Avatar"})}),", ",(0,r.jsx)(s.a,{href:"#Avatar",children:(0,r.jsx)(s.code,{children:"user?: Avatar"})}),", ",(0,r.jsx)(s.a,{href:"#Avatar",children:(0,r.jsx)(s.code,{children:"[custom]?: Avatar"})}),"}"]}),"\n"]}),"\n",(0,r.jsxs)(s.p,{children:["Add avatars beside messages. You can enable this by setting the value to ",(0,r.jsx)(s.em,{children:"true"}),"\nor by defining an object with ",(0,r.jsx)(s.a,{href:"#Avatar",children:(0,r.jsx)(s.code,{children:"Avatar"})})," properties. The ",(0,r.jsx)(s.code,{children:"default"})," property is applied to all roles.\n",(0,r.jsx)(s.code,{children:"custom"})," roles (e.g. ",(0,r.jsx)(s.code,{children:'"bob"'}),") use ",(0,r.jsx)(s.code,{children:"ai"})," styling by default. ",(0,r.jsx)("br",{})]}),"\n",(0,r.jsx)(s.h4,{id:"example-2",children:"Example"}),"\n",(0,r.jsx)(l.A,{children:(0,r.jsx)(t.A,{style:{borderRadius:"8px"},history:[{text:"Hey, how are you?",role:"user"},{text:"I am doing great, how about you?",role:"ai"},{text:"What is the meaning of life?",role:"user"},{text:"This ultimately depends on the person, but it could be the pursuit of happiness or fulfillment.",role:"ai"}],demo:!0,avatars:!0})}),"\n",(0,r.jsxs)(c.A,{children:[(0,r.jsx)(d.A,{value:"js",label:"Sample code",children:(0,r.jsx)(s.pre,{children:(0,r.jsx)(s.code,{className:"language-html",children:'\n'})})}),(0,r.jsx)(d.A,{value:"py",label:"Full code",children:(0,r.jsx)(s.pre,{children:(0,r.jsx)(s.code,{className:"language-html",children:'\x3c!-- This example is for Vanilla JS and should be tailored to your framework (see Examples) --\x3e\n\n\n'})})})]}),"\n",(0,r.jsx)(i.A,{}),"\n",(0,r.jsx)(s.h4,{id:"Avatar",children:(0,r.jsx)(s.code,{children:"Avatar"})}),"\n",(0,r.jsxs)(s.ul,{children:["\n",(0,r.jsxs)(s.li,{children:["Type: {",(0,r.jsx)("br",{}),"\n\xa0\xa0\xa0\xa0 ",(0,r.jsx)(s.code,{children:"src?: string"}),", ",(0,r.jsx)("br",{}),"\n\xa0\xa0\xa0\xa0 ",(0,r.jsx)(s.code,{children:"styles?: {"})," ",(0,r.jsx)("br",{}),"\n\xa0\xa0\xa0\xa0\xa0\xa0\xa0\xa0 ",(0,r.jsx)(s.a,{href:"/docs/styles#CustomStyle",children:(0,r.jsx)(s.code,{children:"avatar?: CustomStyle"})}),", ",(0,r.jsx)("br",{}),"\n\xa0\xa0\xa0\xa0\xa0\xa0\xa0\xa0 ",(0,r.jsx)(s.a,{href:"/docs/styles#CustomStyle",children:(0,r.jsx)(s.code,{children:"container?: CustomStyle"})})," ",(0,r.jsx)("br",{}),"\n\xa0\xa0\xa0\xa0\xa0\xa0\xa0\xa0 ",(0,r.jsx)(s.code,{children:'position?: "left" | "right"'})," ",(0,r.jsx)("br",{}),"\n}}"]}),"\n"]}),"\n",(0,r.jsxs)(s.p,{children:["This object is used to configure avatars that are displayed beside messages. ",(0,r.jsx)("br",{}),"\n",(0,r.jsx)(s.code,{children:"src"})," is the path to an avatar image file. ",(0,r.jsx)("br",{}),"\n",(0,r.jsx)(s.code,{children:"avatar"})," property is used to configure the avatar element's styling. ",(0,r.jsx)("br",{}),"\n",(0,r.jsx)(s.code,{children:"container"})," is used to style the element that encapsulates the avatar element. ",(0,r.jsx)("br",{}),"\n",(0,r.jsx)(s.code,{children:"position"})," defines which side of the message the avatar is going to be displayed on."]}),"\n",(0,r.jsx)(s.h4,{id:"example-3",children:"Example"}),"\n",(0,r.jsx)(l.A,{children:(0,r.jsx)(t.A,{style:{borderRadius:"8px"},history:[{text:"What is the meaning of life?",role:"user"},{text:"This ultimately depends on the person, but it could be the pursuit of happiness or fulfillment.",role:"ai"},{text:"We dont laugh because we feel good, we feel good because we laugh.",role:"bob"}],avatars:{default:{styles:{avatar:{height:"30px",width:"30px"},container:{marginTop:"8px"}}},ai:{src:"/img/ai-brain.svg",styles:{avatar:{marginLeft:"-3px"}}},bob:{src:"/img/bob.png",styles:{avatar:{borderRadius:"15px",filter:"brightness(1.3)"}}}},demo:!0})}),"\n",(0,r.jsxs)(c.A,{children:[(0,r.jsx)(d.A,{value:"js",label:"Sample code",children:(0,r.jsx)(s.pre,{children:(0,r.jsx)(s.code,{className:"language-html",children:'\n'})})}),(0,r.jsx)(d.A,{value:"py",label:"Full code",children:(0,r.jsx)(s.pre,{children:(0,r.jsx)(s.code,{className:"language-html",children:'\x3c!-- This example is for Vanilla JS and should be tailored to your framework (see Examples) --\x3e\n\n\n'})})})]}),"\n",(0,r.jsx)(i.A,{}),"\n",(0,r.jsx)(s.h3,{id:"names",children:(0,r.jsx)(s.code,{children:"names"})}),"\n",(0,r.jsxs)(s.ul,{children:["\n",(0,r.jsxs)(s.li,{children:["Type: ",(0,r.jsx)(s.code,{children:"true"})," | {",(0,r.jsx)(s.a,{href:"#Name",children:(0,r.jsx)(s.code,{children:"default?: Name"})}),", ",(0,r.jsx)(s.a,{href:"#Name",children:(0,r.jsx)(s.code,{children:"ai?: Name"})}),", ",(0,r.jsx)(s.a,{href:"#Name",children:(0,r.jsx)(s.code,{children:"user?: Name"})}),", ",(0,r.jsx)(s.a,{href:"#Name",children:(0,r.jsx)(s.code,{children:"[custom]?: Name"})}),"}"]}),"\n"]}),"\n",(0,r.jsxs)(s.p,{children:["Add names beside messages. You can enable this by setting the value to ",(0,r.jsx)(s.em,{children:"true"}),"\nor by defining an object with ",(0,r.jsx)(s.a,{href:"#Name",children:(0,r.jsx)(s.code,{children:"Name"})})," properties. The ",(0,r.jsx)(s.code,{children:"default"})," property is applied to all roles.\n",(0,r.jsx)(s.code,{children:"custom"})," roles (e.g. ",(0,r.jsx)(s.code,{children:'"bob"'}),") use ",(0,r.jsx)(s.code,{children:"ai"})," styling by default. ",(0,r.jsx)("br",{})]}),"\n",(0,r.jsx)(s.h4,{id:"example-4",children:"Example"}),"\n",(0,r.jsx)(l.A,{children:(0,r.jsx)(t.A,{style:{borderRadius:"8px"},history:[{text:"Hey, how are you?",role:"user"},{text:"I am doing great!",role:"ai"},{text:"Motivate me",role:"user"},{text:"Talent is a pursued interest. Anything you\u2019re willing to practice, you can do.",role:"Bob"}],demo:!0,names:!0})}),"\n",(0,r.jsxs)(c.A,{children:[(0,r.jsx)(d.A,{value:"js",label:"Sample code",children:(0,r.jsx)(s.pre,{children:(0,r.jsx)(s.code,{className:"language-html",children:'\n'})})}),(0,r.jsx)(d.A,{value:"py",label:"Full code",children:(0,r.jsx)(s.pre,{children:(0,r.jsx)(s.code,{className:"language-html",children:'\x3c!-- This example is for Vanilla JS and should be tailored to your framework (see Examples) --\x3e\n\n\n'})})})]}),"\n",(0,r.jsx)(i.A,{}),"\n",(0,r.jsx)(s.h4,{id:"Name",children:(0,r.jsx)(s.code,{children:"Name"})}),"\n",(0,r.jsxs)(s.ul,{children:["\n",(0,r.jsxs)(s.li,{children:["Type: {",(0,r.jsx)("br",{}),"\n\xa0\xa0\xa0\xa0 ",(0,r.jsx)(s.code,{children:"text?: string"}),", ",(0,r.jsx)("br",{}),"\n\xa0\xa0\xa0\xa0 ",(0,r.jsx)(s.a,{href:"/docs/styles#CustomStyle",children:(0,r.jsx)(s.code,{children:"style?: CustomStyle"})}),", ",(0,r.jsx)("br",{}),"\n\xa0\xa0\xa0\xa0 ",(0,r.jsx)(s.code,{children:'position?: "left" | "right"'})," ",(0,r.jsx)("br",{}),"\n}"]}),"\n"]}),"\n",(0,r.jsxs)(s.p,{children:["This object is used to configure names that are displayed beside messages. ",(0,r.jsx)("br",{}),"\n",(0,r.jsx)(s.code,{children:"text"})," is the string used for the name. ",(0,r.jsx)("br",{}),"\n",(0,r.jsx)(s.code,{children:"style"})," is used to define the style of the name element. ",(0,r.jsx)("br",{}),"\n",(0,r.jsx)(s.code,{children:"position"})," defines which side of the message the name is going to be displayed."]}),"\n",(0,r.jsx)(s.h4,{id:"example-5",children:"Example"}),"\n",(0,r.jsx)(l.A,{children:(0,r.jsx)(t.A,{style:{borderRadius:"8px"},history:[{text:"Hey, how are you?",role:"user"},{text:"I am doing great!",role:"ai"},{text:"Motivate me",role:"user"},{text:"Talent is a pursued interest. Anything you\u2019re willing to practice, you can do.",role:"Bob"}],demo:!0,names:{default:{style:{fontSize:"18px",marginTop:"14px",width:"32px"}},ai:{text:"You"},user:{text:"Me"},Bob:{style:{color:"green"}}}})}),"\n",(0,r.jsxs)(c.A,{children:[(0,r.jsx)(d.A,{value:"js",label:"Sample code",children:(0,r.jsx)(s.pre,{children:(0,r.jsx)(s.code,{className:"language-html",children:'\n'})})}),(0,r.jsx)(d.A,{value:"py",label:"Full code",children:(0,r.jsx)(s.pre,{children:(0,r.jsx)(s.code,{className:"language-html",children:'\x3c!-- This example is for Vanilla JS and should be tailored to your framework (see Examples) --\x3e\n\n\n'})})})]}),"\n",(0,r.jsx)(i.A,{}),"\n",(0,r.jsx)(s.h3,{id:"displayLoadingBubble",children:(0,r.jsx)(s.code,{children:"displayLoadingBubble"})}),"\n",(0,r.jsxs)(s.ul,{children:["\n",(0,r.jsxs)(s.li,{children:["Type: ",(0,r.jsx)(s.code,{children:"boolean"})]}),"\n"]}),"\n",(0,r.jsx)(s.p,{children:"Toggle whether the loading bubble should be displayed when waiting for a message response."}),"\n",(0,r.jsx)(s.h4,{id:"example-6",children:"Example"}),"\n",(0,r.jsx)(l.A,{children:(0,r.jsx)(t.A,{style:{borderRadius:"8px"},introMessage:{text:"Send a new message to observe a response with no loading bubble."},displayLoadingBubble:!1,demo:!0})}),"\n",(0,r.jsxs)(c.A,{children:[(0,r.jsx)(d.A,{value:"js",label:"Sample code",children:(0,r.jsx)(s.pre,{children:(0,r.jsx)(s.code,{className:"language-html",children:'\n'})})}),(0,r.jsx)(d.A,{value:"py",label:"Full code",children:(0,r.jsx)(s.pre,{children:(0,r.jsx)(s.code,{className:"language-html",children:'\x3c!-- This example is for Vanilla JS and should be tailored to your framework (see Examples) --\x3e\n\n\n'})})})]}),"\n",(0,r.jsx)(i.A,{}),"\n",(0,r.jsx)(s.h3,{id:"errorMessages",children:(0,r.jsx)(s.code,{children:"errorMessages"})}),"\n",(0,r.jsxs)(s.ul,{children:["\n",(0,r.jsxs)(s.li,{children:["\n",(0,r.jsxs)(s.p,{children:["Type: {",(0,r.jsx)("br",{}),"\n\xa0\xa0\xa0\xa0 ",(0,r.jsx)(s.code,{children:"displayServiceErrorMessages?: boolean"}),", ",(0,r.jsx)("br",{}),"\n\xa0\xa0\xa0\xa0 ",(0,r.jsx)(s.code,{children:"overrides?:"})," { ",(0,r.jsx)("br",{}),"\n\xa0\xa0\xa0\xa0\xa0\xa0\xa0\xa0 ",(0,r.jsx)(s.code,{children:"default?: string"}),", ",(0,r.jsx)("br",{}),"\n\xa0\xa0\xa0\xa0\xa0\xa0\xa0\xa0 ",(0,r.jsx)(s.code,{children:"service?: string"}),", ",(0,r.jsx)("br",{}),"\n\xa0\xa0\xa0\xa0\xa0\xa0\xa0\xa0 ",(0,r.jsx)(s.code,{children:"speechToText?: string"})," ",(0,r.jsx)("br",{}),"\n}}"]}),"\n"]}),"\n",(0,r.jsxs)(s.li,{children:["\n",(0,r.jsxs)(s.p,{children:["Default: ",(0,r.jsx)(s.em,{children:'{ displayServiceErrorMessages: false, overrides: {default: "Error, please try again." }}'})]}),"\n"]}),"\n"]}),"\n",(0,r.jsxs)(s.p,{children:["Deep Chat automatically displays an error message when something goes wrong. This object is used to control what the message will contain. ",(0,r.jsx)("br",{}),"\n",(0,r.jsx)(s.code,{children:"displayServiceErrorMessages"})," is used to display the full error message that has been returned from the service. ",(0,r.jsx)("br",{}),"\n",(0,r.jsx)(s.code,{children:"overrides"})," is used to overwrite the error message text based on what has caused it: ",(0,r.jsx)(s.code,{children:"default"})," is used for any kind of error, ",(0,r.jsx)(s.code,{children:"service"}),"\nis for communication with the target service and ",(0,r.jsx)(s.code,{children:"speechToText"})," is when there is a problem using the ",(0,r.jsx)(s.a,{href:"/docs/speech#speechToText",children:(0,r.jsx)(s.code,{children:"speechToText"})})," functionality. ",(0,r.jsx)("br",{})]}),"\n",(0,r.jsx)(s.h4,{id:"example-7",children:"Example"}),"\n",(0,r.jsx)(l.A,{children:(0,r.jsx)(t.A,{style:{borderRadius:"8px"},demo:{displayErrors:{default:!0,service:!0,speechToText:!0}},errorMessages:{overrides:{default:"Default error :(",service:"Target service error!",speechToText:"Speech to text microphone error!"}}})}),"\n",(0,r.jsxs)(c.A,{children:[(0,r.jsx)(d.A,{value:"js",label:"Sample code",children:(0,r.jsx)(s.pre,{children:(0,r.jsx)(s.code,{className:"language-html",children:'\n'})})}),(0,r.jsx)(d.A,{value:"py",label:"Full code",children:(0,r.jsx)(s.pre,{children:(0,r.jsx)(s.code,{className:"language-html",children:'\x3c!-- This example is for Vanilla JS and should be tailored to your framework (see Examples) --\x3e\n\n\n'})})})]}),"\n",(0,r.jsx)(i.A,{}),"\n",(0,r.jsx)(s.h2,{id:"types",children:"Types"}),"\n",(0,r.jsx)(s.p,{children:"Shared object property types related to messages:"}),"\n",(0,r.jsx)(s.h3,{id:"MessageContent",children:(0,r.jsx)(s.code,{children:"MessageContent"})}),"\n",(0,r.jsxs)(s.ul,{children:["\n",(0,r.jsxs)(s.li,{children:["Type: {",(0,r.jsx)(s.a,{href:"#MessageRole",children:(0,r.jsx)(s.code,{children:"role?: MessageRole"})}),", ",(0,r.jsx)(s.code,{children:"text?: string"}),", ",(0,r.jsx)(s.a,{href:"#MessageFile",children:(0,r.jsx)(s.code,{children:"files?: MessageFile[]"})}),", ",(0,r.jsx)(s.a,{href:"/docs/messages/HTML",children:(0,r.jsx)(s.code,{children:"html?: string"})}),"}"]}),"\n"]}),"\n",(0,r.jsxs)(s.p,{children:["Object format used to encapsulate a message within the chat. ",(0,r.jsx)("br",{}),"\n",(0,r.jsx)(s.code,{children:"role"})," defines the message sender. If not set it is automatically regarded as ",(0,r.jsx)(s.em,{children:'"ai"'}),". ",(0,r.jsx)("br",{}),"\n",(0,r.jsx)(s.code,{children:"text"})," is string content for a textual message. It uses ",(0,r.jsx)(s.a,{href:"https://www.markdownguide.org/basic-syntax/",children:"Markdown"})," syntax to render the message accordingly which is useful for displaying code snippets,\nparagraphs and more. See this ",(0,r.jsx)(s.a,{href:"https://jonschlinkert.github.io/remarkable/demo/",children:"playground"})," for reference. ",(0,r.jsx)("br",{}),"\n",(0,r.jsx)(s.code,{children:"files"})," is an array that encapsulates details on the response files. ",(0,r.jsx)("br",{}),"\n",(0,r.jsx)(s.code,{children:"html"})," is a string that defines the markup for ",(0,r.jsx)(s.a,{href:"/docs/messages/HTML",children:"custom elements"}),". ",(0,r.jsx)("br",{})]}),"\n",(0,r.jsx)(s.h4,{id:"example-8",children:"Example"}),"\n",(0,r.jsx)(l.A,{children:(0,r.jsx)(t.A,{style:{borderRadius:"8px"},history:[{files:[{src:"/img/bird-2.jpeg",type:"image"}],role:"user"},{text:"This is a nice image of a yellow bird on a branch.",role:"ai"}],demo:!0})}),"\n",(0,r.jsxs)(c.A,{children:[(0,r.jsx)(d.A,{value:"js",label:"Sample code",children:(0,r.jsx)(s.pre,{children:(0,r.jsx)(s.code,{className:"language-html",children:'\n'})})}),(0,r.jsx)(d.A,{value:"py",label:"Full code",children:(0,r.jsx)(s.pre,{children:(0,r.jsx)(s.code,{className:"language-html",children:'\x3c!-- This example is for Vanilla JS and should be tailored to your framework (see Examples) --\x3e\n\n\n'})})})]}),"\n",(0,r.jsx)(i.A,{}),"\n",(0,r.jsx)(s.h3,{id:"MessageRole",children:(0,r.jsx)(s.code,{children:"MessageRole"})}),"\n",(0,r.jsxs)(s.ul,{children:["\n",(0,r.jsxs)(s.li,{children:["Type: ",(0,r.jsx)(s.code,{children:'"ai"'})," | ",(0,r.jsx)(s.code,{children:'"user"'})," | ",(0,r.jsx)(s.code,{children:"[custom]"})]}),"\n"]}),"\n",(0,r.jsxs)(s.p,{children:["Message sender. ",(0,r.jsx)("br",{}),"\n",(0,r.jsx)(s.code,{children:'"user"'})," represents messages sent out from the chat and ",(0,r.jsx)(s.code,{children:'"ai"'})," are messages received from a service. ",(0,r.jsx)("br",{}),"\nYou can also use ",(0,r.jsx)(s.em,{children:"custom"})," roles which represent other entities such as agents (",(0,r.jsx)(s.code,{children:'"ai-1"'}),"/",(0,r.jsx)(s.code,{children:'"ai-2"'}),")\nor users in a group chat (",(0,r.jsx)(s.code,{children:'"bob"'}),"/",(0,r.jsx)(s.code,{children:'"ross"'}),"). You can style them using ",(0,r.jsx)(s.a,{href:"/docs/messages/styles#messageStyles",children:(0,r.jsx)(s.code,{children:"messageStyles"})}),",\n",(0,r.jsx)(s.a,{href:"/docs/messages/#avatars",children:(0,r.jsx)(s.code,{children:"avatars"})})," and ",(0,r.jsx)(s.a,{href:"/docs/messages/#names",children:(0,r.jsx)(s.code,{children:"names"})})," properties."]}),"\n",(0,r.jsx)(i.A,{}),"\n",(0,r.jsx)(s.h3,{id:"MessageFile",children:(0,r.jsx)(s.code,{children:"MessageFile"})}),"\n",(0,r.jsxs)(s.ul,{children:["\n",(0,r.jsxs)(s.li,{children:["Type: {",(0,r.jsx)(s.code,{children:"name?: string"}),", ",(0,r.jsx)(s.code,{children:"src?: string"}),", ",(0,r.jsx)(s.a,{href:"#MessageFileType",children:(0,r.jsx)(s.code,{children:"type?: MessageFileType"})}),", ",(0,r.jsx)(s.a,{href:"https://developer.mozilla.org/en-US/docs/Web/API/File",children:(0,r.jsx)(s.code,{children:"ref?: File"})}),"} ",(0,r.jsx)("br",{})]}),"\n",(0,r.jsxs)(s.li,{children:["Default: ",(0,r.jsx)(s.em,{children:'{name: "file", type: "any"}'})]}),"\n"]}),"\n",(0,r.jsxs)(s.p,{children:["Format that defines the details of a file. ",(0,r.jsx)("br",{}),"\n",(0,r.jsx)(s.code,{children:"name"})," is used to display the file name inside the message bubble (if not image/gif/audio). ",(0,r.jsx)("br",{}),"\n",(0,r.jsx)(s.code,{children:"src"})," is either the ",(0,r.jsx)(s.em,{children:"url"})," path to the file location or the base64 encoding as a string (make sure to use the correct type prefix e.g: ",(0,r.jsx)(s.em,{children:'"data:(type);base64,"'}),").",(0,r.jsx)("br",{}),"\nThe component will automatically try to infer the file type from the ",(0,r.jsx)(s.code,{children:"src"})," property so that it can render its media correctly,\nhowever you can help it by setting the ",(0,r.jsx)(s.code,{children:"type"}),". ",(0,r.jsx)("br",{}),"\n",(0,r.jsx)(s.code,{children:"ref"})," is the actual file's reference. It is only included in ",(0,r.jsx)(s.a,{href:"/docs/events#onMessage",children:(0,r.jsx)(s.code,{children:"onMessage"})})," events. ",(0,r.jsx)("br",{})]}),"\n",(0,r.jsx)(s.h4,{id:"example-9",children:"Example"}),"\n",(0,r.jsx)(l.A,{minHeight:535,children:(0,r.jsx)(t.A,{style:{borderRadius:"8px",height:"480px"},history:[{role:"user",files:[{src:"/img/city.jpeg",type:"image"},{src:"/img/example-gif-1.gif",type:"image"},{src:"/audio/cantinaBand.wav",type:"audio"},{name:"placeholder.exe"},{src:"/text/text.txt",name:"hello-world.txt",type:"file"}]}],demo:!0})}),"\n",(0,r.jsxs)(c.A,{children:[(0,r.jsx)(d.A,{value:"js",label:"Sample code",children:(0,r.jsx)(s.pre,{children:(0,r.jsx)(s.code,{className:"language-html",children:'\n'})})}),(0,r.jsx)(d.A,{value:"py",label:"Full code",children:(0,r.jsx)(s.pre,{children:(0,r.jsx)(s.code,{className:"language-html",children:'\x3c!-- This example is for Vanilla JS and should be tailored to your framework (see Examples) --\x3e\n\n\n'})})})]}),"\n",(0,r.jsx)(i.A,{}),"\n",(0,r.jsx)(s.admonition,{type:"info",children:(0,r.jsxs)(s.p,{children:["Files with ",(0,r.jsx)(s.em,{children:'"image"'})," or ",(0,r.jsx)(s.em,{children:'"any"'})," types that contain a ",(0,r.jsx)(s.code,{children:"src"})," property as a url will have their bubble set as a hyperlink."]})}),"\n",(0,r.jsx)(i.A,{}),"\n",(0,r.jsx)(s.h3,{id:"MessageFileType",children:(0,r.jsx)(s.code,{children:"MessageFileType"})}),"\n",(0,r.jsxs)(s.ul,{children:["\n",(0,r.jsxs)(s.li,{children:["Type: ",(0,r.jsx)(s.code,{children:'"image"'})," | ",(0,r.jsx)(s.code,{children:'"audio"'})," | ",(0,r.jsx)(s.code,{children:'"any"'})]}),"\n"]}),"\n",(0,r.jsxs)(s.p,{children:["Type of a file stored inside a message. ",(0,r.jsx)(s.em,{children:'"any"'})," is the default type."]}),"\n",(0,r.jsx)(i.A,{}),"\n",(0,r.jsx)(s.h2,{id:"code-messages",children:"Code messages"}),"\n",(0,r.jsxs)(s.p,{children:["By default, ",(0,r.jsx)(s.code,{children:"text"})," messages containing code will be rendered with white text in a dark background.\nIn order to highlight the code, you will need to add an external module called ",(0,r.jsx)(s.a,{href:"https://www.npmjs.com/package/highlight.js?activeTab=readme",children:(0,r.jsx)(s.code,{children:"highligt.js"})}),".\nCheck out external module ",(0,r.jsx)(s.a,{href:"/examples/externalModules",children:"EXAMPLES"})," to find multiple ways of how you can add it to your project."]}),"\n",(0,r.jsx)(s.h4,{id:"example-10",children:"Example"}),"\n",(0,r.jsx)(l.A,{children:(0,r.jsx)(t.A,{style:{borderRadius:"8px"},history:[{text:'```java\nwhile (i < 5) {\n console.log("hi");\n i+= 1;\n}\n```',role:"ai"}],messageStyles:{default:{shared:{bubble:{maxWidth:"270px"}}}},demo:!0})}),"\n",(0,r.jsxs)(c.A,{children:[(0,r.jsx)(d.A,{value:"js",label:"Sample code",children:(0,r.jsx)(s.pre,{children:(0,r.jsx)(s.code,{className:"language-html",children:'\n'})})}),(0,r.jsx)(d.A,{value:"py",label:"Full code",children:(0,r.jsx)(s.pre,{children:(0,r.jsx)(s.code,{className:"language-html",children:'\x3c!-- This example is for Vanilla JS and should be tailored to your framework (see Examples) --\x3e\n\n\n'})})})]}),"\n",(0,r.jsx)(i.A,{})]})}function g(e={}){const{wrapper:s}={...(0,a.R)(),...e.components};return s?(0,r.jsx)(s,{...e,children:(0,r.jsx)(j,{...e})}):j(e)}},19365:(e,s,n)=>{n.d(s,{A:()=>t});n(96540);var r=n(34164);const a={tabItem:"tabItem_Ymn6"};var l=n(74848);function t(e){let{children:s,hidden:n,className:t}=e;return(0,l.jsx)("div",{role:"tabpanel",className:(0,r.A)(a.tabItem,t),hidden:n,children:s})}},11470:(e,s,n)=>{n.d(s,{A:()=>w});var r=n(96540),a=n(34164),l=n(23104),t=n(56347),i=n(205),o=n(57485),d=n(31682),c=n(70679);function h(e){return r.Children.toArray(e).filter((e=>"\n"!==e)).map((e=>{if(!e||(0,r.isValidElement)(e)&&function(e){const{props:s}=e;return!!s&&"object"==typeof s&&"value"in s}(e))return e;throw new Error(`Docusaurus error: Bad child <${"string"==typeof e.type?e.type:e.type.name}>: all children of the component should be , and every should have a unique "value" prop.`)}))?.filter(Boolean)??[]}function x(e){const{values:s,children:n}=e;return(0,r.useMemo)((()=>{const e=s??function(e){return h(e).map((e=>{let{props:{value:s,label:n,attributes:r,default:a}}=e;return{value:s,label:n,attributes:r,default:a}}))}(n);return function(e){const s=(0,d.XI)(e,((e,s)=>e.value===s.value));if(s.length>0)throw new Error(`Docusaurus error: Duplicate values "${s.map((e=>e.value)).join(", ")}" found in . Every value needs to be unique.`)}(e),e}),[s,n])}function u(e){let{value:s,tabValues:n}=e;return n.some((e=>e.value===s))}function p(e){let{queryString:s=!1,groupId:n}=e;const a=(0,t.W6)(),l=function(e){let{queryString:s=!1,groupId:n}=e;if("string"==typeof s)return s;if(!1===s)return null;if(!0===s&&!n)throw new Error('Docusaurus error: The component groupId prop is required if queryString=true, because this value is used as the search param name. You can also provide an explicit value such as queryString="my-search-param".');return n??null}({queryString:s,groupId:n});return[(0,o.aZ)(l),(0,r.useCallback)((e=>{if(!l)return;const s=new URLSearchParams(a.location.search);s.set(l,e),a.replace({...a.location,search:s.toString()})}),[l,a])]}function m(e){const{defaultValue:s,queryString:n=!1,groupId:a}=e,l=x(e),[t,o]=(0,r.useState)((()=>function(e){let{defaultValue:s,tabValues:n}=e;if(0===n.length)throw new Error("Docusaurus error: the component requires at least one children component");if(s){if(!u({value:s,tabValues:n}))throw new Error(`Docusaurus error: The has a defaultValue "${s}" but none of its children has the corresponding value. Available values are: ${n.map((e=>e.value)).join(", ")}. If you intend to show no default tab, use defaultValue={null} instead.`);return s}const r=n.find((e=>e.default))??n[0];if(!r)throw new Error("Unexpected error: 0 tabValues");return r.value}({defaultValue:s,tabValues:l}))),[d,h]=p({queryString:n,groupId:a}),[m,j]=function(e){let{groupId:s}=e;const n=function(e){return e?`docusaurus.tab.${e}`:null}(s),[a,l]=(0,c.Dv)(n);return[a,(0,r.useCallback)((e=>{n&&l.set(e)}),[n,l])]}({groupId:a}),g=(()=>{const e=d??m;return u({value:e,tabValues:l})?e:null})();(0,i.A)((()=>{g&&o(g)}),[g]);return{selectedValue:t,selectValue:(0,r.useCallback)((e=>{if(!u({value:e,tabValues:l}))throw new Error(`Can't select invalid tab value=${e}`);o(e),h(e),j(e)}),[h,j,l]),tabValues:l}}var j=n(92303);const g={tabList:"tabList__CuJ",tabItem:"tabItem_LNqP"};var y=n(74848);function b(e){let{className:s,block:n,selectedValue:r,selectValue:t,tabValues:i}=e;const o=[],{blockElementScrollPositionUntilNextRender:d}=(0,l.a_)(),c=e=>{const s=e.currentTarget,n=o.indexOf(s),a=i[n].value;a!==r&&(d(s),t(a))},h=e=>{let s=null;switch(e.key){case"Enter":c(e);break;case"ArrowRight":{const n=o.indexOf(e.currentTarget)+1;s=o[n]??o[0];break}case"ArrowLeft":{const n=o.indexOf(e.currentTarget)-1;s=o[n]??o[o.length-1];break}}s?.focus()};return(0,y.jsx)("ul",{role:"tablist","aria-orientation":"horizontal",className:(0,a.A)("tabs",{"tabs--block":n},s),children:i.map((e=>{let{value:s,label:n,attributes:l}=e;return(0,y.jsx)("li",{role:"tab",tabIndex:r===s?0:-1,"aria-selected":r===s,ref:e=>o.push(e),onKeyDown:h,onClick:c,...l,className:(0,a.A)("tabs__item",g.tabItem,l?.className,{"tabs__item--active":r===s}),children:n??s},s)}))})}function f(e){let{lazy:s,children:n,selectedValue:l}=e;const t=(Array.isArray(n)?n:[n]).filter(Boolean);if(s){const e=t.find((e=>e.props.value===l));return e?(0,r.cloneElement)(e,{className:(0,a.A)("margin-top--md",e.props.className)}):null}return(0,y.jsx)("div",{className:"margin-top--md",children:t.map(((e,s)=>(0,r.cloneElement)(e,{key:s,hidden:e.props.value!==l})))})}function v(e){const s=m(e);return(0,y.jsxs)("div",{className:(0,a.A)("tabs-container",g.tabList),children:[(0,y.jsx)(b,{...s,...e}),(0,y.jsx)(f,{...s,...e})]})}function w(e){const s=(0,j.A)();return(0,y.jsx)(v,{...e,children:h(e.children)},String(s))}},9475:(e,s,n)=>{function r(){window.hljs||n.e(9878).then(n.bind(n,19878)).then((e=>{window.hljs=e.default}))}async function a(){return!!window.hljs||n.e(9878).then(n.bind(n,19878)).then((e=>(window.hljs=e.default,!0)))}function l(){delete window.hljs}function t(){window.webLLM||n.e(4529).then(n.bind(n,6910)).then((e=>{window.webLLM=e}))}n.d(s,{Aj:()=>a,OI:()=>r,pK:()=>t,rk:()=>l})},15781:(e,s,n)=>{n.d(s,{A:()=>a});n(96540);var r=n(74848);function a(){return(0,r.jsx)("div",{style:{height:"1px"}})}},61886:(e,s,n)=>{function r(e){window.scrollY>0?e.style.boxShadow="0 1px 2px 0 rgb(0 0 0 / 10%)":e.style.boxShadow="unset"}function a(){setTimeout((()=>{window.removeEventListener("scroll",window.toggleNavOnScroll);const e=document.getElementsByClassName("navbar--fixed-top");if(e[0]){const s=e[0];r(s),window.toggleNavOnScroll=r.bind(this,s),window.addEventListener("scroll",window.toggleNavOnScroll)}}),2)}function l(){setTimeout((()=>{const e=document.querySelectorAll(".homepage > body > #__docusaurus > nav")?.[0];try{e.classList.add("fade-in")}catch(s){console.error(s),console.log("element was not rendered in time - use MutationObserver")}}),2)}n.r(s),n.d(s,{fadeIn:()=>l,readdAutoNavShadowToggle:()=>a})},24033:(e,s,n)=>{n.d(s,{A:()=>l,q:()=>a});n(96540);var r=n(74848);function a(e){return e?.children[0]?.children[0]}function l(e){let{children:s,minHeight:n,innerDisplay:a}=e;return(0,r.jsx)("div",{className:"documentation-example-container",style:{minHeight:`${n||400}px`},children:(0,r.jsx)("div",{style:{display:a||"block"},children:s})})}},50363:(e,s,n)=>{n.d(s,{A:()=>l});var r=n(78478),a=(n(96540),n(74848));function l(e){return(0,a.jsx)(r.A,{children:()=>{const s=n(78152).DeepChat;return(0,a.jsx)(s,{...e,children:e.children})}})}},28453:(e,s,n)=>{n.d(s,{R:()=>t,x:()=>i});var r=n(96540);const a={},l=r.createContext(a);function t(e){const s=r.useContext(l);return r.useMemo((function(){return"function"==typeof e?e(s):{...s,...e}}),[s,e])}function i(e){let s;return s=e.disableParentContext?"function"==typeof e.components?e.components(a):e.components||a:t(e.components),r.createElement(l.Provider,{value:s},e.children)}}}]); \ No newline at end of file diff --git a/assets/js/c214479d.ca2549a1.js b/assets/js/c214479d.ca2549a1.js new file mode 100644 index 000000000..0cb99c34d --- /dev/null +++ b/assets/js/c214479d.ca2549a1.js @@ -0,0 +1 @@ +"use strict";(self.webpackChunkwebsite=self.webpackChunkwebsite||[]).push([[3555],{88096:(e,s,n)=>{n.r(s),n.d(s,{assets:()=>p,contentTitle:()=>x,default:()=>g,frontMatter:()=>h,metadata:()=>u,toc:()=>m});var r=n(74848),a=n(28453),l=n(24033),t=n(50363),i=n(15781),o=n(78478),d=n(19365),c=n(11470);const h={sidebar_position:6},x="Messages",u={id:"docs/messages/messages",title:"Messages",description:"Properties related to messages.",source:"@site/docs/docs/messages/messages.mdx",sourceDirName:"docs/messages",slug:"/docs/messages/",permalink:"/docs/messages/",draft:!1,unlisted:!1,editUrl:"https://github.com/OvidijusParsiunas/deep-chat/tree/main/website/docs/docs/messages/messages.mdx",tags:[],version:"current",sidebarPosition:6,frontMatter:{sidebar_position:6},sidebar:"docs",previous:{title:"Styles",permalink:"/docs/styles"},next:{title:"Styles",permalink:"/docs/messages/styles"}},p={},m=[{value:"history",id:"history",level:3},{value:"Example",id:"example",level:4},{value:"introMessage",id:"introMessage",level:3},{value:"Example",id:"example-1",level:4},{value:"avatars",id:"avatars",level:3},{value:"Example",id:"example-2",level:4},{value:"Avatar",id:"Avatar",level:4},{value:"Example",id:"example-3",level:4},{value:"names",id:"names",level:3},{value:"Example",id:"example-4",level:4},{value:"Name",id:"Name",level:4},{value:"Example",id:"example-5",level:4},{value:"displayLoadingBubble",id:"displayLoadingBubble",level:3},{value:"Example",id:"example-6",level:4},{value:"errorMessages",id:"errorMessages",level:3},{value:"Example",id:"example-7",level:4},{value:"Types",id:"types",level:2},{value:"MessageContent",id:"MessageContent",level:3},{value:"Example",id:"example-8",level:4},{value:"MessageRole",id:"MessageRole",level:3},{value:"MessageFile",id:"MessageFile",level:3},{value:"Example",id:"example-9",level:4},{value:"MessageFileType",id:"MessageFileType",level:3},{value:"Code messages",id:"code-messages",level:2},{value:"Example",id:"example-10",level:4}];function j(e){const s={a:"a",admonition:"admonition",code:"code",em:"em",h1:"h1",h2:"h2",h3:"h3",h4:"h4",header:"header",li:"li",p:"p",pre:"pre",ul:"ul",...(0,a.R)(),...e.components};return(0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)(s.header,{children:(0,r.jsx)(s.h1,{id:"messages",children:"Messages"})}),"\n",(0,r.jsx)(s.p,{children:"Properties related to messages."}),"\n",(0,r.jsx)(s.h3,{id:"history",children:(0,r.jsx)(s.code,{children:"history"})}),"\n",(0,r.jsxs)(s.ul,{children:["\n",(0,r.jsxs)(s.li,{children:["Type: ",(0,r.jsx)(s.a,{href:"#MessageContent",children:(0,r.jsx)(s.code,{children:"MessageContent[]"})})]}),"\n"]}),"\n",(0,r.jsxs)(s.p,{children:["Messages that are pre-populated when the chat loads up. Use ",(0,r.jsx)(s.a,{href:"/docs/interceptors#loadHistory",children:(0,r.jsx)(s.code,{children:"loadHistory"})})," to load messages asynchronously. ",(0,r.jsx)("br",{})]}),"\n","\n",(0,r.jsx)(o.A,{children:()=>n(61886).readdAutoNavShadowToggle()}),"\n",(0,r.jsx)(o.A,{children:()=>n(9475).OI()}),"\n",(0,r.jsx)(s.h4,{id:"example",children:"Example"}),"\n",(0,r.jsx)(l.A,{children:(0,r.jsx)(t.A,{demo:!0,history:[{text:"Show me a modern city",role:"user"},{files:[{src:"/img/city.jpeg",type:"image"}],role:"ai"},{text:"Whats on your mind?",role:"user"},{text:"Peace and tranquility",role:"ai"}],style:{height:"370px",borderRadius:"8px"}})}),"\n",(0,r.jsxs)(c.A,{children:[(0,r.jsx)(d.A,{value:"js",label:"Sample code",children:(0,r.jsx)(s.pre,{children:(0,r.jsx)(s.code,{className:"language-html",children:'\n'})})}),(0,r.jsx)(d.A,{value:"py",label:"Full code",children:(0,r.jsx)(s.pre,{children:(0,r.jsx)(s.code,{className:"language-html",children:'\x3c!-- This example is for Vanilla JS and should be tailored to your framework (see Examples) --\x3e\n\n\n'})})})]}),"\n",(0,r.jsx)(i.A,{}),"\n",(0,r.jsx)(s.h3,{id:"introMessage",children:(0,r.jsx)(s.code,{children:"introMessage"})}),"\n",(0,r.jsxs)(s.ul,{children:["\n",(0,r.jsxs)(s.li,{children:["Type: {",(0,r.jsx)(s.code,{children:"text?: string"}),", ",(0,r.jsx)(s.code,{children:"html?: string"}),"} | ",(0,r.jsx)(s.code,{children:"Array"})]}),"\n"]}),"\n",(0,r.jsxs)(s.p,{children:["Initial ",(0,r.jsx)(s.code,{children:"ai"})," message that is displayed when the chat is loaded. It is different to ",(0,r.jsx)(s.a,{href:"#history",children:(0,r.jsx)(s.code,{children:"history"})})," as it will not trigger\nthe ",(0,r.jsx)(s.a,{href:"/docs/events#onMessage",children:(0,r.jsx)(s.code,{children:"onMessage"})})," listener, will not be part of the returned messages when ",(0,r.jsx)(s.a,{href:"/docs/methods#getMessages",children:(0,r.jsx)(s.code,{children:"getMessages"})})," is called and\nis not taken into consideration when calculating ",(0,r.jsx)(s.a,{href:"/docs/connect#requestBodyLimits",children:(0,r.jsx)(s.code,{children:"requestBodyLimits"})}),". ",(0,r.jsx)("br",{}),"\n",(0,r.jsx)(s.code,{children:"html"})," is used to render ",(0,r.jsx)(s.a,{href:"/docs/messages/HTML",children:"custom code"})," and can be coupled with a ",(0,r.jsx)(s.a,{href:"/docs/messages/HTML#deepChatClasses",children:(0,r.jsx)(s.code,{children:"deep-chat-temporary-message"})}),"\nclass to make this message disappear after a new one is added. ",(0,r.jsx)("br",{}),"\nThis can either be defined as an object for one message, or as an array for multiple ones."]}),"\n",(0,r.jsx)(s.h4,{id:"example-1",children:"Example"}),"\n",(0,r.jsx)(l.A,{children:(0,r.jsx)(t.A,{style:{borderRadius:"8px"},introMessage:{text:"Hi I am your assistant, ask me anything!"},demo:!0})}),"\n",(0,r.jsxs)(c.A,{children:[(0,r.jsx)(d.A,{value:"js",label:"Sample code",children:(0,r.jsx)(s.pre,{children:(0,r.jsx)(s.code,{className:"language-html",children:'\n'})})}),(0,r.jsx)(d.A,{value:"py",label:"Full code",children:(0,r.jsx)(s.pre,{children:(0,r.jsx)(s.code,{className:"language-html",children:'\x3c!-- This example is for Vanilla JS and should be tailored to your framework (see Examples) --\x3e\n\n\n'})})})]}),"\n",(0,r.jsx)(i.A,{}),"\n",(0,r.jsx)(s.h3,{id:"avatars",children:(0,r.jsx)(s.code,{children:"avatars"})}),"\n",(0,r.jsxs)(s.ul,{children:["\n",(0,r.jsxs)(s.li,{children:["Type: ",(0,r.jsx)(s.code,{children:"true"})," | {",(0,r.jsx)(s.a,{href:"#Avatar",children:(0,r.jsx)(s.code,{children:"default?: Avatar"})}),", ",(0,r.jsx)(s.a,{href:"#Avatar",children:(0,r.jsx)(s.code,{children:"ai?: Avatar"})}),", ",(0,r.jsx)(s.a,{href:"#Avatar",children:(0,r.jsx)(s.code,{children:"user?: Avatar"})}),", ",(0,r.jsx)(s.a,{href:"#Avatar",children:(0,r.jsx)(s.code,{children:"[custom]?: Avatar"})}),"}"]}),"\n"]}),"\n",(0,r.jsxs)(s.p,{children:["Add avatars beside messages. You can enable this by setting the value to ",(0,r.jsx)(s.em,{children:"true"}),"\nor by defining an object with ",(0,r.jsx)(s.a,{href:"#Avatar",children:(0,r.jsx)(s.code,{children:"Avatar"})})," properties. The ",(0,r.jsx)(s.code,{children:"default"})," property is applied to all roles.\n",(0,r.jsx)(s.code,{children:"custom"})," roles (e.g. ",(0,r.jsx)(s.code,{children:'"bob"'}),") use ",(0,r.jsx)(s.code,{children:"ai"})," styling by default. ",(0,r.jsx)("br",{})]}),"\n",(0,r.jsx)(s.h4,{id:"example-2",children:"Example"}),"\n",(0,r.jsx)(l.A,{children:(0,r.jsx)(t.A,{style:{borderRadius:"8px"},history:[{text:"Hey, how are you?",role:"user"},{text:"I am doing great, how about you?",role:"ai"},{text:"What is the meaning of life?",role:"user"},{text:"This ultimately depends on the person, but it could be the pursuit of happiness or fulfillment.",role:"ai"}],demo:!0,avatars:!0})}),"\n",(0,r.jsxs)(c.A,{children:[(0,r.jsx)(d.A,{value:"js",label:"Sample code",children:(0,r.jsx)(s.pre,{children:(0,r.jsx)(s.code,{className:"language-html",children:'\n'})})}),(0,r.jsx)(d.A,{value:"py",label:"Full code",children:(0,r.jsx)(s.pre,{children:(0,r.jsx)(s.code,{className:"language-html",children:'\x3c!-- This example is for Vanilla JS and should be tailored to your framework (see Examples) --\x3e\n\n\n'})})})]}),"\n",(0,r.jsx)(i.A,{}),"\n",(0,r.jsx)(s.h4,{id:"Avatar",children:(0,r.jsx)(s.code,{children:"Avatar"})}),"\n",(0,r.jsxs)(s.ul,{children:["\n",(0,r.jsxs)(s.li,{children:["Type: {",(0,r.jsx)("br",{}),"\n\xa0\xa0\xa0\xa0 ",(0,r.jsx)(s.code,{children:"src?: string"}),", ",(0,r.jsx)("br",{}),"\n\xa0\xa0\xa0\xa0 ",(0,r.jsx)(s.code,{children:"styles?: {"})," ",(0,r.jsx)("br",{}),"\n\xa0\xa0\xa0\xa0\xa0\xa0\xa0\xa0 ",(0,r.jsx)(s.a,{href:"/docs/styles#CustomStyle",children:(0,r.jsx)(s.code,{children:"avatar?: CustomStyle"})}),", ",(0,r.jsx)("br",{}),"\n\xa0\xa0\xa0\xa0\xa0\xa0\xa0\xa0 ",(0,r.jsx)(s.a,{href:"/docs/styles#CustomStyle",children:(0,r.jsx)(s.code,{children:"container?: CustomStyle"})})," ",(0,r.jsx)("br",{}),"\n\xa0\xa0\xa0\xa0\xa0\xa0\xa0\xa0 ",(0,r.jsx)(s.code,{children:'position?: "left" | "right"'})," ",(0,r.jsx)("br",{}),"\n}}"]}),"\n"]}),"\n",(0,r.jsxs)(s.p,{children:["This object is used to configure avatars that are displayed beside messages. ",(0,r.jsx)("br",{}),"\n",(0,r.jsx)(s.code,{children:"src"})," is the path to an avatar image file. ",(0,r.jsx)("br",{}),"\n",(0,r.jsx)(s.code,{children:"avatar"})," property is used to configure the avatar element's styling. ",(0,r.jsx)("br",{}),"\n",(0,r.jsx)(s.code,{children:"container"})," is used to style the element that encapsulates the avatar element. ",(0,r.jsx)("br",{}),"\n",(0,r.jsx)(s.code,{children:"position"})," defines which side of the message the avatar is going to be displayed on."]}),"\n",(0,r.jsx)(s.h4,{id:"example-3",children:"Example"}),"\n",(0,r.jsx)(l.A,{children:(0,r.jsx)(t.A,{style:{borderRadius:"8px"},history:[{text:"What is the meaning of life?",role:"user"},{text:"This ultimately depends on the person, but it could be the pursuit of happiness or fulfillment.",role:"ai"},{text:"We dont laugh because we feel good, we feel good because we laugh.",role:"bob"}],avatars:{default:{styles:{avatar:{height:"30px",width:"30px"},container:{marginTop:"8px"}}},ai:{src:"/img/ai-brain.svg",styles:{avatar:{marginLeft:"-3px"}}},bob:{src:"/img/bob.png",styles:{avatar:{borderRadius:"15px",filter:"brightness(1.3)"}}}},demo:!0})}),"\n",(0,r.jsxs)(c.A,{children:[(0,r.jsx)(d.A,{value:"js",label:"Sample code",children:(0,r.jsx)(s.pre,{children:(0,r.jsx)(s.code,{className:"language-html",children:'\n'})})}),(0,r.jsx)(d.A,{value:"py",label:"Full code",children:(0,r.jsx)(s.pre,{children:(0,r.jsx)(s.code,{className:"language-html",children:'\x3c!-- This example is for Vanilla JS and should be tailored to your framework (see Examples) --\x3e\n\n\n'})})})]}),"\n",(0,r.jsx)(i.A,{}),"\n",(0,r.jsx)(s.h3,{id:"names",children:(0,r.jsx)(s.code,{children:"names"})}),"\n",(0,r.jsxs)(s.ul,{children:["\n",(0,r.jsxs)(s.li,{children:["Type: ",(0,r.jsx)(s.code,{children:"true"})," | {",(0,r.jsx)(s.a,{href:"#Name",children:(0,r.jsx)(s.code,{children:"default?: Name"})}),", ",(0,r.jsx)(s.a,{href:"#Name",children:(0,r.jsx)(s.code,{children:"ai?: Name"})}),", ",(0,r.jsx)(s.a,{href:"#Name",children:(0,r.jsx)(s.code,{children:"user?: Name"})}),", ",(0,r.jsx)(s.a,{href:"#Name",children:(0,r.jsx)(s.code,{children:"[custom]?: Name"})}),"}"]}),"\n"]}),"\n",(0,r.jsxs)(s.p,{children:["Add names beside messages. You can enable this by setting the value to ",(0,r.jsx)(s.em,{children:"true"}),"\nor by defining an object with ",(0,r.jsx)(s.a,{href:"#Name",children:(0,r.jsx)(s.code,{children:"Name"})})," properties. The ",(0,r.jsx)(s.code,{children:"default"})," property is applied to all roles.\n",(0,r.jsx)(s.code,{children:"custom"})," roles (e.g. ",(0,r.jsx)(s.code,{children:'"bob"'}),") use ",(0,r.jsx)(s.code,{children:"ai"})," styling by default. ",(0,r.jsx)("br",{})]}),"\n",(0,r.jsx)(s.h4,{id:"example-4",children:"Example"}),"\n",(0,r.jsx)(l.A,{children:(0,r.jsx)(t.A,{style:{borderRadius:"8px"},history:[{text:"Hey, how are you?",role:"user"},{text:"I am doing great!",role:"ai"},{text:"Motivate me",role:"user"},{text:"Talent is a pursued interest. Anything you\u2019re willing to practice, you can do.",role:"Bob"}],demo:!0,names:!0})}),"\n",(0,r.jsxs)(c.A,{children:[(0,r.jsx)(d.A,{value:"js",label:"Sample code",children:(0,r.jsx)(s.pre,{children:(0,r.jsx)(s.code,{className:"language-html",children:'\n'})})}),(0,r.jsx)(d.A,{value:"py",label:"Full code",children:(0,r.jsx)(s.pre,{children:(0,r.jsx)(s.code,{className:"language-html",children:'\x3c!-- This example is for Vanilla JS and should be tailored to your framework (see Examples) --\x3e\n\n\n'})})})]}),"\n",(0,r.jsx)(i.A,{}),"\n",(0,r.jsx)(s.h4,{id:"Name",children:(0,r.jsx)(s.code,{children:"Name"})}),"\n",(0,r.jsxs)(s.ul,{children:["\n",(0,r.jsxs)(s.li,{children:["Type: {",(0,r.jsx)("br",{}),"\n\xa0\xa0\xa0\xa0 ",(0,r.jsx)(s.code,{children:"text?: string"}),", ",(0,r.jsx)("br",{}),"\n\xa0\xa0\xa0\xa0 ",(0,r.jsx)(s.a,{href:"/docs/styles#CustomStyle",children:(0,r.jsx)(s.code,{children:"style?: CustomStyle"})}),", ",(0,r.jsx)("br",{}),"\n\xa0\xa0\xa0\xa0 ",(0,r.jsx)(s.code,{children:'position?: "left" | "right"'})," ",(0,r.jsx)("br",{}),"\n}"]}),"\n"]}),"\n",(0,r.jsxs)(s.p,{children:["This object is used to configure names that are displayed beside messages. ",(0,r.jsx)("br",{}),"\n",(0,r.jsx)(s.code,{children:"text"})," is the string used for the name. ",(0,r.jsx)("br",{}),"\n",(0,r.jsx)(s.code,{children:"style"})," is used to define the style of the name element. ",(0,r.jsx)("br",{}),"\n",(0,r.jsx)(s.code,{children:"position"})," defines which side of the message the name is going to be displayed."]}),"\n",(0,r.jsx)(s.h4,{id:"example-5",children:"Example"}),"\n",(0,r.jsx)(l.A,{children:(0,r.jsx)(t.A,{style:{borderRadius:"8px"},history:[{text:"Hey, how are you?",role:"user"},{text:"I am doing great!",role:"ai"},{text:"Motivate me",role:"user"},{text:"Talent is a pursued interest. Anything you\u2019re willing to practice, you can do.",role:"Bob"}],demo:!0,names:{default:{style:{fontSize:"18px",marginTop:"14px",width:"32px"}},ai:{text:"You"},user:{text:"Me"},Bob:{style:{color:"green"}}}})}),"\n",(0,r.jsxs)(c.A,{children:[(0,r.jsx)(d.A,{value:"js",label:"Sample code",children:(0,r.jsx)(s.pre,{children:(0,r.jsx)(s.code,{className:"language-html",children:'\n'})})}),(0,r.jsx)(d.A,{value:"py",label:"Full code",children:(0,r.jsx)(s.pre,{children:(0,r.jsx)(s.code,{className:"language-html",children:'\x3c!-- This example is for Vanilla JS and should be tailored to your framework (see Examples) --\x3e\n\n\n'})})})]}),"\n",(0,r.jsx)(i.A,{}),"\n",(0,r.jsx)(s.h3,{id:"displayLoadingBubble",children:(0,r.jsx)(s.code,{children:"displayLoadingBubble"})}),"\n",(0,r.jsxs)(s.ul,{children:["\n",(0,r.jsxs)(s.li,{children:["Type: ",(0,r.jsx)(s.code,{children:"boolean"})]}),"\n"]}),"\n",(0,r.jsx)(s.p,{children:"Toggle whether the loading bubble should be displayed when waiting for a message response."}),"\n",(0,r.jsx)(s.h4,{id:"example-6",children:"Example"}),"\n",(0,r.jsx)(l.A,{children:(0,r.jsx)(t.A,{style:{borderRadius:"8px"},introMessage:{text:"Send a new message to observe a response with no loading bubble."},displayLoadingBubble:!1,demo:!0})}),"\n",(0,r.jsxs)(c.A,{children:[(0,r.jsx)(d.A,{value:"js",label:"Sample code",children:(0,r.jsx)(s.pre,{children:(0,r.jsx)(s.code,{className:"language-html",children:'\n'})})}),(0,r.jsx)(d.A,{value:"py",label:"Full code",children:(0,r.jsx)(s.pre,{children:(0,r.jsx)(s.code,{className:"language-html",children:'\x3c!-- This example is for Vanilla JS and should be tailored to your framework (see Examples) --\x3e\n\n\n'})})})]}),"\n",(0,r.jsx)(i.A,{}),"\n",(0,r.jsx)(s.h3,{id:"errorMessages",children:(0,r.jsx)(s.code,{children:"errorMessages"})}),"\n",(0,r.jsxs)(s.ul,{children:["\n",(0,r.jsxs)(s.li,{children:["\n",(0,r.jsxs)(s.p,{children:["Type: {",(0,r.jsx)("br",{}),"\n\xa0\xa0\xa0\xa0 ",(0,r.jsx)(s.code,{children:"displayServiceErrorMessages?: boolean"}),", ",(0,r.jsx)("br",{}),"\n\xa0\xa0\xa0\xa0 ",(0,r.jsx)(s.code,{children:"overrides?:"})," { ",(0,r.jsx)("br",{}),"\n\xa0\xa0\xa0\xa0\xa0\xa0\xa0\xa0 ",(0,r.jsx)(s.code,{children:"default?: string"}),", ",(0,r.jsx)("br",{}),"\n\xa0\xa0\xa0\xa0\xa0\xa0\xa0\xa0 ",(0,r.jsx)(s.code,{children:"service?: string"}),", ",(0,r.jsx)("br",{}),"\n\xa0\xa0\xa0\xa0\xa0\xa0\xa0\xa0 ",(0,r.jsx)(s.code,{children:"speechToText?: string"})," ",(0,r.jsx)("br",{}),"\n}}"]}),"\n"]}),"\n",(0,r.jsxs)(s.li,{children:["\n",(0,r.jsxs)(s.p,{children:["Default: ",(0,r.jsx)(s.em,{children:'{ displayServiceErrorMessages: false, overrides: {default: "Error, please try again." }}'})]}),"\n"]}),"\n"]}),"\n",(0,r.jsxs)(s.p,{children:["Deep Chat automatically displays an error message when something goes wrong. This object is used to control what the message will contain. ",(0,r.jsx)("br",{}),"\n",(0,r.jsx)(s.code,{children:"displayServiceErrorMessages"})," is used to display the full error message that has been returned from the service. ",(0,r.jsx)("br",{}),"\n",(0,r.jsx)(s.code,{children:"overrides"})," is used to overwrite the error message text based on what has caused it: ",(0,r.jsx)(s.code,{children:"default"})," is used for any kind of error, ",(0,r.jsx)(s.code,{children:"service"}),"\nis for communication with the target service and ",(0,r.jsx)(s.code,{children:"speechToText"})," is when there is a problem using the ",(0,r.jsx)(s.a,{href:"/docs/speech#speechToText",children:(0,r.jsx)(s.code,{children:"speechToText"})})," functionality. ",(0,r.jsx)("br",{})]}),"\n",(0,r.jsx)(s.h4,{id:"example-7",children:"Example"}),"\n",(0,r.jsx)(l.A,{children:(0,r.jsx)(t.A,{style:{borderRadius:"8px"},demo:{displayErrors:{default:!0,service:!0,speechToText:!0}},errorMessages:{overrides:{default:"Default error :(",service:"Target service error!",speechToText:"Speech to text microphone error!"}}})}),"\n",(0,r.jsxs)(c.A,{children:[(0,r.jsx)(d.A,{value:"js",label:"Sample code",children:(0,r.jsx)(s.pre,{children:(0,r.jsx)(s.code,{className:"language-html",children:'\n'})})}),(0,r.jsx)(d.A,{value:"py",label:"Full code",children:(0,r.jsx)(s.pre,{children:(0,r.jsx)(s.code,{className:"language-html",children:'\x3c!-- This example is for Vanilla JS and should be tailored to your framework (see Examples) --\x3e\n\n\n'})})})]}),"\n",(0,r.jsx)(i.A,{}),"\n",(0,r.jsx)(s.h2,{id:"types",children:"Types"}),"\n",(0,r.jsx)(s.p,{children:"Shared object property types related to messages:"}),"\n",(0,r.jsx)(s.h3,{id:"MessageContent",children:(0,r.jsx)(s.code,{children:"MessageContent"})}),"\n",(0,r.jsxs)(s.ul,{children:["\n",(0,r.jsxs)(s.li,{children:["Type: {",(0,r.jsx)(s.a,{href:"#MessageRole",children:(0,r.jsx)(s.code,{children:"role?: MessageRole"})}),", ",(0,r.jsx)(s.code,{children:"text?: string"}),", ",(0,r.jsx)(s.a,{href:"#MessageFile",children:(0,r.jsx)(s.code,{children:"files?: MessageFile[]"})}),", ",(0,r.jsx)(s.a,{href:"/docs/messages/HTML",children:(0,r.jsx)(s.code,{children:"html?: string"})}),"}"]}),"\n"]}),"\n",(0,r.jsxs)(s.p,{children:["Object format used to encapsulate a message within the chat. ",(0,r.jsx)("br",{}),"\n",(0,r.jsx)(s.code,{children:"role"})," defines the message sender. If not set it is automatically regarded as ",(0,r.jsx)(s.em,{children:'"ai"'}),". ",(0,r.jsx)("br",{}),"\n",(0,r.jsx)(s.code,{children:"text"})," is string content for a textual message. It uses ",(0,r.jsx)(s.a,{href:"https://www.markdownguide.org/basic-syntax/",children:"Markdown"})," syntax to render the message accordingly which is useful for displaying code snippets,\nparagraphs and more. See this ",(0,r.jsx)(s.a,{href:"https://jonschlinkert.github.io/remarkable/demo/",children:"playground"})," for reference. ",(0,r.jsx)("br",{}),"\n",(0,r.jsx)(s.code,{children:"files"})," is an array that encapsulates details on the response files. ",(0,r.jsx)("br",{}),"\n",(0,r.jsx)(s.code,{children:"html"})," is a string that defines the markup for ",(0,r.jsx)(s.a,{href:"/docs/messages/HTML",children:"custom elements"}),". ",(0,r.jsx)("br",{})]}),"\n",(0,r.jsx)(s.h4,{id:"example-8",children:"Example"}),"\n",(0,r.jsx)(l.A,{children:(0,r.jsx)(t.A,{style:{borderRadius:"8px"},history:[{files:[{src:"/img/bird-2.jpeg",type:"image"}],role:"user"},{text:"This is a nice image of a yellow bird on a branch.",role:"ai"}],demo:!0})}),"\n",(0,r.jsxs)(c.A,{children:[(0,r.jsx)(d.A,{value:"js",label:"Sample code",children:(0,r.jsx)(s.pre,{children:(0,r.jsx)(s.code,{className:"language-html",children:'\n'})})}),(0,r.jsx)(d.A,{value:"py",label:"Full code",children:(0,r.jsx)(s.pre,{children:(0,r.jsx)(s.code,{className:"language-html",children:'\x3c!-- This example is for Vanilla JS and should be tailored to your framework (see Examples) --\x3e\n\n\n'})})})]}),"\n",(0,r.jsx)(i.A,{}),"\n",(0,r.jsx)(s.h3,{id:"MessageRole",children:(0,r.jsx)(s.code,{children:"MessageRole"})}),"\n",(0,r.jsxs)(s.ul,{children:["\n",(0,r.jsxs)(s.li,{children:["Type: ",(0,r.jsx)(s.code,{children:'"ai"'})," | ",(0,r.jsx)(s.code,{children:'"user"'})," | ",(0,r.jsx)(s.code,{children:"[custom]"})]}),"\n"]}),"\n",(0,r.jsxs)(s.p,{children:["Message sender. ",(0,r.jsx)("br",{}),"\n",(0,r.jsx)(s.code,{children:'"user"'})," represents messages sent out from the chat and ",(0,r.jsx)(s.code,{children:'"ai"'})," are messages received from a service. ",(0,r.jsx)("br",{}),"\nYou can also use ",(0,r.jsx)(s.em,{children:"custom"})," roles which represent other entities such as agents (",(0,r.jsx)(s.code,{children:'"ai-1"'}),"/",(0,r.jsx)(s.code,{children:'"ai-2"'}),")\nor users in a group chat (",(0,r.jsx)(s.code,{children:'"bob"'}),"/",(0,r.jsx)(s.code,{children:'"ross"'}),"). You can style them using ",(0,r.jsx)(s.a,{href:"/docs/messages/styles#messageStyles",children:(0,r.jsx)(s.code,{children:"messageStyles"})}),",\n",(0,r.jsx)(s.a,{href:"/docs/messages/#avatars",children:(0,r.jsx)(s.code,{children:"avatars"})})," and ",(0,r.jsx)(s.a,{href:"/docs/messages/#names",children:(0,r.jsx)(s.code,{children:"names"})})," properties."]}),"\n",(0,r.jsx)(i.A,{}),"\n",(0,r.jsx)(s.h3,{id:"MessageFile",children:(0,r.jsx)(s.code,{children:"MessageFile"})}),"\n",(0,r.jsxs)(s.ul,{children:["\n",(0,r.jsxs)(s.li,{children:["Type: {",(0,r.jsx)(s.code,{children:"name?: string"}),", ",(0,r.jsx)(s.code,{children:"src?: string"}),", ",(0,r.jsx)(s.a,{href:"#MessageFileType",children:(0,r.jsx)(s.code,{children:"type?: MessageFileType"})}),", ",(0,r.jsx)(s.a,{href:"https://developer.mozilla.org/en-US/docs/Web/API/File",children:(0,r.jsx)(s.code,{children:"ref?: File"})}),"} ",(0,r.jsx)("br",{})]}),"\n",(0,r.jsxs)(s.li,{children:["Default: ",(0,r.jsx)(s.em,{children:'{name: "file", type: "any"}'})]}),"\n"]}),"\n",(0,r.jsxs)(s.p,{children:["Format that defines the details of a file. ",(0,r.jsx)("br",{}),"\n",(0,r.jsx)(s.code,{children:"name"})," is used to display the file name inside the message bubble (if not image/gif/audio). ",(0,r.jsx)("br",{}),"\n",(0,r.jsx)(s.code,{children:"src"})," is either the ",(0,r.jsx)(s.em,{children:"url"})," path to the file location or the base64 encoding as a string (make sure to use the correct type prefix e.g: ",(0,r.jsx)(s.em,{children:'"data:(type);base64,"'}),").",(0,r.jsx)("br",{}),"\nThe component will automatically try to infer the file type from the ",(0,r.jsx)(s.code,{children:"src"})," property so that it can render its media correctly,\nhowever you can help it by setting the ",(0,r.jsx)(s.code,{children:"type"}),". ",(0,r.jsx)("br",{}),"\n",(0,r.jsx)(s.code,{children:"ref"})," is the actual file's reference. It is only included in ",(0,r.jsx)(s.a,{href:"/docs/events#onMessage",children:(0,r.jsx)(s.code,{children:"onMessage"})})," events. ",(0,r.jsx)("br",{})]}),"\n",(0,r.jsx)(s.h4,{id:"example-9",children:"Example"}),"\n",(0,r.jsx)(l.A,{minHeight:535,children:(0,r.jsx)(t.A,{style:{borderRadius:"8px",height:"480px"},history:[{role:"user",files:[{src:"/img/city.jpeg",type:"image"},{src:"/img/example-gif-1.gif",type:"image"},{src:"/audio/cantinaBand.wav",type:"audio"},{name:"placeholder.exe"},{src:"/text/text.txt",name:"hello-world.txt",type:"file"}]}],demo:!0})}),"\n",(0,r.jsxs)(c.A,{children:[(0,r.jsx)(d.A,{value:"js",label:"Sample code",children:(0,r.jsx)(s.pre,{children:(0,r.jsx)(s.code,{className:"language-html",children:'\n'})})}),(0,r.jsx)(d.A,{value:"py",label:"Full code",children:(0,r.jsx)(s.pre,{children:(0,r.jsx)(s.code,{className:"language-html",children:'\x3c!-- This example is for Vanilla JS and should be tailored to your framework (see Examples) --\x3e\n\n\n'})})})]}),"\n",(0,r.jsx)(i.A,{}),"\n",(0,r.jsx)(s.admonition,{type:"info",children:(0,r.jsxs)(s.p,{children:["Files with ",(0,r.jsx)(s.em,{children:'"image"'})," or ",(0,r.jsx)(s.em,{children:'"any"'})," types that contain a ",(0,r.jsx)(s.code,{children:"src"})," property as a url will have their bubble set as a hyperlink."]})}),"\n",(0,r.jsx)(i.A,{}),"\n",(0,r.jsx)(s.h3,{id:"MessageFileType",children:(0,r.jsx)(s.code,{children:"MessageFileType"})}),"\n",(0,r.jsxs)(s.ul,{children:["\n",(0,r.jsxs)(s.li,{children:["Type: ",(0,r.jsx)(s.code,{children:'"image"'})," | ",(0,r.jsx)(s.code,{children:'"audio"'})," | ",(0,r.jsx)(s.code,{children:'"any"'})]}),"\n"]}),"\n",(0,r.jsxs)(s.p,{children:["Type of a file stored inside a message. ",(0,r.jsx)(s.em,{children:'"any"'})," is the default type."]}),"\n",(0,r.jsx)(i.A,{}),"\n",(0,r.jsx)(s.h2,{id:"code-messages",children:"Code messages"}),"\n",(0,r.jsxs)(s.p,{children:["By default, ",(0,r.jsx)(s.code,{children:"text"})," messages containing code will be rendered with white text in a dark background.\nIn order to highlight the code, you will need to add an external module called ",(0,r.jsx)(s.a,{href:"https://www.npmjs.com/package/highlight.js?activeTab=readme",children:(0,r.jsx)(s.code,{children:"highligt.js"})}),".\nCheck out external module ",(0,r.jsx)(s.a,{href:"/examples/externalModules",children:"EXAMPLES"})," to find multiple ways of how you can add it to your project."]}),"\n",(0,r.jsx)(s.h4,{id:"example-10",children:"Example"}),"\n",(0,r.jsx)(l.A,{children:(0,r.jsx)(t.A,{style:{borderRadius:"8px"},history:[{text:'```java\nwhile (i < 5) {\n console.log("hi");\n i+= 1;\n}\n```',role:"ai"}],messageStyles:{default:{shared:{bubble:{maxWidth:"270px"}}}},demo:!0})}),"\n",(0,r.jsxs)(c.A,{children:[(0,r.jsx)(d.A,{value:"js",label:"Sample code",children:(0,r.jsx)(s.pre,{children:(0,r.jsx)(s.code,{className:"language-html",children:'\n'})})}),(0,r.jsx)(d.A,{value:"py",label:"Full code",children:(0,r.jsx)(s.pre,{children:(0,r.jsx)(s.code,{className:"language-html",children:'\x3c!-- This example is for Vanilla JS and should be tailored to your framework (see Examples) --\x3e\n\n\n'})})})]}),"\n",(0,r.jsx)(i.A,{})]})}function g(e={}){const{wrapper:s}={...(0,a.R)(),...e.components};return s?(0,r.jsx)(s,{...e,children:(0,r.jsx)(j,{...e})}):j(e)}},19365:(e,s,n)=>{n.d(s,{A:()=>t});n(96540);var r=n(34164);const a={tabItem:"tabItem_Ymn6"};var l=n(74848);function t(e){let{children:s,hidden:n,className:t}=e;return(0,l.jsx)("div",{role:"tabpanel",className:(0,r.A)(a.tabItem,t),hidden:n,children:s})}},11470:(e,s,n)=>{n.d(s,{A:()=>w});var r=n(96540),a=n(34164),l=n(23104),t=n(56347),i=n(205),o=n(57485),d=n(31682),c=n(70679);function h(e){return r.Children.toArray(e).filter((e=>"\n"!==e)).map((e=>{if(!e||(0,r.isValidElement)(e)&&function(e){const{props:s}=e;return!!s&&"object"==typeof s&&"value"in s}(e))return e;throw new Error(`Docusaurus error: Bad child <${"string"==typeof e.type?e.type:e.type.name}>: all children of the component should be , and every should have a unique "value" prop.`)}))?.filter(Boolean)??[]}function x(e){const{values:s,children:n}=e;return(0,r.useMemo)((()=>{const e=s??function(e){return h(e).map((e=>{let{props:{value:s,label:n,attributes:r,default:a}}=e;return{value:s,label:n,attributes:r,default:a}}))}(n);return function(e){const s=(0,d.XI)(e,((e,s)=>e.value===s.value));if(s.length>0)throw new Error(`Docusaurus error: Duplicate values "${s.map((e=>e.value)).join(", ")}" found in . Every value needs to be unique.`)}(e),e}),[s,n])}function u(e){let{value:s,tabValues:n}=e;return n.some((e=>e.value===s))}function p(e){let{queryString:s=!1,groupId:n}=e;const a=(0,t.W6)(),l=function(e){let{queryString:s=!1,groupId:n}=e;if("string"==typeof s)return s;if(!1===s)return null;if(!0===s&&!n)throw new Error('Docusaurus error: The component groupId prop is required if queryString=true, because this value is used as the search param name. You can also provide an explicit value such as queryString="my-search-param".');return n??null}({queryString:s,groupId:n});return[(0,o.aZ)(l),(0,r.useCallback)((e=>{if(!l)return;const s=new URLSearchParams(a.location.search);s.set(l,e),a.replace({...a.location,search:s.toString()})}),[l,a])]}function m(e){const{defaultValue:s,queryString:n=!1,groupId:a}=e,l=x(e),[t,o]=(0,r.useState)((()=>function(e){let{defaultValue:s,tabValues:n}=e;if(0===n.length)throw new Error("Docusaurus error: the component requires at least one children component");if(s){if(!u({value:s,tabValues:n}))throw new Error(`Docusaurus error: The has a defaultValue "${s}" but none of its children has the corresponding value. Available values are: ${n.map((e=>e.value)).join(", ")}. If you intend to show no default tab, use defaultValue={null} instead.`);return s}const r=n.find((e=>e.default))??n[0];if(!r)throw new Error("Unexpected error: 0 tabValues");return r.value}({defaultValue:s,tabValues:l}))),[d,h]=p({queryString:n,groupId:a}),[m,j]=function(e){let{groupId:s}=e;const n=function(e){return e?`docusaurus.tab.${e}`:null}(s),[a,l]=(0,c.Dv)(n);return[a,(0,r.useCallback)((e=>{n&&l.set(e)}),[n,l])]}({groupId:a}),g=(()=>{const e=d??m;return u({value:e,tabValues:l})?e:null})();(0,i.A)((()=>{g&&o(g)}),[g]);return{selectedValue:t,selectValue:(0,r.useCallback)((e=>{if(!u({value:e,tabValues:l}))throw new Error(`Can't select invalid tab value=${e}`);o(e),h(e),j(e)}),[h,j,l]),tabValues:l}}var j=n(92303);const g={tabList:"tabList__CuJ",tabItem:"tabItem_LNqP"};var y=n(74848);function b(e){let{className:s,block:n,selectedValue:r,selectValue:t,tabValues:i}=e;const o=[],{blockElementScrollPositionUntilNextRender:d}=(0,l.a_)(),c=e=>{const s=e.currentTarget,n=o.indexOf(s),a=i[n].value;a!==r&&(d(s),t(a))},h=e=>{let s=null;switch(e.key){case"Enter":c(e);break;case"ArrowRight":{const n=o.indexOf(e.currentTarget)+1;s=o[n]??o[0];break}case"ArrowLeft":{const n=o.indexOf(e.currentTarget)-1;s=o[n]??o[o.length-1];break}}s?.focus()};return(0,y.jsx)("ul",{role:"tablist","aria-orientation":"horizontal",className:(0,a.A)("tabs",{"tabs--block":n},s),children:i.map((e=>{let{value:s,label:n,attributes:l}=e;return(0,y.jsx)("li",{role:"tab",tabIndex:r===s?0:-1,"aria-selected":r===s,ref:e=>o.push(e),onKeyDown:h,onClick:c,...l,className:(0,a.A)("tabs__item",g.tabItem,l?.className,{"tabs__item--active":r===s}),children:n??s},s)}))})}function f(e){let{lazy:s,children:n,selectedValue:l}=e;const t=(Array.isArray(n)?n:[n]).filter(Boolean);if(s){const e=t.find((e=>e.props.value===l));return e?(0,r.cloneElement)(e,{className:(0,a.A)("margin-top--md",e.props.className)}):null}return(0,y.jsx)("div",{className:"margin-top--md",children:t.map(((e,s)=>(0,r.cloneElement)(e,{key:s,hidden:e.props.value!==l})))})}function v(e){const s=m(e);return(0,y.jsxs)("div",{className:(0,a.A)("tabs-container",g.tabList),children:[(0,y.jsx)(b,{...s,...e}),(0,y.jsx)(f,{...s,...e})]})}function w(e){const s=(0,j.A)();return(0,y.jsx)(v,{...e,children:h(e.children)},String(s))}},9475:(e,s,n)=>{function r(){window.hljs||n.e(9878).then(n.bind(n,19878)).then((e=>{window.hljs=e.default}))}async function a(){return!!window.hljs||n.e(9878).then(n.bind(n,19878)).then((e=>(window.hljs=e.default,!0)))}function l(){delete window.hljs}function t(){window.webLLM||n.e(4529).then(n.bind(n,6910)).then((e=>{window.webLLM=e}))}n.d(s,{Aj:()=>a,OI:()=>r,pK:()=>t,rk:()=>l})},15781:(e,s,n)=>{n.d(s,{A:()=>a});n(96540);var r=n(74848);function a(){return(0,r.jsx)("div",{style:{height:"1px"}})}},61886:(e,s,n)=>{function r(e){window.scrollY>0?e.style.boxShadow="0 1px 2px 0 rgb(0 0 0 / 10%)":e.style.boxShadow="unset"}function a(){setTimeout((()=>{window.removeEventListener("scroll",window.toggleNavOnScroll);const e=document.getElementsByClassName("navbar--fixed-top");if(e[0]){const s=e[0];r(s),window.toggleNavOnScroll=r.bind(this,s),window.addEventListener("scroll",window.toggleNavOnScroll)}}),2)}function l(){setTimeout((()=>{const e=document.querySelectorAll(".homepage > body > #__docusaurus > nav")?.[0];try{e.classList.add("fade-in")}catch(s){console.error(s),console.log("element was not rendered in time - use MutationObserver")}}),2)}n.r(s),n.d(s,{fadeIn:()=>l,readdAutoNavShadowToggle:()=>a})},24033:(e,s,n)=>{n.d(s,{A:()=>l,q:()=>a});n(96540);var r=n(74848);function a(e){return e?.children[0]?.children[0]}function l(e){let{children:s,minHeight:n,innerDisplay:a}=e;return(0,r.jsx)("div",{className:"documentation-example-container",style:{minHeight:`${n||400}px`},children:(0,r.jsx)("div",{style:{display:a||"block"},children:s})})}},50363:(e,s,n)=>{n.d(s,{A:()=>l});var r=n(78478),a=(n(96540),n(74848));function l(e){return(0,a.jsx)(r.A,{children:()=>{const s=n(78152).DeepChat;return(0,a.jsx)(s,{...e,children:e.children})}})}},28453:(e,s,n)=>{n.d(s,{R:()=>t,x:()=>i});var r=n(96540);const a={},l=r.createContext(a);function t(e){const s=r.useContext(l);return r.useMemo((function(){return"function"==typeof e?e(s):{...s,...e}}),[s,e])}function i(e){let s;return s=e.disableParentContext?"function"==typeof e.components?e.components(a):e.components||a:t(e.components),r.createElement(l.Provider,{value:s},e.children)}}}]); \ No newline at end of file diff --git a/assets/js/runtime~main.f734b9cb.js b/assets/js/runtime~main.3a2115b7.js similarity index 99% rename from assets/js/runtime~main.f734b9cb.js rename to assets/js/runtime~main.3a2115b7.js index c7de2afe6..dcbfaf2f0 100644 --- a/assets/js/runtime~main.f734b9cb.js +++ b/assets/js/runtime~main.3a2115b7.js @@ -1 +1 @@ -(()=>{"use strict";var e,a,d,f,c,b={},t={};function r(e){var a=t[e];if(void 0!==a)return a.exports;var d=t[e]={id:e,loaded:!1,exports:{}};return b[e].call(d.exports,d,d.exports,r),d.loaded=!0,d.exports}r.m=b,r.c=t,e=[],r.O=(a,d,f,c)=>{if(!d){var b=1/0;for(i=0;i=c)&&Object.keys(r.O).every((e=>r.O[e](d[o])))?d.splice(o--,1):(t=!1,c0&&e[i-1][2]>c;i--)e[i]=e[i-1];e[i]=[d,f,c]},r.n=e=>{var a=e&&e.__esModule?()=>e.default:()=>e;return r.d(a,{a:a}),a},d=Object.getPrototypeOf?e=>Object.getPrototypeOf(e):e=>e.__proto__,r.t=function(e,f){if(1&f&&(e=this(e)),8&f)return e;if("object"==typeof e&&e){if(4&f&&e.__esModule)return e;if(16&f&&"function"==typeof e.then)return e}var c=Object.create(null);r.r(c);var b={};a=a||[null,d({}),d([]),d(d)];for(var t=2&f&&e;"object"==typeof t&&!~a.indexOf(t);t=d(t))Object.getOwnPropertyNames(t).forEach((a=>b[a]=()=>e[a]));return b.default=()=>e,r.d(c,b),c},r.d=(e,a)=>{for(var d in a)r.o(a,d)&&!r.o(e,d)&&Object.defineProperty(e,d,{enumerable:!0,get:a[d]})},r.f={},r.e=e=>Promise.all(Object.keys(r.f).reduce(((a,d)=>(r.f[d](e,a),a)),[])),r.u=e=>"assets/js/"+({187:"c03611c9",221:"14c42b22",242:"f4a41cc5",281:"53a90a4e",286:"f80390e0",350:"8a751f9f",542:"ad7a1ef6",637:"ff031c7d",813:"7cb2479d",821:"960803bf",956:"71f93b87",957:"c141421f",958:"09bef922",1235:"a7456010",1285:"2609d35c",1351:"cab71165",1445:"2fd6e700",1537:"5efdef18",1552:"7cd620da",1567:"22dd74f7",1584:"796155b4",1738:"15033d09",1848:"50fc3c0c",1946:"2e8e5295",2138:"1a4e3797",2170:"3d7ef9b9",2244:"8e6cc846",2538:"cf9b7507",2634:"c4f5d8e4",2778:"bc7c935a",2827:"2e0dce54",3054:"70adbe13",3153:"4a70a78f",3190:"95881879",3338:"71a4181b",3555:"c214479d",3732:"0cfca6dd",4091:"7ea5518d",4135:"fe82bda8",4172:"b8a67d89",4318:"2b486e95",4444:"c374aadb",4474:"ab90bf36",4568:"df0688a0",4636:"a59ec873",4747:"83d494d4",4871:"f17f53dd",4890:"d929016d",4982:"b0d8ca7b",5197:"ab123836",5351:"50b9661c",5571:"943f163d",5742:"aba21aa0",5762:"a40ae8f2",5790:"fbd5181d",6267:"3c83ca7d",6324:"22f048b3",6387:"a19404f3",6581:"78c33b59",6664:"3f2a55e2",6731:"b9afe2a8",6754:"3c0c6a7f",6974:"981a04d0",6982:"288adf4d",6984:"a188041f",7024:"47058687",7048:"b467856c",7058:"e39666b6",7098:"a7bd4aaa",7289:"cf7ccda1",7647:"60e67547",7744:"707d70df",7757:"ec3987b3",7769:"fa7d1dcf",8045:"87712f4e",8223:"5812764a",8339:"0a24f6e4",8392:"08854dbd",8401:"17896441",8437:"dbc3e690",8537:"e0aabcf0",8750:"91b8d63b",8770:"08c9246a",8910:"1e0b4360",8911:"0c5b3199",9048:"a94703ab",9240:"43744cfd",9353:"91c39c3c",9505:"945fd7ad",9647:"5e95c892",9738:"ef02564c",9837:"38776a5e"}[e]||e)+"."+{187:"21200de1",221:"7ff81296",242:"ab65324d",281:"0522a676",286:"087d9f57",350:"fe9888d9",416:"05118c27",542:"5616cc64",637:"3187034e",813:"a3472d91",821:"393f7fbe",956:"4d7a8213",957:"3b940a8d",958:"a70dd420",1204:"b20248ad",1235:"2ec2f6c0",1285:"83faeda9",1351:"f9c56454",1445:"e31cfd2c",1537:"7177922e",1552:"ce6bfe13",1567:"60f73995",1584:"14e54dbf",1738:"a258b60f",1848:"5c40051e",1946:"8541d555",2138:"4567c2a5",2170:"1652813f",2237:"4c982590",2244:"04cc3e5f",2538:"4b0f9c39",2634:"68e352b0",2778:"fa36cff4",2827:"6c7d9b69",3054:"37d0a1bb",3090:"6ad658d6",3153:"4fb245b6",3190:"aae1681f",3338:"126fcc46",3459:"1c027c65",3555:"031ee1fe",3732:"301d437e",4091:"3840e0aa",4135:"dbfe0770",4172:"2c131242",4318:"224383c9",4444:"03232c83",4474:"e1de453e",4529:"79d133c0",4568:"01294067",4636:"a895b3a3",4747:"ba75b9a6",4871:"892286ed",4890:"59c4cbb3",4982:"49440341",5197:"a5bf30e1",5351:"6fc66ed0",5554:"8f1169f6",5571:"752f4367",5742:"a48c4f75",5762:"4bf00723",5790:"011d304d",6267:"38e98253",6324:"306b8c0f",6387:"d1ee60e2",6581:"d914ebf0",6664:"eccd4ae8",6715:"bf7b0686",6731:"9970659c",6754:"9e360407",6974:"77e433bd",6982:"391da110",6984:"592e8d60",7024:"a2aa286d",7048:"4cbf3289",7058:"1536cb85",7098:"49ba9652",7289:"0c97e1e1",7647:"f9f77251",7744:"a2b5ac66",7757:"5ebee5f4",7769:"df5e6983",8045:"92bbd667",8158:"4d82f1a9",8223:"061eca81",8339:"014aff65",8392:"d03a54ca",8401:"5f334960",8437:"c9fa6d00",8537:"5a2a01ad",8750:"035c6a14",8756:"9e93a69a",8770:"16bf04ff",8910:"fa31fbf9",8911:"c0c0ad5d",8913:"3eea0e0d",9048:"c8168260",9145:"93aa48aa",9240:"effaac40",9353:"493e0a09",9505:"0f390cf3",9647:"f7c8666a",9738:"ba71ea2d",9837:"a343d520",9878:"fcce00a3"}[e]+".js",r.miniCssF=e=>{},r.g=function(){if("object"==typeof globalThis)return globalThis;try{return this||new Function("return this")()}catch(e){if("object"==typeof window)return window}}(),r.o=(e,a)=>Object.prototype.hasOwnProperty.call(e,a),f={},c="website:",r.l=(e,a,d,b)=>{if(f[e])f[e].push(a);else{var t,o;if(void 0!==d)for(var n=document.getElementsByTagName("script"),i=0;i{t.onerror=t.onload=null,clearTimeout(s);var c=f[e];if(delete f[e],t.parentNode&&t.parentNode.removeChild(t),c&&c.forEach((e=>e(d))),a)return a(d)},s=setTimeout(l.bind(null,void 0,{type:"timeout",target:t}),12e4);t.onerror=l.bind(null,t.onerror),t.onload=l.bind(null,t.onload),o&&document.head.appendChild(t)}},r.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},r.p="/",r.gca=function(e){return e={17896441:"8401",47058687:"7024",95881879:"3190",c03611c9:"187","14c42b22":"221",f4a41cc5:"242","53a90a4e":"281",f80390e0:"286","8a751f9f":"350",ad7a1ef6:"542",ff031c7d:"637","7cb2479d":"813","960803bf":"821","71f93b87":"956",c141421f:"957","09bef922":"958",a7456010:"1235","2609d35c":"1285",cab71165:"1351","2fd6e700":"1445","5efdef18":"1537","7cd620da":"1552","22dd74f7":"1567","796155b4":"1584","15033d09":"1738","50fc3c0c":"1848","2e8e5295":"1946","1a4e3797":"2138","3d7ef9b9":"2170","8e6cc846":"2244",cf9b7507:"2538",c4f5d8e4:"2634",bc7c935a:"2778","2e0dce54":"2827","70adbe13":"3054","4a70a78f":"3153","71a4181b":"3338",c214479d:"3555","0cfca6dd":"3732","7ea5518d":"4091",fe82bda8:"4135",b8a67d89:"4172","2b486e95":"4318",c374aadb:"4444",ab90bf36:"4474",df0688a0:"4568",a59ec873:"4636","83d494d4":"4747",f17f53dd:"4871",d929016d:"4890",b0d8ca7b:"4982",ab123836:"5197","50b9661c":"5351","943f163d":"5571",aba21aa0:"5742",a40ae8f2:"5762",fbd5181d:"5790","3c83ca7d":"6267","22f048b3":"6324",a19404f3:"6387","78c33b59":"6581","3f2a55e2":"6664",b9afe2a8:"6731","3c0c6a7f":"6754","981a04d0":"6974","288adf4d":"6982",a188041f:"6984",b467856c:"7048",e39666b6:"7058",a7bd4aaa:"7098",cf7ccda1:"7289","60e67547":"7647","707d70df":"7744",ec3987b3:"7757",fa7d1dcf:"7769","87712f4e":"8045","5812764a":"8223","0a24f6e4":"8339","08854dbd":"8392",dbc3e690:"8437",e0aabcf0:"8537","91b8d63b":"8750","08c9246a":"8770","1e0b4360":"8910","0c5b3199":"8911",a94703ab:"9048","43744cfd":"9240","91c39c3c":"9353","945fd7ad":"9505","5e95c892":"9647",ef02564c:"9738","38776a5e":"9837"}[e]||e,r.p+r.u(e)},(()=>{r.b=document.baseURI||self.location.href;var e={5354:0,1869:0};r.f.j=(a,d)=>{var f=r.o(e,a)?e[a]:void 0;if(0!==f)if(f)d.push(f[2]);else if(/^(1869|5354)$/.test(a))e[a]=0;else{var c=new Promise(((d,c)=>f=e[a]=[d,c]));d.push(f[2]=c);var b=r.p+r.u(a),t=new Error;r.l(b,(d=>{if(r.o(e,a)&&(0!==(f=e[a])&&(e[a]=void 0),f)){var c=d&&("load"===d.type?"missing":d.type),b=d&&d.target&&d.target.src;t.message="Loading chunk "+a+" failed.\n("+c+": "+b+")",t.name="ChunkLoadError",t.type=c,t.request=b,f[1](t)}}),"chunk-"+a,a)}},r.O.j=a=>0===e[a];var a=(a,d)=>{var f,c,b=d[0],t=d[1],o=d[2],n=0;if(b.some((a=>0!==e[a]))){for(f in t)r.o(t,f)&&(r.m[f]=t[f]);if(o)var i=o(r)}for(a&&a(d);n{"use strict";var e,a,d,f,c,b={},t={};function r(e){var a=t[e];if(void 0!==a)return a.exports;var d=t[e]={id:e,loaded:!1,exports:{}};return b[e].call(d.exports,d,d.exports,r),d.loaded=!0,d.exports}r.m=b,r.c=t,e=[],r.O=(a,d,f,c)=>{if(!d){var b=1/0;for(i=0;i=c)&&Object.keys(r.O).every((e=>r.O[e](d[o])))?d.splice(o--,1):(t=!1,c0&&e[i-1][2]>c;i--)e[i]=e[i-1];e[i]=[d,f,c]},r.n=e=>{var a=e&&e.__esModule?()=>e.default:()=>e;return r.d(a,{a:a}),a},d=Object.getPrototypeOf?e=>Object.getPrototypeOf(e):e=>e.__proto__,r.t=function(e,f){if(1&f&&(e=this(e)),8&f)return e;if("object"==typeof e&&e){if(4&f&&e.__esModule)return e;if(16&f&&"function"==typeof e.then)return e}var c=Object.create(null);r.r(c);var b={};a=a||[null,d({}),d([]),d(d)];for(var t=2&f&&e;"object"==typeof t&&!~a.indexOf(t);t=d(t))Object.getOwnPropertyNames(t).forEach((a=>b[a]=()=>e[a]));return b.default=()=>e,r.d(c,b),c},r.d=(e,a)=>{for(var d in a)r.o(a,d)&&!r.o(e,d)&&Object.defineProperty(e,d,{enumerable:!0,get:a[d]})},r.f={},r.e=e=>Promise.all(Object.keys(r.f).reduce(((a,d)=>(r.f[d](e,a),a)),[])),r.u=e=>"assets/js/"+({187:"c03611c9",221:"14c42b22",242:"f4a41cc5",281:"53a90a4e",286:"f80390e0",350:"8a751f9f",542:"ad7a1ef6",637:"ff031c7d",813:"7cb2479d",821:"960803bf",956:"71f93b87",957:"c141421f",958:"09bef922",1235:"a7456010",1285:"2609d35c",1351:"cab71165",1445:"2fd6e700",1537:"5efdef18",1552:"7cd620da",1567:"22dd74f7",1584:"796155b4",1738:"15033d09",1848:"50fc3c0c",1946:"2e8e5295",2138:"1a4e3797",2170:"3d7ef9b9",2244:"8e6cc846",2538:"cf9b7507",2634:"c4f5d8e4",2778:"bc7c935a",2827:"2e0dce54",3054:"70adbe13",3153:"4a70a78f",3190:"95881879",3338:"71a4181b",3555:"c214479d",3732:"0cfca6dd",4091:"7ea5518d",4135:"fe82bda8",4172:"b8a67d89",4318:"2b486e95",4444:"c374aadb",4474:"ab90bf36",4568:"df0688a0",4636:"a59ec873",4747:"83d494d4",4871:"f17f53dd",4890:"d929016d",4982:"b0d8ca7b",5197:"ab123836",5351:"50b9661c",5571:"943f163d",5742:"aba21aa0",5762:"a40ae8f2",5790:"fbd5181d",6267:"3c83ca7d",6324:"22f048b3",6387:"a19404f3",6581:"78c33b59",6664:"3f2a55e2",6731:"b9afe2a8",6754:"3c0c6a7f",6974:"981a04d0",6982:"288adf4d",6984:"a188041f",7024:"47058687",7048:"b467856c",7058:"e39666b6",7098:"a7bd4aaa",7289:"cf7ccda1",7647:"60e67547",7744:"707d70df",7757:"ec3987b3",7769:"fa7d1dcf",8045:"87712f4e",8223:"5812764a",8339:"0a24f6e4",8392:"08854dbd",8401:"17896441",8437:"dbc3e690",8537:"e0aabcf0",8750:"91b8d63b",8770:"08c9246a",8910:"1e0b4360",8911:"0c5b3199",9048:"a94703ab",9240:"43744cfd",9353:"91c39c3c",9505:"945fd7ad",9647:"5e95c892",9738:"ef02564c",9837:"38776a5e"}[e]||e)+"."+{187:"21200de1",221:"7ff81296",242:"ab65324d",281:"0522a676",286:"087d9f57",350:"fe9888d9",416:"05118c27",542:"5616cc64",637:"3187034e",813:"a3472d91",821:"393f7fbe",956:"4d7a8213",957:"3b940a8d",958:"a70dd420",1204:"b20248ad",1235:"2ec2f6c0",1285:"83faeda9",1351:"f9c56454",1445:"e31cfd2c",1537:"7177922e",1552:"ce6bfe13",1567:"60f73995",1584:"14e54dbf",1738:"a258b60f",1848:"5c40051e",1946:"8541d555",2138:"4567c2a5",2170:"1652813f",2237:"4c982590",2244:"04cc3e5f",2538:"4b0f9c39",2634:"68e352b0",2778:"fa36cff4",2827:"6c7d9b69",3054:"37d0a1bb",3090:"6ad658d6",3153:"4fb245b6",3190:"aae1681f",3338:"126fcc46",3459:"1c027c65",3555:"ca2549a1",3732:"301d437e",4091:"3840e0aa",4135:"dbfe0770",4172:"2c131242",4318:"224383c9",4444:"03232c83",4474:"e1de453e",4529:"79d133c0",4568:"01294067",4636:"a895b3a3",4747:"ba75b9a6",4871:"892286ed",4890:"59c4cbb3",4982:"49440341",5197:"a5bf30e1",5351:"6fc66ed0",5554:"8f1169f6",5571:"752f4367",5742:"a48c4f75",5762:"4bf00723",5790:"011d304d",6267:"38e98253",6324:"306b8c0f",6387:"d1ee60e2",6581:"d914ebf0",6664:"eccd4ae8",6715:"bf7b0686",6731:"9970659c",6754:"9e360407",6974:"77e433bd",6982:"391da110",6984:"592e8d60",7024:"a2aa286d",7048:"4cbf3289",7058:"1536cb85",7098:"49ba9652",7289:"0c97e1e1",7647:"f9f77251",7744:"a2b5ac66",7757:"5ebee5f4",7769:"df5e6983",8045:"92bbd667",8158:"4d82f1a9",8223:"061eca81",8339:"014aff65",8392:"d03a54ca",8401:"5f334960",8437:"c9fa6d00",8537:"5a2a01ad",8750:"035c6a14",8756:"9e93a69a",8770:"16bf04ff",8910:"fa31fbf9",8911:"c0c0ad5d",8913:"3eea0e0d",9048:"c8168260",9145:"93aa48aa",9240:"effaac40",9353:"493e0a09",9505:"0f390cf3",9647:"f7c8666a",9738:"ba71ea2d",9837:"a343d520",9878:"fcce00a3"}[e]+".js",r.miniCssF=e=>{},r.g=function(){if("object"==typeof globalThis)return globalThis;try{return this||new Function("return this")()}catch(e){if("object"==typeof window)return window}}(),r.o=(e,a)=>Object.prototype.hasOwnProperty.call(e,a),f={},c="website:",r.l=(e,a,d,b)=>{if(f[e])f[e].push(a);else{var t,o;if(void 0!==d)for(var n=document.getElementsByTagName("script"),i=0;i{t.onerror=t.onload=null,clearTimeout(s);var c=f[e];if(delete f[e],t.parentNode&&t.parentNode.removeChild(t),c&&c.forEach((e=>e(d))),a)return a(d)},s=setTimeout(l.bind(null,void 0,{type:"timeout",target:t}),12e4);t.onerror=l.bind(null,t.onerror),t.onload=l.bind(null,t.onload),o&&document.head.appendChild(t)}},r.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},r.p="/",r.gca=function(e){return e={17896441:"8401",47058687:"7024",95881879:"3190",c03611c9:"187","14c42b22":"221",f4a41cc5:"242","53a90a4e":"281",f80390e0:"286","8a751f9f":"350",ad7a1ef6:"542",ff031c7d:"637","7cb2479d":"813","960803bf":"821","71f93b87":"956",c141421f:"957","09bef922":"958",a7456010:"1235","2609d35c":"1285",cab71165:"1351","2fd6e700":"1445","5efdef18":"1537","7cd620da":"1552","22dd74f7":"1567","796155b4":"1584","15033d09":"1738","50fc3c0c":"1848","2e8e5295":"1946","1a4e3797":"2138","3d7ef9b9":"2170","8e6cc846":"2244",cf9b7507:"2538",c4f5d8e4:"2634",bc7c935a:"2778","2e0dce54":"2827","70adbe13":"3054","4a70a78f":"3153","71a4181b":"3338",c214479d:"3555","0cfca6dd":"3732","7ea5518d":"4091",fe82bda8:"4135",b8a67d89:"4172","2b486e95":"4318",c374aadb:"4444",ab90bf36:"4474",df0688a0:"4568",a59ec873:"4636","83d494d4":"4747",f17f53dd:"4871",d929016d:"4890",b0d8ca7b:"4982",ab123836:"5197","50b9661c":"5351","943f163d":"5571",aba21aa0:"5742",a40ae8f2:"5762",fbd5181d:"5790","3c83ca7d":"6267","22f048b3":"6324",a19404f3:"6387","78c33b59":"6581","3f2a55e2":"6664",b9afe2a8:"6731","3c0c6a7f":"6754","981a04d0":"6974","288adf4d":"6982",a188041f:"6984",b467856c:"7048",e39666b6:"7058",a7bd4aaa:"7098",cf7ccda1:"7289","60e67547":"7647","707d70df":"7744",ec3987b3:"7757",fa7d1dcf:"7769","87712f4e":"8045","5812764a":"8223","0a24f6e4":"8339","08854dbd":"8392",dbc3e690:"8437",e0aabcf0:"8537","91b8d63b":"8750","08c9246a":"8770","1e0b4360":"8910","0c5b3199":"8911",a94703ab:"9048","43744cfd":"9240","91c39c3c":"9353","945fd7ad":"9505","5e95c892":"9647",ef02564c:"9738","38776a5e":"9837"}[e]||e,r.p+r.u(e)},(()=>{r.b=document.baseURI||self.location.href;var e={5354:0,1869:0};r.f.j=(a,d)=>{var f=r.o(e,a)?e[a]:void 0;if(0!==f)if(f)d.push(f[2]);else if(/^(1869|5354)$/.test(a))e[a]=0;else{var c=new Promise(((d,c)=>f=e[a]=[d,c]));d.push(f[2]=c);var b=r.p+r.u(a),t=new Error;r.l(b,(d=>{if(r.o(e,a)&&(0!==(f=e[a])&&(e[a]=void 0),f)){var c=d&&("load"===d.type?"missing":d.type),b=d&&d.target&&d.target.src;t.message="Loading chunk "+a+" failed.\n("+c+": "+b+")",t.name="ChunkLoadError",t.type=c,t.request=b,f[1](t)}}),"chunk-"+a,a)}},r.O.j=a=>0===e[a];var a=(a,d)=>{var f,c,b=d[0],t=d[1],o=d[2],n=0;if(b.some((a=>0!==e[a]))){for(f in t)r.o(t,f)&&(r.m[f]=t[f]);if(o)var i=o(r)}for(a&&a(d);n - + diff --git a/docs/demo/index.html b/docs/demo/index.html index 1b11ff4c5..bcbdb7750 100644 --- a/docs/demo/index.html +++ b/docs/demo/index.html @@ -13,7 +13,7 @@ - + diff --git a/docs/directConnection/AssemblyAI/index.html b/docs/directConnection/AssemblyAI/index.html index 036c93a06..621b7e37f 100644 --- a/docs/directConnection/AssemblyAI/index.html +++ b/docs/directConnection/AssemblyAI/index.html @@ -13,7 +13,7 @@ - + diff --git a/docs/directConnection/Azure/index.html b/docs/directConnection/Azure/index.html index 284f66045..da2fa136c 100644 --- a/docs/directConnection/Azure/index.html +++ b/docs/directConnection/Azure/index.html @@ -13,7 +13,7 @@ - + diff --git a/docs/directConnection/Cohere/index.html b/docs/directConnection/Cohere/index.html index 449ae3870..adb88f1b5 100644 --- a/docs/directConnection/Cohere/index.html +++ b/docs/directConnection/Cohere/index.html @@ -13,7 +13,7 @@ - + diff --git a/docs/directConnection/HuggingFace/index.html b/docs/directConnection/HuggingFace/index.html index e36df39cf..f4a937f59 100644 --- a/docs/directConnection/HuggingFace/index.html +++ b/docs/directConnection/HuggingFace/index.html @@ -13,7 +13,7 @@ - + diff --git a/docs/directConnection/OpenAI/index.html b/docs/directConnection/OpenAI/index.html index 52cf4e975..a08990232 100644 --- a/docs/directConnection/OpenAI/index.html +++ b/docs/directConnection/OpenAI/index.html @@ -13,7 +13,7 @@ - + diff --git a/docs/directConnection/StabilityAI/index.html b/docs/directConnection/StabilityAI/index.html index dcde81e17..7812648f4 100644 --- a/docs/directConnection/StabilityAI/index.html +++ b/docs/directConnection/StabilityAI/index.html @@ -13,7 +13,7 @@ - + diff --git a/docs/directConnection/index.html b/docs/directConnection/index.html index 9403340c4..5be27897b 100644 --- a/docs/directConnection/index.html +++ b/docs/directConnection/index.html @@ -13,7 +13,7 @@ - + diff --git a/docs/events/index.html b/docs/events/index.html index fe3b82609..c8f7a2274 100644 --- a/docs/events/index.html +++ b/docs/events/index.html @@ -13,7 +13,7 @@ - + diff --git a/docs/files/index.html b/docs/files/index.html index 69295555e..4da711446 100644 --- a/docs/files/index.html +++ b/docs/files/index.html @@ -13,7 +13,7 @@ - + diff --git a/docs/installation/index.html b/docs/installation/index.html index c69c2b8b4..61f01a2c9 100644 --- a/docs/installation/index.html +++ b/docs/installation/index.html @@ -13,7 +13,7 @@ - + diff --git a/docs/interceptors/index.html b/docs/interceptors/index.html index 0e5faa5da..509c30e6b 100644 --- a/docs/interceptors/index.html +++ b/docs/interceptors/index.html @@ -13,7 +13,7 @@ - + diff --git a/docs/introPanel/index.html b/docs/introPanel/index.html index 80c063604..f46d34a01 100644 --- a/docs/introPanel/index.html +++ b/docs/introPanel/index.html @@ -13,7 +13,7 @@ - + diff --git a/docs/introduction/index.html b/docs/introduction/index.html index 11b7d3fce..ceac65564 100644 --- a/docs/introduction/index.html +++ b/docs/introduction/index.html @@ -13,7 +13,7 @@ - + diff --git a/docs/messages/HTML/index.html b/docs/messages/HTML/index.html index 4ad61151f..757abeb52 100644 --- a/docs/messages/HTML/index.html +++ b/docs/messages/HTML/index.html @@ -13,7 +13,7 @@ - + diff --git a/docs/messages/index.html b/docs/messages/index.html index c07914cce..3c1fc5746 100644 --- a/docs/messages/index.html +++ b/docs/messages/index.html @@ -13,7 +13,7 @@ - + @@ -33,13 +33,14 @@

Example

introMessage​

    -
  • Type: {text?: string, html?: string}
    • +
  • Type: {text?: string, html?: string} | Array

Initial ai message that is displayed when the chat is loaded. It is different to history as it will not trigger the onMessage listener, will not be part of the returned messages when getMessages is called and is not taken into consideration when calculating requestBodyLimits.
html is used to render custom code and can be coupled with a deep-chat-temporary-message -class to make this message disappear after a new one is added.

+class to make this message disappear after a new one is added.
+This can either be defined as an object for one message, or as an array for multiple ones.

Example​

<deep-chat introMessage='{"text": "Hi I am your assistant, ask me anything!"}'></deep-chat>
diff --git a/docs/messages/styles/index.html b/docs/messages/styles/index.html index 0dfe67aca..3ea8a0fef 100644 --- a/docs/messages/styles/index.html +++ b/docs/messages/styles/index.html @@ -13,7 +13,7 @@ - + diff --git a/docs/methods/index.html b/docs/methods/index.html index b9402c6b5..852754bb3 100644 --- a/docs/methods/index.html +++ b/docs/methods/index.html @@ -13,7 +13,7 @@ - + diff --git a/docs/speech/index.html b/docs/speech/index.html index af2a8b026..dd8145d66 100644 --- a/docs/speech/index.html +++ b/docs/speech/index.html @@ -13,7 +13,7 @@ - + diff --git a/docs/styles/index.html b/docs/styles/index.html index 01514a001..25e133626 100644 --- a/docs/styles/index.html +++ b/docs/styles/index.html @@ -13,7 +13,7 @@ - + diff --git a/docs/webModel/index.html b/docs/webModel/index.html index 7c73326f4..ad38a91e8 100644 --- a/docs/webModel/index.html +++ b/docs/webModel/index.html @@ -13,7 +13,7 @@ - + diff --git a/examples/Layout/fullScreen/index.html b/examples/Layout/fullScreen/index.html index f4aa9bbe9..f68205c53 100644 --- a/examples/Layout/fullScreen/index.html +++ b/examples/Layout/fullScreen/index.html @@ -13,7 +13,7 @@ - + diff --git a/examples/Layout/sticky/index.html b/examples/Layout/sticky/index.html index 0ba0ca596..8fa5a70d6 100644 --- a/examples/Layout/sticky/index.html +++ b/examples/Layout/sticky/index.html @@ -13,7 +13,7 @@ - + diff --git a/examples/design/index.html b/examples/design/index.html index a837fd7c6..af9802227 100644 --- a/examples/design/index.html +++ b/examples/design/index.html @@ -13,7 +13,7 @@ - + diff --git a/examples/externalModules/index.html b/examples/externalModules/index.html index a01a82768..73ee4272f 100644 --- a/examples/externalModules/index.html +++ b/examples/externalModules/index.html @@ -13,7 +13,7 @@ - + diff --git a/examples/frameworks/index.html b/examples/frameworks/index.html index f12f9e9c7..7bd1f888d 100644 --- a/examples/frameworks/index.html +++ b/examples/frameworks/index.html @@ -13,7 +13,7 @@ - + diff --git a/examples/servers/index.html b/examples/servers/index.html index f3756690e..9b9d84006 100644 --- a/examples/servers/index.html +++ b/examples/servers/index.html @@ -13,7 +13,7 @@ - + diff --git a/exploreButton/exploreButton/index.html b/exploreButton/exploreButton/index.html index 508e1dd67..e560fe30e 100644 --- a/exploreButton/exploreButton/index.html +++ b/exploreButton/exploreButton/index.html @@ -13,7 +13,7 @@ - + diff --git a/features/captureFiles/captureFiles/index.html b/features/captureFiles/captureFiles/index.html index 5d8eb80e2..77d1e62f4 100644 --- a/features/captureFiles/captureFiles/index.html +++ b/features/captureFiles/captureFiles/index.html @@ -13,7 +13,7 @@ - + diff --git a/features/connect/connect/index.html b/features/connect/connect/index.html index a2c4f89ca..5f0ab4da3 100644 --- a/features/connect/connect/index.html +++ b/features/connect/connect/index.html @@ -13,7 +13,7 @@ - + diff --git a/features/customize/customize/index.html b/features/customize/customize/index.html index de6d2a231..f57caa106 100644 --- a/features/customize/customize/index.html +++ b/features/customize/customize/index.html @@ -13,7 +13,7 @@ - + diff --git a/features/features/index.html b/features/features/index.html index d9652ce10..4a9f4976a 100644 --- a/features/features/index.html +++ b/features/features/index.html @@ -13,7 +13,7 @@ - + diff --git a/features/media/media/index.html b/features/media/media/index.html index 945be2722..a9ad77cbd 100644 --- a/features/media/media/index.html +++ b/features/media/media/index.html @@ -13,7 +13,7 @@ - + diff --git a/features/speech/speech/index.html b/features/speech/speech/index.html index 5b4a54413..db0643afb 100644 --- a/features/speech/speech/index.html +++ b/features/speech/speech/index.html @@ -13,7 +13,7 @@ - + diff --git a/footer/footer/index.html b/footer/footer/index.html index 99b8e7dbd..439770e1a 100644 --- a/footer/footer/index.html +++ b/footer/footer/index.html @@ -13,7 +13,7 @@ - + diff --git a/index.html b/index.html index 2510a6b76..009160261 100644 --- a/index.html +++ b/index.html @@ -13,7 +13,7 @@ - + diff --git a/playground/chat/manipulate/playgroundAddButton/index.html b/playground/chat/manipulate/playgroundAddButton/index.html index 000f544a7..b5dc23a8c 100644 --- a/playground/chat/manipulate/playgroundAddButton/index.html +++ b/playground/chat/manipulate/playgroundAddButton/index.html @@ -13,7 +13,7 @@ - + diff --git a/playground/chat/playgroundChatComponent/index.html b/playground/chat/playgroundChatComponent/index.html index 17dc3a597..12cf01ec0 100644 --- a/playground/chat/playgroundChatComponent/index.html +++ b/playground/chat/playgroundChatComponent/index.html @@ -13,7 +13,7 @@ - + diff --git a/playground/chat/playgroundChatWrapper/index.html b/playground/chat/playgroundChatWrapper/index.html index a60648ff8..53fcdf77c 100644 --- a/playground/chat/playgroundChatWrapper/index.html +++ b/playground/chat/playgroundChatWrapper/index.html @@ -13,7 +13,7 @@ - + diff --git a/playground/chat/playgroundChatWrapperConfig/index.html b/playground/chat/playgroundChatWrapperConfig/index.html index 6d8f49831..f85fa2fc0 100644 --- a/playground/chat/playgroundChatWrapperConfig/index.html +++ b/playground/chat/playgroundChatWrapperConfig/index.html @@ -13,7 +13,7 @@ - + diff --git a/playground/chat/playgroundChatWrapperLogo/index.html b/playground/chat/playgroundChatWrapperLogo/index.html index b47545460..7feaeb545 100644 --- a/playground/chat/playgroundChatWrapperLogo/index.html +++ b/playground/chat/playgroundChatWrapperLogo/index.html @@ -13,7 +13,7 @@ - + diff --git a/playground/chat/playgroundChatWrapperText/index.html b/playground/chat/playgroundChatWrapperText/index.html index 4cf987b06..57a8b35ad 100644 --- a/playground/chat/playgroundChatWrapperText/index.html +++ b/playground/chat/playgroundChatWrapperText/index.html @@ -13,7 +13,7 @@ - + diff --git a/playground/header/export/modal/playgroundExportModal/index.html b/playground/header/export/modal/playgroundExportModal/index.html index 2805cc648..1ad0b336a 100644 --- a/playground/header/export/modal/playgroundExportModal/index.html +++ b/playground/header/export/modal/playgroundExportModal/index.html @@ -13,7 +13,7 @@ - + diff --git a/playground/header/export/playgroundExportButton/index.html b/playground/header/export/playgroundExportButton/index.html index 08968e61b..67dc18b86 100644 --- a/playground/header/export/playgroundExportButton/index.html +++ b/playground/header/export/playgroundExportButton/index.html @@ -13,7 +13,7 @@ - + diff --git a/playground/header/information/modal/playgroundInformationModal/index.html b/playground/header/information/modal/playgroundInformationModal/index.html index 56ff80a20..93e3a8dda 100644 --- a/playground/header/information/modal/playgroundInformationModal/index.html +++ b/playground/header/information/modal/playgroundInformationModal/index.html @@ -13,7 +13,7 @@ - + diff --git a/playground/header/information/playgroundInformationButton/index.html b/playground/header/information/playgroundInformationButton/index.html index 5d54a47b5..d08a18957 100644 --- a/playground/header/information/playgroundInformationButton/index.html +++ b/playground/header/information/playgroundInformationButton/index.html @@ -13,7 +13,7 @@ - + diff --git a/playground/header/layout/playgroundLayoutButton/index.html b/playground/header/layout/playgroundLayoutButton/index.html index 69dac0644..1797fc813 100644 --- a/playground/header/layout/playgroundLayoutButton/index.html +++ b/playground/header/layout/playgroundLayoutButton/index.html @@ -13,7 +13,7 @@ - + diff --git a/playground/header/playgroundCog/index.html b/playground/header/playgroundCog/index.html index fe92f5fa6..8fc37adf3 100644 --- a/playground/header/playgroundCog/index.html +++ b/playground/header/playgroundCog/index.html @@ -13,7 +13,7 @@ - + diff --git a/playground/header/playgroundHeaderButtons/index.html b/playground/header/playgroundHeaderButtons/index.html index 2a0fa339f..809d8a0b7 100644 --- a/playground/header/playgroundHeaderButtons/index.html +++ b/playground/header/playgroundHeaderButtons/index.html @@ -13,7 +13,7 @@ - + diff --git a/playground/header/playgroundShield/index.html b/playground/header/playgroundShield/index.html index 303dbdfac..72dc9d040 100644 --- a/playground/header/playgroundShield/index.html +++ b/playground/header/playgroundShield/index.html @@ -13,7 +13,7 @@ - + diff --git a/playground/header/upload/modal/playgroundUploadModal/index.html b/playground/header/upload/modal/playgroundUploadModal/index.html index 24c4c5988..6ce5807db 100644 --- a/playground/header/upload/modal/playgroundUploadModal/index.html +++ b/playground/header/upload/modal/playgroundUploadModal/index.html @@ -13,7 +13,7 @@ - + diff --git a/playground/header/upload/playgroundUploadButton/index.html b/playground/header/upload/playgroundUploadButton/index.html index 6a0bb060b..b1ea02d8f 100644 --- a/playground/header/upload/playgroundUploadButton/index.html +++ b/playground/header/upload/playgroundUploadButton/index.html @@ -13,7 +13,7 @@ - + diff --git a/playground/index.html b/playground/index.html index b3866bc5d..0b58bf70f 100644 --- a/playground/index.html +++ b/playground/index.html @@ -13,7 +13,7 @@ - + diff --git a/playground/playgroundSelect/index.html b/playground/playgroundSelect/index.html index 48cfb5303..748262f87 100644 --- a/playground/playgroundSelect/index.html +++ b/playground/playgroundSelect/index.html @@ -13,7 +13,7 @@ - + diff --git a/playground/serviceModal/close/serviceModalCloseButtons/index.html b/playground/serviceModal/close/serviceModalCloseButtons/index.html index 50141b6eb..b0b9cea09 100644 --- a/playground/serviceModal/close/serviceModalCloseButtons/index.html +++ b/playground/serviceModal/close/serviceModalCloseButtons/index.html @@ -13,7 +13,7 @@ - + diff --git a/playground/serviceModal/code/serviceCode/index.html b/playground/serviceModal/code/serviceCode/index.html index 84efe71ae..c1f6d82db 100644 --- a/playground/serviceModal/code/serviceCode/index.html +++ b/playground/serviceModal/code/serviceCode/index.html @@ -13,7 +13,7 @@ - + diff --git a/playground/serviceModal/fields/serviceConstructableObject/index.html b/playground/serviceModal/fields/serviceConstructableObject/index.html index cec3a68fd..3ed61cc5c 100644 --- a/playground/serviceModal/fields/serviceConstructableObject/index.html +++ b/playground/serviceModal/fields/serviceConstructableObject/index.html @@ -13,7 +13,7 @@ - + diff --git a/playground/serviceModal/fields/serviceField/index.html b/playground/serviceModal/fields/serviceField/index.html index a798dc9cd..507fe4b98 100644 --- a/playground/serviceModal/fields/serviceField/index.html +++ b/playground/serviceModal/fields/serviceField/index.html @@ -13,7 +13,7 @@ - + diff --git a/playground/serviceModal/fields/serviceOptionalParametersFields/index.html b/playground/serviceModal/fields/serviceOptionalParametersFields/index.html index 0380323d0..2ef510f98 100644 --- a/playground/serviceModal/fields/serviceOptionalParametersFields/index.html +++ b/playground/serviceModal/fields/serviceOptionalParametersFields/index.html @@ -13,7 +13,7 @@ - + diff --git a/playground/serviceModal/fields/serviceRequiredField/index.html b/playground/serviceModal/fields/serviceRequiredField/index.html index 7a343c615..50dbc4899 100644 --- a/playground/serviceModal/fields/serviceRequiredField/index.html +++ b/playground/serviceModal/fields/serviceRequiredField/index.html @@ -13,7 +13,7 @@ - + diff --git a/playground/serviceModal/fields/serviceTypeField/index.html b/playground/serviceModal/fields/serviceTypeField/index.html index 114058f6c..0118b7c82 100644 --- a/playground/serviceModal/fields/serviceTypeField/index.html +++ b/playground/serviceModal/fields/serviceTypeField/index.html @@ -13,7 +13,7 @@ - + diff --git a/playground/serviceModal/serviceModal/index.html b/playground/serviceModal/serviceModal/index.html index 23b3d873d..1902e3896 100644 --- a/playground/serviceModal/serviceModal/index.html +++ b/playground/serviceModal/serviceModal/index.html @@ -13,7 +13,7 @@ - + diff --git a/playground/serviceModal/wrappers/collapsableSection/index.html b/playground/serviceModal/wrappers/collapsableSection/index.html index 17cc01264..774cbcf0b 100644 --- a/playground/serviceModal/wrappers/collapsableSection/index.html +++ b/playground/serviceModal/wrappers/collapsableSection/index.html @@ -13,7 +13,7 @@ - + diff --git a/playground/tooltip/playgroundTooltipWrapper/index.html b/playground/tooltip/playgroundTooltipWrapper/index.html index 437d19c45..c5dc88838 100644 --- a/playground/tooltip/playgroundTooltipWrapper/index.html +++ b/playground/tooltip/playgroundTooltipWrapper/index.html @@ -13,7 +13,7 @@ - + diff --git a/preload/preloadImages/index.html b/preload/preloadImages/index.html index 60afd2c5a..67549635e 100644 --- a/preload/preloadImages/index.html +++ b/preload/preloadImages/index.html @@ -13,7 +13,7 @@ - + diff --git a/preload/preloadPlaygroundImages/index.html b/preload/preloadPlaygroundImages/index.html index 44c212eb5..0038cc36c 100644 --- a/preload/preloadPlaygroundImages/index.html +++ b/preload/preloadPlaygroundImages/index.html @@ -13,7 +13,7 @@ - + diff --git a/preload/preloadStartImages/index.html b/preload/preloadStartImages/index.html index 2e1de8226..785b23355 100644 --- a/preload/preloadStartImages/index.html +++ b/preload/preloadStartImages/index.html @@ -13,7 +13,7 @@ - + diff --git a/search/index.html b/search/index.html index c361680ed..dc425b1cf 100644 --- a/search/index.html +++ b/search/index.html @@ -13,7 +13,7 @@ - + diff --git a/smallScreen/deepChatLogo/index.html b/smallScreen/deepChatLogo/index.html index 5fcdbde50..7894e4efc 100644 --- a/smallScreen/deepChatLogo/index.html +++ b/smallScreen/deepChatLogo/index.html @@ -13,7 +13,7 @@ - + diff --git a/smallScreen/smallScreen/index.html b/smallScreen/smallScreen/index.html index 261542936..96085e372 100644 --- a/smallScreen/smallScreen/index.html +++ b/smallScreen/smallScreen/index.html @@ -13,7 +13,7 @@ - + diff --git a/start/aiInYourBrowser/index.html b/start/aiInYourBrowser/index.html index 2789a4c3a..3acab5c98 100644 --- a/start/aiInYourBrowser/index.html +++ b/start/aiInYourBrowser/index.html @@ -13,7 +13,7 @@ - + diff --git a/start/connectToCustomAPI/index.html b/start/connectToCustomAPI/index.html index c8a9caf78..f51500e85 100644 --- a/start/connectToCustomAPI/index.html +++ b/start/connectToCustomAPI/index.html @@ -13,7 +13,7 @@ - + diff --git a/start/connectToPopularAPI/index.html b/start/connectToPopularAPI/index.html index 5b1b06153..c93ee8358 100644 --- a/start/connectToPopularAPI/index.html +++ b/start/connectToPopularAPI/index.html @@ -13,7 +13,7 @@ - + diff --git a/start/createComponent/index.html b/start/createComponent/index.html index 80e27e154..a363e977e 100644 --- a/start/createComponent/index.html +++ b/start/createComponent/index.html @@ -13,7 +13,7 @@ - + diff --git a/start/index.html b/start/index.html index 29b44396c..1df087c6b 100644 --- a/start/index.html +++ b/start/index.html @@ -13,7 +13,7 @@ - + diff --git a/start/options/index.html b/start/options/index.html index 80dc5687b..9f01b390d 100644 --- a/start/options/index.html +++ b/start/options/index.html @@ -13,7 +13,7 @@ - + diff --git a/start/startParticles/index.html b/start/startParticles/index.html index d0fbbe171..6823a67d3 100644 --- a/start/startParticles/index.html +++ b/start/startParticles/index.html @@ -13,7 +13,7 @@ - + diff --git a/start/startSmallScreen/index.html b/start/startSmallScreen/index.html index 7ebd98298..457407e88 100644 --- a/start/startSmallScreen/index.html +++ b/start/startSmallScreen/index.html @@ -13,7 +13,7 @@ - + diff --git a/startPanel/startPanel/index.html b/startPanel/startPanel/index.html index 0adbda9e2..d577dd1a5 100644 --- a/startPanel/startPanel/index.html +++ b/startPanel/startPanel/index.html @@ -13,7 +13,7 @@ - + diff --git a/startPanel/startPanelParticles/index.html b/startPanel/startPanelParticles/index.html index e703a48ca..f383e8aba 100644 --- a/startPanel/startPanelParticles/index.html +++ b/startPanel/startPanelParticles/index.html @@ -13,7 +13,7 @@ - + diff --git a/utils/fadeInContent/index.html b/utils/fadeInContent/index.html index 08ab9f126..579f2b4ff 100644 --- a/utils/fadeInContent/index.html +++ b/utils/fadeInContent/index.html @@ -13,7 +13,7 @@ - + diff --git a/utils/fadeInNav/index.html b/utils/fadeInNav/index.html index 649f12603..323e1da3f 100644 --- a/utils/fadeInNav/index.html +++ b/utils/fadeInNav/index.html @@ -13,7 +13,7 @@ - + diff --git a/utils/onVisibleAnimation/index.html b/utils/onVisibleAnimation/index.html index 34deb0a87..7e736455e 100644 --- a/utils/onVisibleAnimation/index.html +++ b/utils/onVisibleAnimation/index.html @@ -13,7 +13,7 @@ - +