Skip to main content

useEnrichedMarkdownInputStyle

Resolve the theme-derived MarkdownTextInputStyle (typed directly from react-native-enriched-markdown) used by MarkdownInput and the underlying EnrichedMarkdownTextInput. The editor's formatted spans — bold, italic, links, spoilers, headings, and list spacing — are mapped to the active theme's colors, fonts, and variables, so formatted text in the editor reads the same as the rendered output from MarkdownTypography.

MarkdownInput applies this internally, so you only need this hook when you want to customize the default styling or drive EnrichedMarkdownTextInput yourself.

Usage​

import { useEnrichedMarkdownInputStyle } from '@multinaire/expo-ui';
import { EnrichedMarkdownTextInput } from 'react-native-enriched-markdown';

function CustomEditor() {
const { style } = useEnrichedMarkdownInputStyle();

return <EnrichedMarkdownTextInput markdownStyle={style} />;
}

To tweak a few elements without reimplementing the editor, pass a partial markdownStyle to MarkdownInput instead — it is merged over this default.

Return Value​

PropertyTypeDescription
styleMarkdownTextInputStyleStyle object mapping the editor's formatted spans to theme tokens.
note

The editor supports a narrower set of elements than the read-only renderer — no code blocks, tables, or blockquotes. For those, use useEnrichedMarkdownStyle with EnrichedMarkdownText.