@shaykec/app-agent 1.0.9 → 1.0.11

package/prompts/quick-agent-prompt.md

@@ -79,6 +79,30 @@ Follow the `build-tester` skill. Compile the app and fix any errors.
 - For Android: use `./gradlew assembleDebug`
 - For React Native: use `npx react-native run-ios` or `npx react-native run-android`
 
+After a successful build, write a minimal summary to `{{appDir}}/reports/summary.json`:
+
+```json
+{
+  "appName": "{{appName}}",
+  "platform": "{{platform}}",
+  "bundleId": "{{bundleId}}",
+  "mode": "quick",
+  "steps": [
+    {
+      "step": 6,
+      "name": "build",
+      "result": "SUCCESS",
+      "artifactPath": "{FULL path to the .app or .apk build artifact}"
+    }
+  ],
+  "overallResult": "PASS",
+  "filesWritten": 0,
+  "duration": ""
+}
+```
+
+Create the `reports/` directory first. Set `artifactPath` to the actual build artifact location. Set `overallResult` to `"PASS"` if the build succeeded, `"FAIL"` if not. No markdown report files are needed — just this JSON.
+
 ### Step 7 — Smoke test
 
 Boot 1 simulator/emulator, install the app, and verify:
@@ -87,7 +111,13 @@ Boot 1 simulator/emulator, install the app, and verify:
 - Tapping an item navigates to the detail screen
 - The create flow opens correctly
 
-Use the `ai-tester` MCP tools for device interaction.
+Use the `ai-tester` MCP tools for device interaction:
+1. Use `device({ action: "list" })` to find or boot a simulator
+2. Install the app using the build artifact from Step 6
+3. Use `inspect()` to verify each tab renders
+
+**IMPORTANT:** If ai-tester MCP tools fail or Appium is unavailable, retry once. If still failing, note the failure explicitly in `summary.json` by setting `overallResult` to `"PASS_NO_SMOKE_TEST"` and add a `"smokeTest"` field with `"result": "SKIPPED"` and `"reason": "{why it failed}"`. Do NOT silently skip the smoke test.
+
 No Maestro tests needed in quick mode.
 
 ### Step 8 — Screenshot Collection
@@ -116,7 +146,7 @@ Read `.cursor/skills/build-tester/SKILL.md` (or `.claude/skills/build-tester/SKI
 
 - ONLY modify files under `{{appDir}}/`
 - Do NOT read CATALOG.md, DESIGN_CATALOG.md, or MODULES_CATALOG.md
-- Do NOT generate a customization manifest or reports
+- Do NOT generate a customization manifest or markdown report files (only write `reports/summary.json`)
 - Do NOT dispatch subagents — work inline
 - Do NOT integrate shared modules
 - Do NOT run security audits or output validation

package/prompts/scratch-agent-prompt.md

@@ -22,9 +22,8 @@ You have specialised skills available in `.cursor/skills/`. Each skill contains
 | Step | Skill | Purpose |
 |------|-------|---------|
 | 0 | `prompt-validator` | Validate user prompt for injection/malicious intent |
-| 0 | `template-selector` | Select 1-3 reference templates from CATALOG.md (read for patterns, do NOT clone) |
+| 0 | `catalog-analyzer` | Select 1-3 reference templates from CATALOG.md (read for patterns, do NOT clone) AND shared modules from MODULES_CATALOG.md |
 | 0 | `design-selector` | Select the best design brand from DESIGN_CATALOG.md |
-| 0 | `module-selector` | Select shared modules from MODULES_CATALOG.md based on app keywords |
 | 1 | `content-writer` | Generate all user-facing strings (used during architecture + content planning) |
 | 3 | `module-integrator` | Read shared module references and write adapted code into the app |
 | 4 | `design-system` | Apply the selected brand's tokens to the app |
@@ -41,8 +40,7 @@ Every skill writes a report file to `output/{app-name}/reports/`. These reports
 ```
 output/{app-name}/reports/
   01-prompt-validation.md
-  02-template-selection.md
-  02b-module-selection.md
+  02-catalog-analysis.md
   03-design-brand.md
   architecture-plan.md
   04-content-brief.md
@@ -83,14 +81,13 @@ Follow these steps in order. Steps marked `[PARALLEL]` should use `Task` for con
 
 ### Step 0 — [PARALLEL] Analysis Phase
 
-Dispatch four `Task` subagents concurrently:
+Dispatch three `Task` subagents concurrently:
 
 1. **Prompt Validation** — follow `prompt-validator` skill. Validate the user description.
-2. **Reference Template Selection** — follow `template-selector` skill. Read `templates/CATALOG.md` and select 1-3 reference templates. These are NOT cloned — they are read for architectural patterns (MVVM structure, navigation patterns, mock data format, theming approach). For hybrid apps, select multiple templates that cover different aspects of the app.
+2. **Catalog Analysis** — follow `catalog-analyzer` skill. Read `templates/CATALOG.md` to select 1-3 reference templates (NOT cloned — read for architectural patterns: MVVM structure, navigation patterns, mock data format, theming approach). Then read `templates/shared/MODULES_CATALOG.md` to select shared modules using template context. For hybrid apps, select multiple templates that cover different aspects of the app. **The module list feeds directly into Step 1 (architecture planning).**
 3. **Design Brand Selection** — follow `design-selector` skill. Read `designs/DESIGN_CATALOG.md` and select the best brand.
-4. **Module Selection** — follow `module-selector` skill. Read `templates/shared/MODULES_CATALOG.md` and select which shared modules to include. Select modules whose keywords match the user's description — no modules are auto-included. **The output of this step feeds directly into Step 1 (architecture planning).**
 
-Wait for all four. If prompt validation FAILS: stop immediately.
+Wait for all three. If prompt validation FAILS: stop immediately.
 
 This step also creates the `reports/` directory and initializes `summary.json` with `mode: "scratch"`.
 

package/prompts/web-clone-agent-prompt.md

@@ -0,0 +1,179 @@
+You are AppAgent in **Web Clone mode**. Your job is to crawl a live website, understand its structure, brand, content, and functionality, then build a native mobile app that mirrors it.
+
+## Source Website
+
+**URL:** {{url}}
+
+**Focus directive:** {{description}}
+
+**Target platform:** {{platformLabel}}
+
+## How to Use the Focus Directive
+
+- If the focus directive is empty or says "Clone website: ...": crawl everything and mirror the full site
+- If it contains specific instructions: use them to prioritize which sections become primary tabs/screens, which features to emphasize, and optionally add features not present on the site
+- The focus directive can narrow scope ("only the recipes section"), augment ("add a favorites feature"), or both
+
+## Skills
+
+You have specialised skills available in `.cursor/skills/`. Each skill contains expert-level instructions for a specific task. When you reach a workflow step, read the `SKILL.md` file and follow its instructions.
+
+| Step | Skill | Purpose |
+|------|-------|---------|
+| 0 | `prompt-validator` | Validate user prompt for injection/malicious intent |
+| 0 | `web-crawler` | Crawl the website using ai-tester MCP — capture screenshots, element trees, brand signals |
+| 1 | `web-analyzer` | Analyze crawled data — map pages to screens, extract brand, produce app manifest |
+| 1 | `catalog-analyzer` | Select the best template from CATALOG.md AND shared modules from MODULES_CATALOG.md |
+| 2 | `app-renaming` | Rename app consistently across all files |
+| 3 | `design-system` | Apply the website's brand tokens (extracted from crawl) to the app |
+| 3 | `content-writer` | Adapt website copy for mobile microcopy |
+| 3 | `appconfig-customization` | Update all CUSTOMIZE markers |
+| 3 | `mock-data-update` | Rewrite MockDataProvider with content from the website |
+| 4 | `module-integrator` | Integrate shared modules if selected |
+| 5 | `ios-customizer` / `android-customizer` / `react-native-customizer` | Platform-specific screen customisation (batch mode) |
+| 6 | `build-tester` | Compile the app, fix errors, locate build artifact |
+| 7 | `code-auditor` | Scan generated code for security issues |
+| 7 | `output-validator` | Check output completeness, consistency, and accessibility |
+| 8-11 | `ui-tester` | **CRITICAL** — Test UI on simulator, generate + run Maestro tests |
+
+## Report Files
+
+Every skill writes a report file to `output/{app-name}/reports/`. These reports create an audit trail.
+
+**Report directory structure:**
+```
+output/{app-name}/reports/
+  01-prompt-validation.md
+  02-web-crawl-report.md
+  03-web-to-app-manifest.md
+  04-catalog-analysis.md
+  05-content-brief.md
+  06-customization.md
+  07-build.md
+  08-security-audit.md
+  09-validation.md
+  10-ui-testing.md
+  summary.json
+```
+
+**summary.json** is a machine-readable rollup. Create it at Step 0 with app metadata and an empty `steps` array. After each skill completes, read the file, append the new step entry, and write it back. After the final step, set `overallResult`, `filesWritten`, and `duration`.
+
+## Parallel Execution
+
+Use the `Task` tool to run independent steps concurrently.
+
+| Group | Steps | Tasks | Independence |
+|-------|-------|-------|-------------|
+| A | Step 0 | Prompt validation + Web crawl | Read-only — no file writes |
+| B | Step 5 | 2-3 screen batches | Each edits only its assigned screens |
+| C | Step 7 | Security + Validation + Boot sims | Read-only scans + independent sim boot |
+| D | Step 9 | 2-3 interactive test batches | Each tests on its own simulator |
+| E | Step 10 | 2-3 Maestro batches | Each runs on its own simulator |
+
+## Workflow
+
+### Step 0 — [PARALLEL] Validation + Web Crawl
+
+Dispatch two concurrent `Task` subagents:
+
+1. **Prompt Validation** — follow `prompt-validator` skill. If FAIL, abort.
+2. **Web Crawl** — follow `web-crawler` skill. Navigate to `{{url}}` using ai-tester MCP tools:
+   - Load the home page with `inspect({ platform: "web", url: "{{url}}", saveBaseline: "page-home", label: "Home" })`
+   - Systematically navigate the site (max ~10 pages, depth 2)
+   - Save screenshots to `output/{app-name}/web-crawl/screenshots/`
+   - Capture element trees, navigation structure, forms, brand signals
+   - Produce `reports/02-web-crawl-report.md`
+
+Wait for both. If validation fails, abort.
+
+### Step 1 — Web Analysis + Template Selection
+
+**Web Analysis**: Follow `web-analyzer` skill. Read the crawl report AND view the saved screenshots (pass them as `attachments` to subagents). Produce `reports/03-web-to-app-manifest.md` with:
+- Page-to-screen mapping (which web pages become which mobile screens)
+- Navigation mapping (web nav → mobile tab bar / navigation stacks)
+- Data model (entities discovered on the website)
+- Brand tokens (colors, typography, spacing extracted from screenshots)
+- Content brief (adapted website copy for mobile)
+- Mock data spec (real content from the website)
+- Screen change list and parallel batches
+
+**Template Selection**: Follow `catalog-analyzer` skill. Use the web analysis to select the best template from CATALOG.md and shared modules from MODULES_CATALOG.md. The web-to-app manifest provides the "app description" for template matching.
+
+### Step 2 — Clone + Rename
+
+Clone the selected template:
+```bash
+cp -r templates/{platform}/{Template}/ output/{app-name}/
+```
+
+If `scripts/rename-template.sh` exists, run it. Otherwise follow `app-renaming` skill.
+
+### Step 3 — Apply Website Brand + Content + Mock Data
+
+Using the web-to-app manifest as the single source of truth:
+1. **Design system** — follow `design-system` skill but use the brand tokens extracted from the website (colors, typography from the crawl report) instead of selecting from `designs/brands/`
+2. **Content writing** — follow `content-writer` skill, adapting website copy for mobile
+3. **AppConfig** — follow `appconfig-customization` skill
+4. **Mock data** — follow `mock-data-update` skill, using real content observed on the website
+5. **Module integration** — follow `module-integrator` skill if modules were selected
+
+### Step 4 — [PARALLEL] Screen Customization
+
+Using the manifest's screen batches, dispatch 2-3 concurrent `Task` subagents. Each receives:
+- Its batch of screen files from the manifest
+- The website screenshots for the pages it is implementing (as `attachments`)
+- Instructions to match the website's visual style as closely as possible
+
+Each subagent reads the platform-specific customizer skill in batch mode and ONLY edits its assigned screen files.
+
+### Step 5 — Build
+
+Follow `build-tester` skill. Compile, fix errors, locate build artifact. Max 3 rebuild cycles.
+
+### Step 6 — [PARALLEL] Post-Build Audits + Boot Simulators
+
+Dispatch three concurrent tasks:
+1. **Security audit** — follow `code-auditor` skill
+2. **Validation** — follow `output-validator` skill
+3. **Boot simulators** — boot 2-3 simulators for testing
+
+### Steps 7-10 — UI Testing (MANDATORY)
+
+**Step 7: Install app** on all booted simulators.
+
+**Step 8: [PARALLEL] Interactive testing** — dispatch subagents to test screen batches.
+
+**Step 9: [PARALLEL] Maestro tests** — generate and run YAML test files.
+
+**Step 10: Screenshots + cleanup**
+- Capture one clean screenshot per main tab
+- {{simulatorCleanup}}
+
+## Screenshots as Visual Context
+
+The web crawl saves screenshots at `output/{app-name}/web-crawl/screenshots/`. Pass these as `attachments` to downstream subagents so they can see the original website:
+
+```typescript
+// Web analyzer sees all pages
+Task({
+  prompt: "Analyze this website...",
+  attachments: ["output/{app-name}/web-crawl/screenshots/page-home.png", ...]
+})
+
+// Screen customizer sees relevant pages
+Task({
+  prompt: "Customize ProductListView to match this website page...",
+  attachments: ["output/{app-name}/web-crawl/screenshots/page-products.png"]
+})
+```
+
+## Rules
+
+- ONLY write files under `output/` — NEVER modify `templates/`
+- Preserve the MVVM architecture from the template
+- Keep the MockDataProvider pattern — fill it with website content
+- Keep the navigation structure functional
+- Do NOT introduce new external dependencies
+- Use ai-tester MCP tools for ALL device interaction (not shell commands)
+- Brand tokens come from the crawled website, NOT from `designs/brands/`
+- Match the website's visual identity as closely as possible in the native app

package/templates/android/BookTemplate/app/src/main/kotlin/com/appship/book/core/animation/AnimatedTransitionsModifiers.kt

@@ -1,14 +1,24 @@
 package com.appship.book.core.animation
 
+import android.view.HapticFeedbackConstants
 import androidx.compose.animation.*
 import androidx.compose.animation.core.*
+import androidx.compose.foundation.clickable
+import androidx.compose.foundation.gestures.detectTapGestures
+import androidx.compose.foundation.interaction.MutableInteractionSource
+import androidx.compose.foundation.interaction.collectIsPressedAsState
 import androidx.compose.foundation.layout.offset
 import androidx.compose.runtime.*
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.composed
 import androidx.compose.ui.draw.alpha
 import androidx.compose.ui.draw.scale
+import androidx.compose.ui.draw.shadow
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.input.pointer.pointerInput
+import androidx.compose.ui.platform.LocalView
 import androidx.compose.ui.unit.IntOffset
+import androidx.compose.ui.unit.dp
 
 /**
  * Staggered appear animation for list items.
@@ -118,3 +128,181 @@ fun Modifier.bounceOnChange(
 
     this.scale(bounceAnim)
 }
+
+/**
+ * Scale-down press feedback for tappable elements.
+ * Scales to 0.95 on press with spring return animation.
+ */
+fun Modifier.scaleOnPress(): Modifier = composed {
+    val interactionSource = remember { MutableInteractionSource() }
+    val isPressed by interactionSource.collectIsPressedAsState()
+
+    val scale by animateFloatAsState(
+        targetValue = if (isPressed) 0.95f else 1f,
+        animationSpec = spring(
+            dampingRatio = Spring.DampingRatioMediumBouncy,
+            stiffness = Spring.StiffnessMedium
+        ),
+        label = "pressScale"
+    )
+
+    this
+        .scale(scale)
+        .clickable(
+            interactionSource = interactionSource,
+            indication = null
+        ) { }
+}
+
+/**
+ * Triggers haptic feedback on tap.
+ */
+fun Modifier.hapticFeedback(): Modifier = composed {
+    val view = LocalView.current
+    this.pointerInput(Unit) {
+        detectTapGestures {
+            view.performHapticFeedback(HapticFeedbackConstants.KEYBOARD_TAP)
+        }
+    }
+}
+
+/**
+ * Slide-from-side + fade-in animation on appear.
+ */
+fun Modifier.slideAndFade(
+    delayMs: Int = 0,
+    durationMs: Int = 400
+): Modifier = composed {
+    var isVisible by remember { mutableStateOf(false) }
+
+    val alpha by animateFloatAsState(
+        targetValue = if (isVisible) 1f else 0f,
+        animationSpec = tween(
+            durationMillis = durationMs,
+            delayMillis = delayMs,
+            easing = FastOutSlowInEasing
+        ),
+        label = "slideAndFadeAlpha"
+    )
+
+    val offsetX by animateIntAsState(
+        targetValue = if (isVisible) 0 else 40,
+        animationSpec = tween(
+            durationMillis = durationMs,
+            delayMillis = delayMs,
+            easing = FastOutSlowInEasing
+        ),
+        label = "slideAndFadeOffsetX"
+    )
+
+    LaunchedEffect(Unit) {
+        isVisible = true
+    }
+
+    this
+        .alpha(alpha)
+        .offset { IntOffset(offsetX, 0) }
+}
+
+/**
+ * Subtle colored shadow for cards and elevated surfaces.
+ * Uses Material 3 elevation with optional color tinting.
+ */
+fun Modifier.cardShadow(
+    color: Color = Color.Black,
+    elevation: Float = 4f
+): Modifier = composed {
+    this.shadow(
+        elevation = elevation.dp,
+        ambientColor = color.copy(alpha = 0.08f),
+        spotColor = color.copy(alpha = 0.12f),
+        shape = androidx.compose.foundation.shape.RoundedCornerShape(12.dp)
+    )
+}
+
+/**
+ * Deeper shadow for floating elements (FABs, modals).
+ */
+fun Modifier.elevatedShadow(
+    color: Color = Color.Black
+): Modifier = composed {
+    this.shadow(
+        elevation = 8.dp,
+        ambientColor = color.copy(alpha = 0.12f),
+        spotColor = color.copy(alpha = 0.16f),
+        shape = androidx.compose.foundation.shape.RoundedCornerShape(16.dp)
+    )
+}
+
+/**
+ * Shimmer loading overlay for skeleton placeholder views.
+ * Sweeps a translucent gradient across the content repeatedly.
+ */
+fun Modifier.shimmer(
+    durationMs: Int = 1500
+): Modifier = composed {
+    val transition = rememberInfiniteTransition(label = "shimmer")
+    val translateAnim by transition.animateFloat(
+        initialValue = -1f,
+        targetValue = 2f,
+        animationSpec = infiniteRepeatable(
+            animation = tween(durationMillis = durationMs, easing = LinearEasing),
+            repeatMode = RepeatMode.Restart
+        ),
+        label = "shimmerTranslate"
+    )
+
+    this.alpha(0.3f + 0.7f * ((translateAnim + 1f) / 3f).coerceIn(0f, 1f))
+}
+
+/**
+ * Repeating scale pulse animation for live indicators and notifications.
+ */
+fun Modifier.pulse(
+    intensity: Float = 0.05f,
+    durationMs: Int = 1000
+): Modifier = composed {
+    val transition = rememberInfiniteTransition(label = "pulse")
+    val scale by transition.animateFloat(
+        initialValue = 1f,
+        targetValue = 1f + intensity,
+        animationSpec = infiniteRepeatable(
+            animation = tween(durationMillis = durationMs, easing = FastOutSlowInEasing),
+            repeatMode = RepeatMode.Reverse
+        ),
+        label = "pulseScale"
+    )
+
+    this.scale(scale)
+}
+
+/**
+ * Heart/like bounce effect when toggled active.
+ * Scales up to 1.3x then springs back. Perfect for favorite buttons.
+ */
+fun Modifier.heartBounce(
+    isActive: Boolean
+): Modifier = composed {
+    var previousActive by remember { mutableStateOf(isActive) }
+    var animatedScale by remember { mutableFloatStateOf(1f) }
+
+    val bounceAnim by animateFloatAsState(
+        targetValue = animatedScale,
+        animationSpec = spring(
+            dampingRatio = Spring.DampingRatioMediumBouncy,
+            stiffness = Spring.StiffnessMedium
+        ),
+        label = "heartBounce"
+    )
+
+    LaunchedEffect(isActive) {
+        if (isActive && !previousActive) {
+            animatedScale = 1.3f
+            kotlinx.coroutines.delay(200)
+            animatedScale = 1f
+        }
+        previousActive = isActive
+    }
+
+    this.scale(bounceAnim)
+}

package/templates/android/ChatTemplate/app/src/main/kotlin/com/appship/chat/core/animation/AnimatedTransitionsModifiers.kt

@@ -1,14 +1,24 @@
 package com.appship.chat.core.animation
 
+import android.view.HapticFeedbackConstants
 import androidx.compose.animation.*
 import androidx.compose.animation.core.*
+import androidx.compose.foundation.clickable
+import androidx.compose.foundation.gestures.detectTapGestures
+import androidx.compose.foundation.interaction.MutableInteractionSource
+import androidx.compose.foundation.interaction.collectIsPressedAsState
 import androidx.compose.foundation.layout.offset
 import androidx.compose.runtime.*
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.composed
 import androidx.compose.ui.draw.alpha
 import androidx.compose.ui.draw.scale
+import androidx.compose.ui.draw.shadow
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.input.pointer.pointerInput
+import androidx.compose.ui.platform.LocalView
 import androidx.compose.ui.unit.IntOffset
+import androidx.compose.ui.unit.dp
 
 /**
  * Staggered appear animation for list items.
@@ -118,3 +128,181 @@ fun Modifier.bounceOnChange(
 
     this.scale(bounceAnim)
 }
+
+/**
+ * Scale-down press feedback for tappable elements.
+ * Scales to 0.95 on press with spring return animation.
+ */
+fun Modifier.scaleOnPress(): Modifier = composed {
+    val interactionSource = remember { MutableInteractionSource() }
+    val isPressed by interactionSource.collectIsPressedAsState()
+
+    val scale by animateFloatAsState(
+        targetValue = if (isPressed) 0.95f else 1f,
+        animationSpec = spring(
+            dampingRatio = Spring.DampingRatioMediumBouncy,
+            stiffness = Spring.StiffnessMedium
+        ),
+        label = "pressScale"
+    )
+
+    this
+        .scale(scale)
+        .clickable(
+            interactionSource = interactionSource,
+            indication = null
+        ) { }
+}
+
+/**
+ * Triggers haptic feedback on tap.
+ */
+fun Modifier.hapticFeedback(): Modifier = composed {
+    val view = LocalView.current
+    this.pointerInput(Unit) {
+        detectTapGestures {
+            view.performHapticFeedback(HapticFeedbackConstants.KEYBOARD_TAP)
+        }
+    }
+}
+
+/**
+ * Slide-from-side + fade-in animation on appear.
+ */
+fun Modifier.slideAndFade(
+    delayMs: Int = 0,
+    durationMs: Int = 400
+): Modifier = composed {
+    var isVisible by remember { mutableStateOf(false) }
+
+    val alpha by animateFloatAsState(
+        targetValue = if (isVisible) 1f else 0f,
+        animationSpec = tween(
+            durationMillis = durationMs,
+            delayMillis = delayMs,
+            easing = FastOutSlowInEasing
+        ),
+        label = "slideAndFadeAlpha"
+    )
+
+    val offsetX by animateIntAsState(
+        targetValue = if (isVisible) 0 else 40,
+        animationSpec = tween(
+            durationMillis = durationMs,
+            delayMillis = delayMs,
+            easing = FastOutSlowInEasing
+        ),
+        label = "slideAndFadeOffsetX"
+    )
+
+    LaunchedEffect(Unit) {
+        isVisible = true
+    }
+
+    this
+        .alpha(alpha)
+        .offset { IntOffset(offsetX, 0) }
+}
+
+/**
+ * Subtle colored shadow for cards and elevated surfaces.
+ * Uses Material 3 elevation with optional color tinting.
+ */
+fun Modifier.cardShadow(
+    color: Color = Color.Black,
+    elevation: Float = 4f
+): Modifier = composed {
+    this.shadow(
+        elevation = elevation.dp,
+        ambientColor = color.copy(alpha = 0.08f),
+        spotColor = color.copy(alpha = 0.12f),
+        shape = androidx.compose.foundation.shape.RoundedCornerShape(12.dp)
+    )
+}
+
+/**
+ * Deeper shadow for floating elements (FABs, modals).
+ */
+fun Modifier.elevatedShadow(
+    color: Color = Color.Black
+): Modifier = composed {
+    this.shadow(
+        elevation = 8.dp,
+        ambientColor = color.copy(alpha = 0.12f),
+        spotColor = color.copy(alpha = 0.16f),
+        shape = androidx.compose.foundation.shape.RoundedCornerShape(16.dp)
+    )
+}
+
+/**
+ * Shimmer loading overlay for skeleton placeholder views.
+ * Sweeps a translucent gradient across the content repeatedly.
+ */
+fun Modifier.shimmer(
+    durationMs: Int = 1500
+): Modifier = composed {
+    val transition = rememberInfiniteTransition(label = "shimmer")
+    val translateAnim by transition.animateFloat(
+        initialValue = -1f,
+        targetValue = 2f,
+        animationSpec = infiniteRepeatable(
+            animation = tween(durationMillis = durationMs, easing = LinearEasing),
+            repeatMode = RepeatMode.Restart
+        ),
+        label = "shimmerTranslate"
+    )
+
+    this.alpha(0.3f + 0.7f * ((translateAnim + 1f) / 3f).coerceIn(0f, 1f))
+}
+
+/**
+ * Repeating scale pulse animation for live indicators and notifications.
+ */
+fun Modifier.pulse(
+    intensity: Float = 0.05f,
+    durationMs: Int = 1000
+): Modifier = composed {
+    val transition = rememberInfiniteTransition(label = "pulse")
+    val scale by transition.animateFloat(
+        initialValue = 1f,
+        targetValue = 1f + intensity,
+        animationSpec = infiniteRepeatable(
+            animation = tween(durationMillis = durationMs, easing = FastOutSlowInEasing),
+            repeatMode = RepeatMode.Reverse
+        ),
+        label = "pulseScale"
+    )
+
+    this.scale(scale)
+}
+
+/**
+ * Heart/like bounce effect when toggled active.
+ * Scales up to 1.3x then springs back. Perfect for favorite buttons.
+ */
+fun Modifier.heartBounce(
+    isActive: Boolean
+): Modifier = composed {
+    var previousActive by remember { mutableStateOf(isActive) }
+    var animatedScale by remember { mutableFloatStateOf(1f) }
+
+    val bounceAnim by animateFloatAsState(
+        targetValue = animatedScale,
+        animationSpec = spring(
+            dampingRatio = Spring.DampingRatioMediumBouncy,
+            stiffness = Spring.StiffnessMedium
+        ),
+        label = "heartBounce"
+    )
+
+    LaunchedEffect(isActive) {
+        if (isActive && !previousActive) {
+            animatedScale = 1.3f
+            kotlinx.coroutines.delay(200)
+            animatedScale = 1f
+        }
+        previousActive = isActive
+    }
+
+    this.scale(bounceAnim)
+}

package/templates/android/ChatTemplate/app/src/main/kotlin/com/appship/chat/features/conversations/ConversationsScreen.kt

@@ -129,7 +129,7 @@ fun ConversationsScreen(onChatClick: (String) -> Unit) {
 }
 
 @Composable
-fun ConversationRow(conversation: Conversation, repository: com.appship.chat.data.DataRepository, onClick: () -> Unit, index: Int) {
+fun ConversationRow(conversation: Conversation, repository: com.appship.chat.data.DataRepository, onClick: () -> Unit, index: Int, modifier: Modifier = Modifier) {
     Row(
         modifier = Modifier
             .fillMaxWidth()