OudsInputTag

fun OudsInputTag(label: String, onClick: () -> Unit, modifier: Modifier = Modifier, enabled: Boolean = true, interactionSource: MutableInteractionSource? = null, @IntroducedAt(version = "3.0.0-Unreleased") skeleton: OudsSkeleton? = LocalSkeleton.current)

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.

Design

NameInput Tag
Guidelinesunified-design-system.orange.com
Version1.2.0

Parameters

label

The text label displayed inside the input tag.

onClick

Called when the input tag is clicked.

modifier

Modifier applied to the input tag.

enabled

Controls the enabled state of this input tag. When false, this component will not respond to user input, and it will appear visually disabled and disabled to accessibility services.

interactionSource

An optional hoisted MutableInteractionSource for observing and emitting Interactions for this input tag. You can use this to change the input tag's appearance or preview the input tag in different states. Note that if null is provided, interactions will still happen internally.

skeleton

A placeholder state of the component used when the content is not yet available (while loading). The component shows the correct visual structure but with placeholder elements (grey or shimmering blocks) instead of actual content. Can be set directly or inherited from OudsSkeletonProvider. See OudsSkeleton class documentation for all approaches.

Samples

OudsInputTag(
    label = "Input tag",
    onClick = { /* Do something! */ }
)