Add loading while grid col count is calculed

composeApp/src/commonMain/kotlin/mg/dot/feufaro/solfa/TimeUnitObject.kt

@@ -28,6 +28,7 @@ import androidx.compose.ui.focus.focusRequester
 import androidx.compose.ui.geometry.Offset
 import androidx.compose.ui.geometry.Size
 import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.graphics.RectangleShape
 import androidx.compose.ui.graphics.SolidColor
 import androidx.compose.ui.graphics.drawscope.Stroke
 import androidx.compose.ui.input.pointer.pointerInput
@@ -476,13 +477,17 @@ fun TimeUnitComposable(
     }
 }
 
+data class TUOWidthMeasure(val width: Dp, val isReady: Boolean)
+
 @Composable
-fun bestTUOWidth(items: List<TimeUnitObject>): Dp {
+fun bestTUOWidth(items: List<TimeUnitObject>): TUOWidthMeasure {
     val textMeasurer = rememberTextMeasurer()
     val density = LocalDensity.current
 
-    var maxWidth by remember { mutableStateOf(0.dp) }
+    var maxWidth by remember(items) { mutableStateOf(0.dp) }
+    var isReady by remember(items) { mutableStateOf(false) }
     LaunchedEffect(items) {
+        isReady = false
         maxWidth = 0.dp
         items.forEach {
                 val textLayoutResult: TextLayoutResult = textMeasurer.measure(
@@ -496,8 +501,9 @@ fun bestTUOWidth(items: List<TimeUnitObject>): Dp {
                 maxWidth = textWidth
             }
         }
+        isReady = true
     }
-    return maxWidth + 13.dp
+    return TUOWidthMeasure(maxWidth + 13.dp, isReady)
 }
 @Composable
 fun AutoResizingText(
@@ -609,9 +615,13 @@ fun LazyVerticalGridTUO(
         val horizontalArrangementSpacing: Dp = 0.dp
         val columnGroupString = regexMeasure?.groupValues?.get(1) ?: "1"
         val columnGroup = columnGroupString.toInt().coerceAtLeast(1)
-        val itemMinBaseWidth = bestTUOWidth(tuoList)
+        val tuoWidthMeasure = bestTUOWidth(tuoList)
+        val itemMinBaseWidth = tuoWidthMeasure.width
         val gridWidthDp = with(density) { gridWidthPx.toDp() }
 
+        // on affiche un loader pour éviter le "saut" visuel
+        val isLayoutReady = tuoWidthMeasure.isReady && gridWidthDp > 0.dp
+
         val gridCount by sharedScreenModel.gridCount.collectAsState()
 
         var gridColumnCount: Int = remember(gridWidthDp, itemMinBaseWidth, columnGroup) {
@@ -680,6 +690,26 @@ fun LazyVerticalGridTUO(
         val totalSyllables = sharedScreenModel.synchronizedSyllables.value.size
         //println("Sync complète effectuée SUR stz: ${sharedScreenModel.stanza.value}! Total colonnes : $totalSyllables")
     }
+    if (!isLayoutReady) {
+        Box(
+            modifier = Modifier
+                .fillMaxWidth()
+                .height(200.dp),
+            contentAlignment = Alignment.Center
+        ) {
+            CircularProgressIndicator(
+                modifier = Modifier.size(64.dp),
+                strokeWidth = 3.dp
+            )
+            Text(
+                text = "𝄞 ♫",
+                style = TextStyle(
+                    fontSize = 28.sp,
+                    color = MaterialTheme.colorScheme.primary
+                )
+            )
+        }
+    } else {
         Column(
             modifier = Modifier.fillMaxWidth()
         ){
@@ -1084,6 +1114,7 @@ fun LazyVerticalGridTUO(
     }
     }
 }
+}
 
 @Composable
 fun makeSpaceBetweenSyllables(