Package-level declarations

Contains all OUDS basic components: OudsButton, OudsLink,...

Types

Link copied to clipboard

Default values for OudsBadge.

Link copied to clipboard

An icon in an OudsBadge. This icon is non-clickable.

Link copied to clipboard

The size of an OudsBadge.

Link copied to clipboard

The status of an OudsBadge without content or with a count. This status determines the background and content colors of the badge. For a badge with icon, please use OudsIconBadgeStatus.

Link copied to clipboard

Represents the appearance of an OudsButton.

Link copied to clipboard

Default values for OudsButton.

Link copied to clipboard

An icon in an OudsButton. This icon is non-clickable.

Link copied to clipboard
data class OudsButtonLoader(val progress: Float?)

A circular loading indicator displayed in an OudsButton.

Link copied to clipboard

An icon in an OudsFilterChip or an OudsSuggestionChip. This icon is non-clickable.

Link copied to clipboard

Represents the possible background colors of an OudsColoredBox.

Link copied to clipboard

An icon in a control item like OudsCheckboxItem or OudsRadioButtonItem. It is non-clickable and no content description is needed because a control item label is always present.

Link copied to clipboard

Represents the possible colors for an OudsHorizontalDivider or an OudsVerticalDivider. Each color corresponds to a specific color key token from the Design System.

Link copied to clipboard
Link copied to clipboard
sealed class OudsIconBadgeStatus

The status of an OudsBadge with icon. This status determines the background and content colors of the badge. It also carries the optional icon to be displayed in the badge. Depending on the status, this icon can be customizable or be a status dedicated icon. For a badge without icon, please use OudsBadgeStatus. A content description should be specified at OudsBadge level through semantics Modifier.

Link copied to clipboard

Represents the type of arrow displayed in an OudsLink.

Link copied to clipboard

Contains the default values used by OUDS links.

Link copied to clipboard
open class OudsLinkIcon : OudsComponentIcon<OudsLinkIcon.ExtraParameters, OudsLinkIcon>

An icon in an OudsLink. This icon is non-clickable and no content description is needed because a link label is always present.

Link copied to clipboard

Represents the size of an OudsLink.

Link copied to clipboard
Link copied to clipboard

Default values for OudsTag.

Link copied to clipboard
open class OudsTagIcon : OudsComponentIcon<OudsTagIcon.ExtraParameters, OudsTagIcon>

An icon in an OudsTag. This icon is non-clickable. No content description is needed because a tag always contains a label.

Link copied to clipboard
data class OudsTagLoader(val progress: Float?)

A circular progress indicator displayed in the input or tag area to indicate that tags are being loaded or processed.

Link copied to clipboard

Represents the size of an OUDS tag.

Link copied to clipboard
sealed class OudsTagStatus

The status of an OudsTag. Each status is designed to convey a specific meaning and ensure clarity in communication. It determines the background and the content colors of the tag. It also carries the optional icon to be displayed in the tag: bullet or icon. Depending on the status, this icon can be customizable or be a status dedicated icon.

Link copied to clipboard
data class OudsTextInputHelperLink(val text: String, val onClick: () -> Unit)

An helper link displayed below or in place of the helper text.

Link copied to clipboard

A leading icon in an OudsTextInput. This icon is non-clickable.

Link copied to clipboard
data class OudsTextInputLoader(val progress: Float?)

A circular loading indicator displayed in the text input.

Link copied to clipboard

Properties

Link copied to clipboard
const val OudsBadgeMaxCount: Int = 99

The maximum count value.

Functions

Link copied to clipboard
fun OudsBadge(modifier: Modifier = Modifier, enabled: Boolean = true, status: OudsBadgeStatus = OudsBadgeDefaults.Status, size: OudsBadgeSize = OudsBadgeDefaults.Size)
fun OudsBadge(modifier: Modifier = Modifier, enabled: Boolean = true, status: OudsIconBadgeStatus = OudsBadgeDefaults.WithIconStatus, size: OudsBadgeSize = OudsBadgeDefaults.Size)
fun OudsBadge(count: Int, modifier: Modifier = Modifier, enabled: Boolean = true, status: OudsBadgeStatus = OudsBadgeDefaults.Status, size: OudsBadgeSize = OudsBadgeDefaults.Size)

The badge is a small UI element used to highlight status, notifications, or categorization within an interface. It is often displayed as a label or indicator with a distinct background color and text.

Link copied to clipboard
fun OudsButton(icon: OudsButtonIcon, onClick: () -> Unit, modifier: Modifier = Modifier, enabled: Boolean = true, loader: OudsButtonLoader? = null, appearance: OudsButtonAppearance = OudsButtonDefaults.Appearance, interactionSource: MutableInteractionSource? = null)
fun OudsButton(label: String, onClick: () -> Unit, modifier: Modifier = Modifier, enabled: Boolean = true, loader: OudsButtonLoader? = null, appearance: OudsButtonAppearance = OudsButtonDefaults.Appearance, interactionSource: MutableInteractionSource? = null)
fun OudsButton(icon: OudsButtonIcon, label: String, onClick: () -> Unit, modifier: Modifier = Modifier, enabled: Boolean = true, loader: OudsButtonLoader? = null, appearance: OudsButtonAppearance = OudsButtonDefaults.Appearance, interactionSource: MutableInteractionSource? = null)

Buttons are interactive elements designed to trigger specific actions or events when tapped by a user.

Link copied to clipboard
fun OudsCheckbox(checked: Boolean, onCheckedChange: (Boolean) -> Unit?, modifier: Modifier = Modifier, enabled: Boolean = true, error: OudsError? = null, interactionSource: MutableInteractionSource? = null)

Checkboxes are input controls that allow users to select one or more options from a number of choices.

Link copied to clipboard
fun OudsCheckboxItem(checked: Boolean, label: String, onCheckedChange: (Boolean) -> Unit?, modifier: Modifier = Modifier, helperText: String? = null, icon: OudsControlItemIcon? = null, divider: Boolean = false, reversed: Boolean = false, enabled: Boolean = true, readOnly: Boolean = false, error: OudsError? = null, interactionSource: MutableInteractionSource? = null)

Checkboxes are input controls that allow users to select one or more options from a number of choices.

Link copied to clipboard
fun OudsColoredBox(color: OudsColoredBoxColor, modifier: Modifier = Modifier, contentAlignment: Alignment = Alignment.TopStart, propagateMinConstraints: Boolean = false, content: @Composable BoxScope.() -> Unit)

A colored box is a Box where content color is automatically adjusted to maximize the contrast with the chosen background color.

Link copied to clipboard
fun OudsFilterChip(selected: Boolean, onClick: () -> Unit, icon: OudsChipIcon, modifier: Modifier = Modifier, enabled: Boolean = true, interactionSource: MutableInteractionSource? = null)
fun OudsFilterChip(selected: Boolean, onClick: () -> Unit, label: String, modifier: Modifier = Modifier, enabled: Boolean = true, interactionSource: MutableInteractionSource? = null)
fun OudsFilterChip(selected: Boolean, onClick: () -> Unit, label: String, icon: OudsChipIcon, modifier: Modifier = Modifier, enabled: Boolean = true, interactionSource: MutableInteractionSource? = null)

Chips help people enter information, make selections, filter content, or trigger actions. Chips can show multiple interactive elements together in the same area, such as a list of selectable movie times, or a series of email contacts.

Link copied to clipboard
fun OudsHorizontalDivider(modifier: Modifier = Modifier, color: OudsDividerColor = OudsDividerDefaults.Color)

Dividers are used to visually structure an interface by clearly separating content sections. It helps to improve readability and content organization without introducing a strong hierarchy like a heading or a container would.

Link copied to clipboard
fun OudsInputChip(label: String, onClick: () -> Unit, modifier: Modifier = Modifier, enabled: Boolean = true, interactionSource: MutableInteractionSource? = null)

An input tag is a component that allows users to enter multiple values, each represented as a tag. As users type and submit values (usually by pressing enter, comma, or tab), each value is transformed into a Tag. Input tags are often used for adding labels, categories, or participants. They typically support editing, removing, and validating individual tags.

Link copied to clipboard
fun OudsInputTag(label: String, onClick: () -> Unit, modifier: Modifier = Modifier, enabled: Boolean = true, interactionSource: MutableInteractionSource? = null)

An input tag is a component that allows users to enter multiple values, each represented as a tag. As users type and submit values (usually by pressing enter, comma, or tab), each value is transformed into a Tag. Input tags are often used for adding labels, categories, or participants. They typically support editing, removing, and validating individual tags.

Link copied to clipboard
fun OudsLink(label: String, onClick: () -> Unit, modifier: Modifier = Modifier, size: OudsLinkSize = OudsLinkDefaults.Size, enabled: Boolean = true)
fun OudsLink(label: String, icon: OudsLinkIcon, onClick: () -> Unit, modifier: Modifier = Modifier, size: OudsLinkSize = OudsLinkDefaults.Size, enabled: Boolean = true)

Links are interactive elements that allow users to navigate to a new screen, website, or a specific section within the current screen.

fun OudsLink(label: String, arrow: OudsLinkArrow, onClick: () -> Unit, modifier: Modifier = Modifier, size: OudsLinkSize = OudsLinkDefaults.Size, enabled: Boolean = true)

An OUDS link which displays an arrow before (OudsLinkArrow.Back) or after (OudsLinkArrow.Next) a label.

Link copied to clipboard
fun OudsRadioButton(selected: Boolean, onClick: () -> Unit?, modifier: Modifier = Modifier, enabled: Boolean = true, error: OudsError? = null, interactionSource: MutableInteractionSource? = null)

Radio buttons are input controls that allow users to select a single option from a set of mutually exclusive choices.

Link copied to clipboard
fun OudsRadioButtonItem(selected: Boolean, label: String, onClick: () -> Unit?, modifier: Modifier = Modifier, additionalLabel: String? = null, helperText: String? = null, icon: OudsControlItemIcon? = null, divider: Boolean = false, outlined: Boolean = false, reversed: Boolean = false, enabled: Boolean = true, readOnly: Boolean = false, error: OudsError? = null, interactionSource: MutableInteractionSource? = null)

Radio buttons are input controls that allow users to select a single option from a set of mutually exclusive choices.

Link copied to clipboard
fun OudsSuggestionChip(onClick: () -> Unit, icon: OudsChipIcon, modifier: Modifier = Modifier, enabled: Boolean = true, interactionSource: MutableInteractionSource? = null)
fun OudsSuggestionChip(onClick: () -> Unit, label: String, modifier: Modifier = Modifier, enabled: Boolean = true, interactionSource: MutableInteractionSource? = null)
fun OudsSuggestionChip(onClick: () -> Unit, label: String, icon: OudsChipIcon, modifier: Modifier = Modifier, enabled: Boolean = true, interactionSource: MutableInteractionSource? = null)

Chips help people enter information, make selections, filter content, or trigger actions. Chips can show multiple interactive elements together in the same area, such as a list of selectable movie times, or a series of email contacts.

Link copied to clipboard
fun OudsSwitch(checked: Boolean, onCheckedChange: (Boolean) -> Unit?, modifier: Modifier = Modifier, enabled: Boolean = true, interactionSource: MutableInteractionSource? = null)

Switches allow the user to toggle between two states, typically "on" and "off". It is represented as a slider that changes its position or color to indicate the current state. Switches are used to enable or disable features, options, or settings in an intuitive and visual manner.

Link copied to clipboard
fun OudsSwitchItem(checked: Boolean, label: String, onCheckedChange: (Boolean) -> Unit?, modifier: Modifier = Modifier, helperText: String? = null, icon: OudsControlItemIcon? = null, divider: Boolean = false, reversed: Boolean = false, enabled: Boolean = true, readOnly: Boolean = false, error: OudsError? = null, interactionSource: MutableInteractionSource? = null)

Switches allow the user to toggle between two states, typically "on" and "off". It is represented as a slider that changes its position or color to indicate the current state. Switches are used to enable or disable features, options, or settings in an intuitive and visual manner.

Link copied to clipboard
fun OudsTag(label: String, modifier: Modifier = Modifier, enabled: Boolean = true, appearance: OudsTagAppearance = OudsTagDefaults.Appearance, status: OudsTagStatus = OudsTagDefaults.Status, roundedCorners: Boolean = true, size: OudsTagSize = OudsTagDefaults.Size, loader: OudsTagLoader? = null)

A tag is a small element that shows short info like a label, keyword, or category. It helps users quickly find, group, or understand content.

Link copied to clipboard
fun OudsTextInput(textFieldState: TextFieldState, modifier: Modifier = Modifier, label: String? = null, placeholder: String? = null, leadingIcon: OudsTextInputLeadingIcon? = null, trailingIconButton: OudsTextInputTrailingIconButton? = null, prefix: String? = null, suffix: String? = null, enabled: Boolean = true, readOnly: Boolean = false, loader: OudsTextInputLoader? = null, outlined: Boolean = false, error: OudsError? = null, helperText: String? = null, helperLink: OudsTextInputHelperLink? = null, keyboardOptions: KeyboardOptions = KeyboardOptions.Default, onKeyboardAction: KeyboardActionHandler? = null, onTextLayout: Density.(getResult: () -> TextLayoutResult?) -> Unit? = null, inputTransformation: InputTransformation? = null, outputTransformation: OutputTransformation? = null, interactionSource: MutableInteractionSource? = null)
fun OudsTextInput(value: TextFieldValue, onValueChange: (TextFieldValue) -> Unit, modifier: Modifier = Modifier, label: String? = null, placeholder: String? = null, leadingIcon: OudsTextInputLeadingIcon? = null, trailingIconButton: OudsTextInputTrailingIconButton? = null, prefix: String? = null, suffix: String? = null, enabled: Boolean = true, readOnly: Boolean = false, loader: OudsTextInputLoader? = null, outlined: Boolean = false, error: OudsError? = null, helperText: String? = null, helperLink: OudsTextInputHelperLink? = null, keyboardOptions: KeyboardOptions = KeyboardOptions.Default, keyboardActions: KeyboardActions = KeyboardActions.Default, onTextLayout: (TextLayoutResult) -> Unit = {}, visualTransformation: VisualTransformation = VisualTransformation.None, interactionSource: MutableInteractionSource? = null)
fun OudsTextInput(value: String, onValueChange: (String) -> Unit, modifier: Modifier = Modifier, label: String? = null, placeholder: String? = null, leadingIcon: OudsTextInputLeadingIcon? = null, trailingIconButton: OudsTextInputTrailingIconButton? = null, prefix: String? = null, suffix: String? = null, enabled: Boolean = true, readOnly: Boolean = false, loader: OudsTextInputLoader? = null, outlined: Boolean = false, error: OudsError? = null, helperText: String? = null, helperLink: OudsTextInputHelperLink? = null, keyboardOptions: KeyboardOptions = KeyboardOptions.Default, keyboardActions: KeyboardActions = KeyboardActions.Default, onTextLayout: (TextLayoutResult) -> Unit = {}, visualTransformation: VisualTransformation = VisualTransformation.None, interactionSource: MutableInteractionSource? = null)

A Text Input is a user interface component that allows users to enter, edit, or select single-line textual data. It's one of the most fundamental form elements used to capture user input such as names, emails, passwords, or search queries.

Link copied to clipboard
fun OudsTriStateCheckbox(state: ToggleableState, onClick: () -> Unit?, modifier: Modifier = Modifier, enabled: Boolean = true, error: OudsError? = null, interactionSource: MutableInteractionSource? = null)

Checkboxes are input controls that allow users to select one or more options from a number of choices.

Link copied to clipboard
fun OudsTriStateCheckboxItem(state: ToggleableState, label: String, onClick: () -> Unit?, modifier: Modifier = Modifier, helperText: String? = null, icon: OudsControlItemIcon? = null, divider: Boolean = false, reversed: Boolean = false, enabled: Boolean = true, readOnly: Boolean = false, error: OudsError? = null, interactionSource: MutableInteractionSource? = null)

Checkboxes are input controls that allow users to select one or more options from a number of choices.

Link copied to clipboard
fun OudsVerticalDivider(modifier: Modifier = Modifier, color: OudsDividerColor = OudsDividerDefaults.Color)

Dividers are used to visually structure an interface by clearly separating content sections. It helps to improve readability and content organization without introducing a strong hierarchy like a heading or a container would.