mcpField
K
kotlin-compose

kotlin-compose

github.com/pluginagentmarketplaceDevelopment766 installsUpdated 43w ago
Repository

About kotlin-compose

A skill that guides Kotlin developers in building declarative UIs with Jetpack Compose. It covers state, side effects, modifiers, Material 3 theming, and common recomposition or state-retention fixes.

Key features

  1. 01Compose state management
  2. 02Side-effect handling
  3. 03Modifier usage
  4. 04Material 3 theming
  5. 05Recomposition and state troubleshooting

Use cases

  1. 01Implement stateful Compose screens
  2. 02Handle effects tied to changing inputs
  3. 03Style interfaces with Material 3
  4. 04Diagnose recomposition or rotation state loss

Install

Copy the command and run it in a terminal.

$npx skills add https://github.com/pluginagentmarketplace/custom-plugin-kotlin --skill kotlin-compose

After installing, type/kotlin-composein Claude Code to confirm it loaded.

Bundled files

References and scripts installed along with SKILL.md.

assets/
config.yaml
schema.json
references/
GUIDE.md
PATTERNS.md
scripts/
validate.py

Details

From the project README

Kotlin Compose Skill

Build modern UIs with Jetpack Compose declarative patterns.

Topics Covered

State Management
@Composable
fun Counter() {
    var count by remember { mutableIntStateOf(0) }
    Button(onClick = { count++ }) { Text("Count: $count") }
}

// Derived state
val isValid by remember { derivedStateOf { email.isNotBlank() && password.length >= 8 } }
Side Effects
@Composable
fun UserScreen(userId: String) {
    LaunchedEffect(userId) {
        viewModel.loadUser(userId)
    }

    DisposableEffect(Unit) {
        val listener = viewModel.addListener()
        onDispose { listener.remove() }
    }
}
Modifiers
Box(
    modifier = Modifier
        .fillMaxSize()
        .padding(16.dp)
        .background(MaterialTheme.colorScheme.surface)
        .clickable { onClick() }
)
Material 3 Theming
@Composable
fun AppTheme(content: @Composable () -> Unit) {
    val colorScheme = if (isSystemInDarkTheme()) darkColorScheme() else lightColorScheme()
    MaterialTheme(colorScheme = colorScheme, typography = Typography, content = content)
}

Troubleshooting

IssueResolution
Infinite recompositionUse remember or derivedStateOf
State lost on rotationUse rememberSaveable or ViewModel

Usage

Skill("kotlin-compose")

Comments

Markdown supported