Dialer

A phone keypad: type or tap, hit call. During a call the same keys send DTMF tones, so phone trees just work.

Demo mode — place a call and the in-call bar appears.

Installation

npx shadcn@latest add @handset/dialer

Usage

import { Dialer } from "@/components/handset/dialer";

<Dialer softphone={softphone} callerNumber={tenant.number} />

Ten-digit US numbers are normalized to E.164 automatically. The call button reflects connection state (Offline / Connecting… / Call), and pairing with CallHUD gives you the in-call controls.

Props

Props
PropTypeDefaultDescription
softphoneSoftphoneThe softphone instance.
callerNumberstringCaller ID for outbound calls.
classNamestringMerged onto the wrapper.