kmp-compose-state-hoisting

Hoist state by moving it to the lowest common ancestor of all composables that read or write it. Convert the composable to a stateless form that receives the value and an onValueChange-style callback, so the caller owns the state and the composable becomes a pure render function.

A stateful composable owns its state internally with remember and mutableStateOf, so callers cannot observe or control it. A stateless composable receives state as parameters plus change callbacks, making it testable, previewable, and shareable across siblings.

Use derivedStateOf when a computed value changes less often than its input states, such as a form validity flag or a filtered list. Always wrap it in remember, otherwise a new DerivedState object is created on every recomposition and the memoization is lost.

Keep state in local remember when it is purely ephemeral UI state like dropdown open flags, tooltip visibility, focus, or scroll position. Move state to a ViewModel only when it involves async data, persists across navigation, or is shared with another screen.

Compose marks parameters containing List, Map, or interface types as unstable, which disables recomposition skipping. Annotate the data class with @Stable or @Immutable, or use immutable collection types, so the compiler can skip the composable when inputs are unchanged.

Pass fixed state values directly to the stateless composable in a ComposeTestRule test and assert the rendered output. Verify callbacks by capturing invocations in local variables, since the composable is a pure function of its inputs.