Added new API for desktop example

SnipMeDev · tmaxxdd · Nov 3, 2024 · Nov 2, 2024 · Nov 3, 2024 · Nov 3, 2024
commit 5da558bb8eb9444d54be7958cbd6aaad8c154cca
diff --git a/.run/iosExample.run.xml b/.run/iosExample.run.xml
@@ -1,5 +1,5 @@
 <component name="ProjectRunConfigurationManager">
-  <configuration default="false" name="iosExample" type="KmmRunConfiguration" factoryName="iOS Application" CONFIG_VERSION="1" EXEC_TARGET_ID="645C2113-7E25-482E-9F32-B612B7A046E0" XCODE_PROJECT="$PROJECT_DIR$/iosExample/iosExample.xcodeproj" XCODE_CONFIGURATION="Debug" XCODE_SCHEME="iosExample">
+  <configuration default="false" name="iosExample" type="KmmRunConfiguration" factoryName="iOS Application" CONFIG_VERSION="1" EXEC_TARGET_ID="726A8064-1CB8-4F0E-A381-CABB326B938F" XCODE_PROJECT="$PROJECT_DIR$/iosExample/iosExample.xcodeproj" XCODE_CONFIGURATION="Debug" XCODE_SCHEME="iosExample">
    <method v="2">
      <option name="com.jetbrains.kmm.ios.BuildIOSAppTask" enabled="true" />
    </method>

diff --git a/desktopExample/src/main/kotlin/Main.kt b/desktopExample/src/main/kotlin/Main.kt
@@ -1,13 +1,17 @@
 package dev.snipme.desktopexample

+import androidx.compose.foundation.horizontalScroll
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
+import androidx.compose.foundation.rememberScrollState
+import androidx.compose.foundation.verticalScroll
 import androidx.compose.material3.Divider
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Surface
@@ -78,44 +82,49 @@ fun main() = application {
            )
        ) {
            Surface {
-                Column(
+                Row(
                    modifier = Modifier
                        .fillMaxSize()
                        .padding(16.dp),
-                    horizontalAlignment = Alignment.Start,
-                    verticalArrangement = Arrangement.SpaceBetween
+                    horizontalArrangement = Arrangement.Center,
                ) {
-                    Spacer(Modifier.height(8.dp))
-
-                    ThemeSwitcher(
-                        isDarkMode,
-                        modifier = Modifier.fillMaxWidth(),
-                    ) { setToDarkMode ->
-                        isDarkModeState.value = setToDarkMode
-                        updateSyntaxTheme(highlights.getTheme().useDark(setToDarkMode)!!)
-                    }
-
-                    Spacer(Modifier.height(16.dp))
-
-                    Text(
-                        modifier = Modifier.fillMaxWidth(),
-                        text = "KodeView",
-                        fontSize = 18.sp,
-                        textAlign = TextAlign.Center,
+//                    Spacer(Modifier.height(8.dp))
+//
+//                    ThemeSwitcher(
+//                        isDarkMode,
+//                        modifier = Modifier.fillMaxWidth().weight(1f),
+//                    ) { setToDarkMode ->
+//                        isDarkModeState.value = setToDarkMode
+//                        updateSyntaxTheme(highlights.getTheme().useDark(setToDarkMode)!!)
+//                    }
+//
+//                    Spacer(Modifier.height(16.dp))
+
+//                    Text(
+//                        modifier = Modifier.fillMaxWidth(),
+//                        text = "KodeView",
+//                        fontSize = 18.sp,
+//                        textAlign = TextAlign.Center,
+//                    )
+//
+//                    Spacer(modifier = Modifier.size(16.dp))
+
+                    CodeTextView(
+                        highlights = highlights,
+                        modifier = Modifier.weight(1f)
+                            .verticalScroll(rememberScrollState())
+                            .horizontalScroll(rememberScrollState()),
                    )
-
-                    Spacer(modifier = Modifier.size(16.dp))
-
-                    CodeTextView(highlights = highlights)
-
-                    Spacer(modifier = Modifier.size(16.dp))
-
-                    Divider()
-
-                    Spacer(modifier = Modifier.size(16.dp))
-
-                    Text("Edit this...")
+//
+//                    Spacer(modifier = Modifier.size(16.dp))
+//
+//                    Divider()
+//
+//                    Spacer(modifier = Modifier.size(16.dp))
+//
+//                    Text("Edit this...")
                    CodeEditText(
+                        modifier = Modifier.fillMaxWidth().weight(1f),
                        highlights = highlights,
                        onValueChange = { textValue ->
                            highlightsState.value = highlights.getBuilder()
@@ -132,28 +141,28 @@ fun main() = application {
                        ),
                    )

-                    Spacer(modifier = Modifier.size(16.dp))
-
-                    Spacer(modifier = Modifier.weight(1f))
-
-                    Dropdown(
-                        options = SyntaxThemes.getNames(),
-                        selected = SyntaxThemes.themes().keys.indexOf(highlights.getTheme().key),
-                    ) { selectedThemeName ->
-                        updateSyntaxTheme(
-                            SyntaxThemes.themes(isDarkMode)[selectedThemeName.lowercase()]!!
-                        )
-                    }
-
-                    Spacer(modifier = Modifier.size(16.dp))
-
-                    Dropdown(
-                        options = SyntaxLanguage.getNames(),
-                        selected = SyntaxLanguage.getNames().indexOfFirst {
-                            it.equals(highlights.getLanguage().name, ignoreCase = true)
-                        }) { selectedLanguage ->
-                        updateSyntaxLanguage(SyntaxLanguage.getByName(selectedLanguage)!!)
-                    }
+//                    Spacer(modifier = Modifier.size(16.dp))
+//
+//                    Spacer(modifier = Modifier.weight(1f))
+//
+//                    Dropdown(
+//                        options = SyntaxThemes.getNames(),
+//                        selected = SyntaxThemes.themes().keys.indexOf(highlights.getTheme().key),
+//                    ) { selectedThemeName ->
+//                        updateSyntaxTheme(
+//                            SyntaxThemes.themes(isDarkMode)[selectedThemeName.lowercase()]!!
+//                        )
+//                    }
+//
+//                    Spacer(modifier = Modifier.size(16.dp))
+//
+//                    Dropdown(
+//                        options = SyntaxLanguage.getNames(),
+//                        selected = SyntaxLanguage.getNames().indexOfFirst {
+//                            it.equals(highlights.getLanguage().name, ignoreCase = true)
+//                        }) { selectedLanguage ->
+//                        updateSyntaxLanguage(SyntaxLanguage.getByName(selectedLanguage)!!)
+//                    }
                }
            }
        }

diff --git a/kodeview/src/commonMain/kotlin/dev/snipme/kodeview/view/CodeEditText.kt b/kodeview/src/commonMain/kotlin/dev/snipme/kodeview/view/CodeEditText.kt
@@ -9,17 +9,17 @@ import androidx.compose.material.TextField
 import androidx.compose.material.TextFieldColors
 import androidx.compose.material.TextFieldDefaults
 import androidx.compose.runtime.Composable
+import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.mutableStateOf
 import androidx.compose.runtime.remember
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Shape
+import androidx.compose.ui.text.AnnotatedString
 import androidx.compose.ui.text.TextStyle
-import androidx.compose.ui.text.buildAnnotatedString
 import androidx.compose.ui.text.input.TextFieldValue
 import androidx.compose.ui.text.input.VisualTransformation
 import calculateFieldPhraseUpdate
 import dev.snipme.highlights.Highlights
-import generateAnnotatedString

 @Composable
 fun CodeEditText(
@@ -47,24 +47,30 @@ fun CodeEditText(
 ) {
    val currentText = remember {
        mutableStateOf(
-            TextFieldValue()
+            TextFieldValue(
+                annotatedString = AnnotatedString(highlights.getCode())
+            )
        )
    }

+    LaunchedEffect(highlights) {
+//        highlights.getHighlightsAsync(object : DefaultHighlightsResultListener() {
+//            override fun onSuccess(result: List<CodeHighlight>) {
+//                currentText.value = currentText.value.copy(
+//                    annotatedString = result.generateAnnotatedString(currentText.value.text),
+//                )
+//            }
+//        })
+    }
+
    TextField(
        modifier = modifier.fillMaxWidth(),
        onValueChange = {
            val fieldUpdate = it.calculateFieldPhraseUpdate(translateTabToSpaces)
            currentText.value = fieldUpdate
            onValueChange(fieldUpdate.text)
        },
-        value = TextFieldValue(
-            selection = currentText.value.selection,
-            composition = currentText.value.composition,
-            annotatedString = buildAnnotatedString {
-                generateAnnotatedString(highlights)
-            },
-        ),
+        value = currentText.value,
        enabled = enabled,
        readOnly = readOnly,
        textStyle = textStyle,

diff --git a/kodeview/src/commonMain/kotlin/dev/snipme/kodeview/view/CodeEditTextExtensions.kt b/kodeview/src/commonMain/kotlin/dev/snipme/kodeview/view/CodeEditTextExtensions.kt
diff --git a/kodeview/src/commonMain/kotlin/dev/snipme/kodeview/view/CodeTextView.kt b/kodeview/src/commonMain/kotlin/dev/snipme/kodeview/view/CodeTextView.kt
@@ -1,48 +1,42 @@
 package dev.snipme.kodeview.view

 import androidx.compose.foundation.background
+import androidx.compose.foundation.horizontalScroll
+import androidx.compose.foundation.rememberScrollState
+import androidx.compose.foundation.verticalScroll
 import androidx.compose.material3.Surface
 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.Modifier
 import androidx.compose.ui.graphics.Color
-import androidx.compose.ui.text.SpanStyle
-import androidx.compose.ui.text.buildAnnotatedString
-import androidx.compose.ui.text.font.FontWeight
+import androidx.compose.ui.text.AnnotatedString
 import dev.snipme.highlights.Highlights
-import dev.snipme.highlights.model.BoldHighlight
-import dev.snipme.highlights.model.ColorHighlight
+import generateAnnotatedString

 @Composable
 fun CodeTextView(
    modifier: Modifier = Modifier.background(Color.Transparent),
    highlights: Highlights
 ) {
+    var textState by remember {
+        mutableStateOf(AnnotatedString(highlights.getCode()))
+    }
+
+    LaunchedEffect(highlights) {
+        textState = highlights
+            .getHighlights()
+            .generateAnnotatedString(highlights.getCode())
+    }
+
    Surface {
        Text(
            modifier = modifier,
-            text = buildAnnotatedString {
-                append(highlights.getCode())
-
-                highlights.getHighlights()
-                    .filterIsInstance<ColorHighlight>()
-                    .forEach {
-                        addStyle(
-                            SpanStyle(color = Color(it.rgb).copy(alpha = 1f)),
-                            start = it.location.start,
-                            end = it.location.end,
-                        )
-                    }
-
-                highlights.getHighlights()
-                    .filterIsInstance<BoldHighlight>()
-                    .forEach {
-                        addStyle(
-                            SpanStyle(fontWeight = FontWeight.Bold),
-                            start = it.location.start,
-                            end = it.location.end,
-                        )
-                    }
-            })
+            text = textState
+        )
    }
 }
diff --git a/kodeview/src/commonMain/kotlin/dev/snipme/kodeview/view/Extensions.kt b/kodeview/src/commonMain/kotlin/dev/snipme/kodeview/view/Extensions.kt
@@ -0,0 +1,42 @@
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.text.SpanStyle
+import androidx.compose.ui.text.TextRange
+import androidx.compose.ui.text.buildAnnotatedString
+import androidx.compose.ui.text.font.FontWeight
+import androidx.compose.ui.text.input.TextFieldValue
+import dev.snipme.highlights.model.BoldHighlight
+import dev.snipme.highlights.model.CodeHighlight
+import dev.snipme.highlights.model.ColorHighlight
+
+internal const val TAB_LENGTH = 4
+internal const val TAB_CHAR = "\t"
+
+fun List<CodeHighlight>.generateAnnotatedString(code: String) =
+    buildAnnotatedString {
+        append(code)
+
+        forEach {
+            when (it) {
+                is BoldHighlight -> addStyle(
+                    SpanStyle(fontWeight = FontWeight.Bold),
+                    start = it.location.start,
+                    end = it.location.end,
+                )
+
+                is ColorHighlight -> addStyle(
+                    SpanStyle(color = Color(it.rgb).copy(alpha = 1f)),
+                    start = it.location.start,
+                    end = it.location.end,
+                )
+            }
+        }
+    }
+
+
+internal fun TextFieldValue.calculateFieldPhraseUpdate(translateTabToSpaces: Boolean) =
+    if (translateTabToSpaces && text.contains(TAB_CHAR)) {
+        val result = text.replace(TAB_CHAR, " ".repeat(TAB_LENGTH))
+        this.copy(text = result, TextRange(selection.start + TAB_LENGTH - 1))
+    } else {
+        this
+    }