feat(desktop): Integrate KCEF WebView with Background Download

mpp-core/src/androidMain/kotlin/cc/unitmesh/config/ConfigManager.android.kt

@@ -189,6 +189,11 @@ actual object ConfigManager {
         val wrapper = load()
         return wrapper.getIssueTracker()
     }
+
+    actual fun getKcefInstallDir(): String {
+        // KCEF is not available on Android
+        return ""
+    }
 
     actual suspend fun loadToolConfig(): ToolConfigFile =
         withContext(Dispatchers.IO) {

mpp-core/src/commonMain/kotlin/cc/unitmesh/config/ConfigManager.kt

@@ -134,5 +134,12 @@ expect object ConfigManager {
      * @return IssueTrackerConfig (returns default config if not set)
      */
     suspend fun getIssueTracker(): IssueTrackerConfig
+
+    /**
+     * Get KCEF (Chromium Embedded Framework) installation directory
+     * 
+     * @return Path to KCEF installation directory (e.g., ~/.autodev/kcef-bundle)
+     */
+    fun getKcefInstallDir(): String
 }
 

mpp-core/src/iosMain/kotlin/cc/unitmesh/config/ConfigManager.ios.kt

@@ -250,6 +250,11 @@ actual object ConfigManager {
         val wrapper = load()
         return wrapper.getIssueTracker()
     }
+
+    actual fun getKcefInstallDir(): String {
+        // KCEF is not available on iOS
+        return ""
+    }
 
     actual fun getToolConfigPath(): String = toolConfigFilePath
 

mpp-core/src/jsMain/kotlin/cc/unitmesh/config/ConfigManager.js.kt

@@ -288,6 +288,11 @@ actual object ConfigManager {
         val wrapper = load()
         return wrapper.getIssueTracker()
     }
+
+    actual fun getKcefInstallDir(): String {
+        // KCEF is not available on Node.js
+        return ""
+    }
 
     private fun createEmpty(): AutoDevConfigWrapper {
         return AutoDevConfigWrapper(ConfigFile(active = "", configs = emptyList()))

mpp-core/src/jvmMain/kotlin/cc/unitmesh/config/ConfigManager.jvm.kt

@@ -239,5 +239,10 @@ actual object ConfigManager {
         val wrapper = load()
         return wrapper.getIssueTracker()
     }
+
+    actual fun getKcefInstallDir(): String {
+        val kcefDir = File(configDir, "kcef-bundle")
+        return kcefDir.absolutePath
+    }
 }
 

mpp-core/src/wasmJsMain/kotlin/cc/unitmesh/config/ConfigManager.wasmJs.kt

@@ -149,6 +149,11 @@ actual object ConfigManager {
         val wrapper = load()
         return wrapper.getIssueTracker()
     }
+
+    actual fun getKcefInstallDir(): String {
+        // KCEF is not available in WASM browser environment
+        return ""
+    }
 
     actual suspend fun loadToolConfig(): ToolConfigFile {
         return try {

mpp-idea/build.gradle.kts

@@ -402,6 +402,8 @@ project(":") {
 
         // Note: mpp-ui dependency removed - configuration management moved to mpp-core
         // Color definitions moved to IdeaAutoDevColors in mpp-idea
+        // Note: ComposeCharts library cannot be used due to ClassLoader conflicts with IntelliJ's Compose runtime
+        // Chart rendering is implemented manually using Compose Canvas API
 
         testImplementation(kotlin("test"))
     }

mpp-idea/src/main/kotlin/cc/unitmesh/devins/idea/components/timeline/IdeaTimelineContent.kt

@@ -13,7 +13,11 @@ import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
 import cc.unitmesh.agent.render.TimelineItem
+import cc.unitmesh.devins.idea.renderer.sketch.chart.IdeaChartRenderer
+import cc.unitmesh.devins.idea.renderer.sketch.IdeaMermaidRenderer
+import com.intellij.openapi.Disposable
 import com.intellij.openapi.project.Project
+import com.intellij.openapi.util.Disposer
 import org.jetbrains.jewel.foundation.theme.JewelTheme
 import org.jetbrains.jewel.ui.component.Text
 
@@ -91,18 +95,21 @@ fun IdeaTimelineItemView(
         }
         is TimelineItem.AgentSketchBlockItem -> {
             // Agent-generated sketch block (chart, nanodsl, mermaid, etc.)
-            IdeaAgentSketchBlockBubble(item)
+            IdeaAgentSketchBlockBubble(item, project = project)
         }
     }
 }
 
 /**
  * Agent-generated sketch block bubble (chart, nanodsl, mermaid, etc.)
+ * Uses appropriate renderer based on language type.
  */
 @Composable
-fun IdeaAgentSketchBlockBubble(item: TimelineItem.AgentSketchBlockItem) {
-    val lines = item.code.lines()
-
+fun IdeaAgentSketchBlockBubble(
+    item: TimelineItem.AgentSketchBlockItem,
+    project: Project? = null,
+    parentDisposable: Disposable? = null
+) {
     Box(
         modifier = Modifier
             .fillMaxWidth()
@@ -144,59 +151,89 @@ fun IdeaAgentSketchBlockBubble(item: TimelineItem.AgentSketchBlockItem) {
 
             Spacer(modifier = Modifier.height(8.dp))
 
-            // Code content
-            Box(
-                modifier = Modifier
-                    .fillMaxWidth()
-                    .background(
-                        JewelTheme.globalColors.panelBackground,
-                        shape = RoundedCornerShape(4.dp)
+            // Render content based on language type
+            when (item.language.lowercase()) {
+                "chart", "graph" -> {
+                    IdeaChartRenderer(
+                        chartCode = item.code,
+                        modifier = Modifier.fillMaxWidth()
                     )
-                    .padding(8.dp)
-            ) {
-                Column {
-                    lines.take(20).forEachIndexed { index, line ->
-                        Row(
-                            modifier = Modifier.fillMaxWidth(),
-                            horizontalArrangement = Arrangement.spacedBy(8.dp)
-                        ) {
-                            Text(
-                                text = "${index + 1}",
-                                style = JewelTheme.defaultTextStyle.copy(
-                                    fontSize = 10.sp,
-                                    color = JewelTheme.globalColors.text.info.copy(alpha = 0.4f)
-                                ),
-                                modifier = Modifier.width(24.dp)
-                            )
-                            Text(
-                                text = line,
-                                style = JewelTheme.defaultTextStyle.copy(fontSize = 11.sp)
-                            )
-                        }
-                    }
-                    if (lines.size > 20) {
-                        Text(
-                            text = "... (${lines.size - 20} more lines)",
-                            style = JewelTheme.defaultTextStyle.copy(
-                                fontSize = 10.sp,
-                                color = JewelTheme.globalColors.text.info.copy(alpha = 0.5f)
-                            )
-                        )
-                    }
+                }
+                "mermaid", "mmd" -> {
+                    val disposable = parentDisposable ?: Disposer.newDisposable("AgentSketchBlock")
+                    IdeaMermaidRenderer(
+                        mermaidCode = item.code,
+                        project = project,
+                        isDarkTheme = true,
+                        parentDisposable = disposable,
+                        modifier = Modifier.fillMaxWidth()
+                    )
+                }
+                else -> {
+                    // Fallback: display raw code
+                    RenderCodeFallback(item.code, item.language)
                 }
             }
+        }
+    }
+}
 
-            // Footer with line count
-            Spacer(modifier = Modifier.height(4.dp))
-            Text(
-                text = "${lines.size} lines of ${item.language} code",
-                style = JewelTheme.defaultTextStyle.copy(
-                    fontSize = 10.sp,
-                    color = JewelTheme.globalColors.text.info.copy(alpha = 0.5f)
-                )
+/**
+ * Fallback renderer for code content when no specific renderer is available.
+ */
+@Composable
+private fun RenderCodeFallback(code: String, language: String) {
+    val lines = code.lines()
+    Box(
+        modifier = Modifier
+            .fillMaxWidth()
+            .background(
+                JewelTheme.globalColors.panelBackground,
+                shape = RoundedCornerShape(4.dp)
             )
+            .padding(8.dp)
+    ) {
+        Column {
+            lines.take(20).forEachIndexed { index, line ->
+                Row(
+                    modifier = Modifier.fillMaxWidth(),
+                    horizontalArrangement = Arrangement.spacedBy(8.dp)
+                ) {
+                    Text(
+                        text = "${index + 1}",
+                        style = JewelTheme.defaultTextStyle.copy(
+                            fontSize = 10.sp,
+                            color = JewelTheme.globalColors.text.info.copy(alpha = 0.4f)
+                        ),
+                        modifier = Modifier.width(24.dp)
+                    )
+                    Text(
+                        text = line,
+                        style = JewelTheme.defaultTextStyle.copy(fontSize = 11.sp)
+                    )
+                }
+            }
+            if (lines.size > 20) {
+                Text(
+                    text = "... (${lines.size - 20} more lines)",
+                    style = JewelTheme.defaultTextStyle.copy(
+                        fontSize = 10.sp,
+                        color = JewelTheme.globalColors.text.info.copy(alpha = 0.5f)
+                    )
+                )
+            }
         }
     }
+
+    // Footer with line count
+    Spacer(modifier = Modifier.height(4.dp))
+    Text(
+        text = "${lines.size} lines of $language code",
+        style = JewelTheme.defaultTextStyle.copy(
+            fontSize = 10.sp,
+            color = JewelTheme.globalColors.text.info.copy(alpha = 0.5f)
+        )
+    )
 }
 
 /**

mpp-idea/src/main/kotlin/cc/unitmesh/devins/idea/renderer/sketch/IdeaSketchRenderer.kt

@@ -7,6 +7,7 @@ import androidx.compose.ui.Modifier
 import androidx.compose.ui.unit.dp
 
 import cc.unitmesh.devins.idea.renderer.markdown.JewelMarkdownRenderer
+import cc.unitmesh.devins.idea.renderer.sketch.chart.IdeaChartRenderer
 import cc.unitmesh.devins.parser.CodeFence
 import com.intellij.openapi.Disposable
 import com.intellij.openapi.project.Project
@@ -135,6 +136,16 @@ object IdeaSketchRenderer {
                         }
                     }
 
+                    "chart", "graph" -> {
+                        if (fence.text.isNotBlank()) {
+                            IdeaChartRenderer(
+                                chartCode = fence.text,
+                                modifier = Modifier.fillMaxWidth()
+                            )
+                            Spacer(modifier = Modifier.height(8.dp))
+                        }
+                    }
+
                     "devin" -> {
                         if (fence.text.isNotBlank()) {
                             IdeaDevInBlockRenderer(

mpp-idea/src/main/kotlin/cc/unitmesh/devins/idea/renderer/sketch/chart/IdeaChartData.kt

@@ -0,0 +1,81 @@
+package cc.unitmesh.devins.idea.renderer.sketch.chart
+
+/**
+ * Chart type enumeration
+ */
+enum class ChartType {
+    PIE,
+    LINE,
+    COLUMN,
+    ROW
+}
+
+/**
+ * Base chart configuration
+ */
+data class ChartConfig(
+    val type: ChartType,
+    val title: String? = null,
+    val width: Int? = null,
+    val height: Int? = null,
+    val data: ChartDataContent
+)
+
+/**
+ * Chart data content - polymorphic based on chart type
+ */
+sealed class ChartDataContent {
+    data class PieData(
+        val items: List<PieItem>,
+        val style: PieStyle = PieStyle.FILL
+    ) : ChartDataContent()
+
+    data class LineData(
+        val lines: List<LineItem>,
+        val showDots: Boolean = true,
+        val curvedEdges: Boolean = true,
+        val minValue: Double? = null,
+        val maxValue: Double? = null
+    ) : ChartDataContent()
+
+    data class ColumnData(
+        val bars: List<BarGroup>,
+        val minValue: Double? = null,
+        val maxValue: Double? = null
+    ) : ChartDataContent()
+
+    data class RowData(
+        val bars: List<BarGroup>,
+        val minValue: Double? = null,
+        val maxValue: Double? = null
+    ) : ChartDataContent()
+}
+
+data class PieItem(
+    val label: String,
+    val value: Double,
+    val color: String? = null
+)
+
+enum class PieStyle {
+    FILL,
+    STROKE
+}
+
+data class LineItem(
+    val label: String,
+    val values: List<Double>,
+    val color: String? = null
+)
+
+data class BarGroup(
+    val label: String,
+    val values: List<BarValue>
+)
+
+data class BarValue(
+    val label: String? = null,
+    val value: Double,
+    val color: String? = null
+)
+