@yext/chat-ui-react 0.1.0

package/lib/bundle.css

@@ -0,0 +1 @@
+/*! tailwindcss v3.3.2 | MIT License | https://tailwindcss.com*/*,:after,:before{box-sizing:border-box;border:0 solid #e5e7eb}:after,:before{--tw-content:""}html{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-feature-settings:normal;font-variation-settings:normal}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:initial}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;font-weight:inherit;line-height:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button;background-color:initial;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:initial}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]{display:none}*,::backdrop,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:#3b82f680;--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }.container{width:100%}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}@media (min-width:1536px){.container{max-width:1536px}}.prose{color:var(--tw-prose-body);max-width:65ch}.prose :where(p):not(:where([class~=not-prose] *)){margin-top:1.25em;margin-bottom:1.25em}.prose :where([class~=lead]):not(:where([class~=not-prose] *)){color:var(--tw-prose-lead);font-size:1.25em;line-height:1.6;margin-top:1.2em;margin-bottom:1.2em}.prose :where(a):not(:where([class~=not-prose] *)){color:var(--tw-prose-links);text-decoration:underline;font-weight:500}.prose :where(strong):not(:where([class~=not-prose] *)){color:var(--tw-prose-bold);font-weight:600}.prose :where(a strong):not(:where([class~=not-prose] *)){color:inherit}.prose :where(blockquote strong):not(:where([class~=not-prose] *)){color:inherit}.prose :where(thead th strong):not(:where([class~=not-prose] *)){color:inherit}.prose :where(ol):not(:where([class~=not-prose] *)){list-style-type:decimal;margin-top:1.25em;margin-bottom:1.25em;padding-left:1.625em}.prose :where(ol[type=A]):not(:where([class~=not-prose] *)){list-style-type:upper-alpha}.prose :where(ol[type=a]):not(:where([class~=not-prose] *)){list-style-type:lower-alpha}.prose :where(ol[type=A s]):not(:where([class~=not-prose] *)){list-style-type:upper-alpha}.prose :where(ol[type=a s]):not(:where([class~=not-prose] *)){list-style-type:lower-alpha}.prose :where(ol[type=I]):not(:where([class~=not-prose] *)){list-style-type:upper-roman}.prose :where(ol[type=i]):not(:where([class~=not-prose] *)){list-style-type:lower-roman}.prose :where(ol[type=I s]):not(:where([class~=not-prose] *)){list-style-type:upper-roman}.prose :where(ol[type=i s]):not(:where([class~=not-prose] *)){list-style-type:lower-roman}.prose :where(ol[type="1"]):not(:where([class~=not-prose] *)){list-style-type:decimal}.prose :where(ul):not(:where([class~=not-prose] *)){list-style-type:disc;margin-top:1.25em;margin-bottom:1.25em;padding-left:1.625em}.prose :where(ol>li):not(:where([class~=not-prose] *))::marker{font-weight:400;color:var(--tw-prose-counters)}.prose :where(ul>li):not(:where([class~=not-prose] *))::marker{color:var(--tw-prose-bullets)}.prose :where(hr):not(:where([class~=not-prose] *)){border-color:var(--tw-prose-hr);border-top-width:1px;margin-top:3em;margin-bottom:3em}.prose :where(blockquote):not(:where([class~=not-prose] *)){font-weight:500;font-style:italic;color:var(--tw-prose-quotes);border-left-width:.25rem;border-left-color:var(--tw-prose-quote-borders);quotes:"\201C""\201D""\2018""\2019";margin-top:1.6em;margin-bottom:1.6em;padding-left:1em}.prose :where(blockquote p:first-of-type):not(:where([class~=not-prose] *)):before{content:open-quote}.prose :where(blockquote p:last-of-type):not(:where([class~=not-prose] *)):after{content:close-quote}.prose :where(h1):not(:where([class~=not-prose] *)){color:var(--tw-prose-headings);font-weight:800;font-size:2.25em;margin-top:0;margin-bottom:.8888889em;line-height:1.1111111}.prose :where(h1 strong):not(:where([class~=not-prose] *)){font-weight:900;color:inherit}.prose :where(h2):not(:where([class~=not-prose] *)){color:var(--tw-prose-headings);font-weight:700;font-size:1.5em;margin-top:2em;margin-bottom:1em;line-height:1.3333333}.prose :where(h2 strong):not(:where([class~=not-prose] *)){font-weight:800;color:inherit}.prose :where(h3):not(:where([class~=not-prose] *)){color:var(--tw-prose-headings);font-weight:600;font-size:1.25em;margin-top:1.6em;margin-bottom:.6em;line-height:1.6}.prose :where(h3 strong):not(:where([class~=not-prose] *)){font-weight:700;color:inherit}.prose :where(h4):not(:where([class~=not-prose] *)){color:var(--tw-prose-headings);font-weight:600;margin-top:1.5em;margin-bottom:.5em;line-height:1.5}.prose :where(h4 strong):not(:where([class~=not-prose] *)){font-weight:700;color:inherit}.prose :where(img):not(:where([class~=not-prose] *)){margin-top:2em;margin-bottom:2em}.prose :where(figure>*):not(:where([class~=not-prose] *)){margin-top:0;margin-bottom:0}.prose :where(figcaption):not(:where([class~=not-prose] *)){color:var(--tw-prose-captions);font-size:.875em;line-height:1.4285714;margin-top:.8571429em}.prose :where(code):not(:where([class~=not-prose] *)){color:var(--tw-prose-code);font-weight:600;font-size:.875em}.prose :where(code):not(:where([class~=not-prose] *)):before{content:"`"}.prose :where(code):not(:where([class~=not-prose] *)):after{content:"`"}.prose :where(a code):not(:where([class~=not-prose] *)){color:inherit}.prose :where(h1 code):not(:where([class~=not-prose] *)){color:inherit}.prose :where(h2 code):not(:where([class~=not-prose] *)){color:inherit;font-size:.875em}.prose :where(h3 code):not(:where([class~=not-prose] *)){color:inherit;font-size:.9em}.prose :where(h4 code):not(:where([class~=not-prose] *)){color:inherit}.prose :where(blockquote code):not(:where([class~=not-prose] *)){color:inherit}.prose :where(thead th code):not(:where([class~=not-prose] *)){color:inherit}.prose :where(pre):not(:where([class~=not-prose] *)){color:var(--tw-prose-pre-code);background-color:var(--tw-prose-pre-bg);overflow-x:auto;font-weight:400;font-size:.875em;line-height:1.7142857;margin-top:1.7142857em;margin-bottom:1.7142857em;border-radius:.375rem;padding:.8571429em 1.1428571em}.prose :where(pre code):not(:where([class~=not-prose] *)){background-color:initial;border-width:0;border-radius:0;padding:0;font-weight:inherit;color:inherit;font-size:inherit;font-family:inherit;line-height:inherit}.prose :where(pre code):not(:where([class~=not-prose] *)):before{content:none}.prose :where(pre code):not(:where([class~=not-prose] *)):after{content:none}.prose :where(table):not(:where([class~=not-prose] *)){width:100%;table-layout:auto;text-align:left;margin-top:2em;margin-bottom:2em;font-size:.875em;line-height:1.7142857}.prose :where(thead):not(:where([class~=not-prose] *)){border-bottom-width:1px;border-bottom-color:var(--tw-prose-th-borders)}.prose :where(thead th):not(:where([class~=not-prose] *)){color:var(--tw-prose-headings);font-weight:600;vertical-align:bottom;padding-right:.5714286em;padding-bottom:.5714286em;padding-left:.5714286em}.prose :where(tbody tr):not(:where([class~=not-prose] *)){border-bottom-width:1px;border-bottom-color:var(--tw-prose-td-borders)}.prose :where(tbody tr:last-child):not(:where([class~=not-prose] *)){border-bottom-width:0}.prose :where(tbody td):not(:where([class~=not-prose] *)){vertical-align:initial}.prose :where(tfoot):not(:where([class~=not-prose] *)){border-top-width:1px;border-top-color:var(--tw-prose-th-borders)}.prose :where(tfoot td):not(:where([class~=not-prose] *)){vertical-align:top}.prose{--tw-prose-body:#374151;--tw-prose-headings:#111827;--tw-prose-lead:#4b5563;--tw-prose-links:#111827;--tw-prose-bold:#111827;--tw-prose-counters:#6b7280;--tw-prose-bullets:#d1d5db;--tw-prose-hr:#e5e7eb;--tw-prose-quotes:#111827;--tw-prose-quote-borders:#e5e7eb;--tw-prose-captions:#6b7280;--tw-prose-code:#111827;--tw-prose-pre-code:#e5e7eb;--tw-prose-pre-bg:#1f2937;--tw-prose-th-borders:#d1d5db;--tw-prose-td-borders:#e5e7eb;--tw-prose-invert-body:#d1d5db;--tw-prose-invert-headings:#fff;--tw-prose-invert-lead:#9ca3af;--tw-prose-invert-links:#fff;--tw-prose-invert-bold:#fff;--tw-prose-invert-counters:#9ca3af;--tw-prose-invert-bullets:#4b5563;--tw-prose-invert-hr:#374151;--tw-prose-invert-quotes:#f3f4f6;--tw-prose-invert-quote-borders:#374151;--tw-prose-invert-captions:#9ca3af;--tw-prose-invert-code:#fff;--tw-prose-invert-pre-code:#d1d5db;--tw-prose-invert-pre-bg:#00000080;--tw-prose-invert-th-borders:#4b5563;--tw-prose-invert-td-borders:#374151;font-size:1rem;line-height:1.75}.prose :where(video):not(:where([class~=not-prose] *)){margin-top:2em;margin-bottom:2em}.prose :where(figure):not(:where([class~=not-prose] *)){margin-top:2em;margin-bottom:2em}.prose :where(li):not(:where([class~=not-prose] *)){margin-top:.5em;margin-bottom:.5em}.prose :where(ol>li):not(:where([class~=not-prose] *)){padding-left:.375em}.prose :where(ul>li):not(:where([class~=not-prose] *)){padding-left:.375em}.prose :where(.prose>ul>li p):not(:where([class~=not-prose] *)){margin-top:.75em;margin-bottom:.75em}.prose :where(.prose>ul>li>:first-child):not(:where([class~=not-prose] *)){margin-top:1.25em}.prose :where(.prose>ul>li>:last-child):not(:where([class~=not-prose] *)){margin-bottom:1.25em}.prose :where(.prose>ol>li>:first-child):not(:where([class~=not-prose] *)){margin-top:1.25em}.prose :where(.prose>ol>li>:last-child):not(:where([class~=not-prose] *)){margin-bottom:1.25em}.prose :where(ul ul,ul ol,ol ul,ol ol):not(:where([class~=not-prose] *)){margin-top:.75em;margin-bottom:.75em}.prose :where(hr+*):not(:where([class~=not-prose] *)){margin-top:0}.prose :where(h2+*):not(:where([class~=not-prose] *)){margin-top:0}.prose :where(h3+*):not(:where([class~=not-prose] *)){margin-top:0}.prose :where(h4+*):not(:where([class~=not-prose] *)){margin-top:0}.prose :where(thead th:first-child):not(:where([class~=not-prose] *)){padding-left:0}.prose :where(thead th:last-child):not(:where([class~=not-prose] *)){padding-right:0}.prose :where(tbody td,tfoot td):not(:where([class~=not-prose] *)){padding:.5714286em}.prose :where(tbody td:first-child,tfoot td:first-child):not(:where([class~=not-prose] *)){padding-left:0}.prose :where(tbody td:last-child,tfoot td:last-child):not(:where([class~=not-prose] *)){padding-right:0}.prose :where(.prose>:first-child):not(:where([class~=not-prose] *)){margin-top:0}.prose :where(.prose>:last-child):not(:where([class~=not-prose] *)){margin-bottom:0}.invisible{visibility:hidden}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.bottom-0{bottom:0}.bottom-2{bottom:.5rem}.bottom-2\.5{bottom:.625rem}.bottom-6{bottom:1.5rem}.right-4{right:1rem}.right-7{right:1.75rem}.my-0{margin-top:0;margin-bottom:0}.my-0\.5{margin-top:.125rem;margin-bottom:.125rem}.mb-3{margin-bottom:.75rem}.ml-auto{margin-left:auto}.mt-auto{margin-top:auto}.flex{display:flex}.h-12{height:3rem}.h-2{height:.5rem}.h-\[75vh\]{height:75vh}.h-fit{height:-moz-fit-content;height:fit-content}.h-full{height:100%}.w-12{width:3rem}.w-2{width:.5rem}.w-8{width:2rem}.w-80{width:20rem}.w-fit{width:-moz-fit-content;width:fit-content}.w-full{width:100%}.max-w-\[80\%\]{max-width:80%}.translate-y-0{--tw-translate-y:0px}.translate-y-0,.translate-y-\[20\%\]{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.translate-y-\[20\%\]{--tw-translate-y:20%}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.animate-\[bounce_1s_infinite\]{animation:bounce 1s infinite}.animate-\[bounce_1s_infinite_0\.3s\]{animation:bounce 1s .3s infinite}@keyframes bounce{0%,to{transform:translateY(-25%);animation-timing-function:cubic-bezier(.8,0,1,1)}50%{transform:none;animation-timing-function:cubic-bezier(0,0,.2,1)}}.animate-\[bounce_1s_infinite_0\.6s\]{animation:bounce 1s .6s infinite}@keyframes spin{to{transform:rotate(1turn)}}.animate-\[spin_0\.3s_linear_infinite\]{animation:spin .3s linear infinite}@keyframes fade-in{0%{opacity:0}to{opacity:1}}.animate-fade-in{animation:fade-in .4s}.resize-none{resize:none}.flex-row{flex-direction:row}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-1{gap:.25rem}.gap-y-1{row-gap:.25rem}.overflow-auto{overflow:auto}.overflow-x-auto{overflow-x:auto}.whitespace-pre-wrap{white-space:pre-wrap}.rounded-2xl{border-radius:1rem}.rounded-3xl{border-radius:1.5rem}.rounded-full{border-radius:9999px}.rounded-b-3xl{border-bottom-right-radius:1.5rem;border-bottom-left-radius:1.5rem}.rounded-t-3xl{border-top-left-radius:1.5rem;border-top-right-radius:1.5rem}.border{border-width:1px}.border-slate-300{--tw-border-opacity:1;border-color:rgb(203 213 225/var(--tw-border-opacity))}.bg-blue-600{--tw-bg-opacity:1;background-color:rgb(37 99 235/var(--tw-bg-opacity))}.bg-slate-500{--tw-bg-opacity:1;background-color:rgb(100 116 139/var(--tw-bg-opacity))}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity))}.bg-gradient-to-br{background-image:linear-gradient(to bottom right,var(--tw-gradient-stops))}.bg-gradient-to-tr{background-image:linear-gradient(to top right,var(--tw-gradient-stops))}.from-blue-600{--tw-gradient-from:#2563eb var(--tw-gradient-from-position);--tw-gradient-to:#2563eb00 var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}.from-slate-50{--tw-gradient-from:#f8fafc var(--tw-gradient-from-position);--tw-gradient-to:#f8fafc00 var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}.to-blue-700{--tw-gradient-to:#1d4ed8 var(--tw-gradient-to-position)}.to-blue-800{--tw-gradient-to:#1e40af var(--tw-gradient-to-position)}.to-slate-100{--tw-gradient-to:#f1f5f9 var(--tw-gradient-to-position)}.stroke-2{stroke-width:2}.stroke-\[0\.2\]{stroke-width:.2}.p-1{padding:.25rem}.p-1\.5{padding:.375rem}.p-2{padding:.5rem}.p-4{padding:1rem}.px-4{padding-left:1rem;padding-right:1rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.pb-\[85px\]{padding-bottom:85px}.pr-10{padding-right:2.5rem}.text-\[13px\]{font-size:13px}.text-xl{font-size:1.25rem;line-height:1.75rem}.font-medium{font-weight:500}.text-red-200{--tw-text-opacity:1;color:rgb(254 202 202/var(--tw-text-opacity))}.text-slate-400{--tw-text-opacity:1;color:rgb(148 163 184/var(--tw-text-opacity))}.text-slate-700{--tw-text-opacity:1;color:rgb(51 65 85/var(--tw-text-opacity))}.text-slate-900{--tw-text-opacity:1;color:rgb(15 23 42/var(--tw-text-opacity))}.text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity))}.opacity-0{opacity:0}.shadow-2xl{--tw-shadow:0 25px 50px -12px #00000040;--tw-shadow-colored:0 25px 50px -12px var(--tw-shadow-color)}.shadow-2xl,.shadow-xl{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-xl{--tw-shadow:0 20px 25px -5px #0000001a,0 8px 10px -6px #0000001a;--tw-shadow-colored:0 20px 25px -5px var(--tw-shadow-color),0 8px 10px -6px var(--tw-shadow-color)}.backdrop-blur-lg{--tw-backdrop-blur:blur(16px);-webkit-backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia)}.transition-all{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.duration-150,.transition-all{transition-duration:.15s}.duration-200{transition-duration:.2s}.duration-300{transition-duration:.3s}.\@container{container-type:inline-size}.hover\:-translate-y-2:hover{--tw-translate-y:-0.5rem}.hover\:-translate-y-2:hover,.hover\:scale-110:hover{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.hover\:scale-110:hover{--tw-scale-x:1.1;--tw-scale-y:1.1}.hover\:bg-blue-800:hover{--tw-bg-opacity:1;background-color:rgb(30 64 175/var(--tw-bg-opacity))}.active\:scale-90:active{--tw-scale-x:.9;--tw-scale-y:.9;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.disabled\:bg-slate-100:disabled{--tw-bg-opacity:1;background-color:rgb(241 245 249/var(--tw-bg-opacity))}.disabled\:bg-slate-50:disabled{--tw-bg-opacity:1;background-color:rgb(248 250 252/var(--tw-bg-opacity))}.peer:hover~.peer-hover\:opacity-100{opacity:1}@container (min-width: 32rem){.\@lg\:m-1{margin:.25rem}.\@lg\:ml-0{margin-left:0}.\@lg\:flex-row{flex-direction:row}.\@lg\:flex-row-reverse{flex-direction:row-reverse}.\@lg\:items-center{align-items:center}.\@lg\:gap-x-2{-moz-column-gap:.5rem;column-gap:.5rem}}@container (min-width: 480px){.\@\[480px\]\:bottom-3\.5{bottom:.875rem}.\@\[480px\]\:text-base{font-size:1rem;line-height:1.5rem}}@media (min-width:1024px){.lg\:bottom-14{bottom:3.5rem}.lg\:right-10{right:2.5rem}.lg\:h-16{height:4rem}.lg\:w-16{width:4rem}.lg\:w-96{width:24rem}}

package/lib/commonjs/components/ChatHeader.d.ts

@@ -0,0 +1,51 @@
+/// <reference types="react" />
+/**
+ * The CSS class interface for the {@link ChatHeader} component.
+ *
+ * @public
+ */
+export interface ChatHeaderCssClasses {
+    header?: string;
+    title?: string;
+    restartButton?: string;
+    closeButton?: string;
+}
+/**
+ * The props for the {@link ChatHeader} component.
+ *
+ * @public
+ */
+export interface ChatHeaderProps {
+    /**
+     * The headers's title text, essentially how the chat window identifies itself to the user.
+     */
+    title: string;
+    /**
+     * Displays a restart button which allows the user to restart the conversation.
+     * Defaults to false.
+     */
+    showRestartButton?: boolean;
+    /**
+     * Displays a close button which will invoke {@link ChatHeaderProps.onClose} on click.
+     * Default to false.
+     */
+    showCloseButton?: boolean;
+    /** A function which is called when the close button is clicked.  */
+    onClose?: () => void;
+    /**  Custom icon for for restart button. */
+    restartButtonIcon?: JSX.Element;
+    /**  Custom icon for for close button. */
+    closeButtonIcon?: JSX.Element;
+    /**  CSS classes for customizing the component styling. */
+    customCssClasses?: ChatHeaderCssClasses;
+}
+/**
+ * A component that renders the header of a chat bot panel,
+ * including the title and a button to reset the conversation.
+ *
+ * @public
+ *
+ * @param props - {@link ChatHeaderProps}
+ */
+export declare function ChatHeader({ title, showRestartButton, restartButtonIcon, showCloseButton, closeButtonIcon, onClose, customCssClasses, }: ChatHeaderProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=ChatHeader.d.ts.map

package/lib/commonjs/components/ChatHeader.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChatHeader.d.ts","sourceRoot":"","sources":["../../../src/components/ChatHeader.tsx"],"names":[],"mappings":";AAOA;;;;GAIG;AACH,MAAM,WAAW,oBAAoB;IACnC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AAUD;;;;GAIG;AACH,MAAM,WAAW,eAAe;IAC9B;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B;;;OAGG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,oEAAoE;IACpE,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,2CAA2C;IAC3C,iBAAiB,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IAChC,yCAAyC;IACzC,eAAe,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IAC9B,0DAA0D;IAC1D,gBAAgB,CAAC,EAAE,oBAAoB,CAAC;CACzC;AAED;;;;;;;GAOG;AACH,wBAAgB,UAAU,CAAC,EACzB,KAAK,EACL,iBAAiB,EACjB,iBAAoC,EACpC,eAAe,EACf,eAA+B,EAC/B,OAAO,EACP,gBAAgB,GACjB,EAAE,eAAe,2CA4CjB"}

package/lib/commonjs/components/ChatHeader.js

@@ -0,0 +1,42 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ChatHeader = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const chat_headless_react_1 = require("@yext/chat-headless-react");
+const DualSync_1 = require("../icons/DualSync");
+const useComposedCssClasses_1 = require("../hooks/useComposedCssClasses");
+const react_1 = require("react");
+const tailwind_merge_1 = require("tailwind-merge");
+const Cross_1 = require("../icons/Cross");
+const builtInCssClasses = {
+    header: "w-full px-4 py-3 flex justify-between bg-gradient-to-tr from-blue-600 to-blue-800 rounded-t-3xl",
+    title: "text-white text-xl font-medium",
+    restartButton: "w-8 text-white stroke-[0.2] ml-auto",
+    closeButton: "w-8 text-white hover:scale-110"
+};
+/**
+ * A component that renders the header of a chat bot panel,
+ * including the title and a button to reset the conversation.
+ *
+ * @public
+ *
+ * @param props - {@link ChatHeaderProps}
+ */
+function ChatHeader({ title, showRestartButton, restartButtonIcon = (0, jsx_runtime_1.jsx)(DualSync_1.DualSyncIcon, {}), showCloseButton, closeButtonIcon = (0, jsx_runtime_1.jsx)(Cross_1.CrossIcon, {}), onClose, customCssClasses, }) {
+    const chat = (0, chat_headless_react_1.useChatActions)();
+    const cssClasses = (0, useComposedCssClasses_1.useComposedCssClasses)(builtInCssClasses, customCssClasses);
+    const [isSpinning, setIsSpinning] = (0, react_1.useState)(false);
+    const restartButtonCssClasses = (0, tailwind_merge_1.twMerge)(cssClasses.restartButton, isSpinning ? "animate-[spin_0.3s_linear_infinite]" : "hover:scale-110");
+    const clearTimerRef = (0, react_1.useRef)();
+    const onRestart = (0, react_1.useCallback)(async () => {
+        clearTimeout(clearTimerRef.current);
+        setIsSpinning(true);
+        clearTimerRef.current = setTimeout(() => {
+            setIsSpinning(false);
+        }, 1000);
+        chat.restartConversation();
+    }, [chat]);
+    return ((0, jsx_runtime_1.jsxs)("div", { className: cssClasses.header, children: [(0, jsx_runtime_1.jsx)("h1", { className: cssClasses.title, children: title }), showRestartButton && ((0, jsx_runtime_1.jsx)("button", { "aria-label": "Restart Conversation", onClick: onRestart, className: restartButtonCssClasses, children: restartButtonIcon })), showCloseButton && ((0, jsx_runtime_1.jsx)("button", { "aria-label": "Close Chat", onClick: onClose, className: cssClasses.closeButton, children: closeButtonIcon }))] }));
+}
+exports.ChatHeader = ChatHeader;
+//# sourceMappingURL=ChatHeader.js.map

package/lib/commonjs/components/ChatHeader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChatHeader.js","sourceRoot":"","sources":["../../../src/components/ChatHeader.tsx"],"names":[],"mappings":";;;;AAAA,mEAA2D;AAC3D,gDAAgD;AAChD,0EAAuE;AACvE,iCAAsD;AACtD,mDAAyC;AACzC,0CAA2C;AAc3C,MAAM,iBAAiB,GAAmC;IACxD,MAAM,EACJ,iGAAiG;IACnG,KAAK,EAAE,gCAAgC;IACvC,aAAa,EAAE,qCAAqC;IACpD,WAAW,EAAE,gCAAgC;CAC9C,CAAC;AAgCF;;;;;;;GAOG;AACH,SAAgB,UAAU,CAAC,EACzB,KAAK,EACL,iBAAiB,EACjB,iBAAiB,GAAG,uBAAC,uBAAY,KAAG,EACpC,eAAe,EACf,eAAe,GAAG,uBAAC,iBAAS,KAAG,EAC/B,OAAO,EACP,gBAAgB,GACA;IAChB,MAAM,IAAI,GAAG,IAAA,oCAAc,GAAE,CAAC;IAE9B,MAAM,UAAU,GAAG,IAAA,6CAAqB,EAAC,iBAAiB,EAAE,gBAAgB,CAAC,CAAC;IAE9E,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,IAAA,gBAAQ,EAAC,KAAK,CAAC,CAAC;IACpD,MAAM,uBAAuB,GAAG,IAAA,wBAAO,EACrC,UAAU,CAAC,aAAa,EACxB,UAAU,CAAC,CAAC,CAAC,qCAAqC,CAAC,CAAC,CAAC,iBAAiB,CACvE,CAAC;IAEF,MAAM,aAAa,GAAG,IAAA,cAAM,GAAiC,CAAC;IAC9D,MAAM,SAAS,GAAG,IAAA,mBAAW,EAAC,KAAK,IAAI,EAAE;QACvC,YAAY,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;QACpC,aAAa,CAAC,IAAI,CAAC,CAAC;QACpB,aAAa,CAAC,OAAO,GAAG,UAAU,CAAC,GAAG,EAAE;YACtC,aAAa,CAAC,KAAK,CAAC,CAAC;QACvB,CAAC,EAAE,IAAI,CAAC,CAAC;QACT,IAAI,CAAC,mBAAmB,EAAE,CAAC;IAC7B,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC;IAEX,OAAO,CACL,iCAAK,SAAS,EAAE,UAAU,CAAC,MAAM,aAC/B,+BAAI,SAAS,EAAE,UAAU,CAAC,KAAK,YAAG,KAAK,GAAM,EAC5C,iBAAiB,IAAI,CACpB,iDACa,sBAAsB,EACjC,OAAO,EAAE,SAAS,EAClB,SAAS,EAAE,uBAAuB,YAEjC,iBAAiB,GACX,CACV,EACA,eAAe,IAAI,CAClB,iDACW,YAAY,EACvB,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,UAAU,CAAC,WAAW,YAEhC,eAAe,GACT,CACR,IACG,CACP,CAAC;AACJ,CAAC;AApDD,gCAoDC"}

package/lib/commonjs/components/ChatInput.d.ts

@@ -0,0 +1,48 @@
+/// <reference types="react" />
+/**
+ * The CSS class interface for the {@link ChatInput} component.
+ *
+ * @public
+ */
+export interface ChatInputCssClasses {
+    container?: string;
+    textArea?: string;
+    sendButton?: string;
+}
+/**
+ * The props for the {@link ChatInput} component.
+ *
+ * @public
+ */
+export interface ChatInputProps {
+    /**
+     * The input's placeholder text when no text has been entered by the user.
+     * Defaults to "Type a message...".
+     */
+    placeholder?: string;
+    /**
+     * Enable streaming behavior by making a request to Chat Streaming API.
+     * Defaults to true.
+     */
+    stream?: boolean;
+    /** Enable auto focus for the input box. Defaults to false. */
+    inputAutoFocus?: boolean;
+    /**
+     * A function which is called when an error occurs from
+     * Chat API while processing the user's message.
+     * By default, the error is logged to the console.
+     */
+    handleError?: (e: unknown) => void;
+    /** Custom icon for the send button. */
+    sendButtonIcon?: JSX.Element;
+    /** CSS classes for customizing the component styling. */
+    customCssClasses?: ChatInputCssClasses;
+}
+/**
+ * A component that allows user to input message and send to Chat API.
+ * @public
+ *
+ * @param props - {@link ChatInputProps}
+ */
+export declare function ChatInput({ placeholder, stream, inputAutoFocus, handleError, sendButtonIcon, customCssClasses, }: ChatInputProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=ChatInput.d.ts.map

package/lib/commonjs/components/ChatInput.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChatInput.d.ts","sourceRoot":"","sources":["../../../src/components/ChatInput.tsx"],"names":[],"mappings":";AAQA;;;;GAIG;AACH,MAAM,WAAW,mBAAmB;IAClC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAUD;;;;GAIG;AACH,MAAM,WAAW,cAAc;IAC7B;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;OAGG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,8DAA8D;IAC9D,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;;;OAIG;IACH,WAAW,CAAC,EAAE,CAAC,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;IACnC,uCAAuC;IACvC,cAAc,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IAC7B,yDAAyD;IACzD,gBAAgB,CAAC,EAAE,mBAAmB,CAAC;CACxC;AAED;;;;;GAKG;AACH,wBAAgB,SAAS,CAAC,EACxB,WAAiC,EACjC,MAAa,EACb,cAAsB,EACtB,WAAW,EACX,cAA8B,EAC9B,gBAAgB,GACjB,EAAE,cAAc,2CA0DhB"}

package/lib/commonjs/components/ChatInput.js

@@ -0,0 +1,50 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ChatInput = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const chat_headless_react_1 = require("@yext/chat-headless-react");
+const Arrow_1 = require("../icons/Arrow");
+const hooks_1 = require("../hooks");
+const react_expanding_textarea_1 = __importDefault(require("react-expanding-textarea"));
+const tailwind_merge_1 = require("tailwind-merge");
+const defaultHandleError_1 = require("../utils/defaultHandleError");
+const builtInCssClasses = {
+    container: "w-full h-fit flex flex-row relative @container",
+    textArea: "w-full p-4 pr-10 border border-slate-300 disabled:bg-slate-50 rounded-3xl resize-none text-[13px] @[480px]:text-base",
+    sendButton: "rounded-full p-1.5 w-8 stroke-2 text-white bg-blue-600 disabled:bg-slate-100 hover:bg-blue-800 active:scale-90 transition-all absolute right-7 bottom-2.5 @[480px]:bottom-3.5",
+};
+/**
+ * A component that allows user to input message and send to Chat API.
+ * @public
+ *
+ * @param props - {@link ChatInputProps}
+ */
+function ChatInput({ placeholder = "Type a message...", stream = true, inputAutoFocus = false, handleError, sendButtonIcon = (0, jsx_runtime_1.jsx)(Arrow_1.ArrowIcon, {}), customCssClasses, }) {
+    const chat = (0, chat_headless_react_1.useChatActions)();
+    const [input, setInput] = (0, react_1.useState)("");
+    const canSendMessage = (0, chat_headless_react_1.useChatState)((state) => state.conversation.canSendMessage);
+    const cssClasses = (0, hooks_1.useComposedCssClasses)(builtInCssClasses, customCssClasses);
+    const sendButtonClassNames = (0, tailwind_merge_1.twMerge)(cssClasses.sendButton, input.length === 0 && "opacity-0 invisible");
+    const sendMessage = (0, react_1.useCallback)(async () => {
+        const res = stream
+            ? chat.streamNextMessage(input)
+            : chat.getNextMessage(input);
+        setInput("");
+        res.catch((e) => (handleError ? handleError(e) : (0, defaultHandleError_1.defaultHandleApiError)(e)));
+    }, [chat, input, handleError, stream]);
+    const handleKeyDown = (0, react_1.useCallback)((e) => {
+        if (e.key === "Enter") {
+            sendMessage();
+        }
+    }, [sendMessage]);
+    const onInputChange = (0, react_1.useCallback)((e) => {
+        setInput(e.target.value);
+    }, []);
+    return ((0, jsx_runtime_1.jsxs)("div", { className: cssClasses.container, children: [(0, jsx_runtime_1.jsx)(react_expanding_textarea_1.default, { autoFocus: inputAutoFocus, disabled: !canSendMessage, onKeyDown: handleKeyDown, value: input, onChange: onInputChange, className: cssClasses.textArea, placeholder: placeholder }), (0, jsx_runtime_1.jsx)("button", { "aria-label": "Send Message", disabled: !canSendMessage, onClick: sendMessage, className: sendButtonClassNames, children: sendButtonIcon })] }));
+}
+exports.ChatInput = ChatInput;
+//# sourceMappingURL=ChatInput.js.map

package/lib/commonjs/components/ChatInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChatInput.js","sourceRoot":"","sources":["../../../src/components/ChatInput.tsx"],"names":[],"mappings":";;;;;;;AAAA,iCAA8C;AAC9C,mEAAyE;AACzE,0CAA2C;AAC3C,oCAAiD;AACjD,wFAAgD;AAChD,mDAAyC;AACzC,oEAAoE;AAapE,MAAM,iBAAiB,GAAwB;IAC7C,SAAS,EAAE,gDAAgD;IAC3D,QAAQ,EACN,sHAAsH;IACxH,UAAU,EACR,+KAA+K;CAClL,CAAC;AAgCF;;;;;GAKG;AACH,SAAgB,SAAS,CAAC,EACxB,WAAW,GAAG,mBAAmB,EACjC,MAAM,GAAG,IAAI,EACb,cAAc,GAAG,KAAK,EACtB,WAAW,EACX,cAAc,GAAG,uBAAC,iBAAS,KAAG,EAC9B,gBAAgB,GACD;IACf,MAAM,IAAI,GAAG,IAAA,oCAAc,GAAE,CAAC;IAC9B,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,IAAA,gBAAQ,EAAC,EAAE,CAAC,CAAC;IACvC,MAAM,cAAc,GAAG,IAAA,kCAAY,EACjC,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,YAAY,CAAC,cAAc,CAC7C,CAAC;IAEF,MAAM,UAAU,GAAG,IAAA,6BAAqB,EAAC,iBAAiB,EAAE,gBAAgB,CAAC,CAAC;IAC9E,MAAM,oBAAoB,GAAG,IAAA,wBAAO,EAClC,UAAU,CAAC,UAAU,EACrB,KAAK,CAAC,MAAM,KAAK,CAAC,IAAI,qBAAqB,CAC5C,CAAC;IAEF,MAAM,WAAW,GAAG,IAAA,mBAAW,EAAC,KAAK,IAAI,EAAE;QACzC,MAAM,GAAG,GAAG,MAAM;YAChB,CAAC,CAAC,IAAI,CAAC,iBAAiB,CAAC,KAAK,CAAC;YAC/B,CAAC,CAAC,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;QAC/B,QAAQ,CAAC,EAAE,CAAC,CAAC;QACb,GAAG,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,IAAA,0CAAqB,EAAC,CAAC,CAAC,CAAC,CAAC,CAAC;IAC9E,CAAC,EAAE,CAAC,IAAI,EAAE,KAAK,EAAE,WAAW,EAAE,MAAM,CAAC,CAAC,CAAC;IAEvC,MAAM,aAAa,GAAG,IAAA,mBAAW,EAC/B,CAAC,CAA2C,EAAE,EAAE;QAC9C,IAAI,CAAC,CAAC,GAAG,KAAK,OAAO,EAAE;YACrB,WAAW,EAAE,CAAC;SACf;IACH,CAAC,EACD,CAAC,WAAW,CAAC,CACd,CAAC;IAEF,MAAM,aAAa,GAAG,IAAA,mBAAW,EAC/B,CAAC,CAAyC,EAAE,EAAE;QAC5C,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;IAC3B,CAAC,EACD,EAAE,CACH,CAAC;IAEF,OAAO,CACL,iCAAK,SAAS,EAAE,UAAU,CAAC,SAAS,aAClC,uBAAC,kCAAQ,IACP,SAAS,EAAE,cAAc,EACzB,QAAQ,EAAE,CAAC,cAAc,EACzB,SAAS,EAAE,aAAa,EACxB,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,aAAa,EACvB,SAAS,EAAE,UAAU,CAAC,QAAQ,EAC9B,WAAW,EAAE,WAAW,GACxB,EACF,iDACa,cAAc,EACzB,QAAQ,EAAE,CAAC,cAAc,EACzB,OAAO,EAAE,WAAW,EACpB,SAAS,EAAE,oBAAoB,YAE9B,cAAc,GACR,IACL,CACP,CAAC;AACJ,CAAC;AAjED,8BAiEC"}

package/lib/commonjs/components/ChatPanel.d.ts

@@ -0,0 +1,39 @@
+/// <reference types="react" />
+import { MessageBubbleCssClasses, MessageBubbleProps } from "./MessageBubble";
+import { ChatInputCssClasses, ChatInputProps } from "./ChatInput";
+/**
+ * The CSS class interface for the {@link ChatPanel} component.
+ *
+ * @public
+ */
+export interface ChatPanelCssClasses {
+    container?: string;
+    messagesContainer?: string;
+    inputContainer?: string;
+    inputCssClasses?: ChatInputCssClasses;
+    messageBubbleCssClasses?: MessageBubbleCssClasses;
+}
+/**
+ * The props for the {@link ChatPanel} component.
+ *
+ * @public
+ */
+export interface ChatPanelProps extends Omit<MessageBubbleProps, "customCssClasses" | "message">, Omit<ChatInputProps, "customCssClasses"> {
+    /** A header to render at the top of the panel. */
+    header?: JSX.Element;
+    /**
+     * CSS classes for customizing the component styling.
+     */
+    customCssClasses?: ChatPanelCssClasses;
+}
+/**
+ * A component that renders a full panel for chat bot interactions. This includes
+ * the message bubbles for the conversation, input box with send button, and header
+ * (if provided).
+ *
+ * @public
+ *
+ * @param props - {@link ChatPanelProps}
+ */
+export declare function ChatPanel(props: ChatPanelProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=ChatPanel.d.ts.map

package/lib/commonjs/components/ChatPanel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChatPanel.d.ts","sourceRoot":"","sources":["../../../src/components/ChatPanel.tsx"],"names":[],"mappings":";AAEA,OAAO,EAEL,uBAAuB,EACvB,kBAAkB,EACnB,MAAM,iBAAiB,CAAC;AACzB,OAAO,EAAa,mBAAmB,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAK7E;;;;GAIG;AACH,MAAM,WAAW,mBAAmB;IAClC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,eAAe,CAAC,EAAE,mBAAmB,CAAC;IACtC,uBAAuB,CAAC,EAAE,uBAAuB,CAAC;CACnD;AAUD;;;;GAIG;AACH,MAAM,WAAW,cACf,SAAQ,IAAI,CAAC,kBAAkB,EAAE,kBAAkB,GAAG,SAAS,CAAC,EAC9D,IAAI,CAAC,cAAc,EAAE,kBAAkB,CAAC;IAC1C,kDAAkD;IAClD,MAAM,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IACrB;;OAEG;IACH,gBAAgB,CAAC,EAAE,mBAAmB,CAAC;CACxC;AAED;;;;;;;;GAQG;AACH,wBAAgB,SAAS,CAAC,KAAK,EAAE,cAAc,2CAiD9C"}

package/lib/commonjs/components/ChatPanel.js

@@ -0,0 +1,54 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ChatPanel = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const react_2 = require("react");
+const chat_headless_react_1 = require("@yext/chat-headless-react");
+const MessageBubble_1 = require("./MessageBubble");
+const ChatInput_1 = require("./ChatInput");
+const LoadingDots_1 = require("./LoadingDots");
+const hooks_1 = require("../hooks");
+const defaultHandleError_1 = require("../utils/defaultHandleError");
+const builtInCssClasses = {
+    container: "h-full w-full flex flex-col relative rounded-3xl shadow-2xl bg-white",
+    messagesContainer: "flex flex-col gap-y-1 mt-auto px-4 pb-[85px] overflow-auto",
+    inputContainer: "w-full absolute bottom-0 p-4 rounded-b-3xl backdrop-blur-lg",
+};
+/**
+ * A component that renders a full panel for chat bot interactions. This includes
+ * the message bubbles for the conversation, input box with send button, and header
+ * (if provided).
+ *
+ * @public
+ *
+ * @param props - {@link ChatPanelProps}
+ */
+function ChatPanel(props) {
+    const { header, customCssClasses } = props;
+    const chat = (0, chat_headless_react_1.useChatActions)();
+    const messages = (0, chat_headless_react_1.useChatState)((state) => state.conversation.messages);
+    const loading = (0, chat_headless_react_1.useChatState)((state) => state.conversation.isLoading);
+    const canSendMessage = (0, chat_headless_react_1.useChatState)((state) => state.conversation.canSendMessage);
+    const cssClasses = (0, hooks_1.useComposedCssClasses)(builtInCssClasses, customCssClasses);
+    // Fetch the first message on load, if there are no existing messages or a request being processed
+    (0, react_2.useEffect)(() => {
+        if (messages.length !== 0 || !canSendMessage) {
+            return;
+        }
+        const { stream = true, handleError } = props;
+        const res = stream ? chat.streamNextMessage() : chat.getNextMessage();
+        res.catch((e) => (handleError ? handleError(e) : (0, defaultHandleError_1.defaultHandleApiError)(e)));
+    }, [chat, props, messages, canSendMessage]);
+    const messagesRef = (0, react_2.useRef)(null);
+    // Scroll to the bottom of the chat when the messages change
+    (0, react_2.useEffect)(() => {
+        messagesRef.current?.scroll({
+            top: messagesRef.current?.scrollHeight,
+            behavior: 'smooth',
+        });
+    }, [messages]);
+    return ((0, jsx_runtime_1.jsxs)("div", { className: cssClasses.container, children: [header, (0, jsx_runtime_1.jsxs)("div", { ref: messagesRef, className: cssClasses.messagesContainer, children: [messages.map((message, index) => ((0, react_1.createElement)(MessageBubble_1.MessageBubble, { ...props, customCssClasses: cssClasses.messageBubbleCssClasses, key: index, message: message }))), loading && (0, jsx_runtime_1.jsx)(LoadingDots_1.LoadingDots, {})] }), (0, jsx_runtime_1.jsx)("div", { className: cssClasses.inputContainer, children: (0, jsx_runtime_1.jsx)(ChatInput_1.ChatInput, { ...props, customCssClasses: cssClasses.inputCssClasses }) })] }));
+}
+exports.ChatPanel = ChatPanel;
+//# sourceMappingURL=ChatPanel.js.map

package/lib/commonjs/components/ChatPanel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChatPanel.js","sourceRoot":"","sources":["../../../src/components/ChatPanel.tsx"],"names":[],"mappings":";;;;;AAAA,iCAA0C;AAC1C,mEAAyE;AACzE,mDAIyB;AACzB,2CAA6E;AAC7E,+CAA4C;AAC5C,oCAAiD;AACjD,oEAAoE;AAepE,MAAM,iBAAiB,GAAwB;IAC7C,SAAS,EACP,sEAAsE;IACxE,iBAAiB,EACf,4DAA4D;IAC9D,cAAc,EAAE,6DAA6D;CAC9E,CAAC;AAkBF;;;;;;;;GAQG;AACH,SAAgB,SAAS,CAAC,KAAqB;IAC7C,MAAM,EAAE,MAAM,EAAE,gBAAgB,EAAE,GAAG,KAAK,CAAC;IAC3C,MAAM,IAAI,GAAG,IAAA,oCAAc,GAAE,CAAC;IAC9B,MAAM,QAAQ,GAAG,IAAA,kCAAY,EAAC,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,YAAY,CAAC,QAAQ,CAAC,CAAC;IACtE,MAAM,OAAO,GAAG,IAAA,kCAAY,EAAC,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,YAAY,CAAC,SAAS,CAAC,CAAC;IACtE,MAAM,cAAc,GAAG,IAAA,kCAAY,EACjC,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,YAAY,CAAC,cAAc,CAC7C,CAAC;IACF,MAAM,UAAU,GAAG,IAAA,6BAAqB,EAAC,iBAAiB,EAAE,gBAAgB,CAAC,CAAC;IAE9E,kGAAkG;IAClG,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,IAAI,QAAQ,CAAC,MAAM,KAAK,CAAC,IAAI,CAAC,cAAc,EAAE;YAC5C,OAAO;SACR;QACD,MAAM,EAAE,MAAM,GAAG,IAAI,EAAE,WAAW,EAAE,GAAG,KAAK,CAAC;QAC7C,MAAM,GAAG,GAAG,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,iBAAiB,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,cAAc,EAAE,CAAC;QACtE,GAAG,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,IAAA,0CAAqB,EAAC,CAAC,CAAC,CAAC,CAAC,CAAC;IAC9E,CAAC,EAAE,CAAC,IAAI,EAAE,KAAK,EAAE,QAAQ,EAAE,cAAc,CAAC,CAAC,CAAC;IAE5C,MAAM,WAAW,GAAG,IAAA,cAAM,EAAiB,IAAI,CAAC,CAAC;IAEjD,4DAA4D;IAC5D,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,WAAW,CAAC,OAAO,EAAE,MAAM,CAAC;YAC1B,GAAG,EAAE,WAAW,CAAC,OAAO,EAAE,YAAY;YACtC,QAAQ,EAAE,QAAQ;SACrB,CAAC,CAAC;IACH,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC;IAEf,OAAO,CACL,iCAAK,SAAS,EAAE,UAAU,CAAC,SAAS,aACjC,MAAM,EACP,iCAAK,GAAG,EAAE,WAAW,EAAE,SAAS,EAAE,UAAU,CAAC,iBAAiB,aAC3D,QAAQ,CAAC,GAAG,CAAC,CAAC,OAAO,EAAE,KAAK,EAAE,EAAE,CAAC,CAChC,2BAAC,6BAAa,OACR,KAAK,EACT,gBAAgB,EAAE,UAAU,CAAC,uBAAuB,EACpD,GAAG,EAAE,KAAK,EACV,OAAO,EAAE,OAAO,GAChB,CACH,CAAC,EACD,OAAO,IAAI,uBAAC,yBAAW,KAAG,IACvB,EACN,gCAAK,SAAS,EAAE,UAAU,CAAC,cAAc,YACvC,uBAAC,qBAAS,OAAK,KAAK,EAAE,gBAAgB,EAAE,UAAU,CAAC,eAAe,GAAI,GAClE,IACF,CACP,CAAC;AACJ,CAAC;AAjDD,8BAiDC"}

package/lib/commonjs/components/ChatPopUp.d.ts

@@ -0,0 +1,42 @@
+/// <reference types="react" />
+import { ChatPanelCssClasses, ChatPanelProps } from "./ChatPanel";
+import { ChatHeaderCssClasses, ChatHeaderProps } from "./ChatHeader";
+/**
+ * The CSS class interface for the {@link ChatPopUp} component.
+ *
+ * @public
+ */
+export interface ChatPopUpCssClasses {
+    container?: string;
+    panel?: string;
+    panel__display?: string;
+    panel__hidden?: string;
+    button?: string;
+    button__display?: string;
+    button__hidden?: string;
+    headerCssClasses?: ChatHeaderCssClasses;
+    panelCssClasses?: ChatPanelCssClasses;
+}
+/**
+ * The props for the {@link ChatPopUp} component.
+ *
+ * @public
+ */
+export interface ChatPopUpProps extends Omit<ChatHeaderProps, "showCloseButton" | "customCssClasses">, Omit<ChatPanelProps, "header" | "customCssClasses"> {
+    /** Custom icon for the popup button to open the panel. */
+    openPanelButtonIcon?: JSX.Element;
+    /**
+     * CSS classes for customizing the component styling.
+     */
+    customCssClasses?: ChatPopUpCssClasses;
+}
+/**
+ * A component that renders a popup button that displays and hides
+ * a panel for chat bot interactions.
+ *
+ * @public
+ *
+ * @param props - {@link ChatPanelProps}
+ */
+export declare function ChatPopUp(props: ChatPopUpProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=ChatPopUp.d.ts.map

package/lib/commonjs/components/ChatPopUp.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChatPopUp.d.ts","sourceRoot":"","sources":["../../../src/components/ChatPopUp.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAa,mBAAmB,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAC7E,OAAO,EAAc,oBAAoB,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAIjF;;;;GAIG;AACH,MAAM,WAAW,mBAAmB;IAClC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,gBAAgB,CAAC,EAAE,oBAAoB,CAAC;IACxC,eAAe,CAAC,EAAE,mBAAmB,CAAC;CACvC;AAaD;;;;GAIG;AACH,MAAM,WAAW,cAAe,SAC9B,IAAI,CAAC,eAAe,EAAE,iBAAiB,GAAG,kBAAkB,CAAC,EAC7D,IAAI,CAAC,cAAc,EAAE,QAAQ,GAAG,kBAAkB,CAAC;IAEnD,0DAA0D;IAC1D,mBAAmB,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IAClC;;OAEG;IACH,gBAAgB,CAAC,EAAE,mBAAmB,CAAC;CACxC;AAED;;;;;;;GAOG;AACH,wBAAgB,SAAS,CAAC,KAAK,EAAE,cAAc,2CAmD9C"}

package/lib/commonjs/components/ChatPopUp.js

@@ -0,0 +1,45 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ChatPopUp = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const Message_1 = require("../icons/Message");
+const ChatPanel_1 = require("./ChatPanel");
+const ChatHeader_1 = require("./ChatHeader");
+const tailwind_merge_1 = require("tailwind-merge");
+const hooks_1 = require("../hooks");
+const fixedPosition = "fixed bottom-6 right-4 lg:bottom-14 lg:right-10 ";
+const builtInCssClasses = {
+    container: "transition-all",
+    panel: fixedPosition + "w-80 lg:w-96 h-[75vh]",
+    panel__display: "duration-300 translate-y-0",
+    panel__hidden: "duration-300 translate-y-[20%] opacity-0 invisible",
+    button: fixedPosition + "p-2 w-12 h-12 lg:w-16 lg:h-16 flex justify-center items-center text-white shadow-xl rounded-full bg-gradient-to-br from-blue-600 to-blue-700 hover:-translate-y-2 duration-150",
+    button__display: "duration-300 transform translate-y-0",
+    button__hidden: "duration-300 transform translate-y-[20%] opacity-0 invisible",
+};
+/**
+ * A component that renders a popup button that displays and hides
+ * a panel for chat bot interactions.
+ *
+ * @public
+ *
+ * @param props - {@link ChatPanelProps}
+ */
+function ChatPopUp(props) {
+    const { openPanelButtonIcon = (0, jsx_runtime_1.jsx)(Message_1.MessageIcon, {}), customCssClasses, showRestartButton = true, onClose: customOnClose, title } = props;
+    const [showChat, setShowChat] = (0, react_1.useState)(false);
+    const onClick = (0, react_1.useCallback)(() => {
+        setShowChat(!showChat);
+    }, [showChat]);
+    const onClose = (0, react_1.useCallback)(() => {
+        setShowChat(false);
+        customOnClose?.();
+    }, [customOnClose]);
+    const cssClasses = (0, hooks_1.useComposedCssClasses)(builtInCssClasses, customCssClasses);
+    const panelCssClasses = (0, tailwind_merge_1.twMerge)(cssClasses.panel, showChat ? cssClasses.panel__display : cssClasses.panel__hidden);
+    const buttonCssClasses = (0, tailwind_merge_1.twMerge)(cssClasses.button, showChat ? cssClasses.button__hidden : cssClasses.button__display);
+    return ((0, jsx_runtime_1.jsxs)("div", { className: cssClasses.container, children: [(0, jsx_runtime_1.jsx)("div", { className: panelCssClasses, "aria-label": "Chat Popup Panel", children: (0, jsx_runtime_1.jsx)(ChatPanel_1.ChatPanel, { ...props, customCssClasses: cssClasses.panelCssClasses, header: (0, jsx_runtime_1.jsx)(ChatHeader_1.ChatHeader, { title: title, showRestartButton: showRestartButton, showCloseButton: true, onClose: onClose, customCssClasses: cssClasses.headerCssClasses }) }) }), (0, jsx_runtime_1.jsx)("button", { "aria-label": "Chat Popup Button", onClick: onClick, className: buttonCssClasses, children: openPanelButtonIcon })] }));
+}
+exports.ChatPopUp = ChatPopUp;
+//# sourceMappingURL=ChatPopUp.js.map

package/lib/commonjs/components/ChatPopUp.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChatPopUp.js","sourceRoot":"","sources":["../../../src/components/ChatPopUp.tsx"],"names":[],"mappings":";;;;AAAA,iCAA8C;AAC9C,8CAA8C;AAC9C,2CAA6E;AAC7E,6CAAiF;AACjF,mDAAyC;AACzC,oCAAiD;AAmBjD,MAAM,aAAa,GAAG,kDAAkD,CAAA;AACxE,MAAM,iBAAiB,GAAwB;IAC7C,SAAS,EAAE,gBAAgB;IAC3B,KAAK,EAAE,aAAa,GAAG,uBAAuB;IAC9C,cAAc,EAAE,4BAA4B;IAC5C,aAAa,EAAE,oDAAoD;IACnE,MAAM,EAAE,aAAa,GAAG,gLAAgL;IACxM,eAAe,EAAE,sCAAsC;IACvD,cAAc,EAAE,8DAA8D;CAC/E,CAAC;AAmBF;;;;;;;GAOG;AACH,SAAgB,SAAS,CAAC,KAAqB;IAC7C,MAAM,EACJ,mBAAmB,GAAG,uBAAC,qBAAW,KAAG,EACrC,gBAAgB,EAChB,iBAAiB,GAAG,IAAI,EACxB,OAAO,EAAC,aAAa,EACrB,KAAK,EACN,GAAG,KAAK,CAAA;IACT,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,IAAA,gBAAQ,EAAC,KAAK,CAAC,CAAC;IAChD,MAAM,OAAO,GAAG,IAAA,mBAAW,EAAC,GAAG,EAAE;QAC/B,WAAW,CAAC,CAAC,QAAQ,CAAC,CAAC;IACzB,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC;IAEf,MAAM,OAAO,GAAG,IAAA,mBAAW,EAAC,GAAG,EAAE;QAC/B,WAAW,CAAC,KAAK,CAAC,CAAC;QACnB,aAAa,EAAE,EAAE,CAAC;IACpB,CAAC,EAAE,CAAC,aAAa,CAAC,CAAC,CAAA;IAEnB,MAAM,UAAU,GAAG,IAAA,6BAAqB,EAAC,iBAAiB,EAAE,gBAAgB,CAAC,CAAC;IAC9E,MAAM,eAAe,GAAG,IAAA,wBAAO,EAC7B,UAAU,CAAC,KAAK,EAChB,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,cAAc,CAAC,CAAC,CAAC,UAAU,CAAC,aAAa,CAChE,CAAC;IACF,MAAM,gBAAgB,GAAG,IAAA,wBAAO,EAC9B,UAAU,CAAC,MAAM,EACjB,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,cAAc,CAAC,CAAC,CAAC,UAAU,CAAC,eAAe,CAClE,CAAC;IAEF,OAAO,CACL,iCAAK,SAAS,EAAE,UAAU,CAAC,SAAS,aAClC,gCAAK,SAAS,EAAE,eAAe,gBAAa,kBAAkB,YAC5D,uBAAC,qBAAS,OACJ,KAAK,EACT,gBAAgB,EAAE,UAAU,CAAC,eAAe,EAC5C,MAAM,EAAE,uBAAC,uBAAU,IACjB,KAAK,EAAE,KAAK,EACZ,iBAAiB,EAAE,iBAAiB,EACpC,eAAe,EAAE,IAAI,EACrB,OAAO,EAAE,OAAO,EAChB,gBAAgB,EAAE,UAAU,CAAC,gBAAgB,GAAG,GAC9C,GACF,EACN,iDACa,mBAAmB,EAC9B,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,gBAAgB,YAE1B,mBAAmB,GACb,IACL,CACP,CAAC;AACJ,CAAC;AAnDD,8BAmDC"}

package/lib/commonjs/components/LoadingDots.d.ts

@@ -0,0 +1,9 @@
+/**
+ * A component that signifies loading status.
+ *
+ * @internal
+ */
+export declare function LoadingDots({ className }: {
+    className?: string;
+}): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=LoadingDots.d.ts.map

package/lib/commonjs/components/LoadingDots.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"LoadingDots.d.ts","sourceRoot":"","sources":["../../../src/components/LoadingDots.tsx"],"names":[],"mappings":"AAEA;;;;GAIG;AACH,wBAAgB,WAAW,CAAC,EAAE,SAAS,EAAE,EAAE;IAAE,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,2CAchE"}

package/lib/commonjs/components/LoadingDots.js

@@ -0,0 +1,15 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.LoadingDots = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const tailwind_merge_1 = require("tailwind-merge");
+/**
+ * A component that signifies loading status.
+ *
+ * @internal
+ */
+function LoadingDots({ className }) {
+    return ((0, jsx_runtime_1.jsxs)("div", { "aria-label": "Loading Indicator", className: (0, tailwind_merge_1.twMerge)("flex gap-1 p-2 animate-fade-in", className), children: [(0, jsx_runtime_1.jsx)("div", { className: "w-2 h-2 bg-slate-500 rounded-full animate-[bounce_1s_infinite]" }), (0, jsx_runtime_1.jsx)("div", { className: "w-2 h-2 bg-slate-500 rounded-full animate-[bounce_1s_infinite_0.3s]" }), (0, jsx_runtime_1.jsx)("div", { className: "w-2 h-2 bg-slate-500 rounded-full animate-[bounce_1s_infinite_0.6s]" })] }));
+}
+exports.LoadingDots = LoadingDots;
+//# sourceMappingURL=LoadingDots.js.map

package/lib/commonjs/components/LoadingDots.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LoadingDots.js","sourceRoot":"","sources":["../../../src/components/LoadingDots.tsx"],"names":[],"mappings":";;;;AAAA,mDAAyC;AAEzC;;;;GAIG;AACH,SAAgB,WAAW,CAAC,EAAE,SAAS,EAA0B;IAC/D,OAAO,CACL,+CACa,mBAAmB,EAC9B,SAAS,EAAE,IAAA,wBAAO,EAChB,gCAAgC,EAChC,SAAS,CACV,aAED,gCAAK,SAAS,EAAC,gEAAgE,GAAG,EAClF,gCAAK,SAAS,EAAC,qEAAqE,GAAG,EACvF,gCAAK,SAAS,EAAC,qEAAqE,GAAG,IACnF,CACP,CAAC;AACJ,CAAC;AAdD,kCAcC"}

package/lib/commonjs/components/Markdown.d.ts

@@ -0,0 +1,13 @@
+interface MarkdownProps {
+    /** Stringified markdown. */
+    content: string;
+}
+/**
+ * Renders Github-Flavored Markdown from the Knowledge Graph. This Markdown can include
+ * arbitrary HTML. Any HTML will be sanitized according to Rehype's default Schema.
+ *
+ * @public
+ */
+export declare function Markdown({ content }: MarkdownProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=Markdown.d.ts.map

package/lib/commonjs/components/Markdown.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Markdown.d.ts","sourceRoot":"","sources":["../../../src/components/Markdown.tsx"],"names":[],"mappings":"AAgBA,UAAU,aAAa;IACrB,4BAA4B;IAC5B,OAAO,EAAE,MAAM,CAAC;CACjB;AAED;;;;;GAKG;AACH,wBAAgB,QAAQ,CAAC,EAAE,OAAO,EAAE,EAAE,aAAa,2CAQlD"}

package/lib/commonjs/components/Markdown.js

@@ -0,0 +1,32 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Markdown = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_markdown_1 = __importDefault(require("react-markdown"));
+const remark_gfm_1 = __importDefault(require("remark-gfm"));
+const rehype_raw_1 = __importDefault(require("rehype-raw"));
+const rehype_sanitize_1 = __importDefault(require("rehype-sanitize"));
+// The Remark and Rehype plugins to use in conjunction with ReactMarkdown.
+const unifiedPlugins = {
+    remark: [
+        remark_gfm_1.default //renders Github-Flavored Markdown
+    ],
+    rehype: [
+        rehype_raw_1.default,
+        rehype_sanitize_1.default, //to sanitize HTML content
+    ],
+};
+/**
+ * Renders Github-Flavored Markdown from the Knowledge Graph. This Markdown can include
+ * arbitrary HTML. Any HTML will be sanitized according to Rehype's default Schema.
+ *
+ * @public
+ */
+function Markdown({ content }) {
+    return ((0, jsx_runtime_1.jsx)(react_markdown_1.default, { children: content, remarkPlugins: unifiedPlugins.remark, rehypePlugins: unifiedPlugins.rehype }));
+}
+exports.Markdown = Markdown;
+//# sourceMappingURL=Markdown.js.map

package/lib/commonjs/components/Markdown.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Markdown.js","sourceRoot":"","sources":["../../../src/components/Markdown.tsx"],"names":[],"mappings":";;;;;;;AAAA,oEAA8D;AAC9D,4DAAmC;AACnC,4DAAmC;AACnC,sEAA6C;AAE7C,0EAA0E;AAC1E,MAAM,cAAc,GAAsD;IACxE,MAAM,EAAE;QACN,oBAAS,CAAC,kCAAkC;KAC7C;IACD,MAAM,EAAE;QACN,oBAAS;QACT,yBAAc,EAAE,0BAA0B;KAC3C;CACF,CAAC;AAOF;;;;;GAKG;AACH,SAAgB,QAAQ,CAAC,EAAE,OAAO,EAAiB;IACjD,OAAO,CACL,uBAAC,wBAAa,IACZ,QAAQ,EAAE,OAAO,EACjB,aAAa,EAAE,cAAc,CAAC,MAAM,EACpC,aAAa,EAAE,cAAc,CAAC,MAAM,GACpC,CACH,CAAC;AACJ,CAAC;AARD,4BAQC"}

package/lib/commonjs/components/MessageBubble.d.ts

@@ -0,0 +1,49 @@
+import { Message } from "@yext/chat-headless-react";
+/**
+ * The CSS class interface for the {@link MessageBubble} component.
+ *
+ * @public
+ */
+export interface MessageBubbleCssClasses {
+    topContainer?: string;
+    subContainer?: string;
+    subContainer__bot?: string;
+    subContainer__user?: string;
+    message?: string;
+    message__bot?: string;
+    message__user?: string;
+    timestamp?: string;
+    timestamp__bot?: string;
+    timestamp__user?: string;
+}
+/**
+ * The props for the {@link MessageBubble} component.
+ *
+ * @public
+ */
+export interface MessageBubbleProps {
+    /** The message to display. */
+    message: Message;
+    /**
+     * Whether to show the timestamp of the message with the message bubble.
+     * Defaults to true.
+     */
+    showTimestamp?: boolean;
+    /**
+     * A function which is called to format the message's timestamp given in
+     * ISO format (e.g. "2023-05-18T19:33:34.553Z").
+     * Defaults to "HH:MM:SS A" (e.g. "7:33:34 PM").
+     */
+    formatTimestamp?: (timestamp: string) => string;
+    /** CSS classes for customizing the component styling. */
+    customCssClasses?: MessageBubbleCssClasses;
+}
+/**
+ * A component that displays the provided message.
+ *
+ * @public
+ *
+ * @param props - {@link MessageBubbleProps}
+ */
+export declare function MessageBubble({ message, showTimestamp, customCssClasses, formatTimestamp, }: MessageBubbleProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=MessageBubble.d.ts.map

package/lib/commonjs/components/MessageBubble.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MessageBubble.d.ts","sourceRoot":"","sources":["../../../src/components/MessageBubble.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAiB,MAAM,2BAA2B,CAAC;AAKnE;;;;GAIG;AACH,MAAM,WAAW,uBAAuB;IACtC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B;AAiBD;;;;GAIG;AACH,MAAM,WAAW,kBAAkB;IACjC,8BAA8B;IAC9B,OAAO,EAAE,OAAO,CAAC;IACjB;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;;;OAIG;IACH,eAAe,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,MAAM,CAAC;IAChD,yDAAyD;IACzD,gBAAgB,CAAC,EAAE,uBAAuB,CAAC;CAC5C;AAED;;;;;;GAMG;AACH,wBAAgB,aAAa,CAAC,EAC5B,OAAO,EACP,aAAoB,EACpB,gBAAgB,EAChB,eAAwC,GACzC,EAAE,kBAAkB,2CAoCpB"}