Skip to content

Implements voice powered input for Lightning Web Component with Web Speech API and SpeechRecognition.

License

Notifications You must be signed in to change notification settings

ninoish/lwc-web-speech-api-input

Repository files navigation

LWC Web Speech API Input

lwc-web-speech-api-example.mov

An experimental implementation of voice powered input for Lightning Web Component with Web Speech API and SpeechRecognition Interface, the native browswer Javascript API for free.

Settings

Properties

  • Language
  • Min textarea height
  • Show toast notification on error
  • Textarea Label

web-speech-api-comp-props

How to use

Place c-web-speech-api-input component where you want with props. onchangevalue event returns the value of the input in its detail prop.

  <c-web-speech-api-input
    min-height="200"
    input-label="Test Input"
    show-toast-on-error="true"
    language={language}
    onchangevalue={handleInputChange}
  ></c-web-speech-api-input>

If you want to set up the language flexibly, it can be configured via Apex Picklist. Set the property fetching datasource in your .js-meta.xml file.

    <property name="language"  type="String" label="Language" datasource="apex://WebSpeechApiPicklist"/>

Considerations

Disclaimer

This is an experimental demo implementation. It doesn't ensure code integrity. Please confirm the code before you deploy.

About

Implements voice powered input for Lightning Web Component with Web Speech API and SpeechRecognition.

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published