Checkbox

A themed box, a check, a label — plus indeterminate, invalid and sizes.

State lives in the caller's struct (Value); the component renders and reports clicks. One struct per on-screen instance — identity in immediate mode is the struct.

Installation

Use the module import (the default), or own the source: lotusui add vendors the component into your app and lotusui update keeps the copy mergeable — see Registry.

go get github.com/ikaito-com/lotusui

# or vendor the source into your app:
go run github.com/ikaito-com/lotusui/cmd/lotusui add checkbox

Usage

open demo ↗

var accept lotusui.Checkbox
if accept.Clicked(gtx) { accept.Value = !accept.Value }
accept.Layout(th, gtx, "Accept terms and conditions")

The state IS the struct's Value — set it for an initial checked box, flip it on Clicked. There is no controlled/uncontrolled split in immediate mode; every checkbox is "controlled" by construction.

accept := lotusui.Checkbox{Value: true} // starts checked

With text

A caption under the label is composition — a stack and an inset.

open demo ↗

lotusui.VStack(th.Space.XS,
	func(gtx C) D { return terms.Layout(th, gtx, "Accept terms and conditions") },
	func(gtx C) D {
		return layout.Inset{Left: 26}.Layout(gtx,
			lotusui.LabelCaption(th, "By clicking this checkbox, you agree to the terms and conditions.").Layout)
	},
)

Group

A checkbox list is composition — one struct per row, values yours.

open demo ↗

for _, c := range []*lotusui.Checkbox{&recents, &home, &apps} {
	if c.Clicked(gtx) { c.Value = !c.Value }
}

Disabled

open demo ↗

included.Value, included.Disabled = true, true

Indeterminate and invalid

Indeterminate renders the dash (a parent with some children selected); Invalid switches the chrome to danger.

open demo ↗

parent.Indeterminate = true
terms.Invalid = true

In a table

Row selection is composition: checkbox cells in a Table.

open demo ↗

lotusui.Table(th, lotusui.TableProps{Widths: []float32{0.5, 2, 1}},
	[]string{"", "Repository", "Visibility"}, rowsWithCheckboxCells)

Sizes

All seven shared Size presets.

open demo ↗

box.Size = lotusui.Size2XS // … through lotusui.Size2XL

API

Option	Type	Description
`Value`	`bool`	The state — yours.
`Size`	`Size`	The shared size presets (Size2XS–Size2XL).
`Indeterminate`	`bool`	The parent-of-mixed-children dash.
`Invalid`	`bool`	Danger chrome.
`Disabled`	`bool`	Dimmed, unclickable.