Voice Checkbox

Voice Checkbox is a voice-enabled checkbox component. It changes to checked if the specified entity type is found in the SpeechSegment.

Preview

Voice Checkbox

Voice Checkbox dressed in capsule and mui themes. See styling the components for more information.

Usage

You’ll need a Speechly React app and a Speechly configuration that tags entities in phrases to use this component.

Ensure you have added the @speechly/react-voice-forms dependency:

npm i @speechly/react-voice-forms

Import the component and a css theme:

import { VoiceCheckbox } from '@speechly/react-voice-forms'
import '@speechly/react-voice-forms/css/theme/mui.css'

Place the form component somewhere inside your SpeechProvider block:

<SpeechProvider appId="YOUR_APP_ID_FROM_SPEECHLY_DASHBOARD">
  <VoiceCheckbox
    label="Direct"
    changeOnEntityType="direct"
  />
</SpeechProvider>

Properties

NameTypeDescription
labelstringThe label displayed on the component. For speech use, the label should match the keywords in the phrase used to control the widget: e.g. component with label “Passengers” should be configured to react to phrases like “3 passegers”
setOnEntityTypestringstring (entity type) sets (checks) this widget if a matched entity type is found in the SpeechSegment.
value?booleanThe current value. Specifying the value controls the components’s state so it makes sense to provide an onChange handler.
defaultValue?booleanInitial checked state. Has no effect if value is specified.
intent?stringstring (intent) filters out all but the specified intent. undefined sets on any intent.
clearIntent?stringstring (intent) forces clearing values both on setOnEntityType and clearOnEntityType.
clearOnEntityType?stringstring (entity type) clears (unchecks) this widget if a matched entity type is found in the SpeechSegment.
onChange?(value: boolean) => void

Last updated by Mathias Lindholm on January 26, 2022 at 11:48 +0200

Found an error on our documentation? Please file an issue or make a pull request