[JEWEL-746] Load markdown images using Coil3

It supports every image as an inline node;
Using built-in coroutine library and ktor3 from the platform;
Added SVG support using a coil dependency.

Moved images into an extension so it can be loaded
on demand without pushin coil3 dependencies to everyone.
Add Coil3ImagesRendererExtension to rendering extensions to
render images.

Author: Oleg Baskakov

.idea/modules.xml

@@ -1,4 +1,5 @@
 [versions]
+coil = "3.1.0"
 commonmark = "0.24.0"
 composeDesktop = "1.8.1"
 detekt = "1.23.6"
@@ -17,6 +18,11 @@ kotlinxBinaryCompat = "0.17.0"
 ktfmtGradlePlugin = "0.22.0"
 
 [libraries]
+coil-compose = { module = "io.coil-kt.coil3:coil-compose", version.ref = "coil" }
+# network is only needed in a standalone non-ide version
+coil-network-ktor3 = { module = "io.coil-kt.coil3:coil-network-ktor3", version.ref = "coil" }
+coil-svg = { module = "io.coil-kt.coil3:coil-svg", version.ref = "coil" }
+
 commonmark-core = { module = "org.commonmark:commonmark", version.ref = "commonmark" }
 commonmark-ext-autolink = { module = "org.commonmark:commonmark-ext-autolink", version.ref = "commonmark" }
 commonmark-ext-gfm-strikethrough = { module = "org.commonmark:commonmark-ext-gfm-strikethrough", version.ref = "commonmark" }
@@ -27,6 +33,7 @@ filePicker = { module = "com.darkrockstudios:mpfilepicker", version.ref = "filep
 kotlinSarif = { module = "io.github.detekt.sarif4k:sarif4k", version.ref = "kotlinSarif" }
 kotlin-reflect = { module = "org.jetbrains.kotlin:kotlin-reflect", version.ref = "kotlin" }
 kotlinx-serialization-json = { module = "org.jetbrains.kotlinx:kotlinx-serialization-json", version.ref = "kotlinxSerialization" }
+ktor-client-java = { module = "io.ktor:ktor-client-java", version = "3.0.3" }
 
 jna-core = { module = "net.java.dev.jna:jna", version.ref = "jna" }
 

platform/jewel/gradle/libs.versions.toml

@@ -259,6 +259,10 @@ public abstract interface class org/jetbrains/jewel/markdown/WithTextContent {
 	public abstract fun getContent ()Ljava/lang/String;
 }
 
+public abstract interface class org/jetbrains/jewel/markdown/extensions/ImageRendererExtension {
+	public abstract fun imageContent (Lorg/jetbrains/jewel/markdown/InlineMarkdown$Image;Landroidx/compose/runtime/Composer;I)Landroidx/compose/foundation/text/InlineTextContent;
+}
+
 public abstract interface class org/jetbrains/jewel/markdown/extensions/MarkdownBlockProcessorExtension {
 	public abstract fun canProcess (Lorg/commonmark/node/CustomBlock;)Z
 	public abstract fun processMarkdownBlock (Lorg/commonmark/node/CustomBlock;Lorg/jetbrains/jewel/markdown/processing/MarkdownProcessor;)Lorg/jetbrains/jewel/markdown/MarkdownBlock$CustomBlock;
@@ -307,11 +311,13 @@ public final class org/jetbrains/jewel/markdown/extensions/MarkdownProcessorExte
 public abstract interface class org/jetbrains/jewel/markdown/extensions/MarkdownRendererExtension {
 	public abstract fun getBlockRenderer ()Lorg/jetbrains/jewel/markdown/extensions/MarkdownBlockRendererExtension;
 	public abstract fun getDelimitedInlineRenderer ()Lorg/jetbrains/jewel/markdown/extensions/MarkdownDelimitedInlineRendererExtension;
+	public abstract fun getImageRendererExtension ()Lorg/jetbrains/jewel/markdown/extensions/ImageRendererExtension;
 }
 
 public final class org/jetbrains/jewel/markdown/extensions/MarkdownRendererExtension$DefaultImpls {
 	public static fun getBlockRenderer (Lorg/jetbrains/jewel/markdown/extensions/MarkdownRendererExtension;)Lorg/jetbrains/jewel/markdown/extensions/MarkdownBlockRendererExtension;
 	public static fun getDelimitedInlineRenderer (Lorg/jetbrains/jewel/markdown/extensions/MarkdownRendererExtension;)Lorg/jetbrains/jewel/markdown/extensions/MarkdownDelimitedInlineRendererExtension;
+	public static fun getImageRendererExtension (Lorg/jetbrains/jewel/markdown/extensions/MarkdownRendererExtension;)Lorg/jetbrains/jewel/markdown/extensions/ImageRendererExtension;
 }
 
 public final class org/jetbrains/jewel/markdown/processing/MarkdownParserFactory {

platform/jewel/markdown/core/api/core.api

@@ -0,0 +1,12 @@
+package org.jetbrains.jewel.markdown.extensions
+
+import androidx.compose.foundation.text.InlineTextContent
+import androidx.compose.runtime.Composable
+import org.jetbrains.jewel.foundation.ExperimentalJewelApi
+import org.jetbrains.jewel.markdown.InlineMarkdown
+
+/** An extension for the Jewel Markdown rendering engine. */
+@ExperimentalJewelApi
+public interface ImageRendererExtension {
+    @Composable public fun imageContent(image: InlineMarkdown.Image): InlineTextContent
+}

platform/jewel/markdown/core/src/main/kotlin/org/jetbrains/jewel/markdown/extensions/ImageRendererExtension.kt

@@ -24,4 +24,14 @@ public interface MarkdownRendererExtension {
      */
     public val delimitedInlineRenderer: MarkdownDelimitedInlineRendererExtension?
         get() = null
+
+    /**
+     * An extension for [`InlineMarkdownRenderer`][org.jetbrains.jewel.markdown.rendering.InlineMarkdownRenderer] that
+     * will render supported [org.jetbrains.jewel.markdown.InlineMarkdown.CustomDelimitedNode]s into an annotated
+     * string.
+     *
+     * Can be null if this extension doesn't support rendering delimited inline nodes.
+     */
+    public val imageRendererExtension: ImageRendererExtension?
+        get() = null
 }

platform/jewel/markdown/core/src/main/kotlin/org/jetbrains/jewel/markdown/extensions/MarkdownRendererExtension.kt

@@ -1,5 +1,6 @@
 package org.jetbrains.jewel.markdown.rendering
 
+import androidx.compose.foundation.text.appendInlineContent
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.graphics.takeOrElse
 import androidx.compose.ui.text.AnnotatedString
@@ -166,7 +167,8 @@ public open class DefaultInlineMarkdownRenderer(rendererExtensions: List<Markdow
         enabled: Boolean,
         currentTextStyle: TextStyle,
     ) {
-        // Not supported yet — see JEWEL-746
+        // Each image source corresponds to one rendered image.
+        appendInlineContent(node.source, "![${node.title}](${node.source})")
     }
 
     // The T type parameter is needed to avoid issues with capturing lambdas

platform/jewel/markdown/core/src/main/kotlin/org/jetbrains/jewel/markdown/rendering/DefaultInlineMarkdownRenderer.kt

@@ -14,6 +14,7 @@ import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.width
 import androidx.compose.foundation.layout.widthIn
+import androidx.compose.foundation.text.InlineTextContent
 import androidx.compose.foundation.text.selection.DisableSelection
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.CompositionLocalProvider
@@ -41,6 +42,7 @@ import org.jetbrains.jewel.foundation.code.MimeType
 import org.jetbrains.jewel.foundation.code.highlighting.LocalCodeHighlighter
 import org.jetbrains.jewel.foundation.modifier.thenIf
 import org.jetbrains.jewel.foundation.theme.LocalContentColor
+import org.jetbrains.jewel.markdown.InlineMarkdown
 import org.jetbrains.jewel.markdown.MarkdownBlock
 import org.jetbrains.jewel.markdown.MarkdownBlock.BlockQuote
 import org.jetbrains.jewel.markdown.MarkdownBlock.CodeBlock
@@ -147,6 +149,7 @@ public open class DefaultMarkdownBlockRenderer(
                     .clickable(interactionSource = interactionSource, indication = null, onClick = onTextClick),
             text = renderedContent,
             style = mergedStyle,
+            inlineContent = renderedImages(block),
         )
     }
 
@@ -497,6 +500,15 @@ public open class DefaultMarkdownBlockRenderer(
             inlineRenderer.renderAsAnnotatedString(block.inlineContent, styling, enabled, onUrlClick)
         }
 
+    @Composable
+    private fun renderedImages(blockInlineContent: WithInlineMarkdown): Map<String, InlineTextContent> {
+        return rendererExtensions
+            .firstNotNullOfOrNull { it.imageRendererExtension }
+            ?.let { imagesRenderer ->
+                getImages(blockInlineContent).associate { image -> image.source to imagesRenderer.imageContent(image) }
+            } ?: emptyMap()
+    }
+
     @Composable
     protected fun MaybeScrollingContainer(
         isScrollable: Boolean,
@@ -525,3 +537,21 @@ public open class DefaultMarkdownBlockRenderer(
     override operator fun plus(extension: MarkdownRendererExtension): MarkdownBlockRenderer =
         DefaultMarkdownBlockRenderer(rootStyling, rendererExtensions = rendererExtensions + extension, inlineRenderer)
 }
+
+private fun getImages(input: WithInlineMarkdown): List<InlineMarkdown.Image> = buildList {
+    fun collectImagesRecursively(items: List<InlineMarkdown>) {
+        for (item in items) {
+            when (item) {
+                is InlineMarkdown.Image -> {
+                    if (item.source.isNotBlank()) add(item)
+                }
+                is WithInlineMarkdown -> {
+                    collectImagesRecursively(item.inlineContent)
+                }
+
+                else -> {}
+            }
+        }
+    }
+    collectImagesRecursively(input.inlineContent)
+}

platform/jewel/markdown/core/src/main/kotlin/org/jetbrains/jewel/markdown/rendering/DefaultMarkdownBlockRenderer.kt

@@ -143,6 +143,7 @@ public final class org/jetbrains/jewel/markdown/extensions/github/alerts/GitHubA
 	public fun <init> (Lorg/jetbrains/jewel/markdown/extensions/github/alerts/AlertStyling;Lorg/jetbrains/jewel/markdown/rendering/MarkdownStyling;)V
 	public fun getBlockRenderer ()Lorg/jetbrains/jewel/markdown/extensions/MarkdownBlockRendererExtension;
 	public fun getDelimitedInlineRenderer ()Lorg/jetbrains/jewel/markdown/extensions/MarkdownDelimitedInlineRendererExtension;
+	public fun getImageRendererExtension ()Lorg/jetbrains/jewel/markdown/extensions/ImageRendererExtension;
 }
 
 public final class org/jetbrains/jewel/markdown/extensions/github/alerts/ImportantAlertStyling : org/jetbrains/jewel/markdown/extensions/github/alerts/BaseAlertStyling {

platform/jewel/markdown/extensions/gfm-alerts/api/gfm-alerts.api

@@ -44,5 +44,6 @@ public final class org/jetbrains/jewel/markdown/extensions/github/strikethrough/
 	public static final field INSTANCE Lorg/jetbrains/jewel/markdown/extensions/github/strikethrough/GitHubStrikethroughRendererExtension;
 	public fun getBlockRenderer ()Lorg/jetbrains/jewel/markdown/extensions/MarkdownBlockRendererExtension;
 	public fun getDelimitedInlineRenderer ()Lorg/jetbrains/jewel/markdown/extensions/MarkdownDelimitedInlineRendererExtension;
+	public fun getImageRendererExtension ()Lorg/jetbrains/jewel/markdown/extensions/ImageRendererExtension;
 }
 

platform/jewel/markdown/extensions/gfm-strikethrough/api/gfm-strikethrough.api

@@ -67,6 +67,7 @@ public final class org/jetbrains/jewel/markdown/extensions/github/tables/GitHubT
 	public fun <init> (Lorg/jetbrains/jewel/markdown/extensions/github/tables/GfmTableStyling;Lorg/jetbrains/jewel/markdown/rendering/MarkdownStyling;)V
 	public fun getBlockRenderer ()Lorg/jetbrains/jewel/markdown/extensions/MarkdownBlockRendererExtension;
 	public fun getDelimitedInlineRenderer ()Lorg/jetbrains/jewel/markdown/extensions/MarkdownDelimitedInlineRendererExtension;
+	public fun getImageRendererExtension ()Lorg/jetbrains/jewel/markdown/extensions/ImageRendererExtension;
 }
 
 public final class org/jetbrains/jewel/markdown/extensions/github/tables/RowBackgroundStyle : java/lang/Enum {

platform/jewel/markdown/extensions/gfm-tables/api/gfm-tables.api

@@ -0,0 +1,41 @@
+# GitHub Flavored Markdown — strikethrough extension
+
+This extension adds support for strikethrough,
+a [GFM extension](https://github.github.com/gfm/#strikethrough-extension-) over
+CommonMark. Strikethrough nodes are parsed by the `commonmark-ext-images` library, and rendered simply by
+wrapping their content in a `SpanStyle` that applies the `LineThrough` decoration.
+
+![Screenshot of a strikethrough](../../../art/docs/images.png)
+
+## Usage
+
+To use the strikethrough extension, you need to add the `GitHubStrikethroughProcessorExtension` to your
+`MarkdownProcessor`, and the
+`GitHubStrikethroughRendererExtension` to the `MarkdownBlockRenderer`. For example, in standalone mode:
+
+```kotlin
+val isDark = JewelTheme.isDark
+
+val markdownStyling = remember(isDark) { if (isDark) MarkdownStyling.dark() else MarkdownStyling.light() }
+
+val processor = remember { MarkdownProcessor(listOf(GitHubStrikethroughProcessorExtension)) }
+
+val blockRenderer =
+    remember(markdownStyling) {
+        if (isDark) {
+            MarkdownBlockRenderer.dark(
+                styling = markdownStyling,
+                rendererExtensions = listOf(GitHubStrikethroughRendererExtension),
+            )
+        } else {
+            MarkdownBlockRenderer.light(
+                styling = markdownStyling,
+                rendererExtensions = listOf(GitHubStrikethroughRendererExtension),
+            )
+        }
+    }
+
+ProvideMarkdownStyling(markdownStyling, blockRenderer, NoOpCodeHighlighter) {
+    // Your UI that renders Markdown goes here
+}
+```

platform/jewel/markdown/extensions/images/README.md

@@ -0,0 +1,40 @@
+f:org.jetbrains.jewel.markdown.extensions.github.strikethrough.GitHubStrikethroughInlineProcessorExtension
+- org.jetbrains.jewel.markdown.extensions.MarkdownDelimitedInlineProcessorExtension
+- sf:$stable:I
+- sf:INSTANCE:org.jetbrains.jewel.markdown.extensions.github.strikethrough.GitHubStrikethroughInlineProcessorExtension
+- canProcess(org.commonmark.node.Delimited):Z
+- processDelimitedInline(org.commonmark.node.Delimited,org.jetbrains.jewel.markdown.processing.MarkdownProcessor):org.jetbrains.jewel.markdown.InlineMarkdown$CustomDelimitedNode
+f:org.jetbrains.jewel.markdown.extensions.github.strikethrough.GitHubStrikethroughInlineRendererExtension
+- org.jetbrains.jewel.markdown.extensions.MarkdownDelimitedInlineRendererExtension
+- sf:$stable:I
+- sf:INSTANCE:org.jetbrains.jewel.markdown.extensions.github.strikethrough.GitHubStrikethroughInlineRendererExtension
+- canRender(org.jetbrains.jewel.markdown.InlineMarkdown$CustomDelimitedNode):Z
+- render(org.jetbrains.jewel.markdown.InlineMarkdown$CustomDelimitedNode,org.jetbrains.jewel.markdown.rendering.InlineMarkdownRenderer,org.jetbrains.jewel.markdown.rendering.InlinesStyling,Z,kotlin.jvm.functions.Function1):androidx.compose.ui.text.AnnotatedString
+f:org.jetbrains.jewel.markdown.extensions.github.strikethrough.GitHubStrikethroughNode
+- org.jetbrains.jewel.markdown.InlineMarkdown$CustomDelimitedNode
+- org.jetbrains.jewel.markdown.WithInlineMarkdown
+- sf:$stable:I
+- <init>(java.lang.String,java.util.List):V
+- f:component1():java.lang.String
+- f:component2():java.util.List
+- f:copy(java.lang.String,java.util.List):org.jetbrains.jewel.markdown.extensions.github.strikethrough.GitHubStrikethroughNode
+- bs:copy$default(org.jetbrains.jewel.markdown.extensions.github.strikethrough.GitHubStrikethroughNode,java.lang.String,java.util.List,I,java.lang.Object):org.jetbrains.jewel.markdown.extensions.github.strikethrough.GitHubStrikethroughNode
+- equals(java.lang.Object):Z
+- f:getDelimiter():java.lang.String
+- getInlineContent():java.util.List
+- getOpeningDelimiter():java.lang.String
+- hashCode():I
+f:org.jetbrains.jewel.markdown.extensions.github.strikethrough.GitHubStrikethroughProcessorExtension
+- org.jetbrains.jewel.markdown.extensions.MarkdownProcessorExtension
+- sf:$stable:I
+- <init>():V
+- <init>(Z):V
+- b:<init>(Z,I,kotlin.jvm.internal.DefaultConstructorMarker):V
+- getDelimitedInlineProcessorExtension():org.jetbrains.jewel.markdown.extensions.MarkdownDelimitedInlineProcessorExtension
+- getParserExtension():org.commonmark.parser.Parser$ParserExtension
+- getTextRendererExtension():org.commonmark.renderer.text.TextContentRenderer$TextContentRendererExtension
+f:org.jetbrains.jewel.markdown.extensions.github.strikethrough.GitHubStrikethroughRendererExtension
+- org.jetbrains.jewel.markdown.extensions.MarkdownRendererExtension
+- sf:$stable:I
+- sf:INSTANCE:org.jetbrains.jewel.markdown.extensions.github.strikethrough.GitHubStrikethroughRendererExtension
+- getDelimitedInlineRenderer():org.jetbrains.jewel.markdown.extensions.MarkdownDelimitedInlineRendererExtension

platform/jewel/markdown/extensions/images/api-dump-unreviewed.txt

@@ -0,0 +1,14 @@
+public final class org/jetbrains/jewel/markdown/extensions/images/Coil3ImagesRendererExtension : org/jetbrains/jewel/markdown/extensions/MarkdownRendererExtension {
+	public static final field $stable I
+	public static final field INSTANCE Lorg/jetbrains/jewel/markdown/extensions/images/Coil3ImagesRendererExtension;
+	public fun getBlockRenderer ()Lorg/jetbrains/jewel/markdown/extensions/MarkdownBlockRendererExtension;
+	public fun getDelimitedInlineRenderer ()Lorg/jetbrains/jewel/markdown/extensions/MarkdownDelimitedInlineRendererExtension;
+	public fun getImageRendererExtension ()Lorg/jetbrains/jewel/markdown/extensions/ImageRendererExtension;
+}
+
+public final class org/jetbrains/jewel/markdown/extensions/images/Coil3ImagesRendererExtensionImpl : org/jetbrains/jewel/markdown/extensions/ImageRendererExtension {
+	public static final field $stable I
+	public static final field INSTANCE Lorg/jetbrains/jewel/markdown/extensions/images/Coil3ImagesRendererExtensionImpl;
+	public fun imageContent (Lorg/jetbrains/jewel/markdown/InlineMarkdown$Image;Landroidx/compose/runtime/Composer;I)Landroidx/compose/foundation/text/InlineTextContent;
+}
+

platform/jewel/markdown/extensions/images/api/images.api

@@ -0,0 +1,23 @@
+plugins {
+    jewel
+    `jewel-publish`
+    `jewel-check-public-api`
+    alias(libs.plugins.composeDesktop)
+    alias(libs.plugins.compose.compiler)
+}
+
+dependencies {
+    implementation(projects.markdown.core)
+    runtimeOnly(libs.ktor.client.java)
+    implementation(libs.coil.compose)
+    implementation(libs.coil.network.ktor3)
+    implementation(libs.coil.svg)
+    testImplementation(compose.desktop.uiTestJUnit4)
+}
+
+publishing.publications.named<MavenPublication>("main") {
+    val ijpTarget = project.property("ijp.target") as String
+    artifactId = "jewel-markdown-extension-${project.name}-$ijpTarget"
+}
+
+publicApiValidation { excludedClassRegexes = setOf("org.jetbrains.jewel.markdown.extensions.github.strikethrough.*") }

platform/jewel/markdown/extensions/images/build.gradle.kts

@@ -0,0 +1,3 @@
+androidx/compose/**
+kotlin/jvm/internal/DefaultConstructorMarker
+org/commonmark/**