Ações

ToggleGroup

/componentes/toggle-group.mdmarkdown cru, para quem lê com agent em vez de olho

Importar

import { ToggleGroup } from '@rivocode/ui'

Quando usar

Barra de botões que ficam apertados, para escolha que muda a vista na hora: alinhamento, modo de exibicao, filtro rápido.

Com toggleMultiple, vira seleção múltipla.

No React Native

Traduz: o @rivocode/ui-native exporta ToggleGroup - items na raiz; multiple para vários, o mesmo nome e o mesmo sentido do web. A API não é a mesma do web (no nativo tudo é controlado), e a tabela de paridade diz o que muda peça a peça.

API

Prop	Tipo
`defaultValue`0.4.0 The pressed state of the toggle group represented by an array of the values of all pressed toggle buttons.	`readonly string[]`
`disabled`0.4.0 Whether the toggle group should ignore user interaction.	`boolean`
`loopFocus`0.4.0 Whether to loop keyboard focus back to the first item when the end of the list is reached while using the arrow keys.	`boolean`
`multiple`0.4.0 When `false` only one item in the group can be pressed.	`boolean`
`onValueChange`0.4.0 Callback fired when the pressed states of the toggle group changes.	`((groupValue: string[], eventDetails: { reason: "none"; event: Event; cancel: () => void; allowPropagation: () => void; isCanceled: boolean; isPropagationAllowed: boolean; trigger: Element \| undefined; }) => void)`
`orientation`0.4.0	`Orientation`
`render`0.4.0 Allows you to replace the component's HTML element with a different tag, or compose it with another component.	`ComponentRenderFn<HTMLProps, ToggleGroupState>ReactElement<unknown, stringJSXElementConstructor<any>>`
`value`0.4.0 The pressed state of the toggle group represented by an array of the values of all pressed toggle buttons.	`readonly string[]`

Além destas, a peça aceita className, style, id e children, repassados ao elemento de baixo.

Esta peça ainda não tem exemplo que roda: a prosa e a tabela de props abaixo são o que existe hoje. É uma lacuna nossa, e não uma característica dela.