For AI agents: a documentation index is available at the root level at /llms.txt and /llms-full.txt. Append /llms.txt to any URL for a page-level index, or .md for the markdown version of any page.
Log inSign up
Support
GuidesReferenceClick-to-Call
GuidesReferenceClick-to-Call
  • Core
    • Overview
  • Entities
    • SignalWire
    • Address
    • Participant
    • ClientPreferences
    • SelfCapabilities
    • SelfParticipant
    • User
    • WebRTCCall
  • Web Components
    • Overview
    • sw-audio-level
    • sw-call-controls
    • sw-call-dialpad
    • sw-call-media
    • sw-call-provider
    • sw-call-status
    • sw-call-widget
    • sw-click-to-call
    • sw-device-selector
    • sw-directory
    • sw-local-camera
    • sw-participant-controls
    • sw-participants
    • sw-self-media
    • sw-ui-alert
    • sw-ui-background
    • sw-ui-call-layout
    • sw-ui-content-drawer
    • sw-ui-control-bar
    • sw-ui-dialpad
    • sw-ui-dropup
    • sw-ui-icon
    • sw-ui-modal
    • sw-ui-responsive-container
    • sw-ui-split-button
    • sw-ui-transcript-view
LogoLogoSignalWire Docs
Log inSign up
Support
On this page
  • class: SwCallDialpad, sw-call-dialpad
  • Fields
  • call
  • showCallButton
  • allowText
  • placeholder
  • Attributes
  • CSS Parts
  • Events
Web Components

sw-call-dialpad

|View as Markdown|Open in Claude|
Was this page helpful?
Edit this page
Previous

sw-call-media

Next
Built with

Context-aware DTMF dialpad — sends tones over the active call when one exists, otherwise bubbles a sw-dial event for the parent to act on (e.g. as a “start a call to these digits” signal).

1<sw-call-dialpad></sw-call-dialpad>

Wraps the presentational <sw-ui-dialpad> primitive and connects it to the active call. When callState.status === 'connected' (or the explicit .call is connected), each digit press is forwarded to call.sendDigits(). When no call is active, sw-dial bubbles up unchanged so a parent can interpret it as “the user wants to start a new call to these digits”.

Use show-call-button to render an inline “Call” button beneath the keypad, and allow-text to permit free-text entry in the display field — useful for vanity numbers, SIP URIs, or destination addresses.

Input precedence (most specific wins): .call > context.

Class: SwCallDialpad · Module: packages/web-components/src/components/sw-call-dialpad.ts

class: SwCallDialpad, sw-call-dialpad

Fields

call
Call | undefined

Explicit Call — when set, drives DTMF directly and bypasses context.

showCallButton
booleanDefaults to false

Whether to display the call button below the keypad.

allowText
booleanDefaults to false

Allow free-text input in the display field (e.g., SIP URIs, vanity letters).

placeholder
stringDefaults to 'Enter number'

Placeholder text shown in the digit display input.

Attributes

NameFieldInherited From
show-call-buttonshowCallButton
allow-textallowText
callcall
placeholderplaceholder

CSS Parts

NameDescription
containerForwarded `<sw-ui-dialpad>` outer container.
displayForwarded display / input field.
keypadForwarded grid of digit keys.
keyForwarded individual digit button.
key-pressedForwarded digit button while pressed.
call-buttonForwarded “Call” button (only when `show-call-button`).

Events

NameDetailDescription
sw-dial—User pressed the call button while no call is connected.
sw-digit-press—A digit was pressed. While the call is connected