@domenico-esposito/react-native-markdown-editor 0.1.1

package/build/MarkdownTextInput.js

@@ -0,0 +1,233 @@
+import * as React from 'react';
+import { Platform, StyleSheet, TextInput, View } from 'react-native';
+import { DEFAULT_SEGMENT_COMPONENTS, getDefaultSegmentStyle } from './markdownSegmentDefaults';
+const isWeb = Platform.OS === 'web';
+// ---------------------------------------------------------------------------
+// Web helpers – contentEditable with inline syntax highlighting
+// ---------------------------------------------------------------------------
+function escapeHTML(s) {
+    return s.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;');
+}
+function styleToCSS(s) {
+    const p = [];
+    if (s.color)
+        p.push(`color:${s.color}`);
+    if (s.fontWeight)
+        p.push(`font-weight:${s.fontWeight}`);
+    if (s.fontStyle)
+        p.push(`font-style:${s.fontStyle}`);
+    if (s.textDecorationLine)
+        p.push(`text-decoration:${s.textDecorationLine}`);
+    if (s.fontFamily)
+        p.push(`font-family:${s.fontFamily}`);
+    if (s.fontSize != null)
+        p.push(`font-size:${s.fontSize}px`);
+    if (s.lineHeight != null)
+        p.push(`line-height:${s.lineHeight}px`);
+    if (s.backgroundColor)
+        p.push(`background-color:${s.backgroundColor}`);
+    if (s.letterSpacing != null)
+        p.push(`letter-spacing:${s.letterSpacing}px`);
+    return p.join(';');
+}
+function segmentsToHTML(segments) {
+    return segments
+        .map((seg) => `<span style="${styleToCSS(getDefaultSegmentStyle(seg.type, seg.meta))}">${escapeHTML(seg.text)}</span>`)
+        .join('');
+}
+function textOffset(root, target, off) {
+    const tw = document.createTreeWalker(root, NodeFilter.SHOW_TEXT);
+    let count = 0;
+    let n;
+    while ((n = tw.nextNode())) {
+        if (n === target)
+            return count + off;
+        count += n.length;
+    }
+    return count;
+}
+function saveCursor(el) {
+    const s = window.getSelection();
+    if (!s || !s.rangeCount)
+        return null;
+    const r = s.getRangeAt(0);
+    if (!el.contains(r.startContainer))
+        return null;
+    return {
+        start: textOffset(el, r.startContainer, r.startOffset),
+        end: textOffset(el, r.endContainer, r.endOffset),
+    };
+}
+function restoreCursor(el, pos) {
+    const s = window.getSelection();
+    if (!s)
+        return;
+    const range = document.createRange();
+    const tw = document.createTreeWalker(el, NodeFilter.SHOW_TEXT);
+    let idx = 0;
+    let startSet = false;
+    let n;
+    while ((n = tw.nextNode())) {
+        const len = n.length;
+        if (!startSet && idx + len >= pos.start) {
+            range.setStart(n, pos.start - idx);
+            startSet = true;
+        }
+        if (startSet && idx + len >= pos.end) {
+            range.setEnd(n, pos.end - idx);
+            break;
+        }
+        idx += len;
+    }
+    if (!startSet) {
+        range.selectNodeContents(el);
+        range.collapse(false);
+    }
+    s.removeAllRanges();
+    s.addRange(range);
+}
+function extractText(el) {
+    let text = '';
+    const walk = (node) => {
+        if (node.nodeType === Node.TEXT_NODE) {
+            text += node.textContent;
+        }
+        else if (node.nodeType === Node.ELEMENT_NODE) {
+            if (node.tagName === 'BR') {
+                text += '\n';
+            }
+            else {
+                for (let i = 0; i < node.childNodes.length; i++)
+                    walk(node.childNodes[i]);
+            }
+        }
+    };
+    walk(el);
+    return text;
+}
+// ---------------------------------------------------------------------------
+// Component
+// ---------------------------------------------------------------------------
+/**
+ * Pure markdown text input with integrated live preview.
+ *
+ * Requires an `editor` handle from `useMarkdownEditor()`.
+ * Does NOT render a toolbar, use `MarkdownToolbar` separately.
+ */
+export default function MarkdownTextInput({ editor, style, textInputStyle, segmentComponents, ...textInputProps }) {
+    const components = React.useMemo(() => ({ ...DEFAULT_SEGMENT_COMPONENTS, ...segmentComponents }), [segmentComponents]);
+    const editableRef = React.useRef(null);
+    const cursorRef = React.useRef(null);
+    // Web: sync highlighted segments into contentEditable DOM
+    // biome-ignore lint: segments is the only meaningful dep
+    React.useLayoutEffect(() => {
+        if (!isWeb)
+            return;
+        const el = editableRef.current;
+        if (!el)
+            return;
+        const cursor = cursorRef.current ?? saveCursor(el);
+        el.innerHTML = segmentsToHTML(editor.highlightedSegments);
+        if (cursor)
+            restoreCursor(el, cursor);
+        cursorRef.current = null;
+    }, [editor.highlightedSegments]);
+    // Web: apply programmatic selection from editor (e.g. after toolbar actions)
+    React.useEffect(() => {
+        if (!isWeb || !editableRef.current || !editor.selection)
+            return;
+        restoreCursor(editableRef.current, editor.selection);
+    }, [editor.selection]);
+    const handleInput = React.useCallback(() => {
+        const el = editableRef.current;
+        if (!el)
+            return;
+        cursorRef.current = saveCursor(el);
+        editor.handleChangeText(extractText(el));
+    }, [editor.handleChangeText]);
+    const handleSelect = React.useCallback(() => {
+        const el = editableRef.current;
+        if (!el)
+            return;
+        const pos = saveCursor(el);
+        if (pos)
+            editor.handleSelectionChange({ nativeEvent: { selection: pos } });
+    }, [editor.handleSelectionChange]);
+    const handleKeyDown = React.useCallback((e) => {
+        if (e.key === 'Enter') {
+            e.preventDefault();
+            document.execCommand('insertText', false, '\n');
+        }
+    }, []);
+    const handlePaste = React.useCallback((e) => {
+        e.preventDefault();
+        document.execCommand('insertText', false, e.clipboardData.getData('text/plain'));
+    }, []);
+    const setRef = React.useCallback((el) => {
+        editableRef.current = el;
+        if (editor.inputRef && typeof editor.inputRef === 'object') {
+            editor.inputRef.current = el;
+        }
+    }, [editor.inputRef]);
+    if (isWeb) {
+        return (<View style={[styles.editorContainer, style]}>
+				<View style={styles.webWrapper}>
+					{!editor.value && textInputProps.placeholder ? (<div style={{
+                    position: 'absolute',
+                    top: 10,
+                    left: 14,
+                    color: String(textInputProps.placeholderTextColor ?? '#999'),
+                    fontSize: 16,
+                    pointerEvents: 'none',
+                    userSelect: 'none',
+                }}>
+							{textInputProps.placeholder}
+						</div>) : null}
+					<div ref={setRef} contentEditable suppressContentEditableWarning onInput={handleInput} onSelect={handleSelect} onKeyDown={handleKeyDown} onPaste={handlePaste} style={{
+                flex: 1,
+                padding: '10px 14px',
+                fontSize: 16,
+                whiteSpace: 'pre-wrap',
+                wordBreak: 'break-word',
+                outline: 'none',
+                overflowY: 'auto',
+                caretColor: '#000',
+            }}/>
+				</View>
+			</View>);
+    }
+    return (<View style={[styles.editorContainer, style]}>
+			<TextInput placeholderTextColor="#999" {...textInputProps} ref={editor.inputRef} multiline onChangeText={editor.handleChangeText} onSelectionChange={editor.handleSelectionChange} selection={editor.selection} style={[styles.textInput, textInputStyle]}>
+				{editor.highlightedSegments.map((segment, index) => {
+            const Component = components[segment.type];
+            return (<Component key={index} type={segment.type} meta={segment.meta}>
+							{segment.text}
+						</Component>);
+        })}
+			</TextInput>
+		</View>);
+}
+const styles = StyleSheet.create({
+    editorContainer: {
+        gap: 12,
+        borderWidth: 1,
+        borderColor: '#d7d7d7',
+        borderRadius: 12,
+        backgroundColor: '#fff',
+        minHeight: 140,
+        overflow: 'hidden',
+    },
+    textInput: {
+        flex: 1,
+        paddingHorizontal: 14,
+        paddingVertical: 10,
+        textAlignVertical: 'top',
+        fontSize: 16,
+        includeFontPadding: false,
+    },
+    webWrapper: {
+        flex: 1,
+        position: 'relative',
+    },
+});
+//# sourceMappingURL=MarkdownTextInput.js.map

package/build/MarkdownTextInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MarkdownTextInput.js","sourceRoot":"","sources":["../src/MarkdownTextInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { Platform, StyleSheet, TextInput, View } from 'react-native';\n\nimport type { MarkdownTextInputProps } from './markdownCore.types';\nimport type { HighlightSegment } from './markdownHighlight.types';\nimport { DEFAULT_SEGMENT_COMPONENTS, getDefaultSegmentStyle } from './markdownSegmentDefaults';\n\nconst isWeb = Platform.OS === 'web';\n\n// ---------------------------------------------------------------------------\n// Web helpers – contentEditable with inline syntax highlighting\n// ---------------------------------------------------------------------------\n\nfunction escapeHTML(s: string): string {\n\treturn s.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/\"/g, '&quot;');\n}\n\nfunction styleToCSS(s: Record<string, any>): string {\n\tconst p: string[] = [];\n\tif (s.color) p.push(`color:${s.color}`);\n\tif (s.fontWeight) p.push(`font-weight:${s.fontWeight}`);\n\tif (s.fontStyle) p.push(`font-style:${s.fontStyle}`);\n\tif (s.textDecorationLine) p.push(`text-decoration:${s.textDecorationLine}`);\n\tif (s.fontFamily) p.push(`font-family:${s.fontFamily}`);\n\tif (s.fontSize != null) p.push(`font-size:${s.fontSize}px`);\n\tif (s.lineHeight != null) p.push(`line-height:${s.lineHeight}px`);\n\tif (s.backgroundColor) p.push(`background-color:${s.backgroundColor}`);\n\tif (s.letterSpacing != null) p.push(`letter-spacing:${s.letterSpacing}px`);\n\treturn p.join(';');\n}\n\nfunction segmentsToHTML(segments: HighlightSegment[]): string {\n\treturn segments\n\t\t.map((seg) => `<span style=\"${styleToCSS(getDefaultSegmentStyle(seg.type, seg.meta))}\">${escapeHTML(seg.text)}</span>`)\n\t\t.join('');\n}\n\nfunction textOffset(root: Node, target: Node, off: number): number {\n\tconst tw = document.createTreeWalker(root, NodeFilter.SHOW_TEXT);\n\tlet count = 0;\n\tlet n: Node | null;\n\twhile ((n = tw.nextNode())) {\n\t\tif (n === target) return count + off;\n\t\tcount += (n as Text).length;\n\t}\n\treturn count;\n}\n\nfunction saveCursor(el: HTMLElement): { start: number; end: number } | null {\n\tconst s = window.getSelection();\n\tif (!s || !s.rangeCount) return null;\n\tconst r = s.getRangeAt(0);\n\tif (!el.contains(r.startContainer)) return null;\n\treturn {\n\t\tstart: textOffset(el, r.startContainer, r.startOffset),\n\t\tend: textOffset(el, r.endContainer, r.endOffset),\n\t};\n}\n\nfunction restoreCursor(el: HTMLElement, pos: { start: number; end: number }) {\n\tconst s = window.getSelection();\n\tif (!s) return;\n\tconst range = document.createRange();\n\tconst tw = document.createTreeWalker(el, NodeFilter.SHOW_TEXT);\n\tlet idx = 0;\n\tlet startSet = false;\n\tlet n: Node | null;\n\twhile ((n = tw.nextNode())) {\n\t\tconst len = (n as Text).length;\n\t\tif (!startSet && idx + len >= pos.start) {\n\t\t\trange.setStart(n, pos.start - idx);\n\t\t\tstartSet = true;\n\t\t}\n\t\tif (startSet && idx + len >= pos.end) {\n\t\t\trange.setEnd(n, pos.end - idx);\n\t\t\tbreak;\n\t\t}\n\t\tidx += len;\n\t}\n\tif (!startSet) {\n\t\trange.selectNodeContents(el);\n\t\trange.collapse(false);\n\t}\n\ts.removeAllRanges();\n\ts.addRange(range);\n}\n\nfunction extractText(el: HTMLElement): string {\n\tlet text = '';\n\tconst walk = (node: Node) => {\n\t\tif (node.nodeType === Node.TEXT_NODE) {\n\t\t\ttext += node.textContent;\n\t\t} else if (node.nodeType === Node.ELEMENT_NODE) {\n\t\t\tif ((node as HTMLElement).tagName === 'BR') {\n\t\t\t\ttext += '\\n';\n\t\t\t} else {\n\t\t\t\tfor (let i = 0; i < node.childNodes.length; i++) walk(node.childNodes[i]);\n\t\t\t}\n\t\t}\n\t};\n\twalk(el);\n\treturn text;\n}\n\n// ---------------------------------------------------------------------------\n// Component\n// ---------------------------------------------------------------------------\n\n/**\n * Pure markdown text input with integrated live preview.\n *\n * Requires an `editor` handle from `useMarkdownEditor()`.\n * Does NOT render a toolbar, use `MarkdownToolbar` separately.\n */\nexport default function MarkdownTextInput({ editor, style, textInputStyle, segmentComponents, ...textInputProps }: MarkdownTextInputProps) {\n\tconst components = React.useMemo(() => ({ ...DEFAULT_SEGMENT_COMPONENTS, ...segmentComponents }), [segmentComponents]);\n\tconst editableRef = React.useRef<HTMLDivElement>(null);\n\tconst cursorRef = React.useRef<{ start: number; end: number } | null>(null);\n\n\t// Web: sync highlighted segments into contentEditable DOM\n\t// biome-ignore lint: segments is the only meaningful dep\n\tReact.useLayoutEffect(() => {\n\t\tif (!isWeb) return;\n\t\tconst el = editableRef.current;\n\t\tif (!el) return;\n\t\tconst cursor = cursorRef.current ?? saveCursor(el);\n\t\tel.innerHTML = segmentsToHTML(editor.highlightedSegments);\n\t\tif (cursor) restoreCursor(el, cursor);\n\t\tcursorRef.current = null;\n\t}, [editor.highlightedSegments]);\n\n\t// Web: apply programmatic selection from editor (e.g. after toolbar actions)\n\tReact.useEffect(() => {\n\t\tif (!isWeb || !editableRef.current || !editor.selection) return;\n\t\trestoreCursor(editableRef.current, editor.selection);\n\t}, [editor.selection]);\n\n\tconst handleInput = React.useCallback(() => {\n\t\tconst el = editableRef.current;\n\t\tif (!el) return;\n\t\tcursorRef.current = saveCursor(el);\n\t\teditor.handleChangeText(extractText(el));\n\t}, [editor.handleChangeText]);\n\n\tconst handleSelect = React.useCallback(() => {\n\t\tconst el = editableRef.current;\n\t\tif (!el) return;\n\t\tconst pos = saveCursor(el);\n\t\tif (pos) editor.handleSelectionChange({ nativeEvent: { selection: pos } } as any);\n\t}, [editor.handleSelectionChange]);\n\n\tconst handleKeyDown = React.useCallback((e: React.KeyboardEvent) => {\n\t\tif (e.key === 'Enter') {\n\t\t\te.preventDefault();\n\t\t\tdocument.execCommand('insertText', false, '\\n');\n\t\t}\n\t}, []);\n\n\tconst handlePaste = React.useCallback((e: React.ClipboardEvent) => {\n\t\te.preventDefault();\n\t\tdocument.execCommand('insertText', false, e.clipboardData.getData('text/plain'));\n\t}, []);\n\n\tconst setRef = React.useCallback(\n\t\t(el: HTMLDivElement | null) => {\n\t\t\teditableRef.current = el;\n\t\t\tif (editor.inputRef && typeof editor.inputRef === 'object') {\n\t\t\t\t(editor.inputRef as React.MutableRefObject<any>).current = el;\n\t\t\t}\n\t\t},\n\t\t[editor.inputRef],\n\t);\n\n\tif (isWeb) {\n\t\treturn (\n\t\t\t<View style={[styles.editorContainer, style]}>\n\t\t\t\t<View style={styles.webWrapper}>\n\t\t\t\t\t{!editor.value && textInputProps.placeholder ? (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\tposition: 'absolute' as const,\n\t\t\t\t\t\t\t\ttop: 10,\n\t\t\t\t\t\t\t\tleft: 14,\n\t\t\t\t\t\t\t\tcolor: String(textInputProps.placeholderTextColor ?? '#999'),\n\t\t\t\t\t\t\t\tfontSize: 16,\n\t\t\t\t\t\t\t\tpointerEvents: 'none' as const,\n\t\t\t\t\t\t\t\tuserSelect: 'none' as const,\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{textInputProps.placeholder}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t) : null}\n\t\t\t\t\t<div\n\t\t\t\t\t\tref={setRef}\n\t\t\t\t\t\tcontentEditable\n\t\t\t\t\t\tsuppressContentEditableWarning\n\t\t\t\t\t\tonInput={handleInput}\n\t\t\t\t\t\tonSelect={handleSelect}\n\t\t\t\t\t\tonKeyDown={handleKeyDown}\n\t\t\t\t\t\tonPaste={handlePaste}\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tflex: 1,\n\t\t\t\t\t\t\tpadding: '10px 14px',\n\t\t\t\t\t\t\tfontSize: 16,\n\t\t\t\t\t\t\twhiteSpace: 'pre-wrap' as const,\n\t\t\t\t\t\t\twordBreak: 'break-word' as const,\n\t\t\t\t\t\t\toutline: 'none',\n\t\t\t\t\t\t\toverflowY: 'auto' as const,\n\t\t\t\t\t\t\tcaretColor: '#000',\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t</View>\n\t\t\t</View>\n\t\t);\n\t}\n\n\treturn (\n\t\t<View style={[styles.editorContainer, style]}>\n\t\t\t<TextInput\n\t\t\t\tplaceholderTextColor=\"#999\"\n\t\t\t\t{...textInputProps}\n\t\t\t\tref={editor.inputRef}\n\t\t\t\tmultiline\n\t\t\t\tonChangeText={editor.handleChangeText}\n\t\t\t\tonSelectionChange={editor.handleSelectionChange}\n\t\t\t\tselection={editor.selection}\n\t\t\t\tstyle={[styles.textInput, textInputStyle]}>\n\t\t\t\t{editor.highlightedSegments.map((segment, index) => {\n\t\t\t\t\tconst Component = components[segment.type];\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<Component key={index} type={segment.type} meta={segment.meta}>\n\t\t\t\t\t\t\t{segment.text}\n\t\t\t\t\t\t</Component>\n\t\t\t\t\t);\n\t\t\t\t})}\n\t\t\t</TextInput>\n\t\t</View>\n\t);\n}\n\nconst styles = StyleSheet.create({\n\teditorContainer: {\n\t\tgap: 12,\n\t\tborderWidth: 1,\n\t\tborderColor: '#d7d7d7',\n\t\tborderRadius: 12,\n\t\tbackgroundColor: '#fff',\n\t\tminHeight: 140,\n\t\toverflow: 'hidden',\n\t},\n\ttextInput: {\n\t\tflex: 1,\n\t\tpaddingHorizontal: 14,\n\t\tpaddingVertical: 10,\n\t\ttextAlignVertical: 'top',\n\t\tfontSize: 16,\n\t\tincludeFontPadding: false,\n\t},\n\twebWrapper: {\n\t\tflex: 1,\n\t\tposition: 'relative',\n\t},\n});\n"]}

package/build/MarkdownToolbar.d.ts

@@ -0,0 +1,11 @@
+import * as React from 'react';
+import type { MarkdownToolbarProps } from './markdownCore.types';
+/**
+ * Toolbar component for markdown formatting actions.
+ *
+ * Can be used in two ways:
+ * 1. With `editor` prop from `useMarkdownEditor()` (recommended)
+ * 2. With manual `activeInlineActions` + `onPressAction` props
+ */
+export default function MarkdownToolbar({ editor, features: featuresProp, activeInlineActions: activeInlineActionsProp, onPressAction: onPressActionProp, style, buttonStyle, buttonTextStyle, activeButtonStyle, activeButtonTextStyle, inactiveButtonStyle, inactiveButtonTextStyle, renderButton, }: MarkdownToolbarProps): React.JSX.Element;
+//# sourceMappingURL=MarkdownToolbar.d.ts.map

package/build/MarkdownToolbar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MarkdownToolbar.d.ts","sourceRoot":"","sources":["../src/MarkdownToolbar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,KAAK,EAAkF,oBAAoB,EAAE,MAAM,sBAAsB,CAAC;AAuBjJ;;;;;;GAMG;AACH,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,EACvC,MAAM,EACN,QAAQ,EAAE,YAAwC,EAClD,mBAAmB,EAAE,uBAAuB,EAC5C,aAAa,EAAE,iBAAiB,EAChC,KAAK,EACL,WAAW,EACX,eAAe,EACf,iBAAiB,EACjB,qBAAqB,EACrB,mBAAmB,EACnB,uBAAuB,EACvB,YAAY,GACZ,EAAE,oBAAoB,qBA+CtB"}

package/build/MarkdownToolbar.js

@@ -0,0 +1,98 @@
+import * as React from 'react';
+import { Pressable, StyleSheet, Text, View } from 'react-native';
+import { DEFAULT_MARKDOWN_FEATURES } from './markdownToolbarActions';
+const ACTION_LABELS = {
+    bold: 'B',
+    italic: 'I',
+    strikethrough: 'S',
+    code: '</>',
+    codeBlock: '{ }',
+    heading: 'H',
+    heading1: 'H1',
+    heading2: 'H2',
+    heading3: 'H3',
+    heading4: 'H4',
+    heading5: 'H5',
+    heading6: 'H6',
+    quote: '"',
+    unorderedList: '-',
+    orderedList: '1.',
+    divider: '-',
+    image: '🖼',
+};
+/**
+ * Toolbar component for markdown formatting actions.
+ *
+ * Can be used in two ways:
+ * 1. With `editor` prop from `useMarkdownEditor()` (recommended)
+ * 2. With manual `activeInlineActions` + `onPressAction` props
+ */
+export default function MarkdownToolbar({ editor, features: featuresProp = DEFAULT_MARKDOWN_FEATURES, activeInlineActions: activeInlineActionsProp, onPressAction: onPressActionProp, style, buttonStyle, buttonTextStyle, activeButtonStyle, activeButtonTextStyle, inactiveButtonStyle, inactiveButtonTextStyle, renderButton, }) {
+    const features = editor?.features ?? featuresProp;
+    const activeInlineActions = editor?.activeInlineActions ?? activeInlineActionsProp ?? [];
+    const onPressAction = editor?.handleToolbarAction ?? onPressActionProp;
+    return (<View style={[styles.container, style]}>
+			{features.map((action) => {
+            const isImageActive = action === 'image' && editor?.activeImageInfo != null;
+            const isActive = isImageActive || (isInlineAction(action) && activeInlineActions.includes(action));
+            const label = ACTION_LABELS[action];
+            const onPress = () => {
+                if (isImageActive) {
+                    editor?.openImageInfo();
+                }
+                else {
+                    onPressAction?.(action);
+                }
+            };
+            if (renderButton) {
+                return (<React.Fragment key={action}>
+							{renderButton({
+                        action,
+                        label,
+                        active: isActive,
+                        onPress,
+                    })}
+						</React.Fragment>);
+            }
+            const btnState = { action, active: isActive };
+            const resolvedButtonStyle = typeof buttonStyle === 'function' ? buttonStyle(btnState) : buttonStyle;
+            const resolvedButtonTextStyle = typeof buttonTextStyle === 'function' ? buttonTextStyle(btnState) : buttonTextStyle;
+            const stateButtonStyle = isActive ? [styles.buttonActive, activeButtonStyle] : inactiveButtonStyle;
+            const stateButtonTextStyle = isActive ? [styles.buttonTextActive, activeButtonTextStyle] : inactiveButtonTextStyle;
+            return (<Pressable key={action} onPress={onPress} style={[styles.button, resolvedButtonStyle, stateButtonStyle]}>
+						<Text style={[styles.buttonText, resolvedButtonTextStyle, stateButtonTextStyle]}>{label}</Text>
+					</Pressable>);
+        })}
+		</View>);
+}
+function isInlineAction(action) {
+    return action === 'bold' || action === 'italic' || action === 'strikethrough' || action === 'code';
+}
+const styles = StyleSheet.create({
+    container: {
+        flexDirection: 'row',
+        flexWrap: 'wrap',
+        gap: 8,
+        marginBottom: 12,
+    },
+    button: {
+        borderWidth: 1,
+        borderColor: '#c0c0c0',
+        borderRadius: 8,
+        paddingVertical: 6,
+        paddingHorizontal: 10,
+        backgroundColor: '#fff',
+    },
+    buttonActive: {
+        backgroundColor: '#2d5eff',
+        borderColor: '#2d5eff',
+    },
+    buttonText: {
+        color: '#2d2d2d',
+        fontWeight: '600',
+    },
+    buttonTextActive: {
+        color: '#fff',
+    },
+});
+//# sourceMappingURL=MarkdownToolbar.js.map

package/build/MarkdownToolbar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MarkdownToolbar.js","sourceRoot":"","sources":["../src/MarkdownToolbar.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { Pressable, StyleSheet, Text, View } from 'react-native';\n\nimport type { MarkdownInlineToolbarAction, MarkdownToolbarAction, MarkdownToolbarButtonState, MarkdownToolbarProps } from './markdownCore.types';\nimport { DEFAULT_MARKDOWN_FEATURES } from './markdownToolbarActions';\n\nconst ACTION_LABELS: Record<MarkdownToolbarAction, string> = {\n\tbold: 'B',\n\titalic: 'I',\n\tstrikethrough: 'S',\n\tcode: '</>',\n\tcodeBlock: '{ }',\n\theading: 'H',\n\theading1: 'H1',\n\theading2: 'H2',\n\theading3: 'H3',\n\theading4: 'H4',\n\theading5: 'H5',\n\theading6: 'H6',\n\tquote: '\"',\n\tunorderedList: '-',\n\torderedList: '1.',\n\tdivider: '-',\n\timage: '🖼',\n};\n\n/**\n * Toolbar component for markdown formatting actions.\n *\n * Can be used in two ways:\n * 1. With `editor` prop from `useMarkdownEditor()` (recommended)\n * 2. With manual `activeInlineActions` + `onPressAction` props\n */\nexport default function MarkdownToolbar({\n\teditor,\n\tfeatures: featuresProp = DEFAULT_MARKDOWN_FEATURES,\n\tactiveInlineActions: activeInlineActionsProp,\n\tonPressAction: onPressActionProp,\n\tstyle,\n\tbuttonStyle,\n\tbuttonTextStyle,\n\tactiveButtonStyle,\n\tactiveButtonTextStyle,\n\tinactiveButtonStyle,\n\tinactiveButtonTextStyle,\n\trenderButton,\n}: MarkdownToolbarProps) {\n\tconst features = editor?.features ?? featuresProp;\n\tconst activeInlineActions = editor?.activeInlineActions ?? activeInlineActionsProp ?? [];\n\tconst onPressAction = editor?.handleToolbarAction ?? onPressActionProp;\n\n\treturn (\n\t\t<View style={[styles.container, style]}>\n\t\t\t{features.map((action) => {\n\t\t\t\tconst isImageActive = action === 'image' && editor?.activeImageInfo != null;\n\t\t\t\tconst isActive = isImageActive || (isInlineAction(action) && activeInlineActions.includes(action));\n\t\t\t\tconst label = ACTION_LABELS[action];\n\t\t\t\tconst onPress = () => {\n\t\t\t\t\tif (isImageActive) {\n\t\t\t\t\t\teditor?.openImageInfo();\n\t\t\t\t\t} else {\n\t\t\t\t\t\tonPressAction?.(action);\n\t\t\t\t\t}\n\t\t\t\t};\n\n\t\t\t\tif (renderButton) {\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<React.Fragment key={action}>\n\t\t\t\t\t\t\t{renderButton({\n\t\t\t\t\t\t\t\taction,\n\t\t\t\t\t\t\t\tlabel,\n\t\t\t\t\t\t\t\tactive: isActive,\n\t\t\t\t\t\t\t\tonPress,\n\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t</React.Fragment>\n\t\t\t\t\t);\n\t\t\t\t}\n\n\t\t\t\tconst btnState: MarkdownToolbarButtonState = { action, active: isActive };\n\t\t\t\tconst resolvedButtonStyle = typeof buttonStyle === 'function' ? buttonStyle(btnState) : buttonStyle;\n\t\t\t\tconst resolvedButtonTextStyle = typeof buttonTextStyle === 'function' ? buttonTextStyle(btnState) : buttonTextStyle;\n\n\t\t\t\tconst stateButtonStyle = isActive ? [styles.buttonActive, activeButtonStyle] : inactiveButtonStyle;\n\t\t\t\tconst stateButtonTextStyle = isActive ? [styles.buttonTextActive, activeButtonTextStyle] : inactiveButtonTextStyle;\n\n\t\t\t\treturn (\n\t\t\t\t\t<Pressable key={action} onPress={onPress} style={[styles.button, resolvedButtonStyle, stateButtonStyle]}>\n\t\t\t\t\t\t<Text style={[styles.buttonText, resolvedButtonTextStyle, stateButtonTextStyle]}>{label}</Text>\n\t\t\t\t\t</Pressable>\n\t\t\t\t);\n\t\t\t})}\n\t\t</View>\n\t);\n}\n\nfunction isInlineAction(action: MarkdownToolbarAction): action is MarkdownInlineToolbarAction {\n\treturn action === 'bold' || action === 'italic' || action === 'strikethrough' || action === 'code';\n}\n\nconst styles = StyleSheet.create({\n\tcontainer: {\n\t\tflexDirection: 'row',\n\t\tflexWrap: 'wrap',\n\t\tgap: 8,\n\t\tmarginBottom: 12,\n\t},\n\tbutton: {\n\t\tborderWidth: 1,\n\t\tborderColor: '#c0c0c0',\n\t\tborderRadius: 8,\n\t\tpaddingVertical: 6,\n\t\tpaddingHorizontal: 10,\n\t\tbackgroundColor: '#fff',\n\t},\n\tbuttonActive: {\n\t\tbackgroundColor: '#2d5eff',\n\t\tborderColor: '#2d5eff',\n\t},\n\tbuttonText: {\n\t\tcolor: '#2d2d2d',\n\t\tfontWeight: '600',\n\t},\n\tbuttonTextActive: {\n\t\tcolor: '#fff',\n\t},\n});\n"]}

package/build/index.d.ts

@@ -0,0 +1,14 @@
+export { default as MarkdownRenderer } from './MarkdownRenderer';
+export { default as MarkdownTextInput } from './MarkdownTextInput';
+export { default as MarkdownToolbar } from './MarkdownToolbar';
+export { useMarkdownEditor } from './useMarkdownEditor';
+export { parseMarkdown, parseMarkdownInline } from './markdownParser';
+export { highlightMarkdown } from './markdownHighlight';
+export type { HighlightSegment, HighlightSegmentType } from './markdownHighlight';
+export { DefaultSegment, DefaultBoldSegment, DefaultHeadingSegment, DefaultItalicSegment, DefaultStrikethroughSegment, DefaultCodeSegment, DefaultCodeBlockSegment, DefaultLinkSegment, DefaultLinkUrlSegment, DefaultImageSegment, DefaultQuoteSegment, DefaultDelimiterSegment, DefaultQuoteMarkerSegment, DefaultListMarkerSegment, DefaultHorizontalRuleSegment, DEFAULT_SEGMENT_COMPONENTS, getDefaultSegmentStyle, } from './markdownSegmentDefaults';
+export type { SegmentComponentProps, SegmentComponentMap } from './markdownSegment.types';
+export { applyMarkdownToolbarAction, DEFAULT_MARKDOWN_FEATURES } from './markdownToolbarActions';
+export { isMarkdownFeatureEnabled, isHeadingLevelEnabled } from './markdownSyntaxUtils';
+export type { MarkdownFeature } from './markdownSyntaxUtils';
+export * from './markdownCore.types';
+//# sourceMappingURL=index.d.ts.map

package/build/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACjE,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AACnE,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAC/D,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AACxD,OAAO,EAAE,aAAa,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AACtE,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AACxD,YAAY,EAAE,gBAAgB,EAAE,oBAAoB,EAAE,MAAM,qBAAqB,CAAC;AAClF,OAAO,EACN,cAAc,EACd,kBAAkB,EAClB,qBAAqB,EACrB,oBAAoB,EACpB,2BAA2B,EAC3B,kBAAkB,EAClB,uBAAuB,EACvB,kBAAkB,EAClB,qBAAqB,EACrB,mBAAmB,EACnB,mBAAmB,EACnB,uBAAuB,EACvB,yBAAyB,EACzB,wBAAwB,EACxB,4BAA4B,EAC5B,0BAA0B,EAC1B,sBAAsB,GACtB,MAAM,2BAA2B,CAAC;AACnC,YAAY,EAAE,qBAAqB,EAAE,mBAAmB,EAAE,MAAM,yBAAyB,CAAC;AAC1F,OAAO,EAAE,0BAA0B,EAAE,yBAAyB,EAAE,MAAM,0BAA0B,CAAC;AACjG,OAAO,EAAE,wBAAwB,EAAE,qBAAqB,EAAE,MAAM,uBAAuB,CAAC;AACxF,YAAY,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAC7D,cAAc,sBAAsB,CAAC"}

package/build/index.js

@@ -0,0 +1,11 @@
+export { default as MarkdownRenderer } from './MarkdownRenderer';
+export { default as MarkdownTextInput } from './MarkdownTextInput';
+export { default as MarkdownToolbar } from './MarkdownToolbar';
+export { useMarkdownEditor } from './useMarkdownEditor';
+export { parseMarkdown, parseMarkdownInline } from './markdownParser';
+export { highlightMarkdown } from './markdownHighlight';
+export { DefaultSegment, DefaultBoldSegment, DefaultHeadingSegment, DefaultItalicSegment, DefaultStrikethroughSegment, DefaultCodeSegment, DefaultCodeBlockSegment, DefaultLinkSegment, DefaultLinkUrlSegment, DefaultImageSegment, DefaultQuoteSegment, DefaultDelimiterSegment, DefaultQuoteMarkerSegment, DefaultListMarkerSegment, DefaultHorizontalRuleSegment, DEFAULT_SEGMENT_COMPONENTS, getDefaultSegmentStyle, } from './markdownSegmentDefaults';
+export { applyMarkdownToolbarAction, DEFAULT_MARKDOWN_FEATURES } from './markdownToolbarActions';
+export { isMarkdownFeatureEnabled, isHeadingLevelEnabled } from './markdownSyntaxUtils';
+export * from './markdownCore.types';
+//# sourceMappingURL=index.js.map

package/build/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACjE,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AACnE,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAC/D,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AACxD,OAAO,EAAE,aAAa,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AACtE,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAExD,OAAO,EACN,cAAc,EACd,kBAAkB,EAClB,qBAAqB,EACrB,oBAAoB,EACpB,2BAA2B,EAC3B,kBAAkB,EAClB,uBAAuB,EACvB,kBAAkB,EAClB,qBAAqB,EACrB,mBAAmB,EACnB,mBAAmB,EACnB,uBAAuB,EACvB,yBAAyB,EACzB,wBAAwB,EACxB,4BAA4B,EAC5B,0BAA0B,EAC1B,sBAAsB,GACtB,MAAM,2BAA2B,CAAC;AAEnC,OAAO,EAAE,0BAA0B,EAAE,yBAAyB,EAAE,MAAM,0BAA0B,CAAC;AACjG,OAAO,EAAE,wBAAwB,EAAE,qBAAqB,EAAE,MAAM,uBAAuB,CAAC;AAExF,cAAc,sBAAsB,CAAC","sourcesContent":["export { default as MarkdownRenderer } from './MarkdownRenderer';\nexport { default as MarkdownTextInput } from './MarkdownTextInput';\nexport { default as MarkdownToolbar } from './MarkdownToolbar';\nexport { useMarkdownEditor } from './useMarkdownEditor';\nexport { parseMarkdown, parseMarkdownInline } from './markdownParser';\nexport { highlightMarkdown } from './markdownHighlight';\nexport type { HighlightSegment, HighlightSegmentType } from './markdownHighlight';\nexport {\n\tDefaultSegment,\n\tDefaultBoldSegment,\n\tDefaultHeadingSegment,\n\tDefaultItalicSegment,\n\tDefaultStrikethroughSegment,\n\tDefaultCodeSegment,\n\tDefaultCodeBlockSegment,\n\tDefaultLinkSegment,\n\tDefaultLinkUrlSegment,\n\tDefaultImageSegment,\n\tDefaultQuoteSegment,\n\tDefaultDelimiterSegment,\n\tDefaultQuoteMarkerSegment,\n\tDefaultListMarkerSegment,\n\tDefaultHorizontalRuleSegment,\n\tDEFAULT_SEGMENT_COMPONENTS,\n\tgetDefaultSegmentStyle,\n} from './markdownSegmentDefaults';\nexport type { SegmentComponentProps, SegmentComponentMap } from './markdownSegment.types';\nexport { applyMarkdownToolbarAction, DEFAULT_MARKDOWN_FEATURES } from './markdownToolbarActions';\nexport { isMarkdownFeatureEnabled, isHeadingLevelEnabled } from './markdownSyntaxUtils';\nexport type { MarkdownFeature } from './markdownSyntaxUtils';\nexport * from './markdownCore.types';\n"]}