Forms

ChoiceGridItem

Selectable answer tile used inside a ChoiceGrid; carries selected, disabled, correct, incorrect, and pending states without shifting cell dimensions.

import { ChoiceGridItem } from '@lostgradient/cinder/choice-grid-item';
formselectionquiz
01

Overview

Selectable answer tile used inside a ChoiceGrid; carries selected, disabled, correct, incorrect, and pending states without shifting cell dimensions.

Usage

ChoiceGridItem is a compose-only leaf of ChoiceGrid. The idiomatic API is ChoiceGrid.Item, reached through the parent namespace — see the ChoiceGrid README for the composed snippet. The flat @lostgradient/cinder/choice-grid-item subpath remains exported for à-la-carte builds that import the leaf directly.

02

When to use

Use when
  • Composing individual answer choices inside a ChoiceGrid parent.
Avoid when
  • Used outside a ChoiceGrid — this leaf requires the parent context.
03

Props

Props for choice-grid-item
Name Type Default Required Bindable Description
value text req The value this item represents. Used as the key for selection state, roving tabindex registration, and ARIA attributes.
state 'neutral' | 'correct' | 'incorrect' | 'pending' 'neutral' Feedback state for assessment / quiz usage. Defaults to 'neutral'. Layout dimensions do NOT change across states (stable cell sizing guarantee).
disabled boolean false When true this item cannot be selected or focused.
children snippet req Item content — label text, an icon, or richer markup.