@progress/kendo-vue-conversational-ui 7.0.0-develop.3 → 7.0.0-develop.5

package/ai-prompt/views/AIPromptView.mjs

@@ -5,29 +5,28 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-import { defineComponent as I, createVNode as e, h as i, isVNode as A } from "vue";
-import { AIPromptContent as P } from "../AIPromptContent.mjs";
-import { AIPromptFooter as R } from "../AIPromptFooter.mjs";
-import { Button as S } from "@progress/kendo-vue-buttons";
-import { TextArea as v } from "@progress/kendo-vue-inputs";
-import { sparklesIcon as m } from "@progress/kendo-svg-icons";
-import { AIPromptViewRender as V } from "./AIPromptViewRender.mjs";
-import { AIPromptExpander as k } from "../AIPromptExpander.mjs";
-import { templateRendering as a, getListeners as u, getTemplate as s } from "@progress/kendo-vue-common";
-function l(t) {
-  return typeof t == "function" || Object.prototype.toString.call(t) === "[object Object]" && !A(t);
+import { defineComponent as A, createVNode as e, h as u, mergeProps as P, isVNode as R } from "vue";
+import { AIPromptContent as b } from "../AIPromptContent.mjs";
+import { AIPromptFooter as V } from "../AIPromptFooter.mjs";
+import { promptViewDefaults as v } from "./constants.mjs";
+import { TextArea as T } from "@progress/kendo-vue-inputs";
+import { Button as k, SpeechToTextButton as B } from "@progress/kendo-vue-buttons";
+import { sparklesIcon as C } from "@progress/kendo-svg-icons";
+import { AIPromptViewRender as j } from "./AIPromptViewRender.mjs";
+import { AIPromptExpander as O } from "../AIPromptExpander.mjs";
+import { SuggestionGroup as $ } from "../../chat/components/SuggestionGroup.mjs";
+import { templateRendering as m, getListeners as c, getTemplate as d } from "@progress/kendo-vue-common";
+function h(t) {
+  return typeof t == "function" || Object.prototype.toString.call(t) === "[object Object]" && !R(t);
 }
-const b = {
-  name: "prompt-view",
-  buttonText: "Ask AI",
-  buttonIcon: m
-}, q = /* @__PURE__ */ I({
+const K = /* @__PURE__ */ A({
   name: "KendoAIPromptView",
   props: {
     promptInput: [Object, String],
     generateButton: [Object, String],
     promptValue: String,
-    promptSuggestions: Array
+    promptSuggestions: Array,
+    enableSpeechToText: [Boolean, Object]
   },
   inject: {
     kendoAIPrompt: {
@@ -46,29 +45,53 @@ const b = {
   },
   methods: {
     handleOnRequest() {
-      this.kendoAIPrompt.onPromptRequest && this.kendoAIPrompt.onPromptRequest.call(null, this.value), this.value = "";
+      this.kendoAIPrompt.onPromptRequest && this.kendoAIPrompt.onPromptRequest.call(null, this.computedValue), this.value = "";
     },
     handleSuggestionSelect(t) {
       this.value = t;
     },
     onTextChange(t) {
       this.value = t.value;
+    },
+    onSpeechResult(t) {
+      if (t.isFinal && t.alternatives.length > 0) {
+        const o = t.alternatives[0].transcript, n = this.value, r = n && !n.endsWith(" ") && !n.endsWith(`
+`);
+        this.value = n + (r ? " " : "") + o;
+      }
+    },
+    onSpeechStart() {
+    },
+    onSpeechEnd() {
+    },
+    getButtonDisabledState() {
+      const t = this.$props.promptValue !== void 0 ? this.$props.promptValue : this.value;
+      return !(t != null && t.trim());
     }
   },
   render() {
-    let t;
-    const o = "Generate", {
-      promptSuggestions: n
-    } = this.$props, d = a.call(this, this.$props.promptInput, u.call(this)), c = e(v, {
+    const t = "Generate", {
+      promptSuggestions: o,
+      enableSpeechToText: n
+    } = this.$props, r = m.call(this, this.$props.promptInput, c.call(this)), f = () => n ? e("div", {
+      class: "k-input-suffix k-input-suffix-horizontal"
+    }, [e(B, P({
+      fillMode: "flat",
+      onStart: this.onSpeechStart,
+      onEnd: this.onSpeechEnd,
+      onResult: this.onSpeechResult
+    }, typeof n == "object" ? n : {}), null)]) : null, g = e(T, {
       value: this.computedValue,
-      onChange: this.onTextChange,
+      onInput: this.onTextChange,
       placeholder: "Ask or generate content with AI ...",
-      rows: 2
-    }, null), h = s.call(this, {
-      h: i,
-      template: d,
-      defaultRendering: c
-    }), g = a.call(this, this.$props.generateButton, u.call(this)), f = e(S, {
+      rows: 2,
+      class: "!k-flex-col",
+      inputSuffix: f
+    }, null), S = d.call(this, {
+      h: u,
+      template: r,
+      defaultRendering: g
+    }), I = m.call(this, this.$props.generateButton, c.call(this)), x = e(k, {
       type: "button",
       themeColor: "primary",
       fillMode: "solid",
@@ -76,37 +99,44 @@ const b = {
       rounded: "full",
       size: "medium",
       onClick: this.handleOnRequest,
+      disabled: this.getButtonDisabledState(),
       title: "Generate",
-      svgIcon: m
-    }, l(o) ? o : {
-      default: () => [o]
-    }), r = s.call(this, {
-      h: i,
-      template: g,
-      defaultRendering: f
+      svgIcon: C
+    }, h(t) ? t : {
+      default: () => [t]
+    }), i = d.call(this, {
+      h: u,
+      template: I,
+      defaultRendering: x
     });
-    return e(V, {
-      name: b.name
+    return e(j, {
+      name: v.name
     }, {
-      default: () => [e(P, null, {
-        default: () => [h, n && n.length > 0 && e(k, {
-          title: "Prompt Suggestions"
-        }, l(t = n.map(function(p) {
-          return e("div", {
-            key: p,
-            class: "k-prompt-suggestion",
-            onClick: () => this.handleSuggestionSelect(p)
-          }, [p]);
-        }, this)) ? t : {
-          default: () => [t]
-        })]
-      }), e(R, null, l(r) ? r : {
-        default: () => [r]
-      })]
+      default: () => {
+        var s, a;
+        return [e(b, {
+          streaming: (s = this.kendoAIPrompt) == null ? void 0 : s.streaming,
+          onCancel: (a = this.kendoAIPrompt) == null ? void 0 : a.onCancel
+        }, {
+          default: () => [S, o && o.length > 0 && e(O, {
+            title: "Prompt Suggestions"
+          }, {
+            default: () => [e($, {
+              suggestions: o.map((p, l) => ({
+                id: l,
+                text: p,
+                description: p
+              })),
+              onSuggestionClick: (p, l) => this.handleSuggestionSelect(l.text)
+            }, null)]
+          })]
+        }), e(V, null, h(i) ? i : {
+          default: () => [i]
+        })];
+      }
     });
   }
 });
 export {
-  q as AIPromptView,
-  b as promptViewDefaults
+  K as AIPromptView
 };

package/ai-prompt/views/constants.js

@@ -0,0 +1,8 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2025 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("@progress/kendo-svg-icons"),e={name:"Output view",buttonText:"Output",buttonIcon:t.commentIcon},o={name:"Commands view",buttonIcon:t.moreHorizontalIcon},n={name:"prompt-view",buttonText:"Ask AI",buttonIcon:t.sparklesIcon};exports.commandsViewDefaults=o;exports.outputViewDefaults=e;exports.promptViewDefaults=n;

package/ai-prompt/views/constants.mjs

@@ -0,0 +1,25 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2025 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+import { commentIcon as t, moreHorizontalIcon as o, sparklesIcon as n } from "@progress/kendo-svg-icons";
+const m = {
+  name: "Output view",
+  buttonText: "Output",
+  buttonIcon: t
+}, u = {
+  name: "Commands view",
+  buttonIcon: o
+}, c = {
+  name: "prompt-view",
+  buttonText: "Ask AI",
+  buttonIcon: n
+};
+export {
+  u as commandsViewDefaults,
+  m as outputViewDefaults,
+  c as promptViewDefaults
+};

package/chat/components/SuggestionGroup.js

@@ -0,0 +1,8 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2025 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const d=require("vue"),r=require("@progress/kendo-vue-common"),t=d.defineComponent({name:"KendoSuggestionGroup",props:{suggestions:{type:Array,required:!0},onSuggestionClick:{type:Function,required:!0}},methods:{handleSuggestionClick(i,e){e.disabled||this.onSuggestionClick(i,e)},handleKeyDown(i,e){(i.key==="Enter"||i.key===" ")&&(i.preventDefault(),this.onSuggestionClick(i,e))}},render(){const{suggestions:i}=this.$props;return d.createVNode("div",{role:"group",class:"k-suggestion-group"},[i.map(e=>d.createVNode("span",{role:"button",tabindex:e.disabled?-1:0,"aria-label":e.description,"aria-disabled":e.disabled,onClick:o=>!e.disabled&&this.handleSuggestionClick(o,e),onKeydown:o=>!e.disabled&&this.handleKeyDown(o,e),key:e.id,title:e.description,class:r.classNames("k-suggestion",{"k-disabled":e.disabled})},[e.text]))])}});exports.SuggestionGroup=t;

package/chat/components/SuggestionGroup.mjs

@@ -0,0 +1,54 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2025 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+import { defineComponent as r, createVNode as o } from "vue";
+import { classNames as a } from "@progress/kendo-vue-common";
+const n = /* @__PURE__ */ r({
+  name: "KendoSuggestionGroup",
+  props: {
+    suggestions: {
+      type: Array,
+      required: !0
+    },
+    onSuggestionClick: {
+      type: Function,
+      required: !0
+    }
+  },
+  methods: {
+    handleSuggestionClick(i, e) {
+      e.disabled || this.onSuggestionClick(i, e);
+    },
+    handleKeyDown(i, e) {
+      (i.key === "Enter" || i.key === " ") && (i.preventDefault(), this.onSuggestionClick(i, e));
+    }
+  },
+  render() {
+    const {
+      suggestions: i
+    } = this.$props;
+    return o("div", {
+      role: "group",
+      class: "k-suggestion-group"
+    }, [i.map((e) => o("span", {
+      role: "button",
+      tabindex: e.disabled ? -1 : 0,
+      "aria-label": e.description,
+      "aria-disabled": e.disabled,
+      onClick: (d) => !e.disabled && this.handleSuggestionClick(d, e),
+      onKeydown: (d) => !e.disabled && this.handleKeyDown(d, e),
+      key: e.id,
+      title: e.description,
+      class: a("k-suggestion", {
+        "k-disabled": e.disabled
+      })
+    }, [e.text]))]);
+  }
+});
+export {
+  n as SuggestionGroup
+};

package/dist/cdn/js/kendo-vue-conversational-ui.js

@@ -12,4 +12,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("vue"),require("@progress/kendo-vue-common"),require("@progress/kendo-vue-buttons"),require("@progress/kendo-vue-inputs"),require("@progress/kendo-svg-icons"),require("@progress/kendo-vue-layout"),require("@progress/kendo-vue-intl")):"function"==typeof define&&define.amd?define(["exports","vue","@progress/kendo-vue-common","@progress/kendo-vue-buttons","@progress/kendo-vue-inputs","@progress/kendo-svg-icons","@progress/kendo-vue-layout","@progress/kendo-vue-intl"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).KendoVueConversationalUi={},e.Vue,e.KendoVueCommon,e.KendoVueButtons,e.KendoVueInputs,e.KendoSVGIcons,e.KendoVueLayout,e.KendoVueIntl)}(this,(function(e,t,o,n,r,i,a,s){"use strict";function l(e){return"function"==typeof e||"[object Object]"===Object.prototype.toString.call(e)&&!t.isVNode(e)}const d=t.defineComponent({name:"KendoAIPromptHeader",props:{activeView:String,toolbarItems:Array,onActiveviewchange:Function},methods:{handleClick(e){this.$emit("activeviewchange",e)}},render(){let e;const{activeView:r,toolbarItems:i}=this.$props;return t.createVNode("div",{class:"k-prompt-header"},[t.createVNode(n.Toolbar,{overflow:"none",keyboardNavigation:!1,class:"k-toolbar-flat"},l(e=i.map((function(e){const i=o.getTemplate.call(this,{h:t.h,template:e.content,defaultRendering:null,additionalProps:{item:e}});return e.content?i:t.createVNode(n.Button,{type:"button",key:e.name,class:o.classNames("k-toolbar-item",{"k-selected":r===e.name}),size:"medium",themeColor:"primary",fillMode:"flat",rounded:"full",title:e.buttonText,svgIcon:e.buttonIcon,"aria-hidden":"true",onClick:()=>this.handleClick(e.name)},{default:()=>[e.buttonText]})}),this))?e:{default:()=>[e]})])}}),u=t.defineComponent({name:"KendoAIPromptContent",render(){const e=o.getDefaultSlots(this);return t.createVNode("div",{class:"k-prompt-content"},[t.createVNode("div",{class:"k-prompt-view"},[e])])}}),p=t.defineComponent({name:"KendoAIPromptFooter",render(){const e=o.getDefaultSlots(this);return t.createVNode("div",{class:"k-prompt-footer"},[t.createVNode("div",{class:"k-actions k-actions-start k-actions-horizontal k-prompt-actions"},[e])])}}),c=t.defineComponent({name:"KendoAIPromptViewRender",inheritAttrs:!1,props:{name:String},inject:{kendoAIPrompt:{default:null}},render(){const e=o.getDefaultSlots(this);return this.kendoAIPrompt.activeView===this.$props.name?e:null}});function m(e){return"function"==typeof e||"[object Object]"===Object.prototype.toString.call(e)&&!t.isVNode(e)}const h=t.defineComponent({name:"KendoAIPromptExpander",props:{title:String},data:()=>({expanded:!0}),methods:{buttonClick(){this.expanded=!this.expanded}},render(){const e=o.getDefaultSlots(this),{title:r}=this.$props;return t.createVNode("div",{class:"k-prompt-expander"},[t.createVNode(n.Button,{type:"button",fillMode:"flat",svgIcon:this.expanded?i.chevronUpIcon:i.chevronDownIcon,title:r,onClick:this.buttonClick},m(r)?r:{default:()=>[r]}),this.expanded&&t.createVNode("div",{class:"k-prompt-expander-content"},[e])])}});function g(e){return"function"==typeof e||"[object Object]"===Object.prototype.toString.call(e)&&!t.isVNode(e)}const f={name:"prompt-view",buttonText:"Ask AI",buttonIcon:i.sparklesIcon},v=t.defineComponent({name:"KendoAIPromptView",props:{promptInput:[Object,String],generateButton:[Object,String],promptValue:String,promptSuggestions:Array},inject:{kendoAIPrompt:{default:null}},computed:{computedValue(){return void 0!==this.$props.promptValue?this.$props.promptValue:this.value}},data:()=>({value:""}),methods:{handleOnRequest(){this.kendoAIPrompt.onPromptRequest&&this.kendoAIPrompt.onPromptRequest.call(null,this.value),this.value=""},handleSuggestionSelect(e){this.value=e},onTextChange(e){this.value=e.value}},render(){let e;const a="Generate",{promptSuggestions:s}=this.$props,l=o.templateRendering.call(this,this.$props.promptInput,o.getListeners.call(this)),d=t.createVNode(r.TextArea,{value:this.computedValue,onChange:this.onTextChange,placeholder:"Ask or generate content with AI ...",rows:2},null),m=o.getTemplate.call(this,{h:t.h,template:l,defaultRendering:d}),v=o.templateRendering.call(this,this.$props.generateButton,o.getListeners.call(this)),V=t.createVNode(n.Button,{type:"button",themeColor:"primary",fillMode:"solid","aria-hidden":"true",rounded:"full",size:"medium",onClick:this.handleOnRequest,title:"Generate",svgIcon:i.sparklesIcon},g(a)?a:{default:()=>[a]}),I=o.getTemplate.call(this,{h:t.h,template:v,defaultRendering:V});return t.createVNode(c,{name:f.name},{default:()=>[t.createVNode(u,null,{default:()=>[m,s&&s.length>0&&t.createVNode(h,{title:"Prompt Suggestions"},g(e=s.map((function(e){return t.createVNode("div",{key:e,class:"k-prompt-suggestion",onClick:()=>this.handleSuggestionSelect(e)},[e])}),this))?e:{default:()=>[e]})]}),t.createVNode(p,null,g(I)?I:{default:()=>[I]})]})}}),V="avatar.alt",I="messageList.ariaLabel",k="aIPrompt.noOutputs",y={[V]:"Avatar",[I]:"Message list",[k]:"No output from Ai available"};function C(e){return"function"==typeof e||"[object Object]"===Object.prototype.toString.call(e)&&!t.isVNode(e)}let b=function(e){return e.positive="positive",e.negative="negative",e}({});const A={name:"output-view",buttonText:"Output",buttonIcon:i.commentIcon},P=t.defineComponent({name:"KendoAIPromptOutputView",emits:{copy:null,retry:null,rating:null},props:{outputs:Array,outputCard:[String,Function,Object],showOutputRating:Boolean},inject:{kendoAIPrompt:{default:null},kendoLocalizationService:{default:null}},data:()=>({copiedIndex:-1,copyButtonIcon:i.copyIcon}),methods:{retryPrompt(e){this.$emit("retry",e),this.kendoAIPrompt.onPromptRequest&&this.kendoAIPrompt.onPromptRequest.call(null,e.prompt,{...e,isRetry:!0})},copyToClipboard(e,t){null!=e&&e.responseContent&&navigator.clipboard.writeText(e.responseContent),this.copiedIndex=t,this.copyButtonIcon=i.checkIcon,this.$emit("copy",null==e?void 0:e.responseContent),setTimeout((()=>{this.copyButtonIcon=i.copyIcon,this.copiedIndex=-1}),1e3)},outputRating(e,t){this.$emit("rating",e,t),this.kendoAIPrompt.onPromptRequest&&this.kendoAIPrompt.onPromptRequest.call(null,e.prompt,{...e,ratingType:t,isRetry:!1})}},render(){let e;const{outputs:r,showOutputRating:l,outputCard:d}=this.$props,p=s.provideLocalizationService(this),m=o.templateRendering.call(this,d,o.getListeners.call(this));return t.createVNode(c,{name:A.name},{default:()=>[t.createVNode(u,null,{default:()=>[t.createVNode("div",{class:"k-card-list"},[r&&r.length>0?r.map((function(e,r){const s=o.getTemplate.call(this,{h:t.h,template:m,defaultRendering:null,additionalProps:{output:e}});return d?s:t.createVNode(a.Card,{key:e.id,class:e.class},{default:()=>[t.createVNode(a.CardHeader,null,{default:()=>[e.title&&t.createVNode(a.CardTitle,null,{default:()=>[e.title]}),e.subTitle&&t.createVNode(a.CardSubtitle,null,{default:()=>[e.subTitle]})]}),t.createVNode(a.CardBody,null,{default:()=>[e.responseContent]}),t.createVNode(a.CardActions,null,{default:()=>[t.createVNode(n.Button,{type:"button",size:"medium",themeColor:"primary",fillMode:"flat",rounded:"medium",title:"Copy",svgIcon:this.copiedIndex===r?this.copyButtonIcon:i.copyIcon,"aria-hidden":"true",onClick:()=>this.copyToClipboard(e,r)},{default:()=>["Copy"]}),t.createVNode(n.Button,{type:"button",size:"medium",themeColor:"base",fillMode:"flat",rounded:"medium",title:"Retry",svgIcon:i.rotateIcon,"aria-hidden":"true",onClick:()=>this.retryPrompt(e,r)},{default:()=>["Retry"]}),l&&t.createVNode("span",{class:"k-spacer"},null),l&&t.createVNode(n.Button,{type:"button",size:"medium",themeColor:"positive"===e.ratingType?"primary":"base",fillMode:"flat",rounded:"medium",title:"Rate up",svgIcon:i.thumbUpOutlineIcon,"aria-hidden":"true",onClick:()=>this.outputRating(e,"positive")},null),l&&t.createVNode(n.Button,{type:"button",size:"medium",themeColor:"negative"===e.ratingType?"primary":"base",fillMode:"flat",rounded:"medium",title:"Rate down",svgIcon:i.thumbDownOutlineIcon,"aria-hidden":"true",onClick:()=>this.outputRating(e,"negative")},null)]})]})}),this):t.createVNode(a.Card,null,{default:()=>[t.createVNode(a.CardBody,null,C(e=p.toLanguageString(k,y[k]))?e:{default:()=>[e]})]})])]})]})}}),w=t.defineComponent({name:"KendoAIPrompt",props:{activeView:{type:String,required:!0},dir:String,toolbarItems:Array,outputs:Array,promptPlaceholder:String},provide(){return{kendoAIPrompt:this.$data.contextState}},data(){return{contextState:{activeView:this.$props.activeView,onActiveViewChange:this.onActiveViewChange,onPromptRequest:this.onPromptRequest,onCommandExecute:this.onCommandExecute,onStateAction:this.onStateAction}}},watch:{activeView(e){this.contextState.activeView=e}},methods:{onStateAction(e){this.contextState.activeView=e.activeView},onActiveViewChange(e){this.$emit("activeviewchange",e)},onPromptRequest(e,t){this.$emit("promptrequest",e,t)},onCommandExecute(e){this.$emit("commandexecute",e)}},render(){const e=o.getDefaultSlots(this),{toolbarItems:n,dir:r}=this.$props,i=(n||[f,A]).map((e=>{const t=o.templateRendering.call(this,e.content,o.getListeners.call(this));return{...e,content:t}}));return t.createVNode("div",{class:"k-prompt",dir:r},[t.createVNode(d,{activeView:this.contextState.activeView,toolbarItems:i,onActiveviewchange:this.onActiveViewChange},null),e])}}),N={name:"commands-view",buttonIcon:i.moreHorizontalIcon},S=t.defineComponent({name:"KendoAIPromptCommandsView",props:{commands:Array},inject:{kendoAIPrompt:{default:null}},render(){const{commands:e}=this.$props,o=e=>{var t;const o=e.target;(null==(t=o.items)||!t.length)&&this.kendoAIPrompt.onCommandExecute&&(this.$emit("commandexecute",o),this.kendoAIPrompt.onCommandExecute.call(null,o))};return t.createVNode(c,{name:N.name},{default:()=>[t.createVNode(u,null,{default:()=>[t.createVNode("div",{class:"k-prompt-view"},[t.createVNode(a.PanelBar,{onSelect:o,items:e},null)])]})]})}});e.AIPrompt=w,e.AIPromptCommandsView=S,e.AIPromptContent=u,e.AIPromptFooter=p,e.AIPromptHeader=d,e.AIPromptOutputRating=b,e.AIPromptOutputView=P,e.AIPromptView=v,e.AIPromptViewRender=c,e.commandsViewDefaults=N,e.outputViewDefaults=A,e.promptViewDefaults=f}));
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("vue"),require("@progress/kendo-vue-common"),require("@progress/kendo-vue-buttons"),require("@progress/kendo-svg-icons"),require("@progress/kendo-vue-inputs"),require("@progress/kendo-vue-layout"),require("@progress/kendo-vue-intl")):"function"==typeof define&&define.amd?define(["exports","vue","@progress/kendo-vue-common","@progress/kendo-vue-buttons","@progress/kendo-svg-icons","@progress/kendo-vue-inputs","@progress/kendo-vue-layout","@progress/kendo-vue-intl"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).KendoVueConversationalUi={},e.Vue,e.KendoVueCommon,e.KendoVueButtons,e.KendoSVGIcons,e.KendoVueInputs,e.KendoVueLayout,e.KendoVueIntl)}(this,(function(e,t,o,n,i,a,r,l){"use strict";function s(e){return"function"==typeof e||"[object Object]"===Object.prototype.toString.call(e)&&!t.isVNode(e)}const d=t.defineComponent({name:"KendoAIPromptHeader",props:{activeView:String,toolbarItems:Array,onActiveviewchange:Function},methods:{handleClick(e){this.$emit("activeviewchange",e)}},render(){let e;const{activeView:i,toolbarItems:a}=this.$props;return t.createVNode("div",{class:"k-prompt-header"},[t.createVNode(n.Toolbar,{overflow:"none",keyboardNavigation:!1,class:"k-toolbar-flat"},s(e=a.map((function(e){const a=o.getTemplate.call(this,{h:t.h,template:e.content,defaultRendering:null,additionalProps:{item:e}});return e.content?a:t.createVNode(n.Button,{type:"button",key:e.name,class:o.classNames("k-toolbar-item",{"k-selected":i===e.name}),size:"medium",themeColor:"primary",fillMode:"flat",rounded:"full",title:e.buttonText,svgIcon:e.buttonIcon,onClick:()=>this.handleClick(e.name)},{default:()=>[e.buttonText]})}),this))?e:{default:()=>[e]})])}}),u={name:"Output view",buttonText:"Output",buttonIcon:i.commentIcon},c={name:"Commands view",buttonIcon:i.moreHorizontalIcon},p={name:"prompt-view",buttonText:"Ask AI",buttonIcon:i.sparklesIcon},m=t.defineComponent({name:"KendoAIPrompt",props:{activeView:{type:String,required:!0},dir:String,toolbarItems:Array,outputs:Array,promptPlaceholder:String,streaming:Boolean,loading:Boolean},provide(){return{kendoAIPrompt:this.$data.contextState}},data(){return{contextState:{activeView:this.$props.activeView,streaming:this.$props.streaming,loading:this.$props.loading,onCancel:this.onCancel,onActiveViewChange:this.onActiveViewChange,onPromptRequest:this.onPromptRequest,onCommandExecute:this.onCommandExecute,onStateAction:this.onStateAction}}},watch:{activeView(e){this.contextState.activeView=e},streaming(e){this.contextState.streaming=e},loading(e){this.contextState.loading=e}},methods:{onStateAction(e){this.contextState.activeView=e.activeView},onActiveViewChange(e){this.$emit("activeviewchange",e)},onPromptRequest(e,t){this.$emit("promptrequest",e,t)},onCommandExecute(e){this.$emit("commandexecute",e)},onCancel(){this.$emit("cancel")}},render(){const e=o.getDefaultSlots(this),{toolbarItems:n,dir:i}=this.$props,a=(n||[p,u]).map((e=>{const t=o.templateRendering.call(this,e.content,o.getListeners.call(this));return{...e,content:t}}));return t.createVNode("div",{class:"k-prompt",dir:i},[t.createVNode(d,{activeView:this.contextState.activeView,toolbarItems:a,onActiveviewchange:this.onActiveViewChange},null),e])}}),h=t.defineComponent({name:"KendoAIPromptFooter",render(){const e=o.getDefaultSlots(this);return t.createVNode("div",{class:"k-prompt-footer"},[t.createVNode("div",{class:"k-actions k-actions-start k-actions-horizontal k-prompt-actions"},[e])])}}),g=t.defineComponent({name:"KendoAIPromptContent",props:{onCancel:Function,streaming:Boolean},inject:{kendoAIPrompt:{default:null}},computed:{showFloatingButton(){var e;const t=(null==(e=this.kendoAIPrompt)?void 0:e.activeView)===u.name;return this.streaming&&t}},methods:{handleKeyDown(e){"Escape"===e.key&&this.showFloatingButton&&this.onCancel&&(e.preventDefault(),this.$props.onCancel())}},render(){const e=o.getDefaultSlots(this);return t.createVNode("div",{class:"k-prompt-content",onKeydown:this.handleKeyDown},[this.showFloatingButton&&t.createVNode(n.FloatingActionButton,{onClick:this.onCancel,svgIcon:i.stopSmIcon,size:"small",positionMode:"absolute",class:"k-prompt-stop-fab k-generating"},null),t.createVNode("div",{class:"k-prompt-view"},[e])])}}),v=t.defineComponent({name:"KendoAIPromptViewRender",inheritAttrs:!1,props:{name:String},inject:{kendoAIPrompt:{default:null}},render(){const e=o.getDefaultSlots(this);return this.kendoAIPrompt.activeView===this.$props.name?e:null}});function f(e){return"function"==typeof e||"[object Object]"===Object.prototype.toString.call(e)&&!t.isVNode(e)}const k=t.defineComponent({name:"KendoAIPromptExpander",props:{title:String},data:()=>({expanded:!0}),methods:{buttonClick(){this.expanded=!this.expanded}},render(){const e=o.getDefaultSlots(this),{title:a}=this.$props;return t.createVNode("div",{class:"k-prompt-expander"},[t.createVNode(n.Button,{type:"button",fillMode:"flat",svgIcon:this.expanded?i.chevronUpIcon:i.chevronDownIcon,title:a,onClick:this.buttonClick},f(a)?a:{default:()=>[a]}),this.expanded&&t.createVNode("div",{class:"k-prompt-expander-content"},[e])])}}),V=t.defineComponent({name:"KendoSuggestionGroup",props:{suggestions:{type:Array,required:!0},onSuggestionClick:{type:Function,required:!0}},methods:{handleSuggestionClick(e,t){t.disabled||this.onSuggestionClick(e,t)},handleKeyDown(e,t){("Enter"===e.key||" "===e.key)&&(e.preventDefault(),this.onSuggestionClick(e,t))}},render(){const{suggestions:e}=this.$props;return t.createVNode("div",{role:"group",class:"k-suggestion-group"},[e.map((e=>t.createVNode("span",{role:"button",tabindex:e.disabled?-1:0,"aria-label":e.description,"aria-disabled":e.disabled,onClick:t=>!e.disabled&&this.handleSuggestionClick(t,e),onKeydown:t=>!e.disabled&&this.handleKeyDown(t,e),key:e.id,title:e.description,class:o.classNames("k-suggestion",{"k-disabled":e.disabled})},[e.text])))])}});function C(e){return"function"==typeof e||"[object Object]"===Object.prototype.toString.call(e)&&!t.isVNode(e)}const I=t.defineComponent({name:"KendoAIPromptView",props:{promptInput:[Object,String],generateButton:[Object,String],promptValue:String,promptSuggestions:Array,enableSpeechToText:[Boolean,Object]},inject:{kendoAIPrompt:{default:null}},computed:{computedValue(){return void 0!==this.$props.promptValue?this.$props.promptValue:this.value}},data:()=>({value:""}),methods:{handleOnRequest(){this.kendoAIPrompt.onPromptRequest&&this.kendoAIPrompt.onPromptRequest.call(null,this.computedValue),this.value=""},handleSuggestionSelect(e){this.value=e},onTextChange(e){this.value=e.value},onSpeechResult(e){if(e.isFinal&&e.alternatives.length>0){const t=e.alternatives[0].transcript,o=this.value,n=o&&!o.endsWith(" ")&&!o.endsWith("\n");this.value=o+(n?" ":"")+t}},onSpeechStart(){},onSpeechEnd(){},getButtonDisabledState(){const e=void 0!==this.$props.promptValue?this.$props.promptValue:this.value;return!(null!=e&&e.trim())}},render(){const e="Generate",{promptSuggestions:r,enableSpeechToText:l}=this.$props,s=o.templateRendering.call(this,this.$props.promptInput,o.getListeners.call(this)),d=t.createVNode(a.TextArea,{value:this.computedValue,onInput:this.onTextChange,placeholder:"Ask or generate content with AI ...",rows:2,class:"!k-flex-col",inputSuffix:()=>l?t.createVNode("div",{class:"k-input-suffix k-input-suffix-horizontal"},[t.createVNode(n.SpeechToTextButton,t.mergeProps({fillMode:"flat",onStart:this.onSpeechStart,onEnd:this.onSpeechEnd,onResult:this.onSpeechResult},"object"==typeof l?l:{}),null)]):null},null),u=o.getTemplate.call(this,{h:t.h,template:s,defaultRendering:d}),c=o.templateRendering.call(this,this.$props.generateButton,o.getListeners.call(this)),m=t.createVNode(n.Button,{type:"button",themeColor:"primary",fillMode:"solid","aria-hidden":"true",rounded:"full",size:"medium",onClick:this.handleOnRequest,disabled:this.getButtonDisabledState(),title:"Generate",svgIcon:i.sparklesIcon},C(e)?e:{default:()=>[e]}),f=o.getTemplate.call(this,{h:t.h,template:c,defaultRendering:m});return t.createVNode(v,{name:p.name},{default:()=>{var e,o;return[t.createVNode(g,{streaming:null==(e=this.kendoAIPrompt)?void 0:e.streaming,onCancel:null==(o=this.kendoAIPrompt)?void 0:o.onCancel},{default:()=>[u,r&&r.length>0&&t.createVNode(k,{title:"Prompt Suggestions"},{default:()=>[t.createVNode(V,{suggestions:r.map(((e,t)=>({id:t,text:e,description:e}))),onSuggestionClick:(e,t)=>this.handleSuggestionSelect(t.text)},null)]})]}),t.createVNode(h,null,C(f)?f:{default:()=>[f]})]}})}}),y="avatar.alt",b="messageList.ariaLabel",A="aIPrompt.noOutputs",S={[y]:"Avatar",[b]:"Message list",[A]:"No output from Ai available"};function N(e){return"function"==typeof e||"[object Object]"===Object.prototype.toString.call(e)&&!t.isVNode(e)}let w=function(e){return e.positive="positive",e.negative="negative",e}({});const P=t.defineComponent({name:"KendoAIPromptOutputView",emits:{copy:null,retry:null,rating:null},props:{outputs:Array,outputCard:Object,showOutputRating:Boolean},inject:{kendoAIPrompt:{default:null},kendoLocalizationService:{default:null}},data:()=>({copiedIndex:-1,copyButtonIcon:i.copyIcon,contentRef:null}),methods:{retryPrompt(e){this.$emit("retry",e),this.kendoAIPrompt.onPromptRequest&&this.kendoAIPrompt.onPromptRequest.call(null,e.prompt,{...e,isRetry:!0}),this.scrollToTopOutput()},copyToClipboard(e,t){null!=e&&e.responseContent&&navigator.clipboard.writeText(e.responseContent),this.copiedIndex=t,this.copyButtonIcon=i.checkIcon,this.$emit("copy",null==e?void 0:e.responseContent),setTimeout((()=>{this.copyButtonIcon=i.copyIcon,this.copiedIndex=-1}),1e3)},outputRating(e,t){this.$emit("rating",e,t),this.kendoAIPrompt.onPromptRequest&&this.kendoAIPrompt.onPromptRequest.call(null,e.prompt,{...e,ratingType:t,isRetry:!1}),this.scrollToTopOutput()},scrollToTopOutput(){var e,t;null==(t=null==(e=this.contentRef)?void 0:e.scrollTo)||t.call(e,{top:0,behavior:"smooth"})}},render(){let e;const{outputs:o,showOutputRating:a,outputCard:s}=this.$props,d=l.provideLocalizationService(this),{header:c,body:p,actions:m}=s||{},h=t.createVNode(r.Card,null,{default:()=>[t.createVNode(r.CardHeader,null,{default:()=>[t.createVNode(r.CardTitle,null,{default:()=>[t.createVNode("span",{class:"k-skeleton k-skeleton-text k-skeleton-pulse",style:{width:"200px"}},null)]}),t.createVNode(r.CardSubtitle,null,{default:()=>[t.createVNode("span",{class:"k-skeleton k-skeleton-text k-skeleton-pulse",style:{width:"100%"}},null)]})]}),t.createVNode(r.CardBody,null,{default:()=>[t.createVNode("span",{class:"k-skeleton k-skeleton-rect k-skeleton-pulse",style:{height:"80px"}},null)]}),t.createVNode(r.CardActions,null,{default:()=>[t.createVNode("span",{class:"k-skeleton k-skeleton-text k-skeleton-pulse",style:{width:"100%"}},null)]})]}),f=null==o?void 0:o.map(((e,o)=>t.createVNode(r.Card,{key:`${e.id}_${o}`,class:e.class},{default:()=>[t.createVNode(r.CardHeader,null,{default:()=>[c?c(e):t.createVNode(t.Fragment,null,[e.title&&t.createVNode(r.CardTitle,null,{default:()=>[e.title]}),e.subTitle&&t.createVNode(r.CardSubtitle,null,{default:()=>[e.subTitle]})])]}),t.createVNode(r.CardBody,null,{default:()=>[p?p(e):e.responseContent]}),t.createVNode(r.CardActions,null,{default:()=>[m?m(e):t.createVNode(t.Fragment,null,[t.createVNode(n.Button,{type:"button",size:"medium",themeColor:"primary",fillMode:"flat",rounded:"medium",title:"Copy",svgIcon:this.copiedIndex===o?this.copyButtonIcon:i.copyIcon,"aria-hidden":"true",onClick:()=>this.copyToClipboard(e,o)},{default:()=>["Copy"]}),t.createVNode(n.Button,{type:"button",size:"medium",themeColor:"base",fillMode:"flat",rounded:"medium",title:"Retry",svgIcon:i.arrowRotateCwIcon,"aria-hidden":"true",onClick:()=>this.retryPrompt(e)},{default:()=>["Retry"]}),a&&t.createVNode(t.Fragment,null,[t.createVNode("span",{class:"k-spacer"},null),t.createVNode(n.Button,{type:"button",size:"medium",themeColor:"positive"===e.ratingType?"primary":"base",fillMode:"flat",rounded:"medium",title:"Rate up",svgIcon:i.thumbUpOutlineIcon,"aria-hidden":"true",onClick:()=>this.outputRating(e,"positive")},null),t.createVNode(n.Button,{type:"button",size:"medium",themeColor:"negative"===e.ratingType?"primary":"base",fillMode:"flat",rounded:"medium",title:"Rate down",svgIcon:i.thumbDownOutlineIcon,"aria-hidden":"true",onClick:()=>this.outputRating(e,"negative")},null)])])]})]}))),k=t.createVNode(r.Card,null,{default:()=>[t.createVNode(r.CardBody,null,N(e=d.toLanguageString(A,S[A]))?e:{default:()=>[e]})]});return t.createVNode(v,{name:u.name},{default:()=>{var e,o;return[t.createVNode(g,{ref:e=>this.contentRef=e,streaming:null==(e=this.kendoAIPrompt)?void 0:e.streaming,onCancel:null==(o=this.kendoAIPrompt)?void 0:o.onCancel},{default:()=>{var e,o;return[t.createVNode("div",{class:"k-card-list"},[(null==(e=this.kendoAIPrompt)?void 0:e.loading)&&h,f,(!f||0===f.length)&&!(null!=(o=this.kendoAIPrompt)&&o.loading)&&k])]}})]}})}}),x=t.defineComponent({name:"KendoAIPromptCommandsView",props:{commands:Array},inject:{kendoAIPrompt:{default:null}},render(){const{commands:e}=this.$props,o=e=>{var t;const o=e.target;(null==(t=o.items)||!t.length)&&this.kendoAIPrompt.onCommandExecute&&(this.$emit("commandexecute",o),this.kendoAIPrompt.onCommandExecute.call(null,o))};return t.createVNode(v,{name:c.name},{default:()=>{var n,i;return[t.createVNode(g,{streaming:null==(n=this.kendoAIPrompt)?void 0:n.streaming,onCancel:null==(i=this.kendoAIPrompt)?void 0:i.onCancel},{default:()=>[t.createVNode("div",{class:"k-prompt-view"},[t.createVNode(r.PanelBar,{onSelect:o,items:e},null)])]})]}})}});e.AIPrompt=m,e.AIPromptCommandsView=x,e.AIPromptContent=g,e.AIPromptFooter=h,e.AIPromptHeader=d,e.AIPromptOutputRating=w,e.AIPromptOutputView=P,e.AIPromptView=I,e.AIPromptViewRender=v,e.SuggestionGroup=V,e.commandsViewDefaults=c,e.outputViewDefaults=u,e.promptViewDefaults=p}));

package/index.d.mts

@@ -26,6 +26,8 @@ dir: PropType<string>;
 toolbarItems: PropType<AIPromptToolbarItemInterface[]>;
 outputs: PropType<AIPromptOutputInterface[]>;
 promptPlaceholder: PropType<string>;
+streaming: PropType<boolean>;
+loading: PropType<boolean>;
 }>, {}, {
 contextState: AIPromptContextInterface;
 }, {}, {
@@ -33,6 +35,7 @@ onStateAction(action: StateActionInterface): void;
 onActiveViewChange(event: string): void;
 onPromptRequest(prompt?: string, outputItem?: AIPromptOutputInterface): void;
 onCommandExecute(event: AIPromptCommandInterface): void;
+onCancel(): void;
 }, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes<    {
 activeView: {
 type: PropType<string>;
@@ -42,10 +45,30 @@ dir: PropType<string>;
 toolbarItems: PropType<AIPromptToolbarItemInterface[]>;
 outputs: PropType<AIPromptOutputInterface[]>;
 promptPlaceholder: PropType<string>;
+streaming: PropType<boolean>;
+loading: PropType<boolean>;
 }>> & Readonly<{}>, {}, {}, {}, {}, string, () => {
 kendoAIPrompt: any;
 }, true, {}, any>;
 
+/**
+ * The fields of the AIPromptOutputView card prop.
+ */
+export declare interface AIPromptCardInterface {
+    /**
+     * Custom template for AIPromptCard header.
+     */
+    header?: (props: AIPromptOutputInterface) => any;
+    /**
+     * Custom template for AIPromptCard body.
+     */
+    body?: (props: AIPromptOutputInterface) => any;
+    /**
+     * Custom template for AIPromptCard actions.
+     */
+    actions?: (props: AIPromptOutputInterface) => any;
+}
+
 /**
  * An interface for the Command view command.
  */
@@ -82,13 +105,26 @@ export declare interface AIPromptCommandsViewProps {
 /**
  * @hidden
  */
-export declare const AIPromptContent: DefineComponent<    {}, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
+export declare const AIPromptContent: DefineComponent<ExtractPropTypes<    {
+onCancel: PropType<() => void>;
+streaming: PropType<boolean>;
+}>, {}, {}, {
+showFloatingButton(): boolean;
+}, {
+handleKeyDown(event: KeyboardEvent): void;
+}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes<    {
+onCancel: PropType<() => void>;
+streaming: PropType<boolean>;
+}>> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
 
 /**
  * The AIPrompt context that is passed to the view.
  */
 declare interface AIPromptContextInterface {
     activeView?: string;
+    streaming?: boolean;
+    loading?: boolean;
+    onCancel?: () => void;
     onPromptRequest?: (prompt?: string, outputItem?: AIPromptOutputInterface) => void;
     onCommandExecute?: (command: AIPromptCommandInterface) => void;
     onActiveViewChange?: (view: string) => void;
@@ -173,27 +209,29 @@ export declare enum AIPromptOutputRating {
  */
 export declare const AIPromptOutputView: DefineComponent<ExtractPropTypes<    {
 outputs: PropType<AIPromptOutputInterface[]>;
-outputCard: PropType<string | Function>;
+outputCard: PropType<AIPromptCardInterface>;
 showOutputRating: PropType<boolean>;
 }>, {}, {
 copiedIndex: number;
 copyButtonIcon: SVGIcon;
+contentRef: any;
 }, {}, {
 retryPrompt(output: AIPromptOutputInterface): void;
 copyToClipboard(output: AIPromptOutputInterface, index: number): void;
 outputRating(output: AIPromptOutputInterface, ratingType: AIPromptOutputRating): void;
+scrollToTopOutput(): void;
 }, ComponentOptionsMixin, ComponentOptionsMixin, {
 copy: any;
 retry: any;
 rating: any;
 }, string, PublicProps, Readonly<ExtractPropTypes<    {
 outputs: PropType<AIPromptOutputInterface[]>;
-outputCard: PropType<string | Function>;
+outputCard: PropType<AIPromptCardInterface>;
 showOutputRating: PropType<boolean>;
 }>> & Readonly<{
 onCopy?: (...args: any[] | unknown[]) => any;
-onRating?: (...args: any[] | unknown[]) => any;
 onRetry?: (...args: any[] | unknown[]) => any;
+onRating?: (...args: any[] | unknown[]) => any;
 }>, {}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
 
 /**
@@ -205,10 +243,13 @@ export declare interface AIPromptOutputViewProps {
      */
     outputs?: AIPromptOutputInterface[];
     /**
-     * Represents a template that allows you to define custom Card .It accepts string of a named slot or a render function.
+     * Represents a template that allows you to define custom Card fields for:
+     * header
+     * body
+     * actions
      * The custom fields will override the default one.
      */
-    outputCard?: string | Function;
+    outputCard?: AIPromptCardInterface;
     /**
      * Specifies if the rating buttons in each card will be rendered.
      * By default, rating buttons are not rendered.
@@ -254,6 +295,14 @@ export declare interface AIPromptProps {
      * The direction of the Prompt.
      */
     dir?: string;
+    /**
+     * If true, the prompt is in a streaming state.
+     */
+    streaming?: boolean;
+    /**
+     * If true, the prompt is in a loading state.
+     */
+    loading?: boolean;
     /**
      * The onActiveViewChange event handler of the Kendo UI for Vue AIPrompt component.
      * Fires when active view is changed. Exposes the name of the new active view as event data.
@@ -269,6 +318,10 @@ export declare interface AIPromptProps {
      * Fires when user clicks the `Generate` button in the Prompt view.
      */
     onPromptrequest?: (prompt?: string, outputItem?: AIPromptOutputInterface) => void;
+    /**
+     * Called when the prompt is cancelled.
+     */
+    onCancel?: () => void;
 }
 
 /**
@@ -301,6 +354,7 @@ promptInput: PropType<any>;
 generateButton: PropType<any>;
 promptValue: PropType<string>;
 promptSuggestions: PropType<string[]>;
+enableSpeechToText: PropType<boolean | object>;
 }>, {}, {
 value: string;
 }, {
@@ -309,11 +363,16 @@ computedValue(): any;
 handleOnRequest(): void;
 handleSuggestionSelect(suggestion: string): void;
 onTextChange(event: any): void;
+onSpeechResult(event: any): void;
+onSpeechStart(): void;
+onSpeechEnd(): void;
+getButtonDisabledState(): boolean;
 }, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes<    {
 promptInput: PropType<any>;
 generateButton: PropType<any>;
 promptValue: PropType<string>;
 promptSuggestions: PropType<string[]>;
+enableSpeechToText: PropType<boolean | object>;
 }>> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
 
 /**
@@ -335,6 +394,18 @@ export declare interface AIPromptViewRenderProps {
     name: string;
 }
 
+/**
+ * Represents the structure of a chat suggestion item that can be displayed above the message input.
+ *
+ * @interface ChatSuggestion
+ */
+export declare interface ChatSuggestion {
+    id: string | number;
+    text: string;
+    description?: string;
+    disabled?: boolean;
+}
+
 /**
  * @hidden
  */
@@ -375,4 +446,35 @@ declare interface StateActionInterface {
     activeView: string;
 }
 
+/**
+ * @hidden
+ */
+export declare const SuggestionGroup: DefineComponent<ExtractPropTypes<    {
+suggestions: {
+type: PropType<ChatSuggestion[]>;
+required: true;
+};
+onSuggestionClick: {
+type: PropType<(event: MouseEvent, suggestion: ChatSuggestion) => void>;
+required: true;
+};
+}>, {}, {}, {}, {
+handleSuggestionClick(event: MouseEvent, suggestion: ChatSuggestion): void;
+handleKeyDown(event: KeyboardEvent, suggestion: ChatSuggestion): void;
+}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes<    {
+suggestions: {
+type: PropType<ChatSuggestion[]>;
+required: true;
+};
+onSuggestionClick: {
+type: PropType<(event: MouseEvent, suggestion: ChatSuggestion) => void>;
+required: true;
+};
+}>> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
+
+export declare interface SuggestionGroupProps {
+    suggestions: ChatSuggestion[];
+    onSuggestionClick: (event: MouseEvent, suggestion: ChatSuggestion) => void;
+}
+
 export { }