dependencies {// Core library    implementation("com.mikepenz:multiplatform-markdown-renderer:${version}")// Choose ONE of the following based on your Material theme:// For Material 2 themed apps    implementation("com.mikepenz:multiplatform-markdown-renderer-m2:${version}")// OR for Material 3 themed apps    implementation("com.mikepenz:multiplatform-markdown-renderer-m3:${version}")}

dependencies {    implementation("com.mikepenz:multiplatform-markdown-renderer-jvm:${version}")}

dependencies {    implementation("com.mikepenz:multiplatform-markdown-renderer-android:${version}")}

rememberMarkdownState

val markdownState= rememberMarkdownState(markdown)Markdown(markdownState)

// Default asynchronous parsing (recommended)val markdownState= rememberMarkdownState(markdown)// Force immediate parsing (not recommended)val markdownState= rememberMarkdownState(markdown, immediate=true)

Retaining State During Updates

// Retain previous content during updates (avoids showing loading state)val markdownState= rememberMarkdownState(    markdown,    retainState=true)Markdown(markdownState)// With dynamic content loadingval markdownState= rememberMarkdownState(    key,// key that triggers re-parsing    retainState=true) {"# Dynamic content$counter"}Markdown(markdownState)

Lazy Loading for Large Documents

Markdown(    markdownState= markdownState,    success= { state, components, modifier->LazyMarkdownSuccess(state, components, modifier, contentPadding=PaddingValues(16.dp))    },    modifier=Modifier.fillMaxSize())

Parse Markdown in VM

// In the VM setup the flow to parse the markdownval markdownFlow= parseMarkdownFlow("# Markdown")    .stateIn(lifecycleScope,SharingStarted.Eagerly,State.Loading())// In the Composable use the flowval state by markdownFlow.collectAsStateWithLifecycle()Markdown(state)

Provided custom style

Markdown(    content,    colors= markdownColors(text=Color.Red),    typography= markdownTypography(h1=MaterialTheme.typography.body1))

Disable Animation

Markdown(    content,    animations= markdownAnimations(        animateTextSize= {this/** No animation*/        }    ),)

Extended spans

Markdown(    content,    extendedSpans= markdownExtendedSpans {val animator= rememberSquigglyUnderlineAnimator()        remember {ExtendedSpans(RoundedCornerSpanPainter(),SquigglyUnderlineSpanPainter(animator= animator)            )        }    })

Extend Annotated string handling

Markdown(    content,    annotator= markdownAnnotator { content, child->if (child.type==GFMElementTypes.STRIKETHROUGH) {            append("Replaced you :)")true// return true to consume this ASTNode child        }elsefalse    })

Adjust List Ordering

// Use the bullet list symbol from the original markdownCompositionLocalProvider(LocalBulletListHandler provides { type, bullet, index, listNumber, depth->"$bullet" }) {Markdown(content)}// Replace the ordered list symbol with `A.)` instead.CompositionLocalProvider(LocalOrderedListHandler provides { type, bullet, index, listNumber, depth->"A.)" }) {Markdown(content,Modifier.fillMaxSize().padding(16.dp).verticalScroll(scrollState))}

Custom Components

// Simple adjusted paragraph with different Modifier.val customParagraphComponent:MarkdownComponent= {Box(modifier=Modifier.fillMaxWidth()) {MarkdownParagraph(it.content, it.node,Modifier.align(Alignment.CenterEnd))    }}// Full custom paragraph exampleval customParagraphComponentComplex:MarkdownComponent= {// build a styled paragraph. (util function provided by the library)val styledText= buildAnnotatedString {        pushStyle(LocalMarkdownTypography.current.paragraph.toSpanStyle())        buildMarkdownAnnotatedString(it.content, it.node, annotatorSettings())        pop()    }// define the `Text` composableText(        styledText,        textAlign=TextAlign.End    )}// Define the `Markdown` composable and pass in the custom paragraph componentMarkdown(    content,    components= markdownComponents(        paragraph= customParagraphComponent// customParagraphComponentComplex    ))

// Define a custom component for rendering unordered list items in Markdownval customUnorderedListComponent:MarkdownComponent= {// Use the MarkdownListItems composable to render the list itemsMarkdownListItems(it.content, it.node, depth=0) { startNumber, index, child->// Render an icon for the bullet point with a green tintIcon(            imageVector= icon,            tint=Color.Green,            contentDescription=null,            modifier=Modifier.size(20.dp),        )    }}// Define the `Markdown` composable and pass in the custom unorderedList componentMarkdown(    content,    components= markdownComponents(        unorderedList= customUnorderedListComponent    ))

Table Support

val markdown="""| Header 1 | Header 2 ||----------|----------|| Cell 1   | Cell 2   || Cell 3   | Cell 4   |""".trimIndent()Markdown(markdown)