Components
Segment group

Segment Group

The SegmentGroup component offers an effective way to organize and navigate between multiple sections within a single view. It provides a clear and compact option to improve usability and accessibility.

API reference docs for the component. Learn about the props, CSS, and other APIs of this exported module.

SegmentProps

value

string

disabled

boolean

invalid

boolean

SegmentContext

value

string

disabled

boolean

invalid

boolean

SegmentGroupProps

defaultValue

string

dir

'ltr' | 'rtl'

The document's text/writing direction.

disabled

boolean

If `true`, the radio group will be disabled

form

string

The associate form of the underlying input.

getRootNode

() => ShadowRoot | Node | Document

A root node to correctly resolve document in custom environments. E.x.: Iframes, Electron.

id

string

The unique identifier of the machine.

ids

Partial<{ root: string label: string indicator: string radio(value: string): string radioLabel(value: string): string radioControl(value: string): string radioHiddenInput(value: string): string }>

The ids of the elements in the radio. Useful for composition.

name

string

The name of the input fields in the radio (Useful for form submission).

onValueChange

(details: ValueChangeDetails) => void

Function called once a radio is checked

orientation

'horizontal' | 'vertical'

Orientation of the radio group

value

string

The value of the checked radio

SegmentGroupContext

clearValue

() => void

Function to clear the value of the radio group

focus

() => void

Function to focus the radio group

getRadioControlProps

(props: RadioProps) => Dict<any>

getRadioHiddenInputProps

(props: RadioProps) => Dict<any>

getRadioLabelProps

(props: RadioProps) => Dict<any>

getRadioProps

(props: RadioProps) => Dict<any>

getRadioState

(props: RadioProps) => RadioState

Returns the state details of a radio input

indicatorProps

Dict<any>

labelProps

Dict<any>

rootProps

Dict<any>

setValue

(value: string) => void

Function to set the value of the radio group

value

string

The current value of the radio group