Structure
OUDSSuggestionChip
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. Chips can show multiple interactive elements together in the same area, such as a list of selectable movie times, or a serie of email contacts. Best suited for category-based filters that do not require additional visual elements.
- iOS 15.0+
- macOS 13.0+
- tvOS 16.0+
- visionOS 1.0+
- watchOS 11.0+
@MainActor struct OUDSSuggestionChip
Mentioned In
Accessibility considerations
This component does not define in its side some accessibility hints. If you use this component, you must define such hints so as to explain to your users which actions are available for which interactions.
Code samples
// Icon only
OUDSSuggestionChip(icon: Image("ic_heart"), accessibilityLabel: "Heart") { /* the action to process */ }
// Text only
OUDSSuggestionChip(text: "Heart") { /* the action to process */ }
// Text from a localizable and a bundle
OUDSSuggestionChip(LocalizedStringKey("category_chip"), bundle: Bundle.module) { }
// Text and icon
OUDSSuggestionChip(icon: Image("ic_heart"), text: "Heart") { /* the action to process */ }
Design documentation
unified-design-system.orange.com
Themes rendering
Orange
Orange Compact
Sosh
Wireframe
Version
1.3.0
Since
0.17.0
Topics
Initializers
init(LocalizedStringKey, tableName: String?, bundle: Bundle, action: () -> Void)Creates a chip with a localized text only, looking up the key in the given bundle.
init(icon: Image, LocalizedStringKey, tableName: String?, bundle: Bundle, action: () -> Void)Creates a chip with a localized text and icon, looking up the key in the given bundle.
init(icon: Image, accessibilityLabel: String, action: () -> Void)Creates a chip with an icon only.
init(icon: Image, accessibilityLabel: LocalizedStringKey, tableName: String?, bundle: Bundle, action: () -> Void)Creates a chip with an icon only.
init(icon: Image, text: String, action: () -> Void)Creates a chip with text and icon.
init(text: String, action: () -> Void)Creates a chip with a text only.
Instance Properties