Negation Select

Open in playground

Strike-through elimination. Pick what you definitely don't want — often easier than choosing what you do. Remaining scope is counted as you eliminate.

Preview

What do you definitely NOT need?

Eliminate what's out of scope — it's easier than picking what's in

Usage

import { NegationSelect } from "@/components/socratic-ui/negation-select";

<NegationSelect
  question="What do you definitely NOT need?"
  options={[
    { title: "Complex onboarding" },
    { title: "Social features" },
  ]}
  value={eliminated}
  onChange={setEliminated}
/>

API Reference

Prop	Type	Default
`question`required The headline shown above the options.	`string`	`—`
`subtitle` Optional supporting copy beneath the question.	`string`	`—`
`options`required The list of options the user can eliminate.	`{ title: string; subtitle?: string }[]`	`—`
`value`required Titles of the options the user has eliminated.	`string[]`	`—`
`onChange`required Called when eliminations change. Tap a crossed-out item to restore it.	`(value: string[]) => void`	`—`
`number` Optional leading question number.	`string`	`—`