Segmented control
This component is a UI element that allows users to choose between multiple options by selecting one of the multiple segments. Each segment is represented as a button with a distinct label, and the currently selected segment is visually indicated, for example, by a highlighted background. It is commonly used in navigation, forms, or settings, providing a compact and intuitive way for users to make a choice.
Props
model-value?: number
The selected item index.
is-fill?: boolean
Allows the segmented control to fill in its parent.
items?: FluxSegmentedControlItemObject[]
The items of the segmented control.
Emits
update:model-value: [number]
Triggered when the selected item changes.
Examples
Todo
Types
ts
type FluxSegmentedControlItemObject = {
readonly icon?: FluxIconName;
readonly label?: string;
};