compose-inspector

Compose Inspector & Layout Verifier

1. Composition & Performance Safety Checks

• Stability: Ensure UI state data classes containing Collections (List, Set, Map) are annotated with @Immutable or @Stable to prevent unnecessary recompositions.
• Calculations: Verify remember is used for expensive object allocations or formatting inside composables.
• Fast-Changing State: Use derivedStateOf when reading rapidly changing states (e.g., lazyListState.firstVisibleItemIndex, scroll offset, real-time pedometer counters) to avoid recomposing the parent scope on every tick.
• Lazy Lists: Every LazyColumn / LazyRow must specify explicit key lambdas using unique, stable IDs (e.g., key = { it.id }).
• State Hoisting: Pass only immutable State and lambda callbacks down to leaf composables. Never pass ViewModel instances into reusable child components.

2. Layout & Localization Verification

• RTL / LTR: Strictly use directional modifiers: Modifier.padding(start = ..., end = ...) instead of left/right.
• Theme & Design Tokens: All colors and text styles must consume this app's theme tokens — MaterialTheme.colorScheme / MaterialTheme.typography. colorResource(R.color…) is allowed when matching existing XML colors. Never use raw hex colors or hardcoded fonts.
• String Resources: Extract all text to values/strings.xml and values-ar/strings.xml.
• Previews: Every independent UI component and screen state (Loading, Empty, Success, Error) must have a @Preview function wrapped in this app's theme (or MaterialTheme), including Arabic RTL (locale = "ar" or CompositionLocalProvider(LocalLayoutDirection provides LayoutDirection.Rtl)) and English LTR (locale = "en" or LayoutDirection.Ltr).