@ask-utils/speech-script

JSX Speech Script

https://ask-utils.dev

Simple skill handler routing libs.

Getting started

$ npm i -S @ask-utils/speech-script

Basic Usage

/** @jsx ssml */
import {
    StandardSkillFactory
} from 'ask-sdk'
import {
    ssml,
    SpeechScriptJSX
} from '../dist/index'
import { LaunchRequest } from 'ask-sdk-model'

/**
 * SSML component like React
 **/
class LaunchRequestScript extends SpeechScriptJSX<LaunchRequest> {
    speech() {
        const { locale } = this.props.request
        if (/^ja/.test(locale)) {
            return (
                <speak>こんにちは！<break time="0.5s"/>お元気ですか？</speak>
            )
        }
        return (
            <speak>
                Hello! <break time="0.5s"/>How are you?
            </speak>
        )
    }
    reprompt() {
        const { locale } = this.props.request
        if (/^ja/.test(locale)) {
            return (
                <speak>
                    お元気ですか？<break time="0.5s"/>
                    <amazon-effect name="whispered">今日はいい日になるといいですね。</amazon-effect>
                </speak>
            )
        }
        return (
            <speak>
                How are you?<break time="0.5s"/>
                <amazon-effect name="whispered">I hope you to have a good day.</amazon-effect>
            </speak>
        )

    }
}

/**
 * Use the SSML component in your RequestHandler
 **/
export const handler = StandardSkillFactory.init()
.addRequestHandlers({
    canHandle(handlerInput) {
        return handlerInput.requestEnvelope.request.type === 'LaunchRequest'
    },
    handle(handlerInput) {
        const Speech = new LaunchRequestScript(handlerInput)
        const {
            speech,
            reprompt,
        } = Speech.create()
        return handlerInput.responseBuilder
            .speak(speech)
            .reprompt(reprompt)
            .getResponse()
    }
}).lambda()

[Advanced] pass optional props from handler

We can pass additional properties from handler to JSX element.

/** @jsx ssml */
import {
    StandardSkillFactory
} from 'ask-sdk'
import {
    ssml,
    SpeechScriptJSX
} from '../dist/index'
import { LaunchRequest } from 'ask-sdk-model'

/**
 * SSML component like React
 **/
class LaunchRequestScript extends SpeechScriptJSX<LaunchRequest, {name: string}> {
    speech() {
        const name = this.options ? `${this.options.name}-san` : ''
        return (
            <speak>
                Hello {name}! <break time="0.5s"/>How are you?
            </speak>
        )
    }
}

/**
 * Use the SSML component in your RequestHandler
 **/
export const handler = StandardSkillFactory.init()
.addRequestHandlers({
    canHandle(handlerInput) {
        return handlerInput.requestEnvelope.request.type === 'LaunchRequest'
    },
    handle(handlerInput) {
        const Speech = new LaunchRequestScript(handlerInput, {
            name: 'John'
        })
        return Speech.createResponse()
    }
}).lambda()