KQ-1140 · STROKE/COMMAND

Stroke Command

A gesture pad that runs a command when you draw its shape: a small unistroke matcher resamples the stroke, turns it to its indicative angle, scales it into a square and searches the leftover rotation against a check, a circle, an arrow and a zigzag. A match morphs the stroke you drew, point for point, into the clean shape laid over it on springs.glide, and the command's label lands on springs.recoil with its own chime; a stroke that is no shape shrugs and fades. The command chips are a real toolbar: Arrow keys move along it, and Enter or Space makes the pad draw that shape itself, through the same matcher, morph and sound.

KQ-1140 · STROKE/COMMAND

Invoice 2291 to Basinworks

Open

draw a shape · 4 commands

Open it on the Tactile stage

Install

One command — the source lands in your repo. Or copy it from the Code tab.

$ pnpm dlx shadcn@latest add @kinetiq/stroke-command

Props

commands: { shape: StrokeShape; label: string }[]; default —; The commands in chip order, each bound to "check", "circle", "arrow" or "zigzag". Only these shapes are recognised; a shape bound twice keeps its first command.
onCommand: (run: { shape, label, score, via }) => void; default —; Fires from the release (or the chip) that ran a command, with the match score from 0 to 1 and how it was run: "stroke", "keyboard" or "pointer".
onMiss: (best: { shape, score } | null, threshold: number) => void; default —; Fires when a stroke matched no command, with the nearest upright shape (or null for a line or a scribble too short to judge) and the score it needed.
label: string; default —; The accessible name of the whole control; the toolbar is named after it.
tolerance: number; default 0.5; How forgiving the matcher is, 0 (strict: a score of 0.92 needed) to 1 (loose: 0.74).
trail: boolean; default true; Show the ink while drawing. Off, only the pen tip moves, and the stroke appears as it is judged.
width: number; default 4; The ink's weight in px, 2 to 10.
templates: "ghost" | "off"; default "ghost"; ghost fits the leading template faintly under the stroke while you draw, solid once it would match, and warms its chip; off shows nothing until release.
height: number; default 176; The pad's height in px; it fills the available width.
sound: boolean; default false; Play a pencil scratch that follows the pen's speed, a chime for a match (a different step of one chord per command) and a shrug for a miss. Nothing plays, and no audio context exists, unless this is on.
disabled: boolean; default false; Dims the pad and the chips and blocks drawing and commands.
className: string; default —; Merged onto the root's classes.

Prop	Type	Default	Description
commands	{ shape: StrokeShape; label: string }[]	—	The commands in chip order, each bound to "check", "circle", "arrow" or "zigzag". Only these shapes are recognised; a shape bound twice keeps its first command.
onCommand	(run: { shape, label, score, via }) => void	—	Fires from the release (or the chip) that ran a command, with the match score from 0 to 1 and how it was run: "stroke", "keyboard" or "pointer".
onMiss	(best: { shape, score } \| null, threshold: number) => void	—	Fires when a stroke matched no command, with the nearest upright shape (or null for a line or a scribble too short to judge) and the score it needed.
label	string	—	The accessible name of the whole control; the toolbar is named after it.
tolerance	number	0.5	How forgiving the matcher is, 0 (strict: a score of 0.92 needed) to 1 (loose: 0.74).
trail	boolean	true	Show the ink while drawing. Off, only the pen tip moves, and the stroke appears as it is judged.
width	number	4	The ink's weight in px, 2 to 10.
templates	"ghost" \| "off"	"ghost"	ghost fits the leading template faintly under the stroke while you draw, solid once it would match, and warms its chip; off shows nothing until release.
height	number	176	The pad's height in px; it fills the available width.
sound	boolean	false	Play a pencil scratch that follows the pen's speed, a chime for a match (a different step of one chord per command) and a shrug for a miss. Nothing plays, and no audio context exists, unless this is on.
disabled	boolean	false	Dims the pad and the chips and blocks drawing and commands.
className	string	—	Merged onto the root's classes.