Package-level declarations
This package contains the catalog of ready-to-use UI components (like OudsButton, OudsNavigationBar) that implement the design system specifications using Jetpack Compose.
Types
Default values for OudsBadge.
An icon in an OudsBadge. This icon is not clickable.
The size of an OudsBadge.
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.
A DSL builder for constructing an OudsBulletList.
Default values for OudsBulletList.
The text style of an OudsBulletList.
The type of an OudsBulletList.
The icon to be used in an unordered OudsBulletList.
Represents the appearance of an OudsButton.
Default values for OudsButton.
An icon in an OudsButton. This icon is non-clickable.
A circular loading indicator displayed in an OudsButton.
An icon in an OudsFilterChip or an OudsSuggestionChip. This icon is not clickable.
Represents the possible background colors of an OudsColoredBox.
An icon in a control item like OudsCheckboxItem or OudsRadioButtonItem. It is not clickable and requires no content description because a control item label is always present.
Represents the possible colors for an OudsHorizontalDivider or an OudsVerticalDivider. Each color corresponds to a specific color key token from the Design System.
Default values for an OudsHorizontalDivider or an OudsVerticalDivider.
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.
Represents the type of chevron displayed in an OudsLink.
Contains the default values used by OUDS links.
An icon in an OudsLink. This icon is non-clickable and no content description is needed because a link label is always present.
Represents the size of an OudsLink.
An OUDS navigation bar item, used in OudsNavigationBar.
A badge in an OudsNavigationBarItem.
An icon in an OudsNavigationBarItem.
An asset in an OudsTag. This asset is non-clickable. No content description is needed because a tag always contains a label.
Default values for OudsTag.
A circular progress indicator displayed in the tag area to indicate that tags are being loaded or processed.
Represents the size of an OUDS tag.
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 asset to be displayed in the tag: bullet or icon. Depending on the status, this icon can be customizable or be a status dedicated icon.
An helper link displayed below or in place of the helper text.
A leading icon in an OudsTextInput. This icon is non-clickable.
A circular loading indicator displayed in the text input.
A trailing icon button in an OudsTextInput. Displays an icon-only OudsButton.
An action in an OudsTopAppBar or any other variant.
A badge in an OudsTopAppBarAction.
A navigation icon in an OudsTopAppBar or any other variant.
Properties
Functions
Badge is a UI element that emphasizes system notifications, status, or the categorization of an information, throughout colour only. Badge is rendered as a coloured shape, without icon, text or number; and its chosen size remains unchanged regardless of the changes of the interface size.
Bullet list is a UI element that helps to view in related individual text items grouped together; items usually starting with a number or a bullet.
Button is a UI element that triggers an action or event, and is used to initiate tasks or confirming an action. Button appears in different layouts, styles and states to indicate hierarchy or emphasis.
App bar (aka Top app bar on Material 2) is a top-aligned component that displays the screen title and provides access to key actions and navigation elements. It may include an Up button, action icons, overflow menus, search, or tabs. It provides context and controls relevant to the current view.
Checkbox is a UI element that allows to select multiple options from a set of mutually non exclusive choices. Checkbox that does not show icon or text, provides greater flexibility when creating other components that require a checkbox to be displayed.
Checkbox item is a UI element that allows to select multiple options from a set of mutually non exclusive choices. Checkbox item covers a wider range of contexts by allowing to toggle the visibility of additional text labels and icon assets.
Filter chip is a UI element that allows to select or deselect an option within a series, and is commonly used to capture filtering decisions. Filter chip allows to filter content by being selected or deselected. It can be toggled "On" or "Off" to refine displayed results, and selected Filter Chips remain visually distinct to indicate active filters.
Divider is a UI element that allows to structure the content by visually separating the content zones. Divider improves readability and content organization without introducing a stronger visual hierarchy like a heading or a container would.
Input tag is a UI element that allows 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 tag is often used for adding labels, categories, or participants.
Input tag is a UI element that allows 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 tag is often used for adding labels, categories, or participants.
App bar (aka Top app bar on Material 2) is a top-aligned component that displays the screen title and provides access to key actions and navigation elements. It may include an Up button, action icons, overflow menus, search, or tabs. It provides context and controls relevant to the current view.
Link is a UI element that allows to navigate from one location to another, either within the same page or across different pages in the same resource, or to an external resource. Link's primary function is navigation and it communicates its interactive nature visually and semantically.
App bar (aka Top app bar on Material 2) is a top-aligned component that displays the screen title and provides access to key actions and navigation elements. It may include an Up button, action icons, overflow menus, search, or tabs. It provides context and controls relevant to the current view.
The Navigation bar (aka Bottom navigation bar on Material 2) provides access to an app’s primary destinations using 3 to 5 persistent tabs. Each destination is represented by an icon and optionally a text label. Positioned at the bottom of the screen, it supports quick switching between top-level sections, following Material Design navigation patterns.
Radio button is a UI element that allows to select a single option from a set of mutually exclusive choices. Radio button that does not show icon or text, provides greater flexibility when creating other components that require a Radio button to be displayed.
Radio button item is a UI element that allows to select a single option from a set of mutually exclusive choices. Radio button item covers a wider range of contexts by allowing to toggle the visibility of additional text labels and icon assets.
Suggestion chip is a UI element that allows to present recommended or predictive options based on user's input or context, and is commonly used to capture filtering decisions. Suggestion chip is typically non-selected by default and can be tapped or clicked to apply the suggestion, streamlining input and enhancing usability.
Switch is a UI element that allows to toggle between two states, typically "On" and "Off", and used to enable or disable features, options or settings. Switch that does not show icon or text, provides greater flexibility when creating other components that require a Switch to be displayed.
Switch item is a UI element that allows to toggle between two states, typically "On" and "Off", and used to enable or disable features, options or settings. Switch item covers a wider range of contexts by allowing to toggle the visibility of additional text labels and icon assets.
Tag is a UI element that allows to display short info like a label, keyword, or category. Tag helps users quickly find, group, or understand content.
Text input is a UI element that allows to enter, edit, or select single-line textual data. Text input is one of the most fundamental form elements used to capture user input such as names, emails, passwords, or search queries. It provides a visual and interactive affordance for text entry while supporting labels, placeholders, icons, descriptions, and validation feedback.
App bar (aka Top app bar on Material 2) is a top-aligned component that displays the screen title and provides access to key actions and navigation elements. It may include an Up button, action icons, overflow menus, search, or tabs. It provides context and controls relevant to the current view.
Checkbox is a UI element that allows to select multiple options from a set of mutually non exclusive choices. Checkbox that does not show icon or text, provides greater flexibility when creating other components that require a checkbox to be displayed.
Checkbox item is a UI element that allows to select multiple options from a set of mutually non exclusive choices. Checkbox item covers a wider range of contexts by allowing to toggle the visibility of additional text labels and icon assets.
Divider is a UI element that allows to structure the content by visually separating the content zones. Divider improves readability and content organization without introducing a stronger visual hierarchy like a heading or a container would.