react-native-nitro-markdown 0.5.4 → 0.5.5

package/src/markdown.tsx

@@ -18,7 +18,6 @@ import {
   type ListRenderItemInfo,
   type FlatListProps,
   type StyleProp,
-  type TextStyle,
   type ViewStyle,
 } from "react-native";
 import {
@@ -101,7 +100,12 @@ function safeOnError<P extends string>(
 }
 
 const baseStylesCache = new WeakMap<MarkdownTheme, BaseStyles>();
-const parseAstCache = new Map<string, MarkdownNode>();
+type ParseAstCacheEntry = {
+  text: string;
+  ast: MarkdownNode;
+};
+
+const parseAstCache = new Map<string, ParseAstCacheEntry>();
 const MAX_PARSE_CACHE_ENTRIES = 32;
 const MAX_CACHEABLE_TEXT_LENGTH = 24_000;
 const EMPTY_RENDERERS: CustomRenderers = {};
@@ -216,15 +220,18 @@ const getCachedParsedAst = (
   }
 
   const cacheKey = `${getParserOptionsKey(options)}|${text.length}|${hashString(text)}`;
-  const cachedNode = parseAstCache.get(cacheKey);
-  if (cachedNode) {
+  const cachedEntry = parseAstCache.get(cacheKey);
+  if (cachedEntry?.text === text) {
     parseAstCache.delete(cacheKey);
-    parseAstCache.set(cacheKey, cachedNode);
-    return cloneMarkdownNode(cachedNode);
+    parseAstCache.set(cacheKey, cachedEntry);
+    return cloneMarkdownNode(cachedEntry.ast);
   }
 
   const parsedNode = parseWithNativeParser(text, options);
-  parseAstCache.set(cacheKey, parsedNode);
+  parseAstCache.set(cacheKey, {
+    text,
+    ast: parsedNode,
+  });
   if (parseAstCache.size > MAX_PARSE_CACHE_ENTRIES) {
     const oldestCacheKey = parseAstCache.keys().next().value;
     if (typeof oldestCacheKey === "string") {
@@ -235,20 +242,27 @@ const getCachedParsedAst = (
   return cloneMarkdownNode(parsedNode);
 };
 
+const sortPluginsByPriority = (
+  plugins?: MarkdownPlugin[],
+): MarkdownPlugin[] | undefined => {
+  if (!plugins || plugins.length === 0) {
+    return undefined;
+  }
+
+  return [...plugins].sort((a, b) => (b.priority ?? 0) - (a.priority ?? 0));
+};
+
 const applyBeforeParsePlugins = (
   markdown: string,
-  plugins?: MarkdownPlugin[],
+  sortedPlugins?: MarkdownPlugin[],
   onError?: (error: Error, phase: "before-plugin", pluginName?: string) => void,
 ): string => {
-  if (!plugins || plugins.length === 0) {
+  if (!sortedPlugins || sortedPlugins.length === 0) {
     return markdown;
   }
 
-  const sorted = [...plugins].sort(
-    (a, b) => (b.priority ?? 0) - (a.priority ?? 0),
-  );
   let nextMarkdown = markdown;
-  for (const plugin of sorted) {
+  for (const plugin of sortedPlugins) {
     if (!plugin.beforeParse) continue;
 
     try {
@@ -271,18 +285,15 @@ const applyBeforeParsePlugins = (
 
 const applyAfterParsePlugins = (
   ast: MarkdownNode,
-  plugins?: MarkdownPlugin[],
+  sortedPlugins?: MarkdownPlugin[],
   onError?: (error: Error, phase: "after-plugin", pluginName?: string) => void,
 ): MarkdownNode => {
-  if (!plugins || plugins.length === 0) {
+  if (!sortedPlugins || sortedPlugins.length === 0) {
     return ast;
   }
 
-  const sorted = [...plugins].sort(
-    (a, b) => (b.priority ?? 0) - (a.priority ?? 0),
-  );
   let nextAst = ast;
-  for (const plugin of sorted) {
+  for (const plugin of sortedPlugins) {
     if (!plugin.afterParse) continue;
 
     try {
@@ -321,6 +332,12 @@ export type MarkdownProps = {
    * When provided, native parse is skipped and this tree is rendered instead.
    */
   sourceAst?: MarkdownNode;
+  /**
+   * Enables internal parse AST cache keyed by parser options and markdown.
+   * Disable to force native parse on each parse cycle.
+   * @default true
+   */
+  parseCache?: boolean;
   /**
    * Optional transform applied after parsing and before rendering.
    * The transformed AST is also returned in `onParseComplete`.
@@ -425,6 +442,7 @@ export const Markdown: FC<MarkdownProps> = ({
   options,
   plugins,
   sourceAst,
+  parseCache = true,
   astTransform,
   renderers = EMPTY_RENDERERS,
   theme: userTheme,
@@ -451,11 +469,10 @@ export const Markdown: FC<MarkdownProps> = ({
 
   const parseResult = useMemo(() => {
     try {
-      const markdownToParse = applyBeforeParsePlugins(
-        children,
-        plugins,
-        onErrorRef.current,
-      );
+      const sortedPlugins = sortPluginsByPriority(plugins);
+      const markdownToParse = sourceAst
+        ? children
+        : applyBeforeParsePlugins(children, sortedPlugins, onErrorRef.current);
       const parserOptions = normalizeParserOptions({
         gfm: parserOptionGfm,
         math: parserOptionMath,
@@ -463,10 +480,12 @@ export const Markdown: FC<MarkdownProps> = ({
       });
       let parsedAst = sourceAst
         ? cloneMarkdownNode(sourceAst)
-        : getCachedParsedAst(markdownToParse, parserOptions);
+        : parseCache
+          ? getCachedParsedAst(markdownToParse, parserOptions)
+          : parseWithNativeParser(markdownToParse, parserOptions);
       parsedAst = applyAfterParsePlugins(
         parsedAst,
-        plugins,
+        sortedPlugins,
         onErrorRef.current,
       );
 
@@ -501,6 +520,7 @@ export const Markdown: FC<MarkdownProps> = ({
     parserOptionMath,
     parserOptionHtml,
     sourceAst,
+    parseCache,
     astTransform,
     plugins,
   ]);
@@ -767,28 +787,24 @@ const NodeRendererComponent: FC<NodeRendererProps> = ({
     }
   }
 
-  const nodeStyleOverride = nodeStyles?.[node.type] as
-    | (ViewStyle & TextStyle)
-    | undefined;
-
   switch (node.type) {
     case "document":
       return (
-        <View style={[baseStyles.document, nodeStyleOverride]}>
+        <View style={[baseStyles.document, nodeStyles?.document]}>
           {renderChildren(node.children, false, false)}
         </View>
       );
 
     case "heading":
       return (
-        <Heading level={node.level ?? 1} style={nodeStyleOverride}>
+        <Heading level={node.level ?? 1} style={nodeStyles?.heading}>
           {renderChildren(node.children, inListItem, true)}
         </Heading>
       );
 
     case "paragraph":
       return (
-        <Paragraph inListItem={inListItem} style={nodeStyleOverride}>
+        <Paragraph inListItem={inListItem} style={nodeStyles?.paragraph}>
           {renderChildren(node.children, inListItem, false)}
         </Paragraph>
       );
@@ -798,33 +814,33 @@ const NodeRendererComponent: FC<NodeRendererProps> = ({
         return <Text>{node.content}</Text>;
       }
       return (
-        <Text style={[baseStyles.text, nodeStyleOverride]}>{node.content}</Text>
+        <Text style={[baseStyles.text, nodeStyles?.text]}>{node.content}</Text>
       );
 
     case "bold":
       return (
-        <Text style={[baseStyles.bold, nodeStyleOverride]}>
+        <Text style={[baseStyles.bold, nodeStyles?.bold]}>
           {renderChildren(node.children, inListItem, true)}
         </Text>
       );
 
     case "italic":
       return (
-        <Text style={[baseStyles.italic, nodeStyleOverride]}>
+        <Text style={[baseStyles.italic, nodeStyles?.italic]}>
           {renderChildren(node.children, inListItem, true)}
         </Text>
       );
 
     case "strikethrough":
       return (
-        <Text style={[baseStyles.strikethrough, nodeStyleOverride]}>
+        <Text style={[baseStyles.strikethrough, nodeStyles?.strikethrough]}>
           {renderChildren(node.children, inListItem, true)}
         </Text>
       );
 
     case "link":
       return (
-        <Link href={node.href ?? ""} style={nodeStyleOverride}>
+        <Link href={node.href ?? ""} style={nodeStyles?.link}>
           {renderChildren(node.children, inListItem, true)}
         </Link>
       );
@@ -836,31 +852,33 @@ const NodeRendererComponent: FC<NodeRendererProps> = ({
           title={node.title}
           alt={node.alt}
           Renderer={NodeRenderer}
-          style={nodeStyleOverride}
+          style={nodeStyles?.image}
         />
       );
 
     case "code_inline":
-      return <InlineCode style={nodeStyleOverride}>{node.content}</InlineCode>;
+      return (
+        <InlineCode style={nodeStyles?.code_inline}>{node.content}</InlineCode>
+      );
 
     case "code_block":
       return (
         <CodeBlock
           language={node.language}
           content={getTextContent(node)}
-          style={nodeStyleOverride}
+          style={nodeStyles?.code_block}
         />
       );
 
     case "blockquote":
       return (
-        <Blockquote style={nodeStyleOverride}>
+        <Blockquote style={nodeStyles?.blockquote}>
           {renderChildren(node.children, inListItem, false)}
         </Blockquote>
       );
 
     case "horizontal_rule":
-      return <HorizontalRule style={nodeStyleOverride} />;
+      return <HorizontalRule style={nodeStyles?.horizontal_rule} />;
 
     case "line_break":
       return <Text>{"\n"}</Text>;
@@ -872,12 +890,17 @@ const NodeRendererComponent: FC<NodeRendererProps> = ({
       let mathContent = getTextContent(node);
       if (!mathContent) return null;
       mathContent = mathContent.replace(/^\$+|\$+$/g, "").trim();
-      return <MathInline content={mathContent} style={nodeStyleOverride} />;
+      return (
+        <MathInline content={mathContent} style={nodeStyles?.math_inline} />
+      );
     }
 
     case "math_block":
       return (
-        <MathBlock content={getTextContent(node)} style={nodeStyleOverride} />
+        <MathBlock
+          content={getTextContent(node)}
+          style={nodeStyles?.math_block}
+        />
       );
 
     case "list":
@@ -886,7 +909,7 @@ const NodeRendererComponent: FC<NodeRendererProps> = ({
           ordered={node.ordered ?? false}
           start={node.start}
           depth={depth}
-          style={nodeStyleOverride}
+          style={nodeStyles?.list}
         >
           {node.children?.map((child, index) => {
             if (child.type === "task_list_item") {
@@ -924,7 +947,10 @@ const NodeRendererComponent: FC<NodeRendererProps> = ({
 
     case "task_list_item":
       return (
-        <TaskListItem checked={node.checked ?? false} style={nodeStyleOverride}>
+        <TaskListItem
+          checked={node.checked ?? false}
+          style={nodeStyles?.task_list_item}
+        >
           {renderChildren(node.children, true, false)}
         </TaskListItem>
       );
@@ -934,7 +960,7 @@ const NodeRendererComponent: FC<NodeRendererProps> = ({
         <TableRenderer
           node={node}
           Renderer={NodeRenderer}
-          style={nodeStyleOverride}
+          style={nodeStyles?.table}
         />
       );
 

package/src/theme.ts

@@ -155,8 +155,6 @@ type TextNodeType =
   | "link"
   | "code_inline"
   | "heading"
-  | "paragraph"
-  | "math_inline"
   | "html_inline";
 type ViewNodeType =
   | "document"
@@ -172,6 +170,8 @@ type ViewNodeType =
   | "table_body"
   | "table_row"
   | "table_cell"
+  | "paragraph"
+  | "math_inline"
   | "math_block"
   | "html_block"
   | "line_break"