Markdown

fun Markdown(content: String, colors: MarkdownColors, typography: MarkdownTypography, modifier: Modifier = Modifier.fillMaxSize(), padding: MarkdownPadding = markdownPadding(), dimens: MarkdownDimens = markdownDimens(), flavour: MarkdownFlavourDescriptor = GFMFlavourDescriptor(), parser: MarkdownParser = MarkdownParser(flavour), imageTransformer: ImageTransformer = NoOpImageTransformerImpl(), annotator: MarkdownAnnotator = markdownAnnotator(), extendedSpans: MarkdownExtendedSpans = markdownExtendedSpans(), inlineContent: MarkdownInlineContent = markdownInlineContent(), components: MarkdownComponents = markdownComponents(), animations: MarkdownAnimations = markdownAnimations(), referenceLinkHandler: ReferenceLinkHandler = ReferenceLinkHandlerImpl(), loading: @Composable (modifier: Modifier) -> Unit = { Box(modifier) }, success: @Composable (state: State.Success, components: MarkdownComponents, modifier: Modifier) -> Unit = { state, components, modifier -> MarkdownSuccess(state = state, components = components, modifier = modifier) }, error: @Composable (modifier: Modifier) -> Unit = { Box(modifier) })

Renders the provided markdown content string using Jetpack Compose.

This is the primary entry point for rendering markdown content in your application. It handles parsing the markdown string, applying styling, and rendering the content with appropriate components.

The rendering process follows these steps:

  1. Parse the markdown content using the provided parser

  2. Create a state object to manage the rendering process

  3. Apply styling and customization options

  4. Render the content using the appropriate components

Example usage:

Markdown(
content = "# Hello World\n\nThis is a **bold** statement.",
colors = markdownColor(),
typography = markdownTypography()
)

Parameters

content

The markdown content string to be rendered.

colors

The color scheme to be used for rendering different markdown elements.

typography

The typography settings to be used for text rendering.

modifier

The modifier to be applied to the container. Defaults to Modifier.fillMaxSize.

padding

The padding configuration to be applied to different markdown elements.

dimens

The dimension settings for spacing and sizing of markdown elements.

flavour

The markdown flavor descriptor for parsing. By default uses GitHub Flavored Markdown (GFM).

parser

The parser instance to be used for parsing the markdown. By default creates a new parser with the provided flavor.

imageTransformer

The transformer for handling and loading images within markdown content.

annotator

The annotator for adding custom annotations to the rendered content.

extendedSpans

The configuration for extended text spans beyond standard markdown.

inlineContent

The configuration for inline custom content within markdown.

components

The custom components to be used for rendering different markdown elements.

referenceLinkHandler

The handler for resolving reference-style links in markdown.

animations

The animation configurations for interactive elements.

loading

A composable function to be displayed while the content is being parsed and prepared.

success

A composable function to be displayed with the successfully parsed markdown content. It receives the state, components, and modifier as parameters. By default, this renders the content in a Column.

error

A composable function to be displayed in case of parsing errors. This is only triggered if assertions are enabled on the parser.


fun Markdown(markdownState: MarkdownState, colors: MarkdownColors, typography: MarkdownTypography, modifier: Modifier = Modifier.fillMaxSize(), padding: MarkdownPadding = markdownPadding(), dimens: MarkdownDimens = markdownDimens(), imageTransformer: ImageTransformer = NoOpImageTransformerImpl(), annotator: MarkdownAnnotator = markdownAnnotator(), extendedSpans: MarkdownExtendedSpans = markdownExtendedSpans(), inlineContent: MarkdownInlineContent = markdownInlineContent(), components: MarkdownComponents = markdownComponents(), animations: MarkdownAnimations = markdownAnimations(), loading: @Composable (modifier: Modifier) -> Unit = { Box(modifier) }, success: @Composable (state: State.Success, components: MarkdownComponents, modifier: Modifier) -> Unit = { state, components, modifier -> MarkdownSuccess(state = state, components = components, modifier = modifier) }, error: @Composable (modifier: Modifier) -> Unit = { Box(modifier) })

Renders markdown content using a pre-created MarkdownState object.

This overload is useful when you need more control over the state management of your markdown content, such as when you want to:

  • Pre-parse markdown content

  • Share the same state across multiple composables

  • Implement custom state handling logic

The state object manages the parsing and preparation of the markdown content, while this function handles the rendering with appropriate styling and components.

Example usage:

val markdownState = rememberMarkdownState(content = "# Hello World")

Markdown(
markdownState = markdownState,
colors = markdownColor(),
typography = markdownTypography()
)

Parameters

markdownState

A MarkdownState object that manages the parsing and state of the markdown content.

colors

The color scheme to be used for rendering different markdown elements.

typography

The typography settings to be used for text rendering.

modifier

The modifier to be applied to the container. Defaults to Modifier.fillMaxSize.

padding

The padding configuration to be applied to different markdown elements.

dimens

The dimension settings for spacing and sizing of markdown elements.

imageTransformer

The transformer for handling and loading images within markdown content.

annotator

The annotator for adding custom annotations to the rendered content.

extendedSpans

The configuration for extended text spans beyond standard markdown.

inlineContent

The configuration for inline custom content within markdown.

components

The custom components to be used for rendering different markdown elements.

animations

The animation configurations for interactive elements.

loading

A composable function to be displayed while the content is being parsed and prepared.

success

A composable function to be displayed with the successfully parsed markdown content. It receives the state, components, and modifier as parameters. By default, this renders the content in a Column.

error

A composable function to be displayed in case of parsing errors. This is only triggered if assertions are enabled on the parser.

See also


fun Markdown(state: State, colors: MarkdownColors, typography: MarkdownTypography, modifier: Modifier = Modifier.fillMaxSize(), padding: MarkdownPadding = markdownPadding(), dimens: MarkdownDimens = markdownDimens(), imageTransformer: ImageTransformer = NoOpImageTransformerImpl(), annotator: MarkdownAnnotator = markdownAnnotator(), extendedSpans: MarkdownExtendedSpans = markdownExtendedSpans(), inlineContent: MarkdownInlineContent = markdownInlineContent(), components: MarkdownComponents = markdownComponents(), animations: MarkdownAnimations = markdownAnimations(), loading: @Composable (modifier: Modifier) -> Unit = { Box(modifier) }, success: @Composable (state: State.Success, components: MarkdownComponents, modifier: Modifier) -> Unit = { state, components, modifier -> MarkdownSuccess(state = state, components = components, modifier = modifier) }, error: @Composable (modifier: Modifier) -> Unit = { Box(modifier) })

Renders markdown content using a State object directly.

This is the lowest-level overload of the Markdown composable, providing direct control over the rendering state. It's primarily used internally by the other overloads but can be useful for advanced use cases where you need to:

  • Implement custom state transitions

  • Handle specific loading/error states manually

  • Integrate with custom state management systems

The function handles different states (Loading, Success, Error) and provides appropriate UI for each state.

Example usage:

val state: State = ... // Your custom state implementation

Markdown(
state = state,
colors = markdownColor(),
typography = markdownTypography(),
loading = { LoadingIndicator() },
error = { ErrorMessage() }
)

Parameters

state

A State object representing the current state of the markdown content (loading, success, or error).

colors

The color scheme to be used for rendering different markdown elements.

typography

The typography settings to be used for text rendering.

modifier

The modifier to be applied to the container. Defaults to Modifier.fillMaxSize.

padding

The padding configuration to be applied to different markdown elements.

dimens

The dimension settings for spacing and sizing of markdown elements.

imageTransformer

The transformer for handling and loading images within markdown content.

annotator

The annotator for adding custom annotations to the rendered content.

extendedSpans

The configuration for extended text spans beyond standard markdown.

inlineContent

The configuration for inline custom content within markdown.

components

The custom components to be used for rendering different markdown elements.

animations

The animation configurations for interactive elements.

loading

A composable function to be displayed when the state is State.Loading.

success

A composable function to be displayed when the state is State.Success. It receives the state, components, and modifier as parameters. By default, this renders the content in a Column.

error

A composable function to be displayed when the state is State.Error.

See also