---
title: "StyleState"
description: "The state a style can use to select property values depending on the state of the component is a
style for."
type: "class"
---
Class
Common
```kotlin
@ExperimentalFoundationStyleApi
sealed class StyleState
```
The state a style can use to select property values depending on the state of the component is a
style for.
## Properties
Common
```kotlin
abstract val isEnabled: Boolean
```
`isEnabled` is `true` when the stylable component is enabled.
Elements that can be enabled and disabled will set value when they are called.
The `StyleState.isEnabled` function will only execute its `block` parameter when this
`isEnabled` is true.
`androidx.compose.foundation.text.BasicTextField`, for example, sets this value to the value
of the `enabled` parameter.
Common
```kotlin
abstract val isFocused: Boolean
```
`isFocused` is `true` when the stylable component is focused.
Elements that are focusable will set this state to `true` when are focused.
The `StyleScope.focused` function reads this state and will only set the properties set in
its `block` parameter when `isPressed` is true.
For example, `focusable` will send `FocusInteraction.Focus` and `FocusInteraction.Unfocus`
interactions when the component receives focus or loses focus. When the style state is
watching an `InteractionSource` this state will be updated when the focus interactions are
received in the `InteractionSource`.
Common
```kotlin
abstract val isHovered: Boolean
```
`isHovered` is `true` when the stylable component is hovered.
Elements that are hoverable will set this state to `true` when they are hovered.
The `StyleScope.hovered` function reads this state and will only set the properties set in
its `block` parameter when `isPressed` is true.
For example, `hoverable` will send `HoverInteraction.Enter` and `HoverInteraction.Exit`
interactions when a mouse enters or exits the component. When the style state is watching an
`InteractionSource` this state will be updated when the focus interactions are received in
the `InteractionSource`.
Common
```kotlin
abstract val isPressed: Boolean
```
`isPressed` is `true` when the stylable component is pressed.
Elements that are pressable will set this state to `true` when they are pressed.
The `StyleScope.pressed` function reads this state and will only set the properties set in
its `block` parameter when `isPressed` is `true`.
For example, `clickable` will send `PressInteraction.Press` and `PressInteraction.Release`
interactions when the component is pressed and released. When the style state is watching an
`InteractionSource` it will update this state.
Common
```kotlin
abstract val isSelected: Boolean
```
`isSelected` is `true` when the stylable component is selected.
Elements that are selectable will set this property to `true` when they are selected.
The `StyleScope.selected` function reads this state and will only set the properties in its
`block` parameter when `isSelected` is `true`.
Common
```kotlin
abstract val isChecked: Boolean
```
`isChecked` is `true` when the stylable component is checked.
Elements that are toggleable will set this property to `true` when they are checked.
For example, components that use `toggleable` set `isChecked` to the value of the `checked`
parameter.
The `StyleScope.checked` function reads this state and will only set the properties in its
`block` parameter when `isChecked` is `true`.
Common
```kotlin
abstract val triStateToggle: ToggleableState
```
`triStateToggle` is the state of a tri-state toggleable. A tri-state togglable is a component
that can represent that the checked state is unspecified.
Elements that are selectable will set this property to `true` when is checked.
For example, components that use `triStateToggleable` will set `triStateToggle` parameter to
the value of the `checked` parameter.
The `StyleScope.checked` function reads this state and will only set the properties in its
`block` parameter when `triStateToggle` is `ToggleableState.On`.
The `StyleScope.triStateToggleIndeterminate` function reads this state and will only set the
properties in its `block` parameter when the `triStateToggle` is
`ToggleableState.Indeterminate`.
## Functions
```kotlin
abstract operator fun get(key: StyleStateKey): T
```
Read the value of a style state `key`. This overloads the index operator which allows reading
the key using the array index syntax.
This allows components to define custom state that can be used in a style to control the look
of a composable. For example, a video playing application can introduce a custom
`PlayingStyleState` and set the value of this state. This state can then be in a
`Style` to customize the look of the component when it moves in an out of playing a value.
## Code Examples
### StyleStateSample
```kotlin
@Composable
fun StyleStateSample() {
// Create a styleable clickable box
@Composable
fun ClickableStyleableBox(
onClick: () -> Unit,
modifier: Modifier = Modifier,
style: Style = Style,
enabled: Boolean = true,
) {
val interactionSource = remember { MutableInteractionSource() }
val styleState = rememberUpdatedStyleState(interactionSource) { it.isEnabled = enabled }
Box(
modifier =
modifier
.clickable(interactionSource = interactionSource, onClick = onClick)
.styleable(styleState, style)
)
}
// Create a 150x150 green box that is clickable
ClickableStyleableBox(
onClick = {},
style = {
background(Color.Green)
size(150.dp)
hovered { background(Color.Yellow) }
pressed { background(Color.Red) }
disabled { background(Color.Gray) }
},
)
}
```