# RemoteCompactButton

## Functions summary

|---|---|
| `https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-unit/index.html` | `@https://developer.android.com/reference/kotlin/androidx/compose/runtime/Composable @https://developer.android.com/reference/kotlin/androidx/compose/remote/creation/compose/layout/RemoteComposable https://developer.android.com/reference/kotlin/androidx/wear/compose/remote/material3/RemoteCompactButton.composable#RemoteCompactButton(androidx.compose.remote.creation.compose.action.RemoteAction,androidx.compose.remote.creation.compose.modifier.RemoteModifier,kotlin.Function0,androidx.compose.remote.creation.compose.state.RemoteBoolean,androidx.compose.remote.creation.compose.shapes.RemoteShape,androidx.wear.compose.remote.material3.RemoteButtonColors,androidx.wear.compose.remote.material3.RemoteBorderStroke,androidx.compose.remote.creation.compose.layout.RemotePaddingValues,kotlin.Function1)( onClick: https://developer.android.com/reference/kotlin/androidx/compose/remote/creation/compose/action/RemoteAction, modifier: https://developer.android.com/reference/kotlin/androidx/compose/remote/creation/compose/modifier/RemoteModifier, icon: (@https://developer.android.com/reference/kotlin/androidx/compose/runtime/Composable @https://developer.android.com/reference/kotlin/androidx/compose/remote/creation/compose/layout/RemoteComposable () -> https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-unit/index.html)?, enabled: https://developer.android.com/reference/kotlin/androidx/compose/remote/creation/compose/state/RemoteBoolean, shape: https://developer.android.com/reference/kotlin/androidx/compose/remote/creation/compose/shapes/RemoteShape, colors: https://developer.android.com/reference/kotlin/androidx/wear/compose/remote/material3/RemoteButtonColors, border: https://developer.android.com/reference/kotlin/androidx/wear/compose/remote/material3/RemoteBorderStroke?, contentPadding: https://developer.android.com/reference/kotlin/androidx/compose/remote/creation/compose/layout/RemotePaddingValues, label: (@https://developer.android.com/reference/kotlin/androidx/compose/runtime/Composable @https://developer.android.com/reference/kotlin/androidx/compose/remote/creation/compose/layout/RemoteComposable https://developer.android.com/reference/kotlin/androidx/compose/remote/creation/compose/layout/RemoteRowScope.() -> https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-unit/index.html)? )` A Wear Material3 `https://developer.android.com/reference/kotlin/androidx/wear/compose/remote/material3/RemoteCompactButton.composable#RemoteCompactButton(androidx.compose.remote.creation.compose.action.RemoteAction,androidx.compose.remote.creation.compose.modifier.RemoteModifier,kotlin.Function0,androidx.compose.remote.creation.compose.state.RemoteBoolean,androidx.compose.remote.creation.compose.shapes.RemoteShape,androidx.wear.compose.remote.material3.RemoteButtonColors,androidx.wear.compose.remote.material3.RemoteBorderStroke,androidx.compose.remote.creation.compose.layout.RemotePaddingValues,kotlin.Function1)` that offers two slots and a specific layout for an icon and label. |

## Functions

### RemoteCompactButton

Artifact: [androidx.wear.compose.remote:remote-material3](https://developer.android.com/jetpack/androidx/releases/wear-compose-remote) [View Source](https://cs.android.com/search?q=file:androidx/wear/compose/remote/material3/RemoteButton.kt+function:RemoteCompactButton)

```
@Composable
@RemoteComposable
fun RemoteCompactButton(
    onClick: RemoteAction,
    modifier: RemoteModifier = RemoteModifier,
    icon: (@Composable @RemoteComposable () -> Unit)? = null,
    enabled: RemoteBoolean = true.rb,
    shape: RemoteShape = RemoteButtonDefaults.compactButtonShape,
    colors: RemoteButtonColors = RemoteButtonDefaults.buttonColors(),
    border: RemoteBorderStroke? = null,
    contentPadding: RemotePaddingValues = RemoteButtonDefaults.CompactButtonContentPadding,
    label: (@Composable @RemoteComposable RemoteRowScope.() -> Unit)? = null
): Unit
```

A Wear Material3 `https://developer.android.com/reference/kotlin/androidx/wear/compose/remote/material3/RemoteCompactButton.composable#RemoteCompactButton(androidx.compose.remote.creation.compose.action.RemoteAction,androidx.compose.remote.creation.compose.modifier.RemoteModifier,kotlin.Function0,androidx.compose.remote.creation.compose.state.RemoteBoolean,androidx.compose.remote.creation.compose.shapes.RemoteShape,androidx.wear.compose.remote.material3.RemoteButtonColors,androidx.wear.compose.remote.material3.RemoteBorderStroke,androidx.compose.remote.creation.compose.layout.RemotePaddingValues,kotlin.Function1)` that offers two slots and a specific layout for an icon and label. Both the icon and label are optional however it is expected that at least one will be provided.

The `https://developer.android.com/reference/kotlin/androidx/wear/compose/remote/material3/RemoteCompactButton.composable#RemoteCompactButton(androidx.compose.remote.creation.compose.action.RemoteAction,androidx.compose.remote.creation.compose.modifier.RemoteModifier,kotlin.Function0,androidx.compose.remote.creation.compose.state.RemoteBoolean,androidx.compose.remote.creation.compose.shapes.RemoteShape,androidx.wear.compose.remote.material3.RemoteButtonColors,androidx.wear.compose.remote.material3.RemoteBorderStroke,androidx.compose.remote.creation.compose.layout.RemotePaddingValues,kotlin.Function1)` is Stadium shaped and has a max height designed to take no more than one line of text and/or one icon. The default max height is `https://developer.android.com/reference/kotlin/androidx/wear/compose/remote/material3/RemoteButtonDefaults#CompactButtonHeight()`. This includes a visible button height of 32.dp and 8.dp of padding above and below the button in order to meet accessibility guidelines that request a minimum of 48.dp height and width of tappable area.

If an icon is provided then the labels should be "start" aligned, e.g. left aligned in left-to-right mode so that the text starts next to the icon.

The items are laid out as follows.

1. If a label is provided then the button will be laid out with the optional icon at the start of a row followed by the label with a default max height of `https://developer.android.com/reference/kotlin/androidx/wear/compose/remote/material3/RemoteButtonDefaults#CompactButtonHeight()`.

2. If only an icon is provided it will be laid out vertically and horizontally centered with a default height of `https://developer.android.com/reference/kotlin/androidx/wear/compose/remote/material3/RemoteButtonDefaults#CompactButtonHeight()` and the default width of `https://developer.android.com/reference/kotlin/androidx/wear/compose/remote/material3/RemoteButtonDefaults#IconOnlyCompactButtonWidth()`

If neither icon nor label is provided then the button will be displayed like an icon only button but with no contents or background color.

`https://developer.android.com/reference/kotlin/androidx/wear/compose/remote/material3/RemoteCompactButton.composable#RemoteCompactButton(androidx.compose.remote.creation.compose.action.RemoteAction,androidx.compose.remote.creation.compose.modifier.RemoteModifier,kotlin.Function0,androidx.compose.remote.creation.compose.state.RemoteBoolean,androidx.compose.remote.creation.compose.shapes.RemoteShape,androidx.wear.compose.remote.material3.RemoteButtonColors,androidx.wear.compose.remote.material3.RemoteBorderStroke,androidx.compose.remote.creation.compose.layout.RemotePaddingValues,kotlin.Function1)` takes the `https://developer.android.com/reference/kotlin/androidx/wear/compose/remote/material3/RemoteButtonDefaults#buttonColors()` color scheme by default, with colored background, contrasting content color and no border. This is a high-emphasis button for the primary, most important or most common action on a screen.

`https://developer.android.com/reference/kotlin/androidx/wear/compose/remote/material3/RemoteCompactButton.composable#RemoteCompactButton(androidx.compose.remote.creation.compose.action.RemoteAction,androidx.compose.remote.creation.compose.modifier.RemoteModifier,kotlin.Function0,androidx.compose.remote.creation.compose.state.RemoteBoolean,androidx.compose.remote.creation.compose.shapes.RemoteShape,androidx.wear.compose.remote.material3.RemoteButtonColors,androidx.wear.compose.remote.material3.RemoteBorderStroke,androidx.compose.remote.creation.compose.layout.RemotePaddingValues,kotlin.Function1)` can be enabled or disabled. A disabled button will not respond to click events.

```kotlin
import androidx.compose.remote.creation.compose.action.valueChange
import androidx.compose.remote.creation.compose.state.MutableRemoteInt
import androidx.compose.remote.creation.compose.state.rs
import androidx.compose.runtime.remember
import androidx.wear.compose.remote.material3.RemoteCompactButton
import androidx.wear.compose.remote.material3.RemoteText

val tapCount = remember { MutableRemoteInt(0) }
val countSuffix = " (".rs + tapCount.toRemoteString() + " taps)"

RemoteCompactButton(
    valueChange(tapCount, tapCount + 1),
    modifier = modifier,
    label = { RemoteText("Tap me!".rs + countSuffix) },
)
```

| Parameters |
|---|---|
| `onClick: https://developer.android.com/reference/kotlin/androidx/compose/remote/creation/compose/action/RemoteAction` | Will be called when the user clicks the button |
| `modifier: https://developer.android.com/reference/kotlin/androidx/compose/remote/creation/compose/modifier/RemoteModifier = RemoteModifier` | Modifier to be applied to the button |
| `icon: (@https://developer.android.com/reference/kotlin/androidx/compose/runtime/Composable @https://developer.android.com/reference/kotlin/androidx/compose/remote/creation/compose/layout/RemoteComposable () -> https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-unit/index.html)? = null` | A slot for providing the button's icon. The contents are expected to be a horizontally and vertically aligned icon of size `https://developer.android.com/reference/kotlin/androidx/wear/compose/remote/material3/RemoteButtonDefaults#ExtraSmallIconSize()` when used with a label or `https://developer.android.com/reference/kotlin/androidx/wear/compose/remote/material3/RemoteButtonDefaults#SmallIconSize()` when used as the only content in the button. |
| `enabled: https://developer.android.com/reference/kotlin/androidx/compose/remote/creation/compose/state/RemoteBoolean = true.rb` | Controls the enabled state of the button. When `false`, this button will not be clickable. It must be a constant value. |
| `shape: https://developer.android.com/reference/kotlin/androidx/compose/remote/creation/compose/shapes/RemoteShape = RemoteButtonDefaults.compactButtonShape` | Defines the button's shape. It is strongly recommended to use the default as this shape is a key characteristic of the Wear Material3 Theme |
| `colors: https://developer.android.com/reference/kotlin/androidx/wear/compose/remote/material3/RemoteButtonColors = RemoteButtonDefaults.buttonColors()` | `https://developer.android.com/reference/kotlin/androidx/wear/compose/remote/material3/RemoteButtonColors` that will be used to resolve the background and content color for this button in different states. See `https://developer.android.com/reference/kotlin/androidx/wear/compose/remote/material3/RemoteButtonDefaults#buttonColors()`. |
| `border: https://developer.android.com/reference/kotlin/androidx/wear/compose/remote/material3/RemoteBorderStroke? = null` | Optional `https://developer.android.com/reference/kotlin/androidx/wear/compose/remote/material3/RemoteBorderStroke` that will be used to resolve the border for this button in different states. |
| `contentPadding: https://developer.android.com/reference/kotlin/androidx/compose/remote/creation/compose/layout/RemotePaddingValues = RemoteButtonDefaults.CompactButtonContentPadding` | The spacing values to apply internally between the container and the content |
| `label: (@https://developer.android.com/reference/kotlin/androidx/compose/runtime/Composable @https://developer.android.com/reference/kotlin/androidx/compose/remote/creation/compose/layout/RemoteComposable https://developer.android.com/reference/kotlin/androidx/compose/remote/creation/compose/layout/RemoteRowScope.() -> https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-unit/index.html)? = null` | Slot for composable body content displayed on the `https://developer.android.com/reference/kotlin/androidx/wear/compose/remote/material3/RemoteCompactButton.composable#RemoteCompactButton(androidx.compose.remote.creation.compose.action.RemoteAction,androidx.compose.remote.creation.compose.modifier.RemoteModifier,kotlin.Function0,androidx.compose.remote.creation.compose.state.RemoteBoolean,androidx.compose.remote.creation.compose.shapes.RemoteShape,androidx.wear.compose.remote.material3.RemoteButtonColors,androidx.wear.compose.remote.material3.RemoteBorderStroke,androidx.compose.remote.creation.compose.layout.RemotePaddingValues,kotlin.Function1)` |