Segment buttons are groups of related buttons inside of a Segment. They are displayed in a horizontal row. A segment button can be checked by default by adding the checked attribute or by setting the value of the segment to the value of the segment button. Only one segment button should be selected at a time.

Properties

activated

boolean

checked

boolean

If true, the segment button is selected. Defaults to false.

color

string

The color to use for the text color. Default options are: "primary", "secondary", "tertiary", "success", "warning", "danger", "light", "medium", and "dark".

disabled

boolean

href

string

Contains a URL or a URL fragment that the hyperlink points to. If this property is set, an anchor tag will be rendered.

mode

string

The mode determines which platform styles to use. Possible values are: "ios" or "md".

value

string

The value of the segment button.

Attributes

activated

boolean

checked

boolean

If true, the segment button is selected. Defaults to false.

color

string

The color to use for the text color. Default options are: "primary", "secondary", "tertiary", "success", "warning", "danger", "light", "medium", and "dark".

disabled

boolean

href

string

Contains a URL or a URL fragment that the hyperlink points to. If this property is set, an anchor tag will be rendered.

mode

string

The mode determines which platform styles to use. Possible values are: "ios" or "md".

value

string

The value of the segment button.

Events

ionClick

Emitted when the segment button is clicked.

Built with StencilJS