KQ-1760 · EASE/CHECK

Ease Check

A one-row question for right after a task, whose effort slider is a string between two pegs: pressing rests the finger on it, dragging moves the thumb 1:1 while dragging up or down bends the string under the thumb into two straight runs with a rounded apex, and letting go settles the thumb on its step on springs.snap and plucks the string, which rings through straight on a spring with springs.recoil's character (its stiffness set by the track and the tension) carrying the release velocity. A release, a tap or Enter sends the answer; low scores open a short why field on a measured glide, others say thanks and fold the question away, and a task is never asked twice. It is a real slider: arrows step and pluck lightly, Page keys move two, Home and End jump.

KQ-1760 · EASE/CHECK

Export ready

q3-usage.csv · 2.4 MB

How easy was that export?

asked · q3 usage export

Open it on the Canvas stage

Install

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

$ pnpm dlx shadcn@latest add @kinetiq/ease-check

Props

question: string; default "How easy was that export?"; The question, asked right after the task; it also labels the slider.
taskId: string; default "waylight-export-q3"; The finished task this asks about. Each task is asked once: answered or dismissed, it never returns.
stepCount: number; default 7; Points on the scale, 3 to 10: ticks, labels and keyboard steps.
labels: string[]; default —; One label per point, hardest first. Defaults to a preset for 3, 5 and 7 points, else the end labels and "n of N".
minLabel: string; default "Very hard"; The hard end's label.
maxLabel: string; default "Very easy"; The easy end's label.
lowThreshold: number; default ⌊(stepCount − 1) / 2⌋; Scores at or below this open the why field.
value / defaultValue: number | null; default — / null; The score, 1 to stepCount, or null before an answer; controlled or initial.
onValueChange: (value: number) => void; default —; Fires from the release, tap or key that chose a score.
onAnswer: (score: number, taskId: string) => void; default —; An answer was sent: on release, on a tap, or on Enter.
onComment: (text: string, score: number, taskId: string) => void; default —; The why field was sent, with the score it explains.
onDismiss: (taskId: string) => void; default —; The question was dismissed without an answer.
trackStyle: "string" | "cord" | "beads"; default "string"; What the slider is made of: a fine string that rings fast, a thick cord that sways slowly, or beads on a thread, one per point.
tone: "accent" | "score" | "ink"; default "accent"; The filled run and thumb: cobalt; a colour that warms from red at the hard end through amber to green; or ink.
tension: number; default 0.5; How taut the string is, 0 to 1: tighter rings faster and settles sooner.
whyPrompt: string; default "What got in the way?"; The why field's prompt and label.
thanksMs: number; default 1800; How long the thanks shows before the question folds away, in ms.
persist: boolean; default false; Also remember asked tasks in localStorage, so they stay answered across visits.
disabled: boolean; default false; The slider and buttons do nothing.
className: string; default —; Classes for the question's outer box.

Prop	Type	Default	Description
question	string	"How easy was that export?"	The question, asked right after the task; it also labels the slider.
taskId	string	"waylight-export-q3"	The finished task this asks about. Each task is asked once: answered or dismissed, it never returns.
stepCount	number	7	Points on the scale, 3 to 10: ticks, labels and keyboard steps.
labels	string[]	—	One label per point, hardest first. Defaults to a preset for 3, 5 and 7 points, else the end labels and "n of N".
minLabel	string	"Very hard"	The hard end's label.
maxLabel	string	"Very easy"	The easy end's label.
lowThreshold	number	⌊(stepCount − 1) / 2⌋	Scores at or below this open the why field.
value / defaultValue	number \| null	— / null	The score, 1 to stepCount, or null before an answer; controlled or initial.
onValueChange	(value: number) => void	—	Fires from the release, tap or key that chose a score.
onAnswer	(score: number, taskId: string) => void	—	An answer was sent: on release, on a tap, or on Enter.
onComment	(text: string, score: number, taskId: string) => void	—	The why field was sent, with the score it explains.
onDismiss	(taskId: string) => void	—	The question was dismissed without an answer.
trackStyle	"string" \| "cord" \| "beads"	"string"	What the slider is made of: a fine string that rings fast, a thick cord that sways slowly, or beads on a thread, one per point.
tone	"accent" \| "score" \| "ink"	"accent"	The filled run and thumb: cobalt; a colour that warms from red at the hard end through amber to green; or ink.
tension	number	0.5	How taut the string is, 0 to 1: tighter rings faster and settles sooner.
whyPrompt	string	"What got in the way?"	The why field's prompt and label.
thanksMs	number	1800	How long the thanks shows before the question folds away, in ms.
persist	boolean	false	Also remember asked tasks in localStorage, so they stay answered across visits.
disabled	boolean	false	The slider and buttons do nothing.
className	string	—	Classes for the question's outer box.