@worldcoin/nucleus 0.1.4

package/android/settings.gradle.kts

@@ -0,0 +1,23 @@
+pluginManagement {
+    repositories {
+        google {
+            content {
+                includeGroupByRegex("com\\.android.*")
+                includeGroupByRegex("com\\.google.*")
+                includeGroupByRegex("androidx.*")
+            }
+        }
+        mavenCentral()
+        gradlePluginPortal()
+    }
+}
+dependencyResolutionManagement {
+    repositoriesMode.set(RepositoriesMode.FAIL_ON_PROJECT_REPOS)
+    repositories {
+        google()
+        mavenCentral()
+    }
+}
+
+rootProject.name = "nucleus"
+include(":nucleus")

package/examples/android/README.md

@@ -0,0 +1,34 @@
+# Android Example
+
+Android sample app with two token source variants:
+
+- `local` wraps generated Kotlin sources from `build/android`
+- `package` resolves the Maven artifact `com.worldcoin:nucleus`
+
+## Requirements
+
+- Android Studio Koala or newer
+- Android SDK 35
+- Root dependencies installed with `npm ci`
+
+## Open
+
+Run the root build first so `build/android` exists:
+
+```bash
+npm ci
+npm run build
+```
+
+Open `examples/android` in Android Studio.
+
+Use these build variants:
+
+- `localDebug` or `localRelease` for generated local sources
+- `packageDebug` or `packageRelease` for the Maven package
+
+The `package` variants resolve `com.worldcoin:nucleus` from `mavenLocal()` first, then GitHub Packages.
+
+`examples/android/gradle.properties` includes a default `nucleusPackageVersion`. Update that value to the version you published locally or want to fetch from GitHub Packages.
+
+To use GitHub Packages, set `githubPackagesUser` and `githubPackagesToken` in your Gradle properties or `GITHUB_USER` / `GITHUB_TOKEN` in your environment.

package/examples/android/app/build.gradle.kts

@@ -0,0 +1,69 @@
+plugins {
+    id("com.android.application")
+    kotlin("android")
+    id("org.jetbrains.kotlin.plugin.compose")
+}
+
+android {
+    namespace = "com.worldcoin.nucleusapp"
+    compileSdk = 35
+
+    sourceSets {
+        getByName("main") {
+            assets.srcDir("../../../build/android/src/main/kotlin")
+        }
+    }
+
+    defaultConfig {
+        applicationId = "com.worldcoin.nucleusapp"
+        minSdk = 26
+        targetSdk = 35
+        versionCode = 1
+        versionName = "1.0"
+    }
+
+    flavorDimensions += "tokens"
+
+    productFlavors {
+        create("local") {
+            dimension = "tokens"
+        }
+        create("package") {
+            dimension = "tokens"
+        }
+    }
+
+    buildFeatures {
+        compose = true
+    }
+
+    compileOptions {
+        sourceCompatibility = JavaVersion.VERSION_17
+        targetCompatibility = JavaVersion.VERSION_17
+    }
+
+    kotlinOptions {
+        jvmTarget = "17"
+    }
+}
+
+dependencies {
+    val composeBom = platform("androidx.compose:compose-bom:2024.10.01")
+
+    implementation(composeBom)
+    androidTestImplementation(composeBom)
+
+    implementation("androidx.activity:activity-compose:1.9.3")
+    implementation("androidx.compose.foundation:foundation")
+    implementation("androidx.compose.material3:material3")
+    implementation("androidx.compose.ui:ui")
+    implementation("androidx.compose.ui:ui-tooling-preview")
+    implementation("com.google.android.material:material:1.12.0")
+    debugImplementation("androidx.compose.ui:ui-tooling")
+
+    add("localImplementation", project(":nucleus"))
+    add(
+        "packageImplementation",
+        "com.worldcoin:nucleus:${providers.gradleProperty("nucleusPackageVersion").get()}",
+    )
+}

package/examples/android/app/src/main/AndroidManifest.xml

@@ -0,0 +1,18 @@
+<?xml version="1.0" encoding="utf-8"?>
+<manifest xmlns:android="http://schemas.android.com/apk/res/android">
+    <application
+        android:allowBackup="true"
+        android:label="@string/app_name"
+        android:supportsRtl="true"
+        android:theme="@style/Theme.NucleusApp">
+        <activity
+            android:name=".MainActivity"
+            android:exported="true">
+            <intent-filter>
+                <action android:name="android.intent.action.MAIN" />
+
+                <category android:name="android.intent.category.LAUNCHER" />
+            </intent-filter>
+        </activity>
+    </application>
+</manifest>

package/examples/android/app/src/main/kotlin/com/worldcoin/nucleusapp/DemoComponents.kt

@@ -0,0 +1,251 @@
+package com.worldcoin.nucleusapp
+
+import androidx.compose.foundation.background
+import androidx.compose.foundation.border
+import androidx.compose.foundation.clickable
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.Spacer
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.size
+import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.material3.DropdownMenu
+import androidx.compose.material3.DropdownMenuItem
+import androidx.compose.material3.MaterialTheme
+import androidx.compose.material3.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.LaunchedEffect
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.remember
+import androidx.compose.runtime.setValue
+import androidx.compose.ui.draw.clip
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.platform.LocalClipboardManager
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.text.AnnotatedString
+import androidx.compose.ui.unit.dp
+import kotlinx.coroutines.delay
+
+@Composable
+fun HeroSection(
+    theme: TokenTheme,
+    appearanceThemes: List<AppearanceTheme>,
+    selectedAppearanceId: String,
+    onSelectAppearance: (String) -> Unit,
+    demoSections: List<TokenSectionData>,
+    selectedSectionId: String,
+    onSelectSection: (String) -> Unit,
+) {
+    var menuExpanded by remember { mutableStateOf(false) }
+
+    Row(
+        modifier = Modifier.fillMaxWidth(),
+        horizontalArrangement = Arrangement.spacedBy(12.dp),
+        verticalAlignment = Alignment.CenterVertically,
+    ) {
+        Text(
+            text = "Nucleus",
+            style = MaterialTheme.typography.headlineLarge,
+            color = theme.text,
+        )
+
+        Spacer(modifier = Modifier.weight(1f))
+
+        AppearanceToggle(
+            appearanceThemes = appearanceThemes,
+            selectedAppearanceId = selectedAppearanceId,
+            onSelect = onSelectAppearance,
+            theme = theme,
+        )
+
+        Box {
+            val menuShape = RoundedCornerShape(24.dp)
+
+            HamburgerButton(
+                color = theme.text,
+                border = theme.border,
+                onClick = { menuExpanded = true },
+            )
+
+            DropdownMenu(
+                expanded = menuExpanded,
+                onDismissRequest = { menuExpanded = false },
+                modifier = Modifier.background(theme.surface, menuShape),
+                shape = menuShape,
+            ) {
+                demoSections.forEach { section ->
+                    val isSelected = section.id == selectedSectionId
+                    DropdownMenuItem(
+                        text = {
+                            Text(
+                                text = if (isSelected) "${section.label}  \u2713" else section.label,
+                                color = if (isSelected) theme.text else theme.muted,
+                            )
+                        },
+                        onClick = {
+                            onSelectSection(section.id)
+                            menuExpanded = false
+                        },
+                    )
+                }
+            }
+        }
+    }
+}
+
+@Composable
+fun AppearanceToggle(
+    appearanceThemes: List<AppearanceTheme>,
+    selectedAppearanceId: String,
+    onSelect: (String) -> Unit,
+    theme: TokenTheme,
+) {
+    val pillShape = RoundedCornerShape(999.dp)
+
+    Row(
+        modifier = Modifier
+            .border(1.dp, theme.border, pillShape)
+            .padding(4.dp),
+        horizontalArrangement = Arrangement.spacedBy(6.dp),
+    ) {
+        appearanceThemes.forEach { appearance ->
+            val selected = appearance.id == selectedAppearanceId
+            Box(
+                modifier = Modifier
+                    .background(
+                        if (selected) theme.text else Color.Transparent,
+                        pillShape,
+                    )
+                    .clip(pillShape)
+                    .clickable { onSelect(appearance.id) }
+                    .padding(horizontal = 14.dp, vertical = 8.dp),
+            ) {
+                Text(
+                    text = appearance.name,
+                    color = if (selected) theme.background else theme.text,
+                    style = MaterialTheme.typography.labelLarge,
+                )
+            }
+        }
+    }
+}
+
+@Composable
+fun HamburgerButton(
+    color: Color,
+    border: Color,
+    onClick: () -> Unit,
+) {
+    val buttonShape = RoundedCornerShape(22.dp)
+
+    Column(
+        modifier = Modifier
+            .size(44.dp)
+            .clip(buttonShape)
+            .border(1.dp, border, buttonShape)
+            .clickable(onClick = onClick)
+            .padding(horizontal = 12.dp, vertical = 11.dp),
+        verticalArrangement = Arrangement.spacedBy(4.dp, Alignment.CenterVertically),
+        horizontalAlignment = Alignment.CenterHorizontally,
+    ) {
+        repeat(3) {
+            Box(
+                modifier = Modifier
+                    .fillMaxWidth()
+                    .size(width = 18.dp, height = 2.dp)
+                    .background(color, RoundedCornerShape(999.dp)),
+            )
+        }
+    }
+}
+
+@Composable
+fun TokenSectionCard(
+    section: TokenSectionData,
+    theme: TokenTheme,
+) {
+    Column(verticalArrangement = Arrangement.spacedBy(24.dp)) {
+        section.groups.forEach { group ->
+            ColorGroupSection(group = group, theme = theme)
+        }
+    }
+}
+
+@Composable
+fun ColorGroupSection(group: TokenGroup, theme: TokenTheme) {
+    Column(verticalArrangement = Arrangement.spacedBy(10.dp)) {
+        Text(
+            text = group.name,
+            style = MaterialTheme.typography.labelLarge,
+            color = theme.muted,
+        )
+
+        Column(verticalArrangement = Arrangement.spacedBy(8.dp)) {
+            group.tokens.forEach { token ->
+                TokenCard(token = token, theme = theme)
+            }
+        }
+    }
+}
+
+@Composable
+fun TokenCard(token: TokenSwatch, theme: TokenTheme) {
+    val clipboardManager = LocalClipboardManager.current
+    var copied by remember { mutableStateOf(false) }
+    val cardShape = RoundedCornerShape(18.dp)
+
+    LaunchedEffect(copied) {
+        if (copied) {
+            delay(1200)
+            copied = false
+        }
+    }
+
+    Row(
+        modifier = Modifier
+            .fillMaxWidth()
+            .clip(cardShape)
+            .background(theme.surfaceAlt, cardShape)
+            .border(1.dp, theme.border, cardShape)
+            .clickable {
+                clipboardManager.setText(AnnotatedString("#${token.hex}"))
+                copied = true
+            }
+            .padding(14.dp),
+        verticalAlignment = Alignment.CenterVertically,
+        horizontalArrangement = Arrangement.spacedBy(12.dp),
+    ) {
+        Box(
+            modifier = Modifier
+                .size(44.dp)
+                .background(token.color, RoundedCornerShape(12.dp))
+                .border(1.dp, theme.border, RoundedCornerShape(12.dp)),
+        )
+
+        Column(verticalArrangement = Arrangement.spacedBy(4.dp)) {
+            Text(
+                text = token.name,
+                style = MaterialTheme.typography.bodyLarge,
+                color = theme.text,
+            )
+            Text(
+                text = "#${token.hex}",
+                style = MaterialTheme.typography.bodySmall,
+                color = theme.muted,
+            )
+        }
+
+        Spacer(modifier = Modifier.weight(1f))
+
+        Text(
+            text = if (copied) "Copied" else "Copy",
+            style = MaterialTheme.typography.bodySmall,
+            color = theme.muted,
+        )
+    }
+}

package/examples/android/app/src/main/kotlin/com/worldcoin/nucleusapp/DemoModels.kt

@@ -0,0 +1,51 @@
+package com.worldcoin.nucleusapp
+
+import androidx.compose.ui.graphics.Color
+
+data class TokenTheme(
+    val background: Color,
+    val surface: Color,
+    val surfaceAlt: Color,
+    val border: Color,
+    val text: Color,
+    val muted: Color,
+    val accent: Color,
+    val accentContent: Color,
+)
+
+data class AppearanceTheme(
+    val id: String,
+    val name: String,
+    val theme: TokenTheme,
+)
+
+data class TokenGroup(
+    val id: String,
+    val name: String,
+    val tokens: List<TokenSwatch>,
+)
+
+data class TokenSwatch(
+    val id: String,
+    val name: String,
+    val hex: String,
+    val color: Color,
+)
+
+data class SemanticModeData(
+    val id: String,
+    val name: String,
+    val theme: TokenTheme,
+    val groups: List<TokenGroup>,
+)
+
+data class TokenSectionData(
+    val id: String,
+    val label: String,
+    val groups: List<TokenGroup>,
+)
+
+data class TokenCatalog(
+    val appearanceThemes: List<AppearanceTheme>,
+    val tokenSections: List<TokenSectionData>,
+)

package/examples/android/app/src/main/kotlin/com/worldcoin/nucleusapp/MainActivity.kt

@@ -0,0 +1,19 @@
+package com.worldcoin.nucleusapp
+
+import android.os.Bundle
+import androidx.activity.ComponentActivity
+import androidx.activity.compose.setContent
+import androidx.activity.enableEdgeToEdge
+import androidx.compose.material3.MaterialTheme
+
+class MainActivity : ComponentActivity() {
+    override fun onCreate(savedInstanceState: Bundle?) {
+        super.onCreate(savedInstanceState)
+        enableEdgeToEdge()
+        setContent {
+            MaterialTheme {
+                NucleusApp()
+            }
+        }
+    }
+}

package/examples/android/app/src/main/kotlin/com/worldcoin/nucleusapp/NucleusApp.kt

@@ -0,0 +1,72 @@
+package com.worldcoin.nucleusapp
+
+import androidx.compose.foundation.background
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.PaddingValues
+import androidx.compose.foundation.layout.WindowInsets
+import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.asPaddingValues
+import androidx.compose.foundation.layout.safeDrawing
+import androidx.compose.foundation.lazy.LazyColumn
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.remember
+import androidx.compose.runtime.saveable.rememberSaveable
+import androidx.compose.runtime.setValue
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.platform.LocalContext
+import androidx.compose.ui.platform.LocalLayoutDirection
+import androidx.compose.ui.unit.dp
+
+@Composable
+fun NucleusApp() {
+    val context = LocalContext.current
+    val layoutDirection = LocalLayoutDirection.current
+    val tokenCatalog = remember(context) { loadTokenCatalog(context) }
+    val defaultAppearanceId = tokenCatalog.appearanceThemes.firstOrNull { it.id == "dark" }?.id
+        ?: tokenCatalog.appearanceThemes.first().id
+    val systemBarPadding = WindowInsets.safeDrawing.asPaddingValues()
+    val leftInset = systemBarPadding.calculateLeftPadding(layoutDirection)
+    val rightInset = systemBarPadding.calculateRightPadding(layoutDirection)
+    val horizontalInset = if (leftInset > rightInset) leftInset else rightInset
+    val contentPadding = PaddingValues(
+        start = horizontalInset + 16.dp,
+        top = systemBarPadding.calculateTopPadding(),
+        end = horizontalInset + 16.dp,
+        bottom = systemBarPadding.calculateBottomPadding() + 16.dp,
+    )
+
+    var selectedSectionId by rememberSaveable { mutableStateOf(tokenCatalog.tokenSections.first().id) }
+    var selectedAppearanceId by rememberSaveable { mutableStateOf(defaultAppearanceId) }
+
+    val selectedSection = tokenCatalog.tokenSections.firstOrNull { it.id == selectedSectionId } ?: tokenCatalog.tokenSections.first()
+    val activeAppearance = tokenCatalog.appearanceThemes.firstOrNull { it.id == selectedAppearanceId } ?: tokenCatalog.appearanceThemes.first()
+
+    LazyColumn(
+        modifier = Modifier
+            .fillMaxSize()
+            .background(activeAppearance.theme.background),
+        contentPadding = contentPadding,
+        verticalArrangement = Arrangement.spacedBy(20.dp),
+    ) {
+        item {
+            HeroSection(
+                theme = activeAppearance.theme,
+                appearanceThemes = tokenCatalog.appearanceThemes,
+                selectedAppearanceId = selectedAppearanceId,
+                onSelectAppearance = { selectedAppearanceId = it },
+                demoSections = tokenCatalog.tokenSections,
+                selectedSectionId = selectedSectionId,
+                onSelectSection = { selectedSectionId = it },
+            )
+        }
+
+        item {
+            TokenSectionCard(
+                section = selectedSection,
+                theme = activeAppearance.theme,
+            )
+        }
+    }
+}