Patterns from production · Streams that hold still

Patch in place

When one event changes, only its row changes.

Patch in placeLive demo

Try the controls to see the rule.

The rule

Update existing nodes when their identity is unchanged. Keep focus, selection, and local element state attached to the same node.

Tokens used

  • motion.duration.fast180ms
  • motion.easing.standardcubic-bezier(.2,.7,.2,1)
  • space.md12px
  • size.tap44px
  • motion.duration.base260ms

Native spec · generated from this pattern and the shared token registry

SwiftUI
struct OvPatchInPlace: View {
    let status: String
    @Environment(\.accessibilityReduceMotion) private var reduceMotion
    var body: some View {
        HStack(spacing: OvScale.spaceMd) {
            Text(status).font(.body)
        }
        .frame(minHeight: OvScale.sizeTap)
        .animation(reduceMotion ? .none : .easeOut(duration: OvScale.motionDurationBase), value: status)
    }
}
// Tokens: motion.duration.fast=180ms, motion.easing.standard=cubic-bezier(.2,.7,.2,1), space.md=12px, size.tap=44px, motion.duration.base=260ms
Compose
@Composable
fun OvPatchInPlace(status: String, reduceMotion: Boolean) {
    Row(
        modifier = Modifier.defaultMinSize(minHeight = OvScale.SizeTap),
        horizontalArrangement = Arrangement.spacedBy(OvScale.SpaceMd),
    ) {
        Text(status, style = MaterialTheme.typography.bodyMedium)
    }
    // Apply motion only when !reduceMotion.
}
// Tokens: motion.duration.fast=180ms, motion.easing.standard=cubic-bezier(.2,.7,.2,1), space.md=12px, size.tap=44px, motion.duration.base=260ms