@novastera-oss/react-native-markdown-display 8.0.1

package/dist/cjs/index.js

@@ -0,0 +1,164 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.FitImage = exports.MarkdownImage = exports.textStyleProps = exports.removeTextStyleProps = exports.styles = exports.MarkdownIt = exports.tokensToAST = exports.stringToTokens = exports.parser = exports.AstRenderer = exports.renderRules = exports.hasParents = exports.openUrl = exports.getUniqueID = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+/**
+ * Base Markdown component
+ * @author Novastera + contributors
+ */
+const react_1 = __importStar(require("react"));
+const react_native_1 = require("react-native");
+const markdown_it_1 = __importDefault(require("markdown-it"));
+exports.MarkdownIt = markdown_it_1.default;
+const expo_image_1 = require("expo-image");
+Object.defineProperty(exports, "MarkdownImage", { enumerable: true, get: function () { return expo_image_1.Image; } });
+Object.defineProperty(exports, "FitImage", { enumerable: true, get: function () { return expo_image_1.Image; } });
+const parser_1 = __importDefault(require("./lib/parser"));
+exports.parser = parser_1.default;
+const getUniqueID_1 = __importDefault(require("./lib/util/getUniqueID"));
+exports.getUniqueID = getUniqueID_1.default;
+const hasParents_1 = __importDefault(require("./lib/util/hasParents"));
+exports.hasParents = hasParents_1.default;
+const openUrl_1 = __importDefault(require("./lib/util/openUrl"));
+exports.openUrl = openUrl_1.default;
+const tokensToAST_1 = __importDefault(require("./lib/util/tokensToAST"));
+exports.tokensToAST = tokensToAST_1.default;
+const renderRules_1 = __importDefault(require("./lib/renderRules"));
+exports.renderRules = renderRules_1.default;
+const AstRenderer_1 = __importDefault(require("./lib/AstRenderer"));
+exports.AstRenderer = AstRenderer_1.default;
+const removeTextStyleProps_1 = __importDefault(require("./lib/util/removeTextStyleProps"));
+exports.removeTextStyleProps = removeTextStyleProps_1.default;
+const styles_1 = require("./lib/styles");
+Object.defineProperty(exports, "styles", { enumerable: true, get: function () { return styles_1.styles; } });
+const stringToTokens_1 = require("./lib/util/stringToTokens");
+Object.defineProperty(exports, "stringToTokens", { enumerable: true, get: function () { return stringToTokens_1.stringToTokens; } });
+const textStyleProps_1 = __importDefault(require("./lib/data/textStyleProps"));
+exports.textStyleProps = textStyleProps_1.default;
+// we use StyleSheet.flatten here to make sure we have an object, in case someone
+// passes in a StyleSheet.create result to the style prop
+const getStyle = (mergeStyle, style) => {
+    let useStyles = {};
+    const styleRecord = (style !== null && style !== void 0 ? style : {});
+    if (mergeStyle === true && style) {
+        // make sure we get anything user defuned
+        Object.keys(styleRecord).forEach((value) => {
+            const styleEntry = styleRecord[value];
+            useStyles[value] = {
+                ...react_native_1.StyleSheet.flatten(styleEntry !== null && styleEntry !== void 0 ? styleEntry : {}),
+            };
+        });
+        // combine any existing styles
+        Object.keys(styles_1.styles).forEach((value) => {
+            const styleEntry = styleRecord[value];
+            useStyles[value] = {
+                ...styles_1.styles[value],
+                ...react_native_1.StyleSheet.flatten(styleEntry !== null && styleEntry !== void 0 ? styleEntry : {}),
+            };
+        });
+    }
+    else {
+        useStyles = {
+            ...styles_1.styles,
+        };
+        if (style) {
+            Object.keys(styleRecord).forEach((value) => {
+                const styleEntry = styleRecord[value];
+                useStyles[value] = {
+                    ...react_native_1.StyleSheet.flatten(styleEntry !== null && styleEntry !== void 0 ? styleEntry : {}),
+                };
+            });
+        }
+    }
+    Object.keys(useStyles).forEach((value) => {
+        useStyles['_VIEW_SAFE_' + value] = (0, removeTextStyleProps_1.default)(useStyles[value]);
+    });
+    return react_native_1.StyleSheet.create(useStyles);
+};
+const getRenderer = (renderer, rules, style, mergeStyle = true, onLinkPress, maxTopLevelChildren, topLevelMaxExceededItem, allowedImageHandlers, defaultImageHandler, debugPrintTree) => {
+    if (renderer && rules) {
+        console.warn('react-native-markdown-display you are using renderer and rules at the same time. This is not possible, props.rules is ignored');
+    }
+    if (renderer && style) {
+        console.warn('react-native-markdown-display you are using renderer and style at the same time. This is not possible, props.style is ignored');
+    }
+    // these checks are here to prevent extra overhead.
+    if (renderer) {
+        if (typeof renderer === 'function') {
+            return renderer;
+        }
+        if (typeof renderer.render === 'function') {
+            return renderer;
+        }
+        throw new Error('Provided renderer is not compatible with function or AstRenderer. please change');
+    }
+    const useStyles = getStyle(mergeStyle, style);
+    return new AstRenderer_1.default({
+        ...renderRules_1.default,
+        ...(rules || {}),
+    }, useStyles, onLinkPress, maxTopLevelChildren, topLevelMaxExceededItem, allowedImageHandlers, defaultImageHandler, debugPrintTree);
+};
+const Markdown = react_1.default.memo(({ children, renderer, rules, style, mergeStyle = true, markdownit = (0, markdown_it_1.default)({
+    typographer: true,
+}), onLinkPress, maxTopLevelChildren = null, topLevelMaxExceededItem = (0, jsx_runtime_1.jsx)(react_native_1.Text, { children: "..." }, "dotdotdot"), allowedImageHandlers = [
+    'data:image/png;base64',
+    'data:image/gif;base64',
+    'data:image/jpeg;base64',
+    'https://',
+    'http://',
+], defaultImageHandler = 'https://', debugPrintTree = false, }) => {
+    const memoizedRenderer = (0, react_1.useMemo)(() => getRenderer(renderer, rules, style, mergeStyle, onLinkPress, maxTopLevelChildren, topLevelMaxExceededItem, allowedImageHandlers, defaultImageHandler, debugPrintTree), [
+        maxTopLevelChildren,
+        onLinkPress,
+        renderer,
+        rules,
+        style,
+        mergeStyle,
+        topLevelMaxExceededItem,
+        allowedImageHandlers,
+        defaultImageHandler,
+        debugPrintTree,
+    ]);
+    const memoizedParser = (0, react_1.useMemo)(() => markdownit, [markdownit]);
+    const render = typeof memoizedRenderer === 'function'
+        ? memoizedRenderer
+        : memoizedRenderer.render;
+    return (0, parser_1.default)(children, render, memoizedParser);
+});
+exports.default = Markdown;

package/dist/cjs/lib/AstRenderer.js

@@ -0,0 +1,129 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_native_1 = require("react-native");
+const getUniqueID_1 = __importDefault(require("./util/getUniqueID"));
+const convertAdditionalStyles_1 = __importDefault(require("./util/convertAdditionalStyles"));
+const textStyleProps_1 = __importDefault(require("./data/textStyleProps"));
+class AstRenderer {
+    constructor(renderRules, style, onLinkPress, maxTopLevelChildren, topLevelMaxExceededItem, allowedImageHandlers, defaultImageHandler, debugPrintTree) {
+        this.getRenderFunction = (type) => {
+            const renderFunction = this._renderRules[type];
+            if (!renderFunction) {
+                console.warn(`Warning, unknown render rule encountered: ${type}. 'unknown' render rule used (by default, returns null - nothing rendered)`);
+                return this._renderRules.unknown;
+            }
+            return renderFunction;
+        };
+        this.renderNode = (node, parentNodes, isRoot = false) => {
+            var _a, _b;
+            const renderFunction = this.getRenderFunction(node.type);
+            const parents = [...parentNodes];
+            if (this._debugPrintTree === true) {
+                let str = '';
+                for (let a = 0; a < parents.length; a++) {
+                    str = str + '-';
+                }
+                console.log(`${str}${node.type}`);
+            }
+            parents.unshift(node);
+            // calculate the children first
+            let children = node.children.map((value) => {
+                return this.renderNode(value, parents);
+            });
+            // render any special types of nodes that have different renderRule function signatures
+            if (node.type === 'link' || node.type === 'blocklink') {
+                return renderFunction(node, children, parentNodes, this._style, this._onLinkPress);
+            }
+            if (node.type === 'image') {
+                return renderFunction(node, children, parentNodes, this._style, (_a = this._allowedImageHandlers) !== null && _a !== void 0 ? _a : [], (_b = this._defaultImageHandler) !== null && _b !== void 0 ? _b : null);
+            }
+            // We are at the bottom of some tree - grab all the parent styles
+            // this effectively grabs the styles from parents and
+            // applies them in order of priority parent (least) to child (most)
+            // to allow styling global, then lower down things individually
+            // we have to handle list_item seperately here because they have some child
+            // pseudo classes that need the additional style props from parents passed down to them
+            if (children.length === 0 || node.type === 'list_item') {
+                const styleObj = {};
+                for (let a = parentNodes.length - 1; a > -1; a--) {
+                    // grab and additional attributes specified by markdown-it
+                    let refStyle = {};
+                    const styleAttr = parentNodes[a].attributes.style;
+                    if (typeof styleAttr === 'string') {
+                        refStyle = (0, convertAdditionalStyles_1.default)(styleAttr);
+                    }
+                    // combine in specific styles for the object
+                    if (this._style[parentNodes[a].type]) {
+                        refStyle = {
+                            ...refStyle,
+                            ...react_native_1.StyleSheet.flatten(this._style[parentNodes[a].type]),
+                        };
+                        // workaround for list_items and their content cascading down the tree
+                        if (parentNodes[a].type === 'list_item') {
+                            let contentStyle = {};
+                            if (parentNodes[a + 1].type === 'bullet_list') {
+                                contentStyle = this._style
+                                    .bullet_list_content;
+                            }
+                            else if (parentNodes[a + 1].type === 'ordered_list') {
+                                contentStyle = this._style
+                                    .ordered_list_content;
+                            }
+                            refStyle = {
+                                ...refStyle,
+                                ...react_native_1.StyleSheet.flatten(contentStyle),
+                            };
+                        }
+                    }
+                    // then work out if any of them are text styles that should be used in the end.
+                    const arr = Object.keys(refStyle);
+                    for (let b = 0; b < arr.length; b++) {
+                        if (textStyleProps_1.default.includes(arr[b])) {
+                            styleObj[arr[b]] = refStyle[arr[b]];
+                        }
+                    }
+                }
+                const baseRenderFunction = renderFunction;
+                return baseRenderFunction(node, children, parentNodes, this._style, styleObj);
+            }
+            // cull top level children
+            if (isRoot === true &&
+                this._maxTopLevelChildren &&
+                children.length > this._maxTopLevelChildren) {
+                children = children.slice(0, this._maxTopLevelChildren);
+                if (this._topLevelMaxExceededItem) {
+                    children.push(this._topLevelMaxExceededItem);
+                }
+            }
+            // render anythign else that has a normal signature
+            const baseRenderFunction = renderFunction;
+            return baseRenderFunction(node, children, parentNodes, this._style);
+        };
+        this.render = (nodes) => {
+            const root = {
+                type: 'body',
+                sourceType: 'body',
+                key: (0, getUniqueID_1.default)(),
+                content: '',
+                markup: '',
+                tokenIndex: -1,
+                index: 0,
+                attributes: {},
+                children: nodes,
+            };
+            return this.renderNode(root, [], true);
+        };
+        this._renderRules = renderRules;
+        this._style = style;
+        this._onLinkPress = onLinkPress;
+        this._maxTopLevelChildren = maxTopLevelChildren;
+        this._topLevelMaxExceededItem = topLevelMaxExceededItem;
+        this._allowedImageHandlers = allowedImageHandlers;
+        this._defaultImageHandler = defaultImageHandler;
+        this._debugPrintTree = debugPrintTree;
+    }
+}
+exports.default = AstRenderer;

package/dist/cjs/lib/data/textStyleProps.js

@@ -0,0 +1,24 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const textStyleProps = [
+    'textShadowOffset',
+    'color',
+    'fontSize',
+    'fontStyle',
+    'fontWeight',
+    'lineHeight',
+    'textAlign',
+    'textDecorationLine',
+    'textShadowColor',
+    'fontFamily',
+    'textShadowRadius',
+    'includeFontPadding',
+    'textAlignVertical',
+    'fontVariant',
+    'letterSpacing',
+    'textDecorationColor',
+    'textDecorationStyle',
+    'textTransform',
+    'writingDirection',
+];
+exports.default = textStyleProps;

package/dist/cjs/lib/parser.js

@@ -0,0 +1,22 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = parser;
+const tokensToAST_1 = __importDefault(require("./util/tokensToAST"));
+const stringToTokens_1 = require("./util/stringToTokens");
+const cleanupTokens_1 = require("./util/cleanupTokens");
+const groupTextTokens_1 = __importDefault(require("./util/groupTextTokens"));
+const omitListItemParagraph_1 = __importDefault(require("./util/omitListItemParagraph"));
+function parser(source, renderer, markdownIt) {
+    if (Array.isArray(source)) {
+        return renderer(source);
+    }
+    let tokens = (0, stringToTokens_1.stringToTokens)(source, markdownIt);
+    tokens = (0, cleanupTokens_1.cleanupTokens)(tokens);
+    tokens = (0, groupTextTokens_1.default)(tokens);
+    tokens = (0, omitListItemParagraph_1.default)(tokens);
+    const astTree = (0, tokensToAST_1.default)(tokens);
+    return renderer(astTree);
+}

package/dist/cjs/lib/renderRules.js

@@ -0,0 +1,148 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_native_1 = require("react-native");
+const expo_image_1 = require("expo-image");
+const openUrl_1 = __importDefault(require("./util/openUrl"));
+const hasParents_1 = __importDefault(require("./util/hasParents"));
+const textStyleProps_1 = __importDefault(require("./data/textStyleProps"));
+const baseRule = (fn) => fn;
+const linkRule = (fn) => fn;
+const imageRule = (fn) => fn;
+const renderRules = {
+    // when unknown elements are introduced, so it wont break
+    unknown: baseRule(() => null),
+    // The main container
+    body: baseRule((node, children, parent, styles) => ((0, jsx_runtime_1.jsx)(react_native_1.View, { style: styles._VIEW_SAFE_body, children: children }, node.key))),
+    // Headings
+    heading1: baseRule((node, children, parent, styles) => ((0, jsx_runtime_1.jsx)(react_native_1.View, { style: styles._VIEW_SAFE_heading1, children: children }, node.key))),
+    heading2: baseRule((node, children, parent, styles) => ((0, jsx_runtime_1.jsx)(react_native_1.View, { style: styles._VIEW_SAFE_heading2, children: children }, node.key))),
+    heading3: baseRule((node, children, parent, styles) => ((0, jsx_runtime_1.jsx)(react_native_1.View, { style: styles._VIEW_SAFE_heading3, children: children }, node.key))),
+    heading4: baseRule((node, children, parent, styles) => ((0, jsx_runtime_1.jsx)(react_native_1.View, { style: styles._VIEW_SAFE_heading4, children: children }, node.key))),
+    heading5: baseRule((node, children, parent, styles) => ((0, jsx_runtime_1.jsx)(react_native_1.View, { style: styles._VIEW_SAFE_heading5, children: children }, node.key))),
+    heading6: baseRule((node, children, parent, styles) => ((0, jsx_runtime_1.jsx)(react_native_1.View, { style: styles._VIEW_SAFE_heading6, children: children }, node.key))),
+    // Horizontal Rule
+    hr: baseRule((node, children, parent, styles) => ((0, jsx_runtime_1.jsx)(react_native_1.View, { style: styles._VIEW_SAFE_hr }, node.key))),
+    // Emphasis
+    strong: baseRule((node, children, parent, styles) => ((0, jsx_runtime_1.jsx)(react_native_1.Text, { style: styles.strong, children: children }, node.key))),
+    em: baseRule((node, children, parent, styles) => ((0, jsx_runtime_1.jsx)(react_native_1.Text, { style: styles.em, children: children }, node.key))),
+    s: baseRule((node, children, parent, styles) => ((0, jsx_runtime_1.jsx)(react_native_1.Text, { style: styles.s, children: children }, node.key))),
+    // Blockquotes
+    blockquote: baseRule((node, children, parent, styles) => ((0, jsx_runtime_1.jsx)(react_native_1.View, { style: styles._VIEW_SAFE_blockquote, children: children }, node.key))),
+    // Lists
+    bullet_list: baseRule((node, children, parent, styles) => ((0, jsx_runtime_1.jsx)(react_native_1.View, { style: styles._VIEW_SAFE_bullet_list, children: children }, node.key))),
+    ordered_list: baseRule((node, children, parent, styles) => ((0, jsx_runtime_1.jsx)(react_native_1.View, { style: styles._VIEW_SAFE_ordered_list, children: children }, node.key))),
+    // this is a unique and quite annoying render rule because it has
+    // child items that can be styled (the list icon and the list content)
+    // outside of the AST tree so there are some work arounds in the
+    // AST renderer specifically to get the styling right here
+    list_item: baseRule((node, children, parent, styles, inheritedStyles = {}) => {
+        // we need to grab any text specific stuff here that is applied on the list_item style
+        // and apply it onto bullet_list_icon. the AST renderer has some workaround code to make
+        // the content classes apply correctly to the child AST tree items as well
+        // as code that forces the creation of the inheritedStyles object for list_items
+        const refStyle = {
+            ...inheritedStyles,
+            ...react_native_1.StyleSheet.flatten(styles.list_item),
+        };
+        const arr = Object.keys(refStyle);
+        const modifiedInheritedStylesObj = {};
+        for (let b = 0; b < arr.length; b++) {
+            if (textStyleProps_1.default.includes(arr[b])) {
+                modifiedInheritedStylesObj[arr[b]] = refStyle[arr[b]];
+            }
+        }
+        if ((0, hasParents_1.default)(parent, 'bullet_list')) {
+            return ((0, jsx_runtime_1.jsxs)(react_native_1.View, { style: styles._VIEW_SAFE_list_item, children: [(0, jsx_runtime_1.jsx)(react_native_1.Text, { style: [modifiedInheritedStylesObj, styles.bullet_list_icon], accessible: false, children: react_native_1.Platform.select({
+                            android: '\u2022',
+                            ios: '\u00B7',
+                            default: '\u2022',
+                        }) }), (0, jsx_runtime_1.jsx)(react_native_1.View, { style: styles._VIEW_SAFE_bullet_list_content, children: children })] }, node.key));
+        }
+        if ((0, hasParents_1.default)(parent, 'ordered_list')) {
+            const orderedListIndex = parent.findIndex((el) => el.type === 'ordered_list');
+            const orderedList = parent[orderedListIndex];
+            let listItemNumber;
+            if (orderedList.attributes && orderedList.attributes.start) {
+                listItemNumber = orderedList.attributes.start + node.index;
+            }
+            else {
+                listItemNumber = node.index + 1;
+            }
+            return ((0, jsx_runtime_1.jsxs)(react_native_1.View, { style: styles._VIEW_SAFE_list_item, children: [(0, jsx_runtime_1.jsxs)(react_native_1.Text, { style: [modifiedInheritedStylesObj, styles.ordered_list_icon], children: [listItemNumber, node.markup] }), (0, jsx_runtime_1.jsx)(react_native_1.View, { style: styles._VIEW_SAFE_ordered_list_content, children: children })] }, node.key));
+        }
+        // we should not need this, but just in case
+        return ((0, jsx_runtime_1.jsx)(react_native_1.View, { style: styles._VIEW_SAFE_list_item, children: children }, node.key));
+    }),
+    // Code
+    code_inline: baseRule((node, children, parent, styles, inheritedStyles = {}) => ((0, jsx_runtime_1.jsx)(react_native_1.Text, { style: [inheritedStyles, styles.code_inline], children: node.content }, node.key))),
+    code_block: baseRule((node, children, parent, styles, inheritedStyles = {}) => {
+        // we trim new lines off the end of code blocks because the parser sends an extra one.
+        let { content } = node;
+        if (typeof node.content === 'string' &&
+            node.content.charAt(node.content.length - 1) === '\n') {
+            content = node.content.substring(0, node.content.length - 1);
+        }
+        return ((0, jsx_runtime_1.jsx)(react_native_1.Text, { style: [inheritedStyles, styles.code_block], children: content }, node.key));
+    }),
+    fence: baseRule((node, children, parent, styles, inheritedStyles = {}) => {
+        // we trim new lines off the end of code blocks because the parser sends an extra one.
+        let { content } = node;
+        if (typeof node.content === 'string' &&
+            node.content.charAt(node.content.length - 1) === '\n') {
+            content = node.content.substring(0, node.content.length - 1);
+        }
+        return ((0, jsx_runtime_1.jsx)(react_native_1.Text, { style: [inheritedStyles, styles.fence], children: content }, node.key));
+    }),
+    // Tables
+    table: baseRule((node, children, parent, styles) => ((0, jsx_runtime_1.jsx)(react_native_1.View, { style: styles._VIEW_SAFE_table, children: children }, node.key))),
+    thead: baseRule((node, children, parent, styles) => ((0, jsx_runtime_1.jsx)(react_native_1.View, { style: styles._VIEW_SAFE_thead, children: children }, node.key))),
+    tbody: baseRule((node, children, parent, styles) => ((0, jsx_runtime_1.jsx)(react_native_1.View, { style: styles._VIEW_SAFE_tbody, children: children }, node.key))),
+    th: baseRule((node, children, parent, styles) => ((0, jsx_runtime_1.jsx)(react_native_1.View, { style: styles._VIEW_SAFE_th, children: children }, node.key))),
+    tr: baseRule((node, children, parent, styles) => ((0, jsx_runtime_1.jsx)(react_native_1.View, { style: styles._VIEW_SAFE_tr, children: children }, node.key))),
+    td: baseRule((node, children, parent, styles) => ((0, jsx_runtime_1.jsx)(react_native_1.View, { style: styles._VIEW_SAFE_td, children: children }, node.key))),
+    // Links
+    link: linkRule((node, children, parent, styles, onLinkPress) => ((0, jsx_runtime_1.jsx)(react_native_1.Text, { style: styles.link, onPress: () => (0, openUrl_1.default)(node.attributes.href, onLinkPress), children: children }, node.key))),
+    blocklink: linkRule((node, children, parent, styles, onLinkPress) => ((0, jsx_runtime_1.jsx)(react_native_1.TouchableWithoutFeedback, { onPress: () => (0, openUrl_1.default)(node.attributes.href, onLinkPress), style: styles.blocklink, children: (0, jsx_runtime_1.jsx)(react_native_1.View, { style: styles.image, children: children }) }, node.key))),
+    // Images
+    image: imageRule((node, children, parent, styles, allowedImageHandlers, defaultImageHandler) => {
+        const { src, alt } = node.attributes;
+        if (!src) {
+            return null;
+        }
+        // we check that the source starts with at least one of the elements in allowedImageHandlers
+        const show = allowedImageHandlers.filter((value) => {
+            return src.toLowerCase().startsWith(value.toLowerCase());
+        }).length > 0;
+        if (show === false && defaultImageHandler === null) {
+            return null;
+        }
+        const imageUri = show === true ? src : `${defaultImageHandler !== null && defaultImageHandler !== void 0 ? defaultImageHandler : ''}${src}`;
+        const imageProps = {
+            key: node.key,
+            style: styles._VIEW_SAFE_image,
+            source: {
+                uri: imageUri,
+            },
+        };
+        if (alt) {
+            imageProps.accessible = true;
+            imageProps.accessibilityLabel = alt;
+        }
+        return (0, jsx_runtime_1.jsx)(expo_image_1.Image, { ...imageProps });
+    }),
+    // Text Output
+    text: baseRule((node, children, parent, styles, inheritedStyles = {}) => ((0, jsx_runtime_1.jsx)(react_native_1.Text, { style: [inheritedStyles, styles.text], children: node.content }, node.key))),
+    textgroup: baseRule((node, children, parent, styles) => ((0, jsx_runtime_1.jsx)(react_native_1.Text, { style: styles.textgroup, children: children }, node.key))),
+    paragraph: baseRule((node, children, parent, styles) => ((0, jsx_runtime_1.jsx)(react_native_1.View, { style: styles._VIEW_SAFE_paragraph, children: children }, node.key))),
+    hardbreak: baseRule((node, children, parent, styles) => ((0, jsx_runtime_1.jsx)(react_native_1.Text, { style: styles.hardbreak, children: '\n' }, node.key))),
+    softbreak: baseRule((node, children, parent, styles) => ((0, jsx_runtime_1.jsx)(react_native_1.Text, { style: styles.softbreak, children: '\n' }, node.key))),
+    // Believe these are never used but retained for completeness
+    pre: baseRule((node, children, parent, styles) => ((0, jsx_runtime_1.jsx)(react_native_1.View, { style: styles._VIEW_SAFE_pre, children: children }, node.key))),
+    inline: baseRule((node, children, parent, styles) => ((0, jsx_runtime_1.jsx)(react_native_1.Text, { style: styles.inline, children: children }, node.key))),
+    span: baseRule((node, children, parent, styles) => ((0, jsx_runtime_1.jsx)(react_native_1.Text, { style: styles.span, children: children }, node.key))),
+};
+exports.default = renderRules;

package/dist/cjs/lib/styles.js

@@ -0,0 +1,183 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.styles = void 0;
+const react_native_1 = require("react-native");
+// this is converted to a stylesheet internally at run time with StyleSheet.create(
+exports.styles = {
+    // The main container
+    body: {},
+    // Headings
+    heading1: {
+        flexDirection: 'row',
+        fontSize: 32,
+    },
+    heading2: {
+        flexDirection: 'row',
+        fontSize: 24,
+    },
+    heading3: {
+        flexDirection: 'row',
+        fontSize: 18,
+    },
+    heading4: {
+        flexDirection: 'row',
+        fontSize: 16,
+    },
+    heading5: {
+        flexDirection: 'row',
+        fontSize: 13,
+    },
+    heading6: {
+        flexDirection: 'row',
+        fontSize: 11,
+    },
+    // Horizontal Rule
+    hr: {
+        backgroundColor: '#000000',
+        height: 1,
+    },
+    // Emphasis
+    strong: {
+        fontWeight: 'bold',
+    },
+    em: {
+        fontStyle: 'italic',
+    },
+    s: {
+        textDecorationLine: 'line-through',
+    },
+    // Blockquotes
+    blockquote: {
+        backgroundColor: '#F5F5F5',
+        borderColor: '#CCC',
+        borderLeftWidth: 4,
+        marginLeft: 5,
+        paddingHorizontal: 5,
+    },
+    // Lists
+    bullet_list: {},
+    ordered_list: {},
+    list_item: {
+        flexDirection: 'row',
+        justifyContent: 'flex-start',
+    },
+    // @pseudo class, does not have a unique render rule
+    bullet_list_icon: {
+        marginLeft: 10,
+        marginRight: 10,
+    },
+    // @pseudo class, does not have a unique render rule
+    bullet_list_content: {
+        flex: 1,
+    },
+    // @pseudo class, does not have a unique render rule
+    ordered_list_icon: {
+        marginLeft: 10,
+        marginRight: 10,
+    },
+    // @pseudo class, does not have a unique render rule
+    ordered_list_content: {
+        flex: 1,
+    },
+    // Code
+    code_inline: {
+        borderWidth: 1,
+        borderColor: '#CCCCCC',
+        backgroundColor: '#f5f5f5',
+        padding: 10,
+        borderRadius: 4,
+        ...react_native_1.Platform.select({
+            ['ios']: {
+                fontFamily: 'Courier',
+            },
+            ['android']: {
+                fontFamily: 'monospace',
+            },
+        }),
+    },
+    code_block: {
+        borderWidth: 1,
+        borderColor: '#CCCCCC',
+        backgroundColor: '#f5f5f5',
+        padding: 10,
+        borderRadius: 4,
+        ...react_native_1.Platform.select({
+            ['ios']: {
+                fontFamily: 'Courier',
+            },
+            ['android']: {
+                fontFamily: 'monospace',
+            },
+        }),
+    },
+    fence: {
+        borderWidth: 1,
+        borderColor: '#CCCCCC',
+        backgroundColor: '#f5f5f5',
+        padding: 10,
+        borderRadius: 4,
+        ...react_native_1.Platform.select({
+            ['ios']: {
+                fontFamily: 'Courier',
+            },
+            ['android']: {
+                fontFamily: 'monospace',
+            },
+        }),
+    },
+    // Tables
+    table: {
+        borderWidth: 1,
+        borderColor: '#000000',
+        borderRadius: 3,
+    },
+    thead: {},
+    tbody: {},
+    th: {
+        flex: 1,
+        padding: 5,
+    },
+    tr: {
+        borderBottomWidth: 1,
+        borderColor: '#000000',
+        flexDirection: 'row',
+    },
+    td: {
+        flex: 1,
+        padding: 5,
+    },
+    // Links
+    link: {
+        textDecorationLine: 'underline',
+    },
+    blocklink: {
+        flex: 1,
+        borderColor: '#000000',
+        borderBottomWidth: 1,
+    },
+    // Images
+    image: {
+        flex: 1,
+    },
+    // Text Output
+    text: {},
+    textgroup: {},
+    paragraph: {
+        marginTop: 10,
+        marginBottom: 10,
+        flexWrap: 'wrap',
+        flexDirection: 'row',
+        alignItems: 'flex-start',
+        justifyContent: 'flex-start',
+        width: '100%',
+    },
+    hardbreak: {
+        width: '100%',
+        height: 1,
+    },
+    softbreak: {},
+    // Believe these are never used but retained for completeness
+    pre: {},
+    inline: {},
+    span: {},
+};