-
Notifications
You must be signed in to change notification settings - Fork 667
Chat: Add STT integration types #32399
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Chat: Add STT integration types #32399
Conversation
d4cfd5d to
23ddc4a
Compare
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Pull request overview
This pull request adds Speech-to-Text (STT) integration types to the Chat component, along with an inputFieldText property. The changes include TypeScript type declarations and updates to the Angular, React, and Vue framework wrappers.
Changes:
- Added
speechToTextOptionsandinputFieldTextproperties to Chat TypeScript declarations - Updated Vue wrapper with STT integration types and nested components
- Updated React wrapper with STT integration types and nested components
- Updated Angular wrapper with STT integration types and nested components
- Modified Angular metadata generation to exclude
speechToTextOptionsfrom generation - Added Angular suggestion components (appears unrelated to STT)
Reviewed changes
Copilot reviewed 13 out of 15 changed files in this pull request and generated 6 comments.
Show a summary per file
| File | Description |
|---|---|
| packages/devextreme/ts/dx.all.d.ts | Adds inputFieldText and speechToTextOptions properties to dxChatOptions interface |
| packages/devextreme/js/ui/chat.d.ts | Adds SpeechToTextOptions import and new property definitions with JSDoc comments |
| packages/devextreme-vue/src/chat.ts | Adds STT-related imports, types, and nested components (DxSpeechToTextOptions, DxSpeechRecognitionConfig, DxCustomSpeechRecognizer) |
| packages/devextreme-react/src/chat.ts | Adds STT-related imports, types, and nested components with React-specific implementations |
| packages/devextreme-metadata/make-angular-metadata.ts | Excludes speechToTextOptions from Angular metadata generation |
| packages/devextreme-angular/src/ui/nested/suggestion-dxi.ts | Adds generic suggestion component (unrelated to STT, appears incomplete) |
| packages/devextreme-angular/src/ui/nested/index.ts | Exports the new suggestion component |
| packages/devextreme-angular/src/ui/nested/base/suggestion-dxi.ts | Adds base class for suggestion component |
| packages/devextreme-angular/src/ui/nested/base/index.ts | Exports base suggestion class |
| packages/devextreme-angular/src/ui/chat/nested/suggestion-dxi.ts | Adds chat-specific suggestion component (unrelated to STT, appears incomplete) |
| packages/devextreme-angular/src/ui/chat/nested/speech-to-text-options.ts | Adds Angular nested component for STT options |
| packages/devextreme-angular/src/ui/chat/nested/speech-recognition-config.ts | Adds Angular nested component for speech recognition configuration |
| packages/devextreme-angular/src/ui/chat/nested/index.ts | Exports new STT and suggestion components |
| packages/devextreme-angular/src/ui/chat/nested/custom-speech-recognizer.ts | Adds Angular nested component for custom speech recognizer |
| packages/devextreme-angular/src/ui/chat/index.ts | Adds speechToTextOptions property and imports for STT-related modules |
Comments suppressed due to low confidence (1)
packages/devextreme-vue/src/chat.ts:119
- The inputFieldText property is missing from the Vue wrapper. While it's added to the TypeScript declarations (chat.d.ts line 442 and dx.all.d.ts line 11420), it's not included in the Vue component's AccessibleOptions type or in the component configuration. This property should be added to maintain consistency across all wrappers.
type AccessibleOptions = Pick<Properties,
"accessKey" |
"activeStateEnabled" |
"alerts" |
"dataSource" |
"dayHeaderFormat" |
"disabled" |
"editing" |
"elementAttr" |
"emptyViewTemplate" |
"fileUploaderOptions" |
"focusStateEnabled" |
"height" |
"hint" |
"hoverStateEnabled" |
"items" |
"messageTemplate" |
"messageTimestampFormat" |
"onAttachmentDownloadClick" |
"onDisposing" |
"onInitialized" |
"onMessageDeleted" |
"onMessageDeleting" |
"onMessageEditCanceled" |
"onMessageEditingStart" |
"onMessageEntered" |
"onMessageUpdated" |
"onMessageUpdating" |
"onOptionChanged" |
"onTypingEnd" |
"onTypingStart" |
"reloadOnChange" |
"rtlEnabled" |
"showAvatar" |
"showDayHeaders" |
"showMessageTimestamp" |
"showUserName" |
"speechToTextOptions" |
"typingUsers" |
"user" |
"visible" |
"width"
>;
packages/devextreme-angular/src/ui/chat/nested/suggestion-dxi.ts
Outdated
Show resolved
Hide resolved
packages/devextreme-angular/src/ui/nested/base/suggestion-dxi.ts
Outdated
Show resolved
Hide resolved
23ddc4a to
981170f
Compare
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Copilot wasn't able to review any files in this pull request.
3d1c909 to
a4037e1
Compare
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Pull request overview
Copilot reviewed 7 out of 9 changed files in this pull request and generated no new comments.
c887fc9 to
720e61a
Compare
packages/devextreme-angular/src/ui/chat/nested/speech-to-text-options.ts
Show resolved
Hide resolved
e3a79b2 to
720e61a
Compare
933b12f to
7946646
Compare
7946646 to
ebbfe52
Compare
3c75c19 to
0e25ee4
Compare
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Pull request overview
Copilot reviewed 8 out of 11 changed files in this pull request and generated 9 comments.
| stopText: String, | ||
| stylingMode: String as PropType<ButtonStyle>, | ||
| tabIndex: Number, | ||
| type: String as PropType<ButtonType | string>, | ||
| visible: Boolean, |
Copilot
AI
Feb 10, 2026
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
dxChatOptions.speechToTextOptions is declared as Omit<..., 'stylingMode' | 'type'> in the core typings, but the Vue nested DxSpeechToTextOptions configuration component still exposes stylingMode and type. This makes the wrapper API inconsistent with the core widget contract. Please remove these props/emitters from the nested option component (or reconsider the Omit in core typings if those options are actually supported).
| import { Store } from 'devextreme/data/store'; | ||
| import { Format } from 'devextreme/common/core/localization'; | ||
| import { dxFileUploaderOptions } from 'devextreme/ui/file_uploader'; | ||
| import { dxSpeechToTextOptions } from 'devextreme/ui/speech_to_text'; |
Copilot
AI
Feb 10, 2026
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
The Angular wrapper imports dxSpeechToTextOptions from devextreme/ui/speech_to_text, but that module's typings do not export a dxSpeechToTextOptions symbol (it exports Properties). This will break TypeScript builds. Please import Properties (aliased) instead, or add a dxSpeechToTextOptions export in the core speech_to_text.d.ts.
| import { dxSpeechToTextOptions } from 'devextreme/ui/speech_to_text'; | |
| import { Properties as dxSpeechToTextOptions } from 'devextreme/ui/speech_to_text'; |
| get inputFieldText(): any { | ||
| return this._getOption('inputFieldText'); | ||
| } | ||
| set inputFieldText(value: any) { |
Copilot
AI
Feb 10, 2026
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
inputFieldText is typed as any in the Angular wrapper, but in core typings it resolves to dxTextAreaOptions['value'] (currently string). Please use a specific type (e.g., string) for the @Input() and the corresponding inputFieldTextChange emitter to keep wrapper typings accurate.
| get inputFieldText(): any { | |
| return this._getOption('inputFieldText'); | |
| } | |
| set inputFieldText(value: any) { | |
| get inputFieldText(): string { | |
| return this._getOption('inputFieldText'); | |
| } | |
| set inputFieldText(value: string) { |
| @Input() | ||
| get stylingMode(): ButtonStyle { | ||
| return this._getOption('stylingMode'); | ||
| } | ||
| set stylingMode(value: ButtonStyle) { | ||
| this._setOption('stylingMode', value); | ||
| } | ||
|
|
||
| @Input() | ||
| get tabIndex(): number { | ||
| return this._getOption('tabIndex'); | ||
| } | ||
| set tabIndex(value: number) { | ||
| this._setOption('tabIndex', value); | ||
| } | ||
|
|
||
| @Input() | ||
| get type(): ButtonType | string { | ||
| return this._getOption('type'); | ||
| } | ||
| set type(value: ButtonType | string) { | ||
| this._setOption('type', value); |
Copilot
AI
Feb 10, 2026
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This nested Angular option component exposes stylingMode and type, but the core Chat option is Omit<dxSpeechToText.Properties, 'stylingMode' | 'type'>. Please remove these inputs (and related imports) from DxoChatSpeechToTextOptionsComponent to match what dxChat actually accepts.
| showMessageTimestamp: Boolean, | ||
| showUserName: Boolean, | ||
| speechToTextOptions: Object as PropType<dxSpeechToTextOptions | Record<string, any> | WidgetOptions>, | ||
| typingUsers: Array as PropType<Array<User>>, |
Copilot
AI
Feb 10, 2026
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
speechToTextOptions is typed as dxSpeechToTextOptions | Record<string, any> | WidgetOptions, but dxSpeechToTextOptions already extends widget options and adding WidgetOptions broadens the type to allow unrelated widget options. Please remove WidgetOptions from this union (and the corresponding import) unless there is a concrete need for it.
| stylingMode?: ButtonStyle; | ||
| tabIndex?: number; | ||
| type?: ButtonType | string; |
Copilot
AI
Feb 10, 2026
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
dxChatOptions.speechToTextOptions is typed as Omit<SpeechToTextOptions, 'stylingMode' | 'type'> in devextreme/ui/chat, but the React nested SpeechToTextOptions component still allows stylingMode and type. This is inconsistent with the core option type and suggests users can set options that Chat explicitly omits. Please remove these props from ISpeechToTextOptionsProps (or adjust the core type if Chat actually supports them).
| stylingMode?: ButtonStyle; | |
| tabIndex?: number; | |
| type?: ButtonType | string; | |
| tabIndex?: number; |
|
|
||
| @Input() | ||
| get speechToTextOptions(): dxSpeechToTextOptions { | ||
| return this._getOption('speechToTextOptions'); | ||
| } | ||
| set speechToTextOptions(value: dxSpeechToTextOptions) { | ||
| this._setOption('speechToTextOptions', value); | ||
| } |
Copilot
AI
Feb 10, 2026
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
The Angular wrapper types speechToTextOptions as dxSpeechToTextOptions, but the core dxChatOptions.speechToTextOptions is Omit<SpeechToTextOptions, 'stylingMode' | 'type'>. Please align the wrapper type with the core widget option (and also update speechToTextOptionsChange) so consumers can’t set options that the Chat widget omits.
| import { | ||
| dxSpeechToTextOptions, | ||
| CustomSpeechRecognizer, | ||
| ContentReadyEvent as SpeechToTextContentReadyEvent, | ||
| DisposingEvent as SpeechToTextDisposingEvent, | ||
| EndEvent, | ||
| ErrorEvent, | ||
| InitializedEvent as SpeechToTextInitializedEvent, | ||
| OptionChangedEvent as SpeechToTextOptionChangedEvent, | ||
| ResultEvent, | ||
| StartClickEvent, | ||
| StopClickEvent, | ||
| SpeechRecognitionConfig, | ||
| } from "devextreme/ui/speech_to_text"; |
Copilot
AI
Feb 10, 2026
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
The Vue wrapper imports dxSpeechToTextOptions from devextreme/ui/speech_to_text, but that module's typings do not export a dxSpeechToTextOptions symbol (it exports Properties). This will fail typechecking. Please import Properties (optionally aliased) instead, or add an explicit dxSpeechToTextOptions export in the core speech_to_text.d.ts.
packages/devextreme-vue/src/chat.ts
Outdated
| height: [Number, String], | ||
| hint: String, | ||
| hoverStateEnabled: Boolean, | ||
| inputFieldText: {}, |
Copilot
AI
Feb 10, 2026
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
inputFieldText is typed as an untyped prop ({}), which makes it effectively any in the Vue wrapper. In core typings it resolves to dxTextAreaOptions['value'] (currently string). Please type this prop as String/PropType<string> to match the DevExtreme API and keep wrapper typings accurate.
| inputFieldText: {}, | |
| inputFieldText: String, |
Moved to: