npm - @yext/chat-ui-react - Versions diffs - 0.8.1-alpha.53.2 → 0.8.2 - Mend

@yext/chat-ui-react 0.8.1-alpha.53.2 → 0.8.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (98) hide show

package/lib/bundle.css CHANGED Viewed

	@@ -1 +1 @@
1	- .yext-chat { width: 100%; height: 100%; } /! tailwindcss v3.3.2 \| MIT License \| https://tailwindcss.com/.yext-chat ,.yext-chat :after,.yext-chat :before{box-sizing:border-box;border:0 solid #e5e7eb}.yext-chat :after,.yext-chat :before{--tw-content:""}.yext-chat {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}.yext-chat {margin:0;line-height:inherit}.yext-chat hr{height:0;color:inherit;border-top-width:1px}.yext-chat abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}.yext-chat h1,.yext-chat h2,.yext-chat h3,.yext-chat h4,.yext-chat h5,.yext-chat h6{font-size:inherit;font-weight:inherit}.yext-chat a{color:inherit;text-decoration:inherit}.yext-chat b,.yext-chat strong{font-weight:bolder}.yext-chat code,.yext-chat kbd,.yext-chat pre,.yext-chat samp{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:1em}.yext-chat small{font-size:80%}.yext-chat sub,.yext-chat sup{font-size:75%;line-height:0;position:relative;vertical-align:initial}.yext-chat sub{bottom:-.25em}.yext-chat sup{top:-.5em}.yext-chat table{text-indent:0;border-color:inherit;border-collapse:collapse}.yext-chat button,.yext-chat input,.yext-chat optgroup,.yext-chat select,.yext-chat textarea{font-family:inherit;font-size:100%;font-weight:inherit;line-height:inherit;color:inherit;margin:0;padding:0}.yext-chat button,.yext-chat select{text-transform:none}.yext-chat [type=button],.yext-chat [type=reset],.yext-chat [type=submit],.yext-chat button{-webkit-appearance:button;background-color:initial;background-image:none}.yext-chat :-moz-focusring{outline:auto}.yext-chat :-moz-ui-invalid{box-shadow:none}.yext-chat progress{vertical-align:initial}.yext-chat ::-webkit-inner-spin-button,.yext-chat ::-webkit-outer-spin-button{height:auto}.yext-chat [type=search]{-webkit-appearance:textfield;outline-offset:-2px}.yext-chat ::-webkit-search-decoration{-webkit-appearance:none}.yext-chat ::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}.yext-chat summary{display:list-item}.yext-chat blockquote,.yext-chat dd,.yext-chat dl,.yext-chat figure,.yext-chat h1,.yext-chat h2,.yext-chat h3,.yext-chat h4,.yext-chat h5,.yext-chat h6,.yext-chat hr,.yext-chat p,.yext-chat pre{margin:0}.yext-chat fieldset{margin:0}.yext-chat fieldset,.yext-chat legend{padding:0}.yext-chat menu,.yext-chat ol,.yext-chat ul{list-style:none;margin:0;padding:0}.yext-chat textarea{resize:vertical}.yext-chat input::-moz-placeholder,.yext-chat textarea::-moz-placeholder{opacity:1;color:#9ca3af}.yext-chat input::placeholder,.yext-chat textarea::placeholder{opacity:1;color:#9ca3af}.yext-chat [role=button],.yext-chat button{cursor:pointer}.yext-chat :disabled{cursor:default}.yext-chat audio,.yext-chat canvas,.yext-chat embed,.yext-chat iframe,.yext-chat img,.yext-chat object,.yext-chat svg,.yext-chat video{display:block;vertical-align:middle}.yext-chat img,.yext-chat video{max-width:100%;height:auto}.yext-chat [hidden]{display:none}.yext-chat ,.yext-chat ::backdrop,.yext-chat :after,.yext-chat :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: }.yext-chat .container{width:100%}@media (min-width:640px){.yext-chat .container{max-width:640px}}@media (min-width:768px){.yext-chat .container{max-width:768px}}@media (min-width:1024px){.yext-chat .container{max-width:1024px}}@media (min-width:1280px){.yext-chat .container{max-width:1280px}}@media (min-width:1536px){.yext-chat .container{max-width:1536px}}.yext-chat .prose{color:var(--tw-prose-body);max-width:65ch}.yext-chat .prose :where(p):not(:where([class~=not-prose] )){margin-top:1.25em;margin-bottom:1.25em}.yext-chat .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}.yext-chat .prose :where(a):not(:where([class~=not-prose] )){color:var(--tw-prose-links);text-decoration:underline;font-weight:500}.yext-chat .prose :where(strong):not(:where([class~=not-prose] )){color:var(--tw-prose-bold);font-weight:600}.yext-chat .prose :where(a strong):not(:where([class~=not-prose] )){color:inherit}.yext-chat .prose :where(blockquote strong):not(:where([class~=not-prose] )){color:inherit}.yext-chat .prose :where(thead th strong):not(:where([class~=not-prose] )){color:inherit}.yext-chat .prose :where(ol):not(:where([class~=not-prose] )){list-style-type:decimal;margin-top:1.25em;margin-bottom:1.25em;padding-left:1.625em}.yext-chat .prose :where(ol[type=A]):not(:where([class~=not-prose] )){list-style-type:upper-alpha}.yext-chat .prose :where(ol[type=a]):not(:where([class~=not-prose] )){list-style-type:lower-alpha}.yext-chat .prose :where(ol[type=A s]):not(:where([class~=not-prose] )){list-style-type:upper-alpha}.yext-chat .prose :where(ol[type=a s]):not(:where([class~=not-prose] )){list-style-type:lower-alpha}.yext-chat .prose :where(ol[type=I]):not(:where([class~=not-prose] )){list-style-type:upper-roman}.yext-chat .prose :where(ol[type=i]):not(:where([class~=not-prose] )){list-style-type:lower-roman}.yext-chat .prose :where(ol[type=I s]):not(:where([class~=not-prose] )){list-style-type:upper-roman}.yext-chat .prose :where(ol[type=i s]):not(:where([class~=not-prose] )){list-style-type:lower-roman}.yext-chat .prose :where(ol[type="1"]):not(:where([class~=not-prose] )){list-style-type:decimal}.yext-chat .prose :where(ul):not(:where([class~=not-prose] )){list-style-type:disc;margin-top:1.25em;margin-bottom:1.25em;padding-left:1.625em}.yext-chat .prose :where(ol>li):not(:where([class~=not-prose] ))::marker{font-weight:400;color:var(--tw-prose-counters)}.yext-chat .prose :where(ul>li):not(:where([class~=not-prose] ))::marker{color:var(--tw-prose-bullets)}.yext-chat .prose :where(hr):not(:where([class~=not-prose] )){border-color:var(--tw-prose-hr);border-top-width:1px;margin-top:3em;margin-bottom:3em}.yext-chat .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}.yext-chat .prose :where(blockquote p:first-of-type):not(:where([class~=not-prose] )):before{content:open-quote}.yext-chat .prose :where(blockquote p:last-of-type):not(:where([class~=not-prose] )):after{content:close-quote}.yext-chat .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}.yext-chat .prose :where(h1 strong):not(:where([class~=not-prose] )){font-weight:900;color:inherit}.yext-chat .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}.yext-chat .prose :where(h2 strong):not(:where([class~=not-prose] )){font-weight:800;color:inherit}.yext-chat .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}.yext-chat .prose :where(h3 strong):not(:where([class~=not-prose] )){font-weight:700;color:inherit}.yext-chat .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}.yext-chat .prose :where(h4 strong):not(:where([class~=not-prose] )){font-weight:700;color:inherit}.yext-chat .prose :where(img):not(:where([class~=not-prose] )){margin-top:2em;margin-bottom:2em}.yext-chat .prose :where(figure>):not(:where([class~=not-prose] )){margin-top:0;margin-bottom:0}.yext-chat .prose :where(figcaption):not(:where([class~=not-prose] )){color:var(--tw-prose-captions);font-size:.875em;line-height:1.4285714;margin-top:.8571429em}.yext-chat .prose :where(code):not(:where([class~=not-prose] )){color:var(--tw-prose-code);font-weight:600;font-size:.875em}.yext-chat .prose :where(code):not(:where([class~=not-prose] )):before{content:"`"}.yext-chat .prose :where(code):not(:where([class~=not-prose] )):after{content:"`"}.yext-chat .prose :where(a code):not(:where([class~=not-prose] )){color:inherit}.yext-chat .prose :where(h1 code):not(:where([class~=not-prose] )){color:inherit}.yext-chat .prose :where(h2 code):not(:where([class~=not-prose] )){color:inherit;font-size:.875em}.yext-chat .prose :where(h3 code):not(:where([class~=not-prose] )){color:inherit;font-size:.9em}.yext-chat .prose :where(h4 code):not(:where([class~=not-prose] )){color:inherit}.yext-chat .prose :where(blockquote code):not(:where([class~=not-prose] )){color:inherit}.yext-chat .prose :where(thead th code):not(:where([class~=not-prose] )){color:inherit}.yext-chat .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}.yext-chat .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}.yext-chat .prose :where(pre code):not(:where([class~=not-prose] )):before{content:none}.yext-chat .prose :where(pre code):not(:where([class~=not-prose] )):after{content:none}.yext-chat .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}.yext-chat .prose :where(thead):not(:where([class~=not-prose] )){border-bottom-width:1px;border-bottom-color:var(--tw-prose-th-borders)}.yext-chat .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}.yext-chat .prose :where(tbody tr):not(:where([class~=not-prose] )){border-bottom-width:1px;border-bottom-color:var(--tw-prose-td-borders)}.yext-chat .prose :where(tbody tr:last-child):not(:where([class~=not-prose] )){border-bottom-width:0}.yext-chat .prose :where(tbody td):not(:where([class~=not-prose] )){vertical-align:initial}.yext-chat .prose :where(tfoot):not(:where([class~=not-prose] )){border-top-width:1px;border-top-color:var(--tw-prose-th-borders)}.yext-chat .prose :where(tfoot td):not(:where([class~=not-prose] )){vertical-align:top}.yext-chat .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}.yext-chat .prose :where(video):not(:where([class~=not-prose] )){margin-top:2em;margin-bottom:2em}.yext-chat .prose :where(figure):not(:where([class~=not-prose] )){margin-top:2em;margin-bottom:2em}.yext-chat .prose :where(li):not(:where([class~=not-prose] )){margin-top:.5em;margin-bottom:.5em}.yext-chat .prose :where(ol>li):not(:where([class~=not-prose] )){padding-left:.375em}.yext-chat .prose :where(ul>li):not(:where([class~=not-prose] )){padding-left:.375em}.yext-chat .prose :where(.prose>ul>li p):not(:where([class~=not-prose] )){margin-top:.75em;margin-bottom:.75em}.yext-chat .prose :where(.prose>ul>li>:first-child):not(:where([class~=not-prose] )){margin-top:1.25em}.yext-chat .prose :where(.prose>ul>li>:last-child):not(:where([class~=not-prose] )){margin-bottom:1.25em}.yext-chat .prose :where(.prose>ol>li>:first-child):not(:where([class~=not-prose] )){margin-top:1.25em}.yext-chat .prose :where(.prose>ol>li>:last-child):not(:where([class~=not-prose] )){margin-bottom:1.25em}.yext-chat .prose :where(ul ul,ul ol,ol ul,ol ol):not(:where([class~=not-prose] )){margin-top:.75em;margin-bottom:.75em}.yext-chat .prose :where(hr+):not(:where([class~=not-prose] )){margin-top:0}.yext-chat .prose :where(h2+):not(:where([class~=not-prose] )){margin-top:0}.yext-chat .prose :where(h3+):not(:where([class~=not-prose] )){margin-top:0}.yext-chat .prose :where(h4+):not(:where([class~=not-prose] )){margin-top:0}.yext-chat .prose :where(thead th:first-child):not(:where([class~=not-prose] )){padding-left:0}.yext-chat .prose :where(thead th:last-child):not(:where([class~=not-prose] )){padding-right:0}.yext-chat .prose :where(tbody td,tfoot td):not(:where([class~=not-prose] )){padding:.5714286em}.yext-chat .prose :where(tbody td:first-child,tfoot td:first-child):not(:where([class~=not-prose] )){padding-left:0}.yext-chat .prose :where(tbody td:last-child,tfoot td:last-child):not(:where([class~=not-prose] )){padding-right:0}.yext-chat .prose :where(.prose>:first-child):not(:where([class~=not-prose] )){margin-top:0}.yext-chat .prose :where(.prose>:last-child):not(:where([class~=not-prose] )){margin-bottom:0}.yext-chat .invisible{visibility:hidden}.yext-chat .fixed{position:fixed}.yext-chat .absolute{position:absolute}.yext-chat .relative{position:relative}.yext-chat .-right-1{right:-.25rem}.yext-chat .-top-3{top:-.75rem}.yext-chat .bottom-2{bottom:.5rem}.yext-chat .bottom-2\.5{bottom:.625rem}.yext-chat .bottom-6{bottom:1.5rem}.yext-chat .right-4{right:1rem}.yext-chat .top-0{top:0}.yext-chat .z-50{z-index:50}.yext-chat .my-0{margin-top:0;margin-bottom:0}.yext-chat .my-0\.5{margin-top:.125rem;margin-bottom:.125rem}.yext-chat .-mr-8{margin-right:-2rem}.yext-chat .mb-3{margin-bottom:.75rem}.yext-chat .ml-4{margin-left:1rem}.yext-chat .ml-auto{margin-left:auto}.yext-chat .mt-auto{margin-top:auto}.yext-chat .line-clamp-1{-webkit-line-clamp:1}.yext-chat .line-clamp-1,.yext-chat .line-clamp-2{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical}.yext-chat .line-clamp-2{-webkit-line-clamp:2}.yext-chat .flex{display:flex}.yext-chat .hidden{display:none}.yext-chat .h-10{height:2.5rem}.yext-chat .h-12{height:3rem}.yext-chat .h-2{height:.5rem}.yext-chat .h-4{height:1rem}.yext-chat .h-5{height:1.25rem}.yext-chat .h-6{height:1.5rem}.yext-chat .h-8{height:2rem}.yext-chat .h-\[22px\]{height:22px}.yext-chat .h-\[26px\]{height:26px}.yext-chat .h-\[28px\]{height:28px}.yext-chat .h-\[75vh\]{height:75vh}.yext-chat .h-fit{height:-moz-fit-content;height:fit-content}.yext-chat .h-full{height:100%}.yext-chat .w-12{width:3rem}.yext-chat .w-2{width:.5rem}.yext-chat .w-4{width:1rem}.yext-chat .w-5{width:1.25rem}.yext-chat .w-6{width:1.5rem}.yext-chat .w-60{width:15rem}.yext-chat .w-8{width:2rem}.yext-chat .w-80{width:20rem}.yext-chat .w-\[22px\]{width:22px}.yext-chat .w-\[26px\]{width:26px}.yext-chat .w-\[28px\]{width:28px}.yext-chat .w-fit{width:-moz-fit-content;width:fit-content}.yext-chat .w-full{width:100%}.yext-chat .max-w-\[80\%\]{max-width:80%}.yext-chat .shrink-0{flex-shrink:0}.yext-chat .translate-y-0{--tw-translate-y:0px}.yext-chat .translate-y-0,.yext-chat .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))}.yext-chat .translate-y-\[20\%\]{--tw-translate-y:20%}.yext-chat .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))}.yext-chat .animate-\[bounce_1s_infinite\]{animation:bounce 1s infinite}.yext-chat .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)}}.yext-chat .animate-\[bounce_1s_infinite_0\.6s\]{animation:bounce 1s .6s infinite}@keyframes spin{to{transform:rotate(1turn)}}.yext-chat .animate-\[spin_0\.3s_linear\]{animation:spin .3s linear}@keyframes expand-left{0%{margin-left:100%}to{margin-left:0}}.yext-chat .animate-expand-left{animation:expand-left .5s}@keyframes fade-in{0%{opacity:0}to{opacity:1}}.yext-chat .animate-fade-in{animation:fade-in .4s}@keyframes heartbeat{0%{transform:scale(1)}80%{transform:scale(1)}90%{transform:scale(1.1)}to{transform:scale(1)}}.yext-chat .animate-heartbeat{animation:heartbeat 2s ease-out infinite}.yext-chat .cursor-pointer{cursor:pointer}.yext-chat .resize-none{resize:none}.yext-chat .flex-row{flex-direction:row}.yext-chat .flex-col{flex-direction:column}.yext-chat .items-center{align-items:center}.yext-chat .justify-center{justify-content:center}.yext-chat .justify-between{justify-content:space-between}.yext-chat .gap-1{gap:.25rem}.yext-chat .gap-x-1{-moz-column-gap:.25rem;column-gap:.25rem}.yext-chat .gap-x-2{-moz-column-gap:.5rem;column-gap:.5rem}.yext-chat .gap-x-2\.5{-moz-column-gap:.625rem;column-gap:.625rem}.yext-chat .gap-y-1{row-gap:.25rem}.yext-chat .overflow-auto{overflow:auto}.yext-chat .overflow-hidden{overflow:hidden}.yext-chat .overflow-x-auto{overflow-x:auto}.yext-chat .truncate{overflow:hidden;text-overflow:ellipsis}.yext-chat .truncate,.yext-chat .whitespace-nowrap{white-space:nowrap}.yext-chat .whitespace-pre-wrap{white-space:pre-wrap}.yext-chat .break-words{overflow-wrap:break-word}.yext-chat .rounded-2xl{border-radius:1rem}.yext-chat .rounded-3xl{border-radius:1.5rem}.yext-chat .rounded-full{border-radius:9999px}.yext-chat .rounded-md{border-radius:.375rem}.yext-chat .rounded-xl{border-radius:.75rem}.yext-chat .rounded-b-3xl{border-bottom-right-radius:1.5rem;border-bottom-left-radius:1.5rem}.yext-chat .rounded-l-full{border-top-left-radius:9999px;border-bottom-left-radius:9999px}.yext-chat .rounded-t-3xl{border-top-left-radius:1.5rem;border-top-right-radius:1.5rem}.yext-chat .border{border-width:1px}.yext-chat .border-slate-300{--tw-border-opacity:1;border-color:rgb(203 213 225/var(--tw-border-opacity))}.yext-chat .bg-blue-600{--tw-bg-opacity:1;background-color:rgb(37 99 235/var(--tw-bg-opacity))}.yext-chat .bg-gray-700{--tw-bg-opacity:1;background-color:rgb(55 65 81/var(--tw-bg-opacity))}.yext-chat .bg-red-700{--tw-bg-opacity:1;background-color:rgb(185 28 28/var(--tw-bg-opacity))}.yext-chat .bg-slate-500{--tw-bg-opacity:1;background-color:rgb(100 116 139/var(--tw-bg-opacity))}.yext-chat .bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity))}.yext-chat .bg-gradient-to-br{background-image:linear-gradient(to bottom right,var(--tw-gradient-stops))}.yext-chat .bg-gradient-to-tr{background-image:linear-gradient(to top right,var(--tw-gradient-stops))}.yext-chat .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)}.yext-chat .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)}.yext-chat .to-blue-700{--tw-gradient-to:#1d4ed8 var(--tw-gradient-to-position)}.yext-chat .to-blue-800{--tw-gradient-to:#1e40af var(--tw-gradient-to-position)}.yext-chat .to-slate-100{--tw-gradient-to:#f1f5f9 var(--tw-gradient-to-position)}.yext-chat .stroke-2{stroke-width:2}.yext-chat .stroke-\[0\.2\]{stroke-width:.2}.yext-chat .p-1{padding:.25rem}.yext-chat .p-1\.5{padding:.375rem}.yext-chat .p-2{padding:.5rem}.yext-chat .p-2\.5{padding:.625rem}.yext-chat .p-3{padding:.75rem}.yext-chat .p-4{padding:1rem}.yext-chat .px-4{padding-left:1rem;padding-right:1rem}.yext-chat .py-3{padding-top:.75rem;padding-bottom:.75rem}.yext-chat .pl-4{padding-left:1rem}.yext-chat .pr-1{padding-right:.25rem}.yext-chat .pr-12{padding-right:3rem}.yext-chat .pr-3{padding-right:.75rem}.yext-chat .pr-8{padding-right:2rem}.yext-chat .text-\[10px\]{font-size:10px}.yext-chat .text-\[13px\]{font-size:13px}.yext-chat .text-sm{font-size:.875rem;line-height:1.25rem}.yext-chat .text-xl{font-size:1.25rem;line-height:1.75rem}.yext-chat .font-bold{font-weight:700}.yext-chat .font-medium{font-weight:500}.yext-chat .text-blue-600{--tw-text-opacity:1;color:rgb(37 99 235/var(--tw-text-opacity))}.yext-chat .text-blue-700{--tw-text-opacity:1;color:rgb(29 78 216/var(--tw-text-opacity))}.yext-chat .text-red-200{--tw-text-opacity:1;color:rgb(254 202 202/var(--tw-text-opacity))}.yext-chat .text-slate-400{--tw-text-opacity:1;color:rgb(148 163 184/var(--tw-text-opacity))}.yext-chat .text-slate-700{--tw-text-opacity:1;color:rgb(51 65 85/var(--tw-text-opacity))}.yext-chat .text-slate-900{--tw-text-opacity:1;color:rgb(15 23 42/var(--tw-text-opacity))}.yext-chat .text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity))}.yext-chat .opacity-0{opacity:0}.yext-chat .shadow-2xl{--tw-shadow:0 25px 50px -12px #00000040;--tw-shadow-colored:0 25px 50px -12px var(--tw-shadow-color)}.yext-chat .shadow-2xl,.yext-chat .shadow-xl{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.yext-chat .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)}.yext-chat .transition-all{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.yext-chat .duration-150,.yext-chat .transition-all{transition-duration:.15s}.yext-chat .duration-200{transition-duration:.2s}.yext-chat .duration-300{transition-duration:.3s}.yext-chat .\@container{container-type:inline-size}.yext-chat .placeholder\:text-\[13px\]::-moz-placeholder{font-size:13px}.yext-chat .placeholder\:text-\[13px\]::placeholder{font-size:13px}.yext-chat .first\:mt-4:first-child{margin-top:1rem}.yext-chat .hover\:-translate-y-2:hover{--tw-translate-y:-0.5rem}.yext-chat .hover\:-translate-y-2:hover,.yext-chat .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))}.yext-chat .hover\:scale-110:hover{--tw-scale-x:1.1;--tw-scale-y:1.1}.yext-chat .hover\:bg-blue-800:hover{--tw-bg-opacity:1;background-color:rgb(30 64 175/var(--tw-bg-opacity))}.yext-chat .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))}.yext-chat .disabled\:bg-slate-200:disabled{--tw-bg-opacity:1;background-color:rgb(226 232 240/var(--tw-bg-opacity))}.yext-chat .group:hover .group-hover\:opacity-100,.yext-chat .peer:hover~.peer-hover\:opacity-100{opacity:1}@container (min-width: 32rem){.yext-chat .\@lg\:m-1{margin:.25rem}.yext-chat .\@lg\:ml-0{margin-left:0}.yext-chat .\@lg\:flex-row{flex-direction:row}.yext-chat .\@lg\:flex-row-reverse{flex-direction:row-reverse}.yext-chat .\@lg\:items-center{align-items:center}.yext-chat .\@lg\:gap-x-2{-moz-column-gap:.5rem;column-gap:.5rem}}@container (min-width: 480px){.yext-chat .\@\[480px\]\:bottom-3\.5{bottom:.875rem}.yext-chat .\@\[480px\]\:text-\[13px\]{font-size:13px}.yext-chat .\@\[480px\]\:text-base{font-size:1rem;line-height:1.5rem}.yext-chat .placeholder\:\@\[480px\]\:text-base::-moz-placeholder{font-size:1rem;line-height:1.5rem}.yext-chat .placeholder\:\@\[480px\]\:text-base::placeholder{font-size:1rem;line-height:1.5rem}}@media (max-width:480px){.yext-chat .max-\[480px\]\:bottom-0{bottom:0}.yext-chat .max-\[480px\]\:right-0{right:0}.yext-chat .max-\[480px\]\:h-full{height:100%}.yext-chat .max-\[480px\]\:w-full{width:100%}.yext-chat .max-\[480px\]\:rounded-none{border-radius:0}}@media (min-width:1024px){.yext-chat .lg\:bottom-14{bottom:3.5rem}.yext-chat .lg\:right-10{right:2.5rem}.yext-chat .lg\:h-14{height:3.5rem}.yext-chat .lg\:h-16{height:4rem}.yext-chat .lg\:h-6{height:1.5rem}.yext-chat .lg\:h-\[40px\]{height:40px}.yext-chat .lg\:w-16{width:4rem}.yext-chat .lg\:w-6{width:1.5rem}.yext-chat .lg\:w-96{width:24rem}.yext-chat .lg\:w-\[40px\]{width:40px}.yext-chat .lg\:text-base{font-size:1rem;line-height:1.5rem}}
1	+ .yext-chat { width: 100%; height: 100%; } /! tailwindcss v3.3.2 \| MIT License \| https://tailwindcss.com/.yext-chat ,.yext-chat :after,.yext-chat :before{box-sizing:border-box;border:0 solid #e5e7eb}.yext-chat :after,.yext-chat :before{--tw-content:""}.yext-chat {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}.yext-chat {margin:0;line-height:inherit}.yext-chat hr{height:0;color:inherit;border-top-width:1px}.yext-chat abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}.yext-chat h1,.yext-chat h2,.yext-chat h3,.yext-chat h4,.yext-chat h5,.yext-chat h6{font-size:inherit;font-weight:inherit}.yext-chat a{color:inherit;text-decoration:inherit}.yext-chat b,.yext-chat strong{font-weight:bolder}.yext-chat code,.yext-chat kbd,.yext-chat pre,.yext-chat samp{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:1em}.yext-chat small{font-size:80%}.yext-chat sub,.yext-chat sup{font-size:75%;line-height:0;position:relative;vertical-align:initial}.yext-chat sub{bottom:-.25em}.yext-chat sup{top:-.5em}.yext-chat table{text-indent:0;border-color:inherit;border-collapse:collapse}.yext-chat button,.yext-chat input,.yext-chat optgroup,.yext-chat select,.yext-chat textarea{font-family:inherit;font-size:100%;font-weight:inherit;line-height:inherit;color:inherit;margin:0;padding:0}.yext-chat button,.yext-chat select{text-transform:none}.yext-chat [type=button],.yext-chat [type=reset],.yext-chat [type=submit],.yext-chat button{-webkit-appearance:button;background-color:initial;background-image:none}.yext-chat :-moz-focusring{outline:auto}.yext-chat :-moz-ui-invalid{box-shadow:none}.yext-chat progress{vertical-align:initial}.yext-chat ::-webkit-inner-spin-button,.yext-chat ::-webkit-outer-spin-button{height:auto}.yext-chat [type=search]{-webkit-appearance:textfield;outline-offset:-2px}.yext-chat ::-webkit-search-decoration{-webkit-appearance:none}.yext-chat ::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}.yext-chat summary{display:list-item}.yext-chat blockquote,.yext-chat dd,.yext-chat dl,.yext-chat figure,.yext-chat h1,.yext-chat h2,.yext-chat h3,.yext-chat h4,.yext-chat h5,.yext-chat h6,.yext-chat hr,.yext-chat p,.yext-chat pre{margin:0}.yext-chat fieldset{margin:0}.yext-chat fieldset,.yext-chat legend{padding:0}.yext-chat menu,.yext-chat ol,.yext-chat ul{list-style:none;margin:0;padding:0}.yext-chat textarea{resize:vertical}.yext-chat input::-moz-placeholder,.yext-chat textarea::-moz-placeholder{opacity:1;color:#9ca3af}.yext-chat input::placeholder,.yext-chat textarea::placeholder{opacity:1;color:#9ca3af}.yext-chat [role=button],.yext-chat button{cursor:pointer}.yext-chat :disabled{cursor:default}.yext-chat audio,.yext-chat canvas,.yext-chat embed,.yext-chat iframe,.yext-chat img,.yext-chat object,.yext-chat svg,.yext-chat video{display:block;vertical-align:middle}.yext-chat img,.yext-chat video{max-width:100%;height:auto}.yext-chat [hidden]{display:none}.yext-chat ,.yext-chat ::backdrop,.yext-chat :after,.yext-chat :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: }.yext-chat .container{width:100%}@media (min-width:640px){.yext-chat .container{max-width:640px}}@media (min-width:768px){.yext-chat .container{max-width:768px}}@media (min-width:1024px){.yext-chat .container{max-width:1024px}}@media (min-width:1280px){.yext-chat .container{max-width:1280px}}@media (min-width:1536px){.yext-chat .container{max-width:1536px}}.yext-chat .prose{color:var(--tw-prose-body);max-width:65ch}.yext-chat .prose :where(p):not(:where([class~=not-prose] )){margin-top:1.25em;margin-bottom:1.25em}.yext-chat .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}.yext-chat .prose :where(a):not(:where([class~=not-prose] )){color:var(--tw-prose-links);text-decoration:underline;font-weight:500}.yext-chat .prose :where(strong):not(:where([class~=not-prose] )){color:var(--tw-prose-bold);font-weight:600}.yext-chat .prose :where(a strong):not(:where([class~=not-prose] )){color:inherit}.yext-chat .prose :where(blockquote strong):not(:where([class~=not-prose] )){color:inherit}.yext-chat .prose :where(thead th strong):not(:where([class~=not-prose] )){color:inherit}.yext-chat .prose :where(ol):not(:where([class~=not-prose] )){list-style-type:decimal;margin-top:1.25em;margin-bottom:1.25em;padding-left:1.625em}.yext-chat .prose :where(ol[type=A]):not(:where([class~=not-prose] )){list-style-type:upper-alpha}.yext-chat .prose :where(ol[type=a]):not(:where([class~=not-prose] )){list-style-type:lower-alpha}.yext-chat .prose :where(ol[type=A s]):not(:where([class~=not-prose] )){list-style-type:upper-alpha}.yext-chat .prose :where(ol[type=a s]):not(:where([class~=not-prose] )){list-style-type:lower-alpha}.yext-chat .prose :where(ol[type=I]):not(:where([class~=not-prose] )){list-style-type:upper-roman}.yext-chat .prose :where(ol[type=i]):not(:where([class~=not-prose] )){list-style-type:lower-roman}.yext-chat .prose :where(ol[type=I s]):not(:where([class~=not-prose] )){list-style-type:upper-roman}.yext-chat .prose :where(ol[type=i s]):not(:where([class~=not-prose] )){list-style-type:lower-roman}.yext-chat .prose :where(ol[type="1"]):not(:where([class~=not-prose] )){list-style-type:decimal}.yext-chat .prose :where(ul):not(:where([class~=not-prose] )){list-style-type:disc;margin-top:1.25em;margin-bottom:1.25em;padding-left:1.625em}.yext-chat .prose :where(ol>li):not(:where([class~=not-prose] ))::marker{font-weight:400;color:var(--tw-prose-counters)}.yext-chat .prose :where(ul>li):not(:where([class~=not-prose] ))::marker{color:var(--tw-prose-bullets)}.yext-chat .prose :where(hr):not(:where([class~=not-prose] )){border-color:var(--tw-prose-hr);border-top-width:1px;margin-top:3em;margin-bottom:3em}.yext-chat .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}.yext-chat .prose :where(blockquote p:first-of-type):not(:where([class~=not-prose] )):before{content:open-quote}.yext-chat .prose :where(blockquote p:last-of-type):not(:where([class~=not-prose] )):after{content:close-quote}.yext-chat .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}.yext-chat .prose :where(h1 strong):not(:where([class~=not-prose] )){font-weight:900;color:inherit}.yext-chat .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}.yext-chat .prose :where(h2 strong):not(:where([class~=not-prose] )){font-weight:800;color:inherit}.yext-chat .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}.yext-chat .prose :where(h3 strong):not(:where([class~=not-prose] )){font-weight:700;color:inherit}.yext-chat .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}.yext-chat .prose :where(h4 strong):not(:where([class~=not-prose] )){font-weight:700;color:inherit}.yext-chat .prose :where(img):not(:where([class~=not-prose] )){margin-top:2em;margin-bottom:2em}.yext-chat .prose :where(figure>):not(:where([class~=not-prose] )){margin-top:0;margin-bottom:0}.yext-chat .prose :where(figcaption):not(:where([class~=not-prose] )){color:var(--tw-prose-captions);font-size:.875em;line-height:1.4285714;margin-top:.8571429em}.yext-chat .prose :where(code):not(:where([class~=not-prose] )){color:var(--tw-prose-code);font-weight:600;font-size:.875em}.yext-chat .prose :where(code):not(:where([class~=not-prose] )):before{content:"`"}.yext-chat .prose :where(code):not(:where([class~=not-prose] )):after{content:"`"}.yext-chat .prose :where(a code):not(:where([class~=not-prose] )){color:inherit}.yext-chat .prose :where(h1 code):not(:where([class~=not-prose] )){color:inherit}.yext-chat .prose :where(h2 code):not(:where([class~=not-prose] )){color:inherit;font-size:.875em}.yext-chat .prose :where(h3 code):not(:where([class~=not-prose] )){color:inherit;font-size:.9em}.yext-chat .prose :where(h4 code):not(:where([class~=not-prose] )){color:inherit}.yext-chat .prose :where(blockquote code):not(:where([class~=not-prose] )){color:inherit}.yext-chat .prose :where(thead th code):not(:where([class~=not-prose] )){color:inherit}.yext-chat .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}.yext-chat .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}.yext-chat .prose :where(pre code):not(:where([class~=not-prose] )):before{content:none}.yext-chat .prose :where(pre code):not(:where([class~=not-prose] )):after{content:none}.yext-chat .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}.yext-chat .prose :where(thead):not(:where([class~=not-prose] )){border-bottom-width:1px;border-bottom-color:var(--tw-prose-th-borders)}.yext-chat .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}.yext-chat .prose :where(tbody tr):not(:where([class~=not-prose] )){border-bottom-width:1px;border-bottom-color:var(--tw-prose-td-borders)}.yext-chat .prose :where(tbody tr:last-child):not(:where([class~=not-prose] )){border-bottom-width:0}.yext-chat .prose :where(tbody td):not(:where([class~=not-prose] )){vertical-align:initial}.yext-chat .prose :where(tfoot):not(:where([class~=not-prose] )){border-top-width:1px;border-top-color:var(--tw-prose-th-borders)}.yext-chat .prose :where(tfoot td):not(:where([class~=not-prose] )){vertical-align:top}.yext-chat .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}.yext-chat .prose :where(video):not(:where([class~=not-prose] )){margin-top:2em;margin-bottom:2em}.yext-chat .prose :where(figure):not(:where([class~=not-prose] )){margin-top:2em;margin-bottom:2em}.yext-chat .prose :where(li):not(:where([class~=not-prose] )){margin-top:.5em;margin-bottom:.5em}.yext-chat .prose :where(ol>li):not(:where([class~=not-prose] )){padding-left:.375em}.yext-chat .prose :where(ul>li):not(:where([class~=not-prose] )){padding-left:.375em}.yext-chat .prose :where(.prose>ul>li p):not(:where([class~=not-prose] )){margin-top:.75em;margin-bottom:.75em}.yext-chat .prose :where(.prose>ul>li>:first-child):not(:where([class~=not-prose] )){margin-top:1.25em}.yext-chat .prose :where(.prose>ul>li>:last-child):not(:where([class~=not-prose] )){margin-bottom:1.25em}.yext-chat .prose :where(.prose>ol>li>:first-child):not(:where([class~=not-prose] )){margin-top:1.25em}.yext-chat .prose :where(.prose>ol>li>:last-child):not(:where([class~=not-prose] )){margin-bottom:1.25em}.yext-chat .prose :where(ul ul,ul ol,ol ul,ol ol):not(:where([class~=not-prose] )){margin-top:.75em;margin-bottom:.75em}.yext-chat .prose :where(hr+):not(:where([class~=not-prose] )){margin-top:0}.yext-chat .prose :where(h2+):not(:where([class~=not-prose] )){margin-top:0}.yext-chat .prose :where(h3+):not(:where([class~=not-prose] )){margin-top:0}.yext-chat .prose :where(h4+):not(:where([class~=not-prose] )){margin-top:0}.yext-chat .prose :where(thead th:first-child):not(:where([class~=not-prose] )){padding-left:0}.yext-chat .prose :where(thead th:last-child):not(:where([class~=not-prose] )){padding-right:0}.yext-chat .prose :where(tbody td,tfoot td):not(:where([class~=not-prose] )){padding:.5714286em}.yext-chat .prose :where(tbody td:first-child,tfoot td:first-child):not(:where([class~=not-prose] )){padding-left:0}.yext-chat .prose :where(tbody td:last-child,tfoot td:last-child):not(:where([class~=not-prose] )){padding-right:0}.yext-chat .prose :where(.prose>:first-child):not(:where([class~=not-prose] )){margin-top:0}.yext-chat .prose :where(.prose>:last-child):not(:where([class~=not-prose] )){margin-bottom:0}.yext-chat .invisible{visibility:hidden}.yext-chat .fixed{position:fixed}.yext-chat .absolute{position:absolute}.yext-chat .relative{position:relative}.yext-chat .-right-1{right:-.25rem}.yext-chat .-top-3{top:-.75rem}.yext-chat .bottom-2{bottom:.5rem}.yext-chat .bottom-2\.5{bottom:.625rem}.yext-chat .bottom-6{bottom:1.5rem}.yext-chat .right-4{right:1rem}.yext-chat .top-0{top:0}.yext-chat .z-50{z-index:50}.yext-chat .my-0{margin-top:0;margin-bottom:0}.yext-chat .my-0\.5{margin-top:.125rem;margin-bottom:.125rem}.yext-chat .-mr-8{margin-right:-2rem}.yext-chat .mb-3{margin-bottom:.75rem}.yext-chat .ml-4{margin-left:1rem}.yext-chat .ml-auto{margin-left:auto}.yext-chat .mt-4{margin-top:1rem}.yext-chat .mt-auto{margin-top:auto}.yext-chat .line-clamp-1{-webkit-line-clamp:1}.yext-chat .line-clamp-1,.yext-chat .line-clamp-2{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical}.yext-chat .line-clamp-2{-webkit-line-clamp:2}.yext-chat .flex{display:flex}.yext-chat .hidden{display:none}.yext-chat .h-10{height:2.5rem}.yext-chat .h-12{height:3rem}.yext-chat .h-2{height:.5rem}.yext-chat .h-4{height:1rem}.yext-chat .h-5{height:1.25rem}.yext-chat .h-6{height:1.5rem}.yext-chat .h-8{height:2rem}.yext-chat .h-\[22px\]{height:22px}.yext-chat .h-\[26px\]{height:26px}.yext-chat .h-\[28px\]{height:28px}.yext-chat .h-\[75vh\]{height:75vh}.yext-chat .h-fit{height:-moz-fit-content;height:fit-content}.yext-chat .h-full{height:100%}.yext-chat .w-12{width:3rem}.yext-chat .w-2{width:.5rem}.yext-chat .w-4{width:1rem}.yext-chat .w-5{width:1.25rem}.yext-chat .w-6{width:1.5rem}.yext-chat .w-60{width:15rem}.yext-chat .w-8{width:2rem}.yext-chat .w-80{width:20rem}.yext-chat .w-\[22px\]{width:22px}.yext-chat .w-\[26px\]{width:26px}.yext-chat .w-\[28px\]{width:28px}.yext-chat .w-fit{width:-moz-fit-content;width:fit-content}.yext-chat .w-full{width:100%}.yext-chat .max-w-\[80\%\]{max-width:80%}.yext-chat .shrink-0{flex-shrink:0}.yext-chat .translate-y-0{--tw-translate-y:0px}.yext-chat .translate-y-0,.yext-chat .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))}.yext-chat .translate-y-\[20\%\]{--tw-translate-y:20%}.yext-chat .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))}.yext-chat .animate-\[bounce_1s_infinite\]{animation:bounce 1s infinite}.yext-chat .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)}}.yext-chat .animate-\[bounce_1s_infinite_0\.6s\]{animation:bounce 1s .6s infinite}@keyframes spin{to{transform:rotate(1turn)}}.yext-chat .animate-\[spin_0\.3s_linear\]{animation:spin .3s linear}@keyframes expand-left{0%{margin-left:100%}to{margin-left:0}}.yext-chat .animate-expand-left{animation:expand-left .5s}@keyframes fade-in{0%{opacity:0}to{opacity:1}}.yext-chat .animate-fade-in{animation:fade-in .4s}@keyframes heartbeat{0%{transform:scale(1)}80%{transform:scale(1)}90%{transform:scale(1.1)}to{transform:scale(1)}}.yext-chat .animate-heartbeat{animation:heartbeat 2s ease-out infinite}.yext-chat .cursor-pointer{cursor:pointer}.yext-chat .resize-none{resize:none}.yext-chat .flex-row{flex-direction:row}.yext-chat .flex-col{flex-direction:column}.yext-chat .flex-wrap{flex-wrap:wrap}.yext-chat .items-center{align-items:center}.yext-chat .justify-center{justify-content:center}.yext-chat .justify-between{justify-content:space-between}.yext-chat .gap-1{gap:.25rem}.yext-chat .gap-2{gap:.5rem}.yext-chat .gap-x-1{-moz-column-gap:.25rem;column-gap:.25rem}.yext-chat .gap-x-2{-moz-column-gap:.5rem;column-gap:.5rem}.yext-chat .gap-x-2\.5{-moz-column-gap:.625rem;column-gap:.625rem}.yext-chat .gap-y-1{row-gap:.25rem}.yext-chat .overflow-auto{overflow:auto}.yext-chat .overflow-hidden{overflow:hidden}.yext-chat .overflow-x-auto{overflow-x:auto}.yext-chat .truncate{overflow:hidden;text-overflow:ellipsis}.yext-chat .truncate,.yext-chat .whitespace-nowrap{white-space:nowrap}.yext-chat .whitespace-pre-wrap{white-space:pre-wrap}.yext-chat .break-words{overflow-wrap:break-word}.yext-chat .rounded-2xl{border-radius:1rem}.yext-chat .rounded-3xl{border-radius:1.5rem}.yext-chat .rounded-full{border-radius:9999px}.yext-chat .rounded-md{border-radius:.375rem}.yext-chat .rounded-xl{border-radius:.75rem}.yext-chat .rounded-b-3xl{border-bottom-right-radius:1.5rem;border-bottom-left-radius:1.5rem}.yext-chat .rounded-l-full{border-top-left-radius:9999px;border-bottom-left-radius:9999px}.yext-chat .rounded-t-3xl{border-top-left-radius:1.5rem;border-top-right-radius:1.5rem}.yext-chat .border{border-width:1px}.yext-chat .border-blue-700{--tw-border-opacity:1;border-color:rgb(29 78 216/var(--tw-border-opacity))}.yext-chat .border-slate-300{--tw-border-opacity:1;border-color:rgb(203 213 225/var(--tw-border-opacity))}.yext-chat .bg-blue-600{--tw-bg-opacity:1;background-color:rgb(37 99 235/var(--tw-bg-opacity))}.yext-chat .bg-gray-700{--tw-bg-opacity:1;background-color:rgb(55 65 81/var(--tw-bg-opacity))}.yext-chat .bg-red-700{--tw-bg-opacity:1;background-color:rgb(185 28 28/var(--tw-bg-opacity))}.yext-chat .bg-slate-500{--tw-bg-opacity:1;background-color:rgb(100 116 139/var(--tw-bg-opacity))}.yext-chat .bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity))}.yext-chat .bg-gradient-to-br{background-image:linear-gradient(to bottom right,var(--tw-gradient-stops))}.yext-chat .bg-gradient-to-tr{background-image:linear-gradient(to top right,var(--tw-gradient-stops))}.yext-chat .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)}.yext-chat .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)}.yext-chat .to-blue-700{--tw-gradient-to:#1d4ed8 var(--tw-gradient-to-position)}.yext-chat .to-blue-800{--tw-gradient-to:#1e40af var(--tw-gradient-to-position)}.yext-chat .to-slate-100{--tw-gradient-to:#f1f5f9 var(--tw-gradient-to-position)}.yext-chat .stroke-2{stroke-width:2}.yext-chat .stroke-\[0\.2\]{stroke-width:.2}.yext-chat .p-1{padding:.25rem}.yext-chat .p-1\.5{padding:.375rem}.yext-chat .p-2{padding:.5rem}.yext-chat .p-2\.5{padding:.625rem}.yext-chat .p-3{padding:.75rem}.yext-chat .p-4{padding:1rem}.yext-chat .px-2{padding-left:.5rem;padding-right:.5rem}.yext-chat .px-4{padding-left:1rem;padding-right:1rem}.yext-chat .py-1{padding-top:.25rem;padding-bottom:.25rem}.yext-chat .py-3{padding-top:.75rem;padding-bottom:.75rem}.yext-chat .pl-4{padding-left:1rem}.yext-chat .pr-1{padding-right:.25rem}.yext-chat .pr-12{padding-right:3rem}.yext-chat .pr-3{padding-right:.75rem}.yext-chat .pr-8{padding-right:2rem}.yext-chat .text-\[10px\]{font-size:10px}.yext-chat .text-\[13px\]{font-size:13px}.yext-chat .text-sm{font-size:.875rem;line-height:1.25rem}.yext-chat .text-xl{font-size:1.25rem;line-height:1.75rem}.yext-chat .font-bold{font-weight:700}.yext-chat .font-medium{font-weight:500}.yext-chat .text-blue-600{--tw-text-opacity:1;color:rgb(37 99 235/var(--tw-text-opacity))}.yext-chat .text-blue-700{--tw-text-opacity:1;color:rgb(29 78 216/var(--tw-text-opacity))}.yext-chat .text-red-200{--tw-text-opacity:1;color:rgb(254 202 202/var(--tw-text-opacity))}.yext-chat .text-slate-400{--tw-text-opacity:1;color:rgb(148 163 184/var(--tw-text-opacity))}.yext-chat .text-slate-700{--tw-text-opacity:1;color:rgb(51 65 85/var(--tw-text-opacity))}.yext-chat .text-slate-900{--tw-text-opacity:1;color:rgb(15 23 42/var(--tw-text-opacity))}.yext-chat .text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity))}.yext-chat .opacity-0{opacity:0}.yext-chat .shadow-2xl{--tw-shadow:0 25px 50px -12px #00000040;--tw-shadow-colored:0 25px 50px -12px var(--tw-shadow-color)}.yext-chat .shadow-2xl,.yext-chat .shadow-xl{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.yext-chat .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)}.yext-chat .transition-all{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.yext-chat .duration-150,.yext-chat .transition-all{transition-duration:.15s}.yext-chat .duration-200{transition-duration:.2s}.yext-chat .duration-300{transition-duration:.3s}.yext-chat .\@container{container-type:inline-size}.yext-chat .placeholder\:text-\[13px\]::-moz-placeholder{font-size:13px}.yext-chat .placeholder\:text-\[13px\]::placeholder{font-size:13px}.yext-chat .first\:mt-4:first-child{margin-top:1rem}.yext-chat .hover\:-translate-y-2:hover{--tw-translate-y:-0.5rem}.yext-chat .hover\:-translate-y-2:hover,.yext-chat .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))}.yext-chat .hover\:scale-110:hover{--tw-scale-x:1.1;--tw-scale-y:1.1}.yext-chat .hover\:cursor-pointer:hover{cursor:pointer}.yext-chat .hover\:bg-blue-800:hover{--tw-bg-opacity:1;background-color:rgb(30 64 175/var(--tw-bg-opacity))}.yext-chat .hover\:bg-slate-300:hover{--tw-bg-opacity:1;background-color:rgb(203 213 225/var(--tw-bg-opacity))}.yext-chat .hover\:underline:hover{text-decoration-line:underline}.yext-chat .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))}.yext-chat .disabled\:bg-slate-200:disabled{--tw-bg-opacity:1;background-color:rgb(226 232 240/var(--tw-bg-opacity))}.yext-chat .group:hover .group-hover\:opacity-100,.yext-chat .peer:hover~.peer-hover\:opacity-100{opacity:1}@container (min-width: 32rem){.yext-chat .\@lg\:m-1{margin:.25rem}.yext-chat .\@lg\:ml-0{margin-left:0}.yext-chat .\@lg\:flex-row{flex-direction:row}.yext-chat .\@lg\:flex-row-reverse{flex-direction:row-reverse}.yext-chat .\@lg\:items-center{align-items:center}.yext-chat .\@lg\:gap-x-2{-moz-column-gap:.5rem;column-gap:.5rem}}@container (min-width: 480px){.yext-chat .\@\[480px\]\:bottom-3\.5{bottom:.875rem}.yext-chat .\@\[480px\]\:text-\[13px\]{font-size:13px}.yext-chat .\@\[480px\]\:text-base{font-size:1rem;line-height:1.5rem}.yext-chat .placeholder\:\@\[480px\]\:text-base::-moz-placeholder{font-size:1rem;line-height:1.5rem}.yext-chat .placeholder\:\@\[480px\]\:text-base::placeholder{font-size:1rem;line-height:1.5rem}}@media (max-width:480px){.yext-chat .max-\[480px\]\:bottom-0{bottom:0}.yext-chat .max-\[480px\]\:right-0{right:0}.yext-chat .max-\[480px\]\:h-full{height:100%}.yext-chat .max-\[480px\]\:w-full{width:100%}.yext-chat .max-\[480px\]\:rounded-none{border-radius:0}}@media (min-width:1024px){.yext-chat .lg\:bottom-14{bottom:3.5rem}.yext-chat .lg\:right-10{right:2.5rem}.yext-chat .lg\:h-14{height:3.5rem}.yext-chat .lg\:h-16{height:4rem}.yext-chat .lg\:h-6{height:1.5rem}.yext-chat .lg\:h-\[40px\]{height:40px}.yext-chat .lg\:w-16{width:4rem}.yext-chat .lg\:w-6{width:1.5rem}.yext-chat .lg\:w-96{width:24rem}.yext-chat .lg\:w-\[40px\]{width:40px}.yext-chat .lg\:text-base{font-size:1rem;line-height:1.5rem}}

package/lib/commonjs/package.json.js CHANGED Viewed

@@ -1,6 +1,6 @@
 'use strict';
-var version = "0.8.1-alpha.53.2";
+var version = "0.8.2";
 exports.version = version;
 //# sourceMappingURL=package.json.js.map

package/lib/commonjs/src/components/ChatInput.js CHANGED Viewed

@@ -4,8 +4,8 @@ var React = require('react');
 var chatHeadlessReact = require('@yext/chat-headless-react');
 var Arrow = require('../icons/Arrow.js');
 var useComposedCssClasses = require('../hooks/useComposedCssClasses.js');
-var useDefaultHandleApiError = require('../hooks/useDefaultHandleApiError.js');
 var TextareaAutosize = require('react-textarea-autosize');
+var useDefaultHandleApiError = require('../hooks/useDefaultHandleApiError.js');
 var withStylelessCssClasses = require('../utils/withStylelessCssClasses.js');
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }

package/lib/commonjs/src/components/ChatPanel.d.ts CHANGED Viewed

@@ -1,6 +1,7 @@
-import React from "react";
+import React, { ReactNode } from "react";
 import { MessageBubbleCssClasses, MessageBubbleProps } from "./MessageBubble";
 import { ChatInputCssClasses, ChatInputProps } from "./ChatInput";
+import { MessageSuggestionCssClasses } from "./MessageSuggestions";
 /**
  * The CSS class interface for the {@link ChatPanel} component.
  *
@@ -13,6 +14,7 @@ export interface ChatPanelCssClasses {
     inputContainer?: string;
     inputCssClasses?: ChatInputCssClasses;
     messageBubbleCssClasses?: MessageBubbleCssClasses;
+    messageSuggestionClasses?: MessageSuggestionCssClasses;
 }
 /**
  * The props for the {@link ChatPanel} component.
@@ -20,14 +22,17 @@ export interface ChatPanelCssClasses {
  * @public
  */
 export interface ChatPanelProps extends Omit<MessageBubbleProps, "customCssClasses" | "message">, Omit<ChatInputProps, "customCssClasses"> {
-    /** A custom header component to render at the top of the panel. */
-    header?: JSX.Element;
-    /** A custom input component to render at the bottom of the panel. */
-    input?: JSX.Element;
+    /** A header to render at the top of the panel. */
+    header?: ReactNode;
     /**
      * CSS classes for customizing the component styling.
      */
     customCssClasses?: ChatPanelCssClasses;
+    /**
+     * A set of pre-written initial messages that the user
+     * can click on instead of typing their own.
+     */
+    messageSuggestions?: string[];
 }
 /**
  * A component that renders a full panel for chat bot interactions. This includes

package/lib/commonjs/src/components/ChatPanel.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ChatPanel.d.ts","sourceRoot":"","sources":["../../../../src/components/ChatPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,~~KAAoB~~,MAAM,OAAO,CAAC;~~AAEzC~~,OAAO,EAEL,uBAAuB,EACvB,kBAAkB,EACnB,MAAM,iBAAiB,CAAC;AACzB,OAAO,EAAa,mBAAmB,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;~~AAU7E~~;;;;GAIG;AACH,MAAM,WAAW,mBAAmB;IAClC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,uBAAuB,CAAC,EAAE,MAAM,CAAC;IACjC,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,eAAe,CAAC,EAAE,mBAAmB,CAAC;IACtC,uBAAuB,CAAC,EAAE,uBAAuB,CAAC;~~CACnD~~;AAeD;;;;GAIG;AACH,MAAM,WAAW,cACf,SAAQ,IAAI,CAAC,kBAAkB,EAAE,kBAAkB,GAAG,SAAS,CAAC,EAC9D,IAAI,CAAC,cAAc,EAAE,kBAAkB,CAAC;IAC1C,~~mEAAmE~~;~~IACnE~~,MAAM,CAAC,EAAE,~~GAAG~~,CAAC~~,OAAO,CAAC~~;~~IACrB,qEAAqE~~;~~IACrE~~,~~KAAK~~,CAAC,EAAE,~~GAAG~~,CAAC~~,OAAO,CAAC~~;~~IACpB;;OAEG~~;IACH,~~gBAAgB~~,CAAC,EAAE,~~mBAAmB~~,CAAC;~~CACxC~~;AAED;;;;;;;;GAQG;AACH,wBAAgB,SAAS,CAAC,KAAK,EAAE,cAAc,~~qBAuC9C~~"}
1	+ {"version":3,"file":"ChatPanel.d.ts","sourceRoot":"","sources":["../../../../src/components/ChatPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EACZ,SAAS,EAKV,MAAM,OAAO,CAAC;AAEf,OAAO,EAEL,uBAAuB,EACvB,kBAAkB,EACnB,MAAM,iBAAiB,CAAC;AACzB,OAAO,EAAa,mBAAmB,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAM7E,OAAO,EACL,2BAA2B,EAE5B,MAAM,sBAAsB,CAAC;AAE9B;;;;GAIG;AACH,MAAM,WAAW,mBAAmB;IAClC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,uBAAuB,CAAC,EAAE,MAAM,CAAC;IACjC,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,eAAe,CAAC,EAAE,mBAAmB,CAAC;IACtC,uBAAuB,CAAC,EAAE,uBAAuB,CAAC;IAClD,wBAAwB,CAAC,EAAE,2BAA2B,CAAC;CACxD;AAeD;;;;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,SAAS,CAAC;IACnB;;OAEG;IACH,gBAAgB,CAAC,EAAE,mBAAmB,CAAC;IACvC;;;OAGG;IACH,kBAAkB,CAAC,EAAE,MAAM,EAAE,CAAC;CAC/B;AAED;;;;;;;;GAQG;AACH,wBAAgB,SAAS,CAAC,KAAK,EAAE,cAAc,qBAoF9C"}

package/lib/commonjs/src/components/ChatPanel.js CHANGED Viewed

@@ -6,10 +6,10 @@ var MessageBubble = require('./MessageBubble.js');
 var ChatInput = require('./ChatInput.js');
 var LoadingDots = require('./LoadingDots.js');
 var useComposedCssClasses = require('../hooks/useComposedCssClasses.js');
-var useFetchInitialMessage = require('../hooks/useFetchInitialMessage.js');
 var useReportAnalyticsEvent = require('../hooks/useReportAnalyticsEvent.js');
-var useScrollToLastMessage = require('../hooks/useScrollToLastMessage.js');
 var withStylelessCssClasses = require('../utils/withStylelessCssClasses.js');
+var useFetchInitialMessage = require('../hooks/useFetchInitialMessage.js');
+var MessageSuggestions = require('./MessageSuggestions.js');
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
@@ -34,27 +34,60 @@ const builtInCssClasses = withStylelessCssClasses.withStylelessCssClasses("Panel
  * @param props - {@link ChatPanelProps}
  */
 function ChatPanel(props) {
-    const { header, input, customCssClasses, stream, handleError } = props;
+    const { header, customCssClasses, stream, handleError, messageSuggestions } = props;
     const messages = chatHeadlessReact.useChatState((state) => state.conversation.messages);
     const loading = chatHeadlessReact.useChatState((state) => state.conversation.isLoading);
     const cssClasses = useComposedCssClasses.useComposedCssClasses(builtInCssClasses, customCssClasses);
     const reportAnalyticsEvent = useReportAnalyticsEvent.useReportAnalyticsEvent();
     useFetchInitialMessage.useFetchInitialMessage(handleError, stream);
-    const [messagesContainerRef, setMessageRef] = useScrollToLastMessage.useScrollToLastMessage();
     React.useEffect(() => {
         reportAnalyticsEvent({
             action: "CHAT_IMPRESSION",
         });
     }, [reportAnalyticsEvent]);
+    const suggestions = React.useMemo(() => {
+        if (messages.length === 0 ||
+            (messages.length === 1 && messages[0].source === "BOT")) {
+            return messageSuggestions;
+        }
+        // TODO: Chat API will send suggestions in the message notes eventually; add that here. [CLIP-852]
+        return null;
+    }, [messages, messageSuggestions]);
+    const messagesRef = React.useRef([]);
+    const messagesContainer = React.useRef(null);
+    // Handle scrolling when messages change
+    React.useEffect(() => {
+        let scrollTop = 0;
+        messagesRef.current = messagesRef.current.slice(0, messages.length);
+        // Sums up scroll heights of all messages except the last one
+        if (messagesRef?.current.length > 1) {
+            scrollTop = messagesRef.current
+                .slice(0, -1)
+                .map((elem, _) => elem?.scrollHeight ?? 0)
+                .reduce((total, height) => total + height);
+        }
+        // Scroll to the top of the last message
+        messagesContainer.current?.scroll({
+            top: scrollTop,
+            behavior: "smooth",
+        });
+    }, [messages]);
+    const setMessagesRef = React.useCallback((index) => {
+        if (!messagesRef?.current)
+            return null;
+        return (message) => (messagesRef.current[index] = message);
+    }, []);
     return (React__default.default.createElement("div", { className: "yext-chat w-full h-full" },
         React__default.default.createElement("div", { className: cssClasses.container },
             header,
             React__default.default.createElement("div", { className: cssClasses.messagesScrollContainer },
-                React__default.default.createElement("div", { ref: messagesContainerRef, className: cssClasses.messagesContainer },
-                    messages.map((message, index) => (React__default.default.createElement("div", { key: index, ref: setMessageRef(index) },
+                React__default.default.createElement("div", { ref: messagesContainer, className: cssClasses.messagesContainer },
+                    messages.map((message, index) => (React__default.default.createElement("div", { key: index, ref: setMessagesRef(index) },
                         React__default.default.createElement(MessageBubble.MessageBubble, { ...props, customCssClasses: cssClasses.messageBubbleCssClasses, message: message })))),
-                    loading && React__default.default.createElement(LoadingDots.LoadingDots, null))),
-            React__default.default.createElement("div", { className: cssClasses.inputContainer }, input ?? React__default.default.createElement(ChatInput.ChatInput, { ...props, customCssClasses: cssClasses.inputCssClasses })))));
+                    loading && React__default.default.createElement(LoadingDots.LoadingDots, null),
+                    suggestions && (React__default.default.createElement(MessageSuggestions.MessageSuggestions, { suggestions: suggestions, customCssClasses: cssClasses.messageSuggestionClasses })))),
+            React__default.default.createElement("div", { className: cssClasses.inputContainer },
+                React__default.default.createElement(ChatInput.ChatInput, { ...props, customCssClasses: cssClasses.inputCssClasses })))));
 }
 exports.ChatPanel = ChatPanel;

package/lib/commonjs/src/components/ChatPanel.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ChatPanel.js","sources":["../../../../src/components/ChatPanel.tsx"],"sourcesContent":["import React, { useEffect } from \"react\";\nimport { useChatState } from \"@yext/chat-headless-react\";\nimport {\n MessageBubble,\n MessageBubbleCssClasses,\n MessageBubbleProps,\n} from \"./MessageBubble\";\nimport { ChatInput, ChatInputCssClasses, ChatInputProps } from \"./ChatInput\";\nimport { LoadingDots } from \"./LoadingDots\";\nimport {\n useComposedCssClasses~~,\n useReportAnalyticsEvent,\n useFetchInitialMessage,\n useScrollToLastMessage,\n~~ } from \"../hooks\";\nimport { withStylelessCssClasses } from \"../utils/withStylelessCssClasses\";\n\n/*\n The CSS class interface for the {@link ChatPanel} component.\n \n @public\n /\nexport interface ChatPanelCssClasses {\n container?: string;\n messagesContainer?: string;\n messagesScrollContainer?: string;\n inputContainer?: string;\n inputCssClasses?: ChatInputCssClasses;\n messageBubbleCssClasses?: MessageBubbleCssClasses;\n}\n\nconst builtInCssClasses: ChatPanelCssClasses = withStylelessCssClasses(\n \"Panel\",\n {\n container: \"h-full w-full flex flex-col relative shadow-2xl bg-white\",\n messagesScrollContainer: \"flex flex-col mt-auto overflow-hidden\",\n messagesContainer: \"flex flex-col gap-y-1 px-4 overflow-auto\",\n inputContainer: \"w-full p-4\",\n messageBubbleCssClasses: {\n topContainer: \"first:mt-4\",\n },\n }\n);\n\n/\n The props for the {@link ChatPanel} component.\n \n @public\n /\nexport interface ChatPanelProps\n extends Omit<MessageBubbleProps, \"customCssClasses\" \| \"message\">,\n Omit<ChatInputProps, \"customCssClasses\"> {\n /* A ~~custom~~ header ~~component~~ to render at the top of the panel. /\n header?: ~~JSX.Element~~;\n /* A ~~custom~~ ~~input~~ ~~component~~ ~~to render at~~ the ~~bottom~~ ~~of the panel.~~ /\n ~~input~~?: ~~JSX.Element~~;\n /\n ~~CSS~~ ~~classes~~ ~~for~~ ~~customizing~~ the ~~component~~ ~~styling~~.\n /\n ~~customCssClasses~~?: ~~ChatPanelCssClasses~~;\n}\n\n/\n A component that renders a full panel for chat bot interactions. This includes\n * the message bubbles for the conversation, input box with send button, and header\n * (if provided).\n \n @public\n \n @param props - {@link ChatPanelProps}\n */\nexport function ChatPanel(props: ChatPanelProps) {\n const { header, ~~input,~~ customCssClasses, stream, handleError } = props;\n const messages = useChatState((state) => state.conversation.messages);\n const loading = useChatState((state) => state.conversation.isLoading);\n const cssClasses = useComposedCssClasses(builtInCssClasses, customCssClasses);\n const reportAnalyticsEvent = useReportAnalyticsEvent();\n useFetchInitialMessage(handleError, stream);\n const [~~messagesContainerRef~~, ~~setMessageRef~~] = ~~useScrollToLastMessage~~();\n\n useEffect(() => {\n ~~reportAnalyticsEvent~~({\n ~~action~~: \"~~CHAT_IMPRESSION~~\",\n });\n }, [~~reportAnalyticsEvent~~]);\n\n return (\n <div className=\"yext-chat w-full h-full\">\n <div className={cssClasses.container}>\n {header}\n <div className={cssClasses.messagesScrollContainer}>\n <div ref={~~messagesContainerRef~~} className={cssClasses.messagesContainer}>\n {messages.map((message, index) => (\n <div key={index} ref={~~setMessageRef~~(index)}>\n <MessageBubble\n {...props}\n customCssClasses={cssClasses.messageBubbleCssClasses}\n message={message}\n />\n </div>\n ))}\n {loading && <LoadingDots />}\n </div>\n </div>\n <div className={cssClasses.inputContainer}>\n ~~{input ??~~ <ChatInput {...props} customCssClasses={cssClasses.inputCssClasses} ~~/>}\~~n </div>\n </div>\n </div>\n );\n}\n"],"names":["withStylelessCssClasses","useChatState","useComposedCssClasses","useReportAnalyticsEvent","useFetchInitialMessage","~~useScrollToLastMessage~~","~~useEffect~~","React","MessageBubble","LoadingDots","ChatInput"],"mappings":";;;;;;;;;;;;;;;;;~~AA+BA~~,MAAM,iBAAiB,GAAwBA,+CAAuB,CACpE,OAAO,EACP;AACE,IAAA,SAAS,EAAE,0DAA0D;AACrE,IAAA,uBAAuB,EAAE,uCAAuC;AAChE,IAAA,iBAAiB,EAAE,0CAA0C;AAC7D,IAAA,cAAc,EAAE,YAAY;AAC5B,IAAA,uBAAuB,EAAE;AACvB,QAAA,YAAY,EAAE,YAAY;AAC3B,KAAA;AACF,CAAA,CACF,CAAC;~~AAoBF~~;;;;;;;;AAQG;AACG,SAAU,SAAS,CAAC,KAAqB,EAAA;AAC7C,IAAA,MAAM,EAAE,MAAM,EAAE,~~KAAK,EAAE,~~gBAAgB,EAAE,MAAM,EAAE,WAAW,EAAE,~~GAAG~~,KAAK,CAAC;~~AACvE~~,IAAA,MAAM,QAAQ,GAAGC,8BAAY,CAAC,CAAC,KAAK,KAAK,KAAK,CAAC,YAAY,CAAC,QAAQ,CAAC,CAAC;AACtE,IAAA,MAAM,OAAO,GAAGA,8BAAY,CAAC,CAAC,KAAK,KAAK,KAAK,CAAC,YAAY,CAAC,SAAS,CAAC,CAAC;IACtE,MAAM,UAAU,GAAGC,2CAAqB,CAAC,iBAAiB,EAAE,gBAAgB,CAAC,CAAC;AAC9E,IAAA,MAAM,oBAAoB,GAAGC,+CAAuB,EAAE,CAAC;AACvD,IAAAC,6CAAsB,CAAC,WAAW,EAAE,MAAM,CAAC,CAAC;~~IAC5C~~,MAAM,CAAC,oBAAoB,EAAE,~~aAAa~~,CAAC,GAAGC,~~6CAAsB~~,EAAE,CAAC;~~IAEvEC~~,eAAS,CAAC,MAAK;~~AACb~~,QAAA,~~oBAAoB~~,CAAC;~~AACnB~~,~~YAAA~~,MAAM,EAAE,iBAAiB;~~AAC1B~~,SAAA,CAAC,CAAC;AACL,KAAC,EAAE,CAAC,~~oBAAoB~~,CAAC,CAAC,CAAC;~~AAE3B~~,IAAA,QACEC,sBAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,yBAAyB,EAAA;AACtC,QAAAA,sBAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,UAAU,CAAC,SAAS,EAAA;YACjC,MAAM;AACP,YAAAA,sBAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,UAAU,CAAC,uBAAuB,EAAA;gBAChDA,sBAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,GAAG,EAAE,~~oBAAoB~~,EAAE,SAAS,EAAE,UAAU,CAAC,iBAAiB,EAAA;~~oBACpE~~,QAAQ,CAAC,GAAG,CAAC,CAAC,OAAO,EAAE,KAAK,MAC3BA,sBAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,GAAG,EAAE,KAAK,EAAE,GAAG,EAAE,~~aAAa~~,CAAC,KAAK,CAAC,EAAA;~~AACxC~~,wBAAAA,sBAAA,CAAA,aAAA,CAACC,2BAAa,EACR,EAAA,GAAA,KAAK,EACT,gBAAgB,EAAE,UAAU,CAAC,uBAAuB,EACpD,OAAO,EAAE,OAAO,EAChB,CAAA,CACE,CACP,CAAC;~~AACD~~,~~oBAAA,~~OAAO,IAAID,~~sBAAA~~,CAAA,aAAA,~~CAACE~~,uBAAW,~~EAAA~~,IAAA,~~CAAG~~,~~CACvB~~,CACF;~~YACNF~~,~~sBAAK~~,CAAA,aAAA,CAAA,KAAA,EAAA,~~EAAA~~,SAAS,EAAE,UAAU,CAAC,cAAc,~~EACtC,~~EAAA,~~KAAK~~,~~IAAIA,~~sBAAA,CAAA,aAAA,~~CAACG~~,mBAAS,EAAA,EAAA,GAAK,KAAK,EAAE,gBAAgB,EAAE,UAAU,CAAC,eAAe,~~GAAI~~,~~CAC5E~~,CACF,CACF,EACN;AACJ;;;;"}
1	+ {"version":3,"file":"ChatPanel.js","sources":["../../../../src/components/ChatPanel.tsx"],"sourcesContent":["import React, {\n ReactNode,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n} from \"react\";\nimport { useChatState } from \"@yext/chat-headless-react\";\nimport {\n MessageBubble,\n MessageBubbleCssClasses,\n MessageBubbleProps,\n} from \"./MessageBubble\";\nimport { ChatInput, ChatInputCssClasses, ChatInputProps } from \"./ChatInput\";\nimport { LoadingDots } from \"./LoadingDots\";\nimport { useComposedCssClasses } from \"../hooks\";\nimport { withStylelessCssClasses } from \"../utils/withStylelessCssClasses\";\nimport { useReportAnalyticsEvent } from \"../hooks/useReportAnalyticsEvent\";\nimport { useFetchInitialMessage } from \"../hooks/useFetchInitialMessage\";\nimport {\n MessageSuggestionCssClasses,\n MessageSuggestions,\n} from \"./MessageSuggestions\";\n\n/*\n The CSS class interface for the {@link ChatPanel} component.\n \n @public\n /\nexport interface ChatPanelCssClasses {\n container?: string;\n messagesContainer?: string;\n messagesScrollContainer?: string;\n inputContainer?: string;\n inputCssClasses?: ChatInputCssClasses;\n messageBubbleCssClasses?: MessageBubbleCssClasses;\n messageSuggestionClasses?: MessageSuggestionCssClasses;\n}\n\nconst builtInCssClasses: ChatPanelCssClasses = withStylelessCssClasses(\n \"Panel\",\n {\n container: \"h-full w-full flex flex-col relative shadow-2xl bg-white\",\n messagesScrollContainer: \"flex flex-col mt-auto overflow-hidden\",\n messagesContainer: \"flex flex-col gap-y-1 px-4 overflow-auto\",\n inputContainer: \"w-full p-4\",\n messageBubbleCssClasses: {\n topContainer: \"first:mt-4\",\n },\n }\n);\n\n/\n The props for the {@link ChatPanel} component.\n \n @public\n /\nexport interface ChatPanelProps\n extends Omit<MessageBubbleProps, \"customCssClasses\" \| \"message\">,\n Omit<ChatInputProps, \"customCssClasses\"> {\n /* A header to render at the top of the panel. /\n header?: ReactNode;\n /\n CSS classes for customizing the component styling.\n /\n customCssClasses?: ChatPanelCssClasses;\n /\n A set of pre-written initial messages that the user\n * can click on instead of typing their own.\n /\n messageSuggestions?: string[];\n}\n\n/\n A component that renders a full panel for chat bot interactions. This includes\n * the message bubbles for the conversation, input box with send button, and header\n * (if provided).\n \n @public\n \n @param props - {@link ChatPanelProps}\n */\nexport function ChatPanel(props: ChatPanelProps) {\n const { header, customCssClasses, stream, handleError, messageSuggestions } =\n props;\n const messages = useChatState((state) => state.conversation.messages);\n const loading = useChatState((state) => state.conversation.isLoading);\n const cssClasses = useComposedCssClasses(builtInCssClasses, customCssClasses);\n const reportAnalyticsEvent = useReportAnalyticsEvent();\n useFetchInitialMessage(handleError, stream);\n\n useEffect(() => {\n reportAnalyticsEvent({\n action: \"CHAT_IMPRESSION\",\n });\n }, [reportAnalyticsEvent]);\n\n const suggestions = useMemo(() => {\n if (\n messages.length === 0 \|\|\n (messages.length === 1 && messages[0].source === \"BOT\")\n ) {\n return messageSuggestions;\n }\n // TODO: Chat API will send suggestions in the message notes eventually; add that here. [CLIP-852]\n return null;\n }, [messages, messageSuggestions]);\n\n const messagesRef = useRef<Array<HTMLDivElement \| null>>([]);\n const messagesContainer = useRef<HTMLDivElement>(null);\n\n // Handle scrolling when messages change\n useEffect(() => {\n let scrollTop = 0;\n messagesRef.current = messagesRef.current.slice(0, messages.length);\n\n // Sums up scroll heights of all messages except the last one\n if (messagesRef?.current.length > 1) {\n scrollTop = messagesRef.current\n .slice(0, -1)\n .map((elem, _) => elem?.scrollHeight ?? 0)\n .reduce((total, height) => total + height);\n }\n\n // Scroll to the top of the last message\n messagesContainer.current?.scroll({\n top: scrollTop,\n behavior: \"smooth\",\n });\n }, [messages]);\n\n const setMessagesRef = useCallback((index) => {\n if (!messagesRef?.current) return null;\n return (message) => (messagesRef.current[index] = message);\n }, []);\n\n return (\n <div className=\"yext-chat w-full h-full\">\n <div className={cssClasses.container}>\n {header}\n <div className={cssClasses.messagesScrollContainer}>\n <div ref={messagesContainer} className={cssClasses.messagesContainer}>\n {messages.map((message, index) => (\n <div key={index} ref={setMessagesRef(index)}>\n <MessageBubble\n {...props}\n customCssClasses={cssClasses.messageBubbleCssClasses}\n message={message}\n />\n </div>\n ))}\n {loading && <LoadingDots />}\n {suggestions && (\n <MessageSuggestions\n suggestions={suggestions}\n customCssClasses={cssClasses.messageSuggestionClasses}\n />\n )}\n </div>\n </div>\n <div className={cssClasses.inputContainer}>\n <ChatInput {...props} customCssClasses={cssClasses.inputCssClasses} />\n </div>\n </div>\n </div>\n );\n}\n"],"names":["withStylelessCssClasses","useChatState","useComposedCssClasses","useReportAnalyticsEvent","useFetchInitialMessage","useEffect","useMemo","useRef","useCallback","React","MessageBubble","LoadingDots","MessageSuggestions","ChatInput"],"mappings":"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"}

package/lib/commonjs/src/components/ChatPopUp.d.ts CHANGED Viewed

@@ -29,7 +29,7 @@ export interface ChatPopUpCssClasses {
  *
  * @public
  */
-export interface ChatPopUpProps extends Omit<ChatHeaderProps, "showCloseButton" | "customCssClasses">, Omit<ChatPanelProps, "header" | "input" | "customCssClasses"> {
+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. */

package/lib/commonjs/src/components/ChatPopUp.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ChatPopUp.d.ts","sourceRoot":"","sources":["../../../../src/components/ChatPopUp.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA2C,MAAM,OAAO,CAAC;AAEhE,OAAO,EAAa,mBAAmB,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAC7E,OAAO,EAEL,oBAAoB,EACpB,eAAe,EAChB,MAAM,cAAc,CAAC;AAKtB,OAAO,EAEL,6BAA6B,EAC9B,MAAM,uBAAuB,CAAC;AAI/B;;;;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,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,6BAA6B,CAAC,EAAE,MAAM,CAAC;IACvC,4BAA4B,CAAC,EAAE,MAAM,CAAC;IACtC,gBAAgB,CAAC,EAAE,oBAAoB,CAAC;IACxC,eAAe,CAAC,EAAE,mBAAmB,CAAC;IACtC,6BAA6B,CAAC,EAAE,6BAA6B,CAAC;CAC/D;AAqCD;;;;GAIG;AACH,MAAM,WAAW,cACf,SAAQ,IAAI,CAAC,eAAe,EAAE,iBAAiB,GAAG,kBAAkB,CAAC,EACnE,IAAI,CAAC,cAAc,EAAE,QAAQ,GAAG,~~OAAO,GAAG,~~kBAAkB,CAAC;~~IAC/D~~,0DAA0D;IAC1D,mBAAmB,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IAClC,yDAAyD;IACzD,gBAAgB,CAAC,EAAE,mBAAmB,CAAC;IACvC,4DAA4D;IAC5D,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAClC;;;OAGG;IACH,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC;;;OAGG;IACH,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC;;;;OAIG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED;;;;;;;GAOG;AACH,wBAAgB,SAAS,CAAC,KAAK,EAAE,cAAc,qBAyJ9C"}
1	+ {"version":3,"file":"ChatPopUp.d.ts","sourceRoot":"","sources":["../../../../src/components/ChatPopUp.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA2C,MAAM,OAAO,CAAC;AAEhE,OAAO,EAAa,mBAAmB,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAC7E,OAAO,EAEL,oBAAoB,EACpB,eAAe,EAChB,MAAM,cAAc,CAAC;AAKtB,OAAO,EAEL,6BAA6B,EAC9B,MAAM,uBAAuB,CAAC;AAI/B;;;;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,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,6BAA6B,CAAC,EAAE,MAAM,CAAC;IACvC,4BAA4B,CAAC,EAAE,MAAM,CAAC;IACtC,gBAAgB,CAAC,EAAE,oBAAoB,CAAC;IACxC,eAAe,CAAC,EAAE,mBAAmB,CAAC;IACtC,6BAA6B,CAAC,EAAE,6BAA6B,CAAC;CAC/D;AAqCD;;;;GAIG;AACH,MAAM,WAAW,cACf,SAAQ,IAAI,CAAC,eAAe,EAAE,iBAAiB,GAAG,kBAAkB,CAAC,EACnE,IAAI,CAAC,cAAc,EAAE,QAAQ,GAAG,kBAAkB,CAAC;IACrD,0DAA0D;IAC1D,mBAAmB,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IAClC,yDAAyD;IACzD,gBAAgB,CAAC,EAAE,mBAAmB,CAAC;IACvC,4DAA4D;IAC5D,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAClC;;;OAGG;IACH,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC;;;OAGG;IACH,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC;;;;OAIG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED;;;;;;;GAOG;AACH,wBAAgB,SAAS,CAAC,KAAK,EAAE,cAAc,qBAyJ9C"}

package/lib/commonjs/src/components/ChatPopUp.js CHANGED Viewed

@@ -6,11 +6,11 @@ var ChatPanel = require('./ChatPanel.js');
 var ChatHeader = require('./ChatHeader.js');
 var tailwindMerge = require('tailwind-merge');
 var useComposedCssClasses = require('../hooks/useComposedCssClasses.js');
-var chatHeadlessReact = require('@yext/chat-headless-react');
-var useFetchInitialMessage = require('../hooks/useFetchInitialMessage.js');
 var useReportAnalyticsEvent = require('../hooks/useReportAnalyticsEvent.js');
 var withStylelessCssClasses = require('../utils/withStylelessCssClasses.js');
 var InitialMessagePopUp = require('./InitialMessagePopUp.js');
+var chatHeadlessReact = require('@yext/chat-headless-react');
+var useFetchInitialMessage = require('../hooks/useFetchInitialMessage.js');
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }

package/lib/commonjs/src/components/ChatPopUp.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ChatPopUp.js","sources":["../../../../src/components/ChatPopUp.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useState } from \"react\";\nimport { ChatIcon } from \"../icons/Chat\";\nimport { ChatPanel, ChatPanelCssClasses, ChatPanelProps } from \"./ChatPanel\";\nimport {\n ChatHeader,\n ChatHeaderCssClasses,\n ChatHeaderProps,\n} from \"./ChatHeader\";\nimport { twMerge } from \"tailwind-merge\";\nimport { useComposedCssClasses } from \"../hooks\";\nimport { withStylelessCssClasses } from \"../utils/withStylelessCssClasses\";\nimport { useReportAnalyticsEvent } from \"../hooks/useReportAnalyticsEvent\";\nimport {\n InitialMessagePopUp,\n InitialMessagePopUpCssClasses,\n} from \"./InitialMessagePopUp\";\nimport { useChatState } from \"@yext/chat-headless-react\";\nimport { useFetchInitialMessage } from \"../hooks/useFetchInitialMessage\";\n\n/*\n The CSS class interface for the {@link ChatPopUp} component.\n \n @public\n /\nexport interface ChatPopUpCssClasses {\n container?: string;\n panel?: string;\n panel__display?: string;\n panel__hidden?: string;\n button?: string;\n buttonIcon?: string;\n ctaLabelContainer?: string;\n ctaLabel?: string;\n notification?: string;\n closedPopupContainer?: string;\n closedPopupContainer__display?: string;\n closedPopupContainer__hidden?: string;\n headerCssClasses?: ChatHeaderCssClasses;\n panelCssClasses?: ChatPanelCssClasses;\n initialMessagePopUpCssClasses?: InitialMessagePopUpCssClasses;\n}\n\nconst fixedPosition = \"fixed bottom-6 right-4 lg:bottom-14 lg:right-10 z-50 \";\nconst builtInCssClasses: ChatPopUpCssClasses = withStylelessCssClasses(\n \"PopUp\",\n {\n container: \"transition-all\",\n panel:\n fixedPosition +\n \"w-80 max-[480px]:right-0 max-[480px]:bottom-0 max-[480px]:w-full max-[480px]:h-full lg:w-96 h-[75vh]\",\n panel__display: \"duration-300 translate-y-0\",\n panel__hidden: \"duration-300 translate-y-[20%] opacity-0 invisible\",\n closedPopupContainer:\n fixedPosition +\n \"flex gap-x-2.5 items-center hover:-translate-y-2 duration-150\",\n closedPopupContainer__display: \"duration-300 transform translate-y-0\",\n closedPopupContainer__hidden:\n \"duration-300 transform translate-y-[20%] opacity-0 invisible\",\n button:\n \"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\",\n buttonIcon: \"text-blue-600 w-[28px] h-[28px] lg:w-[40px] lg:h-[40px]\",\n ctaLabelContainer: \"max-w-60 -mr-8 line-clamp-1\",\n ctaLabel:\n \"p-3 pr-8 flex items-center whitespace-nowrap animate-expand-left font-bold rounded-l-full bg-white text-blue-700 h-10 lg:h-14 text-sm lg:text-base\",\n notification:\n \"fixed animate-fade-in bg-red-700 -right-1 top-0 rounded-full w-5 lg:w-6 h-5 lg:h-6 items-center flex justify-center text-sm lg:text-base text-white\",\n headerCssClasses: {\n container: \"max-[480px]:rounded-none rounded-t-3xl\",\n },\n panelCssClasses: {\n container: \"max-[480px]:rounded-none rounded-3xl\",\n inputContainer: \"max-[480px]:rounded-none rounded-b-3xl\",\n messagesScrollContainer: \"rounded-b-3xl\",\n },\n }\n);\n\n/\n The props for the {@link ChatPopUp} component.\n \n @public\n /\nexport interface ChatPopUpProps\n extends Omit<ChatHeaderProps, \"showCloseButton\" \| \"customCssClasses\">,\n Omit<ChatPanelProps, \"header\" \| \"input\" \| \"customCssClasses\"> {\n /* Custom icon for the popup button to open the panel. /\n openPanelButtonIcon?: JSX.Element;\n /* CSS classes for customizing the component styling. /\n customCssClasses?: ChatPopUpCssClasses;\n /* Whether to show the panel on load. Defaults to false. /\n openOnLoad?: boolean;\n /\n Whether to show the initial message popup when the panel is hidden on load.\n * Defaults to false.\n /\n showInitialMessagePopUp?: boolean;\n /\n Whether to show a heartbeat animation on the popup button when the panel is hidden.\n * Defaults to false.\n /\n showHeartBeatAnimation?: boolean;\n /\n Whether to show notification showing number of unread messages.\n * Defaults to false.\n /\n showUnreadNotification?: boolean;\n /\n The \"Call to Action\" label to be displayed next to the popup button.\n * By default, the CTA is not shown.\n * This prop will override the \"showInitialMessagePopUp\" prop, if specified.\n /\n ctaLabel?: string;\n}\n\n/\n A component that renders a popup button that displays and hides\n * a panel for chat bot interactions.\n \n @public\n \n @param props - {@link ChatPanelProps}\n */\nexport function ChatPopUp(props: ChatPopUpProps) {\n const {\n openPanelButtonIcon,\n customCssClasses,\n showRestartButton = true,\n onClose: customOnClose,\n handleError,\n openOnLoad = false,\n showInitialMessagePopUp = false,\n showHeartBeatAnimation = false,\n showUnreadNotification = false,\n ctaLabel,\n title,\n } = props;\n\n const reportAnalyticsEvent = useReportAnalyticsEvent();\n useEffect(() => {\n reportAnalyticsEvent({\n action: \"CHAT_IMPRESSION\",\n });\n }, [reportAnalyticsEvent]);\n\n const messages = useChatState((s) => s.conversation.messages);\n const [numReadMessages, setNumReadMessagesLength] = useState<number>(0);\n const [numUnreadMessages, setNumUnreadMessagesLength] = useState<number>(0);\n\n useFetchInitialMessage(\n showInitialMessagePopUp ? console.error : handleError,\n false,\n showUnreadNotification \|\| showInitialMessagePopUp\n );\n\n const [showInitialMessage, setshowInitialMessage] = useState(\n //only show initial message popup (if specified) when CTA label is not provided\n !ctaLabel && showInitialMessagePopUp\n );\n const onCloseInitialMessage = useCallback(() => {\n setshowInitialMessage(false);\n }, []);\n\n // control CSS behavior on open/close state of the panel\n const [showChat, setShowChat] = useState(false);\n\n // control the actual DOM rendering of the panel. Start rendering on first open state\n // to avoid message requests immediately on load while the popup is still \"hidden\"\n const [renderChat, setRenderChat] = useState(false);\n\n // update in useEffect, instead of having openOnLoad as initial state for show/renderChat,\n // in order to maintain the fade-in CSS animation when opening the panel on load\n useEffect(() => {\n if (openOnLoad) {\n setShowChat(true);\n setRenderChat(true);\n setshowInitialMessage(false);\n }\n }, [openOnLoad]);\n\n const onClick = useCallback(() => {\n setShowChat(!showChat);\n setRenderChat(true);\n setshowInitialMessage(false);\n }, [showChat]);\n\n const onClose = useCallback(() => {\n setShowChat(false);\n customOnClose?.();\n // consider all the messages are read while the panel was open\n setNumReadMessagesLength(messages.length);\n }, [customOnClose, messages]);\n\n useEffect(() => {\n //update number of unread messages if there are new messages added while the panel is closed\n setNumUnreadMessagesLength(messages.length - numReadMessages);\n }, [messages, numReadMessages]);\n\n const cssClasses = useComposedCssClasses(builtInCssClasses, customCssClasses);\n const panelCssClasses = twMerge(\n cssClasses.panel,\n showChat ? cssClasses.panel__display : cssClasses.panel__hidden\n );\n const closedPopupContainerCssClasses = twMerge(\n cssClasses.closedPopupContainer,\n showChat\n ? cssClasses.closedPopupContainer__hidden\n : cssClasses.closedPopupContainer__display\n );\n\n return (\n <div className=\"yext-chat w-full h-full\">\n <div className={cssClasses.container}>\n <div className={panelCssClasses} aria-label=\"Chat Popup Panel\">\n {renderChat && (\n <ChatPanel\n {...props}\n customCssClasses={cssClasses.panelCssClasses}\n header={\n <ChatHeader\n title={title}\n showRestartButton={showRestartButton}\n showCloseButton={true}\n onClose={onClose}\n customCssClasses={cssClasses.headerCssClasses}\n />\n }\n />\n )}\n </div>\n <div\n className={closedPopupContainerCssClasses}\n aria-label=\"Chat Closed Popup Container\"\n >\n {showInitialMessage && (\n <InitialMessagePopUp\n onClose={onCloseInitialMessage}\n customCssClasses={cssClasses.initialMessagePopUpCssClasses}\n />\n )}\n {ctaLabel && (\n // the div container is needed to islate the expand CSS animation\n <div className={cssClasses.ctaLabelContainer}>\n <button\n onClick={onClick}\n aria-label=\"CTA Label\"\n className={cssClasses.ctaLabel}\n >\n {ctaLabel}\n </button>\n </div>\n )}\n <button\n aria-label=\"Chat Popup Button\"\n onClick={onClick}\n className={\n cssClasses.button +\n (showHeartBeatAnimation ? \" animate-heartbeat\" : \"\")\n }\n >\n {openPanelButtonIcon ?? (\n <ChatIcon className={cssClasses.buttonIcon} />\n )}\n {showUnreadNotification && !!numUnreadMessages && (\n <div\n aria-label=\"Unread Messages Notification\"\n className={cssClasses.notification}\n >\n {numUnreadMessages}\n </div>\n )}\n </button>\n </div>\n </div>\n </div>\n );\n}\n"],"names":["withStylelessCssClasses","useReportAnalyticsEvent","useEffect","useChatState","useState","useFetchInitialMessage","useCallback","useComposedCssClasses","twMerge","React","ChatPanel","ChatHeader","InitialMessagePopUp","ChatIcon"],"mappings":"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"}
1	+ {"version":3,"file":"ChatPopUp.js","sources":["../../../../src/components/ChatPopUp.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useState } from \"react\";\nimport { ChatIcon } from \"../icons/Chat\";\nimport { ChatPanel, ChatPanelCssClasses, ChatPanelProps } from \"./ChatPanel\";\nimport {\n ChatHeader,\n ChatHeaderCssClasses,\n ChatHeaderProps,\n} from \"./ChatHeader\";\nimport { twMerge } from \"tailwind-merge\";\nimport { useComposedCssClasses } from \"../hooks\";\nimport { withStylelessCssClasses } from \"../utils/withStylelessCssClasses\";\nimport { useReportAnalyticsEvent } from \"../hooks/useReportAnalyticsEvent\";\nimport {\n InitialMessagePopUp,\n InitialMessagePopUpCssClasses,\n} from \"./InitialMessagePopUp\";\nimport { useChatState } from \"@yext/chat-headless-react\";\nimport { useFetchInitialMessage } from \"../hooks/useFetchInitialMessage\";\n\n/*\n The CSS class interface for the {@link ChatPopUp} component.\n \n @public\n /\nexport interface ChatPopUpCssClasses {\n container?: string;\n panel?: string;\n panel__display?: string;\n panel__hidden?: string;\n button?: string;\n buttonIcon?: string;\n ctaLabelContainer?: string;\n ctaLabel?: string;\n notification?: string;\n closedPopupContainer?: string;\n closedPopupContainer__display?: string;\n closedPopupContainer__hidden?: string;\n headerCssClasses?: ChatHeaderCssClasses;\n panelCssClasses?: ChatPanelCssClasses;\n initialMessagePopUpCssClasses?: InitialMessagePopUpCssClasses;\n}\n\nconst fixedPosition = \"fixed bottom-6 right-4 lg:bottom-14 lg:right-10 z-50 \";\nconst builtInCssClasses: ChatPopUpCssClasses = withStylelessCssClasses(\n \"PopUp\",\n {\n container: \"transition-all\",\n panel:\n fixedPosition +\n \"w-80 max-[480px]:right-0 max-[480px]:bottom-0 max-[480px]:w-full max-[480px]:h-full lg:w-96 h-[75vh]\",\n panel__display: \"duration-300 translate-y-0\",\n panel__hidden: \"duration-300 translate-y-[20%] opacity-0 invisible\",\n closedPopupContainer:\n fixedPosition +\n \"flex gap-x-2.5 items-center hover:-translate-y-2 duration-150\",\n closedPopupContainer__display: \"duration-300 transform translate-y-0\",\n closedPopupContainer__hidden:\n \"duration-300 transform translate-y-[20%] opacity-0 invisible\",\n button:\n \"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\",\n buttonIcon: \"text-blue-600 w-[28px] h-[28px] lg:w-[40px] lg:h-[40px]\",\n ctaLabelContainer: \"max-w-60 -mr-8 line-clamp-1\",\n ctaLabel:\n \"p-3 pr-8 flex items-center whitespace-nowrap animate-expand-left font-bold rounded-l-full bg-white text-blue-700 h-10 lg:h-14 text-sm lg:text-base\",\n notification:\n \"fixed animate-fade-in bg-red-700 -right-1 top-0 rounded-full w-5 lg:w-6 h-5 lg:h-6 items-center flex justify-center text-sm lg:text-base text-white\",\n headerCssClasses: {\n container: \"max-[480px]:rounded-none rounded-t-3xl\",\n },\n panelCssClasses: {\n container: \"max-[480px]:rounded-none rounded-3xl\",\n inputContainer: \"max-[480px]:rounded-none rounded-b-3xl\",\n messagesScrollContainer: \"rounded-b-3xl\",\n },\n }\n);\n\n/\n The props for the {@link ChatPopUp} component.\n \n @public\n /\nexport interface ChatPopUpProps\n extends Omit<ChatHeaderProps, \"showCloseButton\" \| \"customCssClasses\">,\n Omit<ChatPanelProps, \"header\" \| \"customCssClasses\"> {\n /* Custom icon for the popup button to open the panel. /\n openPanelButtonIcon?: JSX.Element;\n /* CSS classes for customizing the component styling. /\n customCssClasses?: ChatPopUpCssClasses;\n /* Whether to show the panel on load. Defaults to false. /\n openOnLoad?: boolean;\n /\n Whether to show the initial message popup when the panel is hidden on load.\n * Defaults to false.\n /\n showInitialMessagePopUp?: boolean;\n /\n Whether to show a heartbeat animation on the popup button when the panel is hidden.\n * Defaults to false.\n /\n showHeartBeatAnimation?: boolean;\n /\n Whether to show notification showing number of unread messages.\n * Defaults to false.\n /\n showUnreadNotification?: boolean;\n /\n The \"Call to Action\" label to be displayed next to the popup button.\n * By default, the CTA is not shown.\n * This prop will override the \"showInitialMessagePopUp\" prop, if specified.\n /\n ctaLabel?: string;\n}\n\n/\n A component that renders a popup button that displays and hides\n * a panel for chat bot interactions.\n \n @public\n \n @param props - {@link ChatPanelProps}\n */\nexport function ChatPopUp(props: ChatPopUpProps) {\n const {\n openPanelButtonIcon,\n customCssClasses,\n showRestartButton = true,\n onClose: customOnClose,\n handleError,\n openOnLoad = false,\n showInitialMessagePopUp = false,\n showHeartBeatAnimation = false,\n showUnreadNotification = false,\n ctaLabel,\n title,\n } = props;\n\n const reportAnalyticsEvent = useReportAnalyticsEvent();\n useEffect(() => {\n reportAnalyticsEvent({\n action: \"CHAT_IMPRESSION\",\n });\n }, [reportAnalyticsEvent]);\n\n const messages = useChatState((s) => s.conversation.messages);\n const [numReadMessages, setNumReadMessagesLength] = useState<number>(0);\n const [numUnreadMessages, setNumUnreadMessagesLength] = useState<number>(0);\n\n useFetchInitialMessage(\n showInitialMessagePopUp ? console.error : handleError,\n false,\n showUnreadNotification \|\| showInitialMessagePopUp\n );\n\n const [showInitialMessage, setshowInitialMessage] = useState(\n //only show initial message popup (if specified) when CTA label is not provided\n !ctaLabel && showInitialMessagePopUp\n );\n const onCloseInitialMessage = useCallback(() => {\n setshowInitialMessage(false);\n }, []);\n\n // control CSS behavior on open/close state of the panel\n const [showChat, setShowChat] = useState(false);\n\n // control the actual DOM rendering of the panel. Start rendering on first open state\n // to avoid message requests immediately on load while the popup is still \"hidden\"\n const [renderChat, setRenderChat] = useState(false);\n\n // update in useEffect, instead of having openOnLoad as initial state for show/renderChat,\n // in order to maintain the fade-in CSS animation when opening the panel on load\n useEffect(() => {\n if (openOnLoad) {\n setShowChat(true);\n setRenderChat(true);\n setshowInitialMessage(false);\n }\n }, [openOnLoad]);\n\n const onClick = useCallback(() => {\n setShowChat(!showChat);\n setRenderChat(true);\n setshowInitialMessage(false);\n }, [showChat]);\n\n const onClose = useCallback(() => {\n setShowChat(false);\n customOnClose?.();\n // consider all the messages are read while the panel was open\n setNumReadMessagesLength(messages.length);\n }, [customOnClose, messages]);\n\n useEffect(() => {\n //update number of unread messages if there are new messages added while the panel is closed\n setNumUnreadMessagesLength(messages.length - numReadMessages);\n }, [messages, numReadMessages]);\n\n const cssClasses = useComposedCssClasses(builtInCssClasses, customCssClasses);\n const panelCssClasses = twMerge(\n cssClasses.panel,\n showChat ? cssClasses.panel__display : cssClasses.panel__hidden\n );\n const closedPopupContainerCssClasses = twMerge(\n cssClasses.closedPopupContainer,\n showChat\n ? cssClasses.closedPopupContainer__hidden\n : cssClasses.closedPopupContainer__display\n );\n\n return (\n <div className=\"yext-chat w-full h-full\">\n <div className={cssClasses.container}>\n <div className={panelCssClasses} aria-label=\"Chat Popup Panel\">\n {renderChat && (\n <ChatPanel\n {...props}\n customCssClasses={cssClasses.panelCssClasses}\n header={\n <ChatHeader\n title={title}\n showRestartButton={showRestartButton}\n showCloseButton={true}\n onClose={onClose}\n customCssClasses={cssClasses.headerCssClasses}\n />\n }\n />\n )}\n </div>\n <div\n className={closedPopupContainerCssClasses}\n aria-label=\"Chat Closed Popup Container\"\n >\n {showInitialMessage && (\n <InitialMessagePopUp\n onClose={onCloseInitialMessage}\n customCssClasses={cssClasses.initialMessagePopUpCssClasses}\n />\n )}\n {ctaLabel && (\n // the div container is needed to islate the expand CSS animation\n <div className={cssClasses.ctaLabelContainer}>\n <button\n onClick={onClick}\n aria-label=\"CTA Label\"\n className={cssClasses.ctaLabel}\n >\n {ctaLabel}\n </button>\n </div>\n )}\n <button\n aria-label=\"Chat Popup Button\"\n onClick={onClick}\n className={\n cssClasses.button +\n (showHeartBeatAnimation ? \" animate-heartbeat\" : \"\")\n }\n >\n {openPanelButtonIcon ?? (\n <ChatIcon className={cssClasses.buttonIcon} />\n )}\n {showUnreadNotification && !!numUnreadMessages && (\n <div\n aria-label=\"Unread Messages Notification\"\n className={cssClasses.notification}\n >\n {numUnreadMessages}\n </div>\n )}\n </button>\n </div>\n </div>\n </div>\n );\n}\n"],"names":["withStylelessCssClasses","useReportAnalyticsEvent","useEffect","useChatState","useState","useFetchInitialMessage","useCallback","useComposedCssClasses","twMerge","React","ChatPanel","ChatHeader","InitialMessagePopUp","ChatIcon"],"mappings":"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"}

package/lib/commonjs/src/components/FeedbackButtons.d.ts CHANGED Viewed

@@ -16,9 +16,9 @@ export interface FeedbackButtonsCssClasses {
 /**
  * The props for the FeedbackButtons component.
  *
- * @public
+ * @internal
  */
-export interface FeedbackButtonsProps {
+interface FeedbackButtonsProps {
     /** The response ID correlates to the current message to give feedback on. */
     responseId?: string;
     /** CSS classes for customizing the component styling. */
@@ -28,7 +28,8 @@ export interface FeedbackButtonsProps {
  * Displays feedback buttons (e.g. thumbs up and thumbs down) that will
  * report analytic events on click.
  *
- * @public
+ * @internal
  */
 export declare function FeedbackButtons({ customCssClasses, responseId, }: FeedbackButtonsProps): React.JSX.Element;
+export {};
 //# sourceMappingURL=FeedbackButtons.d.ts.map

package/lib/commonjs/src/components/FeedbackButtons.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FeedbackButtons.d.ts","sourceRoot":"","sources":["../../../../src/components/FeedbackButtons.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAgC,MAAM,OAAO,CAAC;AAOrD;;;;GAIG;AACH,MAAM,WAAW,yBAAyB;IACxC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,kBAAkB,CAAC,EAAE,MAAM,CAAC;CAC7B;AAgBD;;;;GAIG;AACH,~~MAAM~~,~~WAAW,~~oBAAoB;~~IACnC~~,6EAA6E;IAC7E,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,yDAAyD;IACzD,gBAAgB,CAAC,EAAE,yBAAyB,CAAC;CAC9C;AAED;;;;;GAKG;AACH,wBAAgB,eAAe,CAAC,EAC9B,gBAAgB,EAChB,UAAU,GACX,EAAE,oBAAoB,qBA+CtB"}
1	+ {"version":3,"file":"FeedbackButtons.d.ts","sourceRoot":"","sources":["../../../../src/components/FeedbackButtons.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAgC,MAAM,OAAO,CAAC;AAOrD;;;;GAIG;AACH,MAAM,WAAW,yBAAyB;IACxC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,kBAAkB,CAAC,EAAE,MAAM,CAAC;CAC7B;AAgBD;;;;GAIG;AACH,UAAU,oBAAoB;IAC5B,6EAA6E;IAC7E,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,yDAAyD;IACzD,gBAAgB,CAAC,EAAE,yBAAyB,CAAC;CAC9C;AAED;;;;;GAKG;AACH,wBAAgB,eAAe,CAAC,EAC9B,gBAAgB,EAChB,UAAU,GACX,EAAE,oBAAoB,qBA+CtB"}

package/lib/commonjs/src/components/FeedbackButtons.js CHANGED Viewed

@@ -7,7 +7,6 @@ var ThumbsUpFill = require('../icons/ThumbsUpFill.js');
 var ThumbsDownFill = require('../icons/ThumbsDownFill.js');
 var withStylelessCssClasses = require('../utils/withStylelessCssClasses.js');
 var useComposedCssClasses = require('../hooks/useComposedCssClasses.js');
-require('@yext/chat-headless-react');
 var useReportAnalyticsEvent = require('../hooks/useReportAnalyticsEvent.js');
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
@@ -27,7 +26,7 @@ const builtInCssClasses = withStylelessCssClasses.withStylelessCssClasses("Feedb
  * Displays feedback buttons (e.g. thumbs up and thumbs down) that will
  * report analytic events on click.
  *
- * @public
+ * @internal
  */
 function FeedbackButtons({ customCssClasses, responseId, }) {
     const reportAnalyticsEvent = useReportAnalyticsEvent.useReportAnalyticsEvent();

package/lib/commonjs/src/components/FeedbackButtons.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FeedbackButtons.js","sources":["../../../../src/components/FeedbackButtons.tsx"],"sourcesContent":["import { ThumbsDownIcon } from \"../icons/ThumbsDown\";\nimport { ThumbsUpIcon } from \"../icons/ThumbsUp\";\nimport React, { useCallback, useState } from \"react\";\nimport { ThumbsUpFillIcon } from \"../icons/ThumbsUpFill\";\nimport { ThumbsDownFillIcon } from \"../icons/ThumbsDownFill\";\nimport { withStylelessCssClasses } from \"../utils/withStylelessCssClasses\";\nimport { useComposedCssClasses } from \"../hooks\";\nimport { useReportAnalyticsEvent } from \"../hooks/useReportAnalyticsEvent\";\n\n/*\n The CSS class interface for the FeedbackButtons component.\n \n @public\n /\nexport interface FeedbackButtonsCssClasses {\n container?: string;\n thumbsUpButton?: string;\n thumbsUpIcon?: string;\n thumbsUpFillIcon?: string;\n thumbsDownButton?: string;\n thumbsDownIcon?: string;\n thumbsDownFillIcon?: string;\n}\n\nconst builtInCssClasses: FeedbackButtonsCssClasses =\n withStylelessCssClasses<FeedbackButtonsCssClasses>(\"FeedbackButtons\", {\n container:\n \"flex gap-x-1 absolute -right-1 -top-3 opacity-0 group-hover:opacity-100 duration-200\",\n thumbsUpButton:\n \"w-6 h-6 bg-gray-700 rounded-md flex justify-center items-center\",\n thumbsUpIcon: \"text-white w-[22px] h-[22px] stroke-[0.2]\",\n thumbsUpFillIcon: \"text-white w-[22px] h-[22px] stroke-[0.2]\",\n thumbsDownButton:\n \"w-6 h-6 bg-gray-700 rounded-md flex justify-center items-center\",\n thumbsDownIcon: \"text-white w-[22px] h-[22px] stroke-[0.2]\",\n thumbsDownFillIcon: \"text-white w-[22px] h-[22px] stroke-[0.2]\",\n });\n\n/\n The props for the FeedbackButtons component.\n \n @~~public~~\n /\~~nexport~~ ~~interface~~ FeedbackButtonsProps {\n /* The response ID correlates to the current message to give feedback on. /\n responseId?: string;\n /* CSS classes for customizing the component styling. /\n customCssClasses?: FeedbackButtonsCssClasses;\n}\n\n/\n Displays feedback buttons (e.g. thumbs up and thumbs down) that will\n * report analytic events on click.\n \n @~~public~~\n */\nexport function FeedbackButtons({\n customCssClasses,\n responseId,\n}: FeedbackButtonsProps) {\n const reportAnalyticsEvent = useReportAnalyticsEvent();\n const cssClasses = useComposedCssClasses(builtInCssClasses, customCssClasses);\n const [selectedThumb, setSelectedThumb] = useState<\n \"UP\" \| \"DOWN\" \| undefined\n >();\n const onClickThumbsUp = useCallback(() => {\n setSelectedThumb(\"UP\");\n reportAnalyticsEvent({\n action: \"THUMBS_UP\",\n chat: {\n responseId,\n },\n });\n }, [reportAnalyticsEvent, responseId]);\n\n const onClickThumbsDown = useCallback(() => {\n setSelectedThumb(\"DOWN\");\n reportAnalyticsEvent({\n action: \"THUMBS_DOWN\",\n chat: {\n responseId,\n },\n });\n }, [reportAnalyticsEvent, responseId]);\n\n return (\n <div className={cssClasses.container}>\n <button className={cssClasses.thumbsUpButton} onClick={onClickThumbsUp}>\n {selectedThumb === \"UP\" ? (\n <ThumbsUpFillIcon className={cssClasses.thumbsUpFillIcon} />\n ) : (\n <ThumbsUpIcon className={cssClasses.thumbsUpIcon} />\n )}\n </button>\n <button\n className={cssClasses.thumbsDownButton}\n onClick={onClickThumbsDown}\n >\n {selectedThumb === \"DOWN\" ? (\n <ThumbsDownFillIcon className={cssClasses.thumbsDownFillIcon} />\n ) : (\n <ThumbsDownIcon className={cssClasses.thumbsDownIcon} />\n )}\n </button>\n </div>\n );\n}\n"],"names":["withStylelessCssClasses","useReportAnalyticsEvent","useComposedCssClasses","useState","useCallback","React","ThumbsUpFillIcon","ThumbsUpIcon","ThumbsDownFillIcon","ThumbsDownIcon"],"mappings":"~~;;;;;;;;;;;;;;;;~~AAwBA,MAAM,iBAAiB,GACrBA,+CAAuB,CAA4B,iBAAiB,EAAE;AACpE,IAAA,SAAS,EACP,sFAAsF;AACxF,IAAA,cAAc,EACZ,iEAAiE;AACnE,IAAA,YAAY,EAAE,2CAA2C;AACzD,IAAA,gBAAgB,EAAE,2CAA2C;AAC7D,IAAA,gBAAgB,EACd,iEAAiE;AACnE,IAAA,cAAc,EAAE,2CAA2C;AAC3D,IAAA,kBAAkB,EAAE,2CAA2C;AAChE,CAAA,CAAC,CAAC;AAcL;;;;;AAKG;SACa,eAAe,CAAC,EAC9B,gBAAgB,EAChB,UAAU,GACW,EAAA;AACrB,IAAA,MAAM,oBAAoB,GAAGC,+CAAuB,EAAE,CAAC;IACvD,MAAM,UAAU,GAAGC,2CAAqB,CAAC,iBAAiB,EAAE,gBAAgB,CAAC,CAAC;IAC9E,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAGC,cAAQ,EAE/C,CAAC;AACJ,IAAA,MAAM,eAAe,GAAGC,iBAAW,CAAC,MAAK;QACvC,gBAAgB,CAAC,IAAI,CAAC,CAAC;AACvB,QAAA,oBAAoB,CAAC;AACnB,YAAA,MAAM,EAAE,WAAW;AACnB,YAAA,IAAI,EAAE;gBACJ,UAAU;AACX,aAAA;AACF,SAAA,CAAC,CAAC;AACL,KAAC,EAAE,CAAC,oBAAoB,EAAE,UAAU,CAAC,CAAC,CAAC;AAEvC,IAAA,MAAM,iBAAiB,GAAGA,iBAAW,CAAC,MAAK;QACzC,gBAAgB,CAAC,MAAM,CAAC,CAAC;AACzB,QAAA,oBAAoB,CAAC;AACnB,YAAA,MAAM,EAAE,aAAa;AACrB,YAAA,IAAI,EAAE;gBACJ,UAAU;AACX,aAAA;AACF,SAAA,CAAC,CAAC;AACL,KAAC,EAAE,CAAC,oBAAoB,EAAE,UAAU,CAAC,CAAC,CAAC;AAEvC,IAAA,QACEC,sBAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,UAAU,CAAC,SAAS,EAAA;AAClC,QAAAA,sBAAA,CAAA,aAAA,CAAA,QAAA,EAAA,EAAQ,SAAS,EAAE,UAAU,CAAC,cAAc,EAAE,OAAO,EAAE,eAAe,EACnE,EAAA,aAAa,KAAK,IAAI,IACrBA,qCAACC,6BAAgB,EAAA,EAAC,SAAS,EAAE,UAAU,CAAC,gBAAgB,GAAI,KAE5DD,qCAACE,qBAAY,EAAA,EAAC,SAAS,EAAE,UAAU,CAAC,YAAY,EAAA,CAAI,CACrD,CACM;QACTF,sBACE,CAAA,aAAA,CAAA,QAAA,EAAA,EAAA,SAAS,EAAE,UAAU,CAAC,gBAAgB,EACtC,OAAO,EAAE,iBAAiB,EAAA,EAEzB,aAAa,KAAK,MAAM,IACvBA,sBAAC,CAAA,aAAA,CAAAG,iCAAkB,IAAC,SAAS,EAAE,UAAU,CAAC,kBAAkB,GAAI,KAEhEH,qCAACI,yBAAc,EAAA,EAAC,SAAS,EAAE,UAAU,CAAC,cAAc,EAAA,CAAI,CACzD,CACM,CACL,EACN;AACJ;;;;"}
1	+ {"version":3,"file":"FeedbackButtons.js","sources":["../../../../src/components/FeedbackButtons.tsx"],"sourcesContent":["import { ThumbsDownIcon } from \"../icons/ThumbsDown\";\nimport { ThumbsUpIcon } from \"../icons/ThumbsUp\";\nimport React, { useCallback, useState } from \"react\";\nimport { ThumbsUpFillIcon } from \"../icons/ThumbsUpFill\";\nimport { ThumbsDownFillIcon } from \"../icons/ThumbsDownFill\";\nimport { withStylelessCssClasses } from \"../utils/withStylelessCssClasses\";\nimport { useComposedCssClasses } from \"../hooks\";\nimport { useReportAnalyticsEvent } from \"../hooks/useReportAnalyticsEvent\";\n\n/*\n The CSS class interface for the FeedbackButtons component.\n \n @public\n /\nexport interface FeedbackButtonsCssClasses {\n container?: string;\n thumbsUpButton?: string;\n thumbsUpIcon?: string;\n thumbsUpFillIcon?: string;\n thumbsDownButton?: string;\n thumbsDownIcon?: string;\n thumbsDownFillIcon?: string;\n}\n\nconst builtInCssClasses: FeedbackButtonsCssClasses =\n withStylelessCssClasses<FeedbackButtonsCssClasses>(\"FeedbackButtons\", {\n container:\n \"flex gap-x-1 absolute -right-1 -top-3 opacity-0 group-hover:opacity-100 duration-200\",\n thumbsUpButton:\n \"w-6 h-6 bg-gray-700 rounded-md flex justify-center items-center\",\n thumbsUpIcon: \"text-white w-[22px] h-[22px] stroke-[0.2]\",\n thumbsUpFillIcon: \"text-white w-[22px] h-[22px] stroke-[0.2]\",\n thumbsDownButton:\n \"w-6 h-6 bg-gray-700 rounded-md flex justify-center items-center\",\n thumbsDownIcon: \"text-white w-[22px] h-[22px] stroke-[0.2]\",\n thumbsDownFillIcon: \"text-white w-[22px] h-[22px] stroke-[0.2]\",\n });\n\n/\n The props for the FeedbackButtons component.\n \n @internal\n /\ninterface FeedbackButtonsProps {\n /* The response ID correlates to the current message to give feedback on. /\n responseId?: string;\n /* CSS classes for customizing the component styling. /\n customCssClasses?: FeedbackButtonsCssClasses;\n}\n\n/\n Displays feedback buttons (e.g. thumbs up and thumbs down) that will\n * report analytic events on click.\n \n @internal\n */\nexport function FeedbackButtons({\n customCssClasses,\n responseId,\n}: FeedbackButtonsProps) {\n const reportAnalyticsEvent = useReportAnalyticsEvent();\n const cssClasses = useComposedCssClasses(builtInCssClasses, customCssClasses);\n const [selectedThumb, setSelectedThumb] = useState<\n \"UP\" \| \"DOWN\" \| undefined\n >();\n const onClickThumbsUp = useCallback(() => {\n setSelectedThumb(\"UP\");\n reportAnalyticsEvent({\n action: \"THUMBS_UP\",\n chat: {\n responseId,\n },\n });\n }, [reportAnalyticsEvent, responseId]);\n\n const onClickThumbsDown = useCallback(() => {\n setSelectedThumb(\"DOWN\");\n reportAnalyticsEvent({\n action: \"THUMBS_DOWN\",\n chat: {\n responseId,\n },\n });\n }, [reportAnalyticsEvent, responseId]);\n\n return (\n <div className={cssClasses.container}>\n <button className={cssClasses.thumbsUpButton} onClick={onClickThumbsUp}>\n {selectedThumb === \"UP\" ? (\n <ThumbsUpFillIcon className={cssClasses.thumbsUpFillIcon} />\n ) : (\n <ThumbsUpIcon className={cssClasses.thumbsUpIcon} />\n )}\n </button>\n <button\n className={cssClasses.thumbsDownButton}\n onClick={onClickThumbsDown}\n >\n {selectedThumb === \"DOWN\" ? (\n <ThumbsDownFillIcon className={cssClasses.thumbsDownFillIcon} />\n ) : (\n <ThumbsDownIcon className={cssClasses.thumbsDownIcon} />\n )}\n </button>\n </div>\n );\n}\n"],"names":["withStylelessCssClasses","useReportAnalyticsEvent","useComposedCssClasses","useState","useCallback","React","ThumbsUpFillIcon","ThumbsUpIcon","ThumbsDownFillIcon","ThumbsDownIcon"],"mappings":";;;;;;;;;;;;;;;AAwBA,MAAM,iBAAiB,GACrBA,+CAAuB,CAA4B,iBAAiB,EAAE;AACpE,IAAA,SAAS,EACP,sFAAsF;AACxF,IAAA,cAAc,EACZ,iEAAiE;AACnE,IAAA,YAAY,EAAE,2CAA2C;AACzD,IAAA,gBAAgB,EAAE,2CAA2C;AAC7D,IAAA,gBAAgB,EACd,iEAAiE;AACnE,IAAA,cAAc,EAAE,2CAA2C;AAC3D,IAAA,kBAAkB,EAAE,2CAA2C;AAChE,CAAA,CAAC,CAAC;AAcL;;;;;AAKG;SACa,eAAe,CAAC,EAC9B,gBAAgB,EAChB,UAAU,GACW,EAAA;AACrB,IAAA,MAAM,oBAAoB,GAAGC,+CAAuB,EAAE,CAAC;IACvD,MAAM,UAAU,GAAGC,2CAAqB,CAAC,iBAAiB,EAAE,gBAAgB,CAAC,CAAC;IAC9E,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAGC,cAAQ,EAE/C,CAAC;AACJ,IAAA,MAAM,eAAe,GAAGC,iBAAW,CAAC,MAAK;QACvC,gBAAgB,CAAC,IAAI,CAAC,CAAC;AACvB,QAAA,oBAAoB,CAAC;AACnB,YAAA,MAAM,EAAE,WAAW;AACnB,YAAA,IAAI,EAAE;gBACJ,UAAU;AACX,aAAA;AACF,SAAA,CAAC,CAAC;AACL,KAAC,EAAE,CAAC,oBAAoB,EAAE,UAAU,CAAC,CAAC,CAAC;AAEvC,IAAA,MAAM,iBAAiB,GAAGA,iBAAW,CAAC,MAAK;QACzC,gBAAgB,CAAC,MAAM,CAAC,CAAC;AACzB,QAAA,oBAAoB,CAAC;AACnB,YAAA,MAAM,EAAE,aAAa;AACrB,YAAA,IAAI,EAAE;gBACJ,UAAU;AACX,aAAA;AACF,SAAA,CAAC,CAAC;AACL,KAAC,EAAE,CAAC,oBAAoB,EAAE,UAAU,CAAC,CAAC,CAAC;AAEvC,IAAA,QACEC,sBAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,UAAU,CAAC,SAAS,EAAA;AAClC,QAAAA,sBAAA,CAAA,aAAA,CAAA,QAAA,EAAA,EAAQ,SAAS,EAAE,UAAU,CAAC,cAAc,EAAE,OAAO,EAAE,eAAe,EACnE,EAAA,aAAa,KAAK,IAAI,IACrBA,qCAACC,6BAAgB,EAAA,EAAC,SAAS,EAAE,UAAU,CAAC,gBAAgB,GAAI,KAE5DD,qCAACE,qBAAY,EAAA,EAAC,SAAS,EAAE,UAAU,CAAC,YAAY,EAAA,CAAI,CACrD,CACM;QACTF,sBACE,CAAA,aAAA,CAAA,QAAA,EAAA,EAAA,SAAS,EAAE,UAAU,CAAC,gBAAgB,EACtC,OAAO,EAAE,iBAAiB,EAAA,EAEzB,aAAa,KAAK,MAAM,IACvBA,sBAAC,CAAA,aAAA,CAAAG,iCAAkB,IAAC,SAAS,EAAE,UAAU,CAAC,kBAAkB,GAAI,KAEhEH,qCAACI,yBAAc,EAAA,EAAC,SAAS,EAAE,UAAU,CAAC,cAAc,EAAA,CAAI,CACzD,CACM,CACL,EACN;AACJ;;;;"}

package/lib/commonjs/src/components/Markdown.d.ts CHANGED Viewed

@@ -1,10 +1,5 @@
 import React from "react";
-/**
- * The props for the {@link Markdown} component.
- *
- * @public
- */
-export interface MarkdownProps {
+interface MarkdownProps {
     /** Stringified markdown. */
     content: string;
     /** The response ID correlates to the current message. */
@@ -19,7 +14,8 @@ export interface MarkdownProps {
  * @remarks
  * A link click will send a CHAT_LINK_CLICK analytics event
  *
- * @public
+ * @internal
  */
 export declare function Markdown({ content, responseId, className }: MarkdownProps): React.JSX.Element;
+export {};
 //# sourceMappingURL=Markdown.d.ts.map

package/lib/commonjs/src/components/Markdown.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Markdown.d.ts","sourceRoot":"","sources":["../../../../src/components/Markdown.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAkB,MAAM,OAAO,CAAC;AAcvC~~;;;;GAIG;AACH~~,~~MAAM~~,~~WAAW,~~aAAa;~~IAC5B~~,4BAA4B;IAC5B,OAAO,EAAE,MAAM,CAAC;IAChB,yDAAyD;IACzD,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,oCAAoC;IACpC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;;;;GAQG;AACH,wBAAgB,QAAQ,CAAC,EAAE,OAAO,EAAE,UAAU,EAAE,SAAS,EAAE,EAAE,aAAa,qBAuCzE"}
1	+ {"version":3,"file":"Markdown.d.ts","sourceRoot":"","sources":["../../../../src/components/Markdown.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAkB,MAAM,OAAO,CAAC;AAcvC,UAAU,aAAa;IACrB,4BAA4B;IAC5B,OAAO,EAAE,MAAM,CAAC;IAChB,yDAAyD;IACzD,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,oCAAoC;IACpC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;;;;GAQG;AACH,wBAAgB,QAAQ,CAAC,EAAE,OAAO,EAAE,UAAU,EAAE,SAAS,EAAE,EAAE,aAAa,qBAuCzE"}

package/lib/commonjs/src/components/Markdown.js CHANGED Viewed

@@ -32,7 +32,7 @@ const unifiedPlugins = {
  * @remarks
  * A link click will send a CHAT_LINK_CLICK analytics event
  *
- * @public
+ * @internal
  */
 function Markdown({ content, responseId, className }) {
     const reportAnalyticsEvent = useReportAnalyticsEvent.useReportAnalyticsEvent();

package/lib/commonjs/src/components/Markdown.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Markdown.js","sources":["../../../../src/components/Markdown.tsx"],"sourcesContent":["import ReactMarkdown, {\n PluggableList,\n ReactMarkdownOptions,\n} from \"react-markdown\";\nimport remarkGfm from \"remark-gfm\";\nimport rehypeRaw from \"rehype-raw\";\nimport rehypeSanitize from \"rehype-sanitize\";\nimport React, { useMemo } from \"react\";\nimport { useReportAnalyticsEvent } from \"../hooks/useReportAnalyticsEvent\";\n\n// The Remark and Rehype plugins to use in conjunction with ReactMarkdown.\nconst unifiedPlugins: { remark?: PluggableList; rehype: PluggableList } = {\n remark: [\n remarkGfm, //renders Github-Flavored Markdown\n ],\n rehype: [\n rehypeRaw, //to support HTML embedded in markdown\n rehypeSanitize, //to sanitize HTML content\n ],\n};\n\~~n/*\n~~ The props for the {@link Markdown} component.\n * \n * @public\n /\nexport interface MarkdownProps {\n /* Stringified markdown. /\n content: string;\n /* The response ID correlates to the current message. /\n responseId?: string;\n /* Classnames for the container. /\n className?: string;\n}\n\n/\n Renders Github-Flavored Markdown from the Knowledge Graph. This Markdown can include\n * arbitrary HTML. Any HTML will be sanitized according to Rehype's default Schema.\n \n @remarks\n * A link click will send a CHAT_LINK_CLICK analytics event\n \n @~~public~~\n */\nexport function Markdown({ content, responseId, className }: MarkdownProps) {\n const reportAnalyticsEvent = useReportAnalyticsEvent();\n\n const components: ReactMarkdownOptions[\"components\"] = useMemo(() => {\n const createClickHandlerFn = (href?: string) => () => {\n reportAnalyticsEvent({\n action: \"CHAT_LINK_CLICK\",\n destinationUrl: href,\n chat: {\n responseId,\n },\n });\n };\n return {\n a: ({ node: _, children, ...props }) => {\n return (\n <a\n {...props}\n onClick={createClickHandlerFn(props.href)}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n className=\"cursor-pointer\"\n >\n {children}\n </a>\n );\n },\n };\n }, [reportAnalyticsEvent, responseId]);\n\n return (\n <ReactMarkdown\n className={className}\n children={content}\n remarkPlugins={unifiedPlugins.remark}\n rehypePlugins={unifiedPlugins.rehype}\n components={components}\n />\n );\n}\n"],"names":["remarkGfm","rehypeRaw","rehypeSanitize","useReportAnalyticsEvent","useMemo","React","ReactMarkdown"],"mappings":";;;;;;;;;;;;;;;;;AAUA;AACA,MAAM,cAAc,GAAsD;AACxE,IAAA,MAAM,EAAE;AACN,QAAAA,0BAAS;AACV,KAAA;AACD,IAAA,MAAM,EAAE;QACNC,0BAAS;AACT,QAAAC,+BAAc;AACf,KAAA;CACF,CAAC;~~AAgBF~~;;;;;;;;AAQG;AACG,SAAU,QAAQ,CAAC,EAAE,OAAO,EAAE,UAAU,EAAE,SAAS,EAAiB,EAAA;AACxE,IAAA,MAAM,oBAAoB,GAAGC,+CAAuB,EAAE,CAAC;AAEvD,IAAA,MAAM,UAAU,GAAuCC,aAAO,CAAC,MAAK;QAClE,MAAM,oBAAoB,GAAG,CAAC,IAAa,KAAK,MAAK;AACnD,YAAA,oBAAoB,CAAC;AACnB,gBAAA,MAAM,EAAE,iBAAiB;AACzB,gBAAA,cAAc,EAAE,IAAI;AACpB,gBAAA,IAAI,EAAE;oBACJ,UAAU;AACX,iBAAA;AACF,aAAA,CAAC,CAAC;AACL,SAAC,CAAC;QACF,OAAO;AACL,YAAA,CAAC,EAAE,CAAC,EAAE,IAAI,EAAE,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,KAAI;AACrC,gBAAA,QACEC,sBAAA,CAAA,aAAA,CAAA,GAAA,EAAA,EAAA,GACM,KAAK,EACT,OAAO,EAAE,oBAAoB,CAAC,KAAK,CAAC,IAAI,CAAC,EACzC,MAAM,EAAC,QAAQ,EACf,GAAG,EAAC,qBAAqB,EACzB,SAAS,EAAC,gBAAgB,EAEzB,EAAA,QAAQ,CACP,EACJ;aACH;SACF,CAAC;AACJ,KAAC,EAAE,CAAC,oBAAoB,EAAE,UAAU,CAAC,CAAC,CAAC;AAEvC,IAAA,QACEA,sBAAA,CAAA,aAAA,CAACC,8BAAa,EAAA,EACZ,SAAS,EAAE,SAAS,EACpB,QAAQ,EAAE,OAAO,EACjB,aAAa,EAAE,cAAc,CAAC,MAAM,EACpC,aAAa,EAAE,cAAc,CAAC,MAAM,EACpC,UAAU,EAAE,UAAU,EAAA,CACtB,EACF;AACJ;;;;"}
1	+ {"version":3,"file":"Markdown.js","sources":["../../../../src/components/Markdown.tsx"],"sourcesContent":["import ReactMarkdown, {\n PluggableList,\n ReactMarkdownOptions,\n} from \"react-markdown\";\nimport remarkGfm from \"remark-gfm\";\nimport rehypeRaw from \"rehype-raw\";\nimport rehypeSanitize from \"rehype-sanitize\";\nimport React, { useMemo } from \"react\";\nimport { useReportAnalyticsEvent } from \"../hooks/useReportAnalyticsEvent\";\n\n// The Remark and Rehype plugins to use in conjunction with ReactMarkdown.\nconst unifiedPlugins: { remark?: PluggableList; rehype: PluggableList } = {\n remark: [\n remarkGfm, //renders Github-Flavored Markdown\n ],\n rehype: [\n rehypeRaw, //to support HTML embedded in markdown\n rehypeSanitize, //to sanitize HTML content\n ],\n};\n\ninterface MarkdownProps {\n /** Stringified markdown. /\n content: string;\n /* The response ID correlates to the current message. /\n responseId?: string;\n /* Classnames for the container. /\n className?: string;\n}\n\n/\n Renders Github-Flavored Markdown from the Knowledge Graph. This Markdown can include\n * arbitrary HTML. Any HTML will be sanitized according to Rehype's default Schema.\n \n @remarks\n * A link click will send a CHAT_LINK_CLICK analytics event\n \n @internal\n */\nexport function Markdown({ content, responseId, className }: MarkdownProps) {\n const reportAnalyticsEvent = useReportAnalyticsEvent();\n\n const components: ReactMarkdownOptions[\"components\"] = useMemo(() => {\n const createClickHandlerFn = (href?: string) => () => {\n reportAnalyticsEvent({\n action: \"CHAT_LINK_CLICK\",\n destinationUrl: href,\n chat: {\n responseId,\n },\n });\n };\n return {\n a: ({ node: _, children, ...props }) => {\n return (\n <a\n {...props}\n onClick={createClickHandlerFn(props.href)}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n className=\"cursor-pointer\"\n >\n {children}\n </a>\n );\n },\n };\n }, [reportAnalyticsEvent, responseId]);\n\n return (\n <ReactMarkdown\n className={className}\n children={content}\n remarkPlugins={unifiedPlugins.remark}\n rehypePlugins={unifiedPlugins.rehype}\n components={components}\n />\n );\n}\n"],"names":["remarkGfm","rehypeRaw","rehypeSanitize","useReportAnalyticsEvent","useMemo","React","ReactMarkdown"],"mappings":";;;;;;;;;;;;;;;;;AAUA;AACA,MAAM,cAAc,GAAsD;AACxE,IAAA,MAAM,EAAE;AACN,QAAAA,0BAAS;AACV,KAAA;AACD,IAAA,MAAM,EAAE;QACNC,0BAAS;AACT,QAAAC,+BAAc;AACf,KAAA;CACF,CAAC;AAWF;;;;;;;;AAQG;AACG,SAAU,QAAQ,CAAC,EAAE,OAAO,EAAE,UAAU,EAAE,SAAS,EAAiB,EAAA;AACxE,IAAA,MAAM,oBAAoB,GAAGC,+CAAuB,EAAE,CAAC;AAEvD,IAAA,MAAM,UAAU,GAAuCC,aAAO,CAAC,MAAK;QAClE,MAAM,oBAAoB,GAAG,CAAC,IAAa,KAAK,MAAK;AACnD,YAAA,oBAAoB,CAAC;AACnB,gBAAA,MAAM,EAAE,iBAAiB;AACzB,gBAAA,cAAc,EAAE,IAAI;AACpB,gBAAA,IAAI,EAAE;oBACJ,UAAU;AACX,iBAAA;AACF,aAAA,CAAC,CAAC;AACL,SAAC,CAAC;QACF,OAAO;AACL,YAAA,CAAC,EAAE,CAAC,EAAE,IAAI,EAAE,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,KAAI;AACrC,gBAAA,QACEC,sBAAA,CAAA,aAAA,CAAA,GAAA,EAAA,EAAA,GACM,KAAK,EACT,OAAO,EAAE,oBAAoB,CAAC,KAAK,CAAC,IAAI,CAAC,EACzC,MAAM,EAAC,QAAQ,EACf,GAAG,EAAC,qBAAqB,EACzB,SAAS,EAAC,gBAAgB,EAEzB,EAAA,QAAQ,CACP,EACJ;aACH;SACF,CAAC;AACJ,KAAC,EAAE,CAAC,oBAAoB,EAAE,UAAU,CAAC,CAAC,CAAC;AAEvC,IAAA,QACEA,sBAAA,CAAA,aAAA,CAACC,8BAAa,EAAA,EACZ,SAAS,EAAE,SAAS,EACpB,QAAQ,EAAE,OAAO,EACjB,aAAa,EAAE,cAAc,CAAC,MAAM,EACpC,aAAa,EAAE,cAAc,CAAC,MAAM,EACpC,UAAU,EAAE,UAAU,EAAA,CACtB,EACF;AACJ;;;;"}

package/lib/commonjs/src/components/MessageSuggestions.d.ts ADDED Viewed

@@ -0,0 +1,27 @@
+import React from "react";
+/**
+ * The CSS class interface for the MessageSuggestion component.
+ *
+ * @public
+ */
+export interface MessageSuggestionCssClasses {
+    container?: string;
+    suggestion?: string;
+}
+/**
+ * The props for the MessageSuggestions component.
+ *
+ * @public
+ */
+export interface MessageSuggestionsProps {
+    suggestions: string[];
+    customCssClasses?: MessageSuggestionCssClasses;
+}
+/**
+ * A component that displays a list of suggested messages
+ * to the user, which they can click to send the message to the bot.
+ *
+ * @internal
+ */
+export declare const MessageSuggestions: React.FC<MessageSuggestionsProps>;
+//# sourceMappingURL=MessageSuggestions.d.ts.map

package/lib/commonjs/src/components/MessageSuggestions.d.ts.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"MessageSuggestions.d.ts","sourceRoot":"","sources":["../../../../src/components/MessageSuggestions.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsB,MAAM,OAAO,CAAC;AAM3C;;;;GAIG;AACH,MAAM,WAAW,2BAA2B;IAC1C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED;;;;GAIG;AACH,MAAM,WAAW,uBAAuB;IACtC,WAAW,EAAE,MAAM,EAAE,CAAC;IACtB,gBAAgB,CAAC,EAAE,2BAA2B,CAAC;CAChD;AAWD;;;;;GAKG;AACH,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CA6BhE,CAAC"}