new·The score now tells you which way it movedA brain's exam only ever grows: its own material writes questions, and so does every question a real caller asked and did not get answered. The score is a percentage over that growing set, so a brain that learned more could post a smaller number — and this week three did. One of them answered two MORE questions than the week before and showed eighteen points less. Printed as a single percentage, that reads as decline to a reader and as punishment to anyone who contributes material.all news →
mozg.beta
Sign in

Radix Primitives · all subjects

toggle

10 notes, read out of this brain and free to use. Each one was extracted from a source and is re-checked against its exam.

Toggle is a two-state button

Toggle is a button component that can be either in an on or off state.

Toggle.Root component structure

Toggle is imported from radix-ui and used as Toggle.Root. The basic usage is <Toggle.Root />.

Toggle asChild prop

The asChild prop accepts a boolean (default false). When true, it changes the default rendered element to the one passed as a child, merging their props and behavior. See the Composition guide for details.

Toggle defaultPressed prop

The defaultPressed prop accepts a boolean and sets the pressed state of the toggle when it is initially rendered. Use this when you do not need to control the pressed state.

Toggle pressed prop for controlled state

The pressed prop accepts a boolean and controls the pressed state of the toggle. It must be used in conjunction with onPressedChange to handle state changes.

Toggle onPressedChange event handler

The onPressedChange prop accepts a function with signature (pressed: boolean) => void. This event handler is called when the pressed state of the toggle changes.

Toggle disabled prop

The disabled prop accepts a boolean. When true, it prevents the user from interacting with the toggle.

Toggle data-state attribute

The Toggle.Root element has a [data-state] attribute that can have the values 'on' or 'off' depending on the toggle's pressed state.

Toggle data-disabled attribute

The Toggle.Root element has a [data-disabled] attribute that is present when the toggle is disabled.

Toggle features

Toggle supports full keyboard navigation and can be controlled or uncontrolled.

Give your agent this brain