Fix #32 and improve demo examples

Author: IKupriyanov-HORIS

demo/plot/compose-desktop/src/main/kotlin/demo/plot/minimal/MultiplePlotSizeLayoutCompose.kt

@@ -12,6 +12,7 @@ import androidx.compose.ui.unit.dp
 import androidx.compose.ui.window.Window
 import androidx.compose.ui.window.application
 import org.jetbrains.letsPlot.skia.compose.PlotPanel
+import plotSpec.BarPlotSpec
 import plotSpec.DensitySpec
 
 fun main() = application {
@@ -22,7 +23,7 @@ fun main() = application {
             ) {
 
                 PlotPanel(
-                    figure = DensitySpec().createFigure(),
+                    figure = BarPlotSpec().createFigure(),
                     modifier = Modifier.height(100.dp).width(100.dp)
                 ) { computationMessages ->
                     computationMessages.forEach { println("[DEMO APP MESSAGE] $it") }

demo/plot/compose-desktop/src/main/kotlin/demo/plot/minimal/MultiplePlotWeightLayoutCompose.kt

@@ -5,34 +5,35 @@
 
 package demo.plot.minimal
 
-import androidx.compose.foundation.layout.Column
-import androidx.compose.foundation.layout.fillMaxSize
-import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.*
 import androidx.compose.material.MaterialTheme
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.window.Window
 import androidx.compose.ui.window.application
 import org.jetbrains.letsPlot.skia.compose.PlotPanel
+import plotSpec.BarPlotSpec
 import plotSpec.DensitySpec
 
 fun main() = application {
     Window(onCloseRequest = ::exitApplication, title = "Multiple Plot Weight Layout (Compose Desktop)") {
         MaterialTheme {
-            Column(
-                modifier = Modifier.fillMaxSize().padding(start = 10.dp, top = 10.dp, end = 10.dp, bottom = 10.dp),
+            Row(
+                modifier = Modifier
+                    .fillMaxSize()
+                    .padding(10.dp),
+                horizontalArrangement = Arrangement.spacedBy(10.dp)
             ) {
-
                 PlotPanel(
-                    figure = DensitySpec().createFigure(),
-                    modifier = Modifier.weight(1f)
+                    figure = BarPlotSpec().createFigure(),
+                    modifier = Modifier.fillMaxHeight().weight(1f)
                 ) { computationMessages ->
                     computationMessages.forEach { println("[DEMO APP MESSAGE] $it") }
                 }
 
                 PlotPanel(
                     figure = DensitySpec().createFigure(),
-                    modifier = Modifier.weight(1f)
+                    modifier = Modifier.fillMaxHeight().weight(1f)
                 ) { computationMessages ->
                     computationMessages.forEach { println("[DEMO APP MESSAGE] $it") }
                 }

demo/plot/compose-desktop/src/main/kotlin/demo/plot/various/MultiplePlotsWithToolbar.kt

@@ -0,0 +1,44 @@
+/*
+ * Copyright (c) 2025 JetBrains s.r.o.
+ * Use of this source code is governed by the MIT license that can be found in the LICENSE file.
+ */
+
+package demo.plot.various
+
+import androidx.compose.foundation.layout.*
+import androidx.compose.material.MaterialTheme
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.unit.dp
+import androidx.compose.ui.window.Window
+import androidx.compose.ui.window.application
+import org.jetbrains.letsPlot.interact.ggtb
+import org.jetbrains.letsPlot.skia.compose.PlotPanel
+import plotSpec.AutoSpec
+import plotSpec.MarkdownSpec
+
+fun main() = application {
+    Window(onCloseRequest = ::exitApplication, title = "Multiple Plot Weight Layout (Compose Desktop)") {
+        MaterialTheme {
+            Row(
+                modifier = Modifier
+                    .fillMaxSize()
+                    .padding(10.dp),
+                horizontalArrangement = Arrangement.spacedBy(10.dp)
+            ) {
+                PlotPanel(
+                    figure = AutoSpec().scatter() + ggtb(),
+                    modifier = Modifier.fillMaxHeight().weight(1f)
+                ) { computationMessages ->
+                    computationMessages.forEach { println("[DEMO APP MESSAGE] $it") }
+                }
+
+                PlotPanel(
+                    figure = MarkdownSpec().mpg() + ggtb(),
+                    modifier = Modifier.fillMaxHeight().weight(1f)
+                ) { computationMessages ->
+                    computationMessages.forEach { println("[DEMO APP MESSAGE] $it") }
+                }
+            }
+        }
+    }
+}

demo/plot/shared/src/main/kotlin/plotSpec/AutoSpec.kt

@@ -9,6 +9,7 @@ import demoData.AutoMpg
 import org.jetbrains.letsPlot.Figure
 import org.jetbrains.letsPlot.geom.geomLabel
 import org.jetbrains.letsPlot.geom.geomPoint
+import org.jetbrains.letsPlot.intern.Plot
 import org.jetbrains.letsPlot.letsPlot
 
 class AutoSpec : PlotDemoSpec {
@@ -18,7 +19,7 @@ class AutoSpec : PlotDemoSpec {
         )
     }
 
-    fun scatter(): Figure {
+    fun scatter(): Plot {
         return letsPlot(AutoMpg.map()) + geomPoint {
             x = "engine horsepower"
             y = "miles per gallon"

demo/plot/shared/src/main/kotlin/plotSpec/MarkdownSpec.kt

@@ -8,12 +8,14 @@ package plotSpec
 import demoData.AutoMpg
 import org.jetbrains.letsPlot.Figure
 import org.jetbrains.letsPlot.geom.geomPoint
+import org.jetbrains.letsPlot.intern.Plot
 import org.jetbrains.letsPlot.label.labs
 import org.jetbrains.letsPlot.letsPlot
 import org.jetbrains.letsPlot.scale.scaleColorManual
 import org.jetbrains.letsPlot.themes.elementMarkdown
 import org.jetbrains.letsPlot.themes.elementText
 import org.jetbrains.letsPlot.themes.theme
+import org.jetbrains.letsPlot.tooltips.layerTooltips
 
 class MarkdownSpec : PlotDemoSpec {
     override fun createFigureList(): List<Figure> {
@@ -22,9 +24,9 @@ class MarkdownSpec : PlotDemoSpec {
         )
     }
 
-    fun mpg(): Figure {
+    fun mpg(): Plot {
         return letsPlot(AutoMpg.map()) +
-                geomPoint(size=8) { x="engine displacement (cu. inches)"; y="miles per gallon"; color="number of cylinders" }  +
+                geomPoint(size=8, tooltips = layerTooltips().line("@{vehicle name}")) { x="engine displacement (cu. inches)"; y="miles per gallon"; color="number of cylinders" }  +
                 scaleColorManual(listOf("#66c2a5", "#fc8d62", "#8da0cb"), guide="none")  +
 
                 // Enable Markdown in all titles

lets-plot-compose/src/desktopMain/kotlin/org/jetbrains/letsPlot/skia/compose/PlotPanel.kt

@@ -9,6 +9,7 @@ import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.runtime.*
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.awt.SwingPanel
@@ -55,22 +56,23 @@ actual fun PlotPanel(
         }
     }
 
-    Column {
+    Column(modifier = modifier) {
         if (plotFigureModel != null && GG_TOOLBAR in processedPlotSpec) {
             PlotToolbar(plotFigureModel!!)
         }
 
         Box(
-            modifier = Modifier
-                .fillMaxSize()
+            modifier = modifier
+                .weight(1f) // Take remaining vertical space
+                .fillMaxWidth() // Fill available width
                 .onSizeChanged { newSize ->
                     panelSize = DoubleVector(newSize.width / density, newSize.height / density)
                 }
                 .background(Color.Gray)
         ) {
             SwingPanel(
                 background = Color.White,
-                modifier = modifier,
+                modifier = Modifier.fillMaxSize(),
                 factory = { plotContainer },
                 update = { plotViewContainer ->
                     LOG.print("SwingPanel.update()")