Preference Strength Selector

A three-position segmented control for expressing preference strength: Required, Preferred, or Any. Built on Radix ToggleGroup. Active item uses inverted foreground/background. Labels are fully customisable.

core/preference-strength-selector

Installation

1 · Add registry to components.json

2 · Install component

Examples

Default

Default labels, custom label override, and disabled state.

Default labels

Wi-Fi

Pool

Custom labels

Parking

Disabled

Accessible room

Wi-Fi: preferred · Pool: required · Parking: any

API Reference

Prop	Type	Default	Description
`value`req	`PreferenceStrength`	—	Controlled value: "required" \| "preferred" \| "any".
`onChange`req	`(value: PreferenceStrength) => void`	—	Called when the selected strength changes.
`labels`	`Partial<Record<PreferenceStrength, string>>`	—	Override display labels. Defaults: Required / Preferred / Any.
`disabled`	`boolean`	—	Disables the entire control.
`className`	`string`	—	Additional classes applied to the toggle group.