Checkbox

Fission

Product

▾

Setup

›

›

Checkbox is the standard boolean toggle for independent choices.

Use it when the user is deciding whether something is included, enabled, acknowledged, or selected among many independent items. A checkbox is different from a Radio: radios mean "pick exactly one", while checkboxes mean "each option stands on its own".

Example

use fission::prelude::*;
#[fission_action]
struct ToggleNewsletter;

fn on_toggle(state: &mut SettingsState, _action: ToggleNewsletter, _ctx: &mut ReducerContext<SettingsState>) {
state.receive_newsletter = !state.receive_newsletter;
}

let widget: Widget = Checkbox {
checked: view.state().receive_newsletter,
label: Some("Receive product updates".into()),
on_toggle: Some(ctx.bind(
    ToggleNewsletter,
    reduce_with!(on_toggle),
)),
..Default::default()
}
.into();

The checkbox does not flip itself. It emits an action, the reducer changes GlobalState, and the next conversion pass reads the new checked value from ViewHandle.

Field table

Field	Type	Meaning	Notes / default behavior
id	Option<WidgetId>	Stable widget identity.	Defaults to None.
checked	bool	Whether the checkbox is currently selected.	Defaults to false.
on_toggle	Option<ActionEnvelope>	Action dispatched when the user toggles the checkbox.	Defaults to None.
label	Option<String>	Visible text shown next to the indicator.	Defaults to None, but most real checkboxes should have a label.

Interaction and accessibility behavior

Checkbox lowers a semantic checkbox role with the current checked state, so assistive technology can report it correctly and automated tests can find it by role. The label text is also used as the semantic label when present.

Because the control is controlled by state, it is easy to test. Given a known checked value, the same build always produces the same visual and semantic result.

Specific advice

Prefer a checkbox when the choice can stay pending until a later submit. If the control means an immediate app setting that turns behavior on or off right away, a Switch often reads more naturally.

Production checklist

For Checkbox, review the fields that change behavior before treating the widget as finished: id, checked, on_toggle, label. The goal is to make the product rule visible in state and actions, not hidden inside ad-hoc construction code.

•

Bind on_toggle to explicit reducer actions and test that the reducer handles unavailable, duplicate, or invalid input safely.

•

Set id only when identity must be stable across filtering, reordering, diagnostics, or tests; otherwise let Fission derive identity from structure.

•

Check the semantics tree for the user-facing label or role that makes this widget understandable without relying only on pixels.

•

Add at least one component or harness test that confirms the visible text, semantic role, action dispatch, and layout constraint that matter for this widget in context.

If a screen starts repeating the same Checkbox setup, extract a named component around this widget. That keeps the reference API small while making product code easier to read and safer for generated code to copy.

Switch, Radio, FormControl, and Button.